zdqy_firm_former/src/views/component/trainingManage/importExcel.vue

<template>
  <div>
    <import-table
      :visible="showImportTable"
      title="导入签到人员"
      @close="() => (showImportTable = false)"
      @action-event="handleImport"
    />
  </div>
</template>

<script>
import IbpsImport from '@/plugins/import'
export default {
  name: 'importData',
  props: {
    params: {
      type: Object,
      default: () => {
        return {}
      }
    },
  },
  components: { ImportTable: () => import('@/business/platform/form/formrender/dynamic-form/components/import-table') },
  data() {
    return {
      showImportTable: true,
      userList: [],
    }
  },
  mounted() {
    this.$common.request('query', {
      key: 'hqsyyhsj',
      params: [null]
    }).then(res => {
      this.userList = res.variables.data
    })
  },
  methods: {  
    async handleImport(file, options) {
        this.loading = false
        IbpsImport.xlsx(file, options).then(async ({ header, results }) => {
          const keys = this.getKeys(this.getColumns())
          const list = []
          results.forEach((item) => {
            const obj = {}
            Object.keys(item).forEach((key) => {
              if (keys[key]) {
                obj[keys[key]] = item[key]
              }
            })
            list.push(obj)
          })
          // const keysValue = Object.values(keys)
          // const isError = list.some((item) => keysValue.some((key) => !item[key]))
          // if (isError || !list.length) {
            // return this.$message.warning(
              // '导出模板中的每一项都需填写，请检查您的数据！'
            // )
          // }
          // const dateRegex = /^(\d{4})[-/](\d{2})(?:[-/](\d{2}))?$/
            // const isDateError = list.some((item) => {
            // return !dateRegex.test(item.qian_dao_shi_jian)
          // })
          // if (isDateError) {
            // return this.$message.warning(
              // '有效期格式支持【2026-01】、【2026/01】、【2026-01-01】、【2026/01/01】，请检查您的数据！'
            // )
          // }

          const userMap = new Map();
          this.userList.forEach(user => {
            const key = `${user.NAME_}|${user.jian_ding_zi_ge_z}`;
            userMap.set(key, user.ID_);
          });

          list.forEach(item => {
            item.qian_dao_shi_jian = item.qian_dao_shi_jian.replace(/\//g, '-')
            item.guan_lian_id_ = this.params.guan_lian_id_
            item.qian_dao_lei_xing = '导入'
            item.ye_wu_biao_ming_ = 't_lhrypxjlb'
            const key = `${item.xingMing}|${item.gongHao}`;
            if (userMap.has(key)) {
              item.ren_yuan_id_ = userMap.get(key); 
            } else {
              item.ren_yuan_id_ = null; 
            }
            delete item.xingMing;
            delete item.gongHao;
          });
          let newList = list.filter((item) => item.ren_yuan_id_)
          let addList = newList.filter(item => !this.params.isSigned.includes(item.ren_yuan_id_))
          const addParams = { 
            tableName: 't_qdxxb',
            paramWhere: addList
          }
          if(addList && addList.length > 0){
            const { variables: { cont } } = await this.$common.request('add', addParams)
            let allIds = [...(this.params.addPeople.split(',')), ...addList.map(item => item.ren_yuan_id_)]
            let uniqueIds = [...new Set(allIds.filter(id => id != null && id !== ''))];
            this.$emit('action-event', 'import', uniqueIds.join(','))
          }
          
          console.log('list', list)
          this.$message.success('导入成功！')
          this.showImportTable = false
        })
      },
      getColumns() {
        return [
          { label: '签到日期', field_name: 'qian_dao_shi_jian', name: 'qian_dao_shi_jian' },
          {
            label: '姓名',
            field_name: 'xingMing',
            name: 'xingMing'
          },
          { label: '工号', field_name: 'gongHao', name: 'gongHao' },
        ]
      },
      getKeys(data) {
        return Array.isArray(data)
          ? data.reduce((acc, item) => ({ ...acc, [item.label]: item.name }), {})
          : {}
      },

  }
}
</script>

<style lang="scss" scoped>
.qrcode-dialog {
  .qrCode {
    display: flex;
    justify-content: center;
    margin: 5% 0;
  }
  .qrCode > img {
    width: 50%;
  }
}
</style>