搜索页：商家logo

htmldev/cps/README.md

@@ -24,9 +24,10 @@ npm run lint
 See [Configuration Reference](https://cli.vuejs.org/config/).
 
 ### todo list
-- [ ] 商家logo默认/选中2中状态
+- [ ] 商家logo默认/选中2种状态
 - [ ] 测试省钱页跳转微信小程序
 - [x] 搜索页
 - [ ] 分享测试：默认、带有分享人信息、分享赚钱、商品列表及详情
 - [x] 商品详情页：淘宝复制口令
 - [x] 底部导航：新增购物
+- [ ] 不同商家返回的字段：目前发现拼多多的商品ID对不上

htmldev/cps/src/api/request.js

@@ -55,7 +55,7 @@ request.interceptors.request.use(request => {
 
   // 因为微信开发者工具重复授权，本地开发时写死
   if (/^(0|192|10|localhost)/.test(domain)) {
-    request.headers.wechatToken = '22aff98dec057448c59427e42065d3df'
+    request.headers.wechatToken = '911cfb17f5e881672fb6d9a625f00981'
   } else {
     request.headers.wechatToken = getCookieValue('fanbutingwechatToken')
   }

htmldev/cps/src/store/modules/common.js

@@ -17,7 +17,42 @@ const state = {
   },
   orderType: [], // 订单类型
   inviteId: '', // 邀请人ID，分享链接携带
-  isInit: false // 获取用户信息接口、订单类型接口加锁
+  isInit: false, // 获取用户信息接口、订单类型接口加锁
+  // 商家列表
+  sourceList: [
+    {
+      name: '京东',
+      value: 'jd',
+      default: require('../../assets/businessLogo/jd0.png'),
+      active: require('../../assets/businessLogo/jd1.png'),
+      logo: require('../../assets/businessLogo/jd2.png')
+    },
+    {
+      name: '唯品会',
+      value: 'vip',
+      default: require('../../assets/businessLogo/vip0.png'),
+      active: require('../../assets/businessLogo/vip1.png'),
+      logo: require('../../assets/businessLogo/vip2.png')
+    },
+    {
+      name: '拼多多',
+      value: 'pdd',
+      default: require('../../assets/businessLogo/pdd0.png'),
+      active: require('../../assets/businessLogo/pdd1.png'),
+      logo: require('../../assets/businessLogo/pdd2.png')
+    },
+    {
+      name: '考拉',
+      value: 'kaola',
+      default: require('../../assets/businessLogo/kaola0.png'),
+      active: require('../../assets/businessLogo/kaola1.png'),
+      logo: require('../../assets/businessLogo/kaola2.png')
+    },
+    {
+      name: '淘宝',
+      value: 'taobao'
+    }
+  ]
 }
 
 const getters = {
@@ -32,6 +67,9 @@ const getters = {
   },
   isInit (state) {
     return state.isInit
+  },
+  sourceList (state) {
+    return state.sourceList
   }
 }
 

htmldev/cps/src/views/category/detail/index.vue

@@ -22,6 +22,9 @@
       <p class="origin-price">原价¥ {{ goodsInfo.market_price && (goodsInfo.market_price * 1).toFixed(2) }}</p>
       <div
         class="name-wrap">
+        <img
+          :src="businessLogo"
+          alt="">
         <p>{{ goodsInfo.goods_name }}</p>
       </div>
       <div
@@ -131,6 +134,18 @@ export default {
       copyPopup: false // 淘口令复制提示
     }
   },
+  computed: {
+    sourceList () {
+      return this.$store.getters['common/sourceList']
+    },
+    businessLogo () {
+      const result = this.sourceList.filter(item => item.value === this.source)
+      if (result.length) {
+        return result[0].logo
+      }
+      return ''
+    }
+  },
   created () {
     this.funInit()
   },
@@ -262,14 +277,17 @@ export default {
 }
 
 .name-wrap {
+  position: relative;
+  left: 0;
+  top: 0;
   margin: 10px 0 14px;
-  overflow: hidden;
 
   img {
+    position: absolute;
+    left: 0;
+    top: 0;
     width: 30px;
     height: 16px;
-    margin-right: 4px;
-    float: left;
   }
 
   p {
@@ -277,6 +295,7 @@ export default {
     font-weight: bold;
     color: #333333;
     line-height: 20px;
+    text-indent: 34px;
   }
 }
 

htmldev/cps/src/views/category/index/child/main.vue

@@ -31,6 +31,9 @@
         <div class="info">
           <div
             class="top">
+            <img
+              :src="businessLogo"
+              alt="">
             <p>{{ item.goods_name }}</p>
           </div>
           <div class="middle">
@@ -114,6 +117,18 @@ export default {
       screenHeight: Math.round(window.screen.height / 2)
     }
   },
+  computed: {
+    sourceList () {
+      return this.$store.getters['common/sourceList']
+    },
+    businessLogo () {
+      const result = this.sourceList.filter(item => item.value === this.source)
+      if (result.length) {
+        return result[0].logo
+      }
+      return ''
+    }
+  },
   methods: {
     init () {
       this.finished = false
@@ -298,6 +313,18 @@ export default {
 }
 
 .top {
+  position: relative;
+  left: 0;
+  top: 0;
+
+  img {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 30px;
+    height: 16px;
+  }
+
   p {
     display: -webkit-box;
     font-size: 14px;
@@ -307,6 +334,7 @@ export default {
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
+    text-indent: 34px;
   }
 }
 

htmldev/cps/src/views/category/index/index.vue

@@ -30,6 +30,14 @@
               v-for="item in sourceList"
               :key="item.value">
               <template #title>
+                <img
+                  :src="item.default"
+                  alt=""
+                  v-show="businessValue !== item.value">
+                <img
+                  :src="item.active"
+                  alt=""
+                  v-show="businessValue === item.value">
                 <i>{{ item.name }}</i>
               </template>
             </van-tab>
@@ -107,28 +115,6 @@ export default {
   data () {
     return {
       searchValue: '',
-      sourceList: [
-        {
-          name: '京东',
-          value: 'jd'
-        },
-        {
-          name: '唯品会',
-          value: 'vip'
-        },
-        {
-          name: '拼多多',
-          value: 'pdd'
-        },
-        {
-          name: '考拉',
-          value: 'kaola'
-        },
-        {
-          name: '淘宝',
-          value: 'taobao'
-        }
-      ], // 商家列表
       businessValue: 'jd',
       catId: '',
       cateList: [], // 分类列表
@@ -136,6 +122,11 @@ export default {
       showHeader: true // 是否展示顶部模块：搜索、商家筛选、类别筛选
     }
   },
+  computed: {
+    sourceList () {
+      return this.$store.getters['common/sourceList']
+    }
+  },
   activated () {
     if (!this.$route.meta.isUseCache) {
       this.searchValue = ''
@@ -282,13 +273,12 @@ export default {
         justify-content: center;
         width: 67px;
         height: 23px;
-        padding: 0 12px;
         background: #F3F3F3;
         border-radius: 12px;
 
         img {
-          width: 16px;
-          height: 16px;
+          width: 20px;
+          height: 20px;
           margin-right: 3px;
         }
 

htmldev/cps/src/views/search/child/main.vue

@@ -31,6 +31,9 @@
         <div class="info">
           <div
             class="top">
+            <img
+              :src="businessLogo"
+              alt="">
             <p>{{ item.goods_name }}</p>
           </div>
           <div class="middle">
@@ -117,6 +120,18 @@ export default {
       scroll: null
     }
   },
+  computed: {
+    sourceList () {
+      return this.$store.getters['common/sourceList']
+    },
+    businessLogo () {
+      const result = this.sourceList.filter(item => item.value === this.source)
+      if (result.length) {
+        return result[0].logo
+      }
+      return ''
+    }
+  },
   methods: {
     init () {
       this.finished = false
@@ -297,6 +312,18 @@ export default {
 }
 
 .top {
+  position: relative;
+  left: 0;
+  top: 0;
+
+  img {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 30px;
+    height: 16px;
+  }
+
   p {
     display: -webkit-box;
     font-size: 14px;
@@ -306,6 +333,7 @@ export default {
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
+    text-indent: 34px;
   }
 }
 

htmldev/cps/src/views/search/index.vue

@@ -71,28 +71,6 @@ export default {
   data () {
     return {
       keyword: '',
-      sourceList: [
-        {
-          name: '京东',
-          value: 'jd'
-        },
-        {
-          name: '唯品会',
-          value: 'vip'
-        },
-        {
-          name: '拼多多',
-          value: 'pdd'
-        },
-        {
-          name: '考拉',
-          value: 'kaola'
-        },
-        {
-          name: '淘宝',
-          value: 'taobao'
-        }
-      ], // 商家列表
       // 1-综合排序,2-价格升序,3-销量降序 默认1
       filterList: [
         {
@@ -114,6 +92,11 @@ export default {
       numPositionY: 0
     }
   },
+  computed: {
+    sourceList () {
+      return this.$store.getters['common/sourceList']
+    }
+  },
   activated () {
     if (!this.$route.meta.isUseCache) {
       this.keyword = ''