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

增加购物车编辑数量功能

Browse Source
This commit is contained in:
YeMingfei666
2026-01-17 10:36:33 +08:00
parent 0990e08201
commit f090d59dc6
5 changed files with 403 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
config/appConfig.js
View File

@@ -1,5 +1,5 @@
//当前环境 test,prod //当前环境 test,prod
export const ENV = 'test' export const ENV = 'prod'
export const ENV_BASE_URL = { export const ENV_BASE_URL = {
java: { java: {
prod: 'https://cashier.sxczgkj.com/', prod: 'https://cashier.sxczgkj.com/',
@@ -15,6 +15,7 @@ export const ENV_BASE_URL = {
} }
} }
/** /**
* @param {String} env 环境，测试或者正式 * @param {String} env 环境，测试或者正式
* @param {String} apiType 语言，java或者php * @param {String} apiType 语言，java或者php

10
pagesCreateOrder/index/components/car.vue
View File

@@ -41,7 +41,7 @@
:key="index" :key="index"
> >
<view> <view>
<view class="up-line-1">{{ item.name }}</view> <view class="up-line-1" style="max-width: 240rpx;">{{ item.name }}</view>
<view class="u-m-t-10 u-font-24 color-666 up-line-1">{{ <view class="u-m-t-10 u-font-24 color-666 up-line-1">{{
item.specInfo || "" item.specInfo || ""
}}</view> }}</view>
@@ -62,7 +62,7 @@
mode="" mode=""
/> />
</view> </view>
<view class="u-m-l-30 u-m-r-30 color-333"> <view class="u-m-l-30 u-m-r-30 color-333" @tap="changeNumber(item)">
{{ item.number.toFixed(2) }} {{ item.number.toFixed(2) }}
</view> </view>
<view class="u-flex" @tap="updateNumber(true, index, item)"> <view class="u-flex" @tap="updateNumber(true, index, item)">
@@ -328,7 +328,11 @@ function setModalShow(key = "show", show = true, type = "", title = "") {
console.log(modal); console.log(modal);
} }
const edmits = defineEmits(["clear", "updateNumber"]); const edmits = defineEmits(["clear", "updateNumber","changeNumber"]);
function changeNumber(goods){
edmits('changeNumber',goods)
}
// mask // mask
let switchGoods = ref(false); let switchGoods = ref(false);

180
pagesCreateOrder/index/components/list-goods-item.vue
View File

@@ -1,11 +1,6 @@
<template> <template>
<view class="u-relative u-flex item"> <view class="u-relative u-flex item">
<up-image <up-image :src="data.coverImg" mode="aspectFill" :width="img.width" :height="img.height"></up-image>
:src="data.coverImg"
mode="aspectFill"
:width="img.width"
:height="img.height"
></up-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 class="limit-discount" v-if="is_time_discount">限时折扣</view> <view class="limit-discount" v-if="is_time_discount">限时折扣</view>
@@ -15,10 +10,7 @@
</view> </view>
<view> <view>
<text class="u-font-32 font-bold u-m-t-16" v-if="is_time_discount"> ￥{{ limitPrice }} </text> <text class="u-font-32 font-bold u-m-t-16" v-if="is_time_discount"> ￥{{ limitPrice }} </text>
<text <text class="u-font-32 font-bold u-m-t-16" :class="[is_time_discount ? 'line-through' : '']">
class="u-font-32 font-bold u-m-t-16"
:class="[is_time_discount ? 'line-through' : '']"
>
￥{{ data.lowPrice }} ￥{{ data.lowPrice }}
</text> </text>
</view> </view>
@@ -29,78 +21,43 @@
</view> </view>
<view class="u-flex" v-if="!isSellout"> <view class="u-flex" v-if="!isSellout">
<template v-if="data.type == 'sku' || data.groupType == 1"> <template v-if="data.type == 'sku' || data.groupType == 1">
<button <button class="btn" hover-class="btn-hover-class" @tap="emitEvent('chooseGuige')">
class="btn"
hover-class="btn-hover-class"
@tap="emitEvent('chooseGuige')"
>
选规格 选规格
</button> </button>
</template> </template>
<template v-else> <template v-else>
<view class="u-flex icon-btn"> <view class="u-flex icon-btn">
<view
class="u-flex"
@tap.stop="emitEvent(data.type == 'weight' ? 'tapweigh' : 'add')"
>
<image
src="/pagesCreateOrder/static/images/icon-add.svg"
class="icon"
mode=""
></image>
</view>
<template v-if="data.chooseNumber"> <template v-if="data.chooseNumber">
<view class="u-font-32">
{{ data.chooseNumber.toFixed(2) }}
</view>
<view class="u-flex" @tap.stop="emitEvent('reduce')"> <view class="u-flex" @tap.stop="emitEvent('reduce')">
<image <image src="/pagesCreateOrder/static/images/icon-reduce.svg" class="icon" mode="">
src="/pagesCreateOrder/static/images/icon-reduce.svg"
class="icon"
mode=""
>
</image> </image>
</view> </view>
<view class="u-font-32" >
{{ data.chooseNumber.toFixed(2) }}
</view>
</template> </template>
<view class="u-flex" @tap.stop="emitEvent(data.type == 'weight' ? 'tapweigh' : 'add')">
<image src="/pagesCreateOrder/static/images/icon-add.svg" class="icon" mode=""></image>
</view>
</view> </view>
</template> </template>
</view> </view>
<template v-if="isSellout"> <template v-if="isSellout">
<view class="isSellout" v-if="data.isSale == 0"> <view class="isSellout" v-if="data.isSale == 0">
<image <image class="isSellout_icon" src="/pagesCreateOrder/static/images/no-toDown.svg" mode=""></image>
class="isSellout_icon"
src="/pagesCreateOrder/static/images/no-toDown.svg"
mode=""
></image>
</view> </view>
<view <view class="isSellout" v-else-if="
class="isSellout"
v-else-if="
!isProductAvailable(data.days, data.startTime, data.endTime) !isProductAvailable(data.days, data.startTime, data.endTime)
" ">
> <image class="isSellout_icon" src="/pagesCreateOrder/static/images/no-saleTime.svg" mode=""></image>
<image
class="isSellout_icon"
src="/pagesCreateOrder/static/images/no-saleTime.svg"
mode=""
></image>
</view> </view>
<view class="isSellout" v-else-if="data.isSoldStock == 1"> <view class="isSellout" v-else-if="data.isSoldStock == 1">
<image <image class="isSellout_icon" src="/pagesCreateOrder/static/images/no-sold.svg" mode=""></image>
class="isSellout_icon"
src="/pagesCreateOrder/static/images/no-sold.svg"
mode=""
></image>
</view> </view>
<view <view class="isSellout" v-else-if="data.isStock == 1 && data.stockNumber <= 0">
class="isSellout" <image class="isSellout_icon" src="/pagesCreateOrder/static/images/no-stock.svg" mode=""></image>
v-else-if="data.isStock == 1 && data.stockNumber <= 0"
>
<image
class="isSellout_icon"
src="/pagesCreateOrder/static/images/no-stock.svg"
mode=""
></image>
</view> </view>
</template> </template>
</view> </view>
@@ -108,15 +65,19 @@
</template> </template>
<script setup> <script setup>
import { computed, toRef, inject } from "vue"; import {
import util from "../util.js"; computed,
import dayjs from "dayjs"; toRef,
import isBetween from "dayjs/plugin/isBetween.js"; inject
const yskUtils = inject("yskUtils"); } from "vue";
const shopInfo = inject("shopInfo"); import util from "../util.js";
dayjs.extend(isBetween); import dayjs from "dayjs";
import isBetween from "dayjs/plugin/isBetween.js";
const yskUtils = inject("yskUtils");
const shopInfo = inject("shopInfo");
dayjs.extend(isBetween);
const props = defineProps({ const props = defineProps({
img: { img: {
type: Object, type: Object,
default: { default: {
@@ -146,10 +107,10 @@ const props = defineProps({
return {}; return {};
}, },
}, },
}); });
//判断是否是时间折扣商品 //判断是否是时间折扣商品
const is_time_discount = computed(() => { const is_time_discount = computed(() => {
if (!props.limitTimeDiscount || !props.limitTimeDiscount.id) { if (!props.limitTimeDiscount || !props.limitTimeDiscount.id) {
return false; return false;
} }
@@ -162,9 +123,9 @@ const is_time_discount = computed(() => {
"id" "id"
); );
return isCanuse; return isCanuse;
}); });
const limitPrice = computed(() => { const limitPrice = computed(() => {
if (!is_time_discount.value) { if (!is_time_discount.value) {
return 0; return 0;
} }
@@ -177,19 +138,19 @@ const limitPrice = computed(() => {
idKey: "id", idKey: "id",
}); });
return price; return price;
}); });
/** /**
* 判断是否是菜品 * 判断是否是菜品
*/ */
function isGoods() { function isGoods() {
return props.data.hasOwnProperty("id"); return props.data.hasOwnProperty("id");
} }
/** /**
* 判断商品是否售尽 * 判断商品是否售尽
*/ */
const isSellout = computed(() => { const isSellout = computed(() => {
const item = props.data; const item = props.data;
if (!isGoods()) { if (!isGoods()) {
return false; return false;
@@ -200,9 +161,9 @@ const isSellout = computed(() => {
item.isSale == 0 || item.isSale == 0 ||
!isProductAvailable(item.days, item.startTime, item.endTime) !isProductAvailable(item.days, item.startTime, item.endTime)
); );
}); });
// 判断商品是否在可售时间内 // 判断商品是否在可售时间内
function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) { function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
// 将后端返回的字符串转换为数组 // 将后端返回的字符串转换为数组
const sellDays = sellDaysStr.split(","); const sellDays = sellDaysStr.split(",");
const now = dayjs(); const now = dayjs();
@@ -234,37 +195,37 @@ function isProductAvailable(sellDaysStr, startTimeStr, endTimeStr) {
// console.log('当前时间:', now.format('YYYY-MM-DD HH:mm:ss')); // console.log('当前时间:', now.format('YYYY-MM-DD HH:mm:ss'));
const isInRange = now.isBetween(startTime, endTime, null, "[)"); // console.log('当前时间是否在可售时间范围内:', isInRange); const isInRange = now.isBetween(startTime, endTime, null, "[)"); // console.log('当前时间是否在可售时间范围内:', isInRange);
return isInRange; return isInRange;
} }
const emits = defineEmits(["add", "reduce", "chooseGuige", "tapweigh"]); const emits = defineEmits(["add", "reduce", "chooseGuige", "tapweigh"]);
function emitEvent(emitName) { function emitEvent(emitName) {
if (isGoods()) { if (isGoods()) {
emits(emitName, props.index); emits(emitName, props.index);
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.icon { .icon {
width: 48rpx; width: 48rpx;
height: 48rpx; height: 48rpx;
} }
.icon-btn { .icon-btn {
gap: 14rpx; gap: 14rpx;
} }
.btn { .btn {
background: #eb4f4f; background: #eb4f4f;
border-radius: 100rpx; border-radius: 100rpx;
font-size: 28rpx; font-size: 28rpx;
height: 56rpx; height: 56rpx;
line-height: 56rpx; line-height: 56rpx;
color: #fff; color: #fff;
} }
.btnweigh { .btnweigh {
margin: 5rpx 0; margin: 5rpx 0;
width: 100rpx; width: 100rpx;
background: linear-gradient(124deg, #73c969 6%, #27921b 93%); background: linear-gradient(124deg, #73c969 6%, #27921b 93%);
@@ -272,17 +233,17 @@ function emitEvent(emitName) {
font-size: 24rpx; font-size: 24rpx;
padding: 6rpx 0; padding: 6rpx 0;
text-align: center; text-align: center;
} }
.btn-hover-class { .btn-hover-class {
opacity: 0.6; opacity: 0.6;
} }
image { image {
will-change: transform; will-change: transform;
} }
.item { .item {
// width: 250rpx; // width: 250rpx;
// height: 272rpx; // height: 272rpx;
background: #f9b798; background: #f9b798;
@@ -306,9 +267,9 @@ image {
border-radius: 8rpx 8rpx 8rpx 8rpx; border-radius: 8rpx 8rpx 8rpx 8rpx;
overflow: hidden; overflow: hidden;
} }
} }
.isSellout { .isSellout {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
@@ -318,12 +279,14 @@ image {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.isSellout_icon { .isSellout_icon {
height: 60%; height: 60%;
width: 60%; width: 60%;
} }
} }
.limit-discount {
.limit-discount {
background-color: #cc5617; background-color: #cc5617;
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
white-space: nowrap; white-space: nowrap;
@@ -336,10 +299,11 @@ image {
color: #ffffff; color: #ffffff;
border-radius: 0 0rpx 20rpx 0rpx; border-radius: 0 0rpx 20rpx 0rpx;
color: #fff; color: #fff;
} }
.line-through{
.line-through {
font-size: 24rpx; font-size: 24rpx;
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
text-decoration: line-through; text-decoration: line-through;
} }
</style> </style>

90
pagesCreateOrder/index/components/popup-change-number.vue Normal file
View File

@@ -0,0 +1,90 @@
<template>
<view>
<up-popup :show="show" mode="center" @close="show=flase" :close-on-click-overlay="true">
<view class="box">
<view class="u-flex u-row-between">
<text class="u-font-32 font-bold">修改数量</text>
<up-icon name="close" @click="show=false"></up-icon>
</view>
<view class="form-box">
<up-form label-position="left" label-width="auto">
<up-form-item label="数量" required>
<up-number-box inputWidth="200rpx" :step="1"
:integer="integer"
v-model="number"></up-number-box>
</up-form-item>
</up-form>
</view>
<view class="u-m-t-12 u-flex gap-20">
<view class="u-flex-1">
<my-button type="default" @click="show=false">取消</my-button>
</view>
<view class="u-flex-1">
<my-button type="primary" @click="confirm">确认</my-button>
</view>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import {
watch,ref, computed
} from 'vue';
const show = defineModel(false)
const props = defineProps({
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 9999
},
goods: {
type: Object,
default: ()=>{number:0}
}
})
const integer=computed(()=>{
if(props.goods.product_type=="weight"){
return false
}
return true
})
const number = ref(0)
const emits=defineEmits('confirm')
function confirm(){
emits('confirm',{
goods:props.goods,
num:number.value
})
show.value=false
}
watch(() => show.value, (newval) => {
if (newval) {
number.value = props.goods.number||0
} else {
number.value = 0
}
})
</script>
<style lang="scss" scoped>
.box {
width: 690rpx;
border-radius: 16rpx;
padding: 32rpx 28rpx;
}
.form-box {
padding: 20rpx;
}
</style>

27
pagesCreateOrder/index/index.vue
View File

@@ -79,9 +79,9 @@
<view class="u-flex u-m-t-20 u-flex-wrap u-row-between"> <view class="u-flex u-m-t-20 u-flex-wrap u-row-between">
<view class="u-m-b-30" v-for="(goodsItem, goodsIndex) in searchResult" :key="goodsIndex"> <view class="u-m-b-30" v-for="(goodsItem, goodsIndex) in searchResult" :key="goodsIndex">
<list-goods-item :img="{ width: '330rpx', height: '330rpx' }" <list-goods-item :img="{ width: '330rpx', height: '330rpx' }"
:limitTimeDiscount="data.limitTimeDiscount" @chooseGuige=" :limitTimeDiscount="data.limitTimeDiscount"
chooseGuige(goodsItem.goodsIndex, goodsItem.index) @chooseGuige="chooseGuige(goodsItem.goodsIndex, goodsItem.index)"
" @add="searchGoodsUpdate(goodsItem, goodsIndex, true)" @add="searchGoodsUpdate(goodsItem, goodsIndex, true)"
@reduce="searchGoodsUpdate(goodsItem, goodsIndex, false)" @reduce="searchGoodsUpdate(goodsItem, goodsIndex, false)"
@tapweigh="tapweigh(goodsItem.goodsIndex, goodsItem.index)" @tapweigh="tapweigh(goodsItem.goodsIndex, goodsItem.index)"
:index="goodsItem.goodsIndex" :data="goodsItem"></list-goods-item> :index="goodsItem.goodsIndex" :data="goodsItem"></list-goods-item>
@@ -96,6 +96,7 @@
<view class="bottom w-full"> <view class="bottom w-full">
<my-car :isCreateOrderToDetail="isCreateOrderToDetail" @updateNumber="carsNumberChange" :table="data.table" <my-car :isCreateOrderToDetail="isCreateOrderToDetail" @updateNumber="carsNumberChange" :table="data.table"
:data="cars" :orderInfo="data.orderInfo" :limitTimeDiscount="data.limitTimeDiscount" :data="cars" :orderInfo="data.orderInfo" :limitTimeDiscount="data.limitTimeDiscount"
@changeNumber="goodsChangeNumber"
@clear="cleaCart"></my-car> @clear="cleaCart"></my-car>
</view> </view>
<!-- 套餐选择规格 --> <!-- 套餐选择规格 -->
@@ -112,6 +113,9 @@
<text>历史订单</text> <text>历史订单</text>
<text class="num">{{ data.historyOrderNum }}</text> <text class="num">{{ data.historyOrderNum }}</text>
</view> </view>
<!-- 修改购物车数量 -->
<popupChangeNumber v-model="popupChangeNumberData.show" :goods="popupChangeNumberData.data" @confirm="carsNumberChange"></popupChangeNumber>
</view> </view>
</template> </template>
<script setup> <script setup>
@@ -137,6 +141,13 @@
import { import {
stickCount stickCount
} from '@/http/api/product/stick.js' } from '@/http/api/product/stick.js'
import popupChangeNumber from './components/popup-change-number.vue'
const popupChangeNumberData=reactive({
show:false,
data:null
})
import guigeModel from "./components/guige"; import guigeModel from "./components/guige";
import taocanModel from "./components/taocanModel.vue"; import taocanModel from "./components/taocanModel.vue";
import weighItem from "./components/weigh.vue"; import weighItem from "./components/weigh.vue";
@@ -846,6 +857,16 @@
} }
} }
function goodsChangeNumber(e){
console.log(e);
popupChangeNumberData.data=e;
popupChangeNumberData.show=true
}
/** /**
* socket通知购物车商品数量修改处理 * socket通知购物车商品数量修改处理
*/ */