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

This commit is contained in:
gyq 2024-03-07 09:47:30 +08:00
commit 4a5b52fa45
6 changed files with 629 additions and 10 deletions

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

@ -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
});
}

View File

@ -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"),
}
];

View File

@ -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>

View File

@ -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: '',
})

View File

@ -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>

313
src/views/work/record.vue Normal file
View File

@ -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>