完善车辆管理模块

This commit is contained in:
2023-08-16 17:29:17 +08:00
parent c27a99d0ac
commit 1a119820dd
23 changed files with 389 additions and 92 deletions

View File

@ -1,26 +1,25 @@
<template>
<div class="wrap">
<div class="navBar">
<van-nav-bar
:title="id ? '修改车辆信息' : '添加车辆'"
left-arrow
left-arrow-color="#FFFFFF"
:border="false"
:fixed="true"
:safe-area-inset-top="true"
@click-left="h5GoBack"
/>
</div>
<div class="addContentWrap">
<cell-group label="车牌号" placeholder="请输入车牌号" @input="getPLateNum(carNum)" v-model="carNum" />
<!-- <div class="itemContent">-->
<!-- <div class="titleType">-->
<!-- <img class="startImg" src="@/assets/start.png" />-->
<!-- <span>车牌号</span>-->
<!-- </div>-->
<!-- <div class="checkContent">-->
<!-- <input placeholder="请输入车牌号" />-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="lineBot"></div>-->
<div class="itemContent">
<div class="titleType">
<img class="startImg" src="@/assets/start.png" />
<span>车辆类型</span>
</div>
<select id="mySelect" style="width: 80px">
<option value="一般平板">一般平板</option>
<option value="小轿车">小轿车</option>
<option value="大卡车">大卡车</option>
<select id="mySelect" style="width: 70px" v-model="selectedOption">
<option v-for="(item,index) in typeList" :key="index" :value="index">{{item}}</option>
</select>
</div>
<div class="lineBot"></div>
@ -30,8 +29,8 @@
<span>是否参与中道聚合</span>
</div>
<div class="isJoin">
<van-radio-group v-model="radio3" @change="isChange" class="joinWrap">
<van-radio name="参与" style="margin-right: 26px">
<van-radio-group v-model="isJoin" @change="isChange" class="joinWrap">
<van-radio :name="1" style="margin-right: 26px">
参与
<img
slot="icon"
@ -39,7 +38,7 @@
:src="props.checked ? activeIcon : inactiveIcon"
>
</van-radio>
<van-radio name="不参与">
<van-radio :name="0">
不参与
<img
slot="icon"
@ -63,7 +62,7 @@
<span class="service">拖车服务:</span>
<span class="line"></span>
</div>
<van-radio-group v-model="radio" @change="change" class="radioWrap">
<van-radio-group v-model="trailerService" @change="change" class="radioWrap">
<van-radio name="故障——平板拖车" class="item">
故障平板拖车
<img
@ -87,7 +86,7 @@
<span class="service">小修服务:</span>
<span class="line"></span>
</div>
<van-radio-group v-model="radio2" @change="change2" class="radioWrap">
<van-radio-group v-model="smallRepairService" @change="change2" class="radioWrap">
<van-radio name="换胎" class="item">
换胎
<img
@ -130,6 +129,7 @@
<script>
import {myMixins} from "@/utils/myMixins"
import {vehicleTypeList,saveVehicle,getInfoById} from "@/api/mine"
import TwoCommonBtn from "@/components/twoBtnCommon.vue"
import CellGroup from "@/components/cellGroup.vue";
export default {
@ -137,40 +137,99 @@ export default {
mixins:[myMixins],
data(){
return{
radio: '故障——平板拖车',
radio2: '换胎',
radio3:'参与',
trailerService: '',//拖车服务
smallRepairService: '',//小修服务
isJoin:'',//是否参与
activeIcon: require('@/assets/check.png'),
inactiveIcon: require('@/assets/uncheck.png'),
carNum:"",
carNum:"",//车牌号
typeList:[],//车辆类型列表
selectedOption:'1',//车辆类型
id:'',//车辆Id
serviceIds:''//车辆服务种类
}
},
mounted() {
created() {
this.id=this.$route.query?.id || ''
},
async mounted() {
const selectElement = document.getElementById('mySelect');
selectElement.addEventListener('change', function() {
const selectedValue = selectElement.value;
console.log('Selected value:', selectedValue);
this.selectedOption=selectElement.value;
// console.log(this.selectedOption,"11")
});
await this.getTypeList();
// console.log(this.selectedOption,"22")
this.id=this.$route.query?.id || ''
console.log("this.$route.query",this.id);
await this.vehicleInfo()
},
methods:{
async getTypeList() {
let result=await vehicleTypeList();
if(result.code === 200){
this.typeList=result.data
}
},
async vehicleInfo(){
let res= await getInfoById({
vehicleId:this.id
})
if(res.code === 200){
let result=res.data;
console.log("获取信息",res)
this.id=result.vehicleId
this.carNum=result.plateNumber
this.isJoin=result.hasPolymerization.code
this.selectedOption=result.vehicleType;
this.serviceIds=result.serviceIds
// console.log("num",this.carNum,this.isJoin)
}
},
change(e) {
console.log("拖车服务",e)
this.trailerService=e
},
change2(e) {
console.log("小修服务",e)
this.smallRepairService=e
},
isChange(e){
console.log("是否参与",e)
this.isJoin=e
},
cancelBtn(){
console.log("取消车辆")
cancelBtn(){//取消车辆
this.isJoin='';
this.trailerService='';
this.smallRepairService='';
this.carNum=''
},
submitBtn(){
console.log("提交车辆")
async submitBtn(){
console.log("提交车辆");
let res=await saveVehicle({
vehicleId:this.id ? this.id : '',
plateNumber:this.carNum ? this.carNum :'',
vehicleType:this.selectedOption ? this.selectedOption : '',
hasPolymerization:Number(this.isJoin ? this.isJoin : '') ,
serviceIds:this.serviceIds ? this.serviceIds : []
})
if(res.code === 200){
if(this.id){
this.$toast('修改成功')
}else{
this.$toast('添加成功')
}
setTimeout(()=>{
this.$router.back();
},2000)
}
console.log("res",res)
},
getPLateNum(e){
console.log("e",e)
}
},
},
components:{
CellGroup,
@ -182,6 +241,9 @@ export default {
<style scoped lang="scss">
@import "@/styles/mixin.scss";
@import "@/styles/common.scss";
.navBar{
margin-bottom: 46px;
}
.wrap{
@include wh(100%,100%);
}
@ -194,7 +256,7 @@ export default {
box-sizing: border-box;
padding-right: 25px;
.titleType{
@include fontWeightSize(500,14px);
@include fontWeightSize(bold,14px);
color: #323643;
}
.isJoin{
@ -213,7 +275,7 @@ export default {
input{
border: none;
text-align: right;
@include fontWeightSize(500,13px);
@include fontWeightSize(bold,13px);
opacity: .5;
}
}
@ -223,7 +285,7 @@ export default {
opacity: 0.6;
}
.serviceType{
@include fontWeightSize(500,13px);
@include fontWeightSize(bold,13px);
margin-left: 15px;
.trailerService{
margin-bottom: 10px;