n20-common-lib 3.3.0 → 3.3.2

package/src/components/v3/ApprovalCard/index.vue

@@ -0,0 +1,634 @@
+<template>
+  <div class="v3-approval-card">
+    <div class="v3-approval-card__timeline">
+      <section
+        v-for="(item, index) in displayApprovalData"
+        :key="getItemKey(item, index)"
+        class="v3-approval-card__item"
+        :class="statusClass(item)"
+      >
+        <span v-if="index < displayApprovalData.length - 1" class="v3-approval-card__track"></span>
+        <span class="v3-approval-card__dot"></span>
+
+        <header class="v3-approval-card__node-header">
+          <div class="v3-approval-card__title-row">
+            <span class="v3-approval-card__title">{{ resultTitle(item) }}</span>
+            <span v-if="isWaiting(item) && getPendingUsers(item).length" class="v3-approval-card__count">
+              · {{ getPendingUsers(item).length }} {{ $lc('人') }}
+            </span>
+          </div>
+          <div v-if="showNodeMeta(item)" class="v3-approval-card__meta">
+            <span v-if="item.endTime">{{ item.endTime }}</span>
+            <span v-if="item.endTime && item.approvalCost" class="v3-approval-card__meta-divider"></span>
+            <span v-if="item.approvalCost" class="v3-approval-card__cost">
+              <i class="el-icon-time"></i>
+              {{ $lc('本节点用时') }} {{ item.approvalCost }}
+            </span>
+          </div>
+        </header>
+
+        <div v-if="isWaiting(item)" class="v3-approval-card__panel v3-approval-card__pending-panel">
+          <div class="v3-approval-card__panel-title">{{ $lc('待审批人') }}</div>
+          <div class="v3-approval-card__pending-users">
+            <div
+              v-for="(user, userIndex) in getPendingUsers(item)"
+              :key="`${getUserName(user)}-${userIndex}`"
+              class="v3-approval-card__pending-user"
+            >
+              <span class="v3-approval-card__avatar">
+                <img v-if="getUserAvatar(user)" :src="getUserAvatar(user)" :alt="getUserName(user)" />
+                <i v-else class="n20-icon-user"></i>
+              </span>
+              <span>{{ getUserName(user) }}</span>
+              <span v-if="userIndex < getPendingUsers(item).length - 1" class="v3-approval-card__separator">、</span>
+            </div>
+          </div>
+        </div>
+
+        <template v-else-if="!isEnd(item)">
+          <div v-if="item.addTaskName" class="v3-approval-card__add-task">
+            <span>{{ $lc('加签审批人：') }}</span>
+            <span class="v3-approval-card__avatar v3-approval-card__avatar--small">
+              <i class="n20-icon-user"></i>
+            </span>
+            <span>{{ item.addTaskName }}</span>
+            <span v-if="item.addTaskTag" class="v3-approval-card__add-task-tag">
+              {{ item.addTaskTag | remarkF(remarkOpt) }}
+            </span>
+          </div>
+
+          <div class="v3-approval-card__panel v3-approval-card__person-panel">
+            <div
+              v-if="getOrganizationText(item) || item.showConnect === '1'"
+              class="v3-approval-card__organization-row"
+            >
+              <span v-title="getOrganizationText(item)" class="v3-approval-card__organization">
+                {{ getOrganizationText(item) }}
+              </span>
+              <button
+                v-if="item.showConnect === '1'"
+                type="button"
+                class="v3-approval-card__link-button"
+                @click="seeDetail(item)"
+              >
+                {{ $lc('查看详情') }}
+              </button>
+            </div>
+            <div v-if="item.assignee" class="v3-approval-card__assignee-pill">
+              <span class="v3-approval-card__avatar">
+                <img v-if="getUserAvatar(item)" :src="getUserAvatar(item)" :alt="item.assignee" />
+                <i v-else class="n20-icon-user"></i>
+              </span>
+              <span class="v3-approval-card__assignee-name">{{ item.assignee }}</span>
+              <span v-if="getTerminalLabel(item)" class="v3-approval-card__terminal"
+                >· {{ getTerminalLabel(item) }}</span
+              >
+            </div>
+            <div v-if="item.ccUserName" class="v3-approval-card__secondary-line">
+              {{ $lc('抄送人：') }}{{ item.ccUserName }}
+            </div>
+            <div
+              v-if="showSuggestionContent(item) && item.suggestion && !item.subProcInitId"
+              class="v3-approval-card__opinion"
+            >
+              <span v-if="item.result !== status.waiting">{{ $lc('审批意见：') }}</span>
+              <span>{{ item.suggestion }}</span>
+            </div>
+          </div>
+
+          <div
+            v-if="showSuggestionContent(item) && item.subProcInitId"
+            class="v3-approval-card__panel v3-approval-card__sub-process"
+          >
+            <button
+              type="button"
+              class="v3-approval-card__sub-process-trigger"
+              @click="seeApproveChild(item.subProcInitId)"
+            >
+              <span>{{ item.suggestion || $lc('查看子流程') }}</span>
+              <i :class="showChildTimeline ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i>
+            </button>
+            <div v-if="showChildTimeline" class="v3-approval-card__child-list">
+              <div
+                v-for="(row, childIndex) in displayApprovalChildrenData"
+                :key="getItemKey(row, childIndex)"
+                class="v3-approval-card__child-item"
+              >
+                <div class="v3-approval-card__child-title-row">
+                  <span :class="['v3-approval-card__child-title', statusClass(row)]">{{ resultTitle(row) }}</span>
+                  <span v-if="row.endTime" class="v3-approval-card__child-time">{{ row.endTime }}</span>
+                </div>
+                <div v-if="getOrganizationText(row)" class="v3-approval-card__organization">
+                  {{ getOrganizationText(row) }}
+                </div>
+                <div v-if="row.assignee" class="v3-approval-card__assignee-pill">
+                  <span class="v3-approval-card__avatar v3-approval-card__avatar--small">
+                    <i class="n20-icon-user"></i>
+                  </span>
+                  <span>{{ row.assignee }}</span>
+                </div>
+                <div v-if="row.ccUserName" class="v3-approval-card__secondary-line">
+                  {{ $lc('抄送人：') }}{{ row.ccUserName }}
+                </div>
+                <div v-if="row.addTaskName" class="v3-approval-card__secondary-line">
+                  {{ $lc('加签审批人：') }}{{ row.addTaskName }}
+                </div>
+                <div v-if="showSuggestionContent(row) && row.suggestion" class="v3-approval-card__opinion">
+                  <span v-if="row.result !== status.waiting">{{ $lc('审批意见：') }}</span>
+                  <span>{{ row.suggestion }}</span>
+                </div>
+                <div
+                  v-if="showSuggestionContent(row) && row.flowHistoryCfgs && row.flowHistoryCfgs.length"
+                  class="v3-approval-card__child-review"
+                >
+                  <div class="v3-approval-card__review-header">
+                    <span>{{ $lc('审查意见') }}</span>
+                    <button
+                      type="button"
+                      class="v3-approval-card__link-button v3-approval-card__collapse-button"
+                      @click="showFlowHistoryChild = !showFlowHistoryChild"
+                    >
+                      <i :class="showFlowHistoryChild ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i>
+                      {{ showFlowHistoryChild ? $lc('收起') : $lc('展开') }}
+                    </button>
+                  </div>
+                  <div v-show="showFlowHistoryChild" class="v3-approval-card__review-content">
+                    <div
+                      v-for="(history, historyIndex) in row.flowHistoryCfgs"
+                      :key="historyIndex"
+                      class="v3-approval-card__review-row"
+                      :class="{ 'is-stacked': align !== 'left-right' }"
+                    >
+                      <span>{{ history.cfgName }}：{{ history.cfgText || history.cfgVal }}</span>
+                      <span v-if="history.cfgRemark">{{ history.cfgRemark }}</span>
+                    </div>
+                  </div>
+                </div>
+                <div v-if="row.flowHisFileList && row.flowHisFileList.length" class="v3-approval-card__child-files">
+                  <button
+                    v-for="(file, fileIndex) in row.flowHisFileList"
+                    :key="`${file.beid || file.fileName}-${fileIndex}`"
+                    type="button"
+                    class="v3-approval-card__child-file"
+                    @click="preview(file)"
+                  >
+                    {{ file.fileName }}
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div
+            v-if="showSuggestionContent(item) && item.flowHistoryCfgs && item.flowHistoryCfgs.length"
+            class="v3-approval-card__panel v3-approval-card__review-panel"
+          >
+            <div class="v3-approval-card__review-header">
+              <span>{{ $lc('审查意见') }}</span>
+              <button
+                type="button"
+                class="v3-approval-card__link-button v3-approval-card__collapse-button"
+                @click="showFlowHistory = !showFlowHistory"
+              >
+                <i :class="showFlowHistory ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"></i>
+                {{ showFlowHistory ? $lc('收起') : $lc('展开') }}
+              </button>
+            </div>
+            <div v-show="showFlowHistory" class="v3-approval-card__review-content">
+              <div
+                v-for="(history, historyIndex) in item.flowHistoryCfgs"
+                :key="historyIndex"
+                class="v3-approval-card__review-row"
+                :class="{ 'is-stacked': align !== 'left-right' }"
+              >
+                <span>{{ history.cfgName }}：{{ history.cfgText || history.cfgVal }}</span>
+                <span v-if="history.cfgRemark">{{ history.cfgRemark }}</span>
+              </div>
+            </div>
+          </div>
+
+          <div
+            v-if="item.flowHisFileList && item.flowHisFileList.length"
+            class="v3-approval-card__panel v3-approval-card__file-panel"
+          >
+            <div class="v3-approval-card__panel-title">{{ $lc('附件') }}</div>
+            <div class="v3-approval-card__file-list">
+              <div
+                v-for="(file, fileIndex) in item.flowHisFileList"
+                :key="`${file.beid || file.fileName}-${fileIndex}`"
+                class="v3-approval-card__file-item"
+              >
+                <div class="v3-approval-card__file-main">
+                  <img class="v3-approval-card__file-icon" :src="getFileIcon(file.fileName)" alt="" />
+                  <span v-title="file.fileName" class="v3-approval-card__file-name">{{ file.fileName }}</span>
+                </div>
+                <div class="v3-approval-card__file-actions">
+                  <span class="v3-approval-card__file-divider"></span>
+                  <button type="button" :title="$lc('预览')" @click="preview(file)">
+                    <i class="el-icon-view"></i>
+                  </button>
+                  <button type="button" :title="$lc('下载')" @click="downFile(file)">
+                    <i class="el-icon-download"></i>
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </template>
+      </section>
+    </div>
+
+    <el-drawer
+      class="v3-approval-card__preview-drawer"
+      custom-class="v3-approval-card__drawer"
+      :visible.sync="visibleP"
+      direction="rtl"
+      size="60%"
+      :append-to-body="true"
+      :wrapper-closable="true"
+      @close="closeSee"
+    >
+      <div slot="title" class="v3-approval-card__drawer-header">
+        <span class="v3-approval-card__drawer-title">{{ $lc('附件预览') }}</span>
+        <el-button v-if="seeRow && seeRow.beid" plain size="mini" @click.stop="downFile(seeRow)">
+          {{ $lc('下载') }}
+        </el-button>
+      </div>
+      <div v-if="visibleP" class="v3-approval-card__drawer-body">
+        <component
+          :is="previewSameOrg ? 'object' : 'div'"
+          :key="previewUrl"
+          :data="previewUrl"
+          class="v3-approval-card__preview-content"
+        >
+          <div class="v3-approval-card__preview-fallback">
+            <i class="el-icon-s-release"></i>
+            <span>
+              {{ $lc('不支持在线预览，请') }}
+              <el-link type="primary" @click="downFile(seeRow)">{{ $lc('下载') }}</el-link>
+              {{ $lc('到本地查看') }}
+            </span>
+          </div>
+        </component>
+      </div>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+import getJsonc from '../../../assets/getJsonc.js'
+import axios from '../../../utils/axios'
+import { $lc } from '../../../utils/i18n/index'
+import { linkPush } from '../../../utils/urlToGo.js'
+import pdfIcon from '../UploadList/assets/37.svg'
+import wordIcon from '../UploadList/assets/46.svg'
+import excelIcon from '../UploadList/assets/60.svg'
+import defaultFileIcon from '../UploadList/assets/not.svg'
+import pngIcon from '../UploadList/assets/Png.svg'
+import txtIcon from '../UploadList/assets/Txt.svg'
+import zipIcon from '../UploadList/assets/Zip.svg'
+
+function getApprovalExtend() {
+  if (typeof window === 'undefined') return {}
+  if (!window._approvalExtend) window._approvalExtend = {}
+  return window._approvalExtend
+}
+
+export default {
+  name: 'ApprovalCardV3',
+  filters: {
+    remarkF(value, list) {
+      const option = (list || []).find((item) => item.code === value)
+      return option ? option.name : value
+    }
+  },
+  props: {
+    apiPrefix: {
+      type: String,
+      default: undefined
+    },
+    close: {
+      type: Boolean,
+      default: false
+    },
+    status: {
+      type: Object,
+      default: () => ({
+        waiting: 0,
+        submit: 1,
+        approval: 2,
+        reject: 3,
+        invalid: 4,
+        end: 5,
+        revocation: 6
+      })
+    },
+    approvalData: {
+      type: Array,
+      default: () => []
+    },
+    procInstId: {
+      type: String,
+      default: undefined
+    },
+    hideLoading: {
+      type: Boolean,
+      default: false
+    },
+    align: {
+      type: String,
+      default: 'left-right'
+    },
+    seeTypes: {
+      type: RegExp,
+      default: () => /\.(jpg|png|gif|svg|pdf|swf|xlsx|xls|docx|doc|txt)$/i
+    }
+  },
+  data() {
+    this.approvalRequestId = 0
+    this.remarkRequest = null
+    return {
+      remoteApprovalData: [],
+      remarkOpt: [],
+      showChildTimeline: false,
+      approvalChildrenData: [],
+      showCtdMsg: getApprovalExtend()['card.countermand.suggestion'] === true,
+      visibleP: false,
+      previewUrl: '',
+      previewSameOrg: false,
+      seeRow: {},
+      showFlowHistory: true,
+      showFlowHistoryChild: true
+    }
+  },
+  computed: {
+    resolvedApprovalData() {
+      return [...(this.approvalData || []), ...this.remoteApprovalData]
+    },
+    displayApprovalData() {
+      // 保持旧版 el-timeline reverse 的展示顺序，但不再修改调用方传入的数组。
+      return [...this.resolvedApprovalData].reverse()
+    },
+    displayApprovalChildrenData() {
+      return [...(this.approvalChildrenData || [])].reverse()
+    }
+  },
+  watch: {
+    procInstId: {
+      immediate: true,
+      handler(value) {
+        this.loadApprovalData(value)
+      }
+    }
+  },
+  beforeDestroy() {
+    this.approvalRequestId += 1
+    this.closeSee()
+  },
+  methods: {
+    async loadApprovalData(procInstId) {
+      const requestId = ++this.approvalRequestId
+      if (!procInstId) {
+        this.remoteApprovalData = []
+        return
+      }
+      // 切换流程实例时先清空旧记录，避免新请求完成前短暂展示上一条流程的数据。
+      this.remoteApprovalData = []
+      try {
+        const data = await this.getProcInstData(procInstId)
+        // 只接收最后一次请求，避免快速切换流程实例时出现旧数据回写。
+        if (requestId === this.approvalRequestId) {
+          this.remoteApprovalData = data
+        }
+      } catch (error) {
+        if (requestId === this.approvalRequestId) {
+          this.remoteApprovalData = []
+        }
+        return error
+      }
+    },
+    async seeDetail(item) {
+      const details = (item && item._details) || {}
+      if (!details.appNo) {
+        this.$message.error($lc('未配置审批详情链接'))
+        return
+      }
+      const { appUrl = {} } = await getJsonc('activiti/server-config.jsonc', null, true)
+      if (!appUrl[details.appNo]) {
+        this.$message.error($lc('未配置审批详情链接'))
+        return
+      }
+      linkPush(`${appUrl[details.appNo]}/${details.typeCode}`, {
+        taskId: details.taskId,
+        typeCode: details.typeCode,
+        processInstanceId: details.procInstId,
+        appNo: details.appNo,
+        businessId: details.businessId
+      })
+    },
+    async seeApproveChild(id) {
+      this.showChildTimeline = !this.showChildTimeline
+      if (!this.showChildTimeline) {
+        this.approvalChildrenData = []
+        return
+      }
+      try {
+        this.approvalChildrenData = await this.getProcInstData(id)
+      } catch (error) {
+        this.approvalChildrenData = []
+        return error
+      }
+    },
+    async getProcInstData(procInstId) {
+      const { data } = await axios.get(
+        `/bems/activiti/sample/Q003?r=${Math.random()}`,
+        { procInstId },
+        { loading: !this.hideLoading }
+      )
+      return (Array.isArray(data) ? data : [])
+        .map((item) => this.normalizeApprovalItem(item))
+        .filter((item) => item.isShow !== '0')
+    },
+    normalizeApprovalItem(item) {
+      const resultNames = String(item.optResult || '').split('-')
+      const rawResultName = resultNames[resultNames.length - 1]
+      const normalizedResultName = rawResultName === $lc('推进') ? $lc('批准') : rawResultName
+      const approvalItem = {
+        approvalCost: item.approvalCost,
+        job: item.job || '',
+        isShow: item.isShow,
+        endTime: item.endTime || '',
+        assignee: item.assignee,
+        assigneeList: item.assigneeList,
+        approvers: item.approvers,
+        suggestion: item.suggestion,
+        roleName: item.roleName,
+        flowHisFileList: item.flowHisFileList || null,
+        ccUserName: item.ccUserName,
+        addTaskName: item.addTaskName,
+        memberName: item.memberName,
+        subProcInitId: item.subProcInitId,
+        appOrPc: item.appOrPc,
+        outTitle: item.outTitle,
+        showConnect: item.showConnect,
+        deptName: item.deptName,
+        addTaskTag: item.addTaskTag,
+        flowHistoryCfgs: item.flowHistoryCfgs,
+        avatar: item.avatar,
+        avatarUrl: item.avatarUrl,
+        photoUrl: item.photoUrl,
+        headImg: item.headImg,
+        resultName: item.optName || normalizedResultName,
+        resultNameA: normalizedResultName,
+        _details: item
+      }
+
+      if (approvalItem.addTaskTag && this.remarkOpt.length === 0) {
+        this.getMdmDataDoc()
+      }
+      if (item.taskName === $lc('开始')) {
+        approvalItem.result = this.status.submit
+      } else if (approvalItem.resultNameA === $lc('加签推进')) {
+        approvalItem.result = this.status.approval
+      } else if (approvalItem.resultNameA === $lc('作废')) {
+        approvalItem.result = this.status.invalid
+      } else if (item.taskName === $lc('结束')) {
+        approvalItem.result = this.status.end
+      } else if (Object.prototype.hasOwnProperty.call(item, 'approvalState')) {
+        approvalItem.result = item.approvalState
+      } else if (!item.endTime) {
+        approvalItem.result = this.status.waiting
+      } else if (item.rejectFlag === 1) {
+        approvalItem.result = this.status.reject
+      } else {
+        approvalItem.result = this.status.approval
+      }
+      return approvalItem
+    },
+    async getMdmDataDoc() {
+      if (this.remarkRequest) return this.remarkRequest
+      this.remarkRequest = axios.get(`/bems/1.0/mdmDataDoc?t=${Math.random()}`, { typeCode: 'ADD_TASK_TAG' })
+      try {
+        const { code, data } = await this.remarkRequest
+        if (code === 200) {
+          this.remarkOpt = data || []
+        }
+      } catch (error) {
+        // 字典仅用于展示加签标签，请求失败不应阻断审批记录渲染。
+        return error
+      } finally {
+        this.remarkRequest = null
+      }
+    },
+    preview(row = {}) {
+      const fileName = row.fileName || ''
+      this.visibleP = true
+      this.seeRow = row
+      this.previewUrl = row.beid ? `/api/onlinePreview?beid=${row.beid}` : ''
+      // 全局正则的 lastIndex 会影响连续预览结果，每次判断前后均复位。
+      this.seeTypes.lastIndex = 0
+      this.previewSameOrg = this.seeTypes.test(fileName)
+      this.seeTypes.lastIndex = 0
+    },
+    closeSee() {
+      if (this.previewUrl && this.previewUrl.indexOf('blob:') === 0 && typeof URL !== 'undefined') {
+        URL.revokeObjectURL(this.previewUrl)
+      }
+      this.previewUrl = ''
+      this.previewSameOrg = false
+      this.seeRow = {}
+      this.visibleP = false
+    },
+    async downFile(row = {}) {
+      if (!row.beid) {
+        this.$message.error($lc('缺少文件标识'))
+        return
+      }
+      const url = this.apiPrefix
+        ? `${this.apiPrefix}/neams/eamsbaserecord/download/${row.beid}`
+        : `/neams/eamsbaserecord/download/${row.beid}`
+      const blob = await axios.get(url, null, {
+        responseType: 'blob',
+        loading: false
+      })
+      this.$downloadBlob(blob, blob.name || row.fileName)
+    },
+    getItemKey(item = {}, index) {
+      return `${item.subProcInitId || item.endTime || item.resultName || 'approval'}-${item.result}-${index}`
+    },
+    isWaiting(item = {}) {
+      return item.result === this.status.waiting
+    },
+    isEnd(item = {}) {
+      return item.result === this.status.end
+    },
+    showSuggestionContent(item = {}) {
+      return item.resultName !== this.$lc('撤回') || this.showCtdMsg
+    },
+    showNodeMeta(item = {}) {
+      return !this.isWaiting(item) && !this.isEnd(item) && Boolean(item.endTime || item.approvalCost)
+    },
+    resultTitle(item = {}) {
+      if (item.resultName) return this.$lc(item.resultName)
+      if (this.isWaiting(item)) return this.$lc('待审批')
+      if (this.isEnd(item)) return this.$lc('结束')
+      if (item.result === this.status.submit) return this.$lc('提交')
+      if (item.result === this.status.approval) return this.$lc('批准')
+      if (item.result === this.status.reject) return this.$lc('驳回')
+      if (item.result === this.status.invalid) return this.$lc('作废')
+      if (item.result === this.status.revocation) return this.$lc('撤回')
+      return ''
+    },
+    statusClass(item = {}) {
+      if (this.isWaiting(item)) return 'is-waiting'
+      if (item.result === this.status.approval) return 'is-approval'
+      if (item.result === this.status.reject || item.result === this.status.invalid) return 'is-reject'
+      if (item.result === this.status.revocation) return 'is-revocation'
+      return 'is-primary'
+    },
+    getPendingUsers(item = {}) {
+      const details = item._details || {}
+      // 兼容外部直传的审批人列表，以及接口映射后保留在 _details 中的原始列表。
+      const users = item.assigneeList || item.approvers || details.assigneeList || details.approvers
+      if (Array.isArray(users)) return users.filter(Boolean)
+      return String(item.assignee || '')
+        .split(/[、,，;；]+/)
+        .map((name) => name.trim())
+        .filter(Boolean)
+    },
+    getUserName(user) {
+      if (!user) return ''
+      if (typeof user === 'string') return user
+      return user.name || user.assignee || user.userName || user.memberName || user.label || ''
+    },
+    getUserAvatar(user) {
+      if (!user || typeof user === 'string') return ''
+      const source = user._details || user
+      return source.avatar || source.avatarUrl || source.photoUrl || source.headImg || ''
+    },
+    getOrganizationText(item = {}) {
+      return [item.memberName, item.deptName, item.job, item.roleName].filter(Boolean).join('｜')
+    },
+    getTerminalLabel(item = {}) {
+      if (item.outTitle) return item.outTitle
+      if (item.appOrPc === '1' || item.appOrPc === 1) return 'PC'
+      if (item.appOrPc === '2' || item.appOrPc === 2) return this.$lc('外部系统')
+      if (item.appOrPc === null || item.appOrPc === '' || item.appOrPc === undefined) return ''
+      return 'APP'
+    },
+    getFileIcon(fileName = '') {
+      const suffix = String(fileName || '')
+        .split('.')
+        .pop()
+        .toLowerCase()
+      if (suffix === 'pdf' || suffix === 'ppt' || suffix === 'pptx') return pdfIcon
+      if (suffix === 'doc' || suffix === 'docx') return wordIcon
+      if (suffix === 'xls' || suffix === 'xlsx') return excelIcon
+      if (['png', 'jpg', 'jpeg', 'gif', 'svg'].includes(suffix)) return pngIcon
+      if (suffix === 'txt') return txtIcon
+      if (['zip', 'rar', '7z'].includes(suffix)) return zipIcon
+      return defaultFileIcon
+    }
+  }
+}
+</script>

package/src/i18n.json

@@ -12654,5 +12654,12 @@
     "vi": "Vui lòng cấu hình danh mục tệp đính kèm",
     "ja": "添付ファイルのカテゴリを設定してください",
     "zh-hk": "請配置附件分類"
+  },
+  "上传结果为空，请稍后重试": {
+    "en": "Upload result is empty, please try again later",
+    "th": "ผลการอัปโหลดว่างเปล่า โปรดลองอีกครั้งในภายหลัง",
+    "vi": "Kết quả tải lên trống, vui lòng thử lại sau",
+    "ja": "アップロード結果が空です。後でもう一度お試しください",
+    "zh-hk": "上傳結果為空，請稍後重試"
   }
 }

package/src/index.js

@@ -127,6 +127,7 @@ import Tree from './components/Tree/index.vue'
 import Upload from './components/Upload/index.vue'
 import UploadMsg from './components/Upload/uploadMsg.vue'
 import AnchorV3 from './components/v3/Anchor/index.vue'
+import ApprovalCardV3 from './components/v3/ApprovalCard/index.vue'
 import Collapse from './components/v3/Collapse/index.vue'
 import CollapseLink from './components/v3/CollapseLink/index.vue'
 import Footer from './components/v3/Footer/index.vue'
@@ -293,6 +294,7 @@ const components = [
   operatingStatus,
   /* v3组件*/
   tableProV3,
+  ApprovalCardV3,
   SecondaryTabV3,
   Header,
   Footer,
@@ -447,6 +449,7 @@ export {
   WornPagination,
   /* v3组件*/
   tableProV3,
+  ApprovalCardV3,
   SecondaryTabV3,
   Header,
   Footer,