jsm-mall-front/src/views/setting/difficultyFee/difficultyExpenseApproval/InsuranceContractForm.vue

<template>
  <div>
    <zj-form-container v-if="formDialog" ref="formRef" :form-data="formData" :form-attributes="{ size: 'mini' }">
      <zj-form-module
        v-if="formData.pgOrderBase"
        title="工单信息"
        label-width="110px"
        :formData="formData.pgOrderBase"
        :formItems="formItems"
        :column="3"
      >
      </zj-form-module>
      <zj-form-module title="申请信息" label-width="110px" :formData="formData" :formItems="formItems2" :column="3">
      </zj-form-module>
      <template
        v-if="[3].includes(type) && formData.workerInvolveApplyItems && formData.workerInvolveApplyItems.length"
      >
        <template v-for="(item, index) in formData.workerInvolveApplyItems">
          <zj-form-module
            :key="`${index}1`"
            :title="`网点审核`"
            label-width="100px"
            :form-data="item"
            :form-items="formItems3"
            :column="3"
          >
          </zj-form-module>
          <zj-form-module
            v-if="!!item.examineStatus"
            :key="`${index}2`"
            :title="`中心审核`"
            label-width="100px"
            :form-data="item"
            :form-items="formItems4"
            :column="3"
          >
          </zj-form-module>
        </template>
      </template>
    </zj-form-container>
    <zj-form-container
      v-if="formDialog && [1, 2].includes(type)"
      ref="formRef1"
      :form-data="formData1"
      :form-attributes="{ size: 'mini' }"
    >
      <zj-form-module title="网点审核" label-width="100px" :form-data="formData1" :form-items="formItems3" :column="3">
      </zj-form-module>
    </zj-form-container>
    <zj-form-container
      v-if="formDialog && [2].includes(type)"
      ref="formRef2"
      :form-data="formData2"
      :form-attributes="{ size: 'mini' }"
    >
      <zj-form-module title="中心审核" label-width="100px" :form-data="formData2" :form-items="formItems4" :column="3">
      </zj-form-module>
    </zj-form-container>

    <div v-if="type === 0 || type === 1" style="text-align: right">
      <el-button
        size="mini"
        @click="
          () => {
            $emit('success')
          }
        "
      >
        取消
      </el-button>
      <el-button v-if="type == 1" size="mini" type="primary" @click="networkAudit">网点审批</el-button>
      <el-button v-if="type == 2" size="mini" type="primary" @click="centralAudit">中心审批</el-button>
    </div>
  </div>
</template>

<script>
import { workerApplyDetail, workerApplyWebsitAppeal, workerApplyAppeal } from '@/api/difficultyExpenseApproval.js'
import { required } from '@/components/template/rules_verify.js'
export default {
  props: {
    type: {
      type: Number,
      default: null
    },
    item: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      formDialog: false,
      formData: {
        applyWorkerName: '',
        applyWorkerNumber: '',
        applyWorkerPhone: '',
        auditTime: '',
        companyWechatId: '',
        companyWechatName: '',
        createBy: '',
        createTime: '',
        id: 0,
        image: '',
        maintenancePricePass: 0,
        orderBaseId: '',
        pgOrderBase: {},
        principal: '',
        problemDescription: '',
        reason: '',
        remark: '',
        status: 0,
        updateBy: '',
        updateTime: '',
        userId: '',
        websitAuditTime: '',
        websitCustomerCharges: 0,
        websitId: '',
        websitMaintenancePricePass: 0,
        websitName: '',
        websitPrincipal: '',
        websitRemark: '',
        workerInvolveApplyItems: []
      },
      formData1: {
        auditTime: '',
        involveApplyId: '',
        maintenancePricePass: 0,
        principal: '',
        remark: '',
        status: 0,
        websitAuditTime: '',
        websitCustomerCharges: 0,
        websitMaintenancePricePass: 0,
        websitPrincipal: '',
        websitRemark: '',
        websitStatus: 0
      },
      formData2: {
        auditTime: '',
        involveApplyId: '',
        maintenancePricePass: 0,
        principal: '',
        remark: '',
        status: 0,
        websitAuditTime: '',
        websitCustomerCharges: 0,
        websitMaintenancePricePass: 0,
        websitPrincipal: '',
        websitRemark: '',
        websitStatus: 0
      },
      formRules: {}
    }
  },
  computed: {
    formItems() {
      return [
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '工单单号', prop: 'id' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '工单类型', prop: 'orderSmallTypeText' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '客户姓名', prop: 'userName' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '客户电话', prop: 'userMobile' }
        },
        {
          md: 12,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '客户地址', prop: 'address' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '主要工程师', prop: 'workerName' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '完工时间', prop: 'overTime' }
        }
      ]
    },
    formItems2() {
      return [
        {
          md: 12,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '所属网点', prop: 'websitName' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '申请人', prop: 'applyWorkerName' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '申请时间', prop: 'createTime' }
        },
        {
          name: 'el-input',
          md: 24,
          attributes: {
            disabled: [2, 3].includes(this.type),
            type: 'textarea',
            rows: 3,
            placeholder: '请输入'
          },
          formItemAttributes: {
            label: '申请理由',
            prop: 'reason',
            rules: [...required]
          }
        },
        {
          name: 'el-input',
          md: 24,
          attributes: {
            disabled: [2, 3].includes(this.type),
            type: 'textarea',
            rows: 3,
            placeholder: '请输入'
          },
          formItemAttributes: {
            label: '问题描述',
            prop: 'problemDescription',
            rules: [...required]
          }
        }
      ]
    },
    formItems3() {
      return [
        {
          md: 12,
          name: 'el-radio',
          options: [
            { label: '通过审核', value: '5' },
            { label: '驳回可重申', value: '2' },
            { label: '驳回不可申诉', value: '4' }
          ],
          attributes: {
            disabled: [2, 3].includes(this.type)
          },
          formItemAttributes: {
            label: '网点审批',
            prop: 'websitStatus',
            rules: [...required]
          }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: [2, 3].includes(this.type) },
          formItemAttributes: { label: '申请费用', prop: 'websitMaintenancePricePass', rules: [...required] }
        },
        {
          md: 6,
          name: 'el-radio',
          options: [
            { label: '是', value: '1' },
            { label: '否', value: '2' }
          ],
          attributes: {
            disabled: [2, 3].includes(this.type)
          },
          formItemAttributes: {
            label: '是否向客户收费',
            prop: 'websitCustomerCharges',
            rules: [...required]
          }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '网点审核人', prop: 'websitPrincipal' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '网点审核时间', prop: 'websitAuditTime' }
        },
        {
          name: 'el-input',
          md: 24,
          attributes: {
            disabled: [2, 3].includes(this.type),
            type: 'textarea',
            rows: 3,
            placeholder: '请输入'
          },
          formItemAttributes: {
            label: '审核备注',
            prop: 'websitRemark',
            rules: [...required]
          }
        }
      ]
    },
    formItems4() {
      return [
        {
          md: 12,
          name: 'el-radio',
          options: [
            { label: '通过审核', value: '5' },
            { label: '驳回可重申', value: '2' },
            { label: '驳回不可申诉', value: '4' }
          ],
          attributes: {
            disabled: [3].includes(this.type)
          },
          formItemAttributes: {
            label: '中心审批',
            prop: 'status',
            rules: [...required]
          }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '中心审核人', prop: 'principal' }
        },
        {
          md: 6,
          name: 'el-input',
          attributes: { disabled: true },
          formItemAttributes: { label: '中心审核时间', prop: 'auditTime' }
        },
        {
          md: 6,
          name: 'el-radio',
          options: [],
          attributes: {
            disabled: [3].includes(this.type)
          },
          formItemAttributes: {
            label: '审批费用',
            prop: 'maintenancePricePass',
            rules: [...required]
          }
        },
        {
          name: 'el-input',
          md: 24,
          attributes: {
            disabled: [3].includes(this.type),
            type: 'textarea',
            rows: 3,
            placeholder: '请输入'
          },
          formItemAttributes: {
            label: '审核备注',
            prop: 'remark',
            rules: [...required]
          }
        }
      ]
    }
  },

  created() {
    workerApplyDetail({
      orderBaseId: this.item.orderBaseId
    }).then(res => {
      this.formData = { ...res.data }
      this.formDialog = true
    })
  },
  methods: {
    networkAudit() {
      this.$refs.formRef.validate(valid0 => {
        if (valid0) {
          this.$refs.formRef1.validate((valid, invalidFields, errLabels) => {
            if (valid) {
              workerApplyWebsitAppeal({
                ...this.formData,
                workerInvolveApplyItem: [...this.formData1]
              }).then(res => {
                this.$message({
                  type: 'success',
                  message: '审核成功'
                })
                this.$emit('success')
              })
            }
          })
        }
      })
    },
    centralAudit() {
      this.$refs.formRef2.validate((valid, invalidFields, errLabels) => {
        if (valid) {
          workerApplyAppeal({
            ...this.formData,
            ...this.formData2
          }).then(res => {
            this.$message({
              type: 'success',
              message: '审核成功'
            })
            this.$emit('success')
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>