完成交班
This commit is contained in:
魏啾
parent
5d96435125
commit
dc2d7124d0
|
|
@ -0,0 +1,27 @@
|
|||
import request from "@/utils/request.js"
|
||||
|
||||
/**
|
||||
* 当前用户交班详情
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function shopInfoqueryDuty(params) {
|
||||
return request({
|
||||
method: "get",
|
||||
url: "shopInfo/queryDuty",
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 交班记录
|
||||
* @param {*} params
|
||||
* @returns
|
||||
*/
|
||||
export function shopinfoqueryDutyFlow(params) {
|
||||
return request({
|
||||
method: "get",
|
||||
url: "shopInfo/queryDutyFlow",
|
||||
params
|
||||
});
|
||||
}
|
||||
|
|
@ -47,6 +47,22 @@ const routes = [
|
|||
index: 1,
|
||||
},
|
||||
component: () => import("@/views/member/index.vue"),
|
||||
},
|
||||
{
|
||||
path: "/work",
|
||||
name: "work",
|
||||
meta: {
|
||||
index: 1,
|
||||
},
|
||||
component: () => import("@/views/work/index.vue"),
|
||||
},
|
||||
{
|
||||
path: "/workrecord",
|
||||
name: "workrecord",
|
||||
meta: {
|
||||
index: 1,
|
||||
},
|
||||
component: () => import("@/views/work/record.vue"),
|
||||
}
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<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") }}
|
||||
{{ dayjs(item.createAt).format(" HH:mm:ss") }}
|
||||
</div>
|
||||
<div style="color: #757575;">
|
||||
{{ dayjs(item.createAt).format("YYYY-MM-DD") }}
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
<div class="demo_tabs_boxitem_tow">
|
||||
<div>
|
||||
￥{{ item.productNum }}
|
||||
￥{{ item.orderAmount }}
|
||||
</div>
|
||||
<div style="color:#ff9e01;">
|
||||
<span v-if="item.status == 'pending'">挂单</span>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="orderbox">
|
||||
<div class="orderbox_left">
|
||||
<el-tabs v-model="ordereData.status" class="demo-tabs" @tab-click="handleClick">
|
||||
<el-tab-pane label="全部" name="closed">
|
||||
<el-tab-pane label="全部" name="">
|
||||
<div class="demo_tabs_div">
|
||||
<el-input v-model="ordereData.orderNo" placeholder="请输入订单号查询" @input="inputChange" clearable />
|
||||
<!-- <el-button style="margin-left: 10px;" type="primary" @click="onSubmit">搜索</el-button> -->
|
||||
|
|
@ -14,14 +14,14 @@
|
|||
style="margin-top: 20px;" :total="Number(ordereData.total)"
|
||||
@current-change="handleCurrentChange" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="销售" name=" refund">
|
||||
<el-tab-pane label="销售" name="closed">
|
||||
<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">
|
||||
<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"
|
||||
|
|
@ -315,7 +315,7 @@ const ordereData = reactive({//表格数据
|
|||
}],
|
||||
size: 10,
|
||||
page: 1,
|
||||
status: 'closed',
|
||||
status: '',
|
||||
total: '',
|
||||
orderNo: '',
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,16 +1,279 @@
|
|||
<template>
|
||||
<el-drawer size="100%" :with-header="false" direction="btt" v-model="dialogVisible">
|
||||
<div class="drawer_wrap">
|
||||
<div class="box">
|
||||
<div class="box_top">
|
||||
<router-link to="/">
|
||||
<div class="box_top_left">
|
||||
<el-icon size="20">
|
||||
<ArrowLeft />
|
||||
</el-icon>
|
||||
<div style="margin-left: 10px;"> 交班</div>
|
||||
</div>
|
||||
</router-link>
|
||||
<router-link to='/workrecord' class="box_top_right">
|
||||
交班记录
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="box_content">
|
||||
<div class="box_content_left">
|
||||
<div class="box_content_left_top">
|
||||
<div class="box_content_left_top_item">
|
||||
<div class="box_content_left_top_item_top">
|
||||
<div style="color:#ff5252; font-size: 30px;">
|
||||
{{ infoData.orderNum }}
|
||||
</div>
|
||||
<div style="margin-top: 6px; color: #666;">
|
||||
总订单
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_top_item_top">
|
||||
<div style="color:#ff5252; font-size: 30px;">
|
||||
{{ infoData.amount }}
|
||||
</div>
|
||||
<div style="margin-top: 6px; color: #666;">
|
||||
营业额
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_top_item">
|
||||
<div class="box_content_left_top_item_botton">
|
||||
<div style=" font-size: 20px;">
|
||||
{{ infoData.cashAmount }}
|
||||
</div>
|
||||
<div style="margin-top: 6px;">
|
||||
现金支付
|
||||
</div>
|
||||
<div style="margin-top: 6px;font-size: 14px;">
|
||||
查看详情
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_top_item_botton">
|
||||
<div style=" font-size: 20px;">
|
||||
{{ infoData.returnAmount }}
|
||||
</div>
|
||||
<div style="margin-top: 6px;">
|
||||
退款金额
|
||||
</div>
|
||||
<div style="margin-top: 6px;font-size: 14px;">
|
||||
查看详情
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_bottom">
|
||||
<el-table :data="infoData.detailList" style="width: 100%;" height="400px">
|
||||
<el-table-column prop="productName" label="商品名称" width="200" />
|
||||
<el-table-column prop="skuName" label="规格名称" width="200" />
|
||||
<el-table-column prop="amount" label="商品数量" width="200" />
|
||||
<el-table-column prop="num" label="商品金额" />
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right">
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
上岗时间：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
{{ dayjs(infoData.loginTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
交班时间：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
{{ dayjs(infoData.loginOutTime).format("YYYY-MM-DD") }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
终端名称：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
{{ infoData.equipment }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
备用金：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
{{ infoData.pettyCash }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
收营员：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
{{ infoData.userName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiembutton">
|
||||
关班/退出
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-drawer>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
const dialogVisible = ref(false)
|
||||
import { ElMessage, dayjs } from 'element-plus'
|
||||
import { shopInfoqueryDuty } from '@/api/work/index.js'
|
||||
|
||||
const dialogVisible = ref(true) //交班
|
||||
//详情数据
|
||||
const infoData = ref({})
|
||||
|
||||
const infoshopInfoqueryDutys = async () => {
|
||||
let res = await shopInfoqueryDuty({
|
||||
page: 1,
|
||||
pageSize: 10
|
||||
})
|
||||
infoData.value = res
|
||||
console.log(res)
|
||||
}
|
||||
onMounted(() => {
|
||||
infoshopInfoqueryDutys()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss"></style>
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
padding: 16px 0;
|
||||
height: 100%;
|
||||
|
||||
.box_top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
padding: 6px 10px;
|
||||
border-radius: 6px;
|
||||
color: #161718;
|
||||
text-decoration: none;
|
||||
/* 取消下划线效果 */
|
||||
|
||||
.box_top_left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.box_top_right {
|
||||
color: #161718;
|
||||
text-decoration: none;
|
||||
/* 取消下划线效果 */
|
||||
}
|
||||
}
|
||||
|
||||
.box_content {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 92%;
|
||||
display: flex;
|
||||
|
||||
.box_content_left {
|
||||
background: #fff;
|
||||
width: 70%;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
padding: 30px 20px;
|
||||
|
||||
.box_content_left_top {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding-bottom: 20px;
|
||||
|
||||
.box_content_left_top_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.box_content_left_top_item_top {
|
||||
margin-left: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.box_content_left_top_item_botton:nth-child(1) {
|
||||
margin-left: 0;
|
||||
|
||||
}
|
||||
|
||||
.box_content_left_top_item_botton {
|
||||
position: relative;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
width: 200px;
|
||||
padding: 20px 0;
|
||||
background: #e0e0e0;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.box_content_left_top_item_botton::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
height: 8px;
|
||||
background: #ff5252;
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.box_content_right {
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
margin-left: 10px;
|
||||
border-radius: 6px;
|
||||
padding: 10px 12px;
|
||||
position: relative;
|
||||
|
||||
.box_content_right_tiem:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.box_content_right_tiem {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.box_content_right_tiemleft {
|
||||
color: #9e9e9e;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.box_content_right_tiembutton {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 5%;
|
||||
background: #ba5050;
|
||||
width: 90%;
|
||||
border-radius: 5px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,313 @@
|
|||
<template>
|
||||
<el-drawer size="100%" :with-header="false" direction="btt" v-model="record">
|
||||
<div class="box">
|
||||
<div class="box_top" @click="clickrecord">
|
||||
<div class="box_top_left">
|
||||
<el-icon size="20">
|
||||
<ArrowLeft />
|
||||
</el-icon>
|
||||
<router-link to='/work' class="box_top_right">
|
||||
交班记录
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content">
|
||||
<div class="box_content_left">
|
||||
<div class="box_content_left_top">
|
||||
<div class="box_content_left_top_item">
|
||||
<div class="box_content_left_top_item_top">
|
||||
<div>
|
||||
{{ infoData.total }}
|
||||
</div>
|
||||
<div>
|
||||
交班数
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_top_item_top">
|
||||
<div>
|
||||
{{ infoData.amount }}
|
||||
</div>
|
||||
<div>
|
||||
总收款
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_left_bouttom">
|
||||
<div class="box_content_left_bouttomox">
|
||||
<div class="box_content_left_bouttom_item" v-for="(item, index) in infoData.pageInfo.list"
|
||||
:key="index">
|
||||
<div class="wbox_content_left_bouttom_item_top">
|
||||
<div>
|
||||
{{ dayjs(item.loginTime).format("YYYY-MM-DD HH:mm:ss") }}
|
||||
</div>
|
||||
<div>
|
||||
￥{{ item.amount }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="wbox_content_left_bouttom_item_topone">
|
||||
<div style="display: flex;">
|
||||
<span>收营员：</span>
|
||||
<span style="font-weight: bold;">{{ item.userName }}</span>
|
||||
</div>
|
||||
<div style="display: flex;">
|
||||
<span>总订单数：</span>
|
||||
<span style="font-weight: bold;">{{ item.orderNum }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wbox_content_left_bouttom_item_topone">
|
||||
<div style="display: flex;">
|
||||
<span>起止时间：</span>
|
||||
<span style="font-weight: bold;"> {{ dayjs(item.loginTime).format("YYYY-MM-DD HH:mm:ss") }}</span>
|
||||
</div>
|
||||
<div style="display: flex;">
|
||||
<span>备用金：</span>
|
||||
<span style="font-weight: bold;">{{ item.pettyCash }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="box_content_right">
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
上岗时间：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
2024-03-05-19:33
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
交班时间：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
2024-03-05-19:33
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
终端名称：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
POS-1
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
备用金：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
0.00
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiem">
|
||||
<div class="box_content_right_tiemleft">
|
||||
收营员：
|
||||
</div>
|
||||
<div class="box_content_right_tiemright">
|
||||
测试
|
||||
</div>
|
||||
</div>
|
||||
<div class="box_content_right_tiembutton">
|
||||
关班/退出
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { shopinfoqueryDutyFlow } from '@/api/work/index.js'
|
||||
import { useUser } from "@/store/user.js"
|
||||
import { ElMessage, dayjs } from 'element-plus'
|
||||
|
||||
const store = useUser()
|
||||
const record = ref(true)//交班记录
|
||||
//详情数据
|
||||
const infoData = ref({
|
||||
pageInfo: {
|
||||
list: []
|
||||
}
|
||||
})
|
||||
|
||||
const infoshopInfoqueryDuty = async () => {
|
||||
let res = await shopinfoqueryDutyFlow({
|
||||
shopId: store.userInfo.shopId,
|
||||
page: 1,
|
||||
pageSize: 10
|
||||
})
|
||||
infoData.value = res
|
||||
console.log(infoData.value)
|
||||
}
|
||||
onMounted(() => {
|
||||
infoshopInfoqueryDuty()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.box {
|
||||
padding: 16px 0;
|
||||
height: 100%;
|
||||
|
||||
.box_top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
padding: 6px 10px;
|
||||
border-radius: 6px;
|
||||
|
||||
|
||||
.box_top_left {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.box_top_right {
|
||||
color: #161718;
|
||||
text-decoration: none;
|
||||
/* 取消下划线效果 */
|
||||
}
|
||||
}
|
||||
|
||||
.box_content {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 92%;
|
||||
display: flex;
|
||||
|
||||
.box_content_left {
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6px;
|
||||
// padding: 30px 20px;
|
||||
|
||||
.box_content_left_top {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 20px 0;
|
||||
border-radius: 6px 6px 0 0;
|
||||
background: #187ead;
|
||||
|
||||
.box_content_left_top_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.box_content_left_top_item_top {
|
||||
color: #fff;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box_content_left_bouttom {
|
||||
width: 100%;
|
||||
height: 80%;
|
||||
padding: 0 20px;
|
||||
|
||||
.box_content_left_bouttomox {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.box_content_left_bouttom_item::after {
|
||||
content: '';
|
||||
width: 32%;
|
||||
}
|
||||
.box_content_left_bouttom_item {
|
||||
margin-top: 10px;
|
||||
width: 32%;
|
||||
background: #eeeeee;
|
||||
padding: 12px 14px;
|
||||
border-radius: 10px;
|
||||
|
||||
.wbox_content_left_bouttom_item_top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
|
||||
div:nth-child(1) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div:nth-child(2) {
|
||||
color: #ff5252;
|
||||
}
|
||||
}
|
||||
|
||||
.wbox_content_left_bouttom_item_topone {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-top: 10px;
|
||||
|
||||
div:nth-child(1) {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
div:nth-child(2) {
|
||||
font-size: 14px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.box_content_right {
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
margin-left: 10px;
|
||||
border-radius: 6px;
|
||||
padding: 10px 12px;
|
||||
position: relative;
|
||||
|
||||
.box_content_right_tiem:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.box_content_right_tiem {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.box_content_right_tiemleft {
|
||||
color: #9e9e9e;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.box_content_right_tiembutton {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 5%;
|
||||
background: #ba5050;
|
||||
width: 90%;
|
||||
border-radius: 5px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue