czg_team/cashier-ipad-new
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
YeMingfei666
2025-04-02 10:35:17 +08:00
commit 89db955ec1
701 changed files with 91082 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

270
pagesOrder/index/compoents/filter.vue Normal file
View File

@@ -0,0 +1,270 @@
<template>
<view>
<view class="u-flex bg-fff u-p-l-28 u-p-r-28 u-row-between">
<view class="u-rela time-item tranistion-2" @click="changeTimeDataSel(index)"
:class="{active:timeData.sel==index}" v-for="(item,index) in timeData.list" :key="index">
{{item.label}}
</view>
<view class="u-rela time-item tranistion-2" @click="changeTimeDataSel(-1)"
:class="{active:timeData.sel==-1}">自定义</view>
</view>
<view class="u-m-t-2 bg-fff u-col-center u-flex u-p-l-28 u-p-r-28 u-p-t-30 u-row-between">
<view class="status-item " @click="changeStatusSel(item.value)" :class="{active:statusData.sel==item.value}"
v-for="(item,index) in statusData.list" :key="index">
{{item.label}}
</view>
<view class="status-item u-flex" @click="moreShowOpen">
<image src="@/pagesOrder/static/image/icon-search.svg" style="width: 38rpx;height: 30rpx;" mode="">
</image>
</view>
</view>
<!-- <template v-if="type&&userShow">
<view class="u-p-l-28 u-flex u-p-r-28 u-p-t-10 bg-gray" v-if="userShow">
<view class="time-area u-font-24 color-main u-flex">
<up-avatar :size="22" :src="user.headImg"></up-avatar>
<view class="u-m-l-10 u-m-r-10">
<text v-if="user.id">{{user.telephone||user.nickName}}</text>
<text v-else>服务员下单</text>
</view>
<up-icon name="close-circle-fill" :color="color.ColorMain" @click="userShowClose"></up-icon>
</view>
</view>
<view class="u-p-l-28 u-flex u-p-r-28 u-p-t-10 bg-gray" v-else>
<view class="time-area u-font-24 color-main u-flex">
<up-avatar :size="22" ></up-avatar>
<view class="u-m-l-10 u-m-r-10">
服务员下单
</view>
<up-icon name="close-circle-fill" :color="color.ColorMain" @click="userShowClose"></up-icon>
</view>
</view>
</template> -->
<!-- <view class="u-p-l-28 u-flex u-p-r-28 u-p-t-10 bg-gray" v-if="time.length">
<view class="time-area u-font-24 color-main u-flex">
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="time[0]"></uni-dateformat>
<text class="u-p-l-10 u-p-r-10">至</text>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="time[1]"></uni-dateformat>
</view>
</view> -->
<my-date-pickerview @confirm="datePickerConfirm" ref="datePicker" mode="all"></my-date-pickerview>
<!-- 更多状态选择筛选 -->
<up-popup :round="10" :show="statusData.moreShow" :closeable="true" @close="moreShowHide">
<view class="u-text-center font-bold u-font-32 u-p-t-30">选择状态</view>
<view style="height: 20rpx;"></view>
<view class="u-p-30 all-list u-flex u-flex-wrap gap-20">
<view class="all-list-item" :class="{active:statusItemIndex==statusData.allListSel}"
@click="changeAllListSel(statusItemIndex,statusItem)"
v-for="(statusItem,statusItemIndex) in statusData.allList" :key="statusItemIndex">
{{statusItem.label}}
</view>
</view>
<view class="u-flex u-p-t-30 u-p-b-30 u-p-l-20 u-p-r-20 gap-20">
<up-button @click="moreShowHide">取消</up-button>
<up-button type="primary" @click="statusConfirm">确定</up-button>
</view>
</up-popup>
</view>
</template>
<script setup>
import orderEnum from '@/commons/orderEnum.js'
import * as $time from '@/commons/utils/dayjs-time.js';
import color from '@/commons/color.js';
import {
reactive,
ref,
watch
} from 'vue';
const emits = defineEmits(['update:time', 'update:status','clearUser','updateStatus'])
function userShowClose() {
userShow.value = false
emits('clearUser')
}
const props = defineProps({
time: {
type: Array,
default: () => []
},
status: {
type: [String, Number],
default: ''
},
user: {
type: Object,
default: () => {
return {
userId: ''
}
},
},
type:{
type:String,
default:''//user 查看具体用户订单
}
})
let userShow = ref(props.type? true : false)
console.log(props.type);
watch(() => props.type, (newval) => {
console.log(newval);
if (newval) {
userShow.value = true
}
})
let datePicker = ref(null)
// 示例使用
const today = $time.getTodayTimestamps();
const yesterday = $time.getYesterdayTimestamps();
const thisWeek = $time.getThisWeekTimestamps();
const thisMonth = $time.getThisMonthTimestamps();
const timeData = reactive({
list: [today, yesterday, thisWeek, thisMonth],
sel: 0
})
function changeTimeDataSel(i) {
timeData.sel = i
if (i == -1) {
datePicker.value.open()
}
}
watch(() => timeData.sel, (newval) => {
const data = timeData.list[newval]
if (newval != -1) {
emits('update:time', [data.start, data.end])
}
})
const statusData = reactive({
allList: orderEnum.status,
moreShow: false,
allListSel: -1,
list: [{
label: '全部',
value: ''
},
{
label: '待支付',
value: 'unpaid'
},
// {
// label: '待完成',
// value: ''
// },
{
label: '已完成',
value: 'closed'
},
// {
// label: '未支付',
// value: 'unpaid'
// },
{
label: '已退款',
value: 'refund'
}
],
sel: ''
})
function moreShowHide() {
statusData.moreShow = false
}
function moreShowOpen() {
statusData.moreShow = true
}
function changeStatusSel(i) {
statusData.sel = i
emits('updateStatus', i)
}
function datePickerConfirm(e) {
console.log(e);
emits('update:time', [e.start, e.end])
}
function changeAllListSel(i,item) {
statusData.allListSel = i
console.log(i);
}
function statusConfirm(){
const status=statusData.allList[statusData.allListSel].key
statusData.sel=status
emits('updateStatus',status)
moreShowHide()
}
</script>
<style lang="scss" scoped>
.status-item {
color: #666;
transition: all .2s ease-in-out;
padding-bottom: 24rpx;
&.active {
color: $my-main-color;
}
}
.all-list-item {
text-align: center;
width: 156rpx;
white-space: nowrap;
color: #666;
padding: 10rpx 20rpx;
border-radius: 8rpx;
transition: all .2s ease-in-out;
border: 1px solid #eee;
&.active {
color: $my-main-color;
border-color: $my-main-color;
}
}
.time-item {
color: #666;
padding-bottom: 20rpx;
&::after {
content: '';
display: block;
position: absolute;
height: 4rpx;
left: 0;
right: 0;
bottom: 0;
border-radius: 4rpx 4rpx 4rpx 4rpx;
}
&.active {
color: $my-main-color;
// font-size: 32rpx;
transform: scale(1.1);
transform-origin: center;
font-weight: 700;
&::after {
background: #318AFE;
}
}
}
.time-area {
background: #E6F0FF;
border-radius: 100px;
padding: 10rpx 20rpx;
}
</style>

289
pagesOrder/index/compoents/order-item.vue Normal file
View File

@@ -0,0 +1,289 @@
<template>
<view class="bg-fff item" @click="toDetail">
<view class="u-flex u-p-b-22 border-bottom u-row-between u-col-center">
<view class="u-flex u-col-bottom">
<template v-if="data.tableName">
<view class="u-flex u-col-center">
<view class="u-font-40 color-333">{{data.tableName}}</view>
<view class="line" style="height: 16px;"></view>
</view>
</template>
<view class="">{{data.masterId}}</view>
</view>
<view class="u-flex">
<view>
<text :class="[data.status]">{{returnStatus(data.status)}}</text>
</view>
<view class="line"></view>
<view class=" color-main">
<text>
{{sendTypeFilter(data.sendType)}}
</text>
</view>
</view>
</view>
<view class="u-m-t-26">
<view class="u-flex u-col-bottom u-font-24 color-999">
<up-avatar :size="33"></up-avatar>
<view class="u-m-l-16">{{formatTime(data.createdAt)}}</view>
</view>
<view class="u-m-t-32">
<view class="u-font-32">{{goosZhonglei}}种商品，共{{goodsNumber}}件</view>
<view class="border-bottom u-p-b-32">
<view class="" v-for="(item,index) in data.detailList" :key="index">
<view class="u-flex u-row-between u-col-top u-m-t-32" v-if="item.productId!=-999">
<view>
<view class=""> {{item.productName}}</view>
<view class="color-999 u-font-24 u-m-t-8">
{{item.productSkuName}}
</view>
</view>
<view class="u-flex u-flex-1 u-row-right">
<view>×{{item.num}}</view>
<template v-if="item.gift||item.userCouponId">
<view class="u-text-right u-relative" :style="computedPriceStyle()">
<text class="line-th">￥{{goodsPriceAmount(item)}}</text>
<view class="u-absolute" style="bottom: 100%;right: 0;">
￥0
</view>
</view>
</template>
<template v-else-if="item.isMember&&data.memberId&&item.memberPrice&&item.memberPrice!=item.price">
<view class="u-text-right u-relative" :style="computedPriceStyle()">
<text class="line-th">￥{{goodsPriceAmount(item)}}</text>
<view class="u-absolute" style="bottom: 100%;right: 0;">
￥{{goodsVipPriceAmount(item)}}
</view>
</view>
</template>
<template v-else>
<view class="u-text-right u-relative" :style="computedPriceStyle()">
<text>￥{{goodsPriceAmount(item)}}</text>
</view>
</template>
</view>
</view>
</view>
</view>
</view>
<view class="border-bottom u-p-t-32 u-p-b-32"
v-if="data.packFee>0||(data.seatInfo&&data.seatInfo.priceAmount>0)">
<view class="u-flex u-row-between u-col-top" v-if="data.packFee>0">
<view class="no-wrap u-m-r-32">打包费</view>
<view>￥{{data.packFee||0}}</view>
</view>
<view style="height: 32rpx;" v-if="data.packFee>0&&data.seatInfo&&data.seatInfo.priceAmount>0"></view>
<view class="u-flex u-row-between u-col-top" v-if="data.seatInfo&&data.seatInfo.priceAmount>0">
<view class="no-wrap u-m-r-32">{{data.seatInfo.productName}}</view>
<view>￥{{data.seatInfo.priceAmount}}</view>
</view>
</view>
<view class="border-bottom u-p-b-32 u-m-t-32"
v-if="data.fullCouponDiscountAmount>0||data.productCouponDiscountAmount>0||data.pointsDiscountAmount>0">
<view class="u-flex u-row-between u-col-top" v-if="data.fullCouponDiscountAmount>0">
<view class="no-wrap u-m-r-32">满减券抵扣</view>
<view class="color-red">-￥{{data.fullCouponDiscountAmount||0}}</view>
</view>
<view class="u-flex u-row-between u-m-t-32 u-col-top" v-if="data.productCouponDiscountAmount>0">
<view class="no-wrap u-m-r-32">商品券抵扣</view>
<view class="color-red">-￥{{data.productCouponDiscountAmount||0}}</view>
</view>
<view class="u-flex u-row-between u-m-t-32 u-col-top" v-if="data.pointsDiscountAmount>0">
<view class="no-wrap u-m-r-32">积分抵扣</view>
<view class="color-red">-￥{{data.pointsDiscountAmount||0}}</view>
</view>
</view>
<view class="u-flex u-row-between border-bottom u-m-t-32 u-p-b-32 u-col-top">
<view class="no-wrap u-m-r-32">订单备注</view>
<view>{{data.remark||'无'}}</view>
</view>
<view class="u-m-t-32">
<view class="u-flex u-row-right">
<text>总计￥</text>
<text class="font-bold u-font-32">{{data.orderAmount}}</text>
</view>
<view class="u-flex u-row-right u-m-t-24">
<view class="print" @click.stop="print(item)">重新打印</view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import dayjs from 'dayjs';
import orderEnum from '@/commons/orderEnum.js'
import go from '@/commons/utils/go.js'
import {
isTui,
canTuiKuan,
canTuicai
} from '@/commons/utils/goodsUtil.js'
import {
computed,
reactive,
ref,
watch
} from 'vue';
const emits = defineEmits(['printOrder'])
const props = defineProps({
data: {
type: Object,
default: () => {
return {
packFee: 0,
seatInfo: {
productName: '客座费',
priceAmount: 0
},
detailList: []
}
}
},
index: {
type: [String, Number],
default: 0
}
})
let $goodsMap = {}
let goosZhonglei = ref(0)
let goodsNumber = ref(0)
const priceSize = 9
let minWidth=ref(36)
function goodsPriceAmount(item) {
const total=(item.price * item.num).toFixed(2)
const minW=total.length * priceSize + 15
minWidth.value=minW<minWidth.value?minWidth.value:minW
return total
}
function goodsVipPriceAmount(item) {
const price = item.memberPrice ? item.memberPrice : item.price
return (price * item.num).toFixed(2)
}
// const packeFee=computed(()=>{
// return props.data.detailList.reduce((prve,cur)=>{
// return prve+cur.packAmount
// },0).toFixed(2)
// })
function computedPriceStyle() {
return {
'min-width':minWidth.value + 'px'
}
}
// const computedPriceStyle = computed(() => {
// })
function goodsMapInit() {
for (let i in props.data.detailList) {
const goods = props.data.detailList[i]
if ($goodsMap.hasOwnProperty(goods.productId)) {
$goodsMap[goods.productId] += goods.num * 1
goodsNumber.value += goods.num * 1
} else {
$goodsMap[goods.productId] = goods.num * 1
goosZhonglei.value += 1
goodsNumber.value += goods.num * 1
}
}
}
goodsMapInit()
watch(() => props.data.detailList.length, (newval) => {
goodsNumber.value = 0
goodsMapInit()
})
function formatTime(time) {
return dayjs(time).format('YYYY-MM-DD HH:mm:ss');
}
function returnStatus(status) {
const item = orderEnum.status.find(v => v.key == status)
return item ? item.label : ''
}
function sendTypeFilter(t) {
console.log(t);
if (t) {
const item = orderEnum.sendType.find(item => item.key == t)
return item ? item.label : '';
} else {
return t;
}
}
function toDetail() {
go.to('PAGES_ORDER_DETAIL', {
id: props.data.id
})
}
function print(item) {
emits('printOrder', props.data)
}
</script>
<style lang="scss" scoped>
.border-bottom {
border-bottom: 1rpx solid #E5E5E5;
}
.u-font-40 {
font-size: 40rpx;
}
.item {
padding: 16rpx 24rpx 32rpx 24rpx;
border-radius: 18rpx 18rpx 18rpx 18rpx;
margin-bottom: 32rpx;
}
.unpaid {
color: #FD7B49;
}
.print {
padding: 6rpx 14rpx 8rpx 18rpx;
border: 1px solid $my-main-color;
color: $my-main-color;
font-size: 24rpx;
border-radius: 100rpx;
}
.line {
height: 14px;
width: 1px;
background-color: #E5E5E5;
margin: 0 12rpx;
}
.row {
.top {
display: flex;
.name {
width: 50%;
}
.num {
width: 20%;
display: flex;
justify-content: flex-end;
}
.price {
width: 30%;
display: flex;
justify-content: flex-end;
}
}
}
</style>

34
pagesOrder/index/compoents/order-list.vue Normal file
View File

@@ -0,0 +1,34 @@
<template>
<view class="list">
<view v-for="(item,index) in list" :key="index">
<order-item @printOrder="print" :key="index" :data="item" :index="index"></order-item>
</view>
<view v-if="hasAjax&&!list.length">
<my-img-empty tips="亲，你还没有订单哦~"></my-img-empty>
</view>
</view>
</template>
<script setup>
import orderItem from './order-item.vue';
const props=defineProps({
list:{
type:Array,
default:()=>[]
},
hasAjax:{
type:Boolean,
default:false
}
})
const emits=defineEmits(['printOrder'])
function print(item) {
emits('printOrder',item)
}
</script>
<style lang="scss" scoped>
.list {
padding: 32rpx 28rpx;
}
</style>