完成交班
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,
|
index: 1,
|
||||||
},
|
},
|
||||||
component: () => import("@/views/member/index.vue"),
|
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" />
|
<el-image style="width: 100px; height: 70px;border-radius: 10px;" :src="item.imgUrl" fit="scale-down" />
|
||||||
<div class="demo_tabs_boxitem_oneone">
|
<div class="demo_tabs_boxitem_oneone">
|
||||||
<div>
|
<div>
|
||||||
{{ dayjs(item.createAt).format(" hh:mm:ss") }}
|
{{ dayjs(item.createAt).format(" HH:mm:ss") }}
|
||||||
</div>
|
</div>
|
||||||
<div style="color: #757575;">
|
<div style="color: #757575;">
|
||||||
{{ dayjs(item.createAt).format("YYYY-MM-DD") }}
|
{{ dayjs(item.createAt).format("YYYY-MM-DD") }}
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="demo_tabs_boxitem_tow">
|
<div class="demo_tabs_boxitem_tow">
|
||||||
<div>
|
<div>
|
||||||
¥{{ item.productNum }}
|
¥{{ item.orderAmount }}
|
||||||
</div>
|
</div>
|
||||||
<div style="color:#ff9e01;">
|
<div style="color:#ff9e01;">
|
||||||
<span v-if="item.status == 'pending'">挂单</span>
|
<span v-if="item.status == 'pending'">挂单</span>
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="orderbox">
|
<div class="orderbox">
|
||||||
<div class="orderbox_left">
|
<div class="orderbox_left">
|
||||||
<el-tabs v-model="ordereData.status" class="demo-tabs" @tab-click="handleClick">
|
<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">
|
<div class="demo_tabs_div">
|
||||||
<el-input v-model="ordereData.orderNo" placeholder="请输入订单号查询" @input="inputChange" clearable />
|
<el-input v-model="ordereData.orderNo" placeholder="请输入订单号查询" @input="inputChange" clearable />
|
||||||
<!-- <el-button style="margin-left: 10px;" type="primary" @click="onSubmit">搜索</el-button> -->
|
<!-- <el-button style="margin-left: 10px;" type="primary" @click="onSubmit">搜索</el-button> -->
|
||||||
|
|
@ -14,14 +14,14 @@
|
||||||
style="margin-top: 20px;" :total="Number(ordereData.total)"
|
style="margin-top: 20px;" :total="Number(ordereData.total)"
|
||||||
@current-change="handleCurrentChange" />
|
@current-change="handleCurrentChange" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane label="销售" name=" refund">
|
<el-tab-pane label="销售" name="closed">
|
||||||
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
|
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
|
||||||
<div v-else style="width: 100%; text-align: center; margin: 30px 0;">暂无数据</div>
|
<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"
|
<el-pagination v-if="ordereData.list.length" layout="prev, pager, next, jumper"
|
||||||
style="margin-top: 20px;" :total="Number(ordereData.total)"
|
style="margin-top: 20px;" :total="Number(ordereData.total)"
|
||||||
@current-change="handleCurrentChange" />
|
@current-change="handleCurrentChange" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane label="退单" name="pending">
|
<el-tab-pane label="退单" name="refund">
|
||||||
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
|
<add :ordereData="ordereData" v-if="ordereData.list.length"></add>
|
||||||
<div v-else style="width: 100%; text-align: center; margin: 30px 0;">暂无数据</div>
|
<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"
|
<el-pagination v-if="ordereData.list.length" layout="prev, pager, next, jumper"
|
||||||
|
|
@ -315,7 +315,7 @@ const ordereData = reactive({//表格数据
|
||||||
}],
|
}],
|
||||||
size: 10,
|
size: 10,
|
||||||
page: 1,
|
page: 1,
|
||||||
status: 'closed',
|
status: '',
|
||||||
total: '',
|
total: '',
|
||||||
orderNo: '',
|
orderNo: '',
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -1,16 +1,279 @@
|
||||||
<template>
|
<template>
|
||||||
<el-drawer size="100%" :with-header="false" direction="btt" v-model="dialogVisible">
|
<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>
|
</div>
|
||||||
</el-drawer>
|
</el-drawer>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { useRoute } from 'vue-router'
|
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>
|
</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