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

This commit is contained in:
mkm 2024-09-13 22:00:07 +08:00
parent 742402180b
commit eae6bf36da
6 changed files with 134 additions and 32 deletions

View File

@ -8,7 +8,7 @@
<view>商品名称</view>
<view>{{ datas.name || datas.goods_name || datas.store_name }}</view>
</view>
<view class="row" v-if="datas.store_info">
<!-- <view class="row" v-if="datas.store_info">
<view>商品规格</view>
<view>{{ datas.store_info}}</view>
</view>
@ -22,6 +22,16 @@
<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"
@click="radioClick" size="large">
</up-tag>
</view>
<view class="row">
<view>商品价格</view>
<view>¥ {{price}}
</view>
</view>
<view class="row" v-if="datas.batch > 0">
<view>起批量</view>
@ -38,18 +48,12 @@
<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>
<span>{{ datas.unit_name }}</span>
</template>
</up-input>
<up-input type="digit" placeholder="请输入重量" border="surround" v-model="datas.cart_num"
@change="valChange" style="width: 100rpx;">
<template #suffix>
<span>{{ datas.unit_name }}</span>
</template>
</up-input>
<!-- <up-number-box :min="0.1" :step="0.1" v-model="datas.cart_num" @change="valChange"></up-number-box> -->
</view>
</view>
@ -79,6 +83,8 @@
} from "vue"
const foucs1 = ref(null)
const checkedProduct = ref(0)
const price = ref(0)
const props = defineProps({
show: {
type: Boolean,
@ -98,8 +104,10 @@
const datas = ref({
cart_num: ''
});
const attr_value = ref({});
const setData = (e) => {
datas.value = e;
attr_value.value = e.attr_value
if (Number(e.batch) > 0) {
datas.value.cart_num = e.batch;
} else {
@ -112,7 +120,10 @@
const close = () => {
emit('close');
}
const radioClick = (key) => {
checkedProduct.value = key
price.value = attr_value.value[key].price
};
const change = () => {
if (+datas.value.cart_num < +datas.value.batch) return uni.$u.toast(
`购买数量不能小于${datas.value.batch}${datas.value.unit_name}`);
@ -195,4 +206,9 @@
/* 缩小 */
}
}
.u-page__tag-item {
display: inline-block;
margin-right: 10rpx;
}
</style>

View File

@ -17,7 +17,7 @@ switch (env) {
WSS_URL = 'wss://ceshi-multi-store.lihaink.cn/pull'
break;
case 'local':
BASE_URL = 'http://192.168.1.22:8545';
BASE_URL = 'http://192.168.1.7:8545';
WSS_URL = 'wss://ceshi-multi-store.lihaink.cn/pull'
break;
default:

62
uni_modules/uview-plus/package-lock.json generated Normal file
View File

@ -0,0 +1,62 @@
{
"name": "uview-plus",
"version": "3.2.14",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "uview-plus",
"version": "3.2.14",
"dependencies": {
"clipboard": "^2.0.11",
"dayjs": "^1.11.3",
"uview-plus": "file:"
},
"engines": {
"HBuilderX": "^3.1.0"
}
},
"node_modules/clipboard": {
"version": "2.0.11",
"resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.11.tgz",
"integrity": "sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==",
"dependencies": {
"good-listener": "^1.2.2",
"select": "^1.1.2",
"tiny-emitter": "^2.0.0"
}
},
"node_modules/dayjs": {
"version": "1.11.13",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.13.tgz",
"integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg=="
},
"node_modules/delegate": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
"integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
},
"node_modules/good-listener": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
"integrity": "sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==",
"dependencies": {
"delegate": "^3.1.2"
}
},
"node_modules/select": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
"integrity": "sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA=="
},
"node_modules/tiny-emitter": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
},
"node_modules/uview-plus": {
"resolved": "",
"link": true
}
}
}

View File

@ -5,21 +5,21 @@
"version": "3.2.14",
"description": "uview-plus已兼容vue3全面的组件和便捷的工具会让您信手拈来如鱼得水",
"keywords": [
"uview",
"uview-plus",
"ui",
"ui",
"uni-app",
"uni-app",
"ui"
],
"main": "index.js",
"uview",
"uview-plus",
"ui",
"ui",
"uni-app",
"uni-app",
"ui"
],
"main": "index.js",
"repository": "https://github.com/ijry/uview-plus",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"sale": {
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
@ -35,8 +35,8 @@
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/uview-plus",
"type": "component-vue"
"npmurl": "https://www.npmjs.com/package/uview-plus",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [],
@ -44,8 +44,8 @@
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
"aliyun": "y",
"alipay": "n"
},
"client": {
"Vue": {
@ -85,9 +85,10 @@
},
"dependencies": {
"clipboard": "^2.0.11",
"dayjs": "^1.11.3"
"dayjs": "^1.11.3",
"uview-plus": "file:"
},
"publishConfig": {
"registry": "https://registry.npmjs.org/"
"registry": "https://registry.npmjs.org/"
}
}

View File

@ -0,0 +1,20 @@
{
"name": "@uview-plus/types",
"version": "3.2.5",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "@uview-plus/types",
"version": "3.2.5",
"license": "MIT",
"dependencies": {
"@uview-plus/types": "file:"
}
},
"node_modules/@uview-plus/types": {
"resolved": "",
"link": true
}
}
}

View File

@ -22,5 +22,8 @@
"homepage": "https://github.com/ijry/uview-plus#readme",
"publishConfig": {
"registry": "https://registry.npmjs.org/"
},
"dependencies": {
"@uview-plus/types": "file:"
}
}