Skip to content

M
mes-ui
Commit 0f26b924 authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

电子对账单数据对接

parent 914dfa78
Hide whitespace changes
Inline Side-by-side
Showing with 189 additions and 384 deletions
pages/order/bill/index.vue
View file @ 0f26b924
<template> <template>
<div> <div class="order-bill">
<Row> <Row>
<Col span="4"> <Col span="4">
<Input <Input
v-model="keys" v-model="keys"
search search
placeholder="请输入订单编号" placeholder="请输入订单编号"
enter-button clearable
style="width:280px;margin:10px 5px;" style="width:280px;margin:10px 5px;"
/> />
</Col> </Col>
...@@ -14,81 +14,55 @@ ...@@ -14,81 +14,55 @@
<a @click="clickSeach">高级搜索</a> <a @click="clickSeach">高级搜索</a>
</Col> </Col>
</Row> </Row>
<div class="bill"> <div class="bill">
<div class="bill-l"> <h4 class="title1">订单信息</h4>
<h4 class="title1">订单信息</h4> <h4 class="title2">订单信息</h4>
<div class="body" v-for="(li,index) in listData" :key="index" @click="itemClick"> </div>
<div class="l-list"> <div class="bill-conten">
<Row class="title-i"> <div class="bill-body" v-for="(li,index) in listData" :key="index" @click="itemClick">
<Col :span="12">{{li.name}}</Col> <div class="body">
<Col :span="12">{{li.code}}</Col> <div class="bill-l">
</Row> <div class="l-list">
<Row class="bady-c"> <Row class="title-i">
<Col :span="12">订单状态：{{li.status}}</Col> <Col :span="12">{{li.mesCode}}</Col>
<Col :span="12">紧急程度：{{li.chengdu}}</Col> <Col :span="12" style="text-align: right;padding-right:10px">{{li.productName}}</Col>
</Row> </Row>
<Row class="bady-c"> <Row class="bady-c">
<Col :span="12">数量：{{li.cont}}</Col> <Col :span="8">订单状态：{{li.status}}</Col>
<Col :span="12">任务类型：{{li.type}}</Col> <Col :span="16">工艺规程：{{li.actualFinishDate}}</Col>
</Row> </Row>
<div class="bady-c">图号：{{li.tuhao}}</div>
<div class="bady-c">批次号：{{li.picihao}}</div> <div class="bady-c">订单计划开始时间：{{li.demandStartDate}}</div>
<div class="bady-c">项目号：{{li.xianmuhao}}</div> <div class="bady-c">订单计划结束时间：{{li.demandFinishDate}}</div>
</div>
</div> <div class="bady-c">实际开始时间：{{li.actualStartDate}}</div>
</div> <div class="bady-c">实际结束时间：{{li.actualFinishDate}}</div>
<div class="bill-r">
<h4 class="title2">工单信息</h4>
<div class="r-list">
<div v-for="(li,index) in WorkOrder1" :key="index">
<div
class="gong-dan"
:class="li.status==0?'gong-dan0':li.status==1?'gong-dan1':li.status==2?'gong-dan2':'gong-dan3'"
>
<div>{{li.title}}</div>
<div>{{li.name}}</div>
<div>{{li.PaigaongTime}}</div>
<div>{{li.finshTime}}</div>
<div>{{li.startTime}}</div>
<div>{{li.endTime}}</div>
</div>
</div>
</div>
<div class="r-list">
<div v-for="(li,index) in WorkOrder2" :key="index">
<div
class="gong-dan"
:class="li.status==0?'gong-dan0':li.status==1?'gong-dan1':li.status==2?'gong-dan2':'gong-dan3'"
>
<div>{{li.title}}</div>
<div>{{li.name}}</div>
<div>{{li.PaigaongTime}}</div>
<div>{{li.finshTime}}</div>
<div>{{li.startTime}}</div>
<div>{{li.endTime}}</div>
</div> </div>
</div> </div>
</div> <div class="bill-r">
<div class="r-list"> <div class="r-list">
<div v-for="(li,index) in WorkOrder3" :key="index"> <div v-for="(item,index) in li.dispatchList" :key="index">
<div <!-- status=0,已完成，1正在进行，3暂停 -->
class="gong-dan" <div
:class="li.status==0?'gong-dan0':li.status==1?'gong-dan1':li.status==2?'gong-dan2':'gong-dan3'" class="gong-dan"
> :class="item.status==0?'gong-dan0':item.status==1?'gong-dan1':item.status==2?'gong-dan2':'gong-dan3'"
<div>{{li.title}}</div> >
<div>{{li.name}}</div> <div>{{item.taskSeq}} {{item.detailName}}</div>
<div>{{li.PaigaongTime}}</div> <div>人员：{{item.userNames}}</div>
<div>{{li.finshTime}}</div> <div>{{li.demandStartDate}}</div>
<div>{{li.startTime}}</div> <div>{{li.demandFinishDate}}</div>
<div>{{li.endTime}}</div> <div>{{li.actualStartDate}}</div>
<div>{{li.actualFinishDate}}</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<Modal v-model="modal" title="高级搜索" @on-ok="ok" @on-cancel="cancel"> <Modal v-model="modal" title="高级搜索" @on-ok="ok" @on-cancel="cancel">
<Form ref="form" :model="entity" :rules="rules" :label-width="90"> <Form ref="form" :model="entity" :label-width="90">
<Row> <Row>
<Col :span="12"> <Col :span="12">
<FormItem label="订单" prop="name"> <FormItem label="订单" prop="name">
...@@ -122,210 +96,40 @@ export default { ...@@ -122,210 +96,40 @@ export default {
keys: "", keys: "",
modal: false, modal: false,
entity: {}, entity: {},
listP: [ WorkOrder: [],
{
name: "DDBH_20200219", rules: []
code: "CR200J0001",
status: "已派发",
chengdu: "一级",
cont: 100,
type: "正式计划",
tuhao: "CLX-2K-001",
picihao: "20200519-LXG-001",
xianmuhao: "XM-20200519-LXG"
},
{
name: "DDBH_20200220",
code: "CR200J0001",
status: "已派发",
chengdu: "一级",
cont: 100,
type: "正式计划",
tuhao: "CLX-2K-001",
picihao: "20200519-LXG-001",
xianmuhao: "XM-20200519-LXG"
},
{
name: "DDBH_20200221",
code: "CR200J0001",
status: "已派发",
chengdu: "一级",
cont: 100,
type: "正式计划",
tuhao: "CLX-2K-001",
picihao: "20200519-LXG-001",
xianmuhao: "XM-20200519-LXG"
}
],
WorkOrder1: [
{
title: "10 作业准备",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 0 //已完成
},
{
title: "20 接触网断电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 1 //正在进行
},
{
title: "30 有电作业",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "40 泄露试验",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "50 票据填写",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
}
],
WorkOrder2: [
{
title: "10 车顶作业",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 0 //已完成
},
{
title: "20 司机室作业",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 3
},
{
title: "30 机械间作业",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "40 走行部作业",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
}
],
WorkOrder3: [
{
title: "10 接车入库",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 0 //已完成
},
{
title: "20 接触网断电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 1 //正在进行
},
{
title: "30 车顶检查",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 1
},
{
title: "40 电务检查",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "50 供电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "50 供电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "50 供电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
},
{
title: "50 供电",
name: "机加中心-操作工1",
PaigaongTime: "2020-03-12",
finshTime: "2020-03-12",
startTime: "2020-03-12",
endTime: "2020-03-12",
status: 2
}
]
}; };
}, },
computed: { computed: {
listData() { listData() {
return this.listP.filter(u => { return this.WorkOrder.filter(u => {
return u.name.indexOf(this.keys) > -1; return u.mesCode.indexOf(this.keys) > -1;
}); });
} }
}, },
mounted() {
this.getMessage();
},
methods: { methods: {
getMessage() {
let conditions = [
{
conditionalType: "Equal",
fieldName: "",
fieldValue: ""
}
];
this.$api
.post(`${PlanUrl}/orderaudit/pagedaccountmesorders`, {
conditions: conditions
})
.then(res => {
if (res.success) {
this.WorkOrder = res.result.items;
}
});
},
clickSeach() { clickSeach() {
this.modal = true; this.modal = true;
}, },
...@@ -343,136 +147,137 @@ export default { ...@@ -343,136 +147,137 @@ export default {
}; };
</script> </script>
<style lang="less" > <style lang="less" >
.bill { .order-bill {
display: flex; .bill {
display: -webkit-flex; display: flex;
height: 83vh; display: -webkit-flex;
overflow: hidden; height: 49px;
margin-left: 3px; line-height: 49px;
border: 1px solid #e4e6ed;
.bill-l {
width: 400px;
border: 1px solid #e4e6ed; border: 1px solid #e4e6ed;
height: 100%;
overflow: hidden;
.title1 { .title1 {
width: 400px;
background: rgba(81, 90, 110, 0.2); background: rgba(81, 90, 110, 0.2);
height: 49px;
line-height: 49px;
padding-left: 10px; padding-left: 10px;
} }
.body:hover {
cursor: pointer;
}
.body {
padding: 15px 0;
border-bottom: 1px solid #cacbd0;
.l-list {
width: 360px;
height: 200px;
border: 1px solid #2680eb;
border-radius: 4px;
margin: 0 auto;
.title-i {
height: 36px;
line-height: 36px;
padding-left: 10px;
border-bottom: 1px dashed #a7b8cc;
font-weight: bold;
color: rgba(38, 128, 235, 1);
}
.bady-c {
height: 31px;
line-height: 31px;
padding-left: 10px;
}
}
}
}
.bill-r {
width: 1495px;
height: 100%;
border: 1px solid #e4e6ed;
// overflow: hidden;
.title2 { .title2 {
width: 1499px;
background: rgba(38, 128, 235, 0.2); background: rgba(38, 128, 235, 0.2);
height: 49px;
line-height: 49px;
padding-left: 10px; padding-left: 10px;
} }
.r-list { }
width: 1495px; .bill-conten {
display: -webkit-flex; height: 77vh;
display: flex; overflow: auto;
padding: 15px 10px; border: 1px solid #e4e6ed;
border-bottom: 1px solid #cacbd0; .bill-body {
flex-wrap: nowrap; .body {
overflow-x: auto; display: flex;
.gong-dan { display: -webkit-flex;
div { border-bottom: 1px solid #e4e6ed;
height: 30px; .bill-l {
} width: 400px;
div:nth-child(1) { padding: 15px 0;
color: #515a6e; .l-list {
font-size: 16px; width: 360px;
font-weight: bold; height: 200px;
} border: 1px solid #2680eb;
div:nth-child(2) { border-radius: 4px;
color: #515a6e; margin: 0 auto;
font-size: 14px; .title-i {
} height: 36px;
div:nth-child(3), line-height: 36px;
div:nth-child(4), padding-left: 10px;
div:nth-child(5), border-bottom: 1px dashed #a7b8cc;
div:nth-child(6) { font-weight: bold;
color: #666; color: rgba(38, 128, 235, 1);
font-size: 14px; }
opacity: 0.6; .bady-c {
} height: 31px;
} line-height: 31px;
.gong-dan0 { padding-left: 10px;
width: 198.5px; }
height: 200px; }
background-image: url("../../../assets/images/bill/black.png"); .l-list:hover {
padding: 13px 20px; cursor: pointer;
// float: left; }
div:nth-child(1),
div:nth-child(2) {
color: #515a6e;
}
}
.gong-dan1 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/green.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #0dd78d;
}
}
.gong-dan2 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/blue.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #2680eb;
opacity: 0.5;
} }
} .bill-r {
.gong-dan3 { width: 1495px;
width: 198.5px; border-left: 1px solid #e4e6ed;
height: 200px; .r-list {
background-image: url("../../../assets/images/bill/red.png"); display: -webkit-flex;
padding: 13px 20px; display: flex;
// float: left; padding: 15px 10px;
div:nth-child(1), flex-wrap: nowrap;
div:nth-child(2) { overflow-x: auto;
color: #fe7777; .gong-dan {
div {
height: 30px;
}
div:nth-child(1) {
color: #515a6e;
font-size: 16px;
font-weight: bold;
}
div:nth-child(2) {
color: #515a6e;
font-size: 14px;
}
div:nth-child(3),
div:nth-child(4),
div:nth-child(5),
div:nth-child(6) {
color: #666;
font-size: 14px;
opacity: 0.6;
}
}
.gong-dan0 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/black.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #515a6e;
}
}
.gong-dan1 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/green.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #0dd78d;
}
}
.gong-dan2 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/blue.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #2680eb;
opacity: 0.5;
}
}
.gong-dan3 {
width: 198.5px;
height: 200px;
background-image: url("../../../assets/images/bill/red.png");
padding: 13px 20px;
// float: left;
div:nth-child(1),
div:nth-child(2) {
color: #fe7777;
}
}
}
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment