[update 解读流程] 表头动态获取

src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable.vue

@@ -76,10 +76,27 @@ import InterpretationClauseTableModal
 import { randomUUID } from '@/utils/util'
 import UserSelectModal from '@comp/selection/UserSelectModal'
 import { downFile } from '@api/manage'
-import { StandardInterpretationNodes } from '@/enums/commonEnums'
+import { FieldType, StandardInterpretationNodes } from '@/enums/commonEnums'
 import UserSelection from '@comp/selection/UserSelection'
 import Vue from 'vue'
 import { ACCESS_TOKEN, TENANT_ID } from '@/store/mutation-types'
+import { getDocSplitTableHeader } from '@api/documentToolApi'
+
+// 需要数据字段翻译的属性类型
+const NEED_DICT_FIELD_TYPE = [
+  FieldType.USER_SINGLE.value,
+  FieldType.ORGAN_SINGLE.value,
+  FieldType.ORGAN_MORE.value,
+  FieldType.FILE_UP.value,
+  FieldType.OPTION_SINGLE.value,
+  FieldType.OPTION_MORE.value,
+  FieldType.TREE.value,
+  FieldType.TREE_SINGLE.value,
+  FieldType.TREE_MODAL_SELECT.value,
+  FieldType.TREE_MODAL_SELECT_SEARCH_DIFF.value,
+  FieldType.TREE_MODAL_SELECT_SEARCH_CHILD.value,
+  FieldType.USER_MORE.value
+]
 
 // 导入数据没有id，用该标记标记数据是否前端生成id
 const uuidFlag = '__uuid__'
@@ -181,6 +198,7 @@ export default {
       actionColumn: { // 操作
         title: this.$t('operation'),
         fixed: 'right',
+        dataIndex: 'action',
         width: 150,
         scopedSlots: { customRender: 'action' }
       },
@@ -201,211 +219,7 @@ export default {
         scopedSlots: { customRender: 'text' }
       },
       // 解读的其他字段（拆分表的字段）
-      columnsExtend: [
+      columnsExtend: [],
-        { // 是否与上一版相同
-          title: this.$t('workCenter.standardInterpretationProcess.sameAsPreviousVersion'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'isSameAsPrevVersion_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 相对上一版变化点说明
-          title: this.$t('workCenter.standardInterpretationProcess.explanationOfChangePoints'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'changeDescription',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 法规注解
-          title: this.$t('workCenter.standardInterpretationProcess.regulatoryAnnotations'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'regulatoryNotes',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 涉及系统/部件
-          title: this.$t('workCenter.standardInterpretationProcess.involvingSystemsComponents'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'partName_dictText',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关键控制器
-          title: this.$t('workCenter.standardInterpretationProcess.keyController'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'keyController_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 责任部门
-          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartment'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'responsibleDepartment_dictText',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 责任部门专业模块
-          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartmentModule'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'responsibleModule_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 关联部门
-          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartments'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'relatedDepartment_dictText',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关联部门专业模块
-          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartmentsModule'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'relatedModule_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 适用车型
-          title: this.$t('workCenter.standardInterpretationProcess.applications'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'applications_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 动力类型
-          title: this.$t('workCenter.standardInterpretationProcess.powerType'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'powerType_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 专业领域
-          title: this.$t('workCenter.standardInterpretationProcess.professionalField'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'domainArea_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 配置需求
-          title: this.$t('workCenter.standardInterpretationProcess.configurationRequirements'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'configurationRequirements_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // 新认证车实施日期
-          title: this.$t('workCenter.standardInterpretationProcess.newCertificationImplementationDate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'newCerImplementDate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 新生产车实施日期
-          title: this.$t('workCenter.standardInterpretationProcess.newProduceImplementationDate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'newProductionImplementation',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 注册日期
-          title: this.$t('workCenter.standardInterpretationProcess.registrationDate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'registrationDate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 企业标准
-          title: this.$t('workCenter.standardInterpretationProcess.enterpriseStandards'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'enterpriseStandard',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 技术规范/设计指南
-          title: this.$t('workCenter.standardInterpretationProcess.technicalSpecificationsDesignGuidelines'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'technicalSpecificationDesignGuide',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 图纸模板
-          title: this.$t('workCenter.standardInterpretationProcess.drawingTemplate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'drawingTemplate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 技术协议模板
-          title: this.$t('workCenter.standardInterpretationProcess.technicalAgreementTemplate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'technicalAgreementTemplate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 校核报告模板/checklist
-          title: this.$t('workCenter.standardInterpretationProcess.verificationReportTemplate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'verificationReportTemplateChecklist',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // DVP模板
-          title: this.$t('workCenter.standardInterpretationProcess.dvpTemplate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'dvpTemplate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // DFEMA
-          title: this.$t('workCenter.standardInterpretationProcess.dfema'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'dfema',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关键技术分解表
-          title: this.$t('workCenter.standardInterpretationProcess.specialListTemplate'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'keyTechnologyDecompositionTable',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 其他文件或模板
-          title: this.$t('workCenter.standardInterpretationProcess.otherFilesOrTemplates'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'otherDocumentsTemplates',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 排查阶段
-          title: this.$t('workCenter.standardInterpretationProcess.investigationStage'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'investigationStage_dictText',
-          scopedSlots: { customRender: 'dictText' }
-        },
-        { // P3证明符合性的交付物名称
-          title: this.$t('workCenter.standardInterpretationProcess.pThree'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'p3',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // P5证明符合性的交付物名称
-          title: this.$t('workCenter.standardInterpretationProcess.pFive'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'p5',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 备注
-          title: this.$t('workCenter.standardInterpretationProcess.notes'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'remarks',
-          scopedSlots: { customRender: 'text' }
-        }
-      ],
       dataSource: [],
       ipagination: {
         current: 1,
@@ -434,7 +248,7 @@ export default {
   computed: {
     // 最终显示的表格
     showColumns () {
-      const columns = this.baseColumns
+      const columns = [...this.baseColumns]
       // 不显示操作列的节点
       const noActionCoumnsNodes = [
         StandardInterpretationNodes.mainInterpreterSingleLineReview.value, // 标准主解读人单线审核
@@ -552,7 +366,54 @@ export default {
       return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
     }
   },
+  mounted () {
+    // 加载表头
+    this.getTableHeader()
+  },
   methods: {
+    // 下划线转换成小驼峰
+    toCamelCase (str) {
+      return str.replace(/_([a-z])/g, (match, letter) => letter.toUpperCase())
+    },
+    getTableHeader () {
+      this.loading = true
+      getDocSplitTableHeader({ module: '4' }).then(res => {
+        if (res.success) {
+          this.columnsExtend = this.dealColumns(res.result || [])
+          console.log(this.columnsExtend)
+          this.isTrue = false
+          this.$nextTick(() => {
+            this.isTrue = true
+          })
+        }
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    /**
+     * 处理表头数据
+     * @param columns
+     * @returns {*[]}
+     */
+    dealColumns (columns) {
+      const tempColumns = []
+      columns.forEach(item => {
+        const key = this.toCamelCase(item.dbFieldName)
+        // 如果是默认的基础列，就不需要动态获取
+        if (this.baseColumns.find(col => col.dataIndex === key)) {
+          return
+        }
+        item.width = 215
+        item.title = this.isChinese() ? item.dbFieldTxt : item.dbFieldEnName
+        if (NEED_DICT_FIELD_TYPE.includes(item.fieldShowType)) {
+          item.dataIndex = this.isChinese() ? key + '_dictText' : key + '_dictTextEn'
+        } else {
+          item.dataIndex = key
+        }
+        tempColumns.push(item)
+      })
+      return tempColumns
+    },
     // 设置组件内数据
     setData (data = []) {
       this.dataSource = data.map(item => {

src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTableModal.vue

@@ -107,63 +107,6 @@
                                 @dictChange="(name) => dictChange(name, 'relatedModule')"
                                v-decorator="['relatedModule']"/>
           </a-form-item>
-          <!--适用车型-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.applications')" :colon="false">
-            <j-multi-select-tag dict-code="applicable_vehicle_type"
-                               :disabled="disabled"
-                               :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.applications')"
-                                @dictChange="(name) => dictChange(name, 'applications')"
-                               v-decorator="['applications']"/>
-          </a-form-item>
-          <!--动力类型-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.powerType')" :colon="false">
-            <j-multi-select-tag dict-code="dynamic_type"
-                               :disabled="disabled"
-                               :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.powerType')"
-                                @dictChange="(name) => dictChange(name, 'powerType')"
-                               v-decorator="['powerType']"/>
-          </a-form-item>
-          <!--专业领域-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.professionalField')" :colon="false">
-            <s-tree-select
-              v-decorator="['domainArea']"
-              :disabled="disabled"
-              :tree-data="professionalFieldTreeList"
-              tree-checkable
-              treeCheckStrictly
-              @change="treeNameChange($event, 'domainArea')"
-              :replaceFields="{title: isChinese() ? 'title' : 'enTitle'}"
-              :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.professionalField')"/>
-          </a-form-item>
-          <!--配置需求-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.configurationRequirements')" :colon="false">
-            <j-multi-select-tag dict-code="configuration_requirements"
-                               :disabled="disabled"
-                               :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.configurationRequirements')"
-                                @dictChange="(name) => dictChange(name, 'configurationRequirements')"
-                               v-decorator="['configurationRequirements']"/>
-          </a-form-item>
-          <!--新认证车实施日期-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.newCertificationImplementationDate')" :colon="false">
-            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.newCertificationImplementationDate')"
-                                    fieldName="newCerImplementDate"
-                                    :disabled="disabled"
-                                    v-decorator="['newCerImplementDate']" />
-          </a-form-item>
-          <!--新生产车实施日期-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.newProduceImplementationDate')" :colon="false">
-            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.newProduceImplementationDate')"
-                                    fieldName="newProductionImplementation"
-                                    :disabled="disabled"
-                                    v-decorator="['newProductionImplementation']" />
-          </a-form-item>
-          <!--注册日期-->
-          <a-form-item :label="$t('workCenter.standardInterpretationProcess.registrationDate')" :colon="false">
-            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.registrationDate')"
-                                    fieldName="registrationDate"
-                                    :disabled="disabled"
-                                    v-decorator="['registrationDate']" />
-          </a-form-item>
           <!--企业标准-->
           <a-form-item :label="$t('workCenter.standardInterpretationProcess.enterpriseStandards')" :colon="false">
             <standard-selection :source="StandardSource.ENTERPRISE.value"
@@ -251,6 +194,63 @@
                      :placeholder="$t('pleaseEnter')+$t('workCenter.standardInterpretationProcess.pFive')"
                      v-decorator="['p5']"/>
           </a-form-item>
+          <!--适用车型-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.applications')" :colon="false">
+            <j-multi-select-tag dict-code="applicable_vehicle_type"
+                                :disabled="disabled"
+                                :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.applications')"
+                                @dictChange="(name) => dictChange(name, 'applications')"
+                                v-decorator="['applications']"/>
+          </a-form-item>
+          <!--动力类型-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.powerType')" :colon="false">
+            <j-multi-select-tag dict-code="dynamic_type"
+                                :disabled="disabled"
+                                :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.powerType')"
+                                @dictChange="(name) => dictChange(name, 'powerType')"
+                                v-decorator="['powerType']"/>
+          </a-form-item>
+          <!--专业领域-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.professionalField')" :colon="false">
+            <s-tree-select
+              v-decorator="['domainArea']"
+              :disabled="disabled"
+              :tree-data="professionalFieldTreeList"
+              tree-checkable
+              treeCheckStrictly
+              @change="treeNameChange($event, 'domainArea')"
+              :replaceFields="{title: isChinese() ? 'title' : 'enTitle'}"
+              :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.professionalField')"/>
+          </a-form-item>
+          <!--配置需求-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.configurationRequirements')" :colon="false">
+            <j-multi-select-tag dict-code="configuration_requirements"
+                                :disabled="disabled"
+                                :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.configurationRequirements')"
+                                @dictChange="(name) => dictChange(name, 'configurationRequirements')"
+                                v-decorator="['configurationRequirements']"/>
+          </a-form-item>
+          <!--新认证车实施日期-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.newCertificationImplementationDate')" :colon="false">
+            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.newCertificationImplementationDate')"
+                                    fieldName="newCerImplementDate"
+                                    :disabled="disabled"
+                                    v-decorator="['newCerImplementDate']" />
+          </a-form-item>
+          <!--新生产车实施日期-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.newProduceImplementationDate')" :colon="false">
+            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.newProduceImplementationDate')"
+                                    fieldName="newProductionImplementation"
+                                    :disabled="disabled"
+                                    v-decorator="['newProductionImplementation']" />
+          </a-form-item>
+          <!--注册日期-->
+          <a-form-item :label="$t('workCenter.standardInterpretationProcess.registrationDate')" :colon="false">
+            <j-multiple-date-picker :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.registrationDate')"
+                                    fieldName="registrationDate"
+                                    :disabled="disabled"
+                                    v-decorator="['registrationDate']" />
+          </a-form-item>
           <!--备注-->
           <a-form-item :label="$t('workCenter.standardInterpretationProcess.notes')" :colon="false">
             <a-textarea :placeholder="$t('pleaseEnter') + $t('workCenter.standardInterpretationProcess.notes')"