git ch

k94314517

2024-04-09 02bc3bfe47e3d5311a0bb041c94e70a34b1ca73c

 company/src/components/enterprise/OperaInsuranceApplyWindow.vue

@@ -2,102 +2,144 @@
    <GlobalWindow
        :title="title"
        width="100%"
        :withFooter="false"
        text="投保申请"
        :visible.sync="visible"
        :confirm-working="isWorking"
        @confirm="confirm"
    >
        <div class="list">
            <el-form :inline="true" :model="form" :rules="rules" class="demo-form-inline">
            <el-form :inline="true" ref="form" :model="form" :rules="rules" class="demo-form-inline">
                <el-form-item label="保险方案" prop="solutionId">
                    <el-select v-model="form.solutionId" placeholder="请选择">
                        <el-option label="区域一" value="shanghai"></el-option>
                        <el-option label="区域二" value="beijing"></el-option>
                    <el-select v-model="form.solutionId" @change="changeSolution" placeholder="请选择">
                        <el-option
                            v-for="item in company"
                            :key="item.id"
                            :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="期望保险生效起期" prop="applyStartTime">
                    <div style="display: flex; flex-direction: column;">
                        <el-date-picker
                                v-model="form.applyStartTime"
                                type="date"
                                placeholder="选择日期">
                            @change="getTimeVal"
                            v-model="form.applyStartTime"
                            type="date"
                            class="date_picker"
                            :clearable="false"
                            :disabled="!form.solutionId"
                            :picker-options="pickerOptions"
                            value-format="yyyy-MM-dd HH:mm:ss"
                            format="yyyy-MM-dd HH:mm:ss"
                            placeholder="选择日期">
                        </el-date-picker>
                        <span style="color: #F95601; font-size: 14px;">（次日生效投保请于17:30前提交，超时提交以保险单为准）</span>
                    </div>
                </el-form-item>
                <el-form-item label="保险生效止期" prop="applyEndTime">
                    <el-date-picker
                        disabled
                        v-model="form.applyEndTime"
                        type="date"
                        class="date_picker"
                        :picker-options="pickerOptions"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        format="yyyy-MM-dd HH:mm:ss"
                        placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="投保年龄">
                    <span>25至65</span>
                <el-form-item label="投保年龄" v-if="item">
                    <span>{{item.minAge}} 至 {{item.maxAge}}</span>
                </el-form-item>
                <el-form-item label="费用">
                    <span>200元/年/人</span>
                <el-form-item label="费用" v-if="item && item.type ==0">
                    <span>{{item.price}}元</span>
                    <span v-if="item.timeUnit === 0">/天</span>
                    <span v-if="item.timeUnit === 1">/半月</span>
                    <span v-if="item.timeUnit === 2">/月</span>
                    <span v-if="item.timeUnit === 3">/年</span>
                    <span>/人</span>
                </el-form-item>
            </el-form>
        </div>
        <div class="btns">
            <div class="btns_item">
                <el-button type="primary" @click="$refs.selectEmployees.open('选取员工')">选取员工</el-button>
                <el-button type="primary">导入员工</el-button>
                <el-button type="primary" @click="$refs.addEmployee.open('添加员工', tableData)">添加员工</el-button>
                <el-button type="primary" @click="seleUser">选取员工</el-button>
                <el-button type="primary" @click="uploadUser">导入员工</el-button>
                <el-button type="primary" @click="addUser">添加员工</el-button>
                <el-button type="danger" @click="deleItem">删除</el-button>
            </div>
            <div class="btns_item">
                <el-button type="primary">选取派遣单位</el-button>
                <el-button type="primary" @click="sele">选取派遣单位</el-button>
            </div>
        </div>
        <el-table
            :data="tableData"
            border
            show-summary
            :summary-method="getSummaries"
            ref="multipleTable"
            @selection-change="handleSelectionChange"
            style="width: 100%;margin-bottom: 15px;">
            <el-table-column
                type="selection"
                width="55">
            </el-table-column>
            <el-table-column label="序号" width="80px">
                <template slot-scope="scope">
                    <span>{{scope.$index + 1}}</span>
                </template>
            </el-table-column>
            <el-table-column
                prop="name"
                prop="memberName"
                label="姓名">
            </el-table-column>
            <el-table-column
                prop="idcardNo"
                prop="idCard"
                label="身份证号">
            </el-table-column>
            <el-table-column
                prop="address"
                label="年龄">
                <template slot-scope="{row}">
                    <template v-if="item">
                        <span style="color: red;" v-if="row.idCard && (getAgeByIdCard(row.idCard) < item.minAge || getAgeByIdCard(row.idCard) > item.maxAge)">{{ getAgeByIdCard(row.idCard) }}</span>
                        <span v-else>{{ getAgeByIdCard(row.idCard) }}</span>
                    </template>
                </template>
            </el-table-column>
            <el-table-column
                prop="address"
                prop="duName"
                label="派遣单位">
            </el-table-column>
            <el-table-column
                prop="address"
                prop="workTypeName"
                label="所属工种">
            </el-table-column>
            <el-table-column
                prop="address"
                prop="fee"
                label="费用">
            </el-table-column>
            <el-table-column
                prop="address"
                label="操作">
                <template slot-scope="scope">
                    <el-button type="text" style="color: red;" @click="dele(scope.$index)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="submit">
            <el-button type="primary">投保申请</el-button>
        </div>
        <div class="info">
            富文本
        <div class="info" v-if="item">
            <span v-if="item.specialAgreement">{{item.specialAgreement}}</span>
            <span v-if="item.specialInfo">{{item.specialInfo}}</span>
            <span v-if="item.ortherInfo">{{item.ortherInfo}}</span>
        </div>
        <!--    选择员工    -->
        <selectEmployees ref="selectEmployees" />
        <selectEmployees ref="selectEmployees" @result="getValue" />
        <!--    添加员工    -->
        <addEmployee ref="addEmployee" @result="getValue" />
        <!--    导入名单    -->
        <importEmployees ref="importEmployees" @result="getValue" />
        <!--    确认工种    -->
        <confirmJobType ref="confirmJobType" @result="getUser" />
        <!--    查看详单    -->
        <detailsPolicyholder ref="detailsPolicyholder" @success="successEvent" />
    </GlobalWindow>
</template>

@@ -106,43 +148,396 @@
import GlobalWindow from '@/components/common/GlobalWindow'
import selectEmployees from '@/components/enterprise/selectEmployees'
import addEmployee from '@/components/enterprise/addEmployee'
import importEmployees from '@/components/enterprise/importEmployees'
import confirmJobType from '@/components/enterprise/confirmJobType'
import detailsPolicyholder from '@/components/business/detailsPolicyholder'
import { all, getNewVersion } from '@/api/business/solutions'
import { mapState } from 'vuex'
import { create, getCountCyclePriceVO, getDetail, findList, updateData } from '@/api/business/insuranceApply'
export default {
  name: 'OperaInsuranceApplyWindow',
  name: 'OperaInsuranceApplyWindow2',
  extends: BaseOpera,
  components: { GlobalWindow, selectEmployees, addEmployee },
  components: { GlobalWindow, selectEmployees, addEmployee, importEmployees, confirmJobType, detailsPolicyholder },
  data () {
    return {
      form: {
          id: null,
          solutionId: '',
          applyStartTime: '',
          applyEndTime: ''
        id: null,
        ID: null,
        solutionId: '',
        applyStartTime: '',
        applyEndTime: ''
      },
      solutionName: '',
      type: '',
      pickerOptions: {}, // 存放picker options的变量
      price: '',
      company: [],
      seleData: [],
      item: null,
      // 验证规则
      rules: {
          solutionId: [
              { required: true, message: '请选择保险方案' }
          ],
          applyStartTime: [
              { required: true, message: '请选择期望保险生效起期' }
          ]
        solutionId: [
          { required: true, message: '请选择保险方案' }
        ],
        applyStartTime: [
          { required: true, message: '请选择期望保险生效起期' }
        ]
      },
      tableData: []
    }
  },
  created () {
      this.config({
          api: '/business/insuranceApply',
          'field.id': 'id'
      })
    this.config({
      api: '/business/insuranceApply',
      'field.id': 'id'
    })
  },
  computed: {
    ...mapState(['userInfo'])
  },
  methods: {
      getValue(list) {
          this.tableData.push(...list)
    successEvent () {
      const arr = JSON.parse(JSON.stringify(this.tableData))
      arr.forEach(item => {
        item.idcardNo = item.idCard
      })
      this.isWorking = true
      // if (!this.form.id) {
      create({
        applyDetailList: arr,
        applyStartTime: this.form.applyStartTime,
        applyEndTime: this.form.applyEndTime,
        solutionId: this.form.solutionId
      }).then(() => {
        this.visible = false
        this.$tip.apiSuccess('操作成功')
        this.$emit('success')
      })
        .catch(e => {
          this.$tip.apiFailed(e)
        })
        .finally(() => {
          this.isWorking = false
        })
      // } else {
      //     updateData({
      //         id: this.form.id,
      //         applyDetailList: arr,
      //         applyStartTime: this.form.applyStartTime,
      //         applyEndTime: this.form.applyEndTime,
      //         solutionId: this.form.solutionId
      //     }).then(() => {
      //         this.visible = false
      //         this.$tip.apiSuccess('操作成功')
      //         this.$emit('success')
      //     }).catch(e => {
      //         this.$tip.apiFailed(e)
      //     })
      //         .finally(() => {
      //             this.isWorking = false
      //         })
      // }
    },
    open (title, target) {
      this.title = title
      this.tableData = []
      this.form.id = null
      this.item = null
      if (target.type) {
        this.type = target.type
      }
      this.form.solutionId = ''
      this.form.applyStartTime = ''
      this.form.applyEndTime = ''
      if (target && target.id) {
        this.$nextTick(() => {
          this.$refs.form.resetFields()
          this.form.id = target.id
          this.getDetails()
        })
      } else {
        this.$nextTick(() => {
          this.$refs.form.resetFields()
          this.form[this.configData['field.id']] = null
        })
      }
      this.getCompany()
      this.visible = true
      this.updatePickerOptions()
    },
    // 获取投保详情
    getDetails () {
      findList({ applyId: this.form.id })
        .then(res => {
          res.forEach(item => {
            console.log(item)
            item.idCard = item.idcardNo
            item.fee = ''
            if (this.type === 1) {
              item.duName = ''
              item.duId = ''
              item.worktypeId = ''
              item.workTypeName = ''
            }
          })
          this.tableData = res
        })
      getDetail(this.form.id)
        .then(res => {
          // this.form.solutionId = res.solutionId
          this.changeSolution1(res.solutionId)
        })
    },
    getSummaries (param) {
      const { columns, data } = param
      const sums = []
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '总价'
        } else if (index === 7) {
          let total = 0
          this.tableData.forEach(item => {
            total += item.fee
          })
          sums[index] = total
        }
      })
      return sums
    },
    deleItem () {
      if (this.seleData.length === 0) {
        this.$message.warning('至少选择一项内容')
        return
      }
      this.seleData.forEach(item => {
        this.tableData.forEach((row, index) => {
          if (item === row.idCard) {
            this.tableData.splice(index, 1)
          }
        })
      })
    },
    confirm () {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.tableData.length === 0) {
            this.$message.warning('至少添加一项员工')
            return
          }
          for (let i = 0; i < this.tableData.length; i++) {
            console.log(this.tableData[i].worktypeId)
            console.log(this.tableData[i].duId)
            if (!this.tableData[i].worktypeId || !this.tableData[i].duId) {
              this.$message.warning('请完善派遣单位和工种信息')
              return
            }
          }

          let price = 0
          if (this.item && this.item.type != 1) {
            this.tableData.forEach(item => {
              price = price + item.fee
            })
          }
          this.$refs.detailsPolicyholder.open('投保详情单', {
            companyName: this.userInfo.company.name,
            solutionName: this.item.name,
            solutionType: this.item.type,
            applyStartTime: this.form.applyStartTime,
            applyEndTime: this.form.applyEndTime,
            insureNum: this.tableData.length,
            totalPrice: price,
            detailList: this.tableData
          })
        }
      })
    },
    // 获取结束时间和价格
    getTimeVal (time) {
      getCountCyclePriceVO({
        solutionsId: this.form.solutionId,
        startDate: time
      }).then(res => {
        this.price = res.cyclePrice
        this.form.applyEndTime = res.endDate
        this.tableData.forEach(item => {
          item.fee = res.cyclePrice
        })
        this.$forceUpdate()
      })
    },
    getDate (n) { // n为多少天，-代表往前，+代表往后
      const date1 = new Date()
      const time1 = date1.getFullYear() + '-' + (date1.getMonth() + 1) + '-' + date1.getDate()// time1表示当前时间
      const date2 = new Date(date1)
      date2.setDate(date1.getDate() + n)
      const time2 = date2.getFullYear() + '-' + ('0' + (date2.getMonth() + 1)).slice(-2) + '-' + ('0' + date2.getDate()).slice(-2)
      return time2
    },
    updatePickerOptions () {
      var that = this
      this.pickerOptions = {
        disabledDate (time) {
          if (!that.item) return
          if (that.item.validType === 1) {
            // 次月
            const currentDate = new Date()
            currentDate.setMonth(currentDate.getMonth() + 1)
            currentDate.setDate(1)
            return time.getTime() <= new Date(currentDate.toLocaleString()).getTime() - 8.64e7
          } else if (that.item.validType === 0) {
            // 多少日后生效
            return time.getTime() <= new Date(that.getDate(that.item.validTypeNum - 1)).getTime()
          }
        }
      }
    },
    seleUser () {
      if (!this.form.solutionId) {
        this.$message.warning('请先选择保险方案')
        return
      }
      this.$refs.selectEmployees.open('选取员工', { arr: this.tableData, price: this.price, type: 1 })
    },
    addUser () {
      if (!this.form.solutionId) {
        this.$message.warning('请先选择保险方案')
        return
      }
      this.$refs.addEmployee.open('添加员工', { arr: this.tableData, price: this.price })
    },
    uploadUser () {
      if (!this.form.solutionId) {
        this.$message.warning('请先选择保险方案')
        return
      }
      this.$refs.importEmployees.open('上传名单', { arr: this.tableData, solutionId: this.form.solutionId, type: 1, price: this.price })
    },
    // 切换方案
    changeSolution (e) {
      this.form.applyEndTime = ''
      this.form.applyStartTime = ''
      if (!this.form.id) {
        this.tableData = []
      } else {
        this.price = ''
        this.tableData.forEach(item => {
          item.fee = ''
          item.duName = ''
          item.duId = ''
          item.workTypeName = ''
          item.workTypeId = ''
        })
      }
      this.company.forEach(item => {
        if (item.id === e) {
          // this.price = item.price
          this.item = item
          if(this.item && this.item.type==1){
            this.item.fee=0
          }
          this.updatePickerOptions()
        }
      })
      this.tableData.forEach(item => {
        item.fee = this.price
      })
    },
    // 切换方案
    changeSolution1 (e) {
      getNewVersion(e)
        .then(res => {
          this.form.solutionId = res.id
          this.company.forEach(item => {
            if (item.id === res.id) {
              // this.price = item.price
              this.item = item
              if(this.item && this.item.type==1){
                this.item.fee=0
              }
              this.updatePickerOptions()
            }
          })
        })
      this.tableData.forEach(item => {
        item.fee = this.price
      })
    },
    dele (index) {
      this.tableData.splice(index, 1)
    },
    getUser (obj) {
      this.seleData.forEach(id => {
        this.tableData.forEach(row => {
          if (id === row.idCard) {
            row.workTypeName = obj.workTypeName
            row.worktypeId = obj.worktypeId
            row.duName = obj.duName
            row.duId = obj.duId
          }
        })
      })
      this.seleData = []
      this.$refs.multipleTable.clearSelection()
    },
    // 选择员工
    sele () {
      if (!this.form.solutionId) {
        this.$message.warning('请选择保险方案')
        return
      }
      if (this.seleData.length === 0) {
        this.$message.warning('请选择员工')
        return
      }
      this.$refs.confirmJobType.open('确认工种', { solutionId: this.form.solutionId })
    },
    // 查询全部方案
    getCompany () {
      all({})
        .then(res => {
          this.company = res
        })
    },
    getAgeByIdCard (idCard) {
      const sexAndAge = {}
      // 获取用户身份证号码
      const userCard = idCard
      // 如果用户身份证号码为undefined则返回空
      if (!userCard) {
        return sexAndAge
      }
      // 获取出生日期
      const yearBirth = userCard.substring(6, 10)
      const monthBirth = userCard.substring(10, 12)
      const dayBirth = userCard.substring(12, 14)
      // 获取当前年月日并计算年龄
      const myDate = new Date()
      const monthNow = myDate.getMonth() + 1
      const dayNow = myDate.getDate()
      let age = myDate.getFullYear() - yearBirth
      if (monthNow < monthBirth || (monthNow == monthBirth && dayNow < dayBirth)) {
        age--
      }
      // 得到年龄
      sexAndAge.age = age
      return sexAndAge.age
    },
    handleSelectionChange (e) {
      this.seleData = e.map(item => item.idCard)
    },
    getValue (list) {
      this.tableData.push(...list)
    }
  }
}
</script>

<style>
    .el-picker-panel__footer .el-button--text.el-picker-panel__link-btn {
        display: none;
    }
</style>

<style lang="scss" scoped>
    .list {
@@ -168,5 +563,10 @@
    }
    .info {
        width: 100%;
        font-size: 14px;
        color: black;
      span{
        display: block;
      }
    }
</style>