| <template> | 
|     <GlobalWindow | 
|         :title="title" | 
|         width="100%" | 
|         :visible.sync="visible" | 
|         :confirm-working="isWorking" | 
|         @confirm="confirm" | 
|     > | 
|         <el-form :model="form" ref="form" :rules="rules"> | 
|             <el-form-item label="派遣单位名称" prop="name"> | 
|                 <el-input v-model="form.name" placeholder="请输入" v-trim/> | 
|             </el-form-item> | 
|             <el-form-item label="派遣单位信用代码" prop="code"> | 
|                 <el-input v-model="form.code" placeholder="请输入" v-trim/> | 
|             </el-form-item> | 
|             <el-form-item label="派遣单位描述" prop="content"> | 
|                 <el-input v-model="form.content" placeholder="请输入" v-trim/> | 
|             </el-form-item> | 
|         </el-form> | 
|         <div class="list" v-if="form.type !== 1"> | 
|             <el-button type="primary" style="margin-bottom: 15px;" @click="add">添加方案</el-button> | 
|             <div class="list_item" v-for="(item, index) in form.saveDuSolutionDTOList" :key="index"> | 
|                 <div class="list_item_input"> | 
|                     <div class="list_item_input_label"><span>*</span>保险方案</div> | 
|                     <div class="list_item_input_val"> | 
|                         <el-select v-model="item.solutionId" @change="changeTypeWork($event, index)" placeholder="请选择"> | 
|                             <el-option | 
|                                 v-for="item in insuranceScheme" | 
|                                 :key="item.id" | 
|                                 :label="item.name" | 
|                                 :value="item.id"> | 
|                             </el-option> | 
|                         </el-select> | 
|                         <div style="display: flex; align-items: center;"> | 
|                             <el-button type="primary" @click="addItem(index)">添加</el-button> | 
|                             <el-button type="danger" @click="deleItem(index)">删除</el-button> | 
|                         </div> | 
|                     </div> | 
|                 </div> | 
|                 <div class="list_item_table"> | 
|                     <el-table | 
|                         :data="item.saveDuWorkTypeDTOList" | 
|                         border | 
|                         style="width: 100%"> | 
|                         <el-table-column label="序号" width="80px"> | 
|                             <template slot-scope="scope"> | 
|                                 <span>{{scope.$index + 1}}</span> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                             prop="name" | 
|                             label="所属工种"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-select v-model="scope.row.workTypeId" @change="changeGZ($event, index, scope.$index)" placeholder="请选择"> | 
|                                     <el-option | 
|                                         v-for="item in item.typeWork" | 
|                                         :key="item.id" | 
|                                         :label="item.name" | 
|                                         :value="item.id"> | 
|                                     </el-option> | 
|                                 </el-select> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                             prop="address" | 
|                             label="操作视频(非必填)"> | 
|                             <template slot-scope="scope"> | 
|                                 <div style="width: 100px; height: 100px;"> | 
|                                     <UploadAvatarVideo :uploadData="{ folder: 'unit' }" :file="scope.row.file" @uploadSuccess="result($event, index, scope.$index)" /> | 
|                                 </div> | 
|                             </template> | 
|                         </el-table-column> | 
|                         <el-table-column | 
|                             label="操作" | 
|                             width="90" | 
|                             fixed="right"> | 
|                             <template slot-scope="scope"> | 
|                                 <el-button type="text" @click="dele(index, scope.$index)">删除</el-button> | 
|                             </template> | 
|                         </el-table-column> | 
|                     </el-table> | 
|                 </div> | 
|             </div> | 
|         </div> | 
|     </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import UploadAvatarVideo from '@/components/common/UploadAvatarVideo' | 
| import { all } from '@/api/business/solutions' | 
| import { findListByDTO } from '@/api/business/worktype' | 
| import { editDispatchUnit } from '@/api/business/dispatchUnit' | 
| export default { | 
|   name: 'OperaDispatchUnitWindow', | 
|   extends: BaseOpera, | 
|   components: { GlobalWindow, UploadAvatarVideo }, | 
|   data () { | 
|     return { | 
|       // 表单数据 | 
|       form: { | 
|         id: null, | 
|         name: '', | 
|         code: '', | 
|         content: '', | 
|         type: '', | 
|         saveDuSolutionDTOList: [ | 
|           { | 
|             id: '', | 
|             saveDuWorkTypeDTOList: [ | 
|               { | 
|                 videoUrl: '', | 
|                 workTypeId: '', | 
|                 workTypeName: '', | 
|                 file: { | 
|                   videourl: '', | 
|                   videourlfull: '' | 
|                 } | 
|               } | 
|             ], | 
|             typeWork: [], | 
|             solutionId: '', | 
|             solutionName: '' | 
|           } | 
|         ] | 
|       }, | 
|       // 验证规则 | 
|       rules: { | 
|         name: [ | 
|           { required: true, message: '请输入派遣单位名称' } | 
|         ], | 
|         code: [ | 
|           { required: true, message: '请输入派遣单位信用代码' } | 
|         ], | 
|         content: [ | 
|           { required: true, message: '请输入派遣单位描述' } | 
|         ] | 
|       }, | 
|       insuranceScheme: [] | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       api: '/business/dispatchUnit', | 
|       'field.id': 'id' | 
|     }) | 
|     all({}) | 
|       .then(res => { | 
|         this.insuranceScheme = res | 
|       }) | 
|   }, | 
|   methods: { | 
|     open (title, target) { | 
|       this.title = title | 
|       this.visible = true | 
|       this.form.saveDuSolutionDTOList = [ | 
|         { | 
|           id: '', | 
|           saveDuWorkTypeDTOList: [ | 
|             { | 
|               videoUrl: '', | 
|               workTypeId: '', | 
|               workTypeName: '', | 
|               file: { | 
|                 videourl: '', | 
|                 videourlfull: '' | 
|               } | 
|             } | 
|           ], | 
|           typeWork: [], | 
|           solutionId: '', | 
|           solutionName: '' | 
|         } | 
|       ] | 
|       // 新建 | 
|       if (target == null) { | 
|         this.$nextTick(() => { | 
|           this.$refs.form.resetFields() | 
|           this.form[this.configData['field.id']] = null | 
|         }) | 
|         return | 
|       } | 
|       // 编辑 | 
|       this.$nextTick(() => { | 
|         for (const key in this.form) { | 
|           this.form[key] = target[key] | 
|         } | 
|       }) | 
|     }, | 
|       // 确认修改 | 
|       __confirmEdit () { | 
|           this.$refs.form.validate((valid) => { | 
|               if (!valid) { | 
|                   return | 
|               } | 
|               // 调用新建接口 | 
|               this.isWorking = true | 
|               editDispatchUnit(this.form) | 
|                   .then(() => { | 
|                       this.visible = false | 
|                       this.$tip.apiSuccess('修改成功') | 
|                       this.$emit('success') | 
|                   }) | 
|                   .catch(e => { | 
|                       this.$tip.apiFailed(e) | 
|                   }) | 
|                   .finally(() => { | 
|                       this.isWorking = false | 
|                   }) | 
|           }) | 
|       }, | 
|     // 切换工种 | 
|     changeGZ(a, b, c) { | 
|       let text = '' | 
|       this.form.saveDuSolutionDTOList[b].typeWork.forEach(item => { | 
|         if (item.id === a) { | 
|           text = item.name | 
|         } | 
|       }) | 
|       this.form.saveDuSolutionDTOList[b].saveDuWorkTypeDTOList[c].workTypeName = text | 
|     }, | 
|     // 切换方案 | 
|     changeTypeWork(id, index) { | 
|       findListByDTO({ queryType: 0, id }) | 
|         .then(res => { | 
|           this.form.saveDuSolutionDTOList[index].typeWork = res | 
|         }) | 
|       let text = '' | 
|       this.insuranceScheme.forEach(item => { | 
|         if (item.id === id) { | 
|           text = item.name | 
|         } | 
|       }) | 
|       this.form.saveDuSolutionDTOList[index].solutionName = text | 
|     }, | 
|     add() { | 
|       this.form.saveDuSolutionDTOList.unshift({ | 
|           id: '', | 
|           saveDuWorkTypeDTOList: [ | 
|               { | 
|                   videoUrl: '', | 
|                   workTypeId: '', | 
|                   workTypeName: '', | 
|                   file: { | 
|                       videourl: '', | 
|                       videourlfull: '' | 
|                   } | 
|               } | 
|           ], | 
|           typeWork: [], | 
|           solutionId: '', | 
|           solutionName: '' | 
|       }) | 
|     }, | 
|     addItem(index) { | 
|       this.form.saveDuSolutionDTOList[index].saveDuWorkTypeDTOList.push({ | 
|         videoUrl: '', | 
|         workTypeId: '', | 
|         file: { | 
|           videourl: '', | 
|           videourlfull: '' | 
|         } | 
|       }) | 
|     }, | 
|     deleItem(index) { | 
|       if (this.form.saveDuSolutionDTOList.length === 1) { | 
|         this.$message.warning('至少保留一项内容') | 
|         return | 
|       } | 
|       this.form.saveDuSolutionDTOList.splice(index, 1) | 
|     }, | 
|     result(e, a, b) { | 
|       this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList[b].videoUrl = e.imgurl | 
|     }, | 
|     dele(a, b) { | 
|       if (this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList.length === 1) { | 
|         this.$message.warning('至少保留一项内容') | 
|         return | 
|       } | 
|       this.form.saveDuSolutionDTOList[a].saveDuWorkTypeDTOList.splice(b, 1) | 
|     } | 
|   } | 
| } | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
|     .list { | 
|         width: 100%; | 
|         margin-bottom: 20px; | 
|         .list_item { | 
|             width: 100%; | 
|             margin-bottom: 20px; | 
|             &:last-child { | 
|                 margin: 0 !important; | 
|             } | 
|             .list_item_input { | 
|                 width: 100%; | 
|                 margin-bottom: 15px; | 
|                 .list_item_input_label { | 
|                     margin-bottom: 10px; | 
|                     font-size: 14px; | 
|                     color: #606266; | 
|                     span { | 
|                         color: red; | 
|                         margin-right: 4px; | 
|                     } | 
|                 } | 
|                 .list_item_input_val { | 
|                     width: 100%; | 
|                     display: flex; | 
|                     align-items: center; | 
|                     justify-content: space-between; | 
|                 } | 
|             } | 
|             .list_item_table { | 
|   | 
|             } | 
|         } | 
|     } | 
| </style> |