Skip to content

I
Ifar-Xml-Edtor
Commit dce75aea by pangchong
Options

style(editor): 格式化NodeTree与EditorPanel组件代码

parent 9312e5ad
Showing with 40 additions and 22 deletions
src/views/editor/components/EditorPanel/functionals/index.ts
......@@ -369,9 +369,7 @@ export function useEditorPanel() {
const targetNode = editorStore.nodeMap.get(realId)?.node
const estimatedHeight = targetNode ? getNodeEstimatedHeight(targetNode) : 200
const isTall = estimatedHeight >= vHeight * 0.7
const targetScrollTop = isTall
? Math.max(0, estimatedTargetTop - 24)
: Math.max(0, estimatedTargetTop - vHeight / 2)
const targetScrollTop = isTall ? Math.max(0, estimatedTargetTop - 24) : Math.max(0, estimatedTargetTop - vHeight / 2)
viewportRef.value.scrollTo({
top: targetScrollTop,
......
src/views/editor/components/NodeTree/components/DocOutlineView/functionals/index.ts
......@@ -25,7 +25,9 @@ export function useDocOutlineView(props: DocOutlineProps) {
const getPreviewText = (n: any): string => {
if (!n) return ''
if (n.tagName === 'TOPIC' || n.tagName === 'PRETOPIC' || n.tagName === 'GRAPHIC' || n.tagName === 'TABLE') {
const titleNode = Array.isArray(n.children) ? n.children.find((c: any) => c && (c.tagName === 'TITLE' || c.tagName === 'TITLEC')) : null
const titleNode = Array.isArray(n.children)
? n.children.find((c: any) => c && (c.tagName === 'TITLE' || c.tagName === 'TITLEC'))
: null
if (titleNode && titleNode.textContent) return titleNode.textContent.trim()
}
if (n.textContent && typeof n.textContent === 'string') {
......@@ -57,7 +59,10 @@ export function useDocOutlineView(props: DocOutlineProps) {
level = 0
const taskNo = getCepTaskNumber(node)
text = taskNo ? `任务 ${taskNo}` : node.tagName
} else if ((node.tagName === 'TITLE' || node.tagName === 'TITLEC') && (parentTag === 'CEP' || parentTag === 'TASK' || parentTag === 'JC-TASK')) {
} else if (
(node.tagName === 'TITLE' || node.tagName === 'TITLEC') &&
(parentTag === 'CEP' || parentTag === 'TASK' || parentTag === 'JC-TASK')
) {
isOutline = true
level = 1
text = getPreviewText(node) || '无标题'
......@@ -89,14 +94,22 @@ export function useDocOutlineView(props: DocOutlineProps) {
if (!n) return
if (n.tagName === 'TOPIC') {
const parentItem = editorStore.nodeMap?.get(n.id)?.parent
if (parentItem && (parentItem.tagName === 'CEP' || parentItem.tagName === 'TASK' || parentItem.tagName === 'JC-TASK')) {
if (
parentItem &&
(parentItem.tagName === 'CEP' || parentItem.tagName === 'TASK' || parentItem.tagName === 'JC-TASK')
) {
collected.push(n)
}
} else if (n.tagName === 'PRETOPIC') {
const parentItem = editorStore.nodeMap?.get(n.id)?.parent
if (parentItem && parentItem.tagName === 'TFMATR') {
const grandParentItem = editorStore.nodeMap?.get(parentItem.id)?.parent
if (grandParentItem && (grandParentItem.tagName === 'CEP' || grandParentItem.tagName === 'TASK' || grandParentItem.tagName === 'JC-TASK')) {
if (
grandParentItem &&
(grandParentItem.tagName === 'CEP' ||
grandParentItem.tagName === 'TASK' ||
grandParentItem.tagName === 'JC-TASK')
) {
collected.push(n)
}
}
......@@ -162,7 +175,8 @@ export function useDocOutlineView(props: DocOutlineProps) {
if (!calcSeq) {
const parent = editorStore.nodeMap?.get(node.id)?.parent
const siblings = parent && Array.isArray(parent.children) ? parent.children.filter((c: any) => c && c.tagName === 'L1ITEM') : []
const siblings =
parent && Array.isArray(parent.children) ? parent.children.filter((c: any) => c && c.tagName === 'L1ITEM') : []
const idx = siblings.findIndex((c: any) => c && c.id === node.id)
const num = idx >= 0 ? idx : 0
calcSeq = `${String.fromCharCode(65 + num)}. `
......@@ -252,15 +266,10 @@ export function useDocOutlineView(props: DocOutlineProps) {
const startIndex = computed(() => Math.max(0, Math.floor(scrollTop.value / OUTLINE_ITEM_HEIGHT) - 5))
const endIndex = computed(() =>
Math.min(
filteredOutlineList.value.length,
Math.ceil((scrollTop.value + viewportHeight.value) / OUTLINE_ITEM_HEIGHT) + 5
)
Math.min(filteredOutlineList.value.length, Math.ceil((scrollTop.value + viewportHeight.value) / OUTLINE_ITEM_HEIGHT) + 5)
)
const visibleOutlineItems = computed(() =>
filteredOutlineList.value.slice(startIndex.value, endIndex.value)
)
const visibleOutlineItems = computed(() => filteredOutlineList.value.slice(startIndex.value, endIndex.value))
const startOffset = computed(() => startIndex.value * OUTLINE_ITEM_HEIGHT)
......
src/views/editor/components/NodeTree/components/DocOutlineView/index.vue
......@@ -50,7 +50,13 @@
<!-- 序号徽标 (如 3., A., (1), (2)) -->
<span
v-if="item.seqNum && !item.seqNum.includes('🖼️') && !item.seqNum.includes('📊') && !item.seqNum.includes('⚡') && !item.seqNum.includes('📝')"
v-if="
item.seqNum &&
!item.seqNum.includes('🖼️') &&
!item.seqNum.includes('📊') &&
!item.seqNum.includes('⚡') &&
!item.seqNum.includes('📝')
"
class="font-mono font-bold shrink-0 text-[11px]"
:class="[activeOutlineId === item.id ? 'text-white' : 'text-primary dark:text-primary-hover']"
>
......
src/views/editor/components/NodeTree/components/XmlTreeView/index.vue
......@@ -90,10 +90,7 @@
<div v-else class="w-4 h-4 mr-1"></div>
<!-- Icon -->
<div
class="mr-1.5 flex items-center justify-center shrink-0 z-10"
:class="[effectiveSelectedId === item.id ? 'text-white' : '']"
>
<div class="mr-1.5 flex items-center justify-center shrink-0 z-10" :class="[effectiveSelectedId === item.id ? 'text-white' : '']">
<n-icon size="16">
<component :is="getNodeIcon(item)" />
</n-icon>
......
src/views/editor/components/NodeTree/index.vue
......@@ -30,7 +30,12 @@
<!-- 搜索过滤与批量管理 -->
<div class="p-3 border-b border-divider flex items-center space-x-2 shrink-0">
<n-input v-model:value="pattern" :placeholder="viewMode === 'tree' ? '搜索节点名称...' : '搜索大纲标题/序号...'" size="small" class="flex-1">
<n-input
v-model:value="pattern"
:placeholder="viewMode === 'tree' ? '搜索节点名称...' : '搜索大纲标题/序号...'"
size="small"
class="flex-1"
>
<template #prefix>
<n-icon><search-outline /></n-icon>
</template>
......@@ -44,7 +49,10 @@
</div>
<!-- 批量操作管理栏 -->
<div v-if="isBatchMode && viewMode === 'tree'" class="px-3 py-2 bg-fill-2 border-b border-divider flex items-center justify-between text-xs shrink-0">
<div
v-if="isBatchMode && viewMode === 'tree'"
class="px-3 py-2 bg-fill-2 border-b border-divider flex items-center justify-between text-xs shrink-0"
>
<span class="text-color2">
已选择
<strong class="text-primary">{{ selectedKeys.size }}</strong>
......
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