bonus
/
bonus-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

订单详情

This commit is contained in:
jjLv 2024-11-25 18:23:50 +08:00
parent 1f5ef4499f
commit 24a86eeab3
2 changed files with 210 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

302
src/views/lessor/order/detail.vue
View File

@ -10,13 +10,13 @@
<el-col :span="3">
<span>订单流程</span>
</el-col>
<el-col :span="1" style="text-align:right;margin-right:400px;font-size: 20px;">
<el-col :span="1" style="text-align:right;margin-right:300px;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-steps class="step" :space="400" :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>
@ -28,104 +28,107 @@
<div class="section">
<el-header>租赁信息
</el-header>
<div style="height: 600px; overflow-y: scroll">
<div style="height: 120px; overflow-y: scroll">
<div
class="info"
style="margin-top: 10px; display: flex; flex-wrap: wrap"
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 class="item" style="width: 35%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;margin-left: 80px;opacity: 0.7">
<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 class="item" style="width: 35%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;opacity: 0.7">
<span>下单时间：</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>操作人：</span>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;margin-left: 80px;opacity: 0.7">
<span>出租单位：</span>
</div>
<div
class="item"
style="
width: 100%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>项目名称：</span>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;opacity: 0.7">
<span>出租人：</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>委托单位：</span>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;opacity: 0.7">
<span>出租人联系电话：</span>
</div>
<div
class="item"
style="
width: 50%;
flex-shrink: 0;
margin-bottom: 5px;
font-size: 14px;
"
>
<span>验收人：</span>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;margin-left: 80px;opacity: 0.7">
<span>承租单位：</span>
</div>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;opacity: 0.7">
<span>承租人：</span>
</div>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;opacity: 0.7">
<span>承租人联系电话：</span>
</div>
<div class="item" style="width: 30%;flex-shrink: 0;margin-bottom: 5px;font-size: 16px;margin-left: 80px;opacity: 0.7">
<span>租赁协议：</span>
</div>
</div>
</div>
</div>
<div class="cart-tbody" >
<el-row class="cart-list" v-for="(goods, j) in cardList[0].good_list" :key="j">
<el-col :span="10" class="goods-info">
<el-col :span="7">
<img :src="goods.goods_pic" alt="" />
</el-col>
<div class="goods-code">
<div style="font-size: 14px; font-weight: bold">{{ goods.goods_name }}</div>
<div>租期： {{ goods.lease_day }}{{" "+"天"}}</div>
<div style="display: flex; justify-content: space-between; width: 100%;">
<div style="display:flex:1;text-align:left;">租金：{{ goods.lease_pic }}{{" "+"元/天"}}</div>
<div style="display:flex:1;text-align:left;margin-left:100px">数量：{{ goods.goods_num }}{{" "+"台"}}</div>
</div>
</div>
</el-col>
<el-col :span="5">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">总费用</div>
<div class="red-font">1500</div>
</el-col>
<el-col :span="5">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">租期</div>
<div style="color:black;font-weight: bold;">
{{ "2024-10-11"+" " }}{{"至"}}{{ " "+"2024-10-11" }}
</div>
</el-col>
<el-col :span="3">
<div style="font-size: 14px; font-weight: bold;margin-bottom:10px">
{{ "待出租"}}
</div>
</el-col>
<!-- <el-col :span="1.1">
<div>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
出库
</el-button>
<el-button
@click="handleViewOrder(j)"
type="text"
size="mini"
style="color: #blue; font-weight: bold"
>
驳回
</el-button>
</div>
</el-col> -->
</el-row>
</div>
</div>
</div>
</template>
<script>
import { getManufacturerSelect } from "@/api/ma/supplier";
import { downloadFile } from "@/utils/download";
import { getToken } from "@/utils/auth";
export default {
name: "orderDetail",
data() {
@ -154,7 +157,7 @@ export default {
supplierId: undefined,
productionTime: undefined,
},
cardList:[],
};
},
mounted() {
@ -167,7 +170,7 @@ export default {
this.isView = false;
}
this.$forceUpdate();
// this.getList();
this.getList();
},
watch:{
Id(newId){
@ -199,20 +202,61 @@ export default {
},
// /** 查询列表 */
// getList() {
// this.loading = true;
// this.queryParams.id = this.Id;
// this.queryParams.statusList = [2, 12];
// getPurchaseDetailsList(this.queryParams).then((response) => {
// this.tableList = response.data.purchaseCheckDetailsList;
// this.tableList.forEach((item) => {
// item.fixCodeStr = this.fixCodeList[Number(item.fixCode)];
// });
// // this.total = response.total;
// this.loading = false;
// });
// },
/** 查询列表 */
getList() {
this.cardList = [
{
company_name: '安徽博诺斯有限公司',
user_name: '王先生',
user_phone: '18725632356',
isChecked: false,
good_list: [
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
{
goods_pic:
'https://fc1tn.baidu.com/it/u=4185529537,1682541874&fm=202&src=766&fc=tdmatt&mola=new&crop=v1',
goods_name: 'W190挖掘机',
goods_code: '995221_JHL',
goods_type: '挖地型号996',
lease_date: '',
lease_pic: 300,
lease_day: 0,
goods_num: 0,
totalAmount: 0,
isChecked: false,
lease_date_string: '',
},
],
},
];
},
},
@ -226,5 +270,69 @@ export default {
margin-left:80px;;
}
}
.cart-tbody {
background: #fff;
padding: 8px 12px;
margin: 10px;
border: 1px solid #ccc;
border-radius: 20px;
.cart-user-info {
display: flex;
align-items: center;
font-size: 13px;
.user-name,
.user-phone {
padding: 3px 18px;
border: 1px solid #ccc;
}
.user-name {
margin-left: 20px;
border-right: none;
}
}
.cart-list {
margin: 15px 0;
display: flex;
align-items: center;
div {
text-align: center;
}
.goods-info {
display: flex;
align-content: center;
img {
width: 200px;
height: 100px;
}
.goods-code {
margin-left: 40px;
display: flex;
flex-direction: column;
justify-content: space-around;
div {
text-align: left;
}
}
}
.lease-date {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 12px;
}
.red-font {
color: #ff4800;
font-weight: bold;
}
}
}
</style>

8
src/views/lessor/order/index.vue
View File

@ -151,9 +151,11 @@
</el-col>
<div class="goods-code">
<div style="font-size: 14px; font-weight: bold">{{ goods.goods_name }}</div>
<div>租期： {{ goods.lease_day }}</div>
<div>租金：{{ goods.lease_pic }}{{" "+"元/天"}}</div>
<div>数量：{{ goods.goods_num }}{{" "+"台"}}</div>
<div>租期： {{ goods.lease_day }}{{" "+"天"}}</div>
<div style="display: flex; justify-content: space-between; width: 100%;">
<div style="display:flex:1;text-align:left;">租金：{{ goods.lease_pic }}{{" "+"元/天"}}</div>
<div style="display:flex:1;text-align:left;margin-left:100px">数量：{{ goods.goods_num }}{{" "+"台"}}</div>
</div>
</div>
</el-col>
<el-col :span="5">