| <template> | 
|     <GlobalWindow | 
|         :title="title" | 
|         width="60%" | 
|         :visible.sync="visible" | 
|         :confirm-working="isWorking" | 
|         @confirm="confirm" | 
|     > | 
|               <el-form v-if="visible1==true" :model="form" ref="form1" :rules="rules1" style="width: 100%;"> | 
|                 <el-form-item label="报案号:" prop="reportNum"> | 
|                   <el-input v-model="form.reportNum" placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|               </el-form> | 
|               <el-form v-if="visible2==true" :model="form" ref="form2" :rules="rules2" style="width: 100%;"> | 
|                 <el-form-item label="处理进展:" prop="bizInfo"> | 
|                   <el-input type="textarea" v-model="form.bizInfo" placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|               </el-form> | 
|               <el-form v-if="visible3==true" :model="form" ref="form3" :rules="rules3" style="width: 100%;"> | 
|                 <el-form-item label="撤销说明:" prop="backInfo"> | 
|                   <el-input type="textarea" v-model="form.backInfo" placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|               </el-form> | 
|               <el-form v-if="visible4==true" :model="form" ref="form4" :rules="rules4" style="width: 100%;"> | 
|                 <el-form-item label="结案内容:" prop="doneInfo"> | 
|                   <el-input type="textarea" v-model="form.doneInfo" @change="changeAccount" placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|                 <el-form-item label="医疗理赔(元):" prop="ylClaimAccount"> | 
|                   <el-input type="number" v-model="form.ylClaimAccount"  @change="changeAccount" placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|                 <el-form-item label="误工理赔(元):" prop="wgClaimAccount"> | 
|                   <el-input type="number" v-model="form.wgClaimAccount" @change="changeAccount"  placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|                 <el-form-item label="伤残理赔(元):" prop="scClaimAccount"> | 
|                   <el-input type="number" v-model="form.scClaimAccount" @change="changeAccount"  placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|                 <el-form-item label="死亡理赔(元):" prop="swClaimAccount"> | 
|                   <el-input type="number" v-model="form.swClaimAccount"  @change="changeAccount"  placeholder="请输入" v-trim/> | 
|                 </el-form-item> | 
|                 <el-form-item label="总金额:"  > | 
|                   <el-input type="number" disabled v-model="form.totalAccount" placeholder="" v-trim/> | 
|                 </el-form-item> | 
|               </el-form> | 
|             <div v-if="visible5 ==true"  class="form"> | 
|                 <div class="form_span" v-for="(item,index) in remarkLogList" :key="index"> | 
|                     <span>理赔员-{{ item.creatorName }} {{item.createDate }}</span> | 
|                     <span>{{item.content }}</span> | 
|                 </div> | 
|                 <el-form :model="form" ref="form5" :rules="rules5" style="width: 100%;"> | 
|                   <el-form-item label="填写备注标签:" prop="remarkInfo"> | 
|                     <el-input type="textarea" v-model="form.remarkInfo" placeholder="请输入" v-trim/> | 
|                   </el-form-item> | 
|                 </el-form> | 
|             </div> | 
|       <template v-slot:footer> | 
|         <el-button type="primary" @click="doSubmit">确定</el-button> | 
|         <el-button @click="visible=false">返回</el-button> | 
|       </template> | 
|     </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import BaseOpera from '@/components/base/BaseOpera' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import { addCode, back, dealBiz, doneCommit, remark } from '@/api/business/settleClaims' | 
| export default { | 
|   name: 'OperaSettleClaimsCheckWindow', | 
|   extends: BaseOpera, | 
|   components: { GlobalWindow }, | 
|   data () { | 
|     return { | 
|       remarkLogList: [], | 
|       type: 0, | 
|       // 表单数据 | 
|       form: { | 
|         id: null, | 
|         checkInfo: null, | 
|         bizInfo: null, | 
|         doneInfo: null, | 
|         backInfo: null, | 
|         remarkInfo: null, | 
|         ylClaimAccount: 0, | 
|         wgClaimAccount: 0, | 
|         swClaimAccount: 0, | 
|         scClaimAccount: 0, | 
|         reportNum: null, | 
|         totalAccount:0 | 
|       }, | 
|       model: {}, | 
|       activeName: 'first', | 
|       reverse: false, | 
|       tableData: [], | 
|       visible1: false, | 
|       visible2: false, | 
|       visible3: false, | 
|       visible4: false, | 
|       visible5: false, | 
|       rules1: { | 
|         reportNum: [ | 
|           { required: true, message: '请输入' } | 
|         ] | 
|       }, | 
|       rules2: { | 
|         bizInfo: [ | 
|           { required: true, message: '请输入' } | 
|         ] | 
|       }, | 
|       rules3: { | 
|         backInfo: [ | 
|           { required: true, message: '请输入' } | 
|         ] | 
|       }, | 
|       rules5: { | 
|         remarkInfo: [ | 
|           { required: true, message: '请输入' } | 
|         ] | 
|       }, | 
|       rules4: { | 
|         doneInfo: [ | 
|           { required: true, message: '请输入', trigger: 'blur' } | 
|         ], | 
|         ylClaimAccount: [ | 
|             { required: true, message: '请输入', trigger: 'blur' } | 
|         ], | 
|         wgClaimAccount: [ | 
|             { required: true, message: '请输入', trigger: 'blur' } | 
|         ], | 
|         scClaimAccount: [ | 
|             { required: true, message: '请输入', trigger: 'blur' } | 
|         ], | 
|         swClaimAccount: [ | 
|             { required: true, message: '请输入', trigger: 'blur' } | 
|         ] | 
|       } | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       api: '/business/settleClaims', | 
|       'field.id': 'id' | 
|     }) | 
|   }, | 
|   methods: { | 
|     open (title, target, target1, type) { | 
|       this.model = {} | 
|       this.model = target | 
|       this.title = title | 
|       this.visible = true | 
|       this.type = type | 
|       this.remarkLogList = target1 | 
|       this.visible1 = false, | 
|       this.visible2 = false, | 
|       this.visible3 = false, | 
|       this.visible4 = false, | 
|       this.visible5 = false | 
|       this.form = target | 
|       this.form = { | 
|         id: null, | 
|         checkInfo: null, | 
|         doneInfo: null, | 
|         remarkInfo: null, | 
|         bizInfo: null, | 
|         backInfo: null, | 
|         ylClaimAccount: 0, | 
|         wgClaimAccount: 0, | 
|         swClaimAccount: 0, | 
|         scClaimAccount: 0, | 
|         reportNum: null, | 
|         totalAccount:0 | 
|       } | 
|       if (type == 1) { | 
|         this.visible1 = true | 
|       } | 
|       if (type == 2) { | 
|         this.visible2 = true | 
|       } | 
|       if (type == 3) { | 
|         this.visible3 = true | 
|       } | 
|       if (type == 4) { | 
|         this.visible4 = true | 
|       } | 
|       if (type == 5) { | 
|         this.visible5 = true | 
|       } | 
|     }, | 
|      changeAccount(){ | 
|         if (this.form.swClaimAccount) { | 
|             this.form.swClaimAccount = parseFloat(this.form.swClaimAccount).toFixed(2) | 
|         } | 
|          if (this.form.scClaimAccount) { | 
|              this.form.scClaimAccount = parseFloat(this.form.scClaimAccount).toFixed(2) | 
|          } | 
|          if (this.form.wgClaimAccount) { | 
|              this.form.wgClaimAccount = parseFloat(this.form.wgClaimAccount).toFixed(2) | 
|          } | 
|          if (this.form.ylClaimAccount) { | 
|              this.form.ylClaimAccount = parseFloat(this.form.ylClaimAccount).toFixed(2) | 
|          } | 
|       this.form.totalAccount = parseFloat( this.form.scClaimAccount || 0) + parseFloat( this.form.swClaimAccount || 0) | 
|          + parseFloat( this.form.wgClaimAccount|| 0) | 
|          + parseFloat( this.form.ylClaimAccount|| 0) | 
|      }, | 
|     doSubmit (type) { | 
|       var that = this | 
|       if (this.type === 5) { | 
|         this.$refs.form5.validate((valid) => { | 
|           // debugger | 
|           if (!valid) { | 
|             return | 
|           } | 
|           remark({ id: that.model.id, checkInfo: that.form.remarkInfo }) | 
|             .then(response => { | 
|               this.visible = false | 
|               this.$emit('success') | 
|             }).catch(err => { | 
|               this.$tip.apiFailed(err) | 
|             }) | 
|         }) | 
|       } else if (this.type === 4) { | 
|         this.$refs.form4.validate((valid) => { | 
|           if (!valid) { | 
|             return | 
|           } | 
|           doneCommit({ | 
|             id: that.model.id, | 
|             checkInfo: that.form.doneInfo, | 
|             ylClaimAccount: that.form.ylClaimAccount, | 
|             wgClaimAccount: that.form.wgClaimAccount, | 
|             swClaimAccount: that.form.swClaimAccount, | 
|             scClaimAccount: that.form.scClaimAccount | 
|           }).then(response => { | 
|             this.visible = false | 
|             this.$emit('success') | 
|           }).catch(err => { | 
|             this.$tip.apiFailed(err) | 
|           }) | 
|         }) | 
|       } else if (this.type === 2) { | 
|         this.$refs.form2.validate((valid) => { | 
|           // debugger | 
|           if (!valid) { | 
|             return | 
|           } | 
|           // 理赔处理 | 
|           dealBiz({ id: that.model.id, checkInfo: that.form.bizInfo }) | 
|             .then(response => { | 
|               this.visible = false | 
|               this.$emit('success') | 
|             }).catch(err => { | 
|               console.log(err) | 
|               this.$tip.apiFailed(err) | 
|             }).finally(() => { | 
|               this.isWorking = false | 
|             }) | 
|         }) | 
|       } else if (this.type === 3) { | 
|         this.$refs.form3.validate((valid) => { | 
|           // debugger | 
|           if (!valid) { | 
|             return | 
|           } | 
|           back({ id: that.model.id, checkInfo: that.form.backInfo }) | 
|             .then(response => { | 
|               this.visible = false | 
|               this.$emit('success') | 
|             }).catch(err => { | 
|               console.log(err) | 
|               this.$tip.apiFailed(err) | 
|             }).finally(() => { | 
|               this.isWorking = false | 
|             }) | 
|         }) | 
|       } else if (this.type === 1) { | 
|         // 添加备案号 | 
|         this.$refs.form1.validate((valid) => { | 
|           // debugger | 
|           if (!valid) { | 
|             return | 
|           } | 
|           addCode({ id: that.model.id, reportNum: that.form.reportNum }) | 
|             .then(response => { | 
|               this.visible = false | 
|               this.$emit('success') | 
|             }).catch(err => { | 
|               console.log(err) | 
|               this.$tip.apiFailed(err) | 
|             }).finally(() => { | 
|               this.isWorking = false | 
|             }) | 
|         }) | 
|       } | 
|     } | 
|   } | 
| } | 
| </script> | 
| <style> | 
|     .v-modal { | 
|       //  z-index: 2000 !important; | 
|     } | 
| </style> | 
| <style lang="scss" scoped> | 
|     .form { | 
|         width: 100%; | 
|         display: flex; | 
|         align-items: center; | 
|         flex-direction: column; | 
|         .form_span { | 
|             width: 100%; | 
|             display: flex; | 
|             align-items: start; | 
|             flex-direction: column; | 
|             margin-bottom: 20px; | 
|             span { | 
|                 font-size: 14px; | 
|                 &:nth-child(1) { | 
|                   color: #8c939d; | 
|                     margin-bottom: 5px; | 
|                 } | 
|                 &:nth-child(2) { | 
|                     color: #8c939d; | 
|                   color: black; | 
|                 } | 
|             } | 
|         } | 
|         .form_item { | 
|             width: 100%; | 
|             display: flex; | 
|             align-items: start; | 
|             margin-bottom: 20px; | 
|             &:last-child { | 
|                 margin: 0 !important; | 
|             } | 
|             .form_item_label { | 
|                 flex-shrink: 0; | 
|                 color: black; | 
|                 font-size: 14px; | 
|                 span { | 
|                     color: red; | 
|                     font-size: 14px; | 
|                 } | 
|             } | 
|             .form_item_val { | 
|                 flex: 1; | 
|                 /*height: 40px;*/ | 
|                 margin-left: 20px; | 
|                 textarea { | 
|                     width: 100%; | 
|                     height: 70px; | 
|                     border: 1px solid #cbcbcb; | 
|                     padding: 10px; | 
|                     outline: none; | 
|                     box-sizing: border-box; | 
|                 } | 
|                 input { | 
|                     width: 100%; | 
|                     height: 100%; | 
|                     outline: none; | 
|                     border-radius: 5px; | 
|                     border: 1px solid #cbcbcb; | 
|                     padding: 0 20px; | 
|                     box-sizing: border-box; | 
|                 } | 
|             } | 
|         } | 
|     } | 
|     .desc { | 
|         width: 100%; | 
|         display: flex; | 
|         align-items: center; | 
|         flex-direction: column; | 
|         .desc_label { | 
|             width: 100%; | 
|             display: flex; | 
|             align-items: center; | 
|             justify-content: space-between; | 
|             .desc_label_left { | 
|                 flex: 1; | 
|                 display: flex; | 
|                 align-items: center; | 
|                 .desc_label_left_title { | 
|                     font-size: 20px; | 
|                     font-weight: bold; | 
|                     color: black; | 
|                 } | 
|                 .desc_label_left_time { | 
|                     font-size: 14px; | 
|                     color: rgba(249, 86, 1, 0.996); | 
|                     margin-left: 10px; | 
|                 } | 
|                 .desc_label_left_code { | 
|                     font-size: 15px; | 
|                     color: black; | 
|                     margin-left: 30px; | 
|                 } | 
|             } | 
|             .desc_label_right { | 
|                 flex-shrink: 0; | 
|             } | 
|         } | 
|         .desc_list { | 
|             width: 100%; | 
|             margin-top: 20px; | 
|             display: flex; | 
|             align-items: center; | 
|             flex-wrap: wrap; | 
|             .desc_list_item { | 
|                 width: 33.3%; | 
|                 display: flex; | 
|                 align-items: center; | 
|                 margin-bottom: 10px; | 
|                 .desc_list_item_label { | 
|                     width: 130px; | 
|                     flex-shrink: 0; | 
|                     font-size: 15px; | 
|                     color: black; | 
|                 } | 
|                 .desc_list_item_val { | 
|                     flex: 1; | 
|                     font-size: 15px; | 
|                     color: black; | 
|                 } | 
|                 .desc_list_item_videos { | 
|                     flex: 1; | 
|                     display: flex; | 
|                     align-items: center; | 
|                     flex-wrap: wrap; | 
|                     .desc_list_item_imgs_video { | 
|                         width: 150px; | 
|                         height: 150px; | 
|                         background: black; | 
|                         margin-right: 10px; | 
|                         video { | 
|                             width: 100%; | 
|                             height: 100%; | 
|                         } | 
|                     } | 
|                 } | 
|             } | 
|         } | 
|         .desc_xian { | 
|             width: 100%; | 
|             height: 1px; | 
|             margin: 10px 0; | 
|             background: #ececec; | 
|         } | 
|         .desc_data { | 
|             width: 100%; | 
|             display: flex; | 
|             flex-direction: column; | 
|             margin-top: 20px; | 
|             .desc_data_label { | 
|                 font-size: 16px; | 
|                 color: black; | 
|                 font-weight: 600; | 
|                 margin-bottom: 20px; | 
|             } | 
|             .desc_data_cate { | 
|                 width: 100%; | 
|                 margin: 0 0 10px 0; | 
|             } | 
|             .desc_data_list { | 
|                 width: 100%; | 
|                 display: flex; | 
|                 align-items: center; | 
|                 flex-wrap: wrap; | 
|                 justify-content: space-between; | 
|                 .desc_data_list_item1 { | 
|                     width: 24.5%; | 
|                 } | 
|                 .desc_data_list_item { | 
|                     width: 24.5%; | 
|                     padding: 10px; | 
|                     box-sizing: border-box; | 
|                     border: 1px solid #e2e2e2; | 
|                     display: flex; | 
|                     align-items: center; | 
|                     justify-content: space-between; | 
|                     position: relative; | 
|                     margin-bottom: 10px; | 
|                     .desc_data_list_item_dele { | 
|                         position: absolute; | 
|                         top: 10px; | 
|                         right: 10px; | 
|                         font-size: 14px; | 
|                         cursor: pointer; | 
|                         color: rgba(249, 86, 1, 0.996078431372549); | 
|                     } | 
|                     .desc_data_list_item_upload { | 
|                         flex: 1; | 
|                         height: 80px; | 
|                         display: flex; | 
|                         align-items: center; | 
|                         justify-content: center; | 
|                     } | 
|                     .desc_data_list_item_img { | 
|                         flex-shrink: 0; | 
|                         width: 80px; | 
|                         height: 80px; | 
|                         display: flex; | 
|                         align-items: center; | 
|                         justify-content: center; | 
|                         overflow: hidden; | 
|                         .el-icon-plus { | 
|                             font-size: 26px; | 
|                             color: #ffffff; | 
|                         } | 
|                         img { | 
|                             width: 100%; | 
|                             height: 100%; | 
|                         } | 
|                     } | 
|                     .desc_data_list_item_info { | 
|                         flex: 1; | 
|                         height: 80px; | 
|                         display: flex; | 
|                         flex-direction: column; | 
|                         justify-content: space-between; | 
|                         span { | 
|                             &:nth-child(1) { | 
|                                 font-size: 14px; | 
|                                 color: black; | 
|                             } | 
|                             &:nth-child(2) { | 
|                                 font-size: 14px; | 
|                                 color: #888888; | 
|                             } | 
|                             &:nth-child(3) { | 
|                                 font-size: 14px; | 
|                                 color: #888888; | 
|                             } | 
|                         } | 
|                     } | 
|                 } | 
|             } | 
|         } | 
|         .desc_times { | 
|             width: 100%; | 
|             margin-top: 20px; | 
|         } | 
|     } | 
| </style> |