搜索页面需求调整

components/home/floor/FloorBar.vue

@@ -40,7 +40,6 @@
             }
           }
         }
-        console.log(barOffset)
       },
       jumpFloor (index) {
         if (this.visible) {

components/search/DetailBrand.vue

@@ -1,18 +1,19 @@
 <template>
-  <div class="brandDetail container" v-if="list_brands">
+  <div class="brandDetail container" v-if="list_brands && list_brands.uuid">
     <div id="brand">
       <nuxt-link :to="`/product/brand/${list_brands.uuid}`" class="brand-logo">
         <img :src="list.logoUrl || '/images/component/default.png'" :alt="list.nameEn" :title="list.nameEn"/>
       </nuxt-link>
       <div class="brand-message">
-        <div class="brand-main" v-show="list.series">主营产品：<span>{{list.series}}</span></div>
+        <div class="brand-main" v-show="list.series"><div>主营产品：</div><span>{{list.series}}</span></div>
         <div class="brand-main" v-show="applications.length>0">
-          应用领域：<span v-for="(item, index) in applications"><span>{{item}}</span><span v-show="index+1 < applications.length">|</span></span>
+          <div>应用领域：</div><span v-for="(item, index) in applications"><span>{{item}}</span><span v-show="index+1 < applications.length">|</span></span>
         </div>
-        <div class="brand-main" v-show="list.brief">品牌介绍：<span>{{list.brief}}</span></div>
-        <div class="brand-main" v-show="list.url">官网地址：<a class="office-address" :href="list.url">{{list.url}}</a></div>
+        <div class="brand-main" v-show="list.brief"><div>品牌介绍：</div><span>{{list.brief}}</span></div>
+        <div class="brand-main" v-show="list.url"><div>官网地址：</div><a class="office-address" :href="list.url">{{list.url}}</a></div>
       </div>
     </div>
+    <nuxt-link :to="`/product/brand/${list_brands.uuid}`" class="brand-url">进入品牌中心</nuxt-link>
   </div>
 </template>
 
@@ -39,26 +40,32 @@
 </script>
 
 <style scoped>
+  #brand{
+    min-height: 160px;
+  }
   .brandDetail {
     margin-top: 20px;
     width: 1190px;
-    padding: 0;
     overflow: hidden;
+    border-bottom: 1px solid #e5e5e5;
   }
   .brand-main{
-    font-size: 14px;
     line-height: 20px;
-    font-weight: 700;
     margin-left: 223px;
     margin-bottom: 10px;
   }
-  .brand-main >span {
+  .brand-main >span, .brand-main >a {
     font-weight: 500;
     font-size: 13px;
-    margin-top: 5px;
+    display: inline-block;
+    max-width: 92%;
   }
-  .office-address{
-    margin-top: 10px;
+  .brand-main >div {
+    font-size: 14px;
+    font-weight: 700;
+    width: 8%;
+    display: inline-block;
+    float: left;
   }
   .office-address{
     color: #666;
@@ -80,4 +87,13 @@
     border: 1px solid #ccc;
     vertical-align: middle;
   }
+  .brand-url{
+    color: white;
+    background: #2c87d7;
+    position: relative;
+    left: 1088px;
+    padding: 6px 8px;
+    border-radius: 5px;
+    bottom: 20px;
+  }
 </style>

components/search/GoodList.vue

@@ -42,13 +42,13 @@
           <tr style="height: 40px;">
             <th width="80"></th>
             <th width="160">品牌/型号/类目</th>
-            <th width="90">公司名称</th>
             <th width="100">封装/生产日期</th>
+            <th width="110">店铺名称</th>
             <th width="110">库存</th>
             <th width="90">阶梯</th>
             <th width="90" v-if="!crname_click_flag.rmb_click_flag">香港交货</th>
             <th width="110" v-if="!crname_click_flag.usd_click_flag">大陆交货<span style="font-size: 12px;">(含税)</span></th>
-            <th width="110">货期<span style="font-size: 12px;">(工作日)</span></th>
+            <th width="110">交期<span style="font-size: 12px;">(天)</span></th>
             <th width="100">操作</th>
           </tr>
           </thead>
@@ -65,6 +65,10 @@
               <div class="brand"><nuxt-link :to="`/product/kind/${item.kindid}`" v-text="item.kind.nameCn">
               </nuxt-link></div>
             </td>
+            <td>
+              <div class="package" v-text="item.packing?item.packing:'暂无包装方式信息'"></div>
+              <div class="date" v-text="item.produceDate"></div>
+            </td>
             <td>
               <div>
                 <nuxt-link :to="`/product/kind/${item.kindid}`" v-text="item.storeName">
@@ -72,10 +76,6 @@
                 <span v-if="!item.storeName">—</span>
               </div>
             </td>
-            <td>
-              <div class="package" v-text="item.packing?item.packing:'暂无包装方式信息'"></div>
-              <div class="date" v-text="item.produceDate"></div>
-            </td>
             <td class="text-left">
               <div class="goods">
                 库存：<span v-text="item.reserve || '暂无库存'"></span>
@@ -461,9 +461,7 @@
     width: 1190px;
     height: 40px;
     margin: 0 auto;
-    background: #fff;
     line-height: 40px;
-    margin-top: 20px;
     margin-bottom: 10px;
     background: #f1efef;
   }

components/search/Kind.vue

@@ -1,5 +1,10 @@
 <template>
-  <div class="selector">
+  <div class="selector" >
+    <a class="show-filter" @click="show_filter = !show_filter">
+      <span v-text="show_filter?'收起筛选 ':'展开筛选 '"></span>
+      <i :class="show_filter?'fa fa-angle-up':'fa fa-angle-down'"></i>
+    </a>
+    <div v-show="show_filter">
     <div class="sl-wrap" v-if="good_list.total > 0">
       <div class="sl-key f14">类目：</div>
       <div class="sl-value">
@@ -155,6 +160,7 @@
         </ul>
       </div>
     </div>
+    </div>
   </div>
 
 </template>
@@ -162,6 +168,7 @@
   export default {
     data () {
       return {
+        show_filter: true,
         kind_open: true,
         brand_open: true,
         show_kind: 'list-inline',
@@ -370,12 +377,24 @@
   }
 </script>
 <style scoped>
+  .show-filter{
+    position: relative;
+    left: 1100px;
+    top: -10px;
+    color: #888;
+    border: 1px solid #aaa;
+    padding: 3px 8px;
+    background: rgba(238, 238, 238, 0.34);
+  }
+  #searchResult .selector >div{
+    margin-bottom: 20px;
+  }
   #searchResult .selector .sl-wrap {
     position: relative;
     padding: 5px 5px;
     font-size: 12px;
     line-height: 30px;
-    border-bottom: 1px solid #e5e5e5;
+    border: 1px solid #e5e5e5;
   }
   #searchResult .selector .sl-wrap .sl-key {
     float: left;

components/search/ResultTitle.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="result-title text-muted">
     搜索"<span class="text-inverse" >{{keyword}}</span>"，为您找到
-    <span class="text-num ng-binding" v-text="good_list.total"></span><!-- ngIf: !total --> 个相关产品：
+    <span class="text-num" v-text="good_list.total"></span> 个相关产品：
   </div>
 </template>
 <script>
@@ -20,7 +20,7 @@
 <style scoped>
   #searchResult .result-title {
     margin-top: 5px;
-    padding: 0 5px;
+    padding: 10px 5px;
     height: 30px;
     line-height: 30px;
     font-size: 14px;

store/searchData.js

@@ -37,7 +37,7 @@ export const actions = {
     return axios.get(`/api/product/component/search/compGoods`, {params})
       .then(response => {
         commit('searchList/GET_LIST_SUCCESS', response.data)
-        if (response.data.brands) {
+        if (response.data.brands && response.data.brands.uuid) {
           commit('searchDetail/REQUEST_DETAIL', params)
           return axios.get(`/api/product/brand/${response.data.brands.uuid}`)
             .then(response => {