数据处理

src/views/index/driverAdd.vue

@@ -67,7 +67,7 @@
       accept="image "
     />
   </div>
-  <div class="lineBot"></div>
+<!--  <div class="lineBot"></div>
   <div class="itemContent">
     <div class="titleType">
       <img class="startImg" src="@/assets/start.png" />
@@ -80,11 +80,12 @@
       :preview-size="54"
       accept="image "
     />
-  </div>
+  </div>-->
   <div class="lineBot"></div>
   <div class="itemContent">
     <div class="titleType">
-      <span>头像</span>
+      <img class="startImg" src="@/assets/start.png" />
+      <span>免冠正面照</span>
     </div>
     <van-uploader
       v-model="iconList"
@@ -307,7 +308,7 @@ export default {
       let res = await uploadImage(formData)
       this.drivingLicenceContrary = res.data;
     },
-    async iconListHandler(file) {           // 上传头像
+    async iconListHandler(file) {           // 上传免冠正面照
       const formData = new FormData();
       formData.append("file" , file.file);
       let res = await uploadImage(formData)
@@ -399,9 +400,13 @@ export default {
         this.$toast('驾驶证首页未上传')
         return
       }
-      if(!this.drivingLicenceContrary) {
+     /* if(!this.drivingLicenceContrary) {
         this.$toast('驾驶证副页未上传')
         return
+      }*/
+       if(!this.icon) {
+       this.$toast('免冠正面照未上传')
+       return
      }
       let drivingLicenceName=this.drivingLicenceName.replace(/[^\u4e00-\u9fff]+/g, '');
       let driverName=this.driverName.replace(/[^\u4e00-\u9fff]+/g, '');

src/views/index/driverManage.vue

@@ -18,6 +18,43 @@
         </template>
       </van-nav-bar>
     </div>
+    <van-search
+        v-model="searchVal"
+        show-action
+        placeholder="请输入司机姓名、电话、身份证号"
+        @search="resetHandler"
+    >
+      <template #action>
+        <div @click="resetHandler">搜索</div>
+      </template>
+    </van-search>
+    <div class="filterWrap">
+      <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="idCardStatusList" placeholder="身份证录入状态" :class="{'customSel':true , 'has-value': idCardStatusList }" clearable>
+        <el-option
+            v-for="item in idCardStatusListOptions"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value">
+        </el-option>
+      </el-select>
+      <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="driverLicenseStatusList" placeholder="驾驶证录入状态" :class="{'customSel':true , 'has-value': driverLicenseStatusList }" clearable>
+        <el-option
+            v-for="item in driverLicenseStatusListOptions"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value">
+        </el-option>
+      </el-select>
+      <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="authStatusList" placeholder="认证状态" :class="{'customSel':true , 'has-value': authStatusList }" clearable>
+        <el-option
+            v-for="item in authStatesOptions"
+            :key="item.value"
+            :label="item.name"
+            :value="item.value">
+        </el-option>
+      </el-select>
+    </div>
+    <div class="wrap_cls">
       <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
         <van-list
             v-model="loading"
@@ -25,13 +62,32 @@
             finished-text="没有更多了"
             @load="onLoad"
         >
-        <div class="itemWrap" v-for="(item,index) in driverList" :key="index">
+          <div class="itemWrap" v-for="(item,index) in driverList" :key="index" @click.stop="updateDriver(item)">
             <div class="name-status">
-            <div class="namephone">{{ item.driverName }} / {{ item.driverPhone }}</div>
-            <div class="twoBtn">
-              <button v-if="permissonList.includes('driverModifyBtn')" class="del" @click="handleStatus(item)">{{ item.states?.label == '启用'  ? '停用' : '启用' }}</button>
-              <button v-if="permissonList.includes('driverModifyBtn')" class="revise" @click="updateDriver(item)">修改</button>
+              <div class="namephone">{{ item.driverName }} / {{ item.driverPhone }}
+                <span style="margin-left: 10px" :class="item.states?.code == 1 ? 'statusYes' : 'statusNo'">{{ item.states?.label }}</span>
               </div>
+              <div class="twoBtn">
+<!--               只有启用状态下才展示停用按钮-->
+                <button v-if="permissonList.includes('driverModifyBtn') && item.states?.code==1" class="del" @click.stop="handleStatus(item)">停用</button>
+                <!--              <button v-if="permissonList.includes('driverModifyBtn')" class="revise" @click="updateDriver(item)">修改</button>-->
+              </div>
+            </div>
+            <div class="juhe flex-between">
+              <span class="zdJuhe">录入状态</span>
+              <span class="flex-right">
+            <span class="common_cls" v-if="item.idCardStatusStr" :class="getClass(item.idCardStatus)?.className">{{item.idCardStatusStr}}</span>
+            <span class="common_cls" v-if="item.driverLicenseStatusStr" :class="getClass(item.driverLicenseStatus)?.className">{{item.driverLicenseStatusStr}}</span>
+          </span>
+<!--              <span class="flex-right" v-if="item.idCardStatusStr">
+                <span class="common_cls" :class="getClass(item.idCardStatus)?.className">{{item.idCardStatusStr}}</span>
+              </span>-->
+            </div>
+            <div class="juhe flex-between">
+              <span class="zdJuhe">认证状态</span>
+              <span class="flex-right" v-if="item.authStatusStr">
+                <span class="common_cls"  :class="getClass(item.authStatusStr)?.className">{{item.authStatusStr}}</span>
+              </span>
             </div>
             <div class="" style="display: flex">
               <div class="sex" style="margin-right: 40px">
@@ -47,22 +103,24 @@
               <span class="halfOpci">身份证号:</span>
               <span class="allOpci">{{ item.identityCardNumber }}</span>
             </div>
-          <div>
+            <van-icon class="arrow_position" v-if="permissonList.includes('driverModifyBtn')" name="arrow" />
+<!--            <div>
               <span class="halfOpci">状&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;态:</span>
               <span :class="item.states?.code == 1 ? 'statusYes' : 'statusNo'">{{ item.states?.label }}</span>
+            </div>-->
           </div>
-        </div>
-
         </van-list>
       </van-pull-refresh>
 
     </div>
+  </div>
 </template>
 
 <script>
 
 import {myMixins} from "@/utils/myMixins"
 import {driverList, enableAction, userOperationPermissions} from "@/api/mine"
+import {Dialog} from "vant";
 export default {
   name: "driverManage",
   mixins:[myMixins],
@@ -79,6 +137,40 @@ export default {
       loading: false,
       finished: false,
       permissonList:[],
+      searchVal:'',
+      idCardStatusList:[],
+      driverLicenseStatusList:[],
+      authStatusList:[],
+      idCardStatusListOptions: [{
+        name: '身份证未录入',
+        value: 0
+      },{
+        name: '身份证核验通过',
+        value: 1
+      },{
+        name: '身份证核验不通过',
+        value: 2
+      }],
+      authStatesOptions: [{
+        name: '免冠正面照未录入',
+        value: 1
+      },{
+        name: '免冠正面照认证通过',
+        value: 3
+      },{
+        name: '免冠正面照认证不通过',
+        value: 2
+      }],
+      driverLicenseStatusListOptions: [{
+        name: '驾驶证未录入',
+        value: 0
+      },{
+        name: '驾驶证认证通过',
+        value: 1
+      },{
+        name: '驾驶证认证不通过',
+        value: 2
+      }],
     }
   },
   mounted() {
@@ -88,9 +180,41 @@ export default {
     // this.getDriverList()
   },
   methods:{
+    getClass(id) {
+      const ids = String(id)
+      const steps = {
+        0: {
+          className: 'default_cls'
+        },
+        1: {
+          className: 'success_cls'
+        },
+        2: {
+          className: 'danger_cls'
+        },
+        '免冠正面照未录入': {
+          className: 'default_cls'
+        },
+        '免冠正面照认证通过': {
+          className: 'success_cls'
+        },
+        '免冠正面照认证不通过': {
+          className: 'danger_cls'
+        },
+      }
+      return steps[ids] || { className: 'default_cls' }
+    },
+    async resetHandler() {
+      this.pageNum=1
+      this.finished = false;
+      this.total = 0;
+      await this.getDriverList();
+    },
     async onLoad(){
       await this.getDriverList()
+      if (this.total>10){
         this.pageNum++;
+      }
       // 加载状态结束
       this.loading = false;
       // 数据全部加载完成
@@ -118,7 +242,11 @@ export default {
     async getDriverList(){
         let res = await  driverList({
           pageNum:this.pageNum,
-          pageSize:this.pageSize
+          pageSize:this.pageSize,
+          searchVal: this.searchVal,
+          idCardStatusList: this.idCardStatusList,
+          driverLicenseStatusList: this.driverLicenseStatusList,
+          authStatusList: this.authStatusList,
         });
         if(res.code == 200){
           this.total=res.total
@@ -130,12 +258,11 @@ export default {
             this.driverList = preList.concat(arr)
           }
         }
+      console.log('this.driverList',this.driverList)
      },
     async getPermissions(){
       let res = await userOperationPermissions();
       this.permissonList = res.data
-      // console.log("司机管理",this.permissonList.includes('driverAddBtn'))
-
     },
     async handleStatus(item){
         if(item.states.code === 0){
@@ -143,14 +270,23 @@ export default {
         }else{
           this.states = 0
         }
+      Dialog.confirm({
+        message: '当前状态为启用，是否要改为停用?',
+      }).then(async () => {
         await enableAction({
           driverId:item.driverId,
           states:this.states
         })
         this.pageNum = 1;
         await this.getDriverList();
+      }).catch(() => {
+      });
+
     },
     updateDriver(item){
+      if(!this.permissonList.includes('driverModifyBtn')){//有权限才能修改
+        return
+      }
       // 在当前组件中进行路由跳转并传递参数对象
       this.$router.push({
         name: 'driverAdd',  // 目标路由的名称
@@ -185,7 +321,7 @@ export default {
 
 .wrap {
   background: #F4F5F7;
-  @include sizingPadding(13px,13px);
+  //@include sizingPadding(13px,13px);
   @include wh(100%, 100%);
   overflow-y: auto;
 }
@@ -208,7 +344,7 @@ export default {
 }
 
 .itemWrap {
-  @include wh(100%, 104px);
+  @include wh(100%, 140px);
   @include radiusSizing(6px);
   @include fontWeightSize(400, 12px);
   @include flexBetween;
@@ -216,6 +352,7 @@ export default {
   box-shadow: 0px 2px 10px 0px rgba(216, 216, 216, 0.5);
   margin-bottom: 10px;
   padding: 11px 13px 9px 15px;
+  position: relative;
   .halfOpci {
     opacity: .5;
     margin-right: 5px;
@@ -224,15 +361,15 @@ export default {
     opacity: 1;
   }
   .statusNo {
-    color: #FF0000;
+    color: red;
   }
   .statusYes {
-    color: #09B820
+    color: green
   }
 }
 
 .name-status {
-  @include flexColBet;
+  @include flexBetCen;
   .namephone {
     @include fontWeightSize(bold, 14px)
   }
@@ -256,6 +393,128 @@ export default {
       margin-left: 15px;
     }
   }
-
+}
+.filterWrap {
+  width: 100%;
+  padding-right: 13px;
+  padding-left: 13px;
+  display: flex;
+  overflow-x: auto; /* 允许横向滚动 */
+  white-space: nowrap; /* 防止子元素换行 */
+  padding-bottom: 10px;
+  -webkit-overflow-scrolling: touch; /* 在iOS上平滑滚动 */
+  scrollbar-width: none; /* Firefox */
+  padding-bottom: 10px;
+  /*padding: 10px;*/
+  margin-bottom: 10px;
+  background-color: #fff;
+  box-sizing: border-box;
+  &::-webkit-scrollbar {
+    display: none; /* Chrome/Safari */
+  }
+  .customSel {
+    flex: 0 0 auto; /* 防止子元素被压缩 */
+    width: calc(33% - 5px);
+    /*width: 100%;*/
+    height: 25px;
+    background: #F5F5F5;
+    border-radius: 4px;
+    font-size: 10px;
+    color: #323233;
+    margin-right: 5px;
+    ::v-deep .el-input__inner{
+      padding: 0 2px;
+      height: 25px;
+      font-size: 10px;
+      background: #F5F5F5;
+      border-radius: 4px;
+      border: none;
+    }
+    ::v-deep .el-input__icon{
+      line-height: 25px;
+      font-size: 10px;
+      width: 18px;
+      color: #2A5094;
+    }
+    ::v-deep .el-input__suffix{
+      right: 2px;
+    }
+  }
+  .customInput{
+    /*width: 49%;*/
+    width: 130px;
+  }
+  .has-value  ::v-deep .el-input__inner{
+    background: #F1F6FF ;
+    color: #007BE9;
+    font-weight: bold;
+    padding-left: 8px;
+  }
+  .has-value ::v-deep .el-input__icon{
+    color: #007BE9;
+  }
+  .priceSel{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    color: #C0C4CC;
+    .iconSpan{
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      font-size: 8px;
+    }
+  }
+  .has-price{
+    color: #007BE9 !important;
+  }
+}
+.wrap_cls {
+  width: 100%;
+  padding-left: 13px;
+  padding-right: 13px;
+  box-sizing: border-box;
+}
+.common_cls {
+  color: #fff;
+  padding: 4px 8px;
+  border-radius: 3px;
+  margin-right: 6px;
+}
+.default_cls {
+  background-color: #B0BEC5;
+}
+.danger_cls {
+  background-color: red;
+}
+.success_cls {
+  background-color: #4CAF50;
+}
+.info_cls {
+  background-color: #FF9800;
+}
+.main_cls {
+  background-color: #6C9BFF;
+}
+.arrow_position {
+  position: absolute;
+  right: 5px;
+  top: 50px;
+  font-size: 20px;
+  opacity: 0.6;
+}
+.carType,.zdJuhe{
+  opacity: .7;
+  @include fontWeightSize(400,12px);
+  margin-right: 8px;
+}
+/*.zdJuhe {
+  width: 80px;
+  text-align: right;
+  margin-left: -10px;
+}*/
+.flex-between{
+  line-height: 24px;
 }
 </style>

src/views/index/supplierAdd.vue

@@ -9,7 +9,7 @@
           <img class="title1" src="@/assets/supplier/title1.png" alt="">
           <div class="credentials_wrap">
             <div class="credentials_item">
-              <div class="credentials_title">1. 法人身份证正面</div>
+              <div class="credentials_title">1.法人身份证人像页</div>
               <van-uploader
                 accept="image/*"
                 v-model="idFrontPhotoList"
@@ -22,7 +22,7 @@
               </van-uploader>
             </div>
             <div class="credentials_item ml2">
-              <div class="credentials_title">2. 法人身份证反面</div>
+              <div class="credentials_title">2.法人身份证国徽页</div>
               <van-uploader
                 accept="image/*"
                 v-model="idBackPhotoList"
@@ -47,6 +47,19 @@
                 </div>
               </van-uploader>
             </div>
+            <div class="credentials_item">
+              <div class="credentials_title">4.开户许可证/基本存款账户信息</div>
+              <van-uploader
+                  accept="image/*"
+                  v-model="licensePhotoList"
+                  :after-read="licensePhotoHandler"
+                  :max-size="5 * 1024 * 1024"
+                  max-count="1">
+                <div class="custom-background">
+                  <img src="@/assets/supplier/licensePhoto.png" alt="">
+                </div>
+              </van-uploader>
+            </div>
           </div>
         </div>
         <div class="company_info">
@@ -57,6 +70,7 @@
               <van-field :border="true" readonly v-model="form.legalName" class="required" name="legalName" label="法人姓名" placeholder="请输入"  :rules="[{ required: true, message: '请输入法人姓名' }]" />
               <van-field :border="true" v-model="form.linkName" class="required" name="linkName" label="联系人姓名" placeholder="请输入"  :rules="[{ required: true, message: '请输入联系人姓名' }]" />
               <van-field :border="true" v-model="form.linkPhone" class="required" name="linkPhone" label="联系电话" placeholder="请输入"  :rules="phoneVerify" />
+              <van-field :border="true" v-model="form.linkEmail" class="required" name="linkEmail" label="邮箱" placeholder="请输入"  :rules="emailVerify" />
               <van-field :border="true" class="required" name="serviceType" label="服务能力">
                 <template #input>
                   <el-tree
@@ -121,13 +135,16 @@
       return {
         clickFlag: true,
         phoneVerify: [{ required: true, message: '请输入联系电话' }, { validator: value => { return /^1[3456789]\d{9}$/.test(value) }, message: '联系电话格式不正确' }],
+        emailVerify: [{ required: true, message: '请输入邮箱' }, { validator: value => { return  /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/.test(value) }, message: '邮箱格式不正确' }],
         id:'', //车辆Id
         idBackPhotoList: [],
         idBackPhoto: '',
         idFrontPhotoList: [],
         idFrontPhoto: '',
         companyPhotoList: [],
+        licensePhotoList: [],
         companyPhoto: '',
+        licensePhoto:'',
         form: {
           name: '',
           legalName: '',
@@ -138,6 +155,23 @@
           trailCount: '',
           minorCount: '',
           serviceAreaCode: [],
+          linkEmail:'',
+          accountInfoDTO:{
+            dutyParagraph:'',
+            accountNumber:'',
+            accountName:'',
+            accountType:'',
+            invoiceType:'',
+            settlementType:'',
+            shouldRate:'',
+            realRate:'',
+            unitName:'',
+            bankNo:'',
+            billingPhone:'',
+            billingAddress:'',
+            billHead:'',
+            companyType:'',
+          }
         },
         qrCodeUrl: '',
         qrCode: '',
@@ -195,6 +229,7 @@
         this.idFrontPhoto = _data?.idCardFrontUrl;
         this.idBackPhoto = _data?.idCardBackUrl;
         this.companyPhoto = _data?.businessLicense;
+        this.licensePhoto = _data?.accountUrl;
         this.wechatId = _data?.wechatId
         if(this.idFrontPhoto) {
           this.idFrontPhotoList = [{ url : this.idFrontPhoto }];
@@ -205,6 +240,9 @@
         if(this.companyPhoto) {
           this.companyPhotoList = [{ url : this.companyPhoto }];
         }
+        if(this.licensePhoto){
+          this.licensePhotoList= [{ url : this.licensePhoto }];
+        }
         if( _data.service ) {
           this.$refs.tree.setCheckedKeys(_data.service.split(','))
         }
@@ -215,11 +253,11 @@
       },
       async applyAdd() {
         if( !this.idFrontPhoto ) {
-          this.$toast('法人身份证正面照未上传')
+          this.$toast('法人身份证人像页未上传')
           return
         }
         if( !this.idBackPhoto ) {
-          this.$toast('法人身份证反面照未上传')
+          this.$toast('法人身份证国徽页未上传')
           return
         }
         if( !this.companyPhoto ) {
@@ -230,6 +268,7 @@
           this.$toast('服务区域不能为空')
           return
         }
+        // this.wechatId='wmOTNXBwAABrvKkE_Fh8ZN8Xm2S9v2wQ'
         if(!this.wechatId) {
           await this.QrCodeResult();
           if( !this.wechatId ) {
@@ -237,7 +276,6 @@
             return
           }
         }
-
         if( this.$refs.tree.getCheckedKeys().length > 0 ) {
           await this.saveHandler()
         } else {
@@ -261,22 +299,15 @@
             _node.map(item => {
               checkArr.push(item.data.id)
             })
-
-           /* let treeArr = this.$refs.tree.getCheckedKeys();
-            let childrenTreeArr = [];
-            treeArr.map(item => {
-              let _arr = this.supplierServiceList.filter(_item => _item.id == item) || []   // 获取对应的大类
-              _arr[0]?.children?.map(childItem => {
-                childrenTreeArr?.push(childItem?.id)
-              })
-            })
-            let allArr = [...treeArr, ...childrenTreeArr]*/
             let res = await saveSupplier({
               id: this.id,
               ...this.form,
+              accountInfoJson:JSON.stringify(this.form.accountInfoDTO),
+              accountInfoDTO:{},
               idCardFrontUrl: this.idFrontPhoto,
               idCardBackUrl: this.idBackPhoto,
               businessLicense: this.companyPhoto,
+              accountUrl:this.licensePhoto,
               service: this.$refs.tree.getCheckedKeys().join(',') ,
               serviceAreaCode: checkArr.join(','),
               wechatId: this.wechatId,
@@ -382,8 +413,26 @@
         })
         this.form.name = res?.data?.name;
         this.form.areaName = res?.data?.address
+        this.form.accountInfoDTO.dutyParagraph=res?.data?.regNum
+        this.form.accountInfoDTO.unitName = res?.data?.name
+        this.form.accountInfoDTO.companyType=res?.data?.type
         await this.QrCodeHandler();
       },
+      async licensePhotoHandler(file){// 开户许可证
+        const formData = new FormData();
+        formData.append("file" , file.file);
+        let res = await uploadImage(formData);
+        this.licensePhoto = res.data
+        await this.licenseOcrHandler()
+      },
+      async licenseOcrHandler(){// 开户许可证ocr识别
+        let res = await ocrHandler({
+          ocrType: 15,
+          imageUrl: this.licensePhoto,
+        })
+        this.form.accountInfoDTO.accountNumber=res?.data?.accountNumber
+        this.form.accountInfoDTO.accountName = res?.data?.accountBank
+      },
     },
     computed: {
       regionText() {
@@ -413,12 +462,13 @@
   padding: 0 20px;
 }
 .credentials_info {
-  height: 170px;
+  //height: 170px;
 }
 .credentials_wrap {
   display: flex;
   width: 100%;
   margin-top: 10px;
+  flex-wrap: wrap;
   .credentials_item {
     width: 32%;
     text-align: center;

src/views/index/supplierInfo.vue

@@ -28,17 +28,21 @@
         <div class="common_title">证件照信息</div>
         <div class="credentials_wrap">
           <div class="credentials_item">
-            <div class="credentials_title">1. 法人身份证正面</div>
+            <div class="credentials_title">1.法人身份证人像页</div>
             <img :src="supplierInfo?.idCardFrontUrl" alt="">
           </div>
           <div class="credentials_item ml2">
-            <div class="credentials_title">2. 法人身份证反面</div>
+            <div class="credentials_title">2.法人身份证国徽页</div>
             <img :src="supplierInfo?.idCardBackUrl" alt="">
           </div>
           <div class="credentials_item ml2">
             <div class="credentials_title">3.营业执照</div>
             <img :src="supplierInfo?.businessLicense" alt="">
           </div>
+          <div class="credentials_item">
+            <div class="credentials_title">4.开户许可证/基本存款账户信息</div>
+            <img :src="supplierInfo?.accountUrl" alt="">
+          </div>
         </div>
       </div>
       <div class="company_info">
@@ -72,6 +76,10 @@
             <div class="label">联系电话：</div>
             <div class="content">{{supplierInfo?.linkPhone}}</div>
           </div>
+          <div class="info_item">
+            <div class="label">邮箱：</div>
+            <div class="content">{{supplierInfo?.linkEmail}}</div>
+          </div>
           <div class="info_item">
             <div class="label">服务能力：</div>
             <div class="content service_color">{{supplierInfo?.serviceCategoryName}}</div>
@@ -191,7 +199,6 @@
           id: this.id,
         });
         this.supplierInfo = res?.data;
-        console.log('res', res)
       },
     }
   }
@@ -259,7 +266,7 @@
     margin-top: 5px;
   }
   .supplier_content {
-    padding: 0 24px;
+    padding: 0 20px;
     width: 100%;
     box-sizing: border-box;
   }
@@ -282,6 +289,7 @@
     display: flex;
     width: 100%;
     margin-top: 10px;
+    flex-wrap: wrap;
     .credentials_item {
       width: 32%;
       text-align: center;

src/views/index/vehicleManage.vue

@@ -21,7 +21,7 @@
   <van-search
     v-model="searchVal"
     show-action
-    placeholder="车辆名称/车牌号/车架号"
+    placeholder="请输入车辆名称、车牌号、车架号"
     @search="resetHandler"
   >
     <template #action>
@@ -39,6 +39,14 @@
           ></i>
         </template>
       </el-input>-->
+    <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="authStates" placeholder="认证状态" :class="{'customSel':true , 'has-value': authStates }" clearable>
+      <el-option
+          v-for="item in authStatesOptions"
+          :key="item.value"
+          :label="item.name"
+          :value="item.value">
+      </el-option>
+    </el-select>
       <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="inputStatusList" placeholder="录入状态" :class="{'customSel':true , 'has-value': inputStatusList }" clearable>
         <el-option
           v-for="item in inputStatusListOptions"
@@ -49,14 +57,6 @@
       </el-select>
 <!--    </div>-->
 <!--    <div>-->
-      <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="authStates" placeholder="认证状态" :class="{'customSel':true , 'has-value': authStates }" clearable>
-        <el-option
-          v-for="item in authStatesOptions"
-          :key="item.value"
-          :label="item.name"
-          :value="item.value">
-        </el-option>
-      </el-select>
       <el-select @change="resetHandler" multiple :collapse-tags="true" v-model="liabilityInsuranceAuditList" placeholder="职业责任险" :class="{'customSel':true , 'has-value': liabilityInsuranceAuditList }" clearable>
         <el-option
           v-for="item in insuresOptions"
@@ -79,11 +79,12 @@
         <div class="carItem" v-for="(item,index) in vehicleList" :key="index" @click.stop="updateVehicle(item)">
           <div class="carCode">
             <div class="codeLeft">{{item.plateNumber}} / {{item.vehicleTypeString}}
-              <span class="ml10" @click.stop="updateStatus(item)"  :class="{'insuranceSuccess': item.vehicleStatus == 1, 'insuranceDanger': item.vehicleStatus == 2 ,'insuranceGray': !item.vehicleStatus }">{{ item.vehicleStatus == 1 ? '启用' :( item.vehicleStatus == 2 ? '停用' : ( item.vehicleStatus == 12 ? '否-服务商停用' : '无状态')) }} </span>
+              <span class="ml10"  :class="{'insuranceSuccess': item.vehicleStatus == 1, 'insuranceDanger': item.vehicleStatus == 2 ,'insuranceGray': !item.vehicleStatus }">{{ item.vehicleStatus == 1 ? '启用' :( item.vehicleStatus == 2 ? '停用' : ( item.vehicleStatus == 12 ? '否-服务商停用' : '无状态')) }} </span>
             </div>
-
+            <div class="codeRight" v-if="item.vehicleStatus == 1" @click.stop="updateStatus(item)">停用</div>
           </div>
           <div class="juhe flex-between">
+            <span class="zdJuhe">核验认证</span>
             <span class="flex-right">
             <span class="common_cls" v-if="item.inputStatusString" :class="getClass(item.inputStatusString)?.className">{{item.inputStatusString}}</span>
             <span class="common_cls" v-if="item.authStateString" :class="getClass(item.authStateString)?.className">{{item.authStateString}}</span>
@@ -95,12 +96,12 @@
             <span class="common_cls" @click.stop="showTip(item.liabilityInsuranceAuditMsg)" :class="getClass(item.rescueInsurance)?.className">{{item.rescueInsurance}}</span>
           </span>
           </div>
-          <div class="juhe flex-between">
+<!--          <div class="juhe flex-between">
             <span class="zdJuhe">车辆信息</span>
             <span class="flex-right" v-if="item.auditStatusStr">
             <span class="common_cls" @click.stop="showTip(item.auditMsg)" :class="getClass(item.auditStatusStr)?.className">{{item.auditStatusStr}}</span>
           </span>
-          </div>
+          </div>-->
           <div class="juhe flex-between">
             <span class="zdJuhe">最近登录时间</span>
             <span class="flex-right">{{item.lastLoginTime}}</span>
@@ -249,7 +250,9 @@ export default {
     },
     async onLoad(){
       await this.getVehicleList()
+      if(this.total>10){
         this.pageNum++;
+      }
       // 加载状态结束
       this.loading = false;
       // 数据全部加载完成
@@ -412,6 +415,12 @@ export default {
     .codeLeft{
       @include fontWeightSize(bold,14px)
     }
+    .codeRight{
+      padding: 2px 8px;
+      border: 1px solid #DDDDDD;
+      border-radius: 3px;
+      font-weight: bold;
+    }
     .twoBtn{
       display: flex;
       align-items: center;