Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
V
vue3_onlineEditor
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
pangchong
vue3_onlineEditor
Commits
3ed50b19
Commit
3ed50b19
authored
Apr 02, 2025
by
pangchong
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 对比渲染优化
parent
9fa38c4b
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
18 additions
and
3 deletions
+18
-3
src/views/editor/functions/compare.ts
+18
-3
No files found.
src/views/editor/functions/compare.ts
View file @
3ed50b19
...
@@ -14,8 +14,25 @@ export const handleLeftDifferent = (dataForOld: OldTreeModification, treeNew: Tr
...
@@ -14,8 +14,25 @@ export const handleLeftDifferent = (dataForOld: OldTreeModification, treeNew: Tr
const
containerLeft
=
compareLeftRef
.
value
?.
editorRef
.
getEditableContainer
()
const
containerLeft
=
compareLeftRef
.
value
?.
editorRef
.
getEditableContainer
()
const
containerRight
=
compareRightRef
.
value
?.
editorRef
.
getEditableContainer
()
const
containerRight
=
compareRightRef
.
value
?.
editorRef
.
getEditableContainer
()
//新增
//新增
dataForOld
.
Deleted
.
map
((
item
)
=>
{
const
node
=
containerLeft
!
.
querySelector
(
`[data-key="
${
item
.
key
}
"]`
)
if
(
node
.
childNodes
.
length
==
1
&&
node
.
childNodes
[
0
].
nodeName
==
'SPAN'
)
{
//处理左边
node
.
classList
.
add
(
'bg-errorColorSuppl'
)
//处理右边
const
parentPath
=
item
.
chained
.
slice
(
0
,
item
.
chained
.
length
-
1
)
const
index
=
item
.
chained
[
item
.
chained
.
length
-
1
]
const
parentData
=
findNodeByChained
(
treeNew
,
parentPath
)
const
parentNode
=
containerRight
!
.
querySelector
(
`[data-key="
${
parentData
?.
key
}
"]`)
// 创建一个新节点
const newDiv = document.createElement('div')
newDiv.style.height = `${node.offsetHeight}px`
newDiv.classList.add('bg-dividerColor')
parentNode && parentNode.insertBefore(newDiv, parentNode.childNodes[index])
}
})
//修改
//修改
dataForOld
.
Changed
.
map
((
item
:
any
)
=>
{
dataForOld.Changed.map((item) => {
const node = containerLeft!.querySelector(`[data-key="
$
{
item
.
key
}
"]`)
const node = containerLeft!.querySelector(`[data-key="
$
{
item
.
key
}
"]`)
if (node.childNodes.length == 1 && node.childNodes[0].nodeName == 'SPAN') {
if (node.childNodes.length == 1 && node.childNodes[0].nodeName == 'SPAN') {
node.classList.add('bg-warningColorSuppl')
node.classList.add('bg-warningColorSuppl')
...
@@ -43,8 +60,6 @@ export const handleRightDifferent = (dataForNew: NewTreeModification, treeOld: T
...
@@ -43,8 +60,6 @@ export const handleRightDifferent = (dataForNew: NewTreeModification, treeOld: T
newDiv.style.height = `${node.offsetHeight}px`
newDiv.style.height = `${node.offsetHeight}px`
newDiv.classList.add('bg-dividerColor')
newDiv.classList.add('bg-dividerColor')
parentNode && parentNode.insertBefore(newDiv, parentNode.childNodes[index])
parentNode && parentNode.insertBefore(newDiv, parentNode.childNodes[index])
console.log(parentNode)
console.log(node)
}
}
})
})
//修改
//修改
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment