3d

project.config.json

@@ -73,6 +73,13 @@
                     "pathName": "pagesProduct/Contrast",
                     "scene": null
                 },
+                {
+                    "id": -1,
+                    "name": "筛选产品",
+                    "pathName": "pagesProduct/FilterProduct",
+                    "query": "vendorId=262&categoryIds=38&vendorName=GF加工方案",
+                    "scene": null
+                },
                 {
                     "id": -1,
                     "name": "服务管家",

src/components/Banner.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="banner-content" :style="{ height: `${height * 2}rpx` }">
         <div class="swiperContent" :style="bannerStyle">
-            <swiper :autoplay="autoplay" :style="scale" @change="current = $event.detail.current" :current="current">
+            <swiper :autoplay="autoplay" :style="scale" @change="swiperChange" :current="current">
                 <swiper-item v-for="(item, index) in banners" :key="index">
                     <van-image
                         v-if="checkImg(item.img)"
@@ -13,7 +13,7 @@
                         @click="goDetail"
                     />
                     <div class="video" v-else>
-                        <video class="video-content" :src="item.img"></video>
+                        <video class="video-content" id="swiperVideo" :src="item.img"></video>
                     </div>
                 </swiper-item>
             </swiper>
@@ -124,6 +124,13 @@ export default {
         },
         goDetail() {
             console.log(this.info.url);
+        },
+        swiperChange(e) {
+            const video = wx.createVideoContext('swiperVideo');
+            if (video) {
+                video.pause();
+            }
+            this.current = e.detail.current;
         }
     },
     onPageScroll(e) {

src/components/bar/SearchBarWithValue.vue

@@ -20,6 +20,7 @@
                     placeholder="搜索..."
                     @change="inputChange"
                     @search="submitSearch"
+                    @clear="clearSearch"
                     left-icon="http://imttech.oss-cn-hangzhou.aliyuncs.com/micro/search.png"
                 />
             </div>
@@ -43,7 +44,7 @@ export default {
         },
         dark: {
             type: Boolean,
-            default: true
+            default: false
         },
         isDefault: {
             type: Boolean,
@@ -76,6 +77,7 @@ export default {
                 style.padding = this.menuButtonInfo.top + 'px ' + (15 + this.menuButtonInfo.width) + 'px 15px 15px';
                 style.height = this.menuButtonInfo.height + 'px';
             }
+            style.visibility = 'visible';
             return style;
         },
         searchStyle() {
@@ -119,10 +121,20 @@ export default {
         },
         submitSearch() {
             this.$emit('search');
+        },
+        clearSearch() {
+            this.search = '';
+            this.$emit('input', '');
+            this.submitSearch();
         }
     }
 };
 </script>
+<style lang="less" scoped>
+.navBar {
+    visibility: hidden;
+}
+</style>
 <style lang="less">
 .fixed {
     position: fixed;
@@ -152,7 +164,6 @@ export default {
     }
 }
 .navBar {
-    background-color: @prim;
     display: flex;
     align-items: center;
     .logo {

src/main.js

@@ -117,7 +117,7 @@ export default {
             },
             {
                 root: 'pagesVendor',
-                pages: ['Detail', 'Connect', 'FilterProduct', 'Case']
+                pages: ['Detail', 'Connect', 'FilterProduct', 'Case', 'ProductList']
             }
         ],
         tabBar: {

src/mixins/commont.js

@@ -121,22 +121,22 @@ export default {
             });
         },
         go3D() {
-            // wx.navigateToMiniProgram({
-            //     appId: 'wx44382d983fc116cf',
-            //     path: 'components/pages/webview/index?uid=7b282a24929070b22be6016a3df9261f4f6abc9f',
-            //     extraData: {},
-            //     success(res) {
-            //         // 打开成功
-            //     }
-            // });
             wx.navigateToMiniProgram({
-                appId: 'wx03450d55dcb37448',
-                path: '/pages/Home',
+                appId: 'wx44382d983fc116cf',
+                path: 'components/pages/webview/index?uid=7b282a24929070b22be6016a3df9261f4f6abc9f',
                 extraData: {},
                 success(res) {
                     // 打开成功
                 }
             });
+            // wx.navigateToMiniProgram({
+            //     appId: 'wx03450d55dcb37448',
+            //     path: '/pages/Home',
+            //     extraData: {},
+            //     success(res) {
+            //         // 打开成功
+            //     }
+            // });
         },
         shareInfo() {
             return {

src/pages/Chat.vue

@@ -6,7 +6,7 @@
 </config>
 <template>
     <div>
-        <member :info="systemInfo" type="system" />
+        <member :info="emailInfo" type="system" />
         <member :info="adminInfo" type="admin" />
         <van-divider />
         <block v-for="item in showList" :key="item.otherUserId">
@@ -16,25 +16,25 @@
 </template>
 <script>
 import Member from '../components/Member.vue';
+import { mapState } from 'vuex';
 export default {
     components: { Member },
     data() {
         return {
-            chatMemberlist: [],
-            systemInfo: {},
             adminId: 0
         };
     },
     computed: {
+        ...mapState(['emailInfo', 'messageList']),
         adminInfo() {
             return (
-                [...this.chatMemberlist].find(item => {
+                [...this.messageList].find(item => {
                     return item.otherUserId === this.adminId;
                 }) || { otherUserId: this.adminId }
             );
         },
         showList() {
-            return [...this.chatMemberlist].filter(item => {
+            return [...this.messageList].filter(item => {
                 return item.otherUserId !== this.adminId;
             });
         }
@@ -56,12 +56,7 @@ export default {
     },
     methods: {
         loginMethods() {
-            this.$http.get('/email/my').then(res => {
-                this.systemInfo = res || {};
-            });
-            this.$http.post('/message/my').then(res => {
-                this.chatMemberlist = res;
-            });
+            this.$store.dispatch('getUnreadNumber');
         }
     },
     onShareAppMessage(from, target) {

src/pages/Classify.vue

@@ -124,6 +124,7 @@ export default {
     },
     onShow() {
         this.menuButtonInfo = wx.getMenuButtonBoundingClientRect();
+        this.$store.dispatch('getUnreadNumber');
     },
     onLoad() {
         this.$http

src/pages/Home.vue

@@ -390,6 +390,9 @@ export default {
         });
         this.getData();
     },
+    onShow() {
+        this.$store.dispatch('getUnreadNumber');
+    },
     methods: {
         tabChange(e) {
             console.log(e);

src/pages/My.vue

@@ -142,6 +142,9 @@ export default {
             return this.userInfo ? this.userInfo.nickname : '未登录';
         }
     },
+    onShow() {
+        this.$store.dispatch('getUnreadNumber');
+    },
     components: {
         AuthPhone
     },

src/pagesHome/Edit.vue

@@ -65,14 +65,14 @@
                 :value-class="languageOfCommunication ? '' : 'noValue'"
                 @click="chooseLanguage"
             />
-            <!-- <van-cell
+            <van-cell
                 title="邮箱"
                 :border="false"
                 is-link
                 :value="myInfo.userEmail || '未填写'"
                 :value-class="myInfo.userEmail ? '' : 'noValue'"
-                @click="change('userEmail')"
-            /> -->
+                @click="navigateTo('/pagesMine/ChangeEmail')"
+            />
         </van-cell-group>
 
         <fixed-button>
@@ -125,12 +125,21 @@ export default {
             }
         }
     },
+    onShow() {
+        this.$nextTick(() => {
+            if (this.myInfo.userEmail !== this.userInfo.email) {
+                this.myInfo.userEmail = this.userInfo.email;
+            }
+        });
+    },
     methods: {
         getbase64Data(file) {
             console.log(file);
         },
         loginMethods() {
+            this.$loading('加载中...');
             this.$store.dispatch('getUserInfo').then(res => {
+                this.$loading.close();
                 res.logo = res.logo || this.userInfo.avatar;
                 res.languageOfCommunication = res.languageOfCommunication || '';
                 res.userSex = res.userSex || '';
@@ -215,8 +224,17 @@ export default {
                 return;
             }
 
-            var form = { ...this.myInfo };
+            if (!this.languageOfCommunication) {
+                this.toast('请选择交流语言');
+                return;
+            }
+            if (!this.myInfo.userEmail) {
+                this.toast('请填写邮箱信息');
+                return;
+            }
 
+            var form = { ...this.myInfo };
+            this.$loading('加载中...');
             this.$http
                 .post('/buyersInfo/saveVO', form, {
                     header: {
@@ -224,6 +242,7 @@ export default {
                     }
                 })
                 .then(res => {
+                    this.$loading.close();
                     this.toast('保存成功', 'success');
                     this.$store.dispatch('getUserInfo').then(() => {
                         this.navigateBack();

src/pagesHome/FilterPage.vue

@@ -76,7 +76,6 @@ export default {
     methods: {
         restart() {
             this.categoryIds = '';
-            this.firstCategory = '';
             this.countries = '';
             this.brand = '';
             this.tagIds = '';

src/pagesHome/Product.vue

@@ -10,7 +10,7 @@
 </config>
 <template>
     <div>
-        <search-bar v-model="searchKey" :ratio="1" @search="submitSearch"></search-bar>
+        <search-bar dark v-model="searchKey" :ratio="1" @search="submitSearch"></search-bar>
         <div class="top" :style="{ height: `calc(88rpx + ${barHeight}px)` }">
             <van-sticky :offset-top="barHeight" z-index="100">
                 <div class="tab-content" v-if="firstLevels.length > 0">

src/pagesProduct/Contrast.vue

@@ -63,13 +63,13 @@
             </div>
         </van-dialog>
 
-        <fixed-button>
-            <!-- <van-button
+        <fixed-button btnList>
+            <van-button
                 block
                 :radius="4"
                 @click="navigateTo('/pagesProduct/FilterVendor?categoryIds=' + (category.id || ''))"
                 >添加产品</van-button
-            > -->
+            >
             <van-button block :color="$colors.warn" :radius="4" :disabled="chooseIds.length < 2" @click="compare"
                 >开始对比({{ chooseIds.length }})</van-button
             >
@@ -122,11 +122,9 @@ export default {
         }
     },
     watch: {
-        contrastList() {
-            if (this.contrastList.length > 0) {
-                this.getRelated([...this.contrastList][0].id);
-            } else {
-                this.list = [];
+        category() {
+            if (this.category) {
+                this.getRelated();
             }
         }
     },
@@ -146,6 +144,11 @@ export default {
             this.$store
                 .dispatch('getContrastInfo')
                 .then(() => {
+                    this.$nextTick(() => {
+                        if (this.category) {
+                            this.getRelated();
+                        }
+                    });
                     return this.addContrast(this.productId);
                 })
                 .catch(res => {
@@ -206,14 +209,20 @@ export default {
             }
             this.chooseIds = [...chooseIds];
         },
-        getRelated(id) {
-            this.$http
-                .get('/product/related', {
-                    id: id
-                })
-                .then(res => {
-                    this.list = res;
-                });
+        getRelated() {
+            if (this.category.id) {
+                this.$http
+                    .get('/product/sameCategoryRelated', {
+                        productCategoryId: this.category.id,
+                        page: 0,
+                        size: 5
+                    })
+                    .then(res => {
+                        this.list = res.content;
+                    });
+            } else {
+                this.list = [];
+            }
         },
         chooseAdd(id) {
             this.addContrast(id).then(() => {

src/pagesProduct/Detail.vue

@@ -259,6 +259,7 @@ export default {
     },
     onLoad(options) {
         if (options.id) {
+            this.$loading('加载中...');
             this.productId = options.id;
             this.$http
                 .get(`/product/getDto/${options.id}`)
@@ -280,6 +281,7 @@ export default {
                     return this.$http.get('/vendorInfo/getHome/' + res.vendorInfoId);
                 })
                 .then(res => {
+                    this.$loading.close();
                     this.vendorInfo = res;
 
                     wx.getSystemInfo({

src/pagesProduct/FilterProduct.vue

@@ -16,7 +16,7 @@
                 :hasCheck="false"
             ></product-row>
         </div>
-        <van-empty v-else description="商品已在对比列表中或无商品" />
+        <van-empty v-else-if="!loading && finish" description="商品已在对比列表中或无商品" />
     </div>
 </template>
 <script>
@@ -28,7 +28,10 @@ export default {
             categoryIds: '',
             vendorId: '',
             list: [],
-            category: null
+            category: null,
+            page: 0,
+            empty: '',
+            loading: false
         };
     },
     onLoad(options) {
@@ -64,24 +67,29 @@ export default {
     },
     methods: {
         getList() {
+            this.$loading('加载中');
+            this.loading = true;
             this.$http
-                .post(
-                    '/product/all',
-                    {
-                        query: {
-                            productCategoryId: this.categoryIds,
-                            vendorInfoId: this.vendorId,
-                            deviceStatus: 'NOW_ON_SHELF'
-                        }
-                    },
-                    {
-                        header: {
-                            'Content-Type': 'application/json'
-                        }
-                    }
-                )
+                .post('/product/show', {
+                    categoryIds: this.categoryIds || '',
+                    productSort: 'COMPOSITE',
+                    page: this.page,
+                    size: 20,
+                    query: JSON.stringify({
+                        vendorInfoId: this.vendorId
+                    })
+                })
                 .then(res => {
-                    this.list = res.content;
+                    this.$loading.close();
+                    this.loading = false;
+                    if (res.first) {
+                        this.list = res.content;
+                    } else {
+                        this.list = [...this.list, ...res.content];
+                    }
+                    this.finish = res.last;
+
+                    this.empty = res.empty;
                 });
         },
         addContrast(productId) {
@@ -105,6 +113,12 @@ export default {
     },
     components: {
         ProductRow
+    },
+    onReachBottom() {
+        if (!this.loading && !this.finish) {
+            this.page++;
+            this.getList();
+        }
     }
 };
 </script>

src/pagesProduct/FilterVendor.vue

@@ -98,16 +98,23 @@ export default {
     },
     methods: {
         getList() {
-            this.$http.get('/vendorInfo/allList').then(res => {
-                this.list = res.map(item => {
-                    return {
-                        ...item,
-                        name: this.getName(item, ['chCompanyName', 'enCompanyName']),
-                        first: cnchar.spell(this.getName(item, ['chCompanyName', 'enCompanyName'], 'first', 'up'))
-                    };
+            this.$http
+                .post('/vendorInfo/show', {
+                    page: 0,
+                    size: 100,
+                    categoryIds: this.categoryIds || '',
+                    vendorSort: 'COMPOSITE'
+                })
+                .then(res => {
+                    this.list = res.content.map(item => {
+                        return {
+                            ...item,
+                            name: this.getName(item, ['chCompanyName', 'enCompanyName']),
+                            first: cnchar.spell(this.getName(item, ['chCompanyName', 'enCompanyName'], 'first', 'up'))
+                        };
+                    });
+                    console.log(this.list);
                 });
-                console.log(this.list);
-            });
         }
     }
 };

src/pagesVendor/Detail.vue

@@ -15,7 +15,7 @@
 <template>
     <div>
         <div :style="{ height: barHeight + 'px' }">
-            <search-bar v-model="searchKey" :ratio="ratio" @search="submitSearch"> </search-bar>
+            <search-bar v-model="searchKey" dark :ratio="ratio" @search="submitSearch"> </search-bar>
         </div>
         <div class="fixed-top" :style="{ top: barHeight + 'px' }"></div>
         <scroll-view
@@ -116,7 +116,7 @@ export default {
         submitSearch(e) {
             console.log(this.searchKey);
             this.navigateTo(
-                '/pagesHome/ProductList?vendorId=' + this.vendorInfo.id + '&search=' + this.searchKey,
+                '/pagesVendor/ProductList?vendorId=' + this.vendorInfo.id + '&search=' + this.searchKey,
                 false
             );
         },

src/pagesVendor/ProductList.vue

@@ -0,0 +1,207 @@
+<config>
+{
+'navigationBarTitleText': '',
+'navigationStyle':'custom',
+'navigationBarTextStyle':'black',
+'backgroundColorBottom': '#f5f7fa',
+'backgroundColorTop': '#fff',
+}
+</config>
+<template>
+    <div>
+        <div :style="{ height: barHeight + 'px' }">
+            <search-bar v-model="searchKey" :dark="false" :ratio="ratio" @search="submitSearch"></search-bar>
+        </div>
+        <div class="main" id="main">
+            <van-sticky :container="main" :offset-top="barHeight">
+                <filter-sort-bar
+                    :sort="sort"
+                    :showType="showType"
+                    @showFilter="showFilter"
+                    @changeSort="changeSort"
+                    @changeShowType="changeShowType"
+                >
+                    <span slot="filter1">
+                        <product-category-filter
+                            size="small"
+                            v-model="categoryIds"
+                            @input="refreash"
+                        ></product-category-filter>
+                    </span>
+                    <span slot="filter2">
+                        <country-filter
+                            size="small"
+                            v-model="continent"
+                            :country.sync="countries"
+                            @input="refreash"
+                        ></country-filter>
+                    </span>
+                    <span slot="filter3">
+                        <product-brand-filter size="small" v-model="brand" @input="refreash"></product-brand-filter>
+                    </span>
+                </filter-sort-bar>
+            </van-sticky>
+
+            <sort-list :empty="empty" emptyText="敬请期待" :loading="loading" :finish="finish" top="172rpx">
+                <div class="product-list" v-if="showType === 'grid'">
+                    <div class="clo-2" v-for="item in list" :key="item.id">
+                        <product-grid :info="item"></product-grid>
+                    </div>
+                </div>
+                <div class="product-list2" v-else>
+                    <product-row v-for="item in list" :key="item.id" :info="item"></product-row>
+                </div>
+            </sort-list>
+        </div>
+    </div>
+</template>
+<script>
+import SearchBar from '../components/bar/SearchBarWithValue';
+import searchList from '../mixins/searchList';
+import FilterSortBar from '../components/bar/FilterSortBar';
+import SortList from '../components/SortList';
+import ProductGrid from '../components/product/GridNormal';
+import ProductBrandFilter from '../components/filter/ProductBrand';
+import ProductCategoryFilter from '../components/filter/ProductCategory';
+import CountryFilter from '../components/filter/Country';
+import ProductRow from '../components/product/RowNormal.vue';
+import { mapState } from 'vuex';
+export default {
+    data() {
+        return {
+            banners: [],
+            categoryIds: '',
+            countries: '',
+            continent: '',
+            brand: '',
+            url: '/product/show',
+            tagIds: '',
+            applicationField: '',
+            main: null,
+            ratio: 1,
+            vendorInfoId: '',
+            defaultCategoryId: ''
+        };
+    },
+    mixins: [searchList],
+    computed: {
+        ...mapState(['barTop', 'barHeight']),
+        firstLevels() {
+            const list = [...this.productCategories];
+            return list.filter(item => {
+                return !item.parentId;
+            });
+        },
+        listQuery() {
+            return {
+                productSort: this.sort,
+                categoryIds: this.categoryIds || '',
+                countries: this.countries,
+                tagIds: this.tagIds,
+                applicationField: this.applicationField,
+                query: JSON.stringify({
+                    vendorInfoId: this.vendorInfoId
+                })
+            };
+        },
+        filterQuery() {
+            return {
+                pageType: 'product',
+                categoryIds: this.categoryIds,
+                countries: this.countries,
+                continent: this.continent,
+                searchTop: this.searchTop,
+                tagIds: this.tagIds,
+                applicationField: this.applicationField,
+                brand: this.brand
+            };
+        }
+    },
+    onLoad(options) {
+        console.log(options);
+        if (options.categoryIds) {
+            this.categoryIds = options.categoryIds;
+        }
+        // if (options.defaultCategoryId) {
+        //     this.defaultCategoryId = options.defaultCategoryId;
+        // }
+        if (options.applicationField) {
+            this.applicationField = options.applicationField;
+        }
+        if (options.search) {
+            this.search = options.search;
+            this.searchKey = options.search;
+        }
+        if (options.vendorId) {
+            this.vendorInfoId = options.vendorId;
+        }
+        this.getData();
+    },
+    onReachBottom() {
+        if (!this.loading && !this.finish) {
+            this.page++;
+            this.getData();
+        }
+    },
+    components: {
+        FilterSortBar,
+        SortList,
+        ProductGrid,
+        ProductBrandFilter,
+        ProductCategoryFilter,
+        CountryFilter,
+        SearchBar,
+        ProductRow
+    }
+    // watch: {
+    //     defaultCategoryId() {
+    //         this.categoryIds = '';
+    //         this.$nextTick(() => {
+    //             this.refreash();
+    //         });
+    //     }
+    // }
+};
+</script>
+
+<style lang="less">
+.tab-content {
+    background: @prim;
+    .van-tabs__scroll {
+        background: @prim;
+        .van-tab {
+            color: #fff;
+            &.van-tab--active {
+                color: @warn;
+            }
+        }
+
+        .van-tabs__line {
+            bottom: 8px;
+            left: 7.5px;
+        }
+    }
+}
+
+.banner-box {
+    padding: 16px 16px 4px;
+}
+.top {
+    height: 44px;
+}
+
+.product-list {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 0 10px;
+    .clo-2 {
+        width: 50%;
+        padding: 6px;
+        box-sizing: border-box;
+    }
+}
+
+.product-list2 {
+    padding: 10px 16px;
+}
+</style>

src/store/index.js

@@ -20,6 +20,8 @@ export default new Vuex.Store({
         barTop: 0,
         areaList: [],
         userMoreInfo: {},
+        emailInfo: {},
+        messageList: [],
         chatForm:
             '{"phone":"13365135976","sex":"male","nickname":"蒋耀忠","position":"总经理","chCompanyName":"NE洛阳新能轴承制造有限公司","email":"11@qq.com.cn","products":[{"chName":"MS22-8多轴数控机床","enName":"MultiLine MS22-8","id":6296,"mainPicture":"https://imt.oss-cn-hangzhou.aliyuncs.com/image/2020-11-26-18-08-34MaKXCzxH.png"}]}'
     },
@@ -71,6 +73,12 @@ export default new Vuex.Store({
         },
         updateAreaList(state, areaList) {
             state.areaList = areaList;
+        },
+        setEmailInfo(state, emailInfo) {
+            state.emailInfo = emailInfo;
+        },
+        setMessageList(state, messageList) {
+            state.messageList = messageList;
         }
     },
     actions: {
@@ -143,9 +151,49 @@ export default new Vuex.Store({
         },
         getArea(context) {
             http.http.get('https://imttech.oss-cn-hangzhou.aliyuncs.com/utils/area.json').then(res => {
-                console.log(res);
                 context.commit('updateAreaList', res);
             });
+        },
+        getUnreadNumber(context) {
+            let unreadNumber = 0;
+            Promise.all([
+                http.http
+                    .get('/email/my')
+                    .then(res => {
+                        context.commit('setEmailInfo', res || {});
+                        if (res.unreadNumber) {
+                            unreadNumber += Number(res.unreadNumber);
+                        }
+                        return Promise.resolve();
+                    })
+                    .catch(e => {
+                        return Promise.resolve();
+                    }),
+                http.http
+                    .post('/message/my')
+                    .then(res => {
+                        context.commit('setMessageList', res || []);
+                        res.forEach(child => {
+                            if (child.unreadNumber) {
+                                unreadNumber += Number(child.unreadNumber);
+                            }
+                        });
+                        return Promise.resolve();
+                    })
+                    .catch(e => {
+                        return Promise.resolve();
+                    })
+            ]).then(() => {
+                if (unreadNumber) {
+                    wx.showTabBarRedDot({
+                        index: 2
+                    });
+                } else {
+                    wx.removeTabBarBadge({
+                        index: 2
+                    });
+                }
+            });
         }
     }
 });