diantou/src_product/iam/audit/auditsource/userbase/iam-audit-userbase-form.vue

<template>
  <audit-form-top-banner :handel-save-form="saveForm" :form-data="mode" @handelSaveForm="saveForm">
    <sd-detail-form
      ref="iamUserBaseDetail"
      form-id="iamUserBase"
      page-id="audit/auditsource/userbase/iamUserBase"
      :record-id="this.$route.query.record ? parseInt(this.$route.query.record) : null"
      :class="$style.form"
      :read-only="readOnly"
      @close="close(true)"
      @saved="SJRYKSave"
      @sdFormReady="
        () => {
          this.sdFormReady()
        }
      "
    >
      <template v-slot="{ model, fields }">
        <table>
          <tr>
            <!-- 父级ID -->
            <sd-form-item-td :colspan="3" name="parentId" :hidden="true" />
          </tr>
        </table>

        <table
          ><tr
            ><td>
              <audit-advanced-group
                :expand="basicExpand"
                :expand-str="'basicExpand'"
                :group-label="'基本信息'"
                tablestyle="''"
                @changedClick="changedClick"
              ></audit-advanced-group> </td></tr
        ></table>

        <table v-show="basicExpand">
          <tr>
            <!-- 姓名 -->
            <sd-form-item-td name="baseUserMember" label="姓名" @change="baseUser" />
            <!--员工编号 -->
            <sd-form-item-td name="userCode" />
          </tr>
          <tr>
            <!-- 账号 -->
            <sd-form-item-td name="baseDeptMember" label="所属组织机构" :hidden="true" />
            <sd-form-item-td name="orgName" label="所属组织机构" />
            <!-- 性别 -->
            <sd-form-item-td name="userSex" />
          </tr>
          <tr>
            <!-- 出生年月 -->
            <sd-form-item-td name="userBornTime" />
            <!-- 民族 -->
            <sd-form-item-td name="userNationality" />
          </tr>
          <tr>
            <!-- 职位 -->
            <sd-form-item-td name="userDuty" />
            <!-- 擅长审计领域 -->
            <sd-form-item-td name="auditField" />
            <!-- 职级 -->
            <!-- <sd-form-item-td name="userLevel" /> -->
          </tr>
          <tr>
            <!-- 岗位 -->
            <sd-form-item-td name="userPost" />
            <!-- 办公电话 -->
            <sd-form-item-td name="userPhone" />
          </tr>
          <tr>
            <!-- 手机 -->
            <sd-form-item-td name="userMobile" />
            <!-- email -->
            <sd-form-item-td name="userMail" />
          </tr>
          <tr>
            <!-- 政治面貌 -->
            <sd-form-item-td name="userPolicitalStatus" />
            <!-- 入司时间 -->
            <sd-form-item-td name="userEnterTime" />
          </tr>
          <tr>
            <!-- 从事审计工作日期 -->
            <sd-form-item-td name="userWorkTime" />
            <!-- 在岗状态 -->
            <sd-form-item-td name="userMound" @change="userMoundChange(model.userMound)" />
          </tr>
          <tr v-show="model.userMound === '02'">
            <!-- 调离日期 -->
            <sd-form-item-td name="userLeaveTime" :colspan="3" />
          </tr>
          <tr v-show="model.userMound === '02'">
            <!-- 调离原因 -->
            <sd-form-item-td name="userLeaveReason" :colspan="3">
              <a-textarea v-model="model.userLeaveReason" :rows="3" :cols="170" />
            </sd-form-item-td>
          </tr>
        </table>

        <table>
          <tr
            ><td :colspan="4">
              <sd-form-item name="iamUserEduEntitys" :label="null">
                <template v-slot:read-and-edit="{ editable }">
                  <audit-advanced-group
                    :expand="eduExpand"
                    :expand-str="'eduExpand'"
                    :group-label="'教育信息'"
                    @changedClick="changedClick"
                  >
                    <template>
                      <xm-child-table
                        v-if="eduExpand"
                        ref="tabaData"
                        v-model="model.iamUserEduEntitys"
                        :class="$style.deptPlanChild"
                        label="教育信息"
                        :read-only="!editable"
                        :fields="Array.from(fields.iamUserEduEntitys.attr.dync)"
                        :columns="eduChildColumns"
                        @change="changeNum"
                      >
                        <!-- input-form 表示这部分是子表组件的form插槽 -->
                        <template v-slot:input-form="{ model }">
                          <!-- 学历 -->
                          <sd-form-item name="education" />
                          <!-- 毕业时间 -->
                          <sd-form-item name="graduateTime" />
                          <!-- 毕业院校 -->
                          <sd-form-item name="graduateSchool" />
                          <!-- 专业 -->
                          <sd-form-item name="specialty" />
                          <!-- 教育经历 -->
                          <sd-form-item name="educationExperience" />
                        </template>
                      </xm-child-table>
                    </template>
                  </audit-advanced-group>
                </template> </sd-form-item
            ></td>
          </tr> </table

        ><table
          ><tr
            ><td>
              <audit-advanced-group
                :expand="abilityExpand"
                :expand-str="'abilityExpand'"
                :group-label="'能力信息'"
                @changedClick="changedClick"
              ></audit-advanced-group></td></tr
        ></table>

        <table v-show="abilityExpand">
          <!-- 专兼职 -->
          <!-- <tr>
            <sd-form-item-td name="userJob" />
          </tr> -->
          <!-- 是否审计人员 -->
          <!-- <tr>
            <sd-form-item-td name="whetherAuditors" />
          </tr> -->
          <tr>
            <!-- 是否集团人才库 -->
            <sd-form-item-td
              name="whetherGroupTalent"
              :colspan="3"
              @change="groupTalentChange(model.whetherGroupTalent)"
            />
          </tr>
          <tr v-show="model.whetherGroupTalent === '1'">
            <!-- 审计人才属性 -->
            <sd-form-item-td name="talentAttributes" :colspan="3" component="a-checkbox-group">
            </sd-form-item-td>
          </tr>
          <tr>
            <!-- 是否专职审计人员 -->
            <sd-form-item-td name="whetherAlliedAuditors" :colspan="3" />
          </tr>
          <tr>
            <!-- 是否审计部人员 -->
            <sd-form-item-td name="whetherTalentpoolAuditors" :colspan="3" />
          </tr>
          <!-- <tr>auditSpeciilist
            <sd-form-item-td name="auditSpeciilist"> </sd-form-item-td>
          </tr> -->
          <tr>
            <sd-form-item-td name="competent" :colspan="3" component="a-checkbox-group">
            </sd-form-item-td>
          </tr>
          <tr>
            <sd-form-item-td name="comAttachment" :colspan="3" />
          </tr>
          <tr>
            <sd-form-item-td name="qualification" :colspan="3" component="a-checkbox-group" />
          </tr>
          <tr>
            <sd-form-item-td name="quaAttachment" :colspan="3" />
          </tr>
          <tr>
            <sd-form-item-td name="knowledge" :colspan="3" />
          </tr>
          <tr>
            <sd-form-item-td name="ability" :colspan="3">
              <a-textarea v-model="model.ability" :rows="3" />
            </sd-form-item-td>
          </tr> </table

        ><table>
          <tr
            ><td :colspan="4">
              <sd-form-item name="iamUserProjectEntitys" :label="null">
                <template v-slot:read-and-edit="{ editable }">
                  <audit-advanced-group
                    :expand="projectExpand"
                    :expand-str="'projectExpand'"
                    :group-label="'项目经验'"
                    @changedClick="changedClick"
                  >
                    <template>
                      <sd-child-table
                        ref="tabaDatas"
                        v-model="model.iamUserProjectEntitys"
                        :class="$style.deptPlanChild"
                        label=""
                        :read-only="!editable"
                        :fields="
                          [
                            {
                              caption: '序号',
                              name: 'sortNum',
                              dataType: 'number',
                            },
                          ].concat(Array.from(fields.iamUserProjectEntitys.attr.dync))
                        "
                        :columns="projectChildColumns"
                        :flagpage="true"
                        @change="changeProjectStartEndTime"
                      >
                        <!-- input-form 表示这部分是子表组件的form插槽 -->
                        <template v-slot:form="{ model, fields }">
                          <table :class="$style.xmTable">
                            <tr>
                              <!-- 项目名称 -->
                              <sd-form-item-td name="projectName" />
                              <!-- 项目编号 -->
                              <sd-form-item-td name="projectNo" />
                            </tr>
                            <tr>
                              <!-- 审计机构 -->
                              <sd-form-item-td name="auditOrg" />
                              <!-- 被审计单位 -->
                              <sd-form-item-td name="auditedUnit" />
                            </tr>
                            <tr>
                              <!-- 项目组长 -->
                              <sd-form-item-td name="projectHeadman" />
                              <!-- 人员评分 -->
                              <sd-form-item-td name="peopleRatings" />
                            </tr>

                            <tr>
                              <sd-form-item-td name="auditYear" prop="auditYear">
                                <a-date-picker
                                  v-model="model.auditYear"
                                  mode="year"
                                  picker="YYYY"
                                  format="YYYY"
                                  :allow-clear="false"
                                  placeholder="选择年度"
                                  :input-read-only="true"
                                  :value="year"
                                  :open="endOpen"
                                  @panelChange="yearChange"
                                  @openChange="handleEndOpenChange"
                                ></a-date-picker>
                              </sd-form-item-td>

                              <!-- 本项目担任角色 -->
                              <sd-form-item-td name="projectRole" />
                            </tr>
                            <tr>
                              <!-- 人员考评结果 -->
                              <sd-form-item-td name="ratingsResult" />
                              <!-- 项目开始日期 -->
                              <!-- 项目结束日期 -->
                              <sd-form-item-td
                                label="项目起止日期"
                                :colspan="3"
                                :name="['projectStartTime', 'projectEndTime']"
                                :input-props="[]"
                              />
                            </tr>
                            <tr>
                              <!-- 审计期间开始时间 -->
                              <!-- 审计期间结束时间 -->
                              <sd-form-item-td
                                label="审计期间"
                                :colspan="3"
                                :name="['auditStartTime', 'auditEndTime']"
                                :input-props="[]"
                              />
                            </tr>
                            <tr>
                              <!-- 审计内容 -->
                              <sd-form-item-td name="auditCondition" :colspan="3">
                                <a-textarea v-model="model.auditCondition" :rows="3" />
                              </sd-form-item-td>
                            </tr>
                            <tr>
                              <!-- 维护人员 -->
                              <sd-form-item-td name="creatorName" />
                              <!-- 维护日期 -->
                              <sd-form-item-td name="creationTime" />
                            </tr>
                            <tr>
                              <!-- 附件 -->
                              <sd-form-item-td name="attachment" :colspan="6">
                                <template v-slot:read-and-edit="{ editable }">
                                  <sd-attachment
                                    v-model="model.attachment"
                                    :group-id="JSON.parse(fields.attachment.value).value"
                                    :read-only="!editable"
                                  ></sd-attachment>
                                </template>
                              </sd-form-item-td>
                            </tr>
                          </table>
                        </template>
                      </sd-child-table>
                    </template>
                  </audit-advanced-group>
                </template> </sd-form-item
            ></td>
          </tr>

          <!-- <tr
            ><td :colspan="4">
              <sd-form-item name="iamUserCheckEntitys" :label="null">
                <template v-slot:read-and-edit="{ editable }">
                  <audit-advanced-group
                    :expand="CheckExpand"
                    :expand-str="'CheckExpand'"
                    :group-label="'考评记录'"
                    @changedClick="changedClick"
                  >
                    <template>
                      <sd-child-table
                        ref="tabaData"
                        v-model="model.iamUserCheckEntitys"
                        :class="$style.deptPlanChild"
                        label="考评记录"
                        :read-only="!editable"
                        :fields="
                          [
                            {
                              caption: '序号',
                              name: 'sortNum',
                              dataType: 'number',
                            },
                          ].concat(Array.from(fields.iamUserCheckEntitys.attr.dync))
                        "
                        :columns="checkChildColumns"
                        :flagpage="true"
                        @change="changeNum"
                      >

                        <template v-slot:form="{ model }">
                          <table :class="$style.xmTable">
                            <tr>
                              <td style="width:15%"></td>
                            </tr>
                            <tr>

                              <sd-form-item-td name="checkName" :input-td-attrs="{ colspan: 3 }" />
                            </tr>
                            <tr>

                              <sd-form-item-td name="checkResult" :colspan="3">
                                <a-textarea v-model="model.checkResult" :rows="3" />
                              </sd-form-item-td>
                            </tr>
                            <tr>

                              <sd-form-item-td name="attachment" :colspan="3" />
                            </tr>
                            <tr>

                              <sd-form-item-td name="creatorName" />

                              <sd-form-item-td name="creationTime" />
                            </tr>
                          </table>
                        </template>
                      </sd-child-table>
                    </template>
                  </audit-advanced-group>
                </template> </sd-form-item
            ></td>
          </tr> -->
        </table>
      </template>
      <span slot="AppointmentTime" slot-scope="appointmentTime">
        {{ appointmentTime | sdDateFormat('YYYY-MM-DD HH:mm') }}
      </span>
    </sd-detail-form>
  </audit-form-top-banner>
</template>

<script>
import moment from 'moment'
import axios from '@/common/services/axios-instance'
import { Message } from 'ant-design-vue'
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import sdDateFormat from '@/common/filters/sd-date-format'
import auditFormTopBanner from '../../../components/audit-form-top-banner'
import auditAdvancedGroup from '../../../components/audit-advanced-group.vue'
import auditAdvancedGroupMixins from '../../../components/audit-advanced-group-mixins'
import components from './_import-components/iam-audit-userbase-form-import'

export default {
  name: 'IamAuditUserbaseForm',
  metaInfo: {
    title: '审计人员',
  },
  components: {
    ...components,
    auditAdvancedGroup,
    auditFormTopBanner,
  },
  mixins: [auditAdvancedGroupMixins],
  props: {
    defaultTime: {
      type: [Date, String],
      default: null,
    },
  },
  data() {
    return {
      endOpen: false,
      year: null,
      readOnly: false,
      mode: null,
      basicExpand: true,
      eduExpand: true,
      abilityExpand: true,
      projectExpand: true,
      CheckExpand: true,
      eduChildColumns: [
        {
          title: '序号',
          dataIndex: 'eduOrder',
          width: '80px',
          customRender: (text, record, index) => `${index + 1}`,
        },
        { dataIndex: 'education', sdHidden: false },
        { dataIndex: 'graduateTime', sdHidden: false },
        { dataIndex: 'graduateSchool', sdHidden: false },
        { dataIndex: 'specialty', sdHidden: false },
        { dataIndex: 'educationExperience', sdHidden: false },
      ],
      projectChildColumns: [
        {
          title: '序号',
          dataIndex: 'sortNum',
          width: '80px',
          customRender: (text, record, index) => `${index + 1}`,
        },
        { dataIndex: 'projectName', sdHidden: false, width: '150px' },
        { dataIndex: 'projectNo', sdHidden: false, width: '150px' },
        { dataIndex: 'auditOrg', sdHidden: false, width: '180px' },
        { dataIndex: 'projectHeadman', sdHidden: false, width: '120px' },
        { dataIndex: 'peopleRatings', sdHidden: false, width: '120px' },
        {
          dataIndex: 'auditYear',
          sdHidden: false,
          width: '120px',
          customRender: (text, record, index) => {
            var auditYear = sdDateFormat(record.auditYear, 'yyyy')
            return auditYear
          },
        },
        { dataIndex: 'projectRole', sdHidden: false, width: '120px' },
        { dataIndex: 'ratingsResult', sdHidden: false, width: '120px' },
        {
          dataIndex: 'projectStartEndTime',
          sdHidden: true,
          customRender: (text, record, index) => {
            var startTime = sdDateFormat(record.projectStartTime, 'yyyy-MM-DD')
            var endTime = sdDateFormat(record.projectEndTime, 'yyyy-MM-DD')
            return startTime + '~' + endTime
          },
        },
        { dataIndex: 'auditedUnit', sdHidden: true },
        { dataIndex: 'projectStartTime', sdHidden: true },
        { dataIndex: 'projectEndTime', sdHidden: true },
        { dataIndex: 'auditStartTime', sdHidden: true },
        { dataIndex: 'auditEndTime', sdHidden: true, title: '审计结束日期', width: '150px' },
        { dataIndex: 'auditCondition', sdHidden: true, width: '15%' },
        { dataIndex: 'creatorName', sdHidden: true },
        { dataIndex: 'creationTime', sdHidden: true },
        { dataIndex: 'attachment', sdHidden: true },
      ],
      // checkChildColumns: [
      //   {
      //     title: '序号',
      //     dataIndex: 'sortNum',
      //     width: '80px',
      //     customRender: (text, record, index) => `${index + 1}`,
      //   },
      //   { dataIndex: 'creatorName', sdHidden: true },
      //   { dataIndex: 'creationTime', sdHidden: true },
      // ],
    }
  },
  created() {
    this.mode = this.$route.query.mode
  },
  methods: {
    moment,

    // 页面加载完成后
    sdFormReady() {
      debugger
      if (this.mode === 'VIEW') {
        this.readOnly = true
      } else {
        this.mode = this.$refs.iamUserBaseDetail.formData.mode
        setTimeout(() => {
          this.setParentId()
        }, 500)
      }
    },
    initDataFormat(val) {
      var year = val._i
      return year
    },
    userMoundChange(val) {
      // debugger
      const userLeaveTime = this.$refs.iamUserBaseDetail.formData?.pageFormData.pageFieldInfos.find(
        (field) => {
          return field.name === 'userLeaveTime'
        }
      )
      const userLeaveReason = this.$refs.iamUserBaseDetail.formData?.pageFormData.pageFieldInfos.find(
        (field) => {
          return field.name === 'userLeaveReason'
        }
      )
      if (val === '02') {
        userLeaveTime.required = true
        userLeaveReason.required = true
      } else {
        userLeaveTime.required = false
        userLeaveReason.required = false
        this.$refs.iamUserBaseDetail.setFieldValue('userLeaveTime', null)
        this.$refs.iamUserBaseDetail.setFieldValue('userLeaveReason', null)
      }
    },
    groupTalentChange(val) {
      const talentAttributes = this.$refs.iamUserBaseDetail.formData?.pageFormData.pageFieldInfos.find(
        (field) => {
          return field.name === 'talentAttributes'
        }
      )

      if (val === '1') {
        talentAttributes.required = true
      } else {
        talentAttributes.required = false
        this.$refs.iamUserBaseDetail.setFieldValue('talentAttributes', null)
      }
    },

    // 序号赋值
    changeNum(data) {
      data.forEach((item, index) => {
        item.sortNum = index + 1
      })
    },
    // 项目起止日期赋值
    changeProjectStartEndTime(data) {
      data.forEach((item, index) => {
        item.sortNum = index + 1
        var startTime = sdDateFormat(item.projectStartTime, 'yyyy-MM-DD')
        var endTime = sdDateFormat(item.projectEndTime, 'yyyy-MM-DD')
        item.projectStartEndTime = startTime + '~' + endTime
      })
    },

    setParentId() {
      var parentId = this.$route.query.parentId
      if (parentId) {
        this.$refs.iamUserBaseDetail.setFieldValue('parentId', parentId)
      }
    },
    // 保存
    saveForm() {
      this.$refs.iamUserBaseDetail.saveBtnClick()
    },
    close(flag) {
      crossWindowWatcher.notifyChange(this.$route.fullPath, flag)
      window.close()
    },
    baseUser(e) {
      var account = e[0].code
      this.$refs.iamUserBaseDetail.setFieldValue('userCode', account)
      var data = []
      if (account) {
        axios({
          url: 'api/xcoa-mobile/v1/iamuserbase/group/by-account?account=' + account,
          method: 'get',
        }).then((res) => {
          data = res.data
          if (res.status === 200) {
            axios({
              url: 'api/xcoa-mobile/v1/iam-common/common/user?account=' + account,
              method: 'get',
            }).then((res) => {
              if (res.status === 200) {
                var user = res.data
                data[0].name = user.fullpath
                this.$refs.iamUserBaseDetail.setFieldValue('baseDeptMember', data)
                this.$refs.iamUserBaseDetail.setFieldValue('orgName', data[0].name)
              }
            })
            // var data = res.data
            // this.$refs.iamUserBaseDetail.setFieldValue('baseDeptMember', data)
          }
        })
      }
    },
    SJRYKSave(model) {
      Message.success('保存成功', 1).then((res) => {
        this.close(true)
      })
    },
    yearChange(value) {
      debugger
      var year = value.format('YYYY')
      this.$refs.tabaDatas.$refs.form.setFieldValue('auditYear', year)
      if (document.getElementsByClassName('ant-calendar-picker-container').length > 0) {
        document.getElementsByClassName('ant-calendar-picker-container')[0].style.display = 'none'
      }
    },
    handleEndOpenChange(open) {
      this.endOpen = open
    },
  },
}
</script>

<style module lang="scss">
@import '@/webflow/sd-flow-form.scss';
.ant-card-body {
  padding: 12px;

  :global(.buttons_sd-detail-form_common) {
    :global(.ant-form-item-control-wrapper) {
      padding-top: 4%;
      padding-left: 24%;
    }
  }

  .tr_border {
    box-sizing: border-box;
    border-right: 1px solid #e8e8e8;
    border-left: 1px solid #e8e8e8;
  }

  :global(.title_sd-detail-form_common) {
    font-size: 1.5em;
    text-align: center;
  }
}
.xm-table {
  :global(td.ant-form-item-label) {
    width: 15%;
  }
  :global(td.ant-form-item-control-wrapper) {
    width: 35%;
  }
}
</style>