会员价细节

pages/news3/components/category.vue

@@ -7,12 +7,24 @@
 					请选择分类
 				</view>
 				<view class="shopItem">
-					<view class="shopText" :class="{'active':activeIndex.indexOf(item.category_id) > -1}"
-						@click="getShop(item,item.category_id)" v-for="(item, index) in tabList" :key="index">
-						<text>{{ item.name }}</text>
-						<image v-if="activeIndex.indexOf(item.category_id) > -1"
-							:src="$picUrl + '/static/news1/selected.png'" mode="widthFix">
-						</image>
+					<view class="" v-for="(item, index) in tabList" :key="index">
+						<view class="shopText Text" :class="{'active1':activeIndex.indexOf(item.category_id) > -1}"
+							@click="getShop(item,item.category_id)">
+							<text style="color: #333;font-weight: 700;">{{ item.name }}</text>
+							<image v-if="activeIndex.indexOf(item.category_id) > -1"
+								:src="$picUrl + '/static/news1/selected.png'" mode="widthFix">
+							</image>
+						</view>
+						<view class="shopItem2">
+							<view class="shopText" :class="{'active2':activeIndex.indexOf(item.category_id) > -1}"
+								@click="getShop(item,item.category_id)" v-for="(item, index) in item.children"
+								:key="index">
+								<text>{{ item.name }}2</text>
+								<image v-if="activeIndex.indexOf(item.category_id) > -1"
+									:src="$picUrl + '/static/news1/selected.png'" mode="widthFix">
+								</image>
+							</view>
+						</view>
 					</view>
 				</view>
 				<view class="btnGroup">
@@ -58,19 +70,31 @@
 				}
 				console.log(this.activeIndex)
 			},
-			submit() {
-				let idList = [];
-				this.tabList.forEach(item => {
-					if (this.activeIndex.indexOf(item.category_id) > -1) {
-						idList.push(item.category_id);
+			findElementsById(arr, ids) {
+				console.log(ids)
+				let result = []
+				arr.forEach(item => {
+					if (ids.indexOf(item.category_id) > -1) {
+						result.push(item.category_id);
+						item.children.forEach(item1 => {
+							if (ids.indexOf(item1.category_id) > -1) {
+								result.push(item1.category_id);
+							}
+						});
 					}
 				});
+				return result;
+			},
+			submit() {
+				let idList = []
+				idList = this.findElementsById(this.tabList, this.activeIndex);
 				let storage = uni.getStorageSync('list') || []
 				if (storage.length > 0 && idList.length > 0) {
 					idList = this.getArrDifference(idList, storage)
 				}
+				console.log(idList)
 				this.$emit('getChoseCategory', {
-					category_id: idList,
+					category_id: idList||[],
 				})
 			},
 			getArrDifference(arr1, arr2) {
@@ -135,18 +159,22 @@
 			border-bottom: 1px solid #EAEAEA;
 		}
 
-		.shopItem {
-			margin-top: 40rpx;
+		.shopItem2 {
 			display: flex;
 			flex-wrap: wrap;
-			justify-content: space-between;
 			align-items: center;
+			margin-left: 40rpx;
+		}
+
+		.shopItem {
+			margin-top: 40rpx;
 			max-height: 750rpx;
 			overflow-y: auto;
 
 			.shopText {
+				margin-right: 12rpx;
 				width: 150upx;
-				height: 72upx;
+				height: 60upx;
 				background: #FFFFFF;
 				border-radius: 3px 3px 3px 3px;
 				border: 1px solid #D6D6D6;
@@ -155,6 +183,9 @@
 				display: flex;
 				justify-content: center;
 				align-items: center;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				overflow: hidden;
 
 				text {
 					font-size: 26upx;
@@ -175,9 +206,10 @@
 				}
 			}
 
-			.active {
+			.active1 {
 				text {
-
+					font-weight: 700;
+					font-size: 28rpx;
 					color: #FF4F40;
 
 				}
@@ -185,6 +217,17 @@
 				border: 1px solid #FF4F40;
 
 			}
+
+			.active2 {
+				text {
+					font-weight: 500;
+					font-size: 26rpx;
+
+				}
+
+				border: 1px solid #FF4F40;
+
+			}
 		}
 
 	}

pages/news3/vipPrice.vue

@@ -109,15 +109,8 @@
 				if (status == 200) {
 					if (data.list.length > 0) {
 						data.list.forEach((item_1, index_1) => {
-							let arr = item_1.category.split(",").map(item => Number(item))
-							let name = this.categoryList.filter(function(obj) {
-								return item_1.category.split(",").map(item => Number(item)).some(
-									function(item) {
-										return item === obj.category_id;
-									});
-							}).map(function(obj) {
-								return obj.name
-							});
+							let name = this.findElementsById(this.categoryList, item_1.category.split(",").map(
+								item => Number(item)))
 							item_1.category_name = name.join(',') + (name.length > 0 ? '等' : '');
 							item_1.price_list.forEach((item_2, index_2) => {
 								item_2.startProfit = Number((Number(item_2.min) * (Number(item_2
@@ -137,7 +130,6 @@
 				let that = this
 				let step = 0;
 				let list = this.list
-				console.log(list)
 				list.forEach((item, index) => {
 					if (!item.category_name) {
 						step++
@@ -307,25 +299,30 @@
 				uni.setStorageSync('list', list)
 				this.$refs.category.afterSale = true;
 			},
+			findElementsById(arr, ids) {
+				let result = []
+				arr.forEach(item => {
+					if (ids.indexOf(item.category_id) > -1) {
+						result.push(item.name);
+					}
+					item.children.forEach(item1 => {
+						if (ids.indexOf(item1.category_id) > -1) {
+							result.push(item1.name);
+						}
+					});
+				});
+				return result;
+			},
 			// 获取分类
 			getChoseCategory(res) {
 				let nameList = [];
 				let list = [];
-				console.log(this.list[this.categoryIndex].category, this.categoryIndex)
 				if (this.list[this.categoryIndex].category) {
 					list = this.list[this.categoryIndex].category.split(",").map(item => Number(item))
 				}
 				let newList = list.concat(res.category_id);
-
-				this.categoryList.forEach(item1 => {
-					newList.forEach(item2 => {
-						if (item1.category_id == item2) {
-							nameList.push(item1.name)
-						}
-					});
-				});
-				console.log(nameList, newList)
-				this.list[this.categoryIndex].category_name = nameList.join(',') +(nameList.length > 0 ? '等' : '');
+				nameList = this.findElementsById(this.categoryList, newList);
+				this.list[this.categoryIndex].category_name = nameList.join(',') + (nameList.length > 0 ? '等' : '');
 				this.list[this.categoryIndex].category = newList.join(',')
 				this.$refs.category.afterSale = false;
 			},