订单出租

This commit is contained in:
jjLv 2024-11-25 17:20:12 +08:00
parent 7e408e4645
commit 1f5ef4499f
1 changed files with 111 additions and 5 deletions

View File

@ -5,8 +5,18 @@
<el-breadcrumb-item>订单明细</el-breadcrumb-item>
</el-breadcrumb>
<div class="section">
<el-header >订单流程</el-header>
<el-steps class="step" :space="200" :active="Id" finish-status="success">
<el-header>
<el-row type="flex" justify="space-between" align="middle">
<el-col :span="3">
<span>订单流程</span>
</el-col>
<el-col :span="1" style="text-align:right;margin-right:400px;font-size: 20px;">
<div style="color:green;border: 1px solid #ccc;">{{titleStaus}}</div>
</el-col>
</el-row>
</el-header>
<el-steps class="step" :space="300" :active="Id" finish-status="success">
<el-step :title="getStepTitle(1)"></el-step>
<el-step :title="getStepTitle(2)"></el-step>
<el-step :title="getStepTitle(3)"></el-step>
@ -15,7 +25,99 @@
</el-steps>
</div>
<div class="section">
<el-header>租赁信息
</el-header>
<div style="height: 600px; overflow-y: scroll">
<div
class="info"
style="margin-top: 10px; display: flex; flex-wrap: wrap"
>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
margin-left: 80px;
font-size: 14px;
"
>
<span>日期</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 16px;
"
>
<span>单号</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 20px;
"
>
<span>承修单位</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>操作人</span>
</div>
<div
class="item"
style="
width: 100%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>项目名称</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>委托单位</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>验收人</span>
</div>
</div>
</div>
</div>
</div>
</template>
@ -45,6 +147,7 @@ export default {
total: 0,
//
title: "",
titleStaus:"",
//
queryParams: {
typeId: undefined,
@ -56,10 +159,8 @@ export default {
},
mounted() {
const Id = Number(this.$route.query && this.$route.query.Id);
console.log("Id111111111",this.Id)
const isView = this.$route.query && this.$route.query.isView;
this.Id = Id || 1;
console.log("Id222222222222",this.Id)
if (isView == "true") {
this.isView = true;
} else {
@ -79,14 +180,19 @@ export default {
getStepTitle(stepId) {
console.log("id",this.Id)
if (this.Id === 1) {
this.titleStaus= stepId === 1 ? '待出库' : '';
return stepId === 1 ? '待出库' : '';
} else if (this.Id === 2) {
this.titleStaus= stepId === 1 ? '已出库' : stepId === 2 ? '待收货' : '';
return stepId === 1 ? '已出库' : stepId === 2 ? '待收货' : '';
} else if (this.Id === 3) {
this.titleStaus= 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : '';
return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : '';
} else if (this.Id === 4) {
this.titleStaus= 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : stepId === 4 ? '发起费用结算' : '';
return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : stepId === 4 ? '发起费用结算' : '';
} else if (this.Id === 5) {
this.titleStaus= 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : stepId === 4 ? '发起费用结算' : stepId === 5 ? '已完成' : '';
return stepId === 1 ? '已出库' : stepId === 2 ? '已收货' : stepId === 3 ? '租赁中' : stepId === 4 ? '发起费用结算' : stepId === 5 ? '已完成' : '';
}
return ''; //
@ -117,7 +223,7 @@ export default {
margin-top: 30px;
margin-bottom: 20px;
.step{
margin-left:20px;;
margin-left:80px;;
}
}