ZQ/laws-sinotruk-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 新旧拆分单对比-发起对比

Browse Source
This commit is contained in:
赵霄
2023-10-20 15:11:35 +08:00
parent 8cbdc88595
commit 26d64b1a76
1 changed files with 98 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/documentTool/documentComparison/DocumentDataComparison.vue
+98 -176
View File
@@ -35,7 +35,9 @@
</template> </template>
<div class="can-scroll-content"> <div class="can-scroll-content">
<div class="detail-content"> <div class="detail-content">
<!--左边的文档-->
<div class="detail-content-left"> <div class="detail-content-left">
<!--左边的目录-->
<div class="standard-catalogue part-common" :class="{'hide-catalogue': !leftCatalogueShow}"> <div class="standard-catalogue part-common" :class="{'hide-catalogue': !leftCatalogueShow}">
<div class="catalogue-show" @click="changeLeftCatalogueShow"> <div class="catalogue-show" @click="changeLeftCatalogueShow">
<a-icon :type="leftCatalogueShow ? 'left' : 'right'" /> <a-icon :type="leftCatalogueShow ? 'left' : 'right'" />
@@ -69,7 +71,7 @@
<div class="detail-content-content-right"> <div class="detail-content-content-right">
<div class="detail-content-content-right-data" @click="detailLeft(index,item)" <div class="detail-content-content-right-data" @click="detailLeft(index,item)"
v-for="(item,index) in resultData.textLeft" :key="index" v-for="(item,index) in resultData.textLeft" :key="index"
:class="{'detail-content-content-right-data-blue':item.reviewed === '1'}"> :class="{'detail-content-content-right-data-color': leftHighlightMenuId === item.menuId,'detail-content-content-right-data-blue':item.reviewed === '1'}">
<div class="detail-content-content-right-data-text" style="margin-bottom: 10px;color: #040B29"> <div class="detail-content-content-right-data-text" style="margin-bottom: 10px;color: #040B29">
{{ item.itemsNum + ' ' + item.itemsName }} {{ item.itemsNum + ' ' + item.itemsName }}
</div> </div>
@@ -112,7 +114,7 @@
<div class="detail-content-content-right-right"> <div class="detail-content-content-right-right">
<div class="detail-content-content-right-data-right" @click="detailRight(index,item)" <div class="detail-content-content-right-data-right" @click="detailRight(index,item)"
v-for="(item,index) in resultData.textRight" :key="index" v-for="(item,index) in resultData.textRight" :key="index"
:class="{'detail-content-content-right-data-blue-right':item.reviewed === '1'}"> :class="{'detail-content-content-right-data-color-right': item.menuId === rightHighlightMenuId, 'detail-content-content-right-data-blue-right':item.reviewed === '1'}">
<div class="detail-content-content-right-data-text" style="margin-bottom: 10px;color: #040B29"> <div class="detail-content-content-right-data-text" style="margin-bottom: 10px;color: #040B29">
{{ item.itemsNum + ' ' + item.itemsName }} {{ item.itemsNum + ' ' + item.itemsName }}
</div> </div>
@@ -181,7 +183,9 @@ export default {
leftCatalogueShow: true, // 左侧的标准目录是否展示 leftCatalogueShow: true, // 左侧的标准目录是否展示
rightCatalogueShow: true, // 右侧的标准目录是否展示 rightCatalogueShow: true, // 右侧的标准目录是否展示
leftTreeSelectedKeys: [], // 左侧被选中树节点 leftTreeSelectedKeys: [], // 左侧被选中树节点
rightTreeSelectedKeys: [] // 右侧被选中树节点 rightTreeSelectedKeys: [], // 右侧被选中树节点
leftHighlightMenuId: null, // 左侧高亮数据的menuId
rightHighlightMenuId: null // 右侧高亮数据的menuId
} }
}, },
mounted () { mounted () {
@@ -204,31 +208,30 @@ export default {
this.loading = true this.loading = true
docComparsionConsistentAndSave(query).then((res) => { docComparsionConsistentAndSave(query).then((res) => {
if (res.success) { if (res.success) {
this.$message.success(this.$t('operationSuccessful')) this.$message.success(res.message)
this.formInline = {} this.formInline = {}
// 保存之后会有一个淡蓝色的边框
if (this.leftHighlightMenuId === this.dataLeft.menuId) {
this.leftHighlightMenuId = null
}
if (this.rightHighlightMenuId === this.dataRight.menuId) {
this.rightHighlightMenuId = null
}
this.resultData.textRight.forEach(val => { this.resultData.textRight.forEach(val => {
if (val.id === this.dataRight.id) { if (val.id === this.dataRight.id) {
val.reviewed = 1 val.reviewed = '1'
} }
}) })
this.resultData.textLeft.forEach(val => { this.resultData.textLeft.forEach(val => {
if (val.id === this.dataLeft.id) { if (val.id === this.dataLeft.id) {
val.reviewed = 1 val.reviewed = '1'
} }
}) })
this.resultData = { ...this.resultData } this.resultData = { ...this.resultData }
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color')
if (detailLeftColor && detailLeftColor.length > 0) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color')
}
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right')
if (detailRightColor && detailRightColor.length > 0) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right')
}
this.dataLeft = {} this.dataLeft = {}
this.dataRight = {} this.dataRight = {}
} else { } else {
this.$message.warning(this.$t('operationFailed')) this.$message.warning(res.message)
} }
}).finally(() => { }).finally(() => {
this.loading = false this.loading = false
@@ -251,8 +254,15 @@ export default {
this.loading = true this.loading = true
docComparsionConsistentAndSave(query).then((res) => { docComparsionConsistentAndSave(query).then((res) => {
if (res.success) { if (res.success) {
this.$message.success(this.$t('operationSuccessful')) this.$message.success(res.message)
this.formInline = {} this.formInline = {}
// 保存之后会有一个淡蓝色的边框
if (this.leftHighlightMenuId === this.dataLeft.menuId) {
this.leftHighlightMenuId = null
}
if (this.rightHighlightMenuId === this.dataRight.menuId) {
this.rightHighlightMenuId = null
}
this.resultData.textRight.forEach(val => { this.resultData.textRight.forEach(val => {
if (val.id === this.dataRight.id) { if (val.id === this.dataRight.id) {
val.reviewed = 1 val.reviewed = 1
@@ -264,21 +274,13 @@ export default {
} }
}) })
this.resultData = { ...this.resultData } this.resultData = { ...this.resultData }
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color')
if (detailLeftColor && detailLeftColor.length > 0) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color')
}
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right')
if (detailRightColor && detailRightColor.length > 0) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right')
}
this.dataLeft = {} this.dataLeft = {}
this.dataRight = {} this.dataRight = {}
// this.$router.push({ // this.$router.push({
// path: '/documentComparison' // path: '/documentComparison'
// }) // })
} else { } else {
this.$message.warning(this.$t('operationFailed')) this.$message.warning(res.message)
} }
}).finally(() => { }).finally(() => {
this.loading = false this.loading = false
@@ -331,34 +333,23 @@ export default {
// 点击左侧文档内容 // 点击左侧文档内容
detailLeft (num, item) { detailLeft (num, item) {
this.leftTreeSelectedKeys = [item.menuId] this.leftTreeSelectedKeys = [item.menuId]
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color')
if (detailLeftColor && detailLeftColor.length > 0) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color')
}
if (item.id === this.dataLeft.id && !this.isMatching) { if (item.id === this.dataLeft.id && !this.isMatching) {
this.dataLeft = {} this.dataLeft = {}
this.leftHighlightMenuId = null
return return
} }
const detailLeft = document.getElementsByClassName('detail-content-content-right-data') this.leftHighlightMenuId = item.menuId
if (detailLeft && detailLeft.length > 0) {
detailLeft[num].classList.add('detail-content-content-right-data-color')
}
this.dataLeft = item this.dataLeft = item
this.dataLeft.numIndex = num this.dataLeft.numIndex = num
// 自动匹配，右侧数据需要跳转
if (this.isMatching) { if (this.isMatching) {
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right') const index = this.dataLeft.targetStand
if (detailRightColor && detailRightColor.length > 0) { if (index > -1) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right') this.dataRight = this.resultData.textRight[index]
} this.dataRight.numIndex = index
if (item.targetStand > -1) { this.rightHighlightMenuId = this.dataRight.menuId
const detailContent = document.getElementsByClassName('detail-content-content-right-right-top') this.rightTreeSelectedKeys = [this.dataRight.menuId]
const detailRight = document.getElementsByClassName('detail-content-content-right-data-right') this.handleJumpRightData(index)
this.dataRight = this.resultData.textRight[item.targetStand]
if (detailRight && detailRight.length > 0) {
detailRight[item.targetStand].classList.add('detail-content-content-right-data-color-right')
detailContent[0].scrollTop = detailRight[item.targetStand].offsetTop - 150
}
this.dataRight.numIndex = item.targetStand
this.clauseComparison() this.clauseComparison()
} }
} }
@@ -366,34 +357,22 @@ export default {
// 点击右侧文档内容 // 点击右侧文档内容
detailRight (num, item) { detailRight (num, item) {
this.rightTreeSelectedKeys = [item.menuId] this.rightTreeSelectedKeys = [item.menuId]
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right')
if (detailRightColor && detailRightColor.length > 0) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right')
}
if (item.id === this.dataRight.id && !this.isMatching) { if (item.id === this.dataRight.id && !this.isMatching) {
this.dataRight = {} this.dataRight = {}
this.rightHighlightMenuId = null
return return
} }
const detailRight = document.getElementsByClassName('detail-content-content-right-data-right')
if (detailRight && detailRight.length > 0) {
detailRight[num].classList.add('detail-content-content-right-data-color-right')
}
this.dataRight = item this.dataRight = item
this.dataRight.numIndex = num this.dataRight.numIndex = num
this.rightHighlightMenuId = item.menuId
if (this.isMatching) { if (this.isMatching) {
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color') const index = this.dataRight.targetStand
if (detailLeftColor && detailLeftColor.length > 0) { if (index > -1) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color') this.dataLeft = this.resultData.textLeft[index]
} this.dataLeft.numIndex = index
if (item.targetStand > -1) { this.leftHighlightMenuId = this.dataLeft.menuId
this.dataLeft = this.resultData.textLeft[item.targetStand] this.leftTreeSelectedKeys = [this.dataLeft.menuId]
this.dataLeft.numIndex = item.targetStand this.handleJumpLeftData(index)
const detailContent = document.getElementsByClassName('detail-content-content-right-top')
const detailLeft = document.getElementsByClassName('detail-content-content-right-data')
if (detailLeft && detailLeft.length > 0 && item.targetStand >= 0) {
detailLeft[item.targetStand].classList.add('detail-content-content-right-data-color')
detailContent[0].scrollTop = detailLeft[item.targetStand].offsetTop - 150
}
this.clauseComparison() this.clauseComparison()
} }
} }
@@ -418,123 +397,66 @@ export default {
// 左侧树选择 // 左侧树选择
onSelectLeft (selectedKeys, exports) { onSelectLeft (selectedKeys, exports) {
const node = exports.node.$vnode.data.props.dataRef const node = exports.node.$vnode.data.props.dataRef
const detailLeft = document.getElementsByClassName('detail-content-content-right-data') const index = this.resultData.textLeft.findIndex(tt => tt.menuId === node.menuId)
const detailLeftContent = document.getElementsByClassName('detail-content-content-right')[0] this.dataLeft = this.resultData.textLeft[index]
let dataItem, num console.log(this.dataLeft)
for (let i = 0; i < this.resultData.textLeft.length; i++) { this.dataLeft.numIndex = index
if (node.menuId === this.resultData.textLeft[i].menuId) { this.leftHighlightMenuId = this.dataLeft.menuId
dataItem = this.resultData.textLeft[i] this.leftTreeSelectedKeys = [this.dataLeft.menuId]
num = i this.handleJumpLeftData(index)
detailLeftContent.scrollTop = detailLeft[i].offsetTop - 150
break
}
}
// 处理数据框选
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color')
if (detailLeftColor && detailLeftColor.length > 0) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color')
}
if (dataItem.id === this.dataLeft.id && !this.isMatching) {
this.dataLeft = {}
return
}
if (detailLeft && detailLeft.length > 0) {
detailLeft[num].classList.add('detail-content-content-right-data-color')
}
this.dataLeft = dataItem
this.dataLeft.numIndex = num
// 处理选中右侧树 // 处理选中右侧树
if (this.isMatching) { if (this.isMatching) {
const detailRight = document.getElementsByClassName('detail-content-content-right-data-right') const indexRight = this.dataLeft.targetStand
const detailRightContent = document.getElementsByClassName('detail-content-content-right-right')[0] if (indexRight > -1) {
let rightDataItem, rightNum this.dataRight = this.resultData.textRight[indexRight]
for (let i = 0; i < this.resultData.textRight.length; i++) { this.dataRight.numIndex = indexRight
if (node.menuId === this.resultData.textRight[i].menuId) { this.rightHighlightMenuId = this.dataRight.menuId
rightDataItem = this.resultData.textLeft[i] this.rightTreeSelectedKeys = [this.dataRight.menuId]
rightNum = i this.handleJumpRightData(indexRight)
detailRightContent.scrollTop = detailRight[i].offsetTop - 150 this.clauseComparison()
break
}
} }
// 处理选中右侧数据
if (!rightDataItem) {
return
}
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right')
if (detailRightColor && detailRightColor.length > 0) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right')
}
if (rightDataItem.id === this.dataRight.id && !this.isMatching) {
this.dataRight = {}
return
}
if (detailRight && detailRight.length > 0) {
detailRight[rightNum].classList.add('detail-content-content-right-data-color-right')
}
this.dataRight = rightDataItem
this.dataRight.numIndex = rightNum
} }
}, },
// 右侧树选中 // 右侧树选中
onSelectRight (selectedKeys, exports) { onSelectRight (selectedKeys, exports) {
const node = exports.node.$vnode.data.props.dataRef const node = exports.node.$vnode.data.props.dataRef
const detailRight = document.getElementsByClassName('detail-content-content-right-data-right') const index = this.resultData.textRight.findIndex(tt => tt.menuId === node.menuId)
const detailRightContent = document.getElementsByClassName('detail-content-content-right-right')[0] this.dataRight = this.resultData.textRight[index]
let rightDataItem, rightNum this.dataRight.numIndex = index
for (let i = 0; i < this.resultData.textRight.length; i++) { this.rightHighlightMenuId = this.dataRight.menuId
if (node.menuId === this.resultData.textRight[i].menuId) { this.rightTreeSelectedKeys = [this.dataRight.menuId]
rightDataItem = this.resultData.textLeft[i] this.handleJumpRightData(index)
rightNum = i // 处理选中左侧树
detailRightContent.scrollTop = detailRight[i].offsetTop - 150
break
}
}
// 处理选中右侧数据
if (!rightDataItem) {
return
}
const detailRightColor = document.getElementsByClassName('detail-content-content-right-data-color-right')
if (detailRightColor && detailRightColor.length > 0) {
detailRightColor[0].classList.remove('detail-content-content-right-data-color-right')
}
if (rightDataItem.id === this.dataRight.id && !this.isMatching) {
this.dataRight = {}
return
}
if (detailRight && detailRight.length > 0) {
detailRight[rightNum].classList.add('detail-content-content-right-data-color-right')
}
this.dataRight = rightDataItem
this.dataRight.numIndex = rightNum
if (this.isMatching) { if (this.isMatching) {
const detailLeft = document.getElementsByClassName('detail-content-content-right-data') const indexLeft = this.dataRight.targetStand
const detailLeftContent = document.getElementsByClassName('detail-content-content-right')[0] if (indexLeft > -1) {
let dataItem, num this.dataLeft = this.resultData.textRight[indexLeft]
for (let i = 0; i < this.resultData.textLeft.length; i++) { this.dataLeft.numIndex = indexLeft
if (node.menuId === this.resultData.textLeft[i].menuId) { this.leftHighlightMenuId = this.dataLeft.menuId
dataItem = this.resultData.textLeft[i] this.leftTreeSelectedKeys = [this.dataLeft.menuId]
num = i this.handleJumpLeftData(indexLeft)
detailLeftContent.scrollTop = detailLeft[i].offsetTop - 150 this.clauseComparison()
break
}
} }
// 处理数据框选 }
if (!dataItem) { },
return /**
} * 左侧数据跳转
const detailLeftColor = document.getElementsByClassName('detail-content-content-right-data-color') */
if (detailLeftColor && detailLeftColor.length > 0) { handleJumpLeftData (index) {
detailLeftColor[0].classList.remove('detail-content-content-right-data-color') if (index > -1) {
} const scrollContent = document.getElementsByClassName('detail-content-content-right')
if (dataItem.id === this.dataLeft.id && !this.isMatching) { const clauseItemDom = document.getElementsByClassName('detail-content-content-right-data')
this.dataLeft = {} scrollContent[0].scrollTop = clauseItemDom[index].offsetTop - 150
return }
} },
if (detailLeft && detailLeft.length > 0) { /**
detailLeft[num].classList.add('detail-content-content-right-data-color') * 右侧数据跳转
} */
this.dataLeft = dataItem handleJumpRightData (index) {
this.dataLeft.numIndex = num if (index > -1) {
const detailContent = document.getElementsByClassName('detail-content-content-right-right')
const detailRight = document.getElementsByClassName('detail-content-content-right-data-right')
detailContent[0].scrollTop = detailRight[index].offsetTop - 150
} }
}, },
handleBack () { handleBack () {
@@ -797,11 +719,11 @@ export default {
} }
.detail-content-content-right-data-blue { .detail-content-content-right-data-blue {
border: 1px #21c9cc solid; border: 2px #21c9cc solid;
} }
.detail-content-content-right-data-blue-right { .detail-content-content-right-data-blue-right {
border: 1px #21c9cc solid; border: 2px #21c9cc solid;
} }
.detail-content-content-right-data-color { .detail-content-content-right-data-color {