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

Merge branch 'wwz' of gitee.com:shaanxi-super-shopkeeper_1/cashierdesktop into gyq

This commit is contained in:
gyq 2024-03-04 15:49:23 +08:00
parent 27721ca096 4facc5cc99
commit 0fa0d56558
5 changed files with 303 additions and 83 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/api/order/index.js Normal file
View File

@ -0,0 +1,27 @@
import request from "@/utils/request.js";
/**
* 获取订单列表
* @param {*} params
* @returns
*/
export function orderfindOrder(params) {
return request({
method: "get",
url: "order/findOrder",
params
});
}
/**
* 订单详情
* @param {*} params
* @returns
*/
export function orderorderDetail(params) {
return request({
method: "get",
url: "order/orderDetail",
params
});
}

4
src/views/home/index.vue
View File

@ -97,8 +97,8 @@
<remarkModal ref="remarkRef" @success="e => remark = e" />
<!-- 修改取餐号 -->
<takeFoodCode />
<el-drawer v-model="membershow" :with-header="true" size="90%" title="选择会员">
<member :membershow="1"></member>
<el-drawer v-model="membershow" :with-header="true" size="90%" title="选择会员" >
<member :membershow="'1'"></member>
</el-drawer>
<takeFoodCode ref="takeFoodCodeRef" title="修改取餐号" placeholder="请输入取餐号" @success="takeFoodCodeSuccess" />
<!-- 结算订单 -->

11
src/views/member/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="orderbox">
<div class="orderbox_left">
<div class="demo_tabs" v-if="props.membershow == 0">
<div class="demo_tabs" v-if="props.membershow == '0'">
<div class="demo_tabs_div">
<el-input v-model="tableData.phone" placeholder="请输入手机号或编号" @input="inputChange" clearable />
<el-button style="margin-left: 10px;" type="primary" @click="memberaddshow = true">添加</el-button>
@ -75,17 +75,17 @@
</div>
</div> -->
</div>
<div class="orderbox_right_input" style="margin-top:20px ;" v-if="props.membershow == 1">
<div class="orderbox_right_input" style="margin-top:20px ;" v-if="props.membershow == '1'">
<el-input placeholder="请输入会员手机号或者编号" v-model="tableData.phone" clearable @input="inputChange"></el-input>
</div>
<keyboard v-if="props.membershow == 1" @consumeFees="consumeFees"></keyboard>
<div class="orderbox_right_button" v-if="props.membershow == 0">
<keyboard v-if="props.membershow == '1'" @consumeFees="consumeFees"></keyboard>
<div class="orderbox_right_button" v-if="props.membershow == '0'">
<router-link to="/" style="width: 35%;">
<el-button style="width: 100%;" @click="recharge = true">创建订单</el-button>
</router-link>
<el-button style="width: 60%;" type="primary">账户充值</el-button>
</div>
<div class="orderbox_right_button" v-if="props.membershow == 1">
<div class="orderbox_right_button" v-if="props.membershow == '1'">
<router-link to="/" style="width: 35%;">
<el-button style="width: 100%;" @click="memberaddshowclose">添加会员</el-button>
</router-link>
@ -189,7 +189,6 @@ const consumeFee = (e) => { //接收子组件值 并赋值给父组件
moneys.value = e
}
const consumeFees = (e) => {
console.log(22222,44)
tableData.phone = e
}

109
src/views/order/components/add.vue Normal file
View File

@ -0,0 +1,109 @@
<template>
<div class="demo_tabs_box">
<div class="demo_tabs_boxitem" v-for="(item, index) in ordereData.list" :key="index"
@click="clickitemboxshow(item)">
<div class="demo_tabs_boxitem_one">
<el-image style="width: 100px; height: 70px;border-radius: 10px;" :src="item.imgUrl" fit="scale-down" />
<div class="demo_tabs_boxitem_oneone">
<div>
{{ dayjs(item.createAt).format(" hh:mm:ss") }}
</div>
<div style="color: #757575;">
{{ dayjs(item.createAt).format("YYYY-MM-DD") }}
</div>
</div>
<div class="demo_tabs_boxitem_onetow">
<div>
<span style="font-size: var(--el-font-size-base);" v-for="item1 in item.names" :key="item1">{{
item1 }}</span>
</div>
<span style="font-size: 16px; color: #757575;">{{ item.orderNo }}</span>
</div>
</div>
<div class="demo_tabs_boxitem_tow">
<div>
￥{{ item.productNum }}
</div>
<div style="color:#ff9e01;">
<span v-if="item.status == 'pending'">挂单</span>
<span v-if="item.status == 'refund'">退单</span>
<span v-if="item.status == 'closed'">订单完成</span>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { dayjs } from 'element-plus'
const props = defineProps({
ordereData: {
type: Object,
default: {}
}
})
const emit = defineEmits(["emititemboxshow"])
const clickitemboxshow = (e) => {
emit('emititemboxshow', e)
}
</script>
<style scoped lang="scss">
.demo_tabs_box {
width: 100%;
padding: 10px 20px;
height: 82%;
overflow: auto;
.demo_tabs_boxitem {
width: 100%;
padding: 6px 16px;
border-radius: 6px;
display: flex;
justify-content: space-between;
// background: #eeeeee;
border-bottom: 1px solid #ccc;
.demo_tabs_boxitem_one {
display: flex;
justify-content: flex-start;
.demo_tabs_boxitem_oneone {
display: flex;
margin-left: 20px;
flex-direction: column;
height: 70px;
justify-content: space-around;
}
.demo_tabs_boxitem_onetow {
width: 40%;
display: flex;
margin-left: 20px;
flex-direction: column;
height: 70px;
justify-content: space-around;
div {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
}
.demo_tabs_boxitem_tow {
width: 20%;
display: flex;
flex-direction: column;
height: 70px;
justify-content: space-around;
align-items: flex-end;
}
}
</style>

235
src/views/order/index.vue
View File

@ -1,50 +1,34 @@
<template>
<div class="orderbox">
<div class="orderbox_left">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick(activeName)">
<el-tab-pane label="全部" name="first">
<el-tabs v-model="ordereData.status" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="全部" name="closed">
<div class="demo_tabs_div">
<el-input v-model="firstinput" placeholder="请输入订单号查询" clearable />
<el-input v-model="ordereData.ordernumbr" placeholder="请输入订单号查询" @input="inputChange"
clearable />
<el-button style="margin-left: 10px;" type="primary" @click="onSubmit">搜索</el-button>
</div>
<div class="demo_tabs_box">
<div class="demo_tabs_boxitem" @click="itemboxshow = true">
<div class="demo_tabs_boxitem_one">
<el-image style="width: 100px; height: 70px;border-radius: 10px;"
src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
fit="scale-down" />
<div class="demo_tabs_boxitem_oneone">
<div>
11:19
</div>
<div style="color: #757575;">
2024/02/01
</div>
</div>
<div class="demo_tabs_boxitem_onetow">
<div>
<span style="font-size: var(--el-font-size-base);">销售</span><span
style="font-size: 16px; color: #757575;">11111111111111111111111111</span>
</div>
<div>
<span
style="color: #5a31f1;font-size: var(--el-font-size-base);">[222]</span><span>待点单</span>
</div>
</div>
</div>
<div class="demo_tabs_boxitem_tow">
<div>
￥0.0
</div>
<div style="color:#ff9e01;">
开台
</div>
</div>
</div>
</div>
<add :ordereData="ordereData" @emititemboxshow="emititemboxshow" v-if="ordereData.list.length">
</add>
<div v-else style="width: 100%; text-align: center; margin: 30px 0;">暂无数据</div>
<el-pagination v-if="ordereData.list.length" layout="prev, pager, next, jumper"
style="margin-top: 20px;" :total="Number(ordereData.total)"
@current-change="handleCurrentChange" />
</el-tab-pane>
<el-tab-pane label="销售" name=" refund">
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
<div v-else style="width: 100%; text-align: center; margin: 30px 0;">暂无数据</div>
<el-pagination v-if="ordereData.list.length" layout="prev, pager, next, jumper"
style="margin-top: 20px;" :total="Number(ordereData.total)"
@current-change="handleCurrentChange" />
</el-tab-pane>
<el-tab-pane label="退单" name="pending">
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
<div v-else style="width: 100%; text-align: center; margin: 30px 0;">暂无数据</div>
<el-pagination v-if="ordereData.list.length" layout="prev, pager, next, jumper"
style="margin-top: 20px;" :total="Number(ordereData.total)"
@current-change="handleCurrentChange" />
</el-tab-pane>
<el-tab-pane label="销售" name="second">销售</el-tab-pane>
<el-tab-pane label="退单" name="third">退单</el-tab-pane>
</el-tabs>
</div>
<div class="orderbox_right" v-if="itemboxshow">
@ -56,36 +40,38 @@
</div>
<div class="tableDataclass">
<div class="orderbox_right_item">
<span class="span">订单号：</span><span class="nunber">200000000000</span>
<span class="span">订单号：</span><span class="nunber">{{ orderDetaildata.orderNo }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">收银员：</span><span class="nunber">V1</span>
<span class="span">收银员：</span><span class="nunber">{{ orderDetaildata.userName }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">创建时间：</span><span class="nunber">2024-20-01 11:49:06</span>
<span class="span">创建时间：</span><span class="nunber">{{ orderDetaildata.createdAt }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">终端：</span><span class="nunber">mobile</span>
<span class="span">终端：</span><span class="nunber">{{ orderDetaildata.zdNo }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">会员：</span><span class="nunber">微信用户</span>
<span class="span">会员：</span><span class="nunber">{{ orderDetaildata.memberName }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">台桌：</span><span class="nunber">222</span>
<span class="span">台桌：</span><span class="nunber">{{ orderDetaildata.tableId }}</span>
</div>
<div class="orderbox_right_item">
<span class="span">流水号：</span><span class="nunber">#1</span>
<span class="span">流水号：</span><span class="nunber">{{ orderDetaildata.masterId }}</span>
</div>
<div class="orderbox_right_top" style="margin-top: 20px; border-bottom: 2px solid #ccc;">
<span>合计：</span>
<span>￥0.00</span>
<span>￥{{ orderDetaildata.orderAmount }}</span>
</div>
<div class="orderbox_right_top" style="margin-top: 20px; border-bottom: 2px solid #ccc;">
<span style="font-size: 16px;">未支付</span>
<span style="font-size: 16px;" v-if="orderDetaildata.status == 'pending'">挂单</span>
<span style="font-size: 16px;" v-if="orderDetaildata.status == 'refund'">退单</span>
<span style="font-size: 16px;" v-if="orderDetaildata.status == 'closed'">订单完成</span>
</div>
<div class="orderbox_right_top" style="margin-top: 20px;">
<span>商品明细</span>
<span>0项</span>
<span>{{ orderDetaildata.detailList.length }}项</span>
</div>
<div class="orderbox_right_list" style="margin-top: 20px;">
<div>商品</div>
@ -93,18 +79,22 @@
<div>单价</div>
<div>小计</div>
</div>
<div class="orderbox_right_list_item" style="margin-top: 20px;">
<div>1号商品</div>
<div style="text-align: center;">3</div>
<div style="text-align: center;">3</div>
<div>3</div>
<div class="orderbox_right_list_item" style="margin-top: 20px;"
v-for="(item, index) in orderDetaildata.detailList" :key="index">
<div>{{ item.productName }}-{{ item.productSkuName }}号商品</div>
<div style="text-align: center;">{{ item.num }}</div>
<div style="text-align: center;">{{ item.price }}</div>
<div>{{ item.priceAmount }}</div>
</div>
</div>
<div class="orderbox_right_button">
<el-button style="width: 100%;" type="primary" @click="onSubmit">点单</el-button>
<el-button style="width: 100%; margin-top: 10px; margin-left:0px;" type="danger"
@click="onSubmit">取消</el-button>
<div class="orderbox_right_buttonbutton">
<router-link to="/" style="width: 45%;">
<el-button style="width: 100%;" type="primary">点单</el-button>
</router-link>
<el-button style="width: 45%;" type="danger" @click="onSubmit">取消</el-button>
</div>
<el-button style="width: 100%; margin-top: 10px;" type="primary" @click="onSubmit">结算</el-button>
</div>
</div>
<div class="orderbox_rightbox" v-else>
@ -120,7 +110,7 @@
<div style="font-size:14px;">今日本终端处理的订单</div>
</div>
</div>
<div class="orderbox_rightbox_top">
<!-- <div class="orderbox_rightbox_top">
<div
style="padding: 6px; background:#187ead; border-radius:50%;width: 50px;height: 50px; display: flex; align-items: center; justify-content: center;">
<el-icon :size="30" color="#fff">
@ -143,22 +133,24 @@
<div>今日普通订单</div>
<div style="font-size:14px;">今日本终端处理的订单</div>
</div>
</div>
</div> -->
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { useRoute } from "vue-router"
import { ElMessage } from 'element-plus'
const route = useRoute()
console.log(route)
const activeName = ref('first')//定义初始name
import { ref, onMounted, reactive } from 'vue'
import { ElMessage, dayjs } from 'element-plus'
import { useUser } from "@/store/user.js"
import lodash from 'lodash'
import { orderfindOrder, orderorderDetail } from '@/api/order/index.js'
import add from '@/views/order/components/add.vue'
const store = useUser()
const itemboxshow = ref(false)
const handleClick = (Name) => {
console.log(Name)
const handleClick = (Name) => {//切换teb
ordereData.status = Name.props.name
asyncorderfindOrder()
}
const firstinput = ref('')//搜索输入框
const onSubmit = () => {
@ -171,6 +163,68 @@ const onSubmit = () => {
})
}
}
const emititemboxshow = async (e) => { //接收子组件值 并赋值给父组件
try {
let res = await orderorderDetail({
shopId: store.userInfo.shopId,
id: e.id
})
itemboxshow.value = true
orderDetaildata.value = res
console.log(orderDetaildata)
} catch (error) {
}
}
const orderDetaildata = ref({//详情数据
})
const ordereData = reactive({//表格数据
list: [{
name: "",
amount: "",
levelConsume: "",
level: "",
code: "",
telephone: ""
}],
size: 10,
page: 1,
status: 'closed',
total: '',
orderNo: '',
ordernumbr: ''
})
const asyncorderfindOrder = async () => {//获取流水
try {
let res = await orderfindOrder({
shopId: store.userInfo.shopId,
status: ordereData.status,
size: ordereData.size,
page: ordereData.page,
ordernumbr: ordereData.ordernumbr
})
ordereData.total = res.total
ordereData.list = res.list
} catch (error) {
// ElMessage({
// message: '获取失败',
// type: 'error',
// })
}
}
const handleCurrentChange = (val) => { //页码
// ordereData.page = 1
ordereData.page = val
asyncorderfindOrder()
}
const inputChange = lodash.debounce(function () { //搜索手机号
asyncorderfindOrder()
}, 500)
onMounted(() => {
// resetMembrform.value = { ...membrform.value }
asyncorderfindOrder()
})
</script>
<style scoped lang="scss">
@ -185,6 +239,16 @@ const onSubmit = () => {
border-radius: 10px;
.demo-tabs {
height: 100%;
:deep(.el-tabs__content) {
height: 90%;
}
:deep(.el-tab-pane) {
height: 100%;
}
:deep(.el-tabs__nav) {
width: 100%;
}
@ -195,9 +259,11 @@ const onSubmit = () => {
position: relative;
// width: 10px !important;
}
:deep(.el-tabs__active-bar){
height:0 !important;
:deep(.el-tabs__active-bar) {
height: 0 !important;
}
:deep(.el-tabs__active-bar)::after {
content: '';
position: absolute;
@ -206,9 +272,10 @@ const onSubmit = () => {
height: 2px;
width: 10px;
background: red;
transform:translateX(-50%);
transform: translateX(-50%);
// width: 10px !important;
}
:deep(.el-is-active) {
width: 33.33%;
color: var(--primary-color);
@ -222,6 +289,8 @@ const onSubmit = () => {
.demo_tabs_box {
width: 100%;
padding: 10px 20px;
height: 82%;
overflow: auto;
.demo_tabs_boxitem {
width: 100%;
@ -245,16 +314,25 @@ const onSubmit = () => {
}
.demo_tabs_boxitem_onetow {
width: 40%;
display: flex;
margin-left: 20px;
flex-direction: column;
height: 70px;
justify-content: space-around;
div {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
}
.demo_tabs_boxitem_tow {
width: 20%;
display: flex;
flex-direction: column;
height: 70px;
@ -389,15 +467,22 @@ const onSubmit = () => {
}
}
.orderbox_right_button {
position: absolute;
width: 90%;
left: 50%;
bottom: 16px;
.orderbox_right_buttonbutton {
display: flex;
justify-content: space-between;
align-items: center;
}
transform: translateX(-50%) !important;
}
}
}</style>
}
</style>