From 63820a55496e99f54d68a1f16e3f6f606c582120 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期三, 11 二月 2026 09:11:16 +0800
Subject: [PATCH] 调试代码
---
mini-program/pages/mall/mall.vue | 107 ++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 85 insertions(+), 22 deletions(-)
diff --git a/mini-program/pages/mall/mall.vue b/mini-program/pages/mall/mall.vue
index c4f0dd4..27e0bb2 100644
--- a/mini-program/pages/mall/mall.vue
+++ b/mini-program/pages/mall/mall.vue
@@ -1,5 +1,6 @@
<template>
<view class="mall">
+ <view class="mall-zz" v-show="show"></view>
<view class="head" :style="{ height: 'calc(' + (navHeight + statusbarHeight + 'px + 188rpx)') }">
<view class="head-box">
<view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
@@ -24,27 +25,28 @@
<text>閫傜敤鍝佺墝</text>
<u-icon name="arrow-down" color="#777777" size="13"></u-icon>
</view>
- <view class="head-list-item">
+ <view class="head-list-item" @click="openSearch(3)">
<text>绯诲垪</text>
<u-icon name="arrow-down" color="#777777" size="13"></u-icon>
</view>
</view>
-
+ <!-- 鎺掑簭 -->
<view class="list" v-if="show === 1">
- <view class="list-item">
- <text>缁煎悎鎺掑簭</text>
- <image src="/static/icon/ic_selete@2x.png" mode="widthFix"></image>
- </view>
- <view class="list-item">
- <text>閿�閲忕敱楂樺埌浣�</text>
- </view>
- <view class="list-item">
- <text>浠锋牸鐢变綆鍒伴珮</text>
+ <view :class="item.active ? 'list-item red' : 'list-item'" v-for="(item, index) in paixu" :key="index" @click="clickpx(index)">
+ <text>{{item.name}}</text>
+ <image src="/static/icon/ic_selete@2x.png" mode="widthFix" v-show="item.active"></image>
</view>
</view>
-
- <view class="list" v-if="show === 2">
- <view class="list-cate active" v-for="(item, index) in 6" :key="index">鑷惀鍝佺墝</view>
+ <!-- 鍝佺墝 -->
+ <view class="list" style="padding-top: 30rpx; box-sizing: border-box; justify-content: flex-start;" v-if="show === 2">
+ <view :class="item.active ? 'list-cate active' : 'list-cate'" v-for="(item, index) in pingpai" :key="index" @click="getXiLie(item.id)">{{item.name}}</view>
+ </view>
+ <!-- 绯诲垪 -->
+ <view class="list" v-if="show === 3">
+ <view :class="item.active ? 'list-item red' : 'list-item'" v-for="(item, index) in xilie" :key="index" @click="clickpx(index)">
+ <text>{{item.name}}</text>
+ <image src="/static/icon/ic_selete@2x.png" mode="widthFix" v-show="item.active"></image>
+ </view>
</view>
</view>
<view class="commodity">
@@ -97,17 +99,56 @@
return {
keyword: '',
show: null,
- list: [
- { name: '鍏ㄩ儴' },
- { name: '鏀噸杞�' },
- { name: '鎵樿疆' },
- { name: '骞宠 杞�' },
- { name: '瀵艰建' },
- { name: '瀵煎悜杞�' },
- ]
+ list: [],
+ paixu: [
+ { name: '缁煎悎鎺掑簭', id: 0, active: false },
+ { name: '閿�閲忕敱浣庡埌楂�', id: 1, active: false },
+ { name: '浠锋牸鐢变綆鍒伴珮', id: 2, active: false },
+ { name: '閿�閲忕敱楂樺埌浣�', id: 3, active: false },
+ { name: '浠锋牸鐢遍珮鍒颁綆', id: 4, active: false },
+ ],
+ pingpai: [],
+ xilie: []
};
},
+ onLoad() {
+ this.getLabels()
+ },
methods: {
+ // 鑾峰彇鍒嗙被
+ getLabels() {
+ this.$u.api.getGoodsLabelsByType({ type: 0 })
+ .then(res => {
+ if (res.code === 200) {
+ res.data.unshift({ name: '鍏ㄩ儴', id: '' })
+ this.list = res.data
+ }
+ })
+ this.$u.api.getGoodsLabelsByType({ type: 1 })
+ .then(res => {
+ if (res.code === 200) {
+ res.data.forEach(item => {
+ item.active = false
+ })
+ res.data.unshift({ name: '鑷惀鍝佺墝', id: '', active: true })
+ this.pingpai = res.data
+ }
+ })
+ },
+ // 绯诲垪
+ getXiLie(parentId) {
+ this.$u.api.getGoodsLabelsByType({ type: 15, parentId })
+ .then(res => {
+ if (res.code === 200) {
+ console.log(res)
+ res.data.forEach(item => {
+ item.active = false
+ })
+ res.data.unshift({ name: '绯诲垪', id: '', active: true })
+ this.xilie = res.data
+ }
+ })
+ },
openSearch(type) {
if (type === this.show) {
this.show = null
@@ -118,6 +159,11 @@
jump() {
uni.navigateTo({
url: '/pages/details/details'
+ })
+ },
+ clickpx(i) {
+ this.paixu.forEach((item, index) => {
+ item.active = index === i
})
}
}
@@ -132,6 +178,15 @@
<style lang="scss" scoped>
.mall {
width: 100%;
+ .mall-zz {
+ width: 100vw;
+ height: 100vh;
+ background-color: rgba(0,0,0,.5);
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 2;
+ }
.cart {
position: fixed;
right: 30rpx;
@@ -315,6 +370,7 @@
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
+ border-radius: 0rpx 0rpx 24rpx 24rpx;
.active {
background: rgba(0,64,150,0.1) !important;
color: #004096 !important;
@@ -331,6 +387,13 @@
font-size: 28rpx;
color: #333333;
margin-bottom: 24rpx;
+ margin-right: 20rpx;
+ &:last-child {
+ margin-right: 0 !important;
+ }
+ }
+ .red {
+ color: #E4001D !important;
}
.list-item {
width: 100%;
--
Gitblit v1.9.3