QR/laws_chery_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update 拆分] 译文改成多字段

Browse Source
This commit is contained in:
danshihao
2024-08-01 17:09:00 +08:00
parent 02b30517c4
commit 88b02e25cc
1 changed files with 97 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/documentTool/documentSplit/modules/SplitAddForm.vue
+97 -31
View File
@@ -174,7 +174,7 @@
<div class="header-text">
{{ $t('docTool.split.clauseContent') }}
<!--新增条款项-->
<a-button type="primary" icon="plus" ghost @click="handleAddClauseContent(-1)">{{ $t('newlyAdded') }}</a-button>
<a-button type="primary" icon="plus" ghost @click="handleAddClauseContent(multiFieldEnums.content, -1)">{{ $t('newlyAdded') }}</a-button>
</div>
<template v-if="contentList && contentList.length > 0">
<div class="clause-item" v-for="(clause, index) in contentList" :key="index + 'clause'">
@@ -195,11 +195,45 @@
</div>
<div class="clause-item-operate">
<a-button @click="handleAddClauseContent(index)">{{ $t('newlyAdded') }}</a-button>
<a-button v-if="clause.type === TypeOfClauseItem.TABLE.value" @click="splitEdit(index,clause)">{{
<a-button v-if="clause.type === TypeOfClauseItem.TABLE.value" @click="splitEdit(multiFieldEnums.content,index,clause)">{{
$t('edit')
}}
</a-button>
<a-button @click="handleDeleteClauseContent(index, clause)">{{ $t('delete') }}</a-button>
<a-button @click="handleDeleteClauseContent(multiFieldEnums.content, index, clause)">{{ $t('delete') }}</a-button>
</div>
</div>
</template>
<!--译文部分-->
<div class="header-text">
{{ $t('docTool.split.translation') }}
<!--新增条款项-->
<a-button type="primary" icon="plus" ghost @click="handleAddClauseContent(multiFieldEnums.translation, -1)">{{ $t('newlyAdded') }}</a-button>
</div>
<template v-if="translationList && translationList.length > 0">
<div class="clause-item" v-for="(clause, index) in translationList" :key="index + 'translation'">
<div class="clause-item-content">
<!--文本-->
<a-input type="textarea"
:maxLength="500"
v-model="clause.translation"
v-if="clause.type === TypeOfClauseItem.TEXT.value" />
<!--图片-->
<viewer>
<img v-if="clause.type === TypeOfClauseItem.IMG.value"
:src="clause.thumbUrl?clause.thumbUrl:clause.translation"
alt="">
</viewer>
<!--表格-->
<div v-if="clause.type === TypeOfClauseItem.TABLE.value" v-html="clause.translation"></div>
</div>
<div class="clause-item-operate">
<a-button @click="handleAddClauseContent(index)">{{ $t('newlyAdded') }}</a-button>
<a-button v-if="clause.type === TypeOfClauseItem.TABLE.value" @click="splitEdit(multiFieldEnums.translation,index,clause)">{{
$t('edit')
}}
</a-button>
<a-button @click="handleDeleteClauseContent(multiFieldEnums.translation, index, clause)">{{ $t('delete') }}</a-button>
</div>
</div>
</template>
@@ -253,15 +287,32 @@ export default {
return {
FieldType,
TypeOfClauseItem,
hiddenFieldList: ['item_content'], // 隐藏的字段
hiddenFieldList: ['item_content', 'translation'], // 隐藏的字段
radioDictSelect: [], // 使用radio样式的数据字典单选
disabledFieldList: [], // 禁用的字段
specialPlaceholder: {}, // 特殊的placeholder
optionsData: {}, // 通过接口获取的下拉数据
title: this.$t('newlyAdded'),
// 多字段的数据枚举
multiFieldEnums: Object.freeze({
content: {
thisField: 'contentList',
dataField: 'itemContent',
index: 'contentAddIndex'
},
translation: {
thisField: 'translationList',
dataField: 'translation',
index: 'translationAddIndex'
}
}),
// 当前打开弹框时的对应字段枚举对象,回调时操作该字段
operateMultiFieldEnum: {},
contentList: [], // 条款内容数据
translationList: [], // 译文内容数据
visible: false,
addIndex: 0, // 新增条款的index
contentAddIndex: 0, // 新增条款的index
translationAddIndex: 0, // 新增译文的index
disabled: false,
formInline: {},
isFormInline: false,
@@ -305,6 +356,7 @@ export default {
this.visible = true
this.formInline = {}
this.contentList = []
this.translationList = []
this.type = 'add'
this.getForm()
},
@@ -459,10 +511,12 @@ export default {
this.loading = true
getEditClauseContent({ id: this.itemVal.id }).then(res => {
if (res.success) {
this.contentList = [...res.result]
this.contentList.forEach(item => {
const imgData = item.itemContent.split('fileName=')[1]
item.thumbUrl = window._CONFIG.domianURL + '/sys/split/file/getImage?fileName=' + imgData
Object.values(this.multiFieldEnums).forEach(enums => {
this[enums.thisField] = JSON.parse(JSON.stringify(res.result)).filter(item => item[enums.dataField])
this[enums.thisField].forEach(item => {
const imgData = item[enums.dataField] ? item[enums.dataField].split('fileName=')[1] : ''
item.thumbUrl = window._CONFIG.domianURL + '/sys/split/file/getImage?fileName=' + imgData
})
})
}
}).finally(() => {
@@ -471,20 +525,23 @@ export default {
},
/**
* 新增条款内容
* @param fieldEnum - 操作的对应枚举对象
* @param index
*/
handleAddClauseContent (index) {
handleAddClauseContent (fieldEnum, index) {
// 记录操作的字段,弹框完成时用
this.operateMultiFieldEnum = fieldEnum
if (index === -1) {
this.addIndex = this.contentList.length - 1
this[fieldEnum.indexField] = this[fieldEnum.thisField].length - 1
} else {
this.addIndex = index
this[fieldEnum.indexField] = index
}
this.$refs.splitDetailAddTypeCheck.open()
},
// 增加条款内容成功
handleAddOk (type, content) {
const headerArr = this.contentList.splice(0, this.addIndex + 1)
const footerArr = this.contentList.splice(-this.addIndex)
const headerArr = this[this.operateMultiFieldEnum.thisField].splice(0, this[this.operateMultiFieldEnum.indexField] + 1)
const footerArr = this[this.operateMultiFieldEnum.thisField].splice(-this[this.operateMultiFieldEnum.indexField])
const insertArr = []
switch (type) {
case TypeOfClauseItem.TEXT.value:
@@ -492,7 +549,7 @@ export default {
insertArr.push({
id: '',
type: TypeOfClauseItem.TEXT.value,
itemContent: ''
[this.operateMultiFieldEnum.dataField]: ''
})
}
break
@@ -500,7 +557,7 @@ export default {
insertArr[0] = {
id: '',
type: TypeOfClauseItem.IMG.value,
itemContent: content.file.response.result.url,
[this.operateMultiFieldEnum.dataField]: content.file.response.result.url,
thumbUrl: window._CONFIG.domianURL + '/sys/split/file/getImage?fileName=' + content.file.response.result.fileName
}
break
@@ -508,19 +565,21 @@ export default {
insertArr[0] = {
id: '',
type: 'TABLE',
itemContent: content[0]
[this.operateMultiFieldEnum.dataField]: content[0]
}
}
this.contentList = [...headerArr, ...insertArr, ...footerArr]
this[this.operateMultiFieldEnum.thisField] = [...headerArr, ...insertArr, ...footerArr]
},
/**
* 表格编辑
* @param fieldEnum - 操作的对应枚举对象
* @param index
* @param item
*/
splitEdit (index, item) {
this.addIndex = index
this.$refs.splitDetailAddTable.open(item.itemContent)
splitEdit (fieldEnum, index, item) {
this.operateMultiFieldEnum = fieldEnum
this[fieldEnum.indexField] = index
this.$refs.splitDetailAddTable.open(item[fieldEnum.dataField])
this.$refs.splitDetailAddTable.isTableEdit = true
},
/**
@@ -528,12 +587,12 @@ export default {
* @param ueContent
*/
editTableOk (ueContent) {
this.contentList[this.addIndex] = {
this[this.operateMultiFieldEnum.thisField][this[this.operateMultiFieldEnum.indexField]] = {
id: '',
type: 'TABLE',
itemContent: ueContent[0]
[this.operateMultiFieldEnum.dataField]: ueContent[0]
}
this.contentList = JSON.parse(JSON.stringify(this.contentList))
this[this.operateMultiFieldEnum.thisField] = JSON.parse(JSON.stringify(this[this.operateMultiFieldEnum.thisField]))
},
// 点击点击上传按钮
clickButtonToUpload (item) {
@@ -564,11 +623,12 @@ export default {
},
/**
* 删除条款内容
* @param fieldEnum - 操作的对应枚举对象
* @param index
* @param clause
*/
handleDeleteClauseContent (index, clause) {
this.contentList.splice(index, 1)
handleDeleteClauseContent (fieldEnum, index, clause) {
this[fieldEnum.thisField].splice(index, 1)
if (clause.id) {
this.deleteIds.push(clause.id)
}
@@ -580,6 +640,7 @@ export default {
this.visible = false
this.formInline = {}
this.contentList = []
this.translationList = []
this.interpretationArticlesList = []
},
handleSave () {
@@ -614,12 +675,17 @@ export default {
formData.info_id = this.infoId
formData.menu_id = this.menuId
const contentList = JSON.parse(JSON.stringify(this.contentList))
contentList.forEach((item, index) => {
if (item.type === 'IMG') {
delete item.thumbUrl
const translationList = JSON.parse(JSON.stringify(this.translationList))
const resultList = []
for (let i = 0; i < Math.max(contentList.length, translationList.length); i++) {
// 译文属性防止覆盖内容
if (contentList[i].itemContent) {
delete translationList[i].itemContent
}
})
formData.itemValEOList = contentList
resultList.push({}, Object.assign(contentList[i], translationList[i]))
delete resultList[i].thumbUrl
}
formData.itemValEOList = resultList
formData.interpretationArticlesList = this.interpretationArticlesList.filter(tt => !!tt.itemContent)
formData.delItemIds = this.deleteIds.join(',')
submitFunc(formData).then(res => {