优化

MrShi

2024-11-19 56edbd80963acea41d9b9737bb9264f57a6e4ae2

 company/src/components/business/OperaUnionApplyCheckWindow.vue

@@ -1,12 +1,12 @@
<template>
    <GlobalWindow
        :title="title"
        width="50%"
        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="backCheckInfo">
            <el-input type="textarea" v-model="form.backCheckInfo" placeholder="请输入" v-trim/>
@@ -16,11 +16,16 @@
          <el-form-item label="上传投保单：" prop="toubaodanFile">
            <UploadFile @remove="dele2" :uploadData="{ folder: 'apply',fileType:'.pdf' }" :fileList="form.fileList" @uploadSuccess="toubaoFileUploaded" />
          </el-form-item>
<!--          <div v-for="(item,index) in this.model.applyList" :key="index">-->
<!--            <el-form-item :label="(index+1)+'.被保险人（'+item.companyName+')：'" prop="tbdMultifileList[index]">-->
<!--              <UploadFile  @remove="deleIndex(0,index)"  :uploadData="{ folder: 'apply',fileType:'.pdf' }"  :fileIndex="index"  :showTips="showTips" :fileList="model.applyList[index].fileList" @uploadSuccess="toubaoFileUploaded2" />-->
<!--            </el-form-item>-->
<!--          </div>-->
        </el-form>
        <!--    上传保险单    -->
      <el-form v-if="visible3==true" :model="form" ref="form3" :rules="rules3" style="width: 100%;">
        <el-form-item label="客户期望保险生效起期：">
          {{ model.applyStartTime }}
        <el-form-item label="期望保险生效期：">
          <span >{{( form.startTime|| '-') +'  至  '+( form.endTime|| '-')}}</span>
        </el-form-item>
        <el-form-item label="" >
          <el-radio-group v-model="form.selectRadio" @change="selectChange">
@@ -36,15 +41,47 @@
              placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="保险生效起期：">
          {{ form.startTime }}
        <el-form-item label="保险生效止期：" prop="endTime" v-if="form.selectRadio === 1">
          <el-date-picker
              v-model="form.endTime"
              @change="changEndTime"
              type="date"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期">
          </el-date-picker>
        </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="baoxianFile">
          <UploadFile @remove="dele3" :uploadData="{ folder: 'apply',fileType:'.pdf' }" :fileList="form.fileList1" @uploadSuccess="baoxianFileUploaded" />
          <UploadFile @remove="dele3"  :uploadData="{ folder: 'apply',fileType:'.pdf' }" :fileList="form.fileList1" @uploadSuccess="baoxianFileUploaded" />
        </el-form-item>
        <div class="box_table" v-if="false">
          <div class="box_table_head">
            <div class="box_table_head_item">序号</div>
            <div class="box_table_head_item">被保险人</div>
            <div  class="box_table_head_item">在保/投保人数</div>
            <div class="box_table_head_item">操作</div>
            <div class="box_table_head_item">服务费(当前保单)</div>
          </div>
          <div class="box_table_content" v-for="(item, index) in model.applyList" :key="index">
            <div class="box_table_content_item">{{index + 1}}</div>
            <div class="box_table_content_item" >{{ item.companyName }}</div>
            <div class="box_table_content_item">{{item.guaranteeNum}} / {{ item.insureNum }}</div>
            <div class="box_table_content_item">
              <el-form-item label="" prop="bxdMultifileList[index]">
                <UploadFileLink   @remove="deleIndex(1,index)" :uploadData="{ folder: 'apply',fileType:'.pdf' }" :fileIndex="index" :showTips="showTips" :fileList="model.applyList[index].fileList1" @uploadSuccess="baoxianFileUploaded2" />
              </el-form-item>
            </div>
            <div class="box_table_content_item">  <el-input style="width: 60%" v-model="form.bxdMultifileList[index].serverMoney" placeholder="请输入"  ></el-input>
              <span style="margin-left: 15px">元/人</span></div>
          </div>
        </div>
<!--        <div v-for="(item,index) in this.model.applyList" :key="index">
          <el-form-item :label="item.companyName" prop="bxdMultifileList[index]">
            <UploadFile   :uploadData="{ folder: 'apply',fileType:'.pdf' }" :fileIndex="index" :showTips="showTips" :fileList="model.applyList[index].fileList1" @uploadSuccess="baoxianFileUploaded2" />
          </el-form-item>
        </div>-->
      </el-form>
      <template v-slot:footer>
        <el-button type="primary" @click="doSubmit">确 定</el-button>
@@ -59,19 +96,21 @@
import {
  cancel,
  uploadBXD,
  uploadToubaodan,
} from "@/api/business/unionApply";
import UploadFile from "@/components/common/UploadFile";
import {remark} from "@/api/business/settleClaims";
  uploadToubaodan
} from '@/api/business/unionApply'
import UploadFile from '@/components/common/UploadFile'
import UploadFileLink from '@/components/common/UploadFileLink'

export default {
  name: 'OperaUnionApplyCheckWindow',
  extends: BaseOpera,
  components: {UploadFile, GlobalWindow },
  components: { UploadFile, GlobalWindow ,UploadFileLink},
  data () {
    return {
      // 表单数据
      model: {},
      falg :0,
      falg: 0,
      showTips:false,
      rules1: {
        backCheckInfo: [
          { required: true, message: '请完善信息' }
@@ -89,23 +128,27 @@
        startTime: [
          { required: true, message: '请完善信息' }
        ],
        baoxianFile: [
        endTime: [
          { required: true, message: '请完善信息' }
        ],
        baoxianFile: [
          { required: true, message: '请完善信息' }
        ]
      },
      form: {
         id: null,
         backCheckInfo:'',
         editCheckInfo:'',
        startTime:null,
        code:null,
        toubaodanFile:null,
        baoxianFile:null,
        tbdMultifileList:[],
        bxdMultifileList:[],
        id: null,
        backCheckInfo: '',
        editCheckInfo: '',
        startTime: null,
        endTime: null,
        code: null,
        toubaodanFile: null,
        baoxianFile: null,
        tbdMultifileList: [],
        bxdMultifileList: [],
        fileList: [],
        fileList1: [],
        selectRadio:0
        selectRadio: 0
      },
      visible1: false,
      visible2: false,
@@ -113,55 +156,88 @@
    }
  },
  created () {
      this.config({
          api: '/business/insuranceApply',
          'field.id': 'id'
      })
    this.config({
      api: '/business/insuranceApply',
      'field.id': 'id'
    })
  },
  methods: {
    dele2() {
      this.form.toubaodanFile = ''
    changEndTime(){
      this.form.endTime=this.form.endTime.replace(" 00:00:00"," 23:59:59")
    },
    dele3() {
      this.form.baoxianFile = ''
    dele2 () {
      this.form.toubaodanFile= null
    },
     open(title,target,flag){
       this.visible=true
       this.model={}
       this.form= {
         id: null,
         backCheckInfo:'',
         dealBackInfo:'',
         editCheckInfo:'',
         editDate: '',
         editCode: '',
         startTime:null,
         code:null,
         toubaodanFile:null,
         baoxianFile:null,
         editBaoxianFile:null,
         fileList: [],
         fileList1: [],
         selectRadio:0
       },
       this.model = target
       this.form.startTime = target.startTime
       this.title = title
       this.flag = flag
       this.visible1 = false
       this.visible2 = false
       this.visible3 = false
       if(flag == 1){
         this.visible1 = true
       }
       if(flag == 2){
         this.visible2 = true
       }
       if(flag == 3){
         this.visible3 = true
       }
     },
    doSubmit(){
    deleIndex (flag,index) {
      if(flag == 0){
        this.form.tbdMultifileList[index].fileurl = null
        this.form.tbdMultifileList[index].name = null
      }else  if(flag ==1){
        this.form.bxdMultifileList[index].fileUrl = null
        this.form.bxdMultifileList[index].fileName = null
      }
    },
    dele3 () {
      this.form.baoxianFile = null
    },
    open (title, target, flag) {
      this.visible = true
      this.model = {}
      this.form = {
        id: null,
        backCheckInfo: '',
        dealBackInfo: '',
        editCheckInfo: '',
        editDate: '',
        editCode: '',
        startTime: null,
        endTime: null,
        code: null,
        toubaodanFile: null,
        baoxianFile: null,
        editBaoxianFile: null,
        tbdMultifileList:[],
        bxdMultifileList:[],
        fileList: [],
        fileList1: [],
        selectRadio: 0
      }

      this.model = target
      console.log(target)
      this.form.startTime = target.startTime
      this.form.endTime = target.endTime
      this.title = title
      this.flag = flag
      this.visible1 = false
      this.visible2 = false
      this.visible3 = false
      this.form.tbdMultifileList=[]
      this.form.bxdMultifileList=[]
      if (flag == 1) {
        this.visible1 = true
      }
      if (flag == 2) {
        this.visible2 = true
        if(this.model.applyList){
          this.model.applyList.forEach(item =>{
            item.fileList =[]
            this.form.tbdMultifileList.push({objId:item.id,fileurl:null,name:null})
          })
        }
      }
      console.log(this.model.applyList)
      if (flag == 3) {
        this.visible3 = true
        if(this.model.applyList){
          this.model.applyList.forEach(item =>{
            item.fileList1 =[]
            this.form.bxdMultifileList.push({applyId:item.id,serverMoney:0,fileUrl:null,fileName:null})
          })
        }
      }
    },
    doSubmit () {
      if (this.flag == 1) {
        this.$refs.form1.validate((valid) => {
          // debugger
@@ -188,87 +264,107 @@
        })
      }
    },
    selectChange(){
       if(this.form.selectRadio == 0){
         this.form.startTime = this.model.startTime
       }else{
         this.form.startTime = ''
       }
    },
    toubaoFileUploaded(data){
      this.form.toubaodanFile=data
    },
    baoxianFileUploaded(data){
      this.form.baoxianFile=data
    },
    backDo(){
      this.$dialog.messageConfirm('确认进行该操作吗？')
          .then(() => {
            this.isWorking = true
            cancel({id:this.model.id,reason:this.form.backCheckInfo})
                .then(response => {
                  this.visible = false
                  this.$emit('success')
                  }).catch(err => {
                this.$tip.apiFailed(err)
                 })
          })
    },
    uploadToubaodan(){
      this.$dialog.messageConfirm('确认进行该操作吗？')
          .then(() => {
            this.isWorking = true
            uploadToubaodan({businessId:this.model.id,fileurl:this.form.toubaodanFile.fileurl,name:this.form.toubaodanFile.name,multifileList:this.form.tbdMultifileList})
                .then(response => {
                  this.visible = false
                  this.$emit('success')
                }).catch(err => {
                  this.$tip.apiFailed(err)
                })
          })
    },

    uploadBaoxiandan(){
      this.$dialog.messageConfirm('确认进行该操作吗？')
          .then(() => {
            this.isWorking = true
            uploadBXD({id:this.model.id,startTime:this.form.startTime,code:this.form.code,baoxiandanFile:this.form.baoxianFile})
                .then(response => {
                  this.visible = false
                  this.$emit('success')
                }).catch(err => {
                  this.$tip.apiFailed(err)
                })
          })

    },
      handleRemove(file, fileList) {
          console.log(file, fileList);
      },
      handlePreview(file) {
          console.log(file);
      },
      handleExceed(files, fileList) {
          this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      beforeRemove(file, fileList) {
          return this.$confirm(`确定移除 ${ file.name }？`);
      },
      successEvent() {

      },
      handleSizeChange(val) {
          console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
          console.log(`当前页: ${val}`);
      },
      handleClick(tab, event) {
          console.log(tab, event);
      },
      onSubmit() {

    selectChange () {
      if (this.form.selectRadio == 0) {
        this.form.startTime = this.model.startTime
        this.form.endTime = this.model.endTime
      } else {
        // this.form.startTime = ''
        // this.form.endTime = ''
      }
    },
    toubaoFileUploaded (data) {
      this.form.toubaodanFile = data
    },
    toubaoFileUploaded2 (data) {
      this.form.tbdMultifileList[data.index].fileurl = data.fileurl
      this.form.tbdMultifileList[data.index].name = data.name
    },
    baoxianFileUploaded (data) {
      this.form.baoxianFile = data
    },
    baoxianFileUploaded2 (data) {
      this.form.bxdMultifileList[data.index].fileUrl = data.fileurl
      this.form.bxdMultifileList[data.index].fileName = data.name
    },
    backDo () {
      this.$dialog.messageConfirm('您确认进行该操作吗？')
        .then(() => {
          this.isWorking = true
          cancel({ id: this.model.id, reason: this.form.backCheckInfo })
            .then(response => {
              this.visible = false
              this.$emit('success')
            }).catch(err => {
              this.$tip.apiFailed(err)
            })
        })
    },
    uploadToubaodan () {
      this.$dialog.messageConfirm('提交后不可修改，请再次核对后确认提交！')
        .then(() => {
          this.isWorking = true
          console.log(this.form.tbdMultifileList )
          uploadToubaodan({ businessId: this.model.id, fileurl: this.form.toubaodanFile.fileurl, name: this.form.toubaodanFile.name, multifileList: this.form.tbdMultifileList })
            .then(response => {
              this.visible = false
              this.$emit('success')
            }).catch(err => {
              this.$tip.apiFailed(err)
            })
        })
    },

    uploadBaoxiandan () {
      this.$dialog.messageConfirm('提交后不可修改，请再次核对后确认提交！')
        .then(() => {
          this.isWorking = true
          var param ={
            id: this.model.id,
            startTime: this.form.startTime,
            endTime: this.form.endTime,
            code: this.form.code,
            fileUrl: this.form.baoxianFile.fileurl,
            fileName: this.form.baoxianFile.name,
            unionApplyBXDDDetailDTOList:this.form.bxdMultifileList
          }
          console.log(param)
          uploadBXD(param)
            .then(response => {
              this.visible = false
              this.$emit('success')
            }).catch(err => {
              this.$tip.apiFailed(err)
            })
        })
    },
    handleRemove (file, fileList) {
      console.log(file, fileList)
    },
    handlePreview (file) {
      console.log(file)
    },
    handleExceed (files, fileList) {
      this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
    },
    beforeRemove (file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`)
    },
    successEvent () {

    },
    handleSizeChange (val) {
      console.log(`每页 ${val} 条`)
    },
    handleCurrentChange (val) {
      console.log(`当前页: ${val}`)
    },
    handleClick (tab, event) {
      console.log(tab, event)
    },
    onSubmit () {

    }
  }
}
</script>
@@ -388,4 +484,129 @@
            }
        }
    }
    .box_table {
      width: 100%;
      border-top: 1px solid #b4bbc5;
      border-left: 1px solid #b4bbc5;
      box-sizing: border-box;
      .box_table_head {
        width: 100%;
        display: flex;
        align-items: center;
        .box_table_head_item1 {
          flex: 1;
          height: 50px;
          background: #f2f2f2;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 14px;
          color: black;
          border-right: 1px solid #b4bbc5;
          border-bottom: 1px solid #b4bbc5;
          box-sizing: border-box;
        }
        .box_table_head_item {
          flex: 1;
          height: 50px;
          background: #f2f2f2;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 14px;
          color: black;
          border-right: 1px solid #b4bbc5;
          border-bottom: 1px solid #b4bbc5;
          box-sizing: border-box;
          &:nth-child(1) {
            flex: 0.5;;
          }
          &:nth-child(2) {
             flex:1.5;
           }
          &:nth-child(4) {
             flex:1.5;
           }
          &:nth-child(5) {
            flex: 1.5;;
          }
        }
        .box_table_head_item5 {
          flex: 1;
          height: 50px;
          background: #f2f2f2;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 14px;
          color: black;
          border-right: 1px solid #b4bbc5;
          border-bottom: 1px solid #b4bbc5;
          box-sizing: border-box;
          &:nth-child(2) {
            flex: 5;
          }
        }
        .box_form_item {
          flex: 1;
          height: 50px;
          background: #ffffff;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 14px;
          color: black;
          border-right: 1px solid #b4bbc5;
          border-bottom: 1px solid #b4bbc5;
          box-sizing: border-box;
          &:nth-child(1) {
            //flex: 0.5;
          }
        }
      }
      .box_table_content {
        width: 100%;
        display: flex;
        align-items: center;
        .box_table_content_header{
          border-bottom: 0px solid #b4bbc5 !important;
        }
        .box_table_content_item {
          //white-space: nowrap;
          overflow: hidden;
          //text-overflow: ellipsis;
          flex: 1;
          height: 50px;
          padding: 10px;
          background: #ffffff;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 14px;
          color: black;
          border-right: 1px solid #b4bbc5;
          border-bottom: 1px solid #b4bbc5;
          box-sizing: border-box;
          &:nth-child(1) {
            flex: 0.5;;
          }
          &:nth-child(2) {
            flex:1.5;
          }
          &:nth-child(4) {
            flex: 1.5;
          }
          &:nth-child(5) {
            flex: 1.5;
          }
          span{
            width: 100%;
            white-space: nowrap;
            word-wrap: break-word;
            text-overflow: ellipsis;
            overflow: hidden;
          }
        }
      }
    }
</style>