称重增加

This commit is contained in:
魏啾
2024-12-06 10:05:06 +08:00
parent 3a5460894b
commit 51f3953459
3 changed files with 362 additions and 35 deletions

View File

@@ -1,17 +1,20 @@
<template>
<view class="u-relative u-flex item">
<up-image :src="data.coverImg" mode="aspectFill" :width="img.width" :height="img.height"></up-image>
<up-image :src="data.coverImg" mode="aspectFill" :width="img.width" :height="img.height"></up-image>
<!-- <image lazy-load class="img" :src="data.coverImg" mode="aspectFill" :style="computedImgStyle()"></image> -->
<view class="info u-flex u-row-between u-col-top u-flex-col" >
<view class="info u-flex u-row-between u-col-top u-flex-col">
<view>
<view>
<text class="u-line-2">{{data.name}}
</text>
<text class="u-line-2">{{data.name}}
</text>
</view>
<view class="u-font-32 font-bold u-m-t-16">
{{data.price}}
</view>
<template v-if="data.type=='weigh'">
<view class="btnweigh">称重</view>
</template>
</view>
<view class="u-flex">
<template v-if="!isSellout">
@@ -20,7 +23,7 @@
</template>
<template v-else>
<view class="u-flex icon-btn">
<view class="u-flex" @tap.stop="emitEvent('add')">
<view class="u-flex" @tap.stop="emitEvent(data.type=='weigh'?'tapweigh':'add')">
<image src="/pagesCreateOrder/static/images/icon-add.svg" class="icon" mode=""></image>
</view>
<template v-if="data.chooseNumber">
@@ -56,20 +59,20 @@
} from 'vue';
import util from '../util.js';
const props = defineProps({
img:{
type:Object,
default:{
width:'250rpx',
height:'272rpx'
img: {
type: Object,
default: {
width: '250rpx',
height: '272rpx'
}
},
index: {
type: [Number,String],
type: [Number, String],
},
isSeatFee:{
isSeatFee: {
//是否为餐位费
type:Boolean,
default:false
type: Boolean,
default: false
},
data: {
type: Object,
@@ -80,36 +83,36 @@
}
}
})
function computedImgStyle(){
function computedImgStyle() {
return {
width:props.img.width,
height:props.img.height
width: props.img.width,
height: props.img.height
}
}
//判断是否是菜品
function isGoods(){
function isGoods() {
return props.data.hasOwnProperty('id')
}
//判断商品是否售尽
const isSellout = computed(() => {
const item = props.data
if(!isGoods()){
if (!isGoods()) {
return false
}
return (
item.isPauseSale ||
(item.typeEnum !== "sku" && item.isStock==1&& item.stockNumber <= 0)
(item.typeEnum !== "sku" && item.isStock == 1 && item.stockNumber <= 0)
);
})
const emits = defineEmits(['add', 'reduce', 'chooseGuige'])
function emitEvent(emitName){
if(isGoods()){
const emits = defineEmits(['add', 'reduce', 'chooseGuige','tapweigh'])
function emitEvent(emitName) {
if (isGoods()) {
emits(emitName, props.index)
}
}
@@ -134,10 +137,24 @@
color: #fff;
}
.btnweigh {
margin: 5rpx 0;
width: 100rpx;
background: linear-gradient(124deg, #73c969 6%, #27921b 93%);
border-radius: 10rpx;
font-size: 24rpx;
padding: 6rpx 0;
text-align: center;
}
.btn-hover-class {
opacity: .6;
}
image{will-change: transform}
image {
will-change: transform
}
.item {
// width: 250rpx;
// height: 272rpx;

View File

@@ -0,0 +1,289 @@
<template>
<view class="">
<up-overlay :show="overlayshow" @click="overlayshow = false">
<view class="boxoverlay">
<view class="rect" @tap.stop>
<view class="title">
<view>
标题
</view>
<view class="" @click="overlayshow = false">
<up-icon name="close" color="#93969b" size="20"></up-icon>
</view>
</view>
<view class="inputtop">
<view class="dj">
<view class="text">单价</view>
<view class="jg">{{form.goods.lowPrice}}/{{form.goods.unitName}}</view>
</view>
<view class="inputdj">
<view>重量</view>
<view class="inputdjbox">
<view class="inputdisplay">{{ currentInput }}</view>
<text>{{ form.goods.unitName }}</text>
</view>
</view>
</view>
<view class="keyboard">
<button v-for="(num, index) in numberButtons" :key="index" @click="handleClick(num)">
{{ num }}
</button>
<button @click="deleteLast"></button>
</view>
<view class="classmoney">
{{ form.goods.lowPrice * currentInput }}
</view>
<view class="classconfirm" @click="clickconfirm">
确认
</view>
</view>
</view>
</up-overlay>
</view>
</template>
<script setup>
import {
onLoad,
onShow,
onReachBottom
} from '@dcloudio/uni-app';
import {
computed,
reactive,
ref,
watch,
defineExpose,
defineEmits
} from 'vue';
const emit = defineEmits(['refresh'])
const currentInput = ref('');
const numberButtons = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '.'];
const handleClick = (value) => {
// 首位不能输入0
if (currentInput.value === '') {
if (value === '0') {
return;
}
}
if (value === '.' && currentInput.value.indexOf('.') !== -1) {
return; // 如果已经存在小数点,不再添加
}
if (value === '.' && currentInput.value === '') {
currentInput.value = '0.';
} else {
currentInput.value += value;
}
// 限制小数点后两位
const parts = currentInput.value.split('.');
if (parts.length > 1 && parts[1].length > 2) {
currentInput.value = currentInput.value.slice(0, -1);
}
};
const deleteLast = () => {
currentInput.value = currentInput.value.slice(0, -1);
};
const clickconfirm = () => {
// 首位不能输入0
if (currentInput.value === '') {
uni.showToast({
title: '请输入'
})
}
emit('weighgoodsUpdate', form.foodsindex, form.index, true, '', currentInput.value)
overlayshow.value = false
}
//显示
const overlayshow = ref(false);
const form = reactive({})
const open = (foodsindex, index, goods) => {
currentInput.value = ''
Object.assign(form, {
foodsindex,
index,
goods
})
console.log(form)
overlayshow.value = true
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
page {
background: #F9F9F9;
}
.boxoverlay {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.rect {
padding: 32rpx 28rpx;
width: 80%;
background-color: #fff;
border-radius: 18rpx;
.title {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 20rpx;
font-size: 40rpx;
border-bottom: 1rpx solid #ccc;
}
.inputtop {
margin-top: 20rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
.dj {
width: 32%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
.text {
font-weight: 300;
font-size: 24rpx;
}
.jg {
margin-top: 16rpx;
background-color: #e8f4ff;
color: #1890ff;
height: 60rpx;
line-height: 60rpx;
padding: 0 20rpx;
font-size: 24rpx;
color: #1890ff;
border-radius: 10rpx;
}
}
.inputdj {
width: 66%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
font-weight: 300;
font-size: 24rpx;
.inputdjbox {
margin-top: 16rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
border: 1rpx solid #ccc;
border-radius: 10rpx;
padding-left: 20rpx;
height: 60rpx;
line-height: 60rpx;
background: #fff;
.inputdisplay {
width: auto;
}
text {
border: 1rpx solid #ccc;
border-radius: 10rpx;
border-radius: 10rpx;
padding: 0 20rpx;
background: #f5f7fa;
color: #a7aaaf;
}
}
}
}
.keyboard {
margin-top: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
button {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 28%;
margin: 10rpx;
}
.keyboard-button {
width: 28%;
margin: 10rpx;
border: none;
border-radius: 5rpx;
box-shadow: 0 0 5rpx rgba(0, 0, 0, 0.3), 0 0 10rpx rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: all 0.3s ease;
}
// .keyboard-button:hover {
// box-shadow: 0 0 10rpx rgba(255, 0, 0, 0.5), 0 0 20px rgba(255, 0, 0, 0.3);
// transform: translateY(-2rpx);
// }
.dot-button {
// background-color: #FFC107;
}
.clear-button {
// background-color: #FF5733;
}
.clear-button:hover {
box-shadow: 0 0 10px rgba(255, 87, 51, 0.5), 0 0 20px rgba(255, 87, 51, 0.3);
}
.delete-button {
// background-color: #33FF57;
}
.delete-button:hover {
// box-shadow: 0 0 10px rgba(51, 255, 87, 0.5), 0 0 20px rgba(51, 255, 87, 0.3);
}
}
.classmoney {
margin-top: 16rpx;
width: 100%;
font-size: 40rpx;
text-align: left;
color: #ff5152;
font-weight: 600;
}
.classconfirm {
width: 100%;
margin: 30rpx auto 0 auto;
border-radius: 16rpx;
text-align: center;
background: #1890ff;
color: #fff;
padding: 10rpx 0;
}
}
}
</style>

View File

@@ -78,7 +78,8 @@
<view class="thumb-box" v-for="(goodsItem, goodsIndex) in item.foods" :key="goodsIndex">
<list-goods-item @chooseGuige="chooseGuige($event,index)"
@add="goodsUpdate($event,index,true)" @reduce="goodsUpdate($event,index,false)"
:index="goodsIndex" :data="goodsItem"></list-goods-item>
@tapweigh="tapweigh($event,index)" :index="goodsIndex"
:data="goodsItem"></list-goods-item>
</view>
<!-- <template v-if="item.name==='附加费'">
@@ -104,6 +105,7 @@
@chooseGuige="chooseGuige(goodsItem.goodsIndex,goodsItem.index)"
@add="searchGoodsUpdate(goodsItem,goodsIndex,true)"
@reduce="searchGoodsUpdate(goodsItem,goodsIndex,false)"
@tapweigh="tapweigh(goodsItem.goodsIndex,goodsItem.index)"
:index="goodsItem.goodsIndex" :data="goodsItem"></list-goods-item>
</view>
</view>
@@ -127,8 +129,8 @@
:skus="guigeModelData.chooseGoods.skus"></guige-model>
<!-- 添加附加费 -->
<my-surcharge @confirm="surchargeConfirm" ref="surcharge" title="添加附加费"></my-surcharge>
<!-- 称重 -->
<weigh-item ref="refweighitem" @weighgoodsUpdate='goodsUpdate'></weigh-item>
</view>
<up-modal title="提示" content="该台桌购物车里有商品,是否清除该台桌里的商品?" :show="modal.clear" showCancelButton closeOnClickOverlay
@confirm="confirmModelConfirm" @cancel="confirmModelConfirm('cancel')" @close="setModalShow('clear',false)"
@@ -151,6 +153,7 @@
import color from '@/commons/color.js';
import guigeModel from './components/guige'
import taocanModel from './components/taocanModel.vue'
import weighItem from './components/weigh.vue'
import listGoodsItem from './components/list-goods-item.vue'
import mySurcharge from './components/surcharge'
import {
@@ -856,6 +859,14 @@
let selGoods = ref({});
// 称重
const refweighitem = ref(null)
const tapweigh = (foodsindex, index) => {
console.log(foodsindex, index)
const goods = data.tabbar[index].foods[foodsindex]
refweighitem.value.open(foodsindex, index, goods)
}
function chooseGuige(foodsindex, index) {
if (!canAddGoods()) {
return infoBox.showToast('请先选择桌台', 0.5).then(res => {
@@ -979,6 +990,7 @@
}
function searchGoodsUpdate(goodsItem, goodsIndex, isAdd) {
console.log(goodsItem.goodsIndex, goodsItem.index, isAdd, goodsIndex, 111111)
goodsUpdate(goodsItem.goodsIndex, goodsItem.index, isAdd, goodsIndex)
}
@@ -987,7 +999,8 @@
searchResult.value[index].chooseNumber = chooseNumber
}
}
async function goodsUpdate(foodsindex, index, isAdd, searchGoodsIndex) {
async function goodsUpdate(foodsindex, index, isAdd, searchGoodsIndex, showCurrentInput) { // showCurrentInput 称重才会传的参数
// if (!canAddGoods()) {
// return infoBox.showToast('请先选择桌台', 0.5).then(res => {
// chooseTable()
@@ -1001,13 +1014,17 @@
});
const productId = $goods.id
const skuId = $goods.specList[0].id
const suit = $goods.specList[0].suit || 1
let suit = $goods.specList[0].suit || 1
// 不影响之前的代码 称重suit单独处理
if ($goods.type == 'weigh' && showCurrentInput) {
suit = showCurrentInput
}
if (goodsInCarIndex !== -1) {
//更新
const carGoods = cars[goodsInCarIndex]
const cartId = carGoods.id
const step = isAdd ? 1 : -1
const num = carGoods.number * 1 + step
let num = carGoods.number * 1 + step
if (num === 0 || num < suit) {
//移除
cars.splice(goodsInCarIndex, 1)
@@ -1017,6 +1034,10 @@
cartId
})
}
// 不影响之前的代码 称重num单独处理
if ($goods.type == 'weigh' && showCurrentInput) {
num = carGoods.number * 1 + Number(showCurrentInput)
}
const {
number
} = await updateCartGoods({