前端
This commit is contained in:
parent
12cc890e91
commit
4841110320
@ -6,8 +6,8 @@
|
|||||||
{{item}}
|
{{item}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="tabindex == 0">
|
||||||
<el-card class="card-box" >
|
<el-card class="card-box" style="width: 98%;margin: 10px auto" >
|
||||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
|
||||||
<el-form-item label="" prop="status">
|
<el-form-item label="" prop="status">
|
||||||
<el-select v-model="queryParams.status" style="width: 150px" placeholder="交班方式" clearable>
|
<el-select v-model="queryParams.status" style="width: 150px" placeholder="交班方式" clearable>
|
||||||
@ -99,8 +99,152 @@
|
|||||||
<div>中建锦绣二期站</div>
|
<div>中建锦绣二期站</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="xxing"></div>
|
<div class="xxing"></div>
|
||||||
<div class=""></div>
|
<div class="for-box">
|
||||||
|
<div class="for-title">
|
||||||
|
<div class="x-"></div>
|
||||||
|
<div>营业收入统计</div>
|
||||||
|
<div class="x-"></div>
|
||||||
|
</div>
|
||||||
|
<div class="d-s-b" style="font-weight: 600">
|
||||||
|
<div class="l-size">类型</div>
|
||||||
|
<div class="f-size">订单金额</div>
|
||||||
|
<div class="r-size">实收金额</div>
|
||||||
|
</div>
|
||||||
|
<div class="d-s-b">
|
||||||
|
<div class="l-size">营业总额</div>
|
||||||
|
<div class="s-size">39566.58</div>
|
||||||
|
<div class="r-size">¥50682.05</div>
|
||||||
|
</div>
|
||||||
|
<div class="d-s-b">
|
||||||
|
<div class="l-size">充值总额</div>
|
||||||
|
<div class="s-size">39566.58</div>
|
||||||
|
<div class="r-size">¥50682.05</div>
|
||||||
|
</div>
|
||||||
|
<div class="d-s-b">
|
||||||
|
<div class="l-size">合计</div>
|
||||||
|
<div class="s-size">39566.58</div>
|
||||||
|
<div class="r-size">¥50682.05</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
<el-card style="width: 98%; margin: 20px auto;display: flex;align-items: center;justify-content: center;" >
|
||||||
|
<el-button type="primary">交班</el-button>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
<div v-if="tabindex == 1">
|
||||||
|
<div class="table-boxs">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
|
||||||
|
<el-form-item label="" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" style="width: 150px" placeholder="交班方式" clearable>
|
||||||
|
<el-option label="统一交班" value="统一交班">统一交班</el-option>
|
||||||
|
<el-option label="个人交班" value="个人交班">个人交班</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="" prop="staffId">
|
||||||
|
<el-select v-model="queryParams.staffId" style="width: 150px" placeholder="交班员工" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="option in staffList"
|
||||||
|
:key="option.id"
|
||||||
|
:label="option.realName"
|
||||||
|
:value="option.id"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="" prop="staffId">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="value"
|
||||||
|
type="datetime"
|
||||||
|
placeholder="选择日期时间">
|
||||||
|
</el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<el-form-item class="flex-container" style="float: right">
|
||||||
|
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<el-table
|
||||||
|
:data="tableData"
|
||||||
|
border
|
||||||
|
style="width: 100%">
|
||||||
|
<el-table-column type="index" width="50" align="center" label="序号"/>
|
||||||
|
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
label="交班人员">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="name"
|
||||||
|
label="交班方式">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="date"
|
||||||
|
label="开始时间">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="date"
|
||||||
|
label="结束时间">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="price"
|
||||||
|
label="订单金额"
|
||||||
|
width="80"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="price"
|
||||||
|
label="优惠金额"
|
||||||
|
width="80"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="price"
|
||||||
|
label="实收金额"
|
||||||
|
width="80"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="price"
|
||||||
|
label="退款金额"
|
||||||
|
width="80"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="date"
|
||||||
|
label="创建时间">
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="操作" align="center" fixed='right'>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
>查看详情</el-button>
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
>交易明细</el-button>
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
>商品汇总</el-button>
|
||||||
|
<el-button
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
>打印</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.page"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<el-dialog title="订单详情" :visible.sync="openDetail" width="600px" append-to-body :close-on-click-modal="false">
|
<el-dialog title="订单详情" :visible.sync="openDetail" width="600px" append-to-body :close-on-click-modal="false">
|
||||||
<!-- <detail :dataForm = "recordData"></detail>-->
|
<!-- <detail :dataForm = "recordData"></detail>-->
|
||||||
<HandoverOnly :recordData = "recordData"></HandoverOnly>
|
<HandoverOnly :recordData = "recordData"></HandoverOnly>
|
||||||
@ -125,10 +269,32 @@ export default {
|
|||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
tableData: [{
|
||||||
|
price:120,
|
||||||
|
date: '2016-05-02',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1518 弄'
|
||||||
|
}, {
|
||||||
|
price:120,
|
||||||
|
date: '2016-05-04',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1517 弄'
|
||||||
|
}, {
|
||||||
|
price:120,
|
||||||
|
date: '2016-05-01',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1519 弄'
|
||||||
|
}, {
|
||||||
|
price:120,
|
||||||
|
date: '2016-05-03',
|
||||||
|
name: '王小虎',
|
||||||
|
address: '上海市普陀区金沙江路 1516 弄'
|
||||||
|
}],
|
||||||
tabs:[
|
tabs:[
|
||||||
"交接班",
|
"交接班",
|
||||||
"交班记录"
|
"交班记录"
|
||||||
],
|
],
|
||||||
|
value:'',
|
||||||
tabindex:0,
|
tabindex:0,
|
||||||
openDetail:false,
|
openDetail:false,
|
||||||
dataForm:{},
|
dataForm:{},
|
||||||
@ -256,6 +422,8 @@ export default {
|
|||||||
.app-containers {
|
.app-containers {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #f6f8f9;
|
background: #f6f8f9;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-bottom: 20px;
|
||||||
|
|
||||||
}
|
}
|
||||||
.tab-box{
|
.tab-box{
|
||||||
@ -362,4 +530,53 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
border-bottom: 1px solid #EEEEEE;
|
border-bottom: 1px solid #EEEEEE;
|
||||||
}
|
}
|
||||||
|
.for-box{
|
||||||
|
width: 100%;
|
||||||
|
margin: 20px auto;
|
||||||
|
}
|
||||||
|
.for-title{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
}
|
||||||
|
.x-{
|
||||||
|
width: 100px;
|
||||||
|
border-bottom: 1px solid #EEEEEE;
|
||||||
|
margin: 0 15px;
|
||||||
|
}
|
||||||
|
.f-size{
|
||||||
|
width: 33%;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.s-size{
|
||||||
|
width: 33%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.l-size{
|
||||||
|
width: 33%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.r-size{
|
||||||
|
width: 33%;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.bottom-{
|
||||||
|
width: 98%;
|
||||||
|
}
|
||||||
|
.table-boxs{
|
||||||
|
border-radius: 8px;
|
||||||
|
width: 98%;
|
||||||
|
background: #fff;
|
||||||
|
margin: 25px auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user