From a2b002101fa07a05a05cfddeee6bc6b38bff9ae9 Mon Sep 17 00:00:00 2001
From: danshihao <danshihao@syxysoft.com>
Date: Thu, 11 Jul 2024 11:41:03 +0800
Subject: [PATCH] =?UTF-8?q?[update=20=E6=A0=87=E5=87=86=E8=A7=A3=E8=AF=BB?=
 =?UTF-8?q?=E6=B5=81=E7=A8=8B]=20=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/common/lang/workCenter/en.js              |   3 +-
 src/common/lang/workCenter/zh.js              |   3 +-
 .../StandardInterpretationProcess.vue         |   6 +-
 .../modules/InterpretationClauseTable.vue     | 847 ++++++++++++++++++
 ...vue => InterpretationClauseTableModal.vue} |   2 +-
 .../modules/InterpretationInitiate.vue        | 179 +---
 .../InterpretationInterpreterFillInfo.vue     | 388 +-------
 .../InterpretationLiaisonDistribute.vue       | 155 +---
 ...nterpretationMainInterpreterDistribute.vue | 582 ++----------
 9 files changed, 985 insertions(+), 1180 deletions(-)
 create mode 100644 src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable.vue
 rename src/views/workCenter/standardInterpretationProcess/modules/{TermsInterpretModal.vue => InterpretationClauseTableModal.vue} (99%)

diff --git a/src/common/lang/workCenter/en.js b/src/common/lang/workCenter/en.js
index f97c675..c013c1f 100644
--- a/src/common/lang/workCenter/en.js
+++ b/src/common/lang/workCenter/en.js
@@ -115,7 +115,8 @@ module.exports = {
     countersigningPerson: 'Countersigning personnel',
     reviewersPerson: 'Reviewer',
     approvedPerson: 'Approved personnel',
-    batchEdit: 'Bulk edit'
+    batchEdit: 'Bulk edit',
+    pleaseSelectInterpreter: 'Select at least one piece of data for each department involved to interpret'
   },
   // 流程配置
   processConfig: {
diff --git a/src/common/lang/workCenter/zh.js b/src/common/lang/workCenter/zh.js
index a81e5aa..0bc0397 100644
--- a/src/common/lang/workCenter/zh.js
+++ b/src/common/lang/workCenter/zh.js
@@ -115,7 +115,8 @@ module.exports = {
     countersigningPerson: '会签人员',
     reviewersPerson: '审核人员',
     approvedPerson: '批准人员',
-    batchEdit: '批量编辑'
+    batchEdit: '批量编辑',
+    pleaseSelectInterpreter: '至少选择一条数据的各涉及部门解读人'
   },
   // 流程配置
   processConfig: {
diff --git a/src/views/workCenter/standardInterpretationProcess/StandardInterpretationProcess.vue b/src/views/workCenter/standardInterpretationProcess/StandardInterpretationProcess.vue
index c2f1d25..2558a30 100644
--- a/src/views/workCenter/standardInterpretationProcess/StandardInterpretationProcess.vue
+++ b/src/views/workCenter/standardInterpretationProcess/StandardInterpretationProcess.vue
@@ -63,12 +63,14 @@
 
       <!--  业务信息  -->
       <!--  发起节点  -->
-      <interpretation-initiate v-if="isInitiate" :disabled="disabled" ref="businessComp"/>
+      <interpretation-initiate v-if="isInitiate" :disabled="disabled" ref="businessComp" :current-node-id="currentNodeId"/>
       <!--  主控部门联络人分发  -->
       <interpretation-liaison-distribute v-else-if="currentNodeId === StandardInterpretationNodes.controlDepartLiaisonDistribution.value"
+                                         :current-node-id="currentNodeId"
                                          :disabled="disabled" ref="businessComp"/>
       <!--  主解读人分发  -->
       <interpretation-main-interpreter-distribute v-else-if="[StandardInterpretationNodes.standardInterpreterDistribution.value, StandardInterpretationNodes.standardInterpreterReDistribution.value].includes(currentNodeId)"
+                                                  :current-node-id="currentNodeId"
                                                   :disabled="disabled" ref="businessComp"/>
       <!--  解读人填写解读信息  -->
       <!--  标准主解读人单线审核  -->
@@ -541,7 +543,7 @@ export default {
       })
       // 驳回需要填写备注
       if (!this.approvalInfoForm.getFieldValue('commitText')) {
-        this.$message.warning(this.$t('pleaseEnterRemarks'))
+        this.$message.warn(this.$t('pleaseEnterRemarks'))
         return
       }
       this.loading = true
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable.vue
new file mode 100644
index 0000000..1a3b7e1
--- /dev/null
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable.vue
@@ -0,0 +1,847 @@
+<template>
+  <!--条款解读的表格，getData用来获取表格，setData用来给表格列表数据，其他表格数据逻辑内部处理-->
+  <div class="clause-table-container">
+    <div v-if="!disabled" class="table-operator">
+      <!--  批量选择人员(标准主解读人节点 && 选择分发时)  -->
+      <a-button icon="plus" type="primary" @click="handleBatchSelectUser" v-if="isMainInterpreterDistribute && isDistribute">
+        {{$t('workCenter.standardInterpretationProcess.batchSelectionUser')}}
+      </a-button>
+      <!--  导入(标准主解读人节点 && 选择不分发时)  -->
+      <a-upload v-if="isMainInterpreterDistribute && !isDistribute"
+                name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importUrl"
+                @change="handleImport">
+        <a-button type="primary" icon="download" ghost>{{ $t('import') }}</a-button>
+      </a-upload>
+      <!--  导出  -->
+      <a-button icon="upload" type="primary" ghost @click="handleExport" v-if="showExportBtn">
+        {{ $t('export') }}
+      </a-button>
+      <!--  批量删除  -->
+      <a-button icon="delete" type="danger" ghost @click="handleBatchDelete" v-if="showBatchDelBtn">
+        {{$t('batchDelete')}}
+      </a-button>
+    </div>
+    <j-table
+      :can-drag="true"
+      :scroll="{x: '100%', y: '50vh'}"
+      ref="table"
+      :rowKey="rowKey"
+      :columns="showColumns"
+      :dataSource="dataSource"
+      :pagination="ipagination"
+      :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+      @change="handleTableChange">
+      <!--条文内容-->
+      <template slot="item_content" slot-scope="{text, record}">
+        <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
+          {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
+        </div>
+        <div class="table-text" v-else>{{ global.emptyLine }}</div>
+      </template>
+      <!--各涉及部门解读人-->
+      <template slot="interpretPersonIds" slot-scope="{text, record, index}">
+        <user-selection :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.departInterpretingPeople')"
+                        v-model="record.interpretPersonIds"
+                        :disabled="disabled"
+                        filedName="interpretPersonIds"
+                        @nameChange="(value, fieldName) => tableUserSelectNameChange(value, fieldName, index)"
+                        type="checkbox"
+                        :nameStr="record.interpretPersonIds_dictText" />
+      </template>
+      <template v-slot:action="{text, record}">
+        <a v-if="showEditBtn" @click="handleEdit(record)" class="table-ope-btn">{{ $t('edit') }}</a>
+        <a-divider v-if="showEditBtn" type="vertical" />
+        <a @click="handleDelete(record[rowKey])" class="table-ope-btn">{{ $t('delete') }}</a>
+      </template>
+    </j-table>
+    <!--条文内容-->
+    <split-clause-detail ref="splitClauseDetail" />
+    <!-- 编辑弹框 -->
+    <interpretation-clause-table-modal ref="interpretationClauseTableModal" @ok="editCallback" />
+    <!--批量选择人员-->
+    <user-select-modal type="checkbox" ref="userSelectModal" check-required @listChange="batchSelectUserCallback" />
+  </div>
+</template>
+
+<script>
+import SplitClauseDetail from '@views/documentTool/documentSplit/modules/SplitClauseDetail'
+import InterpretationClauseTableModal
+  from '@views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTableModal'
+import { filterObj, randomUUID } from '@/utils/util'
+import UserSelectModal from '@comp/selection/UserSelectModal'
+import { downFile } from '@api/manage'
+import { StandardInterpretationNodes } from '@/enums/commonEnums'
+import UserSelection from '@comp/selection/UserSelection'
+import Vue from 'vue'
+import { ACCESS_TOKEN, TENANT_ID } from '@/store/mutation-types'
+
+// 导入数据没有id，用该标记标记数据是否前端生成id
+const uuidFlag = '__uuid__'
+let importModalLoading
+
+// 主解读人分发节点
+const mainInterpreterDistributeNodes = [
+  StandardInterpretationNodes.standardInterpreterDistribution.value,
+  StandardInterpretationNodes.standardInterpreterReDistribution.value
+]
+
+export default {
+  name: 'InterpretationClauseTable',
+  components: { UserSelection, UserSelectModal, InterpretationClauseTableModal, SplitClauseDetail },
+  props: {
+    // 唯一key字段
+    rowKey: {
+      type: String,
+      required: false,
+      default: 'id'
+    },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    // 当前节点
+    currentNodeId: {
+      type: String,
+      required: true
+    },
+    // 是否分发（主解读人分发节点会有）
+    isDistribute: {
+      type: Boolean,
+      default: false,
+      required: false
+    }
+  },
+  data () {
+    return {
+      loading: false,
+      // 基础的表格
+      baseColumns: [
+        { // 标准编号/条款号
+          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'itemNum',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 标准名称/条款标题
+          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'itemTitle',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 条款内容
+          title: this.$t('clauseContent'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'itemContent',
+          scopedSlots: { customRender: 'item_content' }
+        }
+      ],
+      // 操作列
+      actionColumn: { // 操作
+        title: this.$t('operation'),
+        fixed: 'right',
+        width: 150,
+        scopedSlots: { customRender: 'action' }
+      },
+      // 各涉及部门解读人列（主解读人分发节点选分发时使用）
+      interpretingPeopleColumn: {
+        title: this.$t('workCenter.standardInterpretationProcess.departInterpretingPeople'),
+        align: 'center',
+        width: 180,
+        dataIndex: 'interpretPersonIds',
+        scopedSlots: { customRender: 'interpretPersonIds' }
+      },
+      // 解读人回显列（解读人填写信息之后的节点显示）
+      interpretingPeopleDictColumn: {
+        title: this.$t('workCenter.standardInterpretationProcess.departInterpretingPeople'),
+        align: 'center',
+        width: 180,
+        dataIndex: 'interpretPersonIds_dictText',
+        scopedSlots: { customRender: 'text' }
+      },
+      // 解读的其他字段（拆分表的字段）
+      columnsExtend: [
+        { // 译文
+          title: this.$t('workCenter.standardInterpretationProcess.translation'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'translation',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 是否与上一版相同
+          title: this.$t('workCenter.standardInterpretationProcess.sameAsPreviousVersion'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'isSameAsPrevVersion_dictText',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 相对上一版变化点说明
+          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: 'keywords',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 关键控制器
+          title: this.$t('workCenter.standardInterpretationProcess.keyController'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'keyController',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 责任部门
+          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartment'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'responsibleDepartment',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 责任部门专业模块
+          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartmentModule'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'responsibleModule',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 关联部门
+          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartments'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'relatedDepartment',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 关联部门专业模块
+          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartmentsModule'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'relatedModule',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 适用车型
+          title: this.$t('workCenter.standardInterpretationProcess.applications'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'applications',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 动力类型
+          title: this.$t('workCenter.standardInterpretationProcess.powerType'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'powerType',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 专业领域
+          title: this.$t('workCenter.standardInterpretationProcess.professionalField'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'domainArea',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 配置需求
+          title: this.$t('workCenter.standardInterpretationProcess.configurationRequirements'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'configurationRequirements',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 新认证车实施日期
+          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',
+          scopedSlots: { customRender: 'text' }
+        },
+        { // 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,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      selectedRowKeys: [],
+      selectionRows: [],
+      url: {
+        // 导入
+        importExcelUrl: ''
+      }
+    }
+  },
+  computed: {
+    // 最终显示的表格
+    showColumns () {
+      const columns = this.baseColumns
+      // 不显示操作列的节点
+      const noActionCoumnsNodes = [
+        StandardInterpretationNodes.mainInterpreterSingleLineReview.value, // 标准主解读人单线审核
+        StandardInterpretationNodes.countersignOne.value, // 会签节点
+        StandardInterpretationNodes.countersignTwo.value, // 会签节点
+        StandardInterpretationNodes.departManagerReviewOne.value, // 各涉及部门科室经理审核
+        StandardInterpretationNodes.departManagerReviewTwo.value, // 各涉及部门科室经理审核
+        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalOne.value, // 主控部门高级经理/法规认证技术官批准
+        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalTwo.value // 主控部门高级经理/法规认证技术官批准
+      ]
+      // 显示解读人的节点(填写完解读信息后的节点都显示，不包含填写解读节点)
+      const showInterpreterNodes = [
+        StandardInterpretationNodes.mainInterpreterSingleLineReview.value, // 标准主解读人单线审核
+        StandardInterpretationNodes.standardInterpreterSummary.value, // 标准主解读人汇总
+        StandardInterpretationNodes.countersignOne.value, // 会签节点
+        StandardInterpretationNodes.countersignTwo.value, // 会签节点
+        StandardInterpretationNodes.departManagerReviewOne.value, // 各涉及部门科室经理审核
+        StandardInterpretationNodes.departManagerReviewTwo.value, // 各涉及部门科室经理审核
+        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalOne.value, // 主控部门高级经理/法规认证技术官批准
+        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalTwo.value // 主控部门高级经理/法规认证技术官批准
+      ]
+      // 显示解读其他信息的节点（填写完解读信息及后的节点都显示）
+      const showExtendNodeId = [
+        StandardInterpretationNodes.interpreterFillInfoOne.value, // 解读人填写信息
+        StandardInterpretationNodes.interpreterFillInfoTwo.value, // 解读人填写信息
+        ...showInterpreterNodes // 填写解读信息之后的节点
+      ]
+      // 是否回显解读人
+      if (showInterpreterNodes.includes(this.currentNodeId)) {
+        columns.push(this.interpretingPeopleDictColumn)
+      }
+      // 当前是标准解读人节点，要根据是否分发显示不同的表格
+      if (mainInterpreterDistributeNodes.includes(this.currentNodeId)) {
+        // 分发时增加选择解读人列
+        if (this.isDistribute) {
+          columns.push(this.interpretingPeopleColumn)
+        } else {
+          // 不分发时显示拆分其他的字段
+          columns.push(...this.columnsExtend)
+        }
+      }
+      if (showExtendNodeId.includes(this.currentNodeId)) {
+        columns.push(...this.columnsExtend)
+      }
+      // 需要操作的节点就加上操作列
+      if (!noActionCoumnsNodes.includes(this.currentNodeId)) {
+        columns.push(this.actionColumn)
+      }
+      return columns
+    },
+    // 是否主解读人分发节点
+    isMainInterpreterDistribute () {
+      return mainInterpreterDistributeNodes.includes(this.currentNodeId)
+    },
+    // 显示导出按钮
+    showExportBtn () {
+      return [
+        ...mainInterpreterDistributeNodes, // 标准主解读人分发节点
+        StandardInterpretationNodes.standardInterpreterSummary.value // 标准主解读人汇总
+      ].includes(this.currentNodeId)
+    },
+    // 显示批量删除按钮
+    showBatchDelBtn () {
+      return [
+        StandardInterpretationNodes.initiated.value, // 法规工程师发起
+        StandardInterpretationNodes.controlDepartLiaisonDistribution.value, // 主控部门联络人分发
+        ...mainInterpreterDistributeNodes // 标准主解读人分发节点
+      ].includes(this.currentNodeId)
+    },
+    // 是否显示编辑按钮
+    showEditBtn () {
+      // 标准主解读人分发节点 && 不分发 显示编辑按钮
+      if (this.isMainInterpreterDistribute && !this.isDistribute) {
+        return true
+      }
+      return [
+        StandardInterpretationNodes.interpreterFillInfoOne.value, // 解读人填写信息
+        StandardInterpretationNodes.interpreterFillInfoTwo.value, // 解读人填写信息
+        StandardInterpretationNodes.standardInterpreterSummary.value // 标准主解读人汇总
+      ].includes(this.currentNodeId)
+    },
+    // token header
+    tokenHeader () {
+      const head = { 'X-Access-Token': Vue.ls.get(ACCESS_TOKEN) }
+      const tenantid = Vue.ls.get(TENANT_ID)
+      if (tenantid) {
+        head['tenant-id'] = tenantid
+      }
+      return head
+    },
+    importUrl: function () {
+      return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
+    }
+  },
+  methods: {
+    // 设置组件内数据
+    setData (data = []) {
+      this.dataSource = data
+    },
+    // 获取组件内数据
+    getData () {
+      return this.dataSource.map(item => {
+        // 导入的数据使用的前端id，有uuid标识的数据，返回的时候去掉id
+        if (item[uuidFlag]) {
+          delete item.id
+          delete item[uuidFlag]
+        }
+        return item
+      })
+    },
+    /**
+     * 导入
+     * @param info
+     */
+    handleImport (info) {
+      // 限制导入大于500MB
+      if (info.file.size > 1024 * 1024 * 500) {
+        this.$message.error('导入文件最大500MB！')
+        info.fileList.pop()
+        return
+      }
+      // 加一个大的提示
+      if (!this.loading) {
+        importModalLoading = this.$info({
+          title: '提示',
+          content: <span>正在导入，请稍候 <a-spin size="small" /></span>,
+          keyboard: false,
+          // 不显示 知道了 按钮
+          okButtonProps: {
+            style: 'display: none'
+          }
+        })
+      }
+      this.loading = true
+      if (info.file.status !== 'uploading') {
+        console.log(info.file, info.fileList)
+      }
+      if (info.file.status === 'done') {
+        // 销毁这个提示
+        importModalLoading && importModalLoading.destroy()
+        this.loading = false
+        if (info.file.response.success) {
+          // this.$message.success(`${info.file.name} 文件上传成功`);
+          if (info.file.response.code === 201) {
+            const { message, result: { msg, fileUrl, fileName } } = info.file.response
+            const href = window._CONFIG.domianURL + fileUrl
+            this.$warning({
+              title: message,
+              content: (<div>
+                <span>{msg}</span><br />
+                <span>具体详情请 <a href={href} target="_blank" download={fileName}>点击下载</a> </span>
+              </div>
+              )
+            })
+          } else {
+            this.$message.success(info.file.response.message || `${info.file.name} 文件上传成功`)
+          }
+          // 前端存储，没有id的数据，前端加上uuid
+          const data = info.file.response.result || []
+          this.dataSource.push(...data.map((item, index) => {
+            // 导入的时候生成前端id，不用索引防止禁用出错
+            item.id = randomUUID()
+            // 有该标识返回数据的时候把id给去掉，这里的id前端生成的
+            item[uuidFlag] = true
+            return item
+          }))
+        } else {
+          if (Array.isArray(info.file.response.result) && info.file.response.result.length > 0) {
+            this.messageLineFeed(this.$t('fileImportError'), info.file.response.result)
+          } else if (/<br>|<\/br>|<br\/>/.test(info.file.response.message)) {
+            this.messageLineFeedByBr(this.$t('fileImportError'), info.file.response.message)
+          } else {
+            this.$message.warning(`${info.file.name} ${info.file.response.message}`)
+          }
+        }
+      } else if (info.file.status === 'error') {
+        // 销毁这个提示
+        importModalLoading && importModalLoading.destroy()
+        this.loading = false
+        if (info.file.response.status === 500) {
+          const data = info.file.response
+          const token = Vue.ls.get(ACCESS_TOKEN)
+          if (token && data.message.includes('Token失效')) {
+            this.error({
+              title: this.$t('loginExpired'),
+              content: this.$t('loginExpiredMessage'),
+              okText: this.$t('logInAgain'),
+              mask: false,
+              onOk: () => {
+                this.$store.dispatch('Logout').then(() => {
+                  Vue.ls.remove(ACCESS_TOKEN)
+                  window.location.reload()
+                })
+              }
+            })
+          }
+        } else {
+          this.$message.warning(`文件上传失败: ${info.file.msg} `)
+        }
+      }
+    },
+    // 导出
+    handleExport (fileName, fileSuffix = '.xls') {
+      if (!fileName || typeof fileName !== 'string') {
+        fileName = '导出文件'
+      }
+      const param = {}
+      if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
+        param.selections = this.selectedRowKeys.join(',')
+      }
+      console.log('导出参数', param)
+      // 加一个大的提示
+      const modalLoading = this.$info({
+        title: '提示',
+        content: <span>正在导出，请稍候 <a-spin size="small" /></span>,
+        keyboard: false,
+        // 不显示 知道了 按钮
+        okButtonProps: {
+          style: 'display: none'
+        }
+      })
+      const url = ''
+      downFile(url, param).then((data) => {
+        if (!data) {
+          this.$message.warning('文件下载失败')
+          return
+        }
+        if (typeof window.navigator.msSaveBlob !== 'undefined') {
+          window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + fileSuffix)
+        } else {
+          const url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
+          const link = document.createElement('a')
+          link.style.display = 'none'
+          link.href = url
+          link.setAttribute('download', fileName + fileSuffix)
+          document.body.appendChild(link)
+          link.click()
+          document.body.removeChild(link) // 下载完成移除元素
+          window.URL.revokeObjectURL(url) // 释放掉blob对象
+        }
+      }).finally(() => {
+        // 销毁这个提示
+        modalLoading.destroy()
+      })
+    },
+    /**
+     * 批量选择人员
+     */
+    handleBatchSelectUser () {
+      // 至少勾选一条数据
+      if (!this.selectedRowKeys.length) {
+        this.$message.warning(this.$t('selectARecord'))
+        return
+      }
+      this.$refs.userSelectModal.open()
+    },
+    // 批量选择人员回调
+    batchSelectUserCallback (userList) {
+      const ids = userList.map(item => item.id).join(',')
+      const names = userList.map(item => `${item.realname}(${item.username})`).join(',')
+      this.selectionRows.forEach(item => {
+        item.interpretPersonIds = ids
+        item.interpretPersonIds_dictText = names
+      })
+    },
+    /**
+     * 编辑
+     */
+    handleEdit (record) {
+      this.$refs.interpretationClauseTableModal.edit(record)
+    },
+    /**
+     * 批量编辑
+     */
+    handleBatchEdit () {
+      // 至少勾选一条数据
+      if (!this.selectedRowKeys.length) {
+        this.$message.warning(this.$t('selectARecord'))
+        return
+      }
+      this.$refs.interpretationClauseTableModal.add()
+    },
+    /**
+     * 编辑与批量编辑回调
+     * @param formData - 编辑表单数据
+     */
+    editCallback (formData) {
+      // 过滤没有值的字段
+      const form = filterObj(formData)
+      // 有id就是编辑，没有就是批量编辑
+      if (formData[this.rowKey]) {
+        const row = this.dataSource.find(item => item[this.rowKey] === formData[this.rowKey])
+        Object.assign(row, form)
+      } else {
+        this.selectedRows.forEach(item => {
+          Object.assign(item, form)
+        })
+      }
+      this.$forceUpdate()
+    },
+    /**
+     * 删除
+     * @param id - 删除数据的id
+     */
+    handleDelete (id) {
+      const that = this
+      this.$confirm({
+        title: this.$t('confirmDeletion'),
+        content: this.$t('areYouSure'),
+        onOk: () => {
+          that.dataSource = that.dataSource.filter(item => item[this.rowKey] !== id)
+          // 判断当前删除的数据是否是最后一页的最后一条数据，如果是的话页码减一
+          if (that.ipagination.current > 1 && ((that.ipagination.current - 1) * that.ipagination.pageSize) + 1 === that.ipagination.total) {
+            that.ipagination.current -= 1
+          }
+        }
+      })
+      this.ipagination.total = this.dataSource.length
+    },
+    /**
+     * 批量删除
+     */
+    handleBatchDelete () {
+      // 至少勾选一条数据
+      if (!this.selectedRowKeys.length) {
+        this.$message.warning(this.$t('selectARecord'))
+        return
+      }
+      const that = this
+      this.$confirm({
+        title: this.$t('confirmBatchDeletion'),
+        content: this.$t('deleteAData'),
+        onOk: () => {
+          this.dataSource = this.dataSource.filter(item => !this.selectedRowKeys.includes(item[this.rowKey]))
+          // 重新计算分页问题
+          that.reCalculatePage(that.selectedRowKeys.length)
+          // 清空勾选数据
+          that.onClearSelected()
+        }
+      })
+    },
+    onClearSelected () {
+      this.selectedRowKeys = []
+      this.selectionRows = []
+    },
+    // 重新计算分页
+    reCalculatePage (count) {
+      // 总数量-count
+      const total = this.ipagination.total - count
+      // 获取删除后的分页数
+      const currentIndex = Math.ceil(total / this.ipagination.pageSize)
+      // 删除后的分页数<所在当前页
+      if (currentIndex < this.ipagination.current) {
+        this.ipagination.current = currentIndex
+      }
+    },
+    /**
+     * 显示条款内容、条文解读弹框
+     * @param fieldName
+     * @param val
+     */
+    showContent (fieldName, val) {
+      this.$refs.splitClauseDetail.open(val)
+    },
+    /**
+     * 表格分页
+     * @param pagination
+     */
+    handleTableChange (pagination) {
+      this.ipagination = pagination
+    },
+    // 表格选择用户回显用户名
+    tableUserSelectNameChange (value, fieldName, index) {
+      this.dataSource[index][fieldName + '_dictText'] = value
+    },
+    // 表格勾选
+    onSelectChange (selectedRowKeys, selectionRows) {
+      this.selectedRowKeys = selectedRowKeys
+      this.selectionRows = selectionRows
+    },
+    // 选择用户回显用户名
+    userSelectNameChange (value, fieldName) {
+      this.formInline[fieldName + '_dictText'] = value
+    },
+    /**
+     * 对数组形式后端错误信息进行处理
+     * @param title
+     * @param content
+     */
+    messageLineFeed (title, content) {
+      const htmlDom = []
+      content.map(tt => {
+        if (tt) {
+          htmlDom.push((<div>{tt}</div>))
+        }
+      })
+      this.$warning({
+        title: title,
+        closable: true,
+        width: 800,
+        content: () => <div>
+          {htmlDom}
+        </div>
+      })
+      this.$nextTick(() => {
+        document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display: inline-block'
+        document.getElementsByClassName('ant-modal-confirm-content')[0].style = 'max-height: calc(100vh - 300px);overflow-y: auto;'
+      })
+    },
+    /**
+     * 对包含<br/>的后端错误信息进行处理
+     * @param title
+     * @param content
+     */
+    messageLineFeedByBr (title, content) {
+      // 可以用分号和<br> </br> <br/>换行
+      content = content.replace(/<br>|<\/br>|<br\/>/g, ';')
+      const messageArr = content.split(';')
+      const htmlDom = []
+      messageArr.map(tt => {
+        if (tt) {
+          htmlDom.push((<div>{tt}</div>))
+        }
+      })
+      this.$warning({
+        title: title,
+        closable: true,
+        width: 800,
+        content: () => <div>
+          {htmlDom}
+        </div>
+      })
+      this.$nextTick(() => {
+        document.getElementsByClassName('ant-modal-confirm-btns')[0].style = 'display: inline-block'
+        document.getElementsByClassName('ant-modal-confirm-content')[0].style = 'max-height: calc(100vh - 300px);overflow-y: auto;'
+      })
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.clause-table-container {
+  margin-bottom: 20px;
+}
+</style>
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/TermsInterpretModal.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTableModal.vue
similarity index 99%
rename from src/views/workCenter/standardInterpretationProcess/modules/TermsInterpretModal.vue
rename to src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTableModal.vue
index d394763..7716e27 100644
--- a/src/views/workCenter/standardInterpretationProcess/modules/TermsInterpretModal.vue
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTableModal.vue
@@ -134,7 +134,7 @@
 
 <script>
 export default {
-  name: 'TermsInterpretModal',
+  name: 'InterpretationClauseTableModal',
   data () {
     return {
       title: this.$t('close'),
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInitiate.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInitiate.vue
index 77e4e8c..586daef 100644
--- a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInitiate.vue
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInitiate.vue
@@ -37,34 +37,8 @@
         </j-table>
       </div>
       <template v-if="showClauseTable">
-        <div v-if="!disabled" class="table-operator">
-          <!--  批量删除条款  -->
-          <a-button icon="delete" type="danger" ghost @click="handleClauseBatchDel">
-            {{ $t('batchDelete') }}
-          </a-button>
-        </div>
-        <j-table
-          :can-drag="true"
-          :scroll="{x: '100%'}"
-          ref="table"
-          rowKey="uuid"
-          :columns="clauseColumns"
-          :dataSource="clauseDataSource"
-          :pagination="clauseIpagination"
-          :row-selection="{ selectedRowKeys: selectedClauseRowKeys, onChange: onSelectClauseChange }"
-          @change="handleClauseTableChange">
-          <!--条文内容-->
-          <template slot="item_content" slot-scope="{text, record}">
-            <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
-              {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
-            </div>
-            <div class="table-text" v-else>{{ global.emptyLine }}</div>
-          </template>
-
-          <template v-slot:action="{text, record}">
-            <a @click="handleClauseDelete(record.uuid)" class="table-ope-btn">{{ $t('delete') }}</a>
-          </template>
-        </j-table>
+        <!-- 条款的表格 -->
+        <interpretation-clause-table ref="interpretationClauseTable" row-key="uuid" :disabled="disabled" :current-node-id="currentNodeId"/>
       </template>
     </a-spin>
     <!--  添加标准弹框-只选择已拆分的数据  -->
@@ -74,8 +48,6 @@
                               :canSelectedSource="[StandardSource.FOREIGN.value]"
                               :filters="{releaseSplitFlag: '1'}"
                               disabledSourceSearch/>
-    <!--条文内容-->
-    <split-clause-detail ref="splitClauseDetail" />
   </div>
 </template>
 
@@ -84,11 +56,17 @@ import StandardSelectionModal from '@comp/selection/StandardSelectionModal'
 import { interpretGetClauseList, interpretGetFileByStandardId } from '@api/workCenter'
 import { randomUUID } from '@/utils/util'
 import { StandardSource } from '@/enums/commonEnums'
-import SplitClauseDetail from '@views/documentTool/documentSplit/modules/SplitClauseDetail'
+import InterpretationClauseTable
+  from '@views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable'
 export default {
   name: 'InterpretationInitiate',
-  components: { SplitClauseDetail, StandardSelectionModal },
+  components: { InterpretationClauseTable, StandardSelectionModal },
   props: {
+    // 当前节点
+    currentNodeId: {
+      type: String,
+      required: true
+    },
     disabled: {
       type: Boolean,
       required: false,
@@ -139,63 +117,21 @@ export default {
           title: this.$t('newProductionVehicleImplementationDate'),
           align: 'center',
           width: 180,
-          dataIndex: 'newProductionImplementation',
+          dataIndex: 'newProductImplDate',
           scopedSlots: { customRender: 'text' }
         },
         { // 新认证车实施日期
           title: this.$t('newCertifiedVehicleImplementationDate'),
           align: 'center',
           width: 180,
-          dataIndex: 'newCerImplementDate',
+          dataIndex: 'newAuthImplDate',
           scopedSlots: { customRender: 'text' }
         }
       ],
       dataSource: [],
       decompositionSourceList: [], // 标准分解单下拉
-      showClauseTable: false,
-      clauseColumns: [
-        { // 标准编号/条款号
-          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemNum',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 标准名称/条款标题
-          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemTitle',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 条款内容
-          title: this.$t('clauseContent'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemContent',
-          scopedSlots: { customRender: 'item_content' }
-        },
-        { // 操作
-          title: this.$t('operation'),
-          fixed: 'right',
-          width: 150,
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      clauseDataSource: [],
-      /* 分页参数 */
-      clauseIpagination: {
-        current: 1,
-        pageSize: 10,
-        pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
-        showTotal: (total, range) => {
-          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0
-      },
-      selectedClauseRowKeys: []
+      // 是否显示条款的表格部分
+      showClauseTable: false
     }
   },
   methods: {
@@ -208,17 +144,15 @@ export default {
       if (isValidate) {
         // 如果没有选择标准
         if (!this.dataSource.length) {
-          this.$message.warning(this.$t('addAtLeastOneRowOfData'))
-          // 校验失败就返回true
+          this.$message.warn(this.$t('addAtLeastOneRowOfData'))
+          // 校验失败就标记true
           obj._flag = true
         }
       }
       // 选择的标准列表
       obj.standardData = this.dataSource
       // 选择的条款列表
-      obj.clauseData = this.clauseDataSource
-      // 是否显示了条款列表
-      obj.showClauseTable = this.showClauseTable
+      obj.clauseData = this.$refs.interpretationClauseTable.getData()
       return obj
     },
     // 更新组件内的数据
@@ -233,14 +167,16 @@ export default {
     handleSelectClause () {
       // 请添加一条标准
       if (!this.dataSource.length) {
-        this.$message.warning(this.$t('workCenter.standardInterpretationProcess.pleaseAddStandard'))
+        this.$message.warn(this.$t('workCenter.standardInterpretationProcess.pleaseAddStandard'))
         return
       }
       // 请选择分解单来源
       if (!this.dataSource[0].decompositionSource) {
-        this.$message.warning(this.$t('pleaseSelect') + this.$t('workCenter.standardInterpretationProcess.decompositionOrderSource'))
+        this.$message.warn(this.$t('pleaseSelect') + this.$t('workCenter.standardInterpretationProcess.decompositionOrderSource'))
         return
       }
+      // 如果有条款的表格，就清空然后隐藏
+      this.$refs.interpretationClauseTable && this.$refs.interpretationClauseTable.setData([])
       this.showClauseTable = true
       this.loading = true
       interpretGetClauseList({
@@ -248,10 +184,12 @@ export default {
         fileType: this.dataSource[0].decompositionSource
       }).then(res => {
         if (res.success) {
-          this.clauseDataSource = (res.result || []).map(item => {
+          const clauseDataSource = (res.result || []).map(item => {
             item.uuid = randomUUID()
             return item
           })
+          // 处理好数据把表格数据传给子组件
+          this.$refs.interpretationClauseTable.setData(clauseDataSource)
         }
       }).finally(() => {
         this.loading = false
@@ -261,6 +199,10 @@ export default {
     handleAddStandardCallback (list) {
       console.log(list)
       this.dataSource = list || []
+      this.decompositionSourceList = []
+      // 如果有条款的表格，就清空然后隐藏
+      this.$refs.interpretationClauseTable && this.$refs.interpretationClauseTable.setData([])
+      this.showClauseTable = false
       if (this.dataSource.length) {
         interpretGetFileByStandardId({ standardId: this.dataSource[0].id }).then(res => {
           if (res.success) {
@@ -276,71 +218,6 @@ export default {
       if (find) {
         this.dataSource.decompositionSource_dictText = find.text || find.title
       }
-    },
-    // 条款批量删除
-    handleClauseBatchDel () {
-      if (this.selectedClauseRowKeys.length <= 0) {
-        this.$message.warning(this.$t('selectARecord'))
-      } else {
-        const that = this
-        this.$confirm({
-          title: this.$t('confirmBatchDeletion'),
-          content: this.$t('deleteAData'),
-          onOk: () => {
-            this.clauseDataSource = this.clauseDataSource.filter(item => !this.selectedClauseRowKeys.includes(item.uuid))
-            this.selectedClauseRowKeys = []
-            // 重新计算分页问题
-            that.handleClauseReCalculatePage(that.selectedClauseRowKeys.length)
-          }
-        })
-      }
-    },
-    // 条款删除
-    handleClauseDelete (id) {
-      const that = this
-      this.$confirm({
-        title: this.$t('confirmDeletion'),
-        content: this.$t('areYouSure'),
-        onOk: () => {
-          const index = this.clauseDataSource.findIndex(item => item.uuid === id)
-          if (index !== -1) {
-            this.clauseDataSource.splice(index, 1)
-          }
-          if (that.clauseIpagination.current > 1 && ((that.clauseIpagination.current - 1) * that.clauseIpagination.pageSize) + 1 === that.clauseIpagination.total) {
-            that.clauseIpagination.current -= 1
-          }
-        }
-      })
-    },
-    // 删除后计算分页
-    handleClauseReCalculatePage (count) {
-      // 总数量-count
-      const total = this.clauseIpagination.total - count
-      // 获取删除后的分页数
-      const currentIndex = Math.ceil(total / this.clauseIpagination.pageSize)
-      // 删除后的分页数<所在当前页
-      if (currentIndex < this.clauseIpagination.current) {
-        this.clauseIpagination.current = currentIndex
-      }
-    },
-    // 勾选条款
-    onSelectClauseChange (keys) {
-      this.selectedClauseRowKeys = keys
-    },
-    /**
-     * 显示条款内容、条文解读弹框
-     * @param fieldName
-     * @param val
-     */
-    showContent (fieldName, val) {
-      const title = (this.clauseColumns.find(tt => tt.dbFieldName === fieldName) || {}).dbFieldTxt
-      if (title) {
-        this.$refs.splitClauseDetail.title = title
-      }
-      this.$refs.splitClauseDetail.open(val)
-    },
-    handleClauseTableChange (pagination, filters, sorter) {
-      this.clauseIpagination = pagination
     }
   }
 }
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInterpreterFillInfo.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInterpreterFillInfo.vue
index d0a1b7e..4af391f 100644
--- a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInterpreterFillInfo.vue
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationInterpreterFillInfo.vue
@@ -2,39 +2,8 @@
   <div>
     <a-spin :spinning="loading">
       <div class="process-part-title">{{ $t('dispatchInformation') }}</div>
-      <div v-if="!disabled" class="table-operator">
-        <!--  批量编辑(解读人填写信息节点)  -->
-        <a-button type="primary" ghost @click="handleBatchEdit" v-if="isInterpreterFillInfo">
-          {{$t('workCenter.standardInterpretationProcess.batchEdit')}}
-        </a-button>
-        <!--  导出(标准主解读人汇总节点)  -->
-        <a-button type="primary" ghost @click="handleExport" v-if="isStandardInterpreterSummary">
-          {{$t('export')}}
-        </a-button>
-      </div>
-      <div class="table-container mb-20">
-        <j-table
-          :can-drag="true"
-          :scroll="{x: '100%'}"
-          ref="table"
-          rowKey="id"
-          :columns="showColumns"
-          :dataSource="dataSource"
-          :pagination="ipagination"
-          :row-selection="isCheckNode ? null : { selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
-          @change="handleTableChange">
-          <!--条文内容-->
-          <template slot="item_content" slot-scope="{text, record}">
-            <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
-              {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
-            </div>
-            <div class="table-text" v-else>{{ global.emptyLine }}</div>
-          </template>
-          <template v-slot:action="{text, record}">
-            <a @click="handleEdit(record)" class="table-ope-btn">{{ $t('edit') }}</a>
-          </template>
-        </j-table>
-      </div>
+      <!-- 条款表格 -->
+      <interpretation-clause-table ref="interpretationClauseTable" :disabled="disabled" :current-node-id="currentNodeId"/>
       <a-form :form="form" :labelCol="labelCol" :wrapperCol="wrapperCol" v-if="isStandardInterpreterSummary">
         <a-row>
           <a-col :span="8">
@@ -74,22 +43,17 @@
         </a-row>
       </a-form>
     </a-spin>
-    <!-- 条款解读表单 -->
-    <terms-interpret-modal ref="termsInterpretModal" @ok="handleEditCallback"/>
-    <!--条文内容-->
-    <split-clause-detail ref="splitClauseDetail" />
   </div>
 </template>
 
 <script>
-import TermsInterpretModal from '@views/workCenter/standardInterpretationProcess/modules/TermsInterpretModal'
 import UserSelection from '@comp/selection/UserSelection'
-import SplitClauseDetail from '@views/documentTool/documentSplit/modules/SplitClauseDetail'
-import { filterObj } from '@/utils/util'
 import { StandardInterpretationNodes } from '@/enums/commonEnums'
+import InterpretationClauseTable
+  from '@views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable'
 export default {
   name: 'InterpretationInterpreterFillInfo',
-  components: { SplitClauseDetail, UserSelection, TermsInterpretModal },
+  components: { InterpretationClauseTable, UserSelection },
   props: {
     disabled: {
       type: Boolean,
@@ -103,38 +67,10 @@ export default {
     }
   },
   computed: {
-    // 解读人填写信息节点
-    isInterpreterFillInfo () {
-      return [
-        StandardInterpretationNodes.interpreterFillInfoOne.value,
-        StandardInterpretationNodes.interpreterFillInfoTwo.value
-      ].includes(this.currentNodeId)
-    },
     // 是否解读人汇总
     isStandardInterpreterSummary () {
       return this.currentNodeId === StandardInterpretationNodes.standardInterpreterSummary.value
-    },
-    // 是否审核节点
-    isCheckNode () {
-      const checkNodeArr = [
-        StandardInterpretationNodes.mainInterpreterSingleLineReview.value, // 标准主解读人单线审核
-        StandardInterpretationNodes.countersignOne.value, // 会签
-        StandardInterpretationNodes.countersignTwo.value, // 会签
-        StandardInterpretationNodes.departManagerReviewOne.value, // 各涉及部门科室经理审核
-        StandardInterpretationNodes.departManagerReviewTwo.value, // 各涉及部门科室经理审核
-        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalOne.value, // 主控部门高级经理/法规认证技术官批准
-        StandardInterpretationNodes.manageOrTechnicalOfficerApprovalTwo.value // 主控部门高级经理/法规认证技术官批准
-      ]
-      return checkNodeArr.includes(this.currentNodeId)
-    },
-    // 最终显示的表头
-    showColumns () {
-      // 审批节点不显示操作列
-      if (this.isCheckNode) {
-        return this.columns.slice(0, this.columns.length - 1)
-      }
-      return this.columns
-    },
+    }
   },
   data () {
     return {
@@ -149,263 +85,6 @@ export default {
         sm: { span: 16 }
       },
       loading: false,
-      // 条款解读表格
-      columns: [
-        { // 标准编号/条款号
-          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemNum',
-          fixed: 'left',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 标准名称/条款标题
-          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemTitle',
-          fixed: 'left',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 条款内容
-          title: this.$t('clauseContent'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemContent',
-          scopedSlots: { customRender: 'item_content' }
-        },
-        { // 译文
-          title: this.$t('workCenter.standardInterpretationProcess.translation'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'translation',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 是否与上一版相同
-          title: this.$t('workCenter.standardInterpretationProcess.sameAsPreviousVersion'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'isSameAsPrevVersion_dictText',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 相对上一版变化点说明
-          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: 'keywords',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关键控制器
-          title: this.$t('workCenter.standardInterpretationProcess.keyController'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'keyController',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 责任部门
-          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartment'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'responsibleDepartment',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 责任部门专业模块
-          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartmentModule'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'responsibleModule',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关联部门
-          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartments'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'relatedDepartment',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关联部门专业模块
-          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartmentsModule'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'relatedModule',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 适用车型
-          title: this.$t('workCenter.standardInterpretationProcess.applications'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'applications',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 动力类型
-          title: this.$t('workCenter.standardInterpretationProcess.powerType'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'powerType',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 专业领域
-          title: this.$t('workCenter.standardInterpretationProcess.professionalField'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'domainArea',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 配置需求
-          title: this.$t('workCenter.standardInterpretationProcess.configurationRequirements'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'configurationRequirements',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 新认证车实施日期
-          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',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 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' }
-        },
-        { // 操作
-          title: this.$t('operation'),
-          fixed: 'right',
-          width: 150,
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      dataSource: [],
-      /* 分页参数 */
-      ipagination: {
-        current: 1,
-        pageSize: 50,
-        pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
-        showTotal: (total, range) => {
-          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0
-      },
-      selectedRowKeys: [],
-      selectedRows: [],
       formInline: {},
       validatorRules: {
         // 会签人员
@@ -429,7 +108,7 @@ export default {
           ],
           validateTrigger: 'change'
         }
-      },
+      }
     }
   },
   methods: {
@@ -465,61 +144,12 @@ export default {
         this.form.setFieldsValue(this.formInline)
       }
       this.dataSource = data.data.processStandardInterpretClauseSublistList || []
-    },
-    handleEdit (record) {
-      this.$refs.termsInterpretModal.title = this.$t('workCenter.standardInterpretationProcess.batchEdit')
-      this.$refs.termsInterpretModal.edit(record)
-    },
-    // 批量编辑
-    handleBatchEdit () {
-      // 至少勾选一条数据
-      if (!this.selectedRowKeys.length) {
-        this.$message.warning(this.$t('selectARecord'))
-        return
-      }
-      this.$refs.termsInterpretModal.add()
-    },
-    // 表格编辑的回调函数
-    handleEditCallback (formData) {
-      console.log('编辑', formData)
-      // 如果有id就是编辑，否则是批量编辑
-      if (formData.id) {
-        const row = this.dataSource.find(item => item.id === formData.id)
-        Object.assign(row, filterObj(formData))
-      } else {
-        this.selectedRows.forEach(item => {
-          Object.assign(item, filterObj(formData))
-        })
-      }
-    },
-    handleTableChange (pagination) {
-      this.ipagination = pagination
-    },
-    /**
-     * 显示条款内容、条文解读弹框
-     * @param fieldName
-     * @param val
-     */
-    showContent (fieldName, val) {
-      const title = (this.columns.find(tt => tt.dbFieldName === fieldName) || {}).dbFieldTxt
-      if (title) {
-        this.$refs.splitClauseDetail.title = title
-      }
-      this.$refs.splitClauseDetail.open(val)
-    },
-    // 表格选择改变
-    onSelectChange (value, row) {
-      this.selectedRowKeys = value
-      this.selectedRows = row
-    },
-    // 导出
-    handleExport () {
-
+      this.$refs.interpretationClauseTable.setData(this.dataSource)
     },
     // 选择用户回显用户名
     userSelectNameChange (value, fieldName) {
       this.formInline[fieldName + '_dictText'] = value
-    },
+    }
   }
 }
 </script>
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationLiaisonDistribute.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationLiaisonDistribute.vue
index f176934..70408b2 100644
--- a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationLiaisonDistribute.vue
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationLiaisonDistribute.vue
@@ -2,36 +2,8 @@
   <div>
     <a-spin :spinning="loading">
       <div class="process-part-title">{{ $t('dispatchInformation') }}</div>
-      <div v-if="!disabled" class="table-operator">
-        <!--  批量删除条款  -->
-        <a-button icon="delete" type="danger" ghost @click="handleClauseBatchDel">
-          {{ $t('batchDelete') }}
-        </a-button>
-      </div>
-      <div class="mb-20">
-        <j-table
-          :can-drag="true"
-          :scroll="{x: '100%'}"
-          ref="table"
-          rowKey="id"
-          :columns="clauseColumns"
-          :dataSource="clauseDataSource"
-          :pagination="clauseIpagination"
-          :row-selection="{ selectedRowKeys: selectedClauseRowKeys, onChange: onSelectClauseChange }"
-          @change="handleClauseTableChange">
-          <!--条文内容-->
-          <template slot="item_content" slot-scope="{text, record}">
-            <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
-              {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
-            </div>
-            <div class="table-text" v-else>{{ global.emptyLine }}</div>
-          </template>
-
-          <template v-slot:action="{text, record}">
-            <a @click="handleClauseDelete(record.id)" class="table-ope-btn">{{ $t('delete') }}</a>
-          </template>
-        </j-table>
-      </div>
+      <!-- 条款的表格 -->
+      <interpretation-clause-table ref="interpretationClauseTable" :disabled="disabled" :current-node-id="currentNodeId"/>
       <a-form :form="form" :labelCol="labelCol" :wrapperCol="wrapperCol">
         <a-row>
           <a-col :span="8">
@@ -48,18 +20,22 @@
         </a-row>
       </a-form>
     </a-spin>
-    <!--条文内容-->
-    <split-clause-detail ref="splitClauseDetail" />
   </div>
 </template>
 
 <script>
-import SplitClauseDetail from '@views/documentTool/documentSplit/modules/SplitClauseDetail'
 import UserSelection from '@comp/selection/UserSelection'
+import InterpretationClauseTable
+  from '@views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable'
 export default {
   name: 'InterpretationLiaisonDistribute',
-  components: { UserSelection, SplitClauseDetail },
+  components: { InterpretationClauseTable, UserSelection },
   props: {
+    // 当前节点
+    currentNodeId: {
+      type: String,
+      required: true
+    },
     disabled: {
       type: Boolean,
       required: false,
@@ -78,49 +54,6 @@ export default {
         xs: { span: 24 },
         sm: { span: 16 }
       },
-      clauseColumns: [
-        { // 标准编号/条款号
-          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemNum',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 标准名称/条款标题
-          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemTitle',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 条款内容
-          title: this.$t('clauseContent'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemContent',
-          scopedSlots: { customRender: 'item_content' }
-        },
-        { // 操作
-          title: this.$t('operation'),
-          fixed: 'right',
-          width: 150,
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      clauseDataSource: [],
-      /* 分页参数 */
-      clauseIpagination: {
-        current: 1,
-        pageSize: 10,
-        pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
-        showTotal: (total, range) => {
-          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0
-      },
-      selectedClauseRowKeys: [],
       validatorRules: {
         // 主解读人
         masterInterpretId: {
@@ -151,80 +84,16 @@ export default {
         obj.formData = this.form.getFieldsValue()
       }
       // 条款列表
-      obj.clauseData = this.clauseDataSource
+      obj.clauseData = this.$refs.interpretationClauseTable.getData()
       return obj
     },
     // 更新组件内的数据
     setData (data) {
       this.clauseDataSource = data.data.processStandardInterpretClauseList || []
+      this.$refs.interpretationClauseTable.setData(this.clauseDataSource)
       this.formInline = data.data.processStandardInterpret
       this.form.setFieldsValue(this.formInline)
     },
-    // 条款批量删除
-    handleClauseBatchDel () {
-      if (this.selectedClauseRowKeys.length <= 0) {
-        this.$message.warning(this.$t('selectARecord'))
-      } else {
-        const that = this
-        this.$confirm({
-          title: this.$t('confirmBatchDeletion'),
-          content: this.$t('deleteAData'),
-          onOk: () => {
-            this.clauseDataSource = this.clauseDataSource.filter(item => !this.selectedClauseRowKeys.includes(item.id))
-            this.selectedClauseRowKeys = []
-            // 重新计算分页问题
-            that.handleClauseReCalculatePage(that.selectedClauseRowKeys.length)
-          }
-        })
-      }
-    },
-    // 条款删除
-    handleClauseDelete (id) {
-      const that = this
-      this.$confirm({
-        title: this.$t('confirmDeletion'),
-        content: this.$t('areYouSure'),
-        onOk: () => {
-          const index = this.clauseDataSource.findIndex(item => item.id === id)
-          if (index !== -1) {
-            this.clauseDataSource.splice(index, 1)
-          }
-          if (that.clauseIpagination.current > 1 && ((that.clauseIpagination.current - 1) * that.clauseIpagination.pageSize) + 1 === that.clauseIpagination.total) {
-            that.clauseIpagination.current -= 1
-          }
-        }
-      })
-    },
-    // 删除后计算分页
-    handleClauseReCalculatePage (count) {
-      // 总数量-count
-      const total = this.clauseIpagination.total - count
-      // 获取删除后的分页数
-      const currentIndex = Math.ceil(total / this.clauseIpagination.pageSize)
-      // 删除后的分页数<所在当前页
-      if (currentIndex < this.clauseIpagination.current) {
-        this.clauseIpagination.current = currentIndex
-      }
-    },
-    // 勾选条款
-    onSelectClauseChange (keys) {
-      this.selectedClauseRowKeys = keys
-    },
-    /**
-     * 显示条款内容、条文解读弹框
-     * @param fieldName
-     * @param val
-     */
-    showContent (fieldName, val) {
-      const title = (this.clauseColumns.find(tt => tt.dbFieldName === fieldName) || {}).dbFieldTxt
-      if (title) {
-        this.$refs.splitClauseDetail.title = title
-      }
-      this.$refs.splitClauseDetail.open(val)
-    },
-    handleClauseTableChange (pagination, filters, sorter) {
-      this.clauseIpagination = pagination
-    },
     // 选择用户回显用户名
     userSelectNameChange (value, fieldName) {
       this.formInline[fieldName + '_dictText'] = value
diff --git a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationMainInterpreterDistribute.vue b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationMainInterpreterDistribute.vue
index 3206b4b..ec7178d 100644
--- a/src/views/workCenter/standardInterpretationProcess/modules/InterpretationMainInterpreterDistribute.vue
+++ b/src/views/workCenter/standardInterpretationProcess/modules/InterpretationMainInterpreterDistribute.vue
@@ -33,108 +33,9 @@
       <!-- 确认下一步展示 -->
       <template v-if="isNextStep">
         <div class="process-part-title">{{ $t('dispatchInformation') }}</div>
-        <!-- 分发的部分 -->
-        <template v-if="isDistribute">
-          <div v-if="!disabled" class="table-operator">
-            <!--  批量选择人员  -->
-            <a-button icon="plus" type="primary" @click="handleClauseBatchSelectUser">
-              {{$t('workCenter.standardInterpretationProcess.batchSelectionUser')}}
-            </a-button>
-            <!--  导出  -->
-            <a-button icon="upload" type="primary" ghost @click="handleExportClause('条款')">
-              {{ $t('export') }}
-            </a-button>
-            <!--  批量删除  -->
-            <a-button icon="delete" type="danger" ghost @click="handleClauseBatchDel">
-              {{$t('batchDelete')}}
-            </a-button>
-          </div>
-          <div class="table-container mb-20">
-            <j-table
-              :can-drag="true"
-              :scroll="{x: '100%'}"
-              ref="table"
-              rowKey="id"
-              :columns="clauseDistributeColumns"
-              :dataSource="clauseDataSource"
-              :pagination="clauseIpagination"
-              :row-selection="{ selectedRowKeys: selectedClauseRowKeys, onChange: onSelectClauseChange }"
-              @change="handleClauseTableChange">
-              <!--条文内容-->
-              <template slot="item_content" slot-scope="{text, record}">
-                <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
-                  {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
-                </div>
-                <div class="table-text" v-else>{{ global.emptyLine }}</div>
-              </template>
-              <!--各涉及部门解读人-->
-              <template slot="interpretPersonIds" slot-scope="{text, record, index}">
-                <user-selection :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.departInterpretingPeople')"
-                                v-model="record.interpretPersonIds"
-                                :disabled="disabled"
-                                filedName="interpretPersonIds"
-                                @nameChange="(...arg) => userSelectNameChange(...arg, index)"
-                                type="checkbox"
-                                :nameStr="record.interpretPersonIds_dictText" />
-              </template>
-
-              <template v-slot:action="{text, record}">
-                <a @click="handleClauseDelete(record.id)" class="table-ope-btn">{{ $t('delete') }}</a>
-              </template>
-            </j-table>
-          </div>
-        </template>
-        <!-- 不分发的部分 -->
-        <template v-else-if="isDistribute === false">
-          <div v-if="!disabled" class="table-operator">
-            <!--  导入  -->
-            <a-button icon="plus" type="primary" @click="handleClauseImport">
-              {{$t('import')}}
-            </a-button>
-            <!--  导出  -->
-            <a-button icon="upload" type="primary" ghost @click="handleExportClause('条款')">
-              {{ $t('export') }}
-            </a-button>
-            <!--  批量删除  -->
-            <a-button icon="delete" type="danger" ghost @click="handleClauseBatchDel">
-              {{$t('batchDelete')}}
-            </a-button>
-          </div>
-          <div class="table-container mb-20">
-            <j-table
-              :can-drag="true"
-              :scroll="{x: '100%'}"
-              ref="table"
-              rowKey="id"
-              :columns="clauseNoDistributeColumns"
-              :dataSource="clauseDataSource"
-              :pagination="clauseIpagination"
-              :row-selection="{ selectedRowKeys: selectedClauseRowKeys, onChange: onSelectClauseChange }"
-              @change="handleClauseTableChange">
-              <!--条文内容-->
-              <template slot="item_content" slot-scope="{text, record}">
-                <div class="table-text" style="cursor: pointer" v-if="text || text === 0" @click="showContent('item_content', text,record)">
-                  {{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
-                </div>
-                <div class="table-text" v-else>{{ global.emptyLine }}</div>
-              </template>
-              <!--各涉及部门解读人-->
-              <template slot="interpretPersonIds" slot-scope="{text, record, index}">
-                <user-selection :placeholder="$t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.departInterpretingPeople')"
-                                v-model="record.interpretPersonIds"
-                                :disabled="disabled"
-                                filedName="interpretPersonIds"
-                                @nameChange="(...arg) => tableUserSelectNameChange(...arg, index)"
-                                type="checkbox"
-                                :nameStr="record.interpretPersonIds_dictText" />
-              </template>
-              <template v-slot:action="{text, record}">
-                <a @click="handleClauseEdit(record.id)" class="table-ope-btn">{{ $t('edit') }}</a>
-                <a-divider type="vertical" />
-                <a @click="handleClauseDelete(record.id)" class="table-ope-btn">{{ $t('delete') }}</a>
-              </template>
-            </j-table>
-          </div>
+        <interpretation-clause-table ref="interpretationClauseTable" :disabled="disabled" :current-node-id="currentNodeId" :is-distribute="isDistribute"/>
+        <!-- 不分发的表单 -->
+        <template v-if="!isDistribute">
           <a-form :form="userForm" :labelCol="labelCol" :wrapperCol="wrapperCol">
             <a-row>
               <a-col :span="8">
@@ -176,21 +77,22 @@
         </template>
       </template>
     </a-spin>
-    <!--条文内容-->
-    <split-clause-detail ref="splitClauseDetail" />
-    <!--批量选择人员-->
-    <user-select-modal type="checkbox" ref="userSelectModal" check-required @listChange="handleClauseBatchSelectUserCallback" />
   </div>
 </template>
 
 <script>
 import UserSelection from '@comp/selection/UserSelection'
-import SplitClauseDetail from '@views/documentTool/documentSplit/modules/SplitClauseDetail'
-import UserSelectModal from '@comp/selection/UserSelectModal'
+import InterpretationClauseTable
+  from '@views/workCenter/standardInterpretationProcess/modules/InterpretationClauseTable'
 export default {
   name: 'InterpretationMainInterpreterDistribute',
-  components: { UserSelectModal, SplitClauseDetail, UserSelection },
+  components: { InterpretationClauseTable, UserSelection },
   props: {
+    // 当前节点
+    currentNodeId: {
+      type: String,
+      required: true
+    },
     disabled: {
       type: Boolean,
       required: false,
@@ -250,14 +152,14 @@ export default {
           title: this.$t('newProductionVehicleImplementationDate'),
           align: 'center',
           width: 180,
-          dataIndex: 'newProductionImplementation',
+          dataIndex: 'newProductImplDate',
           scopedSlots: { customRender: 'text' }
         },
         { // 新认证车实施日期
           title: this.$t('newCertifiedVehicleImplementationDate'),
           align: 'center',
           width: 180,
-          dataIndex: 'newCerImplementDate',
+          dataIndex: 'newAuthImplDate',
           scopedSlots: { customRender: 'text' }
         }
       ],
@@ -297,308 +199,67 @@ export default {
       // 是否点击下一步
       isNextStep: false,
       // 是否下发 (true是, false否, null未选择)
-      isDistribute: null,
-      showClauseTable: false,
-      // 条款分发
-      clauseDistributeColumns: [
-        { // 标准编号/条款号
-          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemNum',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 标准名称/条款标题
-          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemTitle',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 条款内容
-          title: this.$t('clauseContent'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemContent',
-          scopedSlots: { customRender: 'item_content' }
-        },
-        { // 各涉及部门解读人
-          title: this.$t('workCenter.standardInterpretationProcess.departInterpretingPeople'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'interpretPersonIds',
-          scopedSlots: { customRender: 'interpretPersonIds' }
-        },
-        { // 操作
-          title: this.$t('operation'),
-          fixed: 'right',
-          width: 150,
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      // 条款不分发
-      clauseNoDistributeColumns: [
-        { // 标准编号/条款号
-          title: this.$t('standardNumber') + '/' + this.$t('clauseNo'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemNum',
-          fixed: 'left',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 标准名称/条款标题
-          title: this.$t('standardName') + '/' + this.$t('clauseTitle'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemTitle',
-          fixed: 'left',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 条款内容
-          title: this.$t('clauseContent'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'itemContent',
-          scopedSlots: { customRender: 'item_content' }
-        },
-        { // 译文
-          title: this.$t('workCenter.standardInterpretationProcess.translation'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'translation',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 是否与上一版相同
-          title: this.$t('workCenter.standardInterpretationProcess.sameAsPreviousVersion'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'isSameAsPrevVersion_dictText',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 相对上一版变化点说明
-          title: this.$t('workCenter.standardInterpretationProcess.explanationOfChangePoints'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'changeDescription',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 专业领域
-          title: this.$t('workCenter.standardInterpretationProcess.professionalField'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'regulatoryNotes',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 新认证车实施日期
-          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.regulatoryAnnotations'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'registrationDate',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 涉及系统/部件
-          title: this.$t('workCenter.standardInterpretationProcess.involvingSystemsComponents'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'keywords',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关键控制器
-          title: this.$t('workCenter.standardInterpretationProcess.keyController'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'keyController',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 责任部门
-          title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartment'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'responsibleDepartment',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 关联部门
-          title: this.$t('workCenter.standardInterpretationProcess.relatedDepartments'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'relatedDepartment',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 适用车型
-          title: this.$t('workCenter.standardInterpretationProcess.applications'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'applications',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 动力类型
-          title: this.$t('workCenter.standardInterpretationProcess.powerType'),
-          align: 'center',
-          width: 180,
-          dataIndex: 'powerType',
-          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',
-          scopedSlots: { customRender: 'text' }
-        },
-        { // 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' }
-        },
-        { // 操作
-          title: this.$t('operation'),
-          fixed: 'right',
-          width: 150,
-          scopedSlots: { customRender: 'action' }
-        }
-      ],
-      clauseDataSource: [],
-      /* 分页参数 */
-      clauseIpagination: {
-        current: 1,
-        pageSize: 10,
-        pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
-        showTotal: (total, range) => {
-          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
-        },
-        showQuickJumper: true,
-        showSizeChanger: true,
-        total: 0
-      },
-      selectedClauseRowKeys: [],
-      selectedClauseRows: []
+      isDistribute: null
     }
   },
   methods: {
-    async getData (isValidate) {
-      const obj = {}
-      if (isValidate) {
-        obj.formData = await new Promise((resolve) => {
-          this.form.validateFields((err, values) => {
-            if (err) { obj._flag = true }
-            // 校验成功失败都返回表单数据
-            resolve(values)
-          })
+    /**
+     * 校验表单 必定返回成功的promise，携带表单的参数
+     * @param form
+     * @return {Promise<resolve>}
+     */
+    validateFormPromise (form) {
+      return new Promise((resolve) => {
+        form.validateFields((err, values) => {
+          resolve({ err, values })
         })
-        // 选择是否分发，校验是否下一步
+      })
+    },
+    async getData (isValidate) {
+      const obj = {
+        formData: {}, // 表单的数据
+        clauseData: [] // 条款的表格
+      }
+      if (isValidate) {
+        // 校验是否分发
+        const formObj = await this.validateFormPromise(this.form)
+        if (formObj.err) { obj._flag = true }
+        Object.assign(obj.formData, formObj.values)
+
+        // 没有下一步就提示
         if (!this.isNextStep) {
           obj._flag = true
           this.$message.warn(this.$t('workCenter.standardInterpretationProcess.pleaseSelectTheNextStep'))
-        }
-        // 如果有没填各涉及部门解读人，提示请完善表格信息
-        if (this.clauseDataSource.some(item => !item.interpretPersonIds)) {
-          obj._flag = true
-          this.$message.warn(this.$t('pleaseCompleteTableInfo'))
+        } else {
+          // 只要下一步了，对新增的部分进行校验
+          obj.clauseData = this.$refs.interpretationClauseTable.getData()
+          // 至少一条条款数据
+          if (!obj.clauseData.length) {
+            this.$message.warn('addAtLeastOneRowOfData')
+            obj._flag = true
+          } else if (this.isDistribute && !obj.clauseData.some(item => item.interpretPersonIds)) {
+            // 有数据且选分发时候校验 至少一条数据选择解读人
+            this.$message.warn(this.$t('workCenter.standardInterpretationProcess.pleaseSelectInterpreter'))
+            obj._flag = true
+          } else if (!this.isDistribute) {
+            // 有数据且不分发时校验用户表单
+            const userFormObj = await this.validateFormPromise(this.userForm)
+            if (userFormObj.err) { obj._flag = true }
+            Object.assign(obj.formData, userFormObj.values)
+          }
         }
       } else {
-        obj.formData = this.form.getFieldsValue()
+        // 不需要校验，直接获取各部分数据
+        Object.assign({}, this.form.getFieldsValue())
+        // 选择下一步，获取新增部分的数据
+        if (this.isNextStep) {
+          obj.clauseData = this.$refs.interpretationClauseTable.getData()
+          // 并且是不分发，就获取表单数据
+          if (!this.isDistribute) {
+            Object.assign(obj.formData, this.userForm.getFieldsValue())
+          }
+        }
       }
-      obj.clauseData = this.clauseDataSource
       return obj
     },
     setData (data) {
@@ -606,6 +267,19 @@ export default {
       this.dataSource = [data.data.processStandardInterpret]
       this.formInline = data.data.processStandardInterpret
       this.clauseDataSource = data.data.processStandardInterpretClauseList
+      // 是否下发
+      if (data.isDistribute === '1') {
+        this.isDistribute = true
+      } else if (data.isDistribute === '2') {
+        this.isDistribute = false
+      }
+      // 是否下发有值就自动带入下一步，并回显数据
+      if (data.isDistribute) {
+        this.isNextStep = true
+        this.$nextTick(() => {
+          this.$refs.interpretationClauseTable.setData(this.clauseDataSource)
+        })
+      }
     },
     // 下一步
     handleNextStep () {
@@ -613,112 +287,16 @@ export default {
         if (!err) {
           this.isDistribute = values.isDistribute === '1'
           this.isNextStep = true
+          this.$nextTick(() => {
+            this.$refs.interpretationClauseTable.setData(this.clauseDataSource)
+          })
         }
       })
     },
-    // 导入
-    handleClauseImport () {
-
-    },
-    // 条款导出
-    handleExportClause () {
-
-    },
-    // 条款批量删除
-    handleClauseBatchDel () {
-      if (this.selectedClauseRowKeys.length <= 0) {
-        this.$message.warning(this.$t('selectARecord'))
-      } else {
-        const that = this
-        this.$confirm({
-          title: this.$t('confirmBatchDeletion'),
-          content: this.$t('deleteAData'),
-          onOk: () => {
-            this.clauseDataSource = this.clauseDataSource.filter(item => !this.selectedClauseRowKeys.includes(item.id))
-            this.clauseIpagination.total = this.clauseDataSource.length
-            this.selectedClauseRowKeys = []
-            this.selectedClauseRows = []
-            // 重新计算分页问题
-            that.handleClauseReCalculatePage(that.selectedClauseRowKeys.length)
-          }
-        })
-      }
-    },
-    // 条款编辑
-    handleClauseEdit () {
-
-    },
-    // 条款删除
-    handleClauseDelete (id) {
-      const that = this
-      this.$confirm({
-        title: this.$t('confirmDeletion'),
-        content: this.$t('areYouSure'),
-        onOk: () => {
-          const index = this.clauseDataSource.findIndex(item => item.id === id)
-          if (index !== -1) {
-            this.clauseDataSource.splice(index, 1)
-          }
-          if (that.clauseIpagination.current > 1 && ((that.clauseIpagination.current - 1) * that.clauseIpagination.pageSize) + 1 === that.clauseIpagination.total) {
-            that.clauseIpagination.current -= 1
-          }
-        }
-      })
-    },
-    // 删除后计算分页
-    handleClauseReCalculatePage (count) {
-      // 总数量-count
-      const total = this.clauseIpagination.total - count
-      // 获取删除后的分页数
-      const currentIndex = Math.ceil(total / this.clauseIpagination.pageSize)
-      // 删除后的分页数<所在当前页
-      if (currentIndex < this.clauseIpagination.current) {
-        this.clauseIpagination.current = currentIndex
-      }
-    },
-    // 勾选条款
-    onSelectClauseChange (keys, rows) {
-      this.selectedClauseRowKeys = keys
-      this.selectedClauseRows = rows
-    },
-    /**
-     * 显示条款内容、条文解读弹框
-     * @param fieldName
-     * @param val
-     */
-    showContent (fieldName, val) {
-      const columns = this.isDistribute ? this.clauseDistributeColumns : this.clauseNoDistributeColumns
-      const title = (columns.find(tt => tt.dbFieldName === fieldName) || {}).dbFieldTxt
-      if (title) {
-        this.$refs.splitClauseDetail.title = title
-      }
-      this.$refs.splitClauseDetail.open(val)
-    },
-    handleClauseTableChange (pagination, filters, sorter) {
-      this.clauseIpagination = pagination
-    },
-    // 表格选择用户回显用户名
-    tableUserSelectNameChange (value, fieldName, index) {
-      this.clauseDataSource[index][fieldName + '_dictText'] = value
-    },
     // 选择用户回显用户名
     userSelectNameChange (value, fieldName) {
       this.formInline[fieldName + '_dictText'] = value
-    },
-    // 批量选择人员
-    handleClauseBatchSelectUser () {
-      this.$refs.userSelectModal.open()
-    },
-    // 批量选择人员回调
-    handleClauseBatchSelectUserCallback (userList) {
-      const ids = userList.map(item => item.id).join(',')
-      const names = userList.map(item => `${item.realname}(${item.username})`).join(',')
-      this.selectedClauseRows.forEach(item => {
-        item.interpretPersonIds = ids
-        item.interpretPersonIds_dictText = names
-      })
     }
-
   }
 }
 </script>