apps/supplier-dispatch-h5
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

task#13992,代办列表更新，新增维保审批列表

Browse Source
This commit is contained in:
zhouxueli
2024-06-11 09:49:36 +08:00
parent beff1bb6f9
commit 374eb5070b
11 changed files with 539 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
src/views/vehicle-maintenance/maintenance-application.vue Normal file
View File

@ -0,0 +1,134 @@
<template>
<div class="wrap">
<div class="navBar">
<van-nav-bar
title="车辆维保"
left-arrow
left-arrow-color="#FFFFFF"
:border="false"
:fixed="true"
:safe-area-inset-top="true"
@click-left="h5GoBack"
/>
</div>
<div class="detailInfo">
<div class="line1">
<div class="leftTitle">维保申请:</div>
<div class="right">
<img class="commonImg" src="@/assets/waitSubmit.png">
<div class="yelColor">待审核</div>
</div>
</div>
<div class="line"></div>
<div class="carName"><span class="opa">车辆名称:</span><span>小宋车辆</span></div>
<div class="carNum"><span class="opa">车牌号:</span><span>沪A123456</span></div>
<div class="shopName"><span class="opa">门店信息:</span><span>浦东新区欧洲维修高科西路店浦东新区欧洲维修高科西路店</span></div>
<div class="shopImgList">
<img src="@/assets/love.jpg">
<img src="@/assets/love.jpg">
<img src="@/assets/love.jpg">
<img src="@/assets/love.jpg">
</div>
</div>
<div class="approvalContent">
</div>
</div>
</template>
<script>
import {myMixins} from "@/utils/myMixins"
export default {
name: "maintenance-application",
mixins:[myMixins],
data() {
return {
id:'',
noClick:true,
}
},
mounted() {
this.id=this.$route.params.id
console.log("mounted.",this.id)
// this.getList()
},
methods: {
async getList() {
},
}
}
</script>
<style scoped lang="scss">
@import "@/styles/mixin.scss";
@import "@/styles/common.scss";
@import "@/styles/approval.scss";
.wrap{
background-color: #F4F5F7;
}
.detailInfo{
width: 100%;
background: #FFFFFF;
box-sizing: border-box;
padding: 13px 25px 24px 24px;
margin-bottom: 10px;
.line1{
display: flex;
justify-content: space-between;
line-height: 23px;
.leftTitle{
font-weight: bold;
font-size: 14px;
color: #323643;
line-height: 20px;
opacity: .66;
}
.right{
display: flex;
align-items: center;
}
}
.line{
margin: 5px 0;
width: 325px;
border-bottom: 2px solid;
opacity: 0.16;
border-image: linear-gradient(270deg, rgba(217, 217, 217, 0.6), rgba(178, 178, 178, 1), rgba(178, 178, 178, 1), rgba(217, 217, 217, 0.6)) 1 1;
}
.opa{
display: inline-block;
width: 60px;
font-size: 12px;
color: #000000;
line-height: 27px;
opacity: .5;
}
.shopName{
display: flex;
align-items: baseline;
}
.shopImgList{
margin-top: 6px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
img{
background: #FAFAFA;
border-radius: 3px;
border: 1px solid #EAEAEA;
backdrop-filter: blur(10px);
@include wh(154px,93px);
margin-bottom: 10px;
}
}
}
.approvalContent{
background-color: #FFFFFF;
width: 100%;
height: 200px;
}
</style>

141
src/views/vehicle-maintenance/vehicle-maintenance-list.vue Normal file
View File

@ -0,0 +1,141 @@
<template>
<div class="wrap">
<div class="navBar">
<van-nav-bar
title="车辆维保"
left-arrow
left-arrow-color="#FFFFFF"
:border="false"
:fixed="true"
:safe-area-inset-top="true"
@click-left="h5GoBack"
/>
</div>
<div class="tab_wrap">
<div v-for="(item, index) in tabArr" :key="index"
@click="changeTab(index)">
<span :class="{'active' : activeIndex == index , 'alpha' :true}"> {{ item.name }}</span>
<span class="numTip" style="opacity: 1 !important;" v-if="index===0">{{item.num}}</span>
</div>
</div>
<!-- v-show="!show"-->
<van-pull-refresh class="refresh" v-model="isLoading" @refresh="onRefresh">
<div class="listWrap">
<!-- v-for="(item,index) in pageList" :key="index" @click="noMultipleClicks(goPageDetail,item.id)"-->
<div class="listItem" @click="noMultipleClicks(goPageDetail)">
<div class="line1">
<div class="title">维保申请</div>
<div class="right">
<!-- <img class="commonImg" :src="getStatus(item.state.code)">
<div :class="getStatusColor(item.state.code)">{{item.state.label}}</div>-->
<img class="commonImg" src="@/assets/waitSubmit.png">
<div class="yelColor">待审核</div>
</div>
</div>
<div class="driverInfo">中道001车辆名称 / A589566</div>
<div class="time">2023-05-12 12:30:30</div>
<!-- <div v-show="activeIndex == 2"><span>审核备注:</span><span style="color: #FF5D2E">{{ item.auditRemark }}</span></div>-->
</div>
<div class="listItem" >
<div class="line1">
<div class="title">维保申请</div>
<div class="right">
<img class="commonImg" src="@/assets/waitSubmit.png">
<div class="yelColor">待审核</div>
</div>
</div>
<div class="driverInfo">中道001车辆名称 / A589566</div>
<div class="time">2023-05-12 12:30:30</div>
</div>
</div>
</van-pull-refresh>
</div>
</template>
<script>
import {myMixins} from "@/utils/myMixins"
// import {getStatus,getStatusColor} from "@/utils/approval";
export default {
name: "vehicle-maintenance-list",
mixins:[myMixins],
data() {
return {
id:'',
tabArr: [ {name: '待审批', status: 2,num:2 },{name: '已审批', status: 2,num:0 },],
activeIndex: 0,
pageList:[],
pageNum:1,
pageSize:10,
isLoading:"",
noClick:true,
}
},
mounted() {
this.id=this.$route.params.id
console.log("this.id",this.id)
// this.getList()
},
computed:{
/* show() {
return (this.pageList.length < 0 || this.pageList.length == 0); // 判断数组长度是否大于 0
},*/
},
methods: {
onRefresh() {
this.getList()
setTimeout(() => {
this.$toast('刷新成功');
this.isLoading = false;
}, 1000);
},
async changeTab(index) {
this.activeIndex = index
this.pageNum = 1
this.pageList = [];
await this.getList()
},
async getList() {
},
goPageDetail(id){
console.log("跳转详情",id)
this.$router.push({
name: 'maintenanceApplication', // 目标路由的名称
params: {
id:123,
// index:this.activeIndex,
// batchCode:this.id,
// getUrlId:this.getUrlId,
// type:this.type,
}
});
},
}
}
</script>
<style scoped lang="scss">
@import "@/styles/mixin.scss";
@import "@/styles/common.scss";
@import "@/styles/approval.scss";
.listItem{
padding: 11px 28px 11px 23px;
div{
.title{
@include fontWeightSize(bold,14px);
line-height: 20px;
margin-bottom: 8px;
}
.right{
@include flexCenter();
}
}
.driverInfo{
font-size: 12px;
line-height: 18px;
margin-bottom: 5px;
}
}
</style>