From 79f11f34546a394ab1c16ba427c31e9b59d05523 Mon Sep 17 00:00:00 2001
From: queenwuli <942534046@qq.com>
Date: Sat, 09 Jan 2021 10:40:57 +0800
Subject: [PATCH] gx
---
hive-app/pages/workbench/selectProduct/index.vue | 74 +++++++++++++++++++++++++++++--------
1 files changed, 58 insertions(+), 16 deletions(-)
diff --git a/hive-app/pages/workbench/selectProduct/index.vue b/hive-app/pages/workbench/selectProduct/index.vue
index 25e4263..2fa735d 100644
--- a/hive-app/pages/workbench/selectProduct/index.vue
+++ b/hive-app/pages/workbench/selectProduct/index.vue
@@ -4,13 +4,19 @@
<search-bar @confirm="search" placeholder="商品名称、编号、拼音" class="search-bar"></search-bar>
<view class="list">
<scroll-view class="list-left" scroll-y="true">
- <view class="list-left-row"
- v-for="(item,index) in goodsTypeList"
- v-if="item.parentId===0"
- :class="index==selectIndex?'active':''"
- @click="changeGoodsType(item.id, index)">
- <text>{{item.name}}</text>
- </view>
+ <uni-collapse accordion="true" @change="toggleCollapse">
+ <uni-collapse-item :showAnimation="true" :title="item.name" class="list-left-row"
+ v-if="item.parentId===0" v-for="item in goodsTypeList">
+ <view class="list-row-wrap">
+ <view class="list-row" :class="op.id==cateId?'blue':''"
+ v-for="op in goodsTypeList"
+ v-if="op.parentId===item.id"
+ @click="changeGoodsType(op.id)">
+ {{op.name}}
+ </view>
+ </view>
+ </uni-collapse-item>
+ </uni-collapse>
</scroll-view>
<scroll-view class="list-right" scroll-y="true">
<navigator :url="'../productDetail/index?goodsType='+item.goodsType+'&id='+item.id" hover-class="none" v-for="item in goodsList">
@@ -50,10 +56,14 @@
</template>
<script>
+ import uniCollapse from '../../../components/uni-collapse/uni-collapse.vue'
+ import uniCollapseItem from '../../../components/uni-collapse-item/uni-collapse-item.vue'
import searchBar from '../../../components/searchBar/index.vue';
import shoppingCart from './shoppingCart.vue'
export default {
components:{
+ uniCollapse,
+ uniCollapseItem,
searchBar,
shoppingCart
},
@@ -62,7 +72,6 @@
id: '',
goodsTypeList: [],
goodsList: [],
- selectIndex: 0,
cateId: null,//当前产品类别id
selectItems: [],
queryKey: ''
@@ -98,7 +107,7 @@
},
methods:{
openShoppingCart(){
- this.$refs.shopCart.show()
+ this.$refs.shopCart.toggle()
},
loadGoodsTypeList(){
this.$httpUtils.request('/api/order/findShoppingGoodsType').then((res) => {
@@ -131,9 +140,30 @@
this.queryKey = val;
this.loadGoodsList();
},
+ getParentId(){
+ let arr = this.goodsTypeList.filter((item) => {
+ return item.id===this.cateId
+ })
+ return arr.length?arr[0].parentId:'';
+ },
+ // 打开关闭面板
+ toggleCollapse(arr){
+ if(!arr.length){
+ let parentId = this.getParentId();
+ if(parentId){
+ this.changeGoodsType();
+ }
+ return;
+ }
+ let index = arr[0];
+ let result = this.goodsTypeList.filter((item) => {
+ return item.parentId===0
+ })
+ this.changeGoodsType(result[index].id);
+ console.log(result)
+ },
// 切换商品类型
- changeGoodsType(id, index){
- this.selectIndex = index;
+ changeGoodsType(id){
this.cateId = id;
this.loadGoodsList();
},
@@ -194,7 +224,7 @@
overflow: hidden;
}
.list-left{
- width: 170rpx;
+ width: 200rpx;
background: #F6F6F8;
border-radius: 4px;
}
@@ -202,13 +232,25 @@
flex: 1;
}
.list-left-row{
- padding: 10px;
color: #8c9fad;
font-size: 13px;
+ border-bottom: 0;
}
- .list-left-row.active{
- background: #FFFFFF;
- color: #000000;
+ .uni-collapse{
+ background: transparent;
+ }
+
+ .uni-collapse-cell__title:active, .uni-collapse-cell--hover, .uni-collapse-cell--open, .uni-collapse-cell--disabled{
+ background-color: #FFFFFF!important;
+ }
+
+ .list-row-wrap{
+ padding: 0 15px;
+ margin-top: -8px;
+ }
+ .list-row{
+ font-size: 13px;
+ margin: 8px 0;
}
.list-right-row{
display: flex;
--
Gitblit v1.9.1