diantou/src_product/iam/audit/riskLibrary/audit-issued-form.vue

<template>
  <sd-webflow
    ref="docform"
    :key="key"
    :validate-form="validForm"
    :removed-tabs="['sdRelatedDoc']"
    @actionBtnClick="actionBtnClick"
  >
    <template v-slot:form="{ model, fields, FlowData }">
      <!-- 初始化模型基础信息 -->
      <table v-if="isInitData || initData(model, fields, FlowData)">
        <tr>
          <td colspan="4" style="border:none">
            <audit-advanced-group
              :expand="auditBaseGroup"
              :expand-str="'auditBaseGroup'"
              :group-label="'风险审计信息'"
              @changedClick="changedClick"
            />
          </td>
        </tr>
        <template v-if="auditBaseGroup">
          <tr v-for="(item, i) in baseFormData" :key="i">
            <template v-for="(child, j) in item">
              <!-- 是关注类并且是 -->
              <sd-form-item-td
                v-if="!(isFocus && child.name === '整改说明')"
                :key="j"
                :name="child.key"
                :label="child.name"
                :input-props="{ disabled: true }"
                :colspan="child?.col || 1"
              />
            </template>
          </tr>
        </template>
      </table>

      <div v-if="auditBaseGroup" :class="$style.onlydiv">
        <!--todo 模型逻辑 -->
        <p :class="$style.modelIdea">模型逻辑:</p>
        <SdQuillEditor ref="quillEdit" v-model="model.configIdea" :options="editorOption" />
        <div :class="$style.noselect"></div>
      </div>

      <!-- 线索信息 -->
      <table>
        <tr>
          <td colspan="4" style="border:none">
            <audit-advanced-group
              :expand="auidtInfoGroup"
              :expand-str="'auidtInfoGroup'"
              :group-label="'审计线索信息'"
              @changedClick="changedClick"
            />
          </td>
        </tr>
      </table>

      <div v-if="auidtInfoGroup" :class="$style.onlydiv">
        <sd-table
          :columns="columnsDetail"
          :data-source="dataDetail"
          :row-key="(_, index) => index"
          :loading="loading"
          :scroll="{ x: 1150 }"
        >
        </sd-table>
      </div>

      <!-- 整改人能看到的模块 -->
      <template v-if="logInfo === 1 && !isFocus">
        <!-- 判定问题 -->
        <table>
          <tr>
            <td colspan="4" style="border:none">
              <audit-advanced-group
                :expand="auditJudgeGroup"
                :expand-str="'auditJudgeGroup'"
                :group-label="'判定问题'"
                @changedClick="changedClick"
              />
            </td>
          </tr>
          <template v-if="auditJudgeGroup">
            <tr>
              <sd-form-item-td :name="'questionFlag'" :label="'是否为问题'">
                <a-select v-model="questionFormData.questionFlag" placeholder="请选择问题判定">
                  <a-select-option :value="1">是</a-select-option>
                  <a-select-option :value="0">否</a-select-option>
                </a-select>
              </sd-form-item-td>
              <sd-form-item-td
                v-if="questionFormData.questionFlag === 0"
                :name="'nonQuestionTag'"
                :label="'非问题标签'"
              >
                <a-select
                  v-model="questionFormData.questionId"
                  placeholder="请选择非问题标签"
                  @change="questionChange"
                >
                  <a-select-option
                    v-for="(item, index) in nonQuestionList"
                    :key="item.id"
                    :value="item.id"
                    >{{ item.name }}</a-select-option
                  >
                </a-select>
              </sd-form-item-td>
            </tr>
            <tr v-if="questionFormData.questionFlag === 0">
              <sd-form-item-td :colspan="3" name="nonQuestionDesc">
                <a-textarea
                  v-model="questionFormData.nonQuestionDesc"
                  placeholder="请填写非问题说明"
                  :rows="3"
                  :disabled="isDescStatus"
                />
              </sd-form-item-td>
            </tr>
          </template>
        </table>

        <!-- 说明 -->
        <table v-if="!isFocus">
          <tr>
            <td colspan="4" style="border:none">
              <audit-advanced-group
                :expand="auditDescGroup"
                :expand-str="'auditDescGroup'"
                :group-label="'说明'"
                @changedClick="changedClick"
              />
            </td>
          </tr>
          <template v-if="auditDescGroup">
            <tr>
              <sd-form-item-td :colspan="3" name="reformDesc">
                <a-textarea
                  v-model="model.reformDesc"
                  placeholder="请填写整改说明"
                  :rows="3"
                  :disabled="logInfo !== 1"
                />
              </sd-form-item-td>
            </tr>
          </template>
        </table>

        <!-- 附件 -->
        <table v-if="!isFocus">
          <tr>
            <td :colspan="3" style="border:none">
              <audit-advanced-group
                :expand="auditAttachmentGroup"
                :expand-str="'auditAttachmentGroup'"
                :group-label="'附件'"
                @changedClick="changedClick"
              />
            </td>
          </tr>
        </table>

        <template v-if="auditAttachmentGroup">
          <div :class="$style.onlydiv">
            <div :class="[$style.upload]">
              <a-upload-dragger
                :class="$style.uploadData"
                name="RectificationFile"
                :file-list="fileListTemp"
                :accept="actualAccept"
                :multiple="true"
                :custom-request="(file) => customRequest(file, 0)"
                @change="handleChange"
              >
                <p class="ant-upload-drag-icon"><a-icon type="inbox"/></p>
                <p class="ant-upload-text">请上传整改附件</p>
              </a-upload-dragger>
              <div :class="$style.uploadList">
                <li v-for="(item, i) in fileList" :key="i">
                  <span>{{ item.name }}</span>
                  <!-- 删除 -->
                  <a-icon type="delete" style="cursor: pointer;" @click="deleteFile(i)" />
                </li>
              </div>
            </div>
          </div>
        </template>
      </template>
      <!--审计线索明细  -->
      <template v-if="logInfo > 1 && !isFocus">
        <table>
          <tr>
            <td :colspan="4" style="border:none">
              <audit-advanced-group
                :expand="auditXsGroup"
                :expand-str="'auditXsGroup'"
                :group-label="'审计线索明细'"
                @changedClick="changedClick"
              />
            </td>
          </tr>
          <template v-if="auditXsGroup">
            <tr>
              <sd-form-item-td
                v-if="logInfo > 1"
                :colspan="logInfo === 2 && 3"
                :name="'viewAccount'"
                :label="'整改人'"
                :input-props="{ disabled: true }"
              >
              </sd-form-item-td>
              <sd-form-item-td
                v-if="logInfo > 2"
                :input-props="{ disabled: true }"
                :name="'reviewer'"
                :label="'初审人'"
              >
              </sd-form-item-td>
            </tr>
            <!-- 非问题标签 非问题说明， 说明 附件 问题性质 -->
            <!-- 是否是问题 -->
            <tr>
              <sd-form-item-td :colspan="3" :name="'questionFlag'" :label="'是否为问题'">
                <!-- @slot read -->
                <template slot="read-and-edit">
                  <!-- <a-select v-model="questionFormData.questionFlag" placeholder="请选择问题判定" :>
                    <a-select-option :value="1">是</a-select-option>
                    <a-select-option :value="0">否</a-select-option>
                  </a-select> -->
                  <span>{{ questionFormData.questionFlag === 0 ? '否' : '是' }}</span>
                </template>
              </sd-form-item-td>
            </tr>
            <!-- 非问题标签 -->
            <tr v-if="questionFormData.questionFlag === 0">
              <sd-form-item-td :colspan="3" :name="'nonQuestionTag'" :label="'非问题标签'">
                <a-select
                  v-model="questionFormData.questionId"
                  placeholder="请选择非问题标签"
                  :disabled="true"
                  @change="questionChange"
                >
                  <a-select-option
                    v-for="(item, index) in nonQuestionList"
                    :key="item.id"
                    :value="item.id"
                    >{{ item.name }}</a-select-option
                  >
                </a-select>
              </sd-form-item-td>
            </tr>
            <tr v-if="questionFormData.questionFlag === 0">
              <sd-form-item-td :name="'nonQuestionDesc'" :label="'非问题说明'" :colspan="3">
                <a-textarea v-model="model.nonQuestionDesc" :rows="3" :disabled="true" />
              </sd-form-item-td>
            </tr>
            <tr>
              <sd-form-item-td :colspan="3" :name="'reformDesc'" :label="'说明'">
                <a-textarea v-model="model.reformDesc" :rows="3" :disabled="true" />
              </sd-form-item-td>
            </tr>
            <!-- 附件 -->
            <tr>
              <sd-form-item-td :colspan="3" name="attachment" :label="'附件'">
                <template slot="read-and-edit">
                  <template v-if="fileList.length > 0">
                    <a
                      v-for="(item, i) in fileList"
                      :key="i"
                      :class="$style.aclick"
                      @click="exportClick(model, i)"
                      >{{ item.name }}</a
                    >
                  </template>
                  <template v-else>
                    <span>暂未上传附件</span>
                  </template>
                </template>
              </sd-form-item-td>
            </tr>
            <!-- 问题性质 -->
            <tr v-if="logInfo === 2">
              <sd-form-item-td :colspan="3" :name="'questionNature'" :label="'问题性质'">
                <a-select v-model="model.questionNature" placeholder="请选择问题性质">
                  <a-select-option v-for="(item, i) in questionOption" :key="i" :value="item">{{
                    item
                  }}</a-select-option>
                </a-select>
              </sd-form-item-td>
            </tr>
            <tr v-else>
              <!-- 只读问题性质 -->
              <sd-form-item-td
                :colspan="3"
                :name="'questionNature'"
                :label="'问题性质'"
                :input-props="{ disabled: true }"
              />
            </tr>
          </template>
        </table>
      </template>
    </template>
  </sd-webflow>
</template>

<script>
import components from './_import-components/audit-issued-form-import'
import { message } from 'ant-design-vue'
import auditAdvancedGroup from '../../components/audit-advanced-group.vue'
import auditAdvancedGroupMixins from '../../components/audit-advanced-group-mixins'
import download from '@/common/services/download'
import { sdLocalStorage } from '@/common/services/storage-service'
import axios from '@/common/services/axios-instance'
import SdQuillEditor from '@/common/components/sd-quill-editor.vue'
import moment from 'moment'
import AuditRiskbraryService from './riskLibrary'
import { getUserInfo } from '@/common/store-mixin'
const xzList = [
  '有业务无制度',
  '有制度难执行',
  '制度太宽泛缺乏操作细则',
  '制度过时不具备可操作性',
  '制度脱离实际难落地实施',
  '有制度未遵循',
  '特殊事项已经线下审批',
  '事项紧急重目标轻合规',
  '制度理解存在人为偏差',
  '工作疏忽未按制度行事',
  '人为规避制度管控要求',
]
const baseData = [
  [
    {
      name: '业务编码',
      key: 'businessCode',
    },
    {
      name: '模型编码',
      key: 'batchCode',
    },
  ],
  [
    {
      name: '模型类型',
      key: 'modelTypeName',
    },
    {
      name: '模型名称',
      key: 'batchName',
    },
  ],
  [
    // todo 字段需要确认
    {
      name: '业务领域',
      key: 'modelDomainName',
    },
    {
      name: '业务阶段',
      key: 'modelPhaseName',
    },
  ],
  [
    {
      name: '单位',
      key: 'unit',
    },
    {
      name: '二级单位',
      key: 'secondUnit',
    },
  ],
  [
    {
      name: '问题推送时间',
      key: 'pushDate',
    },
    {
      name: '整改截至日期',
      key: 'reformDeadline',
    },
  ],
  [
    {
      name: '关注风险',
      key: 'risk',
      col: 3,
    },
  ],
  [
    {
      name: '整改说明',
      key: 'modelReformDesc',
      col: 3,
    },
  ],
]
export default {
  name: 'AuditIssuedForm',
  metaInfo: {
    title: 'AuditIssuedForm',
  },
  components: {
    auditAdvancedGroup,
    SdQuillEditor,
    ...components,
  },
  mixins: [auditAdvancedGroupMixins],
  data() {
    return {
      // 流程 key
      key: 0,
      // 控制流程模块展开
      auditBaseGroup: false,
      // 审计线索信息
      auidtInfoGroup: false,
      // 判定问题
      auditJudgeGroup: false,
      // 说明
      auditDescGroup: false,
      // 附件
      auditAttachmentGroup: false,
      // 审计线索明细
      auditXsGroup: false,
      baseFormData: baseData,
      // 问题性质
      questionOption: xzList,
      infoSearchData: {},
      // 是否是整改人
      logInfo: 0,
      // 问题判定
      questionFormData: {
        questionFlag: 0,
        nonQuestionDesc: null,
        questionId: null,
        nonQuestionTag: null,
      },
      isDescStatus: false,
      nonQuestionList: [],
      // 初始化 上传附件部分
      flagIs: true,
      fileList: [],
      fileListTemp: [],
      attachments: [],
      editorOption: {
        // 只读
        readOnly: true,
        editable: false,
        modules: {
          toolbar: {
            container: [
              ['bold', 'italic', 'underline', 'strike'], // toggled buttons
              ['blockquote', 'code-block'],
              [{ header: 1 }, { header: 2 }], // custom button values
              [{ list: 'ordered' }, { list: 'bullet' }],
              [{ script: 'sub' }, { script: 'super' }], // superscript/subscript
              [{ indent: '-1' }, { indent: '+1' }], // outdent/indent
              [{ direction: 'rtl' }], // text direction
              [{ size: ['small', false, 'large', 'huge'] }], // custom dropdown
              [{ header: [1, 2, 3, 4, 5, 6, false] }],
              [{ color: [] }, { background: [] }], // dropdown with defaults from theme
              [{ font: [] }],
              [{ align: [] }],
              ['clean'], // remove formatting button
              ['link', 'image'], // link and image, video
            ],
          },
        },
      },
      columnsDetail: [],
      dataDetail: [],
      loading: false,

      // 表单数据
      isInitData: false,
      webFlowData: {},
      // 是否只查看
      isWebFlow: false,
      lockId: 0,
      // 是否是关注类
      isFocus: false,
    }
  },
  computed: {
    actualAccept() {
      // 优先使用前端配置的类型限制，如未配置，则使用后端支持的类型
      return (
        this.accept || JSON.parse(sdLocalStorage.getItem('commonConfig') || '{}').attachType || ''
      )
    },
  },
  watch: {
    fileList: {
      handler(val) {
        this.fileListTemp = val.map((item) => {
          return {
            name: item.name,
            url: item.url,
          }
        })
      },
      immediate: true,
    },
    'questionFormData.questionFlag': {
      handler(val) {
        if (val === 0) {
          this.questionFormData.questionId = null
          this.questionFormData.nonQuestionDesc = null
          this.questionFormData.nonQuestionTag = null
        }
      },
    },
    isInitData: {
      handler: function(val) {
        this.$nextTick(() => {
          this.setInitData()
        })
      },
    },
  },
  mounted() {
    axios({ url: 'api/xcoa-mobile/v1/problem-statement/all', method: 'get' }).then((res) => {
      res.data.length ? (this.nonQuestionList = res.data) : (this.nonQuestionList = [])
    })
  },
  methods: {
    // 表单验证
    validForm(e) {
      return Promise.resolve(true)
    },
    actionBtnClick(evt, { button, FlowData }) {
      const { model } = FlowData
      if (button.buttonId === 'G_1_FXWTSJ.4') {
      }

      // 根据
      if (button.fakeId === 'save' || button.fakeId === 'workflow-push') {
        // 保存前先校验计划是否已经存在
        evt.waitUntil(
          new Promise((resolve, reject) => {
            this.saveForm(button.buttonId).then((res) => {
              if (!res) {
                evt.preventDefault()
              }
              resolve()
            })
          })
        )
      }
    },
    saveForm() {
      return new Promise((resolve) => {
        // 如果没有则提示请选择问题类型
        const { questionFlag, questionId, nonQuestionDesc } = this.questionFormData
        if (questionFlag !== 0 && questionFlag !== 1 && this.logInfo === 1) {
          message.warning('请选择问题类型')
          resolve(false)
          return
        }
        // 校验非问题类型参数
        if (questionFlag === 0 && this.logInfo === 1) {
          if (!questionId) {
            message.warning('请选择非问题标签')
            resolve(false)
            return
          }
          if (!nonQuestionDesc) {
            message.warning('请填写非问题说明')
            resolve(false)
            return
          }
        }
        // 如果是处于第一阶段则需要选择问题性质
        if (this.logInfo === 2) {
          // 判断问题性质是否已经选择
          const questionNature = this.$refs.docform.getFieldValue('questionNature')
          if (!questionNature) {
            message.warning('请选择问题性质')
            resolve(false)
            return
          }
        }
        Object.keys(this.questionFormData).map((val) => {
          this.$refs.docform.setFieldValue(val, this.questionFormData[val])
        })
        // 校验说明是否有值
        // 获取reformDesc
        const reformDesc = this.$refs.docform.getFieldValue('reformDesc')
        if (!reformDesc) {
          message.warning('请填写整改说明')
          resolve(false)
          return
        }
        resolve(true)
      })
    },
    // 初始化基础信息
    initData(model, fields, FlowData) {
      this.isInitData = true
      this.webFlowData = {
        model,
        fields,
        FlowData,
      }
      return true
    },
    setInitData() {
      const { model, fields, FlowData } = this.webFlowData
      this.lockId = FlowData.lockId
      // 如果整改人是自己则可以上传
      // 显示信息
      // todo修改流程后更改
      // 2整改 3初审 4复审
      // http://10.104.32.30/api/framework/v1/task-form-process/inst-logs-process/17733

      // 给整改人G_1_FXWTSJ.7 viewAccount reformDate，初审人G_1_FXWTSJ.2 checker checkDate，复审人G_1_FXWTSJ.4 reviewer reviewDate
      // 现在的阶段
      const isFlag = FlowData.processActiveLogInfo[0]
      this.logInfo =
        isFlag?.stepId === 'G_1_FXWTSJ.7' ? 1 : isFlag?.stepId === 'G_1_FXWTSJ.2' ? 2 : 3
      // 根据阶段给不同的值赋值
      const filedName =
        isFlag?.stepId === 'G_1_FXWTSJ.7'
          ? 'viewAccount'
          : isFlag?.stepId === 'G_1_FXWTSJ.2'
          ? 'reviewer'
          : 'checker'
      this.$refs.docform.setFieldValue(filedName, getUserInfo().name)
      const filedDate =
        isFlag?.stepId === 'G_1_FXWTSJ.7'
          ? 'reformDate'
          : isFlag?.stepId === 'G_1_FXWTSJ.2'
          ? 'reviewDate'
          : 'checkDate'
      const strTime = moment().format('YYYY-MM-DD')

      this.$refs.docform.setFieldValue(filedDate, strTime)

      // 是否只查看
      this.isWebFlow = FlowData.mode !== 'EDIT'
      this.questionFormData.nonQuestionDesc = model.nonQuestionDesc // 将值赋值给问题
      this.questionFormData.nonQuestionTag = model.nonQuestionTag
      this.questionFormData.questionFlag = model.questionFlag
      this.questionFormData.questionId = model.questionId
      const attachmentList = (model.attachment || '').split(',')
      const fileNameList = (model.fileName || '').split(',')
      this.fileList = []
      if (model.attachment) {
        for (let i = 0; i < attachmentList.length; i++) {
          this.fileList.push({
            name: fileNameList[i],
            url: attachmentList[i],
          })
        }
      }

      // 初始化线索信息

      // 获取模型信息
      const data = { id: model.modelId + '' }
      AuditRiskbraryService.getIamModelMaintain(data).then((val) => {
        // this.$refs.docform.setFieldValue('modelType', val.modelType)
        const datas = {}
        val.data.pageFormData.pageFieldInfos.map((val) => {
          datas[val.name] = val.value
        })
        // 模型类型
        // isFocus
        this.$nextTick(() => {
          this.$refs.docform.setFieldValue('modelTypeName', datas.modelTypeName)
          this.$refs.docform.setFieldValue('batchName', datas.modelName)
          // 模型编码
          this.$refs.docform.setFieldValue('batchCode', datas.modelCode)
          this.$refs.docform.setFieldValue('modelDomainName', datas.modelDomainName)
          this.$refs.docform.setFieldValue('modelPhaseName', datas.modelPhaseName)
          this.$refs.docform.setFieldValue('modelReformDesc', datas.reformDesc)
          // modelTypeName
          this.isFocus = datas.modelTypeName.includes('关注类')
        })
      })
      this.getRiskDetail()
      this.auditBaseGroup = true
      this.auidtInfoGroup = true
      this.auditJudgeGroup = true
      this.auditDescGroup = true
      this.auditAttachmentGroup = true
      this.auditXsGroup = true
    },

    // 非问题处理
    questionChange(val) {
      const onDesc = this.nonQuestionList.find((item) => item.id === val)
      const { description, name } = onDesc
      this.questionFormData.nonQuestionDesc = description
      this.questionFormData.nonQuestionTag = name
      // 如果详情为空或者null则 isDescStatus ==false
      if (description === '' || description === null) {
        this.isDescStatus = false
      } else {
        this.isDescStatus = true
      }
    },
    // 附件上传
    // 附件自定义上传
    customRequest(data, catnum = 0, item) {
      if (data.file.size === 0) {
        message.warn(`不能上传大小为0的文件`)
        return
      }
      const file = {
        FileName: data.file.name,
        Completed: 0,
        CatNum: catnum,
      }
      const userInfo = getUserInfo()
      this.attachments = [...this.attachments]
      const strTime = moment().format('YYYY-MM-DD HH:mm:ss')
      const formData = new FormData()
      formData.append('file', data.file)
      formData.append('FileName', data.file.name)
      formData.append('lockId', this.lockId)
      formData.append('groupId', this.groupId)
      formData.append(
        'querystring',
        `<file_unid></file_unid><file_name>${data.file.name}</file_name><file_size>${data.file.size}</file_size><completed>1</completed><file_create>${strTime}</file_create><file_update>${strTime}</file_update><file_editmodel>0</file_editmodel><file_lockuser>0</file_lockuser><CreateInfo>${userInfo?.account} ${strTime}</CreateInfo><filetype></filetype><user_name>${userInfo?.account}</user_name><UpdateInfo>${userInfo?.account}于${strTime}创建.</UpdateInfo><TaodaInfo></TaodaInfo><CatNum>${catnum}</CatNum><Ext></Ext>`
      )
      const url = 'api/xcoa-mobile/v1/iam-attachment-extend/attachments-upload/indi'
      axios
        .post(url, formData, {
          headers: {
            'Content-Type': 'multipart/form-data',
          },
        })
        .then((_) => {
          if (_.data.startsWith('false')) {
            message.error(`${data.file.name} 上传失败`)
          } else {
            this.fileList.push({
              name: data.file.name,
              url: _.data,
            })

            const attachment = this.fileList.map((item) => item.url).join(',')
            const nameList = this.fileList.map((item) => item.name).join(',')

            this.$refs.docform.setFieldValue('attachment', attachment)
            this.$refs.docform.setFieldValue('fileName', nameList)

            data.onSuccess(_, data.file)
          }
        })
        .catch((e) => {
          message.error(`${data.file.name} 上传失败`)
          throw e
        })
    },
    // 附件上传
    handleChange(info) {
      const status = info.file.status

      if (status === 'done') {
        message.success(`${info.file.name} 上传成功.`)
      } else if (status === 'error') {
        message.error(`${info.file.name} 上传失败.`)
      }
    },
    // <!-- 删除已上传附件 -->
    deleteFile(index) {
      this.fileList.splice(index, 1)
      const attachment = this.fileList.map((item) => item.url).join(',')
      const nameList = this.fileList.map((item) => item.name).join(',')
      this.$refs.docform.setFieldValue('attachment', attachment)
      this.$refs.docform.setFieldValue('fileName', nameList)
    },
    // 下载附件
    exportClick(row, i) {
      const attachmentList = row.attachment.split(',')
      const fileNameList = row.fileName.split(',')
      const spliceIndex = attachmentList[i].lastIndexOf('|')
      const destStep = attachmentList[i].substring(spliceIndex + 1, attachmentList[i].length)
      download(
        'api/framework/v1/task-form-process/download-attachments/' + destStep,
        fileNameList[i]
      )
    },
    // 获取table数据
    getRiskDetail() {
      const { model } = this.webFlowData
      this.loading = true
      this.infoSearchData = {
        modelId: model.modelId,
        detailGroupId: model.detailGroupId,
        jmEventType: model.jmEventType,
        unitCode: model.unitCode,
      }
      AuditRiskbraryService.getDetailInfo(this.infoSearchData)
        .then((res) => {
          const allField = []
          this.columnsDetail = res.data[0].detailArr.map((item) => {
            allField.push(item.commit)
            return {
              title: item.commit,
              dataIndex: item.commit,
              width: item.value === 'null' ? '100px' : '240px',
              ellipsis: true,
            }
          })
          // 过滤事件标签 业务主键  业务时间 buss_key    event_type  	buss_time
          this.columnsDetail = this.columnsDetail.filter((item) => {
            return (
              item.title !== 'buss_key' &&
              item.title !== 'event_type' &&
              item.title !== 'buss_time' &&
              item.title !== '事件标签' &&
              item.title !== '业务主键' &&
              item.title !== '业务时间'
            )
          })
          this.dataDetail = res.data.map((item) => {
            const obj = {}
            allField.forEach((field) => {
              const onfield = item.detailArr.find((i) => i.commit === field).value
              obj[field] = onfield !== 'null' ? onfield : ''
            })
            obj.id = item.questionId
            return obj
          })
        })
        .finally(() => {
          this.loading = false
        })
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.upload {
  display: flex;
  min-width: 800px;
  min-height: 200px;
  .upload-list {
    width: calc(30% - 10px);
    margin-left: 10px;
    li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      height: 30px;
      padding: 0 10px;
      margin-bottom: 10px;
      line-height: 30px;
      border-radius: 4px;
      span {
        display: inline-block;
        width: 80%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
    }
  }
  .upload-data {
    width: 70%;
  }
}
.model-idea {
  // 上下边距
  margin: 10px 0;
}
.onlydiv {
  position: relative;
  width: 90%;
  margin: 0 auto;
  .noselect {
    position: absolute;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
  }
}
.aclick {
  display: block;
}
</style>