车辆管理服务类型优化

src/views/index/vehicleAdd.vue

@@ -59,9 +59,9 @@
   <div class="serviceType">
 
     <div class="trailerService" v-for="(item,index) in supplierServiceList" :key="index">
-      <div class="serviceline" :ref="'serviceline' + index" @click="loadAll(index)">
-        <img :src="show  ? require('@/assets/arr_bot.png') : require('@/assets/arr_right.png')" style="width: 20px;height: 15px" >
-        <span  class="service">{{ item.name }}:</span>
+      <div class="serviceline"  @click="loadAll(index)">
+        <img  :ref="'serviceline' + index" :src="imageUrl" style="width: 20px;height: 15px" >
+        <span  class="service" style="width: 88px;">{{ item.name }}:</span>
         <span class="line"></span>
       </div>
       <div :ref="'checkboxGroup' + index"  class="checkbox-group">
@@ -101,6 +101,7 @@ export default {
       serviceIds:[],//车辆服务种类,
       supplierServiceList:[],
       show:false,
+      imageUrl: require('@/assets/arr_right.png')
     }
   },
   async mounted() {
@@ -121,13 +122,15 @@ export default {
       this.show = !this.show
       const refName='checkboxGroup' + i;
       const element1 = this.$refs[refName]; // 通过动态属性名访问引用this.$refs.checkboxGroup.style.display = 'block';
-      // console.log("element1",refName,element1)
+      const refName1='serviceline' + i;
+      const element = this.$refs[refName1];
       if(this.show){
         element1[0].style.display = 'block'
+        element[0].src= require('@/assets/arr_bot.png')
       }else {
         element1[0].style.display = 'none'
+        element[0].src= require('@/assets/arr_right.png')
       }
-
     },
     async getTypeList() {
         let result=await vehicleTypeList();