소스 검색

解决筛选布局,优化筛选功能

shaun-sheep 4 년 전
부모
커밋
cb208bbaa3
1개의 변경된 파일20개의 추가작업 그리고 7개의 파일을 삭제
  1. 20 7
      src/components/product/detail/sagaProductDetail.vue

+ 20 - 7
src/components/product/detail/sagaProductDetail.vue

@@ -2,19 +2,21 @@
   <div>
     <div class="saga-brand-box mt90 por">
       <div class="breadcrumb-content">
-        <div>
-          <el-breadcrumb separator-class="el-icon-arrow-right">
+        <div style="width: 1020px">
+          <el-breadcrumb
+            separator-class="el-icon-arrow-right"
+            style="width: 320px;display: inline-block"
+          >
             <el-breadcrumb-item>所有分类</el-breadcrumb-item>
             <el-breadcrumb-item>给排水专业</el-breadcrumb-item>
             <el-breadcrumb-item>燃气系统</el-breadcrumb-item>
             <el-breadcrumb-item>品牌名称</el-breadcrumb-item>
           </el-breadcrumb>
-        </div>
-        <div style="width: 750px;">
-              <span v-for="(item,index) in allDate" v-if="item.check" class="select">{{item.BrandCname}}
+          <span v-for="(item,index) in allSelect" v-if="item.check" class="select">{{item.BrandCname}}
           <i class="el-icon-close" @click="deleteCurrent(item,index)"></i></span>
         </div>
 
+
         <span class="total poa">共<b>42</b>件相关产品</span>
       </div>
       <div class="device-sys">
@@ -89,6 +91,7 @@
           list.map(i => this.$set(i, 'check', false))
           this.temporary = list
           this.allDate = list
+          this.allSelect = list
         }
       }
     },
@@ -103,6 +106,7 @@
         brandList: {},
         allDate: [],
         temporary: [],//全部数据
+        allSelect: [],//选择的数据
         sortMap: {
           zh: "中文排序",
           en: "英文排序",
@@ -133,11 +137,20 @@
       },
       handleCurrentBrand(item, index) {
         item.check = !item.check
-
-
+        this.allSelect.map((i, idx) => {
+          if (idx == index) {
+            i.check = item.check
+          }
+        })
       },
       deleteCurrent(item, index) {
         item.check = false
+        this.allSelect.map((i, idx) => {
+          if (idx == index) {
+            i.check = item.check
+          }
+        })
+
       }
     }
   }