1

src/views/drivingSchool/schoolCourse/form/DlDriveSchoolCourseForm.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body>
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="50%" v-dialogDrag append-to-body>
       <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
         <el-row>
           <el-col :span="12">
@@ -32,7 +32,19 @@
               <el-input-number v-model="formData.price" placeholder="请输入价格" :precision="2" :step="0.1" ></el-input-number>
             </el-form-item>
           </el-col>
+        </el-row>
 
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="订金" prop="reserveMoney">
+              <el-input-number v-model="formData.reserveMoney" placeholder="请输入订金" :precision="2" :step="0.1" ></el-input-number>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="优惠" prop="favour">
+              <el-input-number v-model="formData.favour" placeholder="请输入订金" :precision="2" :step="0.1" :max="1"></el-input-number>
+            </el-form-item>
+          </el-col>
         </el-row>
 
         <el-row>
@@ -59,15 +71,12 @@
         </el-row>
 
         <el-row>
-          <el-col :span="12">
-            <el-form-item label="订金" prop="reserveMoney">
-              <el-input-number v-model="formData.reserveMoney" placeholder="请输入订金" :precision="2" :step="0.1" ></el-input-number>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="优惠" prop="favour">
-              <el-input-number v-model="formData.favour" placeholder="请输入订金" :precision="2" :step="0.1" :max="1"></el-input-number>
+          <el-col>
+            <el-form-item label="教练">
+              <el-button size="small" type="primary" @click="openCoachDraw">选择</el-button>
+              <span v-if="formData.coachListText !== ''">{{formData.coachListText}}</span>
             </el-form-item>
+
           </el-col>
         </el-row>
 
@@ -92,12 +101,32 @@
         <el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
         <el-button @click="dialogVisible = false">取 消</el-button>
       </div>
+
     </el-dialog>
+    <el-drawer
+      title="选择教练"
+      :visible.sync="drawerOpen"
+      :before-close="handleClose">
+      <el-row>
+        <el-col v-for="(item,index) in initCoachList" :span="8">
+          <el-card >
+            <div slot="header" class="clearfix">
+              <span>{{item.name}}</span>
+            </div>
+            <el-checkbox-group v-model="item.checkedSubject"  @change="handleCheckedChange($event,index)">
+              <el-checkbox v-for="subject in subjectList" :label="subject" :key="subject">科目{{subject}}</el-checkbox>
+            </el-checkbox-group>
+          </el-card>
+        </el-col>
+      </el-row>
+
+    </el-drawer>
   </div>
 </template>
 
 <script>
 import * as DlDriveSchoolCourseApi from '@/views/drivingSchool/schoolCourse/courseApi';
+import {listCoach} from "../../drivingSchoolCar/api/car";
 export default {
   name: "DlDriveSchoolCourseForm",
   components: {},
@@ -105,10 +134,12 @@ export default {
     return {
       // 弹出层标题
       dialogTitle: "",
+      drawerOpen: false,
       // 是否显示弹出层
       dialogVisible: false,
       // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
       formLoading: false,
+      chooed:[],
       // 表单参数
       formData: {
         tittle: undefined,
@@ -121,7 +152,12 @@ export default {
         remark: undefined,
         reserveMoney: undefined,
         favour: undefined,
+        coachList:[],
+        coachListText:'',
       },
+      //教练集合
+      initCoachList:[],
+      subjectList:['1','2','3','4'],
       // 表单校验
       formRules: {
         type: [{ required: true, message: '驾证类型不能为空', trigger: 'blur' }],
@@ -138,6 +174,7 @@ export default {
     async open(id) {
       this.dialogVisible = true;
       this.reset();
+      this.getCoachList()
       // 修改时，设置数据
       if (id) {
         this.formLoading = true;
@@ -151,6 +188,54 @@ export default {
       }
       this.title = "新增驾校课程分类";
     },
+
+    openCoachDraw(){
+      this.drawerOpen = true
+    },
+
+    handleClose(){
+      this.drawerOpen = false
+      this.formData.coachList = []
+      this.formData.coachListText = ''
+      const saveCoachList = []
+      let coachText = ''
+      this.initCoachList.map(item => {
+        if (item.checkedSubject.length > 0) {
+          coachText = coachText+item.name+'['
+          item.checkedSubject.forEach(subject => {
+            const coachInfo = {
+              coachId: item.id,
+              coachName: item.name,
+              coachPhone: item.phone,
+              subject: subject
+            };
+            coachText = coachText + '科目'+subject + ' '
+            saveCoachList.push(coachInfo);
+          });
+          coachText = coachText + ']'
+        }
+      });
+      this.formData.coachListText = coachText
+      console.log(coachText)
+      this.formData.coachList = saveCoachList
+    },
+
+    handleCheckedChange(e,index){
+      this.$forceUpdate()
+    },
+
+    /** 查询教练信息（不分页）*/
+    getCoachList(){
+      listCoach({}).then(res => {
+        this.initCoachList = res.data;
+        this.initCoachList.map((item,index) =>{
+          item.checkedSubject=[]
+          this.$set(this.initCoachList,index,item)
+        })
+      })
+    },
+
+
     /** 提交按钮 */
     async submitForm() {
       // 校验主表