czg_team/cashier_wx
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

增加备注

Browse Source
This commit is contained in:
YeMingfei666
2025-12-17 18:42:01 +08:00
parent 6053e15014
commit 5546e6ccbb
3 changed files with 993 additions and 884 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
pages/product/components/modal.vue Normal file
View File

@@ -0,0 +1,97 @@
<template>
<view>
<up-popup
:show="show"
mode="center"
:safeAreaInsetBottom="mode === 'bottom' ? true : false"
>
<view class="popup-content">
<view class="top u-flex u-row-between">
<text class="font-bold u-font-32 color-333">{{ title }}</text>
<up-icon size="18" name="close" @click="show = false"></up-icon>
</view>
<up-line></up-line>
<scroll-view style="max-height: 50vh" :scroll-y="true">
<slot></slot>
</scroll-view>
<template v-if="showBottom">
<up-line></up-line>
<view class="bottom">
<view class="btn cancel" @click="close">{{ cancelText }}</view>
<view class="btn success" @click="confirm">{{ confirmText }}</view>
</view>
</template>
</view>
</up-popup>
</view>
</template>
<script setup>
const props = defineProps({
mode: {
type: String,
default: "center",
},
title: {
type: String,
default: "标题",
},
confirmText: {
type: String,
default: "确认",
},
cancelText: {
type: String,
default: "取消",
},
showBottom: {
type: Boolean,
default: true,
},
});
const show = defineModel({
type: Boolean,
default: false,
});
const emits = defineEmits(["close", "confirm"]);
function close() {
show.value = false;
emits("close");
}
function confirm() {
emits("confirm");
}
</script>
<style lang="scss">
.popup-content {
background: #fff;
width: 640rpx;
border-radius: 18rpx;
}
.top {
padding: 40rpx 48rpx;
}
.bottom {
padding: 48rpx 52rpx;
display: flex;
justify-content: space-between;
gap: 50rpx;
.btn {
flex: 1;
text-align: center;
padding: 18rpx 60rpx;
border-radius: 100rpx;
font-size: 32rpx;
border: 2rpx solid transparent;
&.success {
background-color: $my-main-color;
color: #fff;
}
&.cancel {
border-color: $my-main-color;
color: $my-main-color;
}
}
}
</style>

232
pages/product/components/shoppingCartes.vue
View File

@@ -1,13 +1,7 @@
<template>
<view>
<up-popup
:show="showCart"
:round="20"
:safeAreaInsetBottom="false"
:zIndex="98"
:overlayStyle="{ zIndex: 98 }"
@close="close"
>
<up-popup :show="showCart" :round="20" :safeAreaInsetBottom="false" :zIndex="98" :overlayStyle="{ zIndex: 98 }"
@close="close">
<view class="cart-list-wrap">
<!-- <view class="cart-header flex-between">
<view class="num">已点 {{ cartLists_count }} 份</view>
@@ -26,23 +20,14 @@
<text class="clear-btn">清空购物车</text>
</view>
</view>
<view
class="shop-item"
v-for="(item, index) in cartList"
:key="item.id"
>
<view class="shop-item" v-for="(item, index) in cartList" :key="item.id">
<view class="shop-item-content">
<view class="cover" v-if="item.productId != -999">
<view class="limit-discount" v-if="showLimitDiscount(item)">
限时折扣
</view>
<up-image
:src="item.coverImg"
width="124rpx"
height="124rpx"
mode="aspectFill"
radius="10"
></up-image>
<up-image :src="item.coverImg" width="124rpx" height="124rpx" mode="aspectFill"
radius="10"></up-image>
</view>
<view class="info">
<view class="name">
@@ -58,34 +43,27 @@
</text>
</view>
<view class="select-sku-wrap" v-if="item.type == 'package'">
<view
v-for="(a, b) in dataprocessing(item.cartListinfo)"
:key="b"
>
<view v-for="(a, b) in dataprocessing(item.cartListinfo)" :key="b">
<!-- <view>{{a.title}}</view> -->
<text
v-for="i in a.goods"
:key="i.proId"
style="margin-left: 4rpx"
>
<text v-for="i in a.goods" :key="i.proId" style="margin-left: 4rpx">
{{ i.proName }}
</text>
</view>
</view>
<view class="u-font-24 color-666 u-flex">
<text style="max-width: 296rpx;" class="u-line-1">备注：</text>
<image @click="editRemark(item)"
src="https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/3/9fe4df7c6c8b4290aa5f78282b143900.png"
style="width: 34rpx;height: 34rpx;"></image>
</view>
<view class="price-wrap" style="padding-top: 0">
<view class="price">
<text class="i">¥</text>
<goodsPrice
:limitDiscount="limitDiscount"
:cart="item"
:shopUserInfo="shopUserInfo"
:shopInfo="shopInfo"
></goodsPrice>
<goodsPrice :limitDiscount="limitDiscount" :cart="item"
:shopUserInfo="shopUserInfo" :shopInfo="shopInfo"></goodsPrice>
<text
class="originalprice" v-if="showLimitDiscount(item)"
>{{ item.salePrice }}</text
>
<text class="originalprice"
v-if="showLimitDiscount(item)">{{ item.salePrice }}</text>
<!-- <text class="originalprice"
v-if="item.originPrice">¥{{item.originPrice}}</text>
@@ -94,33 +72,21 @@
<view class="operation-wrap">
<view class="btn">
<up-icon
color="#E8AD7B"
name="minus-circle"
size="18"
></up-icon>
<view
class="btnClick"
@click="cartListadd(item, '-')"
></view>
<up-icon color="#E8AD7B" name="minus-circle" size="18"></up-icon>
<view class="btnClick" @click="cartListadd(item, '-')"></view>
</view>
<text class="num">{{ ifcartNumber(item) }}</text>
<view class="btn" v-if="item.type != 'package'">
<!-- <up-icon name="plus-circle-fill"
:color="{shopInfo.isVip ==1 && shopInfo.isMemberPrice==1? '#CECECE' : '#E9AB7A'"
size="25"></up-icon> -->
<up-icon
name="plus-circle-fill"
color="#E8AD7B"
size="18"
></up-icon>
<view
class="btnClick"
@click="cartListadd(item, '+')"
></view>
<up-icon name="plus-circle-fill" color="#E8AD7B"
size="18"></up-icon>
<view class="btnClick" @click="cartListadd(item, '+')"></view>
</view>
</view>
</view>
</view>
</view>
</view>
@@ -129,19 +95,65 @@
</scroll-view>
</view>
</up-popup>
<model v-model="modelData.show" title="单品备注" @confirm="modelDataConfirm">
<view class="u-p-40">
<up-input v-model="modelData.item.cartListinfo.remark" placeholder="备注"></up-input>
</view>
</model>
</view>
</template>
<script setup>
import { ref, defineProps, computed, defineEmits, watch } from "vue";
import { productStore } from "@/stores/user.js";
import goodsPrice from "@/components/goods-price.vue";
import * as orderUtils from "@/utils/order-utils.js";
import {
ref,
defineProps,
computed,
defineEmits,
watch,
reactive
} from "vue";
import {
productStore
} from "@/stores/user.js";
import goodsPrice from "@/components/goods-price.vue";
import * as orderUtils from "@/utils/order-utils.js";
import model from './modal.vue'
const modelData = reactive({
show: false,
item: {
cartListinfo:{
remark: ''
}
}
})
// 定义自定义事件
const emits = defineEmits(["customevent", "close", "clickcancelOrder"]);
function editRemark(item) {
console.log('editRemark', item)
modelData.item = item
modelData.show = true
}
const props = defineProps({
function modelDataConfirm() {
emits('customevent', {
id: modelData.item.cartListinfo.id,
product_id: modelData.item.cartListinfo.product_id,
sku_id: modelData.item.cartListinfo.sku_id,
number: modelData.item.cartListinfo.number,
type: "shopping",
table_code: uni.cache.get('tableCode'),
shop_id: uni.cache.get('shopId'),
operate_type: "edit",
remark:modelData.item.cartListinfo.remark
})
modelData.show = false
}
// 定义自定义事件
const emits = defineEmits(["customevent", "close", "clickcancelOrder", 'updateRemark']);
const props = defineProps({
nextFullAmountActivty: {
type: Object,
},
@@ -166,11 +178,11 @@ const props = defineProps({
type: Object,
default: {},
},
});
});
function showLimitDiscount(item){
if (!props.limitDiscount||!props.limitDiscount.id) {
function showLimitDiscount(item) {
if (!props.limitDiscount || !props.limitDiscount.id) {
return false;
}
return orderUtils.canUseLimitTimeDiscount(
@@ -180,21 +192,20 @@ function showLimitDiscount(item){
shopUserInfo.value,
"id"
);
}
}
watch(
watch(
() => props.cartList,
(newCartList) => {
console.log("购物车数据变化", newCartList);
},
{
}, {
deep: true,
}
);
const shopInfo = ref(uni.cache.get("shopInfo"));
const shopUserInfo = ref(uni.cache.get("shopUserInfo"));
);
const shopInfo = ref(uni.cache.get("shopInfo"));
const shopUserInfo = ref(uni.cache.get("shopUserInfo"));
function returnRealPrice(cart) {
function returnRealPrice(cart) {
const price = orderUtils.returnPrice({
goods: cart,
shopInfo: shopInfo,
@@ -205,10 +216,10 @@ function returnRealPrice(cart) {
console.log("returnRealPrice", price);
}
return price;
}
}
// 定义 ifcartNumber 计算属性方法
const ifcartNumber = computed(() => {
// 定义 ifcartNumber 计算属性方法
const ifcartNumber = computed(() => {
return (item) => {
// 如果 item 为空或者 cartNumber 不是字符串类型，返回 0
if (!item || typeof item.cartNumber !== "string") {
@@ -230,13 +241,13 @@ const ifcartNumber = computed(() => {
// 如果类型不匹配，返回原始值
return item.cartNumber;
};
});
});
const close = () => {
const close = () => {
emits("close", false);
};
// 购物车加减
const cartListadd = async (item, i) => {
};
// 购物车加减
const cartListadd = async (item, i) => {
// 是否起售 如果小于或者大于都是1
const cartNumberFloat = parseFloat(item.cartNumber);
const suitNum =
@@ -247,21 +258,18 @@ const cartListadd = async (item, i) => {
type: "shopping",
table_code: uni.cache.get("tableCode"),
shop_id: uni.cache.get("shopId"),
operate_type:
calculateValue(item.cartNumber, i, suitNum) == "del"
? "del"
: item.cartListId && item.cartNumber > 0
? "edit"
: "add",
operate_type: calculateValue(item.cartNumber, i, suitNum) == "del" ?
"del" : item.cartListId && item.cartNumber > 0 ?
"edit" : "add",
product_id: item.id,
sku_id: item.skuId,
number: await calculateValue(item.cartNumber, i, suitNum),
is_print: 1,
suitNum: item.suitNum,
});
};
};
const dataprocessing = computed(() => {
const dataprocessing = computed(() => {
return (item) => {
let res = null;
try {
@@ -271,9 +279,9 @@ const dataprocessing = computed(() => {
}
return res;
};
});
});
const clickcancelOrder = (i, key) => {
const clickcancelOrder = (i, key) => {
emits("clickcancelOrder", {
i,
key,
@@ -284,9 +292,9 @@ const clickcancelOrder = (i, key) => {
shop_id: uni.cache.get("shopId"),
operate_type: "clearOrder",
});
};
};
const calculateValue = (cartNumber, i, step = 1) => {
const calculateValue = (cartNumber, i, step = 1) => {
if (i == "+") {
const result = parseFloat(cartNumber) + parseFloat(step);
return result.toFixed(2);
@@ -295,10 +303,10 @@ const calculateValue = (cartNumber, i, step = 1) => {
const result = parseFloat(cartNumber) - parseFloat(step);
return result == 0 ? "del" : result.toFixed(2);
}
};
};
// 菜品备注修改
const productBlur = (item) => {
// 菜品备注修改
const productBlur = (item) => {
let params = {
skuId: item.skuId,
num: item.number, //数量
@@ -311,26 +319,27 @@ const productBlur = (item) => {
tableId: this.tableCode,
};
this.$emit("addCart", params);
};
};
// 清空购物车
const cartclear = () => {
// 清空购物车
const cartclear = () => {
emits("customevent", {
type: "shopping",
table_code: uni.cache.get("tableCode"),
shop_id: uni.cache.get("shopId"),
operate_type: "cleanup",
});
};
};
</script>
<style lang="scss">
.clear-btn {
.clear-btn {
color: #333;
font-size: 24rpx;
font-weight: 500;
}
.cart-list-wrap {
}
.cart-list-wrap {
.cart-header {
display: flex;
height: 72rpx;
@@ -364,9 +373,11 @@ const cartclear = () => {
.list-wrap {
padding: 0 28rpx;
&.pb-20{
&.pb-20 {
padding-bottom: 20px;
}
.ShoppingCart {
font-size: 30rpx;
text-align: left;
@@ -390,8 +401,10 @@ const cartclear = () => {
display: flex;
justify-content: center;
align-items: center;
.cover {
position: relative;
.limit-discount {
position: absolute;
background: #cc5617;
@@ -454,7 +467,7 @@ const cartclear = () => {
}
.price-wrap {
margin-top: 16rpx;
margin-top: 8rpx;
display: flex;
align-items: center;
justify-content: space-between;
@@ -470,8 +483,7 @@ const cartclear = () => {
color: #333333;
}
.i {
}
.i {}
.price {
font-family: Source Han Sans CN, Source Han Sans CN;
@@ -918,5 +930,5 @@ const cartclear = () => {
position: relative;
}
}
}
}
</style>