|
@@ -75,7 +75,7 @@ watch(
|
|
|
const map = new Map()
|
|
|
all.forEach((p) => {
|
|
|
p.options.forEach((v) => {
|
|
|
- map.set(v.nodeId, v)
|
|
|
+ map.set(`${v.nodeId}_${v.key}`, v)
|
|
|
})
|
|
|
})
|
|
|
state.optionsMap = map
|
|
@@ -107,14 +107,7 @@ const updateMarkdown = (e) => {
|
|
|
)
|
|
|
}
|
|
|
const key = match[1]
|
|
|
- const varsValue = document.createElement('div')
|
|
|
- varsValue.setAttribute('contenteditable', 'false')
|
|
|
- varsValue.style.display = 'inline-block'
|
|
|
- const app = createApp(paramValue, {
|
|
|
- vars: state.optionsMap.get(key),
|
|
|
- })
|
|
|
- app.component('SvgIcon', SvgIcon)
|
|
|
- app.mount(varsValue)
|
|
|
+ const varsValue: any = initVarsDom(state.optionsMap.get(key))
|
|
|
fragment.appendChild(varsValue)
|
|
|
|
|
|
lastReplacedSpan = varsValue
|
|
@@ -148,8 +141,49 @@ const onCopy = (text) => {
|
|
|
copy(text)
|
|
|
ElMessage.success('复制成功!')
|
|
|
}
|
|
|
+const initVarsDom = (vars) => {
|
|
|
+ const dom = document.createElement('div')
|
|
|
+ dom.setAttribute('contenteditable', 'false')
|
|
|
+ dom.style.display = 'inline-block'
|
|
|
+ const app = createApp(paramValue, {
|
|
|
+ vars,
|
|
|
+ })
|
|
|
+ app.component('SvgIcon', SvgIcon)
|
|
|
+ app.mount(dom)
|
|
|
+ return dom
|
|
|
+}
|
|
|
const setVars = (vars) => {
|
|
|
- console.log(vars)
|
|
|
+ onCopy(`{{#${vars.nodeId}_${vars.key}#}}`)
|
|
|
+ const selection: any = window.getSelection()
|
|
|
+ const nodeToInsert: any = initVarsDom(vars)
|
|
|
+
|
|
|
+ // 检查是否有有效的选择范围且在当前容器内
|
|
|
+ if (selection.rangeCount > 0) {
|
|
|
+ const range = selection.getRangeAt(0)
|
|
|
+ const isInsideContainer = ref_textarea.value.contains(
|
|
|
+ range.commonAncestorContainer,
|
|
|
+ )
|
|
|
+
|
|
|
+ if (isInsideContainer) {
|
|
|
+ // 在光标处插入
|
|
|
+ range.deleteContents()
|
|
|
+ range.insertNode(nodeToInsert)
|
|
|
+
|
|
|
+ // 移动光标到插入节点之后
|
|
|
+ const newRange = document.createRange()
|
|
|
+ newRange.setStartAfter(nodeToInsert)
|
|
|
+ newRange.collapse(true)
|
|
|
+ selection.removeAllRanges()
|
|
|
+ selection.addRange(newRange)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 没有有效光标或在容器外,则在末尾插入
|
|
|
+ ref_textarea.value.appendChild(nodeToInsert)
|
|
|
+
|
|
|
+ // 可选:滚动到插入的元素
|
|
|
+ nodeToInsert.scrollIntoView({ behavior: 'smooth', block: 'nearest' })
|
|
|
}
|
|
|
onMounted(() => {})
|
|
|
</script>
|