From a432d670ff6d6df5b5a8bed2c86dc20ac0e43d8a Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期三, 24 七月 2024 11:27:51 +0800 Subject: [PATCH] update 关注和商铺详情 --- sub_pages/customer/self/follow.vue | 21 - sub_pages/customer/shop/shop.vue | 587 +++++++++++++++++++++++++++------------------------- 2 files changed, 313 insertions(+), 295 deletions(-) diff --git a/sub_pages/customer/self/follow.vue b/sub_pages/customer/self/follow.vue index ca6531d..dd70359 100644 --- a/sub_pages/customer/self/follow.vue +++ b/sub_pages/customer/self/follow.vue @@ -40,22 +40,13 @@ url: '/sub_pages/customer/shop/shop?id=' + (item.id || '') }) }, - clearFollow(item) { + async clearFollow(item) { this.$message.showLoading() - // var res; - // if(type){ - // res = await this.$http.request('post',`/api/follow/add`,{ - // data:{ - // supplierId:this.dto.supplierId || this.dto.id - // } - // }) - // }else{ - // res = await this.$http.request('get',`/api/follow/add`,{ - // data:{ - // supplierId:this.dto.supplierId || this.dto.id - // } - // }) - // } + const {code} = await this.$http.request('get', `/api/follow/delete`, { + params: { + supplierId: item.id + } + }) this.$message.hideLoading() if (code === 0) { //删除list里的本元素 diff --git a/sub_pages/customer/shop/shop.vue b/sub_pages/customer/shop/shop.vue index a8621bc..496e493 100644 --- a/sub_pages/customer/shop/shop.vue +++ b/sub_pages/customer/shop/shop.vue @@ -1,312 +1,339 @@ <template> - <view class="brand-detail"> + <view class="brand-detail"> - <view class="brand-top-info"> - <view class="search-container m-t-12 flex"> - <view class="flex1 input"> - <u-input placeholder="请输入花名" v-model="search_flow"> - <template slot="suffix"> - <uni-icons color="#20613D" type="search" size="24" @tap="buttonSearchFlow"></uni-icons> - </template> - </u-input> - </view> - </view> - <view class="info-brand m-t-12" v-if="shopid"> - <view class="flex"> - <image class="store-logo"></image> - <view> - <view class="store-name">花仙子</view> - <view class="store-address">云南省-昆明市-官渡区</view> - </view> - <view class="store-sc m-l-a m-r-0"> - <image src="../../../static/icon-gz-1.png" class="icon" v-if="dto.gz" @click="updateGz(false)"></image> - <image src="../../../static/icon-gz-0.png" class="icon" v-if="!dto.gz" @click="updateGz(true)"></image> - 关注 - </view> - </view> - </view> - <view class="tj-info m-t-12"> - <view class="form-item"> - <view class="value">0</view> - <view class="label">发布</view> - </view> - <view class="form-item"> - <view class="value">0</view> - <view class="label">获赞</view> - </view> - <view class="form-item"> - <view class="value">0</view> - <view class="label">粉丝</view> - </view> - <view class="form-item"> - <view class="value">0</view> - <view class="label">关注</view> - </view> - </view> - <top-tabs :tabs="tabs" :flg="flg" @change="changeTab"> + <view class="brand-top-info"> + <view class="search-container m-t-12 flex"> + <view class="flex1 input"> + <u-input placeholder="请输入花名" v-model="search_flow"> + <template slot="suffix"> + <uni-icons color="#20613D" type="search" size="24" @tap="buttonSearchFlow"></uni-icons> + </template> + </u-input> + </view> + </view> + <view class="info-brand m-t-12" v-if="id"> + <view class="flex"> + <image class="store-logo"></image> + <view> + <view class="store-name">花仙子</view> + <view class="store-address">云南省-昆明市-官渡区</view> + </view> + <view class="store-sc m-l-a m-r-0"> + <image src="../../../static/icon-gz-1.png" class="icon" v-if="dto.followed" + @click="updateGz(false)"></image> + <image src="../../../static/icon-gz-0.png" class="icon" v-if="!dto.followed" + @click="updateGz(true)"></image> + 关注 + </view> + </view> + </view> + <view class="tj-info m-t-12"> + <view class="form-item"> + <view class="value">0</view> + <view class="label">发布</view> + </view> + <view class="form-item"> + <view class="value">0</view> + <view class="label">获赞</view> + </view> + <view class="form-item"> + <view class="value">0</view> + <view class="label">粉丝</view> + </view> + <view class="form-item"> + <view class="value">0</view> + <view class="label">关注</view> + </view> + </view> + <top-tabs :tabs="tabs" :flg="flg" @change="changeTab"> - </top-tabs> - </view> - <view class="brand-info"> - <view v-if="flg==='0'" class="brand-info-0"> - <view class="component-filter-container" style="padding-top: 12rpx;"> - <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> - </view> - <view class="top-title"> - 报价已包含打包费、材料费、交易佣金 - </view> - <view class="component-shop-item flex" v-for="(item,index) of list" :key="index" - @click="toDetail(item)"> - <view class="img"> - <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"> - </image> - <view class="level"> - A级 - </view> - </view> + </top-tabs> + </view> + <view class="brand-info"> + <view v-if="flg==='0'" class="brand-info-0"> + <view class="component-filter-container" style="padding-top: 12rpx;"> + <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> + </view> + <view class="top-title"> + 报价已包含打包费、材料费、交易佣金 + </view> + <view class="component-shop-item flex" v-for="(item,index) of list" :key="index" + @click="toDetail(item)"> + <view class="img"> + <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"> + </image> + <view class="level"> + A级 + </view> + </view> - <view class="m-l-12 info-container flex1"> - <view class="title"> - 橙色芭比 - <view class="price"> - ¥6.60/扎 - </view> - </view> - <view class="shop-name"> - 牛油果泡泡·白色 - </view> - <view class="other-info flex"> - <view class="m-r-15"> - 已售:7 - </view> - <view class="m-r-15"> - 剩余:13 - </view> - <view class="m-r-15"> - 1支/扎 - </view> - </view> - <view class="bottom-buttons flex"> + <view class="m-l-12 info-container flex1"> + <view class="title"> + 橙色芭比 + <view class="price"> + ¥6.60/扎 + </view> + </view> + <view class="shop-name"> + 牛油果泡泡·白色 + </view> + <view class="other-info flex"> + <view class="m-r-15"> + 已售:7 + </view> + <view class="m-r-15"> + 剩余:13 + </view> + <view class="m-r-15"> + 1支/扎 + </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> - <uni-icons v-if="!item.shopnum||item.shopnum<=99" type="plus-filled" size="32" - @click.stop="addnum(item)"></uni-icons> - </view> - </view> - </view> - </view> + <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> + <uni-icons v-if="!item.shopnum||item.shopnum<=99" type="plus-filled" size="32" + @click.stop="addnum(item)"></uni-icons> + </view> + </view> + </view> + </view> - </view> + </view> - <view v-if="flg==='1'" class="brand-info-1"> - <trade :hidefooter="true"></trade> - </view> - <view v-if="flg==='2'" class="brand-info-3"> - <view class="title"> - 基础信息 - </view> - <view class="form-input"> - <view class="label">经营模式</view> - <view class="value">供应商</view> - </view> - <view class="form-input"> - <view class="label">身份认证</view> - <view class="value">个人身份认证</view> - </view> - </view> - </view> + <view v-if="flg==='1'" class="brand-info-1"> + <trade :hidefooter="true"></trade> + </view> + <view v-if="flg==='2'" class="brand-info-3"> + <view class="title"> + 基础信息 + </view> + <view class="form-input"> + <view class="label">经营模式</view> + <view class="value">供应商</view> + </view> + <view class="form-input"> + <view class="label">身份认证</view> + <view class="value">个人身份认证</view> + </view> + </view> + </view> - </view> + </view> </template> <script> - import trade from '@/sub_pages/customer/trade/trade.vue' - export default { - components: { - trade, - }, - data() { - return { - shopid: 'test', - search_flow: '', - flg: '0', - tabs: [{ - name: '全部商品' - }, - { - name: '分类' - }, - // { - // name: '评价' - // }, - { - name: '商家' - }, - ], - dto: {}, - list: [{}, {}] - } - }, - methods: { - //update 关注 - async updateGz(type){ - this.$message.showLoading() - // var res; - // if(type){ - // res = await this.$http.request('post',`/api/follow/add`,{ - // data:{ - // supplierId:this.dto.supplierId || this.dto.id - // } - // }) - // }else{ - // res = await this.$http.request('get',`/api/follow/add`,{ - // data:{ - // supplierId:this.dto.supplierId || this.dto.id - // } - // }) - // } - this.$message.hideLoading() - if(code===0){ - this.dto.gz = !this.dto.gz - await this.$store.dispatch('sign_add', 'follow') - } +import trade from '@/sub_pages/customer/trade/trade.vue' - +export default { + components: { + trade, + }, + data() { + return { + search_flow: '', + flg: '0', + tabs: [{ + name: '全部商品' }, - changeTab(flg) { - this.flg = flg - //如果没有加载数据,需要加载一下 + { + name: '分类' + }, + // { + // name: '评价' + // }, + { + name: '商家' + }, + ], + dto: {}, + list: [{}, {}], + id: '', + } + }, + onLoad(options) { + this.id = options.id || '' + if (this.id) { + this.getDetail() + } + }, + methods: { + async getDetail() { + this.$message.showLoading() + const { + code, + data + } = await this.$http.request('get', `/api/pub/supplier/detail/${this.id}`, { + params: {} + }) + if (code === 0) { + this.dto = { + ...data, + } + } - }, - buttonSearchFlow() { + this.$message.hideLoading() - }, - mulnum(item) { - if (item.shopnum > 0) { - item.shopnum -= 1 - } - this.shoptotal -= 1 - this.$forceUpdate() + }, + //update 关注 + async updateGz(type) { + this.$message.showLoading() + const {code} = await this.$http.request(type ? 'post' : 'get', `/api/follow/${type ? 'add' : 'delete'}`, { + data: { + supplierId: this.dto.supplierId || this.dto.id + }, + params: { + supplierId: this.dto.supplierId || this.dto.id + } + }) + this.$message.hideLoading() + if (code === 0) { + this.dto.followed = !this.dto.followed + await this.$store.dispatch('sign_add', 'follow') + } - }, - addnum(item) { - if (item.shopnum) { - item.shopnum += 1 - } else { - item.shopnum = 1 - } - this.shoptotal += 1 - this.$forceUpdate() - }, - } - } + + }, + changeTab(flg) { + this.flg = flg + //如果没有加载数据,需要加载一下 + + }, + buttonSearchFlow() { + + }, + 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() + }, + } +} </script> <style lang="scss" scoped> - .brand-detail { - .brand-info { - background: #FFFFFF; - border-radius: 40rpx 40rpx 0rpx 0rpx; - padding: 40rpx 32rpx; +.brand-detail { + .brand-info { + background: #FFFFFF; + border-radius: 40rpx 40rpx 0rpx 0rpx; + padding: 40rpx 32rpx; - .brand-info-0 { - .top-title { - height: 54rpx; - background: #E4ECE8; - border-radius: 4rpx; - font-weight: 400; - font-size: 24rpx; - color: #779787; - line-height: 80rpx; - } - } + .brand-info-0 { + .top-title { + height: 54rpx; + background: #E4ECE8; + border-radius: 4rpx; + font-weight: 400; + font-size: 24rpx; + color: #779787; + line-height: 80rpx; + } + } - .brand-info-3 { - .title { - font-weight: 600; - font-size: 32rpx; - color: #000000; - line-height: 44rpx; - margin-bottom: 20rpx; - } + .brand-info-3 { + .title { + font-weight: 600; + font-size: 32rpx; + color: #000000; + line-height: 44rpx; + margin-bottom: 20rpx; + } - .form-item { - display: flex; - border-bottom: 2rpx solid #EEEEEE; + .form-item { + display: flex; + border-bottom: 2rpx solid #EEEEEE; - .label { - font-weight: 400; - font-size: 28rpx; - color: #000000; - line-height: 40rpx; - } + .label { + font-weight: 400; + font-size: 28rpx; + color: #000000; + line-height: 40rpx; + } - .value { - font-weight: 400; - font-size: 28rpx; - color: #666666; - line-height: 40rpx; - margin-left: auto; - text-align: right; + .value { + font-weight: 400; + font-size: 28rpx; + color: #666666; + line-height: 40rpx; + margin-left: auto; + text-align: right; - .check { - background: #20613D; - border-radius: 4rpx; - } - } - } - } - } + .check { + background: #20613D; + border-radius: 4rpx; + } + } + } + } + } - .brand-top-info { - background-image: url('https://hmy-flower.oss-cn-shanghai.aliyuncs.com/37/37dc02b58bd44af79e45031af2bb6c0b%E4%BD%8D%E5%9B%BE@2x.png'); - - .tj-info{ - display: flex; - .form-item{ - flex: 1; - text-align: center; - .label{ - font-weight: 400; - font-size: 32rpx; - color: #FFFFFF; - line-height: 44rpx; - } - .value{ - font-weight: 600; - font-size: 48rpx; - color: #FFFFFF; - line-height: 66rpx; - } - } - } - .search-container { - display: flex; - margin: 12rpx 0rpx 20rpx 0rpx; - position: relative; - z-index: 1; + .brand-top-info { + background-image: url('https://hmy-flower.oss-cn-shanghai.aliyuncs.com/37/37dc02b58bd44af79e45031af2bb6c0b%E4%BD%8D%E5%9B%BE@2x.png'); - .input { + .tj-info { + display: flex; - background-color: #fff !important; + .form-item { + flex: 1; + text-align: center; - border-radius: 8rpx; - } + .label { + font-weight: 400; + font-size: 32rpx; + color: #FFFFFF; + line-height: 44rpx; + } - } - } - } + .value { + font-weight: 600; + font-size: 48rpx; + color: #FFFFFF; + line-height: 66rpx; + } + } + } + + .search-container { + display: flex; + margin: 12rpx 0rpx 20rpx 0rpx; + position: relative; + z-index: 1; + + .input { + + background-color: #fff !important; + + border-radius: 8rpx; + } + + } + } +} </style> \ No newline at end of file -- Gitblit v1.9.3