feat: 优化商品弹窗逻辑,添加商品规格和价格展示

This commit is contained in:
mkm 2024-09-14 17:51:32 +08:00
parent b8806a4cad
commit 3bb57fb887
7 changed files with 48 additions and 54 deletions

View File

@ -6,53 +6,34 @@
</view>
<view class="row">
<view>商品名称</view>
<view>{{ datas.name || datas.goods_name || datas.store_name }}</view>
<view>{{ datas.sku_name}}</view>
</view>
<!-- <view class="row" v-if="datas.store_info">
<view>商品规格</view>
<view>{{ datas.store_info}}</view>
</view>
<view class="row">
<view>商品单位</view>
<view >{{ datas.unit_name }}
</view>
</view>
<view class="row">
<view>商品价格</view>
<view>¥ {{priceKey.off_activity==1? datas[priceKey.price]: datas[priceKey.op_price] }} /
{{ datas.unit_name }}
</view>
</view> -->
<view class="u-page__tag-item" v-for="(item, index) in datas.attr_value" :key="index">
<up-tag :text="item.sku_name" :plain="checkedProduct!=index" type="warning" :name="index"
<view style="border-bottom: 1rpx solid #f6f6f6;margin-bottom: 0.625rem;padding-bottom: 0.625rem;">
<view class="u-page__tag-item" v-for="(item, index) in attr_value" :key="index">
<up-tag :text="item.sku_name" :plain="checkedProduct!=index" type="success" :name="index"
@click="radioClick" size="large">
</up-tag>
</view>
<view class="row">
</view>
<!-- <view class="row">
<view>商品价格</view>
<view>¥ {{price}}
<view>¥ {{price}}/
</view>
</view>
<view class="row" v-if="datas.batch > 0">
</view> -->
<!-- <view class="row" v-if="datas.batch > 0">
<view>起批量</view>
<view>{{ datas.batch }}{{ datas.unit_name }}起批 </view>
</view>
<view class="row">
<view>小计</view>
<view style="color: #F55726;" v-if="+datas.cart_num < +datas.batch">
{{ `${datas.batch}${datas.unit_name}起批` }}
</view>
<view style="color: #F55726;" v-else>¥ {{ subtotal }}</view>
</view>
</view> -->
<view v-if="datas.is_bulk" class="row" style="height: 100rpx;">
<view>购买重量<text style="color: #F55726;">*</text></view>
<view style="justify-content: end;">
<up-input type="digit" placeholder="请输入重量" border="surround" v-model="datas.cart_num"
@change="valChange" style="width: 100rpx;">
<template #suffix>
<!-- <template #suffix>
<span>{{ datas.unit_name }}</span>
</template>
</template> -->
</up-input>
<!-- <up-number-box :min="0.1" :step="0.1" v-model="datas.cart_num" @change="valChange"></up-number-box> -->
</view>
@ -63,6 +44,13 @@
<up-number-box :min="0" v-model="datas.cart_num" @change="valChange"></up-number-box>
</view>
</view>
<view class="row">
<view>小计</view>
<view style="color: #F55726;" v-if="+datas.cart_num < +datas.batch">
{{ `${datas.batch}${datas.unit_name}起批` }}
</view>
<view style="color: #F55726;" v-else>¥ {{ subtotal }}</view>
</view>
<view class="row" style="padding-top: 30px;padding-bottom: 30rpx;">
<view style="width: 30%;margin-right: 30rpx;">
<up-button @click="close" color="#f7f7f7"><text style="color: #333;">取消</text></up-button>
@ -106,10 +94,10 @@
});
const attr_value = ref({});
const setData = (e) => {
datas.value = e;
datas.value = e.attr_value[0]
attr_value.value = e.attr_value
if (Number(e.batch) > 0) {
datas.value.cart_num = e.batch;
if (Number(e.attr_value[0].batch) > 0) {
datas.value.cart_num = e.attr_value[0].batch;
} else {
datas.value.cart_num = 1;
}
@ -122,7 +110,12 @@
}
const radioClick = (key) => {
checkedProduct.value = key
price.value = attr_value.value[key].price
datas.value = attr_value.value[key]
if (Number(datas.value.batch) > 0) {
datas.value.cart_num = datas.value.batch;
} else {
datas.value.cart_num = 1;
}
};
const change = () => {
if (+datas.value.cart_num < +datas.value.batch) return uni.$u.toast(

View File

@ -3,9 +3,9 @@ let WSS_URL
import store from "@/store/user.js"
// 环境
// let env = "dev"
let env = "prod"
// let env = "prod"
// let env = "release";
// let env = "local";
let env = "local";
switch (env) {
case 'dev':
@ -17,7 +17,7 @@ switch (env) {
WSS_URL = 'wss://ceshi-multi-store.lihaink.cn/pull'
break;
case 'local':
BASE_URL = 'http://192.168.1.7:8545';
BASE_URL = 'http://192.168.1.22:8545';
WSS_URL = 'wss://ceshi-multi-store.lihaink.cn/pull'
break;
default:

View File

@ -33,7 +33,7 @@
<view class="shop-content">
<view class="title">
<view class="name u-line-2">{{item.goods_name}}</view>
<view class="tip u-line-1">{{item.unit_name}}</view>
<view class="tip u-line-1">{{item.sku_name}}</view>
<view v-if="priceKey.off_activity==1" class="tip u-line-1">原价<text
style="text-decoration: line-through;">{{item[priceKey.op_price]}}</text>
</view>
@ -41,7 +41,7 @@
<view class="price-btn">
<view class="price">{{item[priceKey.price]}}</view>
<view class="btn">
<view class="num">{{item.cart_num}}</view>
<view class="num">{{item.cart_num}}/{{item.unit_name}}</view>
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
</view>
</view>

View File

@ -447,7 +447,7 @@
getGoodList();
}
const addCart = (product_id, cart_num) => { //
const addCart = (product_id, cart_num,attr_value_id) => { //
console.log("触发了加入购物车")
cartCreateApi({
@ -456,7 +456,8 @@
is_new: 0, // 01
// goods_id: id,
store_id: STORE_INFO.id,
product_id: product_id
product_id: product_id,
attr_value_id:attr_value_id
}).then(res => {
getCartList();
}).catch(err => {
@ -688,7 +689,7 @@
});
console.log('data', data)
addCart(data.product_id, data.cart_num);
addCart(data.product_id, data.cart_num,data.id);
}

View File

@ -97,7 +97,7 @@
<view>¥{{item.price}}</view>
</view>
<view class="tips">
<view>{{}}</view>
<view>{{item.sku_name}}</view>
<view>x{{item.nums}}{{item.unit_name}}</view>
</view>
</view>

View File

@ -19,19 +19,19 @@
<image class="image" :src="item.image"></image>
<view style="width: 520rpx;">
<view class="" style="display: flex;justify-content: space-between;">
<view>
<view style="color: black;font-size: 30rpx;">
{{item.store_name}}
</view>
<view style="font-size: 32rpx;">
<view style="font-size: 24rpx;">
{{item.price}}
</view>
</view>
<view class="" style="display: flex;justify-content: space-between;">
<view>
{{item.unit_name}}
{{item.sku_name}}
</view>
<view style="font-size: 32rpx;">
x{{item.cart_num}}
<view style="font-size: 24rpx;">
x{{item.cart_num}}/{{item.unit_name}}
</view>
</view>
</view>

View File

@ -43,8 +43,8 @@
<view>¥{{ item.price }}</view>
</view>
<view class="tips">
<view>{{ item.unit_name }}</view>
<view>x{{ item.cart_num }}</view>
<view>{{ item.sku_name }}</view>
<view>x{{ item.cart_num }}/{{ item.unit_name }}</view>
</view>
</view>
<view class="time">