926 lines
35 KiB
Vue
926 lines
35 KiB
Vue
<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"
|
||
:data="importParams"
|
||
:disabled="disabledImport"
|
||
name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importUrl"
|
||
@change="handleImport">
|
||
<a-button type="primary" icon="download" :disabled="disabledImport" ghost>{{ $t('import') }}</a-button>
|
||
</a-upload>
|
||
<!-- 批量编辑（解读人填写） -->
|
||
<a-button type="primary" ghost @click="handleBatchEdit" v-if="showBatchEditBtn">
|
||
{{$t('workCenter.standardInterpretationProcess.batchEdit')}}
|
||
</a-button>
|
||
<!-- 导出 -->
|
||
<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="disabled ? '' : ($t('pleaseSelect')+$t('workCenter.standardInterpretationProcess.departInterpretingPeople'))"
|
||
v-model="record.interpretPersonIds"
|
||
:disabled="disabled"
|
||
filedName="interpretPersonIds"
|
||
@nameChange="(value, fieldName) => tableUserSelectNameChange(value, fieldName, index)"
|
||
type="checkbox"
|
||
:showBtn="false"
|
||
: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 { 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
|
||
},
|
||
// 导入的参数
|
||
importParams: {
|
||
type: Object,
|
||
default: () => ({}),
|
||
required: false
|
||
},
|
||
// 是否禁用导入
|
||
disabledImport: {
|
||
type: Boolean,
|
||
default: false,
|
||
required: false
|
||
},
|
||
// 标准信息
|
||
standardInfo: {
|
||
type: Object,
|
||
default: () => ({}),
|
||
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.interpreter'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'interpretPersonId_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_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 关键控制器
|
||
title: this.$t('workCenter.standardInterpretationProcess.keyController'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'keyController_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 责任部门
|
||
title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartment'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'responsibleDepartment_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 责任部门专业模块
|
||
title: this.$t('workCenter.standardInterpretationProcess.responsibleDepartmentModule'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'responsibleModule_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 关联部门
|
||
title: this.$t('workCenter.standardInterpretationProcess.relatedDepartments'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'relatedDepartment_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 关联部门专业模块
|
||
title: this.$t('workCenter.standardInterpretationProcess.relatedDepartmentsModule'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'relatedModule_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 适用车型
|
||
title: this.$t('workCenter.standardInterpretationProcess.applications'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'applications_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 动力类型
|
||
title: this.$t('workCenter.standardInterpretationProcess.powerType'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'powerType_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 专业领域
|
||
title: this.$t('workCenter.standardInterpretationProcess.professionalField'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'domainArea_dictText',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
{ // 配置需求
|
||
title: this.$t('workCenter.standardInterpretationProcess.configurationRequirements'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'configurationRequirements_dictText',
|
||
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_dictText',
|
||
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: [],
|
||
processAllDelIds: [], // 记录所有删除过的id，后端需要
|
||
url: {
|
||
// 导入
|
||
importExcelUrl: '/process/standardInterpretFlow/importExcelByUnDistribute',
|
||
// 标准主解读人节点选择分发的导出
|
||
exportDistribute: '/process/standardInterpretFlow/exportExcelByDistribute',
|
||
// 标准主解读人节点选择不分发的导出
|
||
exportUnDistribute: '/process/standardInterpretFlow/exportExcelByUnDistribute'
|
||
}
|
||
}
|
||
},
|
||
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.interpreterFillInfo.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 (!this.disabled && !noActionCoumnsNodes.includes(this.currentNodeId)) {
|
||
columns.push(this.actionColumn)
|
||
}
|
||
return columns
|
||
},
|
||
// 是否主解读人分发节点
|
||
isMainInterpreterDistribute () {
|
||
return mainInterpreterDistributeNodes.includes(this.currentNodeId)
|
||
},
|
||
// 是否重新分发节点（列表数据可以删空代表不分发）
|
||
isReDistribute () {
|
||
return this.currentNodeId === StandardInterpretationNodes.standardInterpreterReDistribution.value
|
||
},
|
||
// 显示导出按钮
|
||
showExportBtn () {
|
||
return [
|
||
...mainInterpreterDistributeNodes, // 标准主解读人分发节点
|
||
StandardInterpretationNodes.standardInterpreterSummary.value // 标准主解读人汇总
|
||
].includes(this.currentNodeId)
|
||
},
|
||
// 显示批量删除按钮
|
||
showBatchDelBtn () {
|
||
return [
|
||
StandardInterpretationNodes.initiated.value, // 法规工程师发起
|
||
StandardInterpretationNodes.controlDepartLiaisonDistribution.value, // 主控部门联络人分发
|
||
...mainInterpreterDistributeNodes // 标准主解读人分发节点
|
||
].includes(this.currentNodeId)
|
||
},
|
||
// 显示批量编辑按钮
|
||
showBatchEditBtn () {
|
||
return [
|
||
StandardInterpretationNodes.interpreterFillInfo.value // 解读人填写信息
|
||
].includes(this.currentNodeId)
|
||
},
|
||
// 是否显示编辑按钮
|
||
showEditBtn () {
|
||
// 标准主解读人分发节点 && 不分发 显示编辑按钮
|
||
if (this.isMainInterpreterDistribute && !this.isDistribute) {
|
||
return true
|
||
}
|
||
return [
|
||
StandardInterpretationNodes.interpreterFillInfo.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.map(item => {
|
||
// 没有id就添加uuid，和标记，最后返回的时候去掉
|
||
if (!item.id) {
|
||
item.id = randomUUID()
|
||
item[uuidFlag] = true
|
||
}
|
||
return item
|
||
})
|
||
this.ipagination.total = this.dataSource.length
|
||
},
|
||
// 获取组件内数据
|
||
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: this.$t('tips'),
|
||
content: <span>{this.$t('importTip')} <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} ${this.$t('fileUploadSuccess')}`)
|
||
}
|
||
// 前端存储，没有id的数据，前端加上uuid
|
||
const data = info.file.response.result || []
|
||
// 删除之前的数据，覆盖重新导入的
|
||
this.processAllDelIds.push(...this.dataSource.map(item => item[this.rowKey]))
|
||
this.dataSource = data.map(item => {
|
||
// 导入的时候生成前端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(`${this.$t('fileUploadFailed')}: ${info.file.msg} `)
|
||
}
|
||
}
|
||
},
|
||
// 导出
|
||
handleExport (fileName, fileSuffix = '.xlsx') {
|
||
const { standardNumber, standardName } = this.standardInfo || {}
|
||
if (this.isDistribute) {
|
||
// 分发：编号 + 名称 + 解读分发
|
||
fileName = `${standardNumber} ${standardName}-${this.$t('workCenter.standardInterpretationProcess.interpretationDistribution')}`
|
||
} else {
|
||
// 不分发和汇总：编号 + 名称 + 解读表
|
||
fileName = `${standardNumber} ${standardName}-${this.$t('workCenter.standardInterpretationProcess.interpretationTable')}`
|
||
}
|
||
const param = {
|
||
projectId: this.$route.query.projectId,
|
||
nodeId: this.$route.query.nodeId,
|
||
taskId: this.$route.query.taskId
|
||
}
|
||
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
|
||
param.selections = this.selectedRowKeys.join(',')
|
||
}
|
||
console.log('导出参数', param, fileName)
|
||
// 加一个大的提示
|
||
const modalLoading = this.$info({
|
||
title: this.$t('tips'),
|
||
content: <span>{this.$t('exportTip')} <a-spin size="small" /></span>,
|
||
keyboard: false,
|
||
// 不显示 知道了 按钮
|
||
okButtonProps: {
|
||
style: 'display: none'
|
||
}
|
||
})
|
||
// 汇总节点也用不分发的导出
|
||
let url = this.url.exportUnDistribute
|
||
// 解读人分发节点
|
||
if (this.isMainInterpreterDistribute) {
|
||
// 根据是否分发选择对应的接口
|
||
url = this.isDistribute ? this.url.exportDistribute : this.url.exportUnDistribute
|
||
}
|
||
downFile(url, param).then((data) => {
|
||
if (!data) {
|
||
this.$message.warning(this.$t('fileDownloadFail'))
|
||
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('pleaseSelectDistributeData'))
|
||
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
|
||
})
|
||
this.onClearSelected()
|
||
},
|
||
/**
|
||
* 编辑
|
||
*/
|
||
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 = formData
|
||
// 有id就是编辑，没有就是批量编辑
|
||
if (formData[this.rowKey]) {
|
||
const row = this.dataSource.find(item => item[this.rowKey] === formData[this.rowKey])
|
||
Object.assign(row, form)
|
||
} else {
|
||
this.selectionRows.forEach(item => {
|
||
Object.assign(item, form)
|
||
})
|
||
}
|
||
this.onClearSelected()
|
||
this.$forceUpdate()
|
||
},
|
||
/**
|
||
* 删除
|
||
* @param id - 删除数据的id
|
||
*/
|
||
handleDelete (id) {
|
||
// 判断不能删除所有数据（重新分发节点可以删空）
|
||
if (!this.isReDistribute && (this.dataSource.length <= 1)) {
|
||
this.$message.warning(this.$t('tableDataDisabledClear'))
|
||
return
|
||
}
|
||
const that = this
|
||
this.$confirm({
|
||
title: this.$t('confirmDeletion'),
|
||
content: this.$t('areYouSure'),
|
||
onOk: () => {
|
||
that.processAllDelIds.push(id)
|
||
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.isReDistribute && (this.selectedRowKeys.length === this.dataSource.length)) {
|
||
this.$message.warning(this.$t('tableDataDisabledClear'))
|
||
return
|
||
}
|
||
// 至少勾选一条数据
|
||
if (!this.selectedRowKeys.length) {
|
||
this.$message.warning(this.$t('pleaseSelectDeleteData'))
|
||
return
|
||
}
|
||
const that = this
|
||
this.$confirm({
|
||
title: this.$t('confirmBatchDeletion'),
|
||
content: this.$t('deleteAData'),
|
||
onOk: () => {
|
||
this.processAllDelIds.push(...this.selectedRowKeys)
|
||
this.dataSource = this.dataSource.filter(item => !this.selectedRowKeys.includes(item[this.rowKey]))
|
||
// 重新计算分页问题
|
||
that.reCalculatePage(that.selectedRowKeys.length)
|
||
this.ipagination.total = this.dataSource.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>
|