代客下单修改，登录页面修改，部分页面调整，请求封装调整
This commit is contained in:
224
pagesCreateOrder/table-order/components/goods-list.vue
Normal file
224
pagesCreateOrder/table-order/components/goods-list.vue
Normal file
@@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<view class="table">
|
||||
<view class="header">
|
||||
<text>商品</text>
|
||||
<view class="u-flex" style="gap: 54rpx">
|
||||
<text>数量</text>
|
||||
<text>单价</text>
|
||||
<text>小计</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view
|
||||
v-for="(item, index) in cartStore.allCartList"
|
||||
:key="index"
|
||||
class="item transition"
|
||||
@click="itemClick(item)"
|
||||
:class="[isSelected(item) ? 'isSelected' : '']"
|
||||
>
|
||||
<view class="u-flex">
|
||||
<text>{{ item.productName }}</text>
|
||||
<view class="u-flex gap-10" style="margin-left: 40rpx">
|
||||
<text class="status gift" v-if="item.isGift">赠</text>
|
||||
<template v-if="item.subStatus">
|
||||
<text
|
||||
class="status "
|
||||
:class="[
|
||||
returnSubStatusText(item) == '已超时' ? 'timeout' : '',
|
||||
returnStatusClass(item),
|
||||
]"
|
||||
>{{ returnSubStatusText(item) }}</text
|
||||
>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex" style="gap: 54rpx">
|
||||
<text>{{ item.num }}</text>
|
||||
<view class="u-flex u-relative">
|
||||
<text class="limit-price" v-if="showOldPrice">
|
||||
{{ returnPrice(item) }}
|
||||
</text>
|
||||
|
||||
<text
|
||||
class="origin-price"
|
||||
:class="[showOldPrice ? 'old-price' : '']"
|
||||
>{{ item.price }}</text
|
||||
>
|
||||
</view>
|
||||
|
||||
<text>{{
|
||||
BigNumber(item.num).times(returnPrice(item)).toFixed(2)
|
||||
}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, inject, ref, watch } from "vue";
|
||||
import dayjs from "dayjs";
|
||||
import BigNumber from "bignumber.js";
|
||||
const cartStore = inject("cartStore");
|
||||
const yskUtils = inject("yskUtils");
|
||||
function isSelected(item) {
|
||||
return selCart.value && item.id === selCart.value.id;
|
||||
}
|
||||
|
||||
function showOldPrice(item) {
|
||||
return item.isTimeDiscount ||item.isGift || item.discountSaleAmount * 1 > 0;
|
||||
}
|
||||
|
||||
const nowTime = ref(new Date().getTime());
|
||||
|
||||
const timer = setInterval(() => {
|
||||
nowTime.value = new Date().getTime();
|
||||
}, 1000);
|
||||
|
||||
//超时时间
|
||||
const maxTime = 10 * 60 * 1000;
|
||||
|
||||
function returnStatusClass(item) {
|
||||
if (item.subStatus == "DELIVERED") {
|
||||
return "success";
|
||||
}
|
||||
}
|
||||
/**
|
||||
* 返回商品状态文本
|
||||
*/
|
||||
function returnSubStatusText(item) {
|
||||
let a = nowTime.value;
|
||||
if (item.subStatus == "PENDING_PREP") {
|
||||
return "待起菜";
|
||||
}
|
||||
if (item.subStatus == "READY_TO_SERVE") {
|
||||
if (item.startOrderTime) {
|
||||
const maxWaitTime = dayjs(item.startOrderTime).add(
|
||||
maxTime,
|
||||
"millisecond"
|
||||
);
|
||||
if (dayjs(nowTime.value).isAfter(maxWaitTime)) {
|
||||
return "已超时";
|
||||
}
|
||||
}
|
||||
return "待出菜";
|
||||
}
|
||||
if (item.subStatus == "SENT_OUT") {
|
||||
return "已出菜";
|
||||
}
|
||||
if (item.subStatus == "DELIVERED") {
|
||||
return "已上菜";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
function returnPrice(data) {
|
||||
if (data.isTimeDiscount) {
|
||||
return returnLimitPrice(data);
|
||||
}
|
||||
if (data.discountSaleAmount * 1 > 0) {
|
||||
return data.discountSaleAmount;
|
||||
}
|
||||
if(data.isGift){
|
||||
return 0
|
||||
}
|
||||
return data.price;
|
||||
}
|
||||
|
||||
function returnLimitPrice(data) {
|
||||
const price = yskUtils.limitUtils.returnPrice({
|
||||
goods: data,
|
||||
shopInfo: cartStore.shopInfo,
|
||||
limitTimeDiscountRes: cartStore.limitTimeDiscount,
|
||||
shopUserInfo: cartStore.shopUserInfo,
|
||||
idKey: "productId",
|
||||
});
|
||||
return price;
|
||||
}
|
||||
|
||||
const selCart = defineModel("selCart", {
|
||||
default: null,
|
||||
});
|
||||
function itemClick(item) {
|
||||
if (selCart.value && item.id === selCart.value.id) {
|
||||
selCart.value = null;
|
||||
return;
|
||||
}
|
||||
selCart.value = item;
|
||||
console.log(item);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.list {
|
||||
.item {
|
||||
padding: 40rpx 102rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
border: 1px solid transparent;
|
||||
border-top-color: #e5e5e5;
|
||||
font-size: 40rpx;
|
||||
&:last-child {
|
||||
border-top-color: transparent;
|
||||
}
|
||||
&.isSelected {
|
||||
border-color: $my-main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table {
|
||||
.header {
|
||||
background-color: #f8f8f8;
|
||||
padding: 40rpx 102rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.status {
|
||||
padding: 10rpx 14rpx;
|
||||
border-radius: 14rpx;
|
||||
border: 1px solid transparent;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
border-color: #999;
|
||||
background-color: rgba(153, 153, 153, 0.25);
|
||||
&.default {
|
||||
}
|
||||
&.timeout {
|
||||
color: #ff383c;
|
||||
border-color: #ff383c;
|
||||
background-color: rgba(255, 56, 60, 0.21);
|
||||
}
|
||||
&.success {
|
||||
color: $my-main-color;
|
||||
border-color: $my-main-color;
|
||||
background-color: rgba(63, 158, 255, 0.25);
|
||||
}
|
||||
|
||||
&.gift {
|
||||
$color: rgb(255, 159, 46);
|
||||
color: $color;
|
||||
background-color: rgb(255, 240, 223);
|
||||
border-color: $color;
|
||||
}
|
||||
}
|
||||
.old-price {
|
||||
text-decoration: line-through;
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
position: relative;
|
||||
}
|
||||
.limit-price,
|
||||
.discount-price {
|
||||
position: absolute;
|
||||
bottom: 100%;
|
||||
text-align: center;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
.gap-10 {
|
||||
gap: 10rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user