fe / yoho-community-web · Commits

Go to a project

Authored by TaoHuang
Commit 6764aea887c09360e543ee813ea0eb8aab3b519c 2 parents 759ddf3d 36bbd4b9

Merge remote-tracking branch 'origin/master'

Inline Side-by-side
Showing 25 changed files with 116 additions and 95 deletions
... ... @@ -65,7 +65,7 @@ const request = async({url, method, reqParams = {}, context}) => {
}
};
const catchError = (context, reqParams) => {
const catchCode = (context, reqParams) => {
return result => {
if (result && result.code === 500) {
createReport(context, 'api')(Object.assign({
... ... @@ -76,13 +76,22 @@ const catchError = (context, reqParams) => {
};
};
export const createApi = context => {
const catchError = (context, store) => {
return error => {
if (error.code === 401) {
store.commit('SET_NEED_LOGIN', {needLogin: true});
}
return Promise.resolve();
};
};
export const createApi = (context, store) => {
return {
get(url, reqParams = {}) {
return request({url, method: 'get', reqParams, context}).then(catchError(context, reqParams));
return request({url, method: 'get', reqParams, context}).then(catchCode(context, reqParams)).catch(catchError(context, store));
},
post(url, reqParams = {}) {
return request({url, method: 'post', reqParams, context}).then(catchError(context, reqParams));
return request({url, method: 'post', reqParams, context}).then(catchCode(context, reqParams)).catch(catchError(context, store));
}
};
};
... ...
... ... @@ -8,4 +8,5 @@ var login = new Login({loginUrl: loginUrl, env: env});
export default {
goLogin: login.goLogin.bind(login),
getUser: Base.getUser.bind(Base)
};
... ...
... ... @@ -156,12 +156,12 @@ export default {
}
},
getItems(reload) {
if (reload) {
this.list = [];
this.items = [];
}
this.loadings.push('pending');
this.onFetch().then((res) => {
if (reload) {
this.list = [];
this.items = [];
}
/* istanbul ignore if */
if (!res) {
this.noMore = true;
... ...
const config = {
development: {
axiosBaseUrl: '/mapp',
axiosBaseUrl: '/grass',
axiosResponseType: 'json',
reportUrl: '//badjs.yoho.cn/apm/yas2.gif'
},
production: {
axiosBaseUrl: '/mapp',
axiosBaseUrl: '/grass',
axiosResponseType: 'json',
reportUrl: '//badjs.yoho.cn/apm/yas2.gif'
}
... ...
... ... @@ -34,7 +34,7 @@ Vue.prop('auth', function() {
return false;
}
return true
return true;
});
Vue.use(Prompt);
Vue.use(Toast);
... ... @@ -43,13 +43,6 @@ Vue.use(ActionSheet);
Vue.prop('api', createApi(context, store));
Vue.use(Lazy, {error: ''});
const fetchAsycData = (matched, r) => {
const asyncDataPromises = matched
.map(({asyncData}) => asyncData && asyncData({store, router: r})).
filter(p => p);
return Promise.all(asyncDataPromises);
};
const trackPage = (path) => {
if (window._hmt) {
... ... @@ -73,15 +66,9 @@ router.onReady(() => {
}
});
if (isDegrade) {
fetchAsycData(router.getMatchedComponents(), router.currentRoute);
}
router.beforeResolve((to, from, next) => {
try {
trackPage(to.fullPath);
const matched = router.getMatchedComponents(to);
store.commit(ROUTE_CHANGE, {to, from});
store.dispatch('reportYas', {
... ... @@ -94,14 +81,7 @@ router.onReady(() => {
}
}
});
fetchAsycData(matched, to)
.then(next)
.catch(e => {
store.dispatch('reportError', {error: e});
console.error(e);
return next();
});
return next();
} catch (e) {
store.dispatch('reportError', {error: e});
return next();
... ...
... ... @@ -30,26 +30,10 @@ export default context => {
if (!matched.length) {
return reject({code: 404, message: ''});
}
const asyncDataPromises = matched.map(({asyncData}) => {
try {
return asyncData && asyncData({store, router: router.currentRoute});
} catch (error) {
return Promise.reject(error);
}
}).filter(p => p);
Promise.all(asyncDataPromises)
.then(() => {
context.state = store.state;
return resolve(app);
}).catch(e => {
reportError(e);
if (e.code === 401) {
store.commit('SET_NEED_LOGIN', {needLogin: true});
}
context.state = store.state;
return resolve(app);
});
context.rendered = () => {
context.state = store.state;
};
return resolve(app);
});
router.onError(e => {
... ...
... ... @@ -20,6 +20,15 @@ export default {
type: ''
};
},
serverPrefetch() {
return this.fetchArticleList({
articleId: this.$route.params.id,
page: this.page,
authorUid: this.authorUid,
authorType: this.authorType,
type: this.type
});
},
created() {
this.id = this.$route.params.id;
this.authorUid = this.$route.query.authorUid;
... ...
<template>
<div class="article-item-header">
<router-link class="avatar" :to="`/author/${data.authorType}/${data.authorUid}`">
<router-link class="avatar" :to="`/grass/author/${data.authorType}/${data.authorUid}`">
<WidgetAvatar :lazy="lazy" class="widget-avatar" :src="data.authorHeadIco" :width="70" :height="70"></WidgetAvatar>
<span class="name">{{data.authorName}}</span>
</router-link>
... ...
... ... @@ -83,8 +83,10 @@ export default {
},
},
mounted() {
this.introCollapseHeight = this.$refs.intro.scrollHeight;
this.resizeDebounce = debounce(this.resizeScroll, 220);
if (this.$refs.intro) {
this.introCollapseHeight = this.$refs.intro.scrollHeight;
this.resizeDebounce = debounce(this.resizeScroll, 220);
}
},
methods: {
onTopic({labelId}) {
... ...
<template>
<div class="article-item-header">
<router-link class="avatar" :to="`/author/${data.authorType}/${data.authorUid}`">
<router-link class="avatar" :to="`/grass/author/${data.authorType}/${data.authorUid}`">
<WidgetAvatar class="widget-avatar" :src="data.avatar" :width="70" :height="70"></WidgetAvatar>
<span class="name">{{data.name}}</span>
</router-link>
... ...
export default [{
path: '/article/:id',
name: 'article',
alias: '/article/:id',
component: () => import(/* webpackChunkName: "article" */ './article'),
meta: {
keepAlive: true
}
}, {
path: '/topic/:labelId',
alias: '/topic/:labelId',
name: 'topic',
component: () => import(/* webpackChunkName: "article" */ './topic'),
meta: {
... ... @@ -14,6 +16,7 @@ export default [{
}
}, {
path: '/article/:articleId/comment',
alias: '/article/:articleId/comment',
name: 'article.comment',
component: () => import(/* webpackChunkName: "article" */ './article-comment'),
}];
... ...
export default [{
path: '/mapp/error/404',
path: '/error/404',
name: 'error.404',
component: () => import(/* webpackChunkName: "error" */ './404')
}, {
path: '/mapp/error/500',
path: '/error/500',
name: 'error.500',
component: () => import(/* webpackChunkName: "error" */ './500')
}];
... ...
import Article from './article';
import Common from './common';
import Fashion from './fashion';
import ShowOrder from './showorder';
import Sneaker from './sneaker';
import UserPage from './userpage';
export default [...Article, ...Fashion, ...ShowOrder, ...Sneaker, ...UserPage, ...Common];
export default [...Article, ...UserPage, ...Common];
... ...
export default [{
path: '/mapp/showorder/:id',
path: '/grass/showorder/:id',
name: 'showorder',
component: () => import(/* webpackChunkName: "order" */ '../article/components/detail/article-detail')
... ...
... ... @@ -54,7 +54,7 @@
<FavTabBlock :tabs-num="tabsNum" :active-index="activeIndex" @change="changeTab"></FavTabBlock>
</cube-sticky-ele>
<div class="contant-list">
<WaterFall class="pannel-wrap" :list="list" :pos="scrollY" :type="waterFallType"></WaterFall>
<WaterFall class="pannel-wrap" :list="list" :pos="scrollY" :link-tpl="linkTpl"></WaterFall>
</div>
<div v-if="loadStatus" class="loading">
... ... @@ -100,6 +100,21 @@
if (!this.$route.params.id) {
this._apiNamePre += 'Mine';
try {
this.$sdk.getUser().then(res => {
if (get(res, 'uid') > 0) {
this.$route.params.id = res.uid;
this.autherInfo = assign({}, this.autherInfo, {
authorUid: res.uid
});
} else {
this.$sdk.goLogin();
}
});
} catch(e){
console.log(e);
}
}
this.autherInfo = {
... ... @@ -164,6 +179,9 @@
list() {
return get(this.fetchInfo, `${this.activeIndex}.list`) || [];
},
linkTpl() {
return `/grass/article/{articleId}?authorUid=${this.autherInfo.authorUid}&authorType=${this.autherInfo.authorType}&type=${['publish', 'fav'][this.activeIndex]}`;
},
waterFallType() {
return ['publish', 'fav'][this.activeIndex];
}
... ...
... ... @@ -9,7 +9,7 @@
<div class="wf-item-mid">
<router-link :to="link(i)">
<div class="layer-image" :style="{'height': i.coverHeight + 'px'}">
<ImageFormat v-if="!i._temporary" :src="i[srcKey]" :width="coverImageWidth" :height="i.coverHeight"></ImageFormat>
<ImageFormat v-if="!i._temporary" :mode="1" :src="i[srcKey]" :width="coverImageWidth" :height="i.coverHeight"></ImageFormat>
</div>
<div class="description">
<p>{{i.content}}</p>
... ... @@ -35,6 +35,7 @@
<script>
import {assign, get, forEach} from 'lodash';
import {getArticleImageSize} from 'utils/image-handler';
export default {
data() {
... ... @@ -70,10 +71,7 @@ export default {
type: Number,
default: 2
},
type: {
type: String,
default: 14
}
linkTpl: String
},
mounted() {
this.$on('calced', (nlist) => {
... ... @@ -124,6 +122,12 @@ export default {
for (let i = this.calcIndex; i < this.list.length; i++) {
let item = this.list[i];
let {width, height} = getArticleImageSize({
width: item.imageWidth,
height: item.imageHeight
});
item = assign(item, {imageWidth: width, imageHeight: height});
item.coverHeight = Math.floor(item.imageHeight / item.imageWidth * this.coverImageWidth);
nlist.push(assign({_temporary: true}, item));
... ... @@ -280,7 +284,7 @@ export default {
}
},
link(item) {
return `/article/${item.articleId}?authorUid=${item.authorUid}&authorType=${item.authorType}&type=${this.type}`;
return (this.linkTpl || '').replace('{articleId}', item.articleId);
}
}
};
... ...
export default [{
path: '/author/:type/:id',
alias: '/author/:type/:id',
name: 'author',
component: () => import(/* webpackChunkName: "author" */ './author')
component: () => import(/* webpackChunkName: "author" */ './author'),
meta: {
keepAlive: true
}
},
{
path: '/author/mine',
alias: '/author/mine',
name: 'author.mine',
component: () => import(/* webpackChunkName: "author" */ './author')
component: () => import(/* webpackChunkName: "author" */ './author'),
meta: {
keepAlive: true
}
}];
... ...
import Vue from 'vue';
import Router from 'vue-router';
import routes from '../pages';
import pages from '../pages';
Vue.use(Router);
export function createRouter() {
const routes = pages.map(page => {
const route = Object.assign({}, page);
route.path = `/grass${page.path}`;
return route;
});
console.log(routes)
const route = new Router({
mode: 'history',
routes,
... ...
... ... @@ -4,7 +4,7 @@ import * as guangProcess from './guangProcess';
export default {
async fetchArticleList({ commit }, { articleId, authorUid, authorType, type, limit = 5, page = 1 }) {
commit(Types.FETCH_ARTICLE_LIST_REQUEST);
commit(Types.FETCH_ARTICLE_LIST_REQUEST, {refresh: page === 1});
let api;
if (type === 'fav') {
... ... @@ -29,7 +29,6 @@ export default {
}
commit(Types.FETCH_ARTICLE_LIST_SUCCESS, {
data: result.data.detailList,
page
});
} else {
commit(Types.FETCH_ARTICLE_LIST_FAILD);
... ...
... ... @@ -3,14 +3,14 @@ import {getArticleImageSize} from 'utils/image-handler';
import { get, first } from 'lodash';
export default {
[Types.FETCH_ARTICLE_LIST_REQUEST](state) {
[Types.FETCH_ARTICLE_LIST_REQUEST](state, {refresh}) {
state.fetchArticleList = true;
},
[Types.FETCH_ARTICLE_LIST_SUCCESS](state, {data, page}) {
state.fetchArticleList = false;
if (page === 1) {
if (refresh) {
state.articleList = [];
}
},
[Types.FETCH_ARTICLE_LIST_SUCCESS](state, {data}) {
state.fetchArticleList = false;
state.articleList = state.articleList.concat(data);
state.articleList.forEach((item, index) => {
... ...
... ... @@ -2,10 +2,6 @@ export const FETCH_ARTICLE_LIST_REQUEST = 'FETCH_ARTICLE_LIST_REQUEST';
export const FETCH_ARTICLE_LIST_FAILD = 'FETCH_ARTICLE_LIST_FAILD';
export const FETCH_ARTICLE_LIST_SUCCESS = 'FETCH_ARTICLE_LIST_SUCCESS';
export const FETCH_ARTICLE_MINE_LIST_REQUEST = 'FETCH_ARTICLE_MINE_LIST_REQUEST';
export const FETCH_ARTICLE_MINE_LIST_FAILD = 'FETCH_ARTICLE_MINE_LIST_FAILD';
export const FETCH_ARTICLE_MINE_LIST_SUCCESS = 'FETCH_ARTICLE_MINE_LIST_SUCCESS';
export const FETCH_ARTICLE_PRODUCT_SUCCESS = 'FETCH_ARTICLE_PRODUCT_SUCCESS';
export const FETCH_GUANG_REQUEST = 'FETCH_GUANG_REQUEST';
... ...
import Vue from 'vue';
export default (store) => {
setTimeout(() => {
if (process.env.VUE_ENV !== 'server') {
... ... @@ -22,6 +24,10 @@ export default (store) => {
window.addEventListener('test', null, opts);
} catch (e) {} //eslint-disable-line
store.commit('SET_SUPPORT_PASSIVE', {supportsPassive});
Vue.$sdk.getUser().then(user => {
console.log(user)
})
}
}, 0);
};
... ...
... ... @@ -31,19 +31,15 @@ export default function() {
mutations: {
[Types.SET_ENV](state, {context}) {
state.context.title = context.title;
state.context.env = context.env;
state.context.route = context.route;
state.context.path = context.path;
state.context.isLogin = context.user.uid > 1;
},
[Types.SET_TITLE](state, {title}) {
state.context.title = title;
},
[Types.ROUTE_CHANGE](state, {to}) {
const routeIndex = state.historys.findIndex(route => route.path === to.fullPath);
if (routeIndex >= 0) {
state.historys = state.historys.slice(0, routeIndex + 1);
if (state.historys.length >= 2 && state.historys[state.historys.length - 2].path === to.fullPath) {
state.historys.pop();
state.direction = 'back';
} else {
state.historys.push({
... ... @@ -52,6 +48,7 @@ export default function() {
});
state.direction = 'forword';
}
console.log(state.direction)
state.homePage = state.historys.length <= 1;
},
[Types.SET_NEED_LOGIN](state, {needLogin}) {
... ...
... ... @@ -35,7 +35,7 @@ exports.createApp = async(app) => {
});
}
app.use('/mapp/node/status.html', (req, res) => {
app.use('/grass/node/status.html', (req, res) => {
res.status(200).end();
});
... ... @@ -85,8 +85,8 @@ exports.createApp = async(app) => {
// YOHO 前置中间件
app.use(setYohoDataMiddleware);
app.use(userMiddleware);
app.get('/mapp/getToken', qiniuMiddleware.getToken);
app.use('/mapp', ssrApiMiddleware);
app.get('/grass/getToken', qiniuMiddleware.getToken);
app.use('/grass', ssrApiMiddleware);
app.use(ssrRouteMiddleware.routers);
... ...
... ... @@ -55,9 +55,9 @@ const getContext = (req) => {
const handlerError = (err = {}, req, res, next) => {
if (err.code === 404) {
return res.redirect('/error/404');
return res.redirect('/grass/error/404');
} else if (err.code === 500) {
return res.redirect('/error/500');
return res.redirect('/grass/error/500');
}
return next(err);
};
... ...