车辆修改

src/components/busManagement/BusInfo.vue

@@ -67,7 +67,7 @@
   }
 
   .busInfo .carPlanOne span {
-    display:inline-block;
+    display: inline-block;
     margin-right: 3px;
   }
 
@@ -105,21 +105,24 @@
   .BusTyleFirst .w150 {
     margin-right: 22px;
   }
-  .busAddbtn{
-    display:inline-block;
-    width:30px;
-    height:30px;
-    border:1px solid #d1d1d1;
+
+  .busAddbtn {
+    display: inline-block;
+    width: 30px;
+    height: 30px;
+    border: 1px solid #d1d1d1;
     text-align: center;
     line-height: 30px;
-    border-radius:50%;
+    border-radius: 50%;
     cursor: pointer;
     position: relative;
-    top:2px;
+    top: 2px;
   }
-  .busAddbtn:hover i{
-    color:#e95252;
+
+  .busAddbtn:hover i {
+    color: #e95252;
   }
+
 </style>
 <template>
   <div class="flexOne busInfo">
@@ -186,25 +189,27 @@
               </div>
             </td>
             <td class="carPlanOne" :class="{'otherSpan':index!=0&&index!=PlanTableData.length-1}">
-              <div class="w320">
-                <!--接机送机-->
+              <div class="w320" v-for="(subItem,subIndex) in item.DetailList">
                 <em>
-                  <el-select class="w150" placeholder="请选择" v-model="item.AirportPickUp" :disabled="forbidInput">
+                  <!--接机送机-->
+                  <el-select class="w150" placeholder="请选择" v-model="subItem.AirportPickUp" :disabled="forbidInput">
                     <el-option :key="0" :value="0" label="请选择"></el-option>
-                    <el-option v-for="item in BusAirportPickUpList" :key="item.Id" :label="item.Name" :value="item.Id">
+                    <el-option v-for="childitem in BusAirportPickUpList" :key="childitem.Id" :label="childitem.Name"
+                      :value="childitem.Id">
                     </el-option>
                   </el-select>
                 </em>
                 <!--用车类型-->
-                <span v-for="subItem in UseTypeArray">
-                  <span v-if="subItem.Id==1" class="subName"
-                    :class="{'spanCked':item.UseType==subItem.Id,'disSpan':forbidInput==true}"
-                    @click="UseTypeClick(subItem.Id,index);getBusPrice(item)">{{subItem.Name}}</span>
+                <span v-for="childItem in UseTypeArray">
+                  <span v-if="childItem.Id==1" class="subName"
+                    :class="{'spanCked':subItem.UseType==childItem.Id,'disSpan':forbidInput==true}"
+                    @click="UseTypeClick(childItem.Id,index,subIndex);getBusPrice(subItem)">{{childItem.Name}}</span>
                 </span>
-                <span class="busAddbtn" @click="">
+                <a v-if="subIndex>0" @click="DeleteSubItem(item,subIndex)" style="color:blue;cursor:pointer">删除</a>
+              </div>
+                <span class="busAddbtn" @click="AddSubItem(item)">
                   <i class="iconfont icon-img_haha"></i>
                 </span>
-              </div>
             </td>
             <td>
               <el-input class='w170' type="text" v-model="item.BookGroup"></el-input>
@@ -501,6 +506,18 @@
           obj.CostPrice = money
         }
       },
+      AddSubItem(item) {
+        item.DetailList.push({
+          DetailId: 0,
+          UseType: 0,
+          BusPlanId: 0,
+          AirportPickUp: 0
+        });
+      },
+      DeleteSubItem(item,index)
+      {
+         item.DetailList.splice(index,1);
+      },
       /*获取车辆类型列表*/
       getBusTypeList() {
         this.apipost(
@@ -545,7 +562,6 @@
                   x.BookGroup = this.$route.query.NewCombinationNum;
                 }
               })
-              console.log(this.PlanTableData,'datalist');
             }
           },
           null
@@ -602,17 +618,17 @@
         }, err => {})
       },
       //用车类型点击事件
-      UseTypeClick(value, index) {
+      UseTypeClick(value, index,subIndex) {
         if (this.forbidInput == true) {
           return;
         }
         if (
-          this.PlanTableData[index].UseType == "0" ||
-          this.PlanTableData[index].UseType != value
+          this.PlanTableData[index].DetailList[subIndex].UseType == "0" ||
+         this.PlanTableData[index].DetailList[subIndex].UseType != value
         ) {
-          this.PlanTableData[index].UseType = value;
-        } else if (this.PlanTableData[index].UseType == value) {
-          this.PlanTableData[index].UseType = "0";
+          this.PlanTableData[index].DetailList[subIndex].UseType = value;
+        } else if (this.PlanTableData[index].DetailList[subIndex].UseType == value) {
+          this.PlanTableData[index].DetailList[subIndex].UseType = "0";
         }
       },
       //司机住宿点击事件
@@ -773,4 +789,5 @@
       this.getSupplierList();
     }
   };
+
 </script>