增加最新商品页面

+/**
+ *  产品搜索 controller
+ * @author 陈轩 <xuan.chen@yoho.cn>
+ */
+'use strict';
+
+const newModel = require('../models/new');
+
+/* 最新商品 页面 */
+exports.index = (req, res) => {
+    const view = {
+        module: 'product',
+        page: 'new'
+    };
+
+    res.render('new', view);
+};
+
+/* 获取 筛选配置 */
+exports.fetchFilters = (req, res, next) => {
+    const params = Object.assign({
+        uid: req.user.uid,
+        page: 1,
+        order: 1,
+        yh_channel: 'all',
+        channel: 'all',
+    }, req.query);
+
+    newModel.getNewData(params).then(result => {
+        res.json(result);
+    }).catch(next);
+};
+
+/* 查询 产品列表 */
+exports.fetchProducts = (req, res, next) => {
+    const params = Object.assign({
+        uid: req.user.uid,
+        page: 1,
+        order: 1
+    }, req.query);
+
+    newModel.getNewData(params).catch(next);
+};

+const api = global.yoho.API;
+const camelCase = global.yoho.camelCase;
+const prettyFilter = require(`${global.utils}/beautify/filters`);
+const processProductList = require(`${global.utils}/beautify/product`);
+
+/* 查询最新产品列表 */
+exports.getNewData = (params) => {
+    params = Object.assign({
+        method: 'app.search.newProduct',
+    }, params);
+
+    api.post('', params, {
+        cache: true,
+        code: 200
+    }).then(result => {
+        if (result.data) {
+            result.data.productList = processProductList(result.data.productList);
+            result = camelCase(result);
+        }
+
+        return result;
+    });
+};
+
+/* 查询最新产品筛选条件 */
+exports.getNewFilterData = (params) => {
+    params = Object.assign({
+        method: 'app.search.newProduct',
+    }, params);
+
+    api.post('', params, {
+        cache: true,
+        code: 200
+    }).then(result => {
+        let filterConfig = {};
+
+        if (result.data) {
+            prettyFilter(result.data.filter);
+            filterConfig = camelCase(result.data.filter);
+        }
+
+        return {
+            code: result.code,
+            data: filterConfig
+        };
+    });
+};

@@ -17,6 +17,8 @@ const search = require(`${cRoot}/search`);
 router.get('/search', search.index);
 router.get('/search.json', search.fetchProducts); // ajax
 
+router.get('/new', search.index);
+router.get('/new.json', search.fetchProducts);
 
 // 产品 列表页
 const productList = require(`${cRoot}/list`);

+<div id="product-new"></div>

+const Vue = require('yoho-vue');
+const search = require('product/search/index.vue');
+
+new Vue(search);

+<template>
+    <div>
+        <template v-if="productList.length">
+            <Sort :config="sortConfig" :val="sort">
+            </Sort>
+            <List :data="productList"></List>
+        </template>
+        <div class="empty-tip" v-if="empty">
+            <i class="icon icon-search"></i>
+            <p class="empty-tip-cn">未找到相关商品</p>
+            <p class="empty-tip-en">Did not find the relevant goods</p>
+        </div>
+    </div>
+</template>
+<script>
+    const Vue = require('yoho-vue');
+    const lazyload = require('yoho-vue-lazyload');
+    const infinitScroll = require('yoho-vue-infinite-scroll');
+
+    const qs = require('yoho-qs');
+    const bus = require('common/vue-bus');
+    const tip = require('common/tip');
+
+    const sort = require('component/product/sort.vue');
+    const list = require('component/product/list.vue');
+
+    Vue.use(lazyload);
+    Vue.use(infinitScroll);
+
+    require('common/vue-filter');
+
+    module.exports = {
+        el: '#product-new',
+        data: function() {
+            return {
+                sortConfig: global.sortConfig,
+                filterConfig: global.filterConfig,
+
+                // query
+                url: '/product/search.json',
+                sort: null,
+                query: qs.query,
+                page: 0, // 未搜索 page=0; 全部加载完 page = totalPage; 无数据: page !=0 && productList.length=0
+                totalPage: null,
+
+                // 产品列表
+                productList: [],
+
+                // state
+                inSearching: false // 请求中
+            };
+        },
+        computed: {
+            // 无数据
+            empty: function() {
+                return this.page !== 0 && !this.productList.length;
+            }
+        },
+        components: {
+            list,
+            sort
+        },
+        methods: {
+            search: function() {
+                const self = this;
+                const nextPage = this.page + 1;
+
+                if (this.inSearching) {
+                    return;
+                }
+
+                // page = 0, 始终执行搜索
+                if (this.page && nextPage > this.totalPage) {
+                    return;
+                }
+
+                this.inSearching = true;
+                console.log(nextPage);
+                $.get(this.url, {
+                    order: this.sort, // 排序 信息
+                    query: this.query,
+                    page: nextPage
+                })
+                .done(res => {
+                    if (res.code === 200) {
+                        self.page = res.data.page;
+                        self.totalPage = res.data.pageTotal;
+                        self.$set('productList', self.productList.concat(res.data.productList));
+                    }
+                })
+                .fail(() => {
+                    tip('网络出错~');
+                })
+                .always(() => {
+                    self.inSearching = false;
+                });
+            },
+
+            /**
+             *  清空数据（page=0） 重新搜索
+             */
+            research: function() {
+                this.page = 0;
+                this.$set('productList', []);
+                this.search();
+            }
+        },
+        watch: {
+            /* sort 改变 都会触发 重新搜索 */
+            sort: function() {
+                this.research();
+            }
+        },
+
+        created: function() {
+            const self = this;
+
+
+            bus.$on('list.paging', function() {
+                self.search();
+            });
+
+            bus.$on('sort.change', function({
+                val
+            }) {
+                self.sort = val;
+            });
+
+            this.search();
+        }
+    };
+
+</script>
+<style>
+    .empty-tip {
+        margin-top: 380px;
+        color: #b0b0b0;
+        text-align: center;
+        .icon-search {
+            display: inline-block;
+            font-size: 200px;
+            margin-bottom: 56px;
+        }
+    }
+
+    .empty-tip-cn {
+        font-size: 34px;
+        margin-bottom: 30px;
+    }
+
+    .empty-tip-en {
+        font-size: 20px;
+    }
+
+</style>