From ba6fe53d97201c2cf577a1fb0906c819ea3cae33 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期二, 30 七月 2024 00:05:20 +0800 Subject: [PATCH] 1 --- sub_pages/customer/trade/list.vue | 414 ++++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 298 insertions(+), 116 deletions(-) diff --git a/sub_pages/customer/trade/list.vue b/sub_pages/customer/trade/list.vue index edc0e59..37ef47f 100644 --- a/sub_pages/customer/trade/list.vue +++ b/sub_pages/customer/trade/list.vue @@ -1,135 +1,225 @@ <template> <!-- 列表页面 --> <view class="trade-list"> - <view class="category-detail flex"> + <view class="category-detail flex" v-if="query.category"> <view class="flex1 info"> <view class="title flex"> - <view>牛油果泡泡</view> - <view> - <image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image> - - </view> + {{categoryInfo.name||'-'}} + <image src="../../../static/common/icon-kf.png" class="icon-kf m-l-15 img100"></image> </view> <view class="desc"> - 规格:10支/扎 + 规格:{{categoryInfo.unit || '暂无'}} </view> <view class="desc"> - 估重:1.3kg/扎 + 颜色:{{categoryInfo.color || '暂无'}} </view> - <view class="desc"> + <!-- <view class="desc"> 包袋:棉袋 - </view> + </view> --> </view> <view class="info-price"> <view class="title">当日均价</view> - <view class="price">19.66</view> + <view class="price">{{categoryInfo.avePrice||'暂无'}}</view> <view class="flex desc"> - <view class="m-l-a m-r-5">+0.76</view> - <view class="m-r-a m-l-5">+4.02%</view> + <view class="m-l-a m-r-5">{{categoryInfo.avePriceDifference&&categoryInfo.avePriceDifference>=0?'+':''}}{{categoryInfo.avePriceDifference||0}}</view> + <view class="m-r-a m-l-5">{{categoryInfo.avePriceDifferenceRate&&categoryInfo.avePriceDifferenceRate>=0?'+':''}}{{categoryInfo.avePriceDifferenceRate||0}}%</view> </view> </view> </view> <view class="" style="min-height: calc(100vh - 260rpx);"> - <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> - <view v-else> + <view> <!-- 查询条件 --> <view class="component-filter-container"> - <view class="flex1"> - 等级<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> + <view class="flex1" @click.stop="order_show=true"> + {{ query.columnStr || '排序' }} + <image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> </view> - <view class="flex1"> - 等级<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> + <view class="flex1" @click.stop="level_show=true"> + {{ query.levelStr || '级别' }} + <image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> </view> - <view class="flex1"> - 好卖家<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> - </view> - <view class="flex1"> - 颜色<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> - </view> - <view class="flex1"> - 筛选<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> + + <!-- <view class="flex1">--> + <!-- 好卖家<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image>--> + <!-- </view>--> + <!-- <view class="flex1">--> + <!-- 颜色<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image>--> + <!-- </view>--> + <view class="flex1" @click="showSelectParams" v-if="query.category"> + 筛选 + <image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image> </view> </view> </view> - <view class="component-shop-item flex" v-for="(item,index) of list" :key="index" - @click="toDetail(item)"> - <view class="img"> + <no-data v-if="!list||list.length===0" style="width: 100%;"></no-data> + + <view class="component-shop-item flex" v-for="(item,index) of list" :key="index"> + <view class="img" @click.stop="toDetail(item)"> <image class="img img100" - src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/ff/fff3027bd0a146478fd1f0aae816a028%E5%BE%AE%E4%BF%A1%E6%88%AA%E5%9B%BE_20240710224139.png"> + :src="item.cover"> </image> <view class="level"> - A级 + {{item.levelStr||''}} </view> </view> <view class="m-l-12 info-container flex1"> - <view class="title"> - 橙色芭比 - <view class="price"> - ¥6.60/扎 + <view @click.stop="toDetail(item)"> + <view class="title"> + {{item.name||'-'}} + <view class="price"> + ¥{{item.price||0}}元/扎 + </view> </view> - </view> - <view class="shop-name"> - 牛油果泡泡·白色 - </view> - <view class="other-info flex"> - <view class="m-r-15"> - 已售:7 + <view class="shop-name"> + {{item.supplierName}} </view> - <view class="m-r-15"> - 剩余:13 - </view> - <view class="m-r-15"> - 1支/扎 + <view class="other-info flex"> + <view class="m-r-15"> + 已售:{{item.sales||0}} + </view> + <view class="m-r-15"> + 剩余:{{item.stock||0}} + </view> + <view class="m-r-15"> + {{item.unit}} + </view> </view> </view> <view class="bottom-buttons flex"> <view class="icons flex"> <uni-icons v-if="item.shopnum&&item.shopnum>=1" type="minus" size="32" - @click.stop="mulnum(item)"></uni-icons> - <view class="curnums" v-if="item.shopnum&&item.shopnum>=1">{{item.shopnum}}</view> + @click.stop="addnum(item,-1)"></uni-icons> + <view class="curnums" v-if="item.shopnum&&item.shopnum>=1">{{ item.shopnum }}</view> <uni-icons v-if="!item.shopnum||item.shopnum<=99" type="plus-filled" size="32" - @click.stop="addnum(item)"></uni-icons> + @click.stop="addnum(item,1)"></uni-icons> </view> </view> </view> </view> - - - <view class="icon-shop" v-if="list&&list.length>0"> - <!-- 购物图标 --> - <!-- 如果有购买的东西,就要附带数字了 --> - <view v-if="shoptotal>0" class="number"> - {{shoptotal}} - </view> + + + <view class="icon-shop" v-if="list&&list.length>0" + @click="goto('/sub_pages/customer/shopping/shopping',true)"> + <!-- 购物图标 --> + <!-- 如果有购买的东西,就要附带数字了 --> + <view v-if="shoptotal>0" class="number"> + {{ shoptotal }} + </view> </view> </view> <!-- 判断是否到底了,自动吧 --> - <footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg> - - - + <footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg> + + + <u-picker :show="level_show" @confirm="select_level" keyName="label" :columns="level_columns" + @cancel="level_show=false"></u-picker> + <u-picker :show="order_show" @confirm="select_order" keyName="label" :columns="order_columns" + @cancel="order_show=false"></u-picker> + + <uni-popup ref="popup_param" type="bottom"> + <view class="component-popup_input_all" v-if="params"> + <view class="text-center m-b-40" style="font-size: 48rpx;font-weight: 600;">商品参数设置</view> + <!-- 输入框--> + <view v-for="(item,i) in params" :key="i" class="m-t-20"> + <view class="title topic-font" style="font-size: 40rpx;font-weight: 600;">{{ item.name }}</view> + <view class="m-t-12 flex value-items"> + <view class="value-item" @click="updateValue(item,each)" :class="[item.value===each?'cur':'']" + v-for="(each, j) in item.values" :key="j"> + {{ each || '-' }} + </view> + </view> + </view> + <view class="button-space"></view> + <view> + <view class="button-green" style="background-color: #fff;border: 2rpx solid #666; color: #666;width: 200rpx;left: 40rpx;right: unset;" + @click="closeParamPopAndQuery"> + 查询 + </view> + + <view class="button-green" style="width: 200rpx;right: 40rpx;left: unset;" @click="closeParamPop">关闭</view> + </view> + </view> + </uni-popup> + </view> </template> <script> + import http from "../../../plugins/http"; + export default { data() { return { query: { + name: '', category: '', - }, - shoptotal:0, - list:[{},{},{}] + zoneId: '', + levelStr: '', + level: '', + column: '', + params: [], + columnStr: '', + }, + categoryInfo: {}, + params: [], + + shoptotal: 0, + list: [], + level_show: false, + level_columns: [ + [] + ], + + order_show: false, + order_columns: [ + [] + ] } }, async onLoad(options) { // this.list = [{},{}] console.log('options', options) this.query.category = options.categoryId || '' + this.query.zoneId = options.zoneId || '' + this.query.name = options.name || '' + if(this.query.name){ + uni.setNavigationBarTitle({ + title:'商品列表-'+this.query.name + }) + } this.listApi = '/api/customer/flower/list' + this.getList('post') + this.$http.request('get', '/api/code/value', { + params: { + type: 'FLOWER_LEVEL' + } + }).then(res => { + var data = res.data + this.level_columns = [data || []] + this.level_columns[0].unshift({ + label: '全部', + value: '' + }) + }) + this.$http.request('get', '/api/code/value', { + params: { + type: 'FLOWER_ORDER_BY' + } + }).then(res => { + var data = res.data + this.order_columns = [data || []] + this.order_columns[0].unshift({ + label: '默认', + value: '' + }) + }) + if (this.query.category) { + await this.getDetail() + } + // await this.getList('post') // this. }, @@ -143,27 +233,118 @@ uni.stopPullDownRefresh() }, methods: { + async getDetail() { + this.$message.showLoading() + //获取到分类的详情信息 + const { + code, + data + } = await this.$http.request('get', '/api/customer/flower/category/tree/view', { + params: { + id: this.query.category + } + }) + this.$message.hideLoading() + if (code == 0) { + this.categoryInfo = data || {} + } + }, + updateValue(item, value) { + item.value = value + this.$set(item, 'value', value) + this.$forceUpdate() + }, + closeParamPop() { + this.$refs.popup_param.close() + }, + closeParamPopAndQuery() { + this.$refs.popup_param.close() + //设置参数 + this.query.params = [] + for (var param of this.params) { + if (param.value) { + this.query.params.push({ + id: param.id, + value: param.value + }) + } + } + this.refreshList('post') + }, + async showSelectParams() { + //得有分类才有参数 + this.$message.showLoading() + const res = await this.$http.request('get', '/api/supplier/flower/params', { + params: { + categoryId: this.query.category + } + }) + this.$message.hideLoading() + if (res.code === 0) { + // this.columns_params = res.data || [] + this.params = res.data || [] + this.$refs.popup_param.open() + } + + }, + select_level(e) { + this.level_show = false + console.log('select_level',e) + this.query.levelStr = e.value[0].label + this.query.level = e.value[0].value + this.refreshList('post') + + }, + select_order(e) { + this.order_show = false + this.query.columnStr = e.value[0].label + this.query.column = e.value[0].value + this.refreshList('post') + + }, toDetail(item) { uni.navigateTo({ url: `/sub_pages/customer/trade/detail?id=${item.id}` }) - }, - mulnum(item) { - if (item.shopnum > 0) { - item.shopnum -= 1 - } - this.shoptotal -= 1 - this.$forceUpdate() - - }, - addnum(item) { - if (item.shopnum) { - item.shopnum += 1 - } else { - item.shopnum = 1 - } - this.shoptotal += 1 - this.$forceUpdate() + }, + // mulnum(item) { + // if (item.shopnum > 0) { + // item.shopnum -= 1 + // } + // this.shoptotal -= 1 + // this.$forceUpdate() + // + // }, + async addnum(item, addnum) { + if (!this.currentInfo.id) { + await this.$message.confirm('请前往登录') + uni.navigateTo({ + url: '/pages/user/supplier-user' + }) + return + } + if (!item.shopnum) { + item.shopnum = 0 + } + if (item.shopnum + addnum >= 0) { + + } else { + return + } + this.$message.showLoading() + const { + code + } = await http.request('post', '/api/customer/flower/cart/change-num', { + data: { + id: item.id, + num: addnum + } + }) + this.$message.hideLoading() + if (code === 0) { + item.shopnum += addnum + } + this.$forceUpdate() }, } } @@ -184,7 +365,7 @@ font-weight: 600; font-size: 36rpx; color: #000000; - line-height: 50rpx; + line-height: 44rpx; } .icon-kf { @@ -207,6 +388,7 @@ background: #FFFFFF; border-radius: 8rpx; min-width: 260rpx; + .title { font-weight: 400; font-size: 24rpx; @@ -218,7 +400,7 @@ font-weight: 600; font-size: 32rpx; color: #BF0000; - line-height: 44rpx; + line-height: 44rpx; margin-top: 12rpx; } @@ -226,41 +408,41 @@ font-weight: 400; font-size: 24rpx; color: #666666; - line-height: 34rpx; + line-height: 34rpx; margin-top: 12rpx; } } } - - .icon-shop { - position: absolute; - position: fixed; - - background-image: url('../../../static/images/customer/gwc.png'); - width: 140rpx; - height: 140rpx; - // box-shadow: 0rpx 4rpx 22rpx 0rpx rgba(0, 0, 0, 0.16); - border-radius: 50%; - right: 40rpx; - bottom: 300rpx; - background-size: 100% 100%; - - .number { - width: 30rpx; - height: 30rpx; - background: #F20000; - line-height: 30rpx; - text-align: center; - position: absolute; - right: 14rpx; - top: 14rpx; - color: #FFFFFF; - border-radius: 50%; - font-size: 24rpx; - } - - } - + + .icon-shop { + position: absolute; + position: fixed; + + background-image: url('../../../static/images/customer/gwc.png'); + width: 140rpx; + height: 140rpx; + // box-shadow: 0rpx 4rpx 22rpx 0rpx rgba(0, 0, 0, 0.16); + border-radius: 50%; + right: 40rpx; + bottom: 300rpx; + background-size: 100% 100%; + + .number { + width: 30rpx; + height: 30rpx; + background: #F20000; + line-height: 30rpx; + text-align: center; + position: absolute; + right: 14rpx; + top: 14rpx; + color: #FFFFFF; + border-radius: 50%; + font-size: 24rpx; + } + + } + } </style> \ No newline at end of file -- Gitblit v1.9.3