Commit 0f788bcf by pangchong

refactor(editor): 重构查看XML弹窗状态管理

- 移除viewXmlVisible、viewXmlTitle、viewXmlContent全局共享状态
- 改为由ViewXmlModal组件实例内部管理可见性和内容状态
- 修改打开查看XML弹窗的代码,改用viewXmlModalRef的open方法传参
- 确保多实例情况下查看XML弹窗状态独立,避免冲突
- 优化NodeTree组件对弹窗可见性状态的依赖方式
parent 02e1e0cb
......@@ -6,9 +6,7 @@ import type { EditAreaContextMenuProps } from '../constants'
import {
checkRuleVisible,
checkRuleData,
viewXmlVisible,
viewXmlTitle,
viewXmlContent,
viewXmlModalRef,
addNodeVisible,
addNodeMode,
addNodeTargetId,
......@@ -372,14 +370,16 @@ export function useEditAreaContextMenu(props: EditAreaContextMenuProps, emit: (e
// 4. 查看 XML 片段
else if (actionName === 'viewXml') {
let title: string
let content: string
if (isVirtual) {
viewXmlTitle.value = '文本内容'
viewXmlContent.value = activeNode.value?.textContent || ''
title = '文本内容'
content = activeNode.value?.textContent || ''
} else {
viewXmlTitle.value = `节点 <${mapped.node.tagName}> XML`
viewXmlContent.value = serializeTreeToXml(mapped.node)
title = `节点 <${mapped.node.tagName}> XML`
content = serializeTreeToXml(mapped.node)
}
viewXmlVisible.value = true
viewXmlModalRef.value?.open(title, content)
}
// 5. 查看 DTD 规则
......
import { formatXmlText } from '@/utils/xmlParser'
import { viewXmlVisible, viewXmlTitle, viewXmlContent } from '../../../functionals'
export const useViewXmlModal = () => {
// 每个组件实例持有独立的可见性状态,避免多实例共享同一 ref 导致同时打开
const viewXmlVisible = ref(false)
const viewXmlTitle = ref('')
const viewXmlContent = ref('')
const formattedXmlContent = computed(() => {
return formatXmlText(viewXmlContent.value)
})
......
......@@ -21,7 +21,7 @@ import { useViewXmlModal } from './functionals'
const { viewXmlVisible, viewXmlTitle, formattedXmlContent, handleCopyXml, open } = useViewXmlModal()
defineExpose({ open })
defineExpose({ open, visible: viewXmlVisible })
</script>
<style scoped></style>
......@@ -38,11 +38,8 @@ export const checkRuleData = ref<CheckRuleData>({
export const checkRuleModalRef = ref<any>(null)
// ══════════════════════════════════════════════════════════
// 全局共享状态:查看XML片段弹窗
// 查看XML片段弹窗:仅保留组件实例引用,可见性由组件自身管理
// ══════════════════════════════════════════════════════════
export const viewXmlVisible = ref(false)
export const viewXmlTitle = ref('')
export const viewXmlContent = ref('')
export const viewXmlModalRef = ref<any>(null)
// ══════════════════════════════════════════════════════════
......
......@@ -217,7 +217,6 @@ import { VIRTUAL_LAYOUT_TAGS } from '@/configs/xmlTags'
import {
useNodeTree,
checkRuleVisible,
viewXmlVisible,
addNodeVisible,
translatingNodeId,
checkRuleModalRef,
......@@ -244,7 +243,11 @@ const insertFragmentModalRef = ref<any>(null)
const isAnyModalVisible = computed(() => {
return (
checkRuleVisible.value || viewXmlVisible.value || addNodeVisible.value || stashModalVisible.value || !!insertFragmentModalRef.value?.visible
checkRuleVisible.value ||
!!viewXmlModalRef.value?.visible ||
addNodeVisible.value ||
stashModalVisible.value ||
!!insertFragmentModalRef.value?.visible
)
})
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment