From 2571b833ac19340084f07ac2ccd76b242ee3d4f0 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期三, 11 六月 2025 22:34:41 +0800
Subject: [PATCH] 分类多级联动
---
pages/goods-manager/goodsList/goodsList.vue | 13 +++---
pages/goods-manager/addGoods/addGoods.vue | 105 ++++++++++++++++++++++++++++++++++++++++++++--------
2 files changed, 96 insertions(+), 22 deletions(-)
diff --git a/pages/goods-manager/addGoods/addGoods.vue b/pages/goods-manager/addGoods/addGoods.vue
index 877de76..02576b6 100644
--- a/pages/goods-manager/addGoods/addGoods.vue
+++ b/pages/goods-manager/addGoods/addGoods.vue
@@ -4,8 +4,17 @@
<u-form :border-bottom="false" :model="form" ref="uForm" :error-type="['toast']" :rule="rules">
<u-form-item label="鍟嗗搧鍒嗙被" label-width="130" prop="">
- <picker @change="bindCategoryChange" :value="c_index" :range="categoryArray" :range-key="'name'">
- <view class="uni-input">{{ categoryArray[c_index].name }}</view>
+ <picker mode="multiSelector" @change="bindMultiPickerChange"
+ @columnchange="bindMultiPickerColumnChange" :value="multiIndex" :range="categoryListArray"
+ range-key="name">
+ <view class="picker">
+ {{ categoryListArray[0][multiIndex[0]].name ? categoryListArray[0][multiIndex[0]].name +
+ '锛�' : '' }}
+ {{ categoryListArray[1][multiIndex[1]].name ? categoryListArray[1][multiIndex[1]].name +
+ '锛�' : '' }}
+ {{ categoryListArray[2][multiIndex[2]].name ? categoryListArray[2][multiIndex[2]].name :
+ '' }}
+ </view>
</picker>
</u-form-item>
@@ -21,24 +30,24 @@
<u-input type="textarea" v-model="form.sellingPoint" placeholder="璇疯緭鍏ュ晢鍝佸崠鐐�" />
</u-form-item>
- <u-form-item label="鍟嗗搧鍝佺墝" label-width="130" prop="">
+ <u-form-item label="鍟嗗搧鍝佺墝" label-width="130" prop="brandId">
<picker @change="bindBrandsChange" :value="b_index" :range="brandsArray" :range-key="'name'">
<view class="uni-input">{{ brandsArray[b_index].name }}</view>
</picker>
</u-form-item>
- <u-form-item label="璁￠噺鍗曚綅" label-width="130" prop="___path">
+ <u-form-item label="璁￠噺鍗曚綅" label-width="130" prop="goodsUnit">
<picker @change="bindUnitChange" :value="u_index" :range="unitArray" :range-key="'name'">
<view class="uni-input">{{ unitArray[u_index].name }}</view>
</picker>
</u-form-item>
- <u-form-item label="閿�鍞ā寮�" label-width="130" prop="___path">
- <radio-group name="radio">
+ <u-form-item label="閿�鍞ā寮�" label-width="130" prop="salesModel">
+ <radio-group name="radio" @change="radioChange" v-model="form.salesModel">
<label>
- <radio value="radio1" /><text>闆跺敭鍨�</text>
+ <radio value="RETAIL" :checked="form.salesModel == 'RETAIL'" /><text>闆跺敭鍨�</text>
</label>
<label>
- <radio value="radio2" /><text>鎵瑰彂鍨�</text>
+ <radio value="WHOLESALE" :checked="form.salesModel == 'WHOLESALE'" /><text>鎵瑰彂鍨�</text>
</label>
</radio-group>
</u-form-item>
@@ -84,14 +93,16 @@
c_index: 0,
b_index: 0,
u_index: 0,
+ categoryListArray: [],
+ multiIndex: [0, 0, 0],
storage,
form: {},
- categoryArray: [],
brandsArray: [],
unitArray: []
}
},
methods: {
+
//鍥剧墖涓婁紶
onUploaded(lists) {
let images = [];
@@ -100,12 +111,6 @@
images.push(item.response.result);
});
this.form.images = images;
- },
- bindCategoryChange(e) {
- this.c_index = e.detail.value
- console.log('this.c_index', this.c_index);
-
- this.initBrands(this.categoryArray[this.c_index].id)
},
bindBrandsChange(e) {
this.b_index = e.detail.value
@@ -118,10 +123,11 @@
initCategory() {
API_GOODS.getStoreGoodsCategory().then((res) => {
const params = res.data.result;
- this.categoryArray = params
if (params && params.length > 0) {
this.initBrands(params[0].id)
}
+ this.categoryListData = params;
+ this.manageCategoryListThreeLevel()
});
},
initBrands(categoryId) {
@@ -138,6 +144,73 @@
this.unitArray = params
});
},
+ manageCategoryListThreeLevel() {
+ let categoryLen = this.categoryListData.length
+ for (var i = categoryLen - 1; i >= 0; i--) {
+ let categoryChildrenLen = this.categoryListData[i].children.length
+ for (var j = categoryChildrenLen - 1; j >= 0; j--) {
+ if (!this.categoryListData[i].children[j].children.length) {
+ this.categoryListData[i].children.splice(j, 1)
+ }
+ }
+ }
+ this.manageCategoryListTwoLevel()
+ },
+
+ manageCategoryListTwoLevel() {
+ let categoryLen = this.categoryListData.length
+ for (var i = categoryLen - 1; i >= 0; i--) {
+ if (!this.categoryListData[i].children.length) {
+ this.categoryListData.splice(i, 1)
+ }
+ }
+ this.categoryListArray = [
+ this.categoryListData,
+ this.categoryListData[0].children,
+ this.categoryListData[0].children[0].children,
+ ]
+ },
+
+ // value 鏀瑰彉鏃惰Е鍙� change 浜嬩欢
+ bindMultiPickerChange: function (e) {
+ this.multiIndex = e.detail.value
+
+ this.initBrands(this.categoryListData[this.multiIndex[0]].id)
+ },
+ // 鏌愪竴鍒楃殑鍊兼敼鍙樻椂瑙﹀彂 columnchange 浜嬩欢
+ bindMultiPickerColumnChange: function (e) {
+ if (!this.multiIndex || !this.multiIndex.length) {
+ this.multiIndex = [0, 0, 0]
+ }
+
+ let column = e.detail.column;
+ let value = e.detail.value;
+
+ let multiIndex = this.multiIndex;
+ multiIndex[column] = value;
+ if (column == 0) {
+ multiIndex[1] = 0;
+ multiIndex[2] = 0;
+ }
+ if (column == 1) {
+ multiIndex[2] = 0;
+ }
+ this.multiIndex = multiIndex;
+
+ let categoryListArray = [];
+ categoryListArray[0] = this.categoryListData;
+ categoryListArray[1] = this.categoryListData[multiIndex[0]].children;
+ if (this.categoryListData[multiIndex[0]].children[multiIndex[1]].children) {
+ categoryListArray[2] = this.categoryListData[multiIndex[0]].children[multiIndex[1]].children;
+ } else {
+ categoryListArray[2] = [];
+ }
+ this.categoryListArray = categoryListArray;
+
+ },
+ radioChange: function (e) {
+ this.form.salesModel = e.detail.value
+ },
},
onShow() {
this.initGoods()
diff --git a/pages/goods-manager/goodsList/goodsList.vue b/pages/goods-manager/goodsList/goodsList.vue
index 69a0d94..e77a8be 100644
--- a/pages/goods-manager/goodsList/goodsList.vue
+++ b/pages/goods-manager/goodsList/goodsList.vue
@@ -9,12 +9,12 @@
<!-- 閫氳繃header鎻掓Ы瀹氫箟鍒楄〃宸︿晶鍥剧墖 -->
<view class="uni-thumb shop-picture" :class="{ 'shop-picture-column': formData.waterfall }">
- <image :src="item.goods_thumb" mode="aspectFill"></image>
+ <image :src="item.thumbnail" mode="aspectFill"></image>
</view>
<view class="shop">
<view>
<view class="uni-title">
- <text class="uni-ellipsis-2">{{ item.name }}</text>
+ <text class="uni-ellipsis-2">{{ item.goodsName }}</text>
</view>
<!-- <view>
<text class="uni-tag hot-tag">{{ item.goods_tip }}</text>
@@ -24,12 +24,12 @@
<view>
<view class="shop-price">
<text>楼</text>
- <text class="shop-price-text">{{ item.goods_price }}</text>
+ <text class="shop-price-text">{{ item.price }}</text>
<text>.00</text>
</view>
<view class="uni-flex-row">
- <view class="uni-note">{{ item.comment_count || 0 }}鏉¤瘎璁� 鏈堥攢閲� {{
- item.month_sell_count || 0 }}
+ <view class="uni-note">{{ item.commentNum || 0 }}鏉¤瘎璁� 鏈堥攢閲� {{
+ item.buyCount || 0 }}
</view>
<view class="uni-note ellipsis">
<text class="uni-link">涓婃灦</text>
@@ -256,6 +256,7 @@
// 灏忕▼搴� 缂栬瘧鍚庝細澶氫竴灞傛爣绛撅紝鑰屽叾浠栧钩鍙版病鏈夛紝鎵�浠ラ渶瑕佺壒娈婂鐞嗕竴涓�
/deep/ .uni-list {
/* #endif */
+ height: calc(100vh - 100px - 80px - 60px);
display: flex;
flex-direction: row;
flex-wrap: wrap;
@@ -267,7 +268,7 @@
/deep/
/* #endif */
.uni-list-item--waterfall {
- // width: 50%;
+ width: 98%;
display: flex;
box-sizing: border-box;
margin-bottom: 10px;
--
Gitblit v1.8.0