chore(deps): 添加 @types/diff 类型定义依赖

- 在 package.json 和 package-lock.json 中新增 @types/diff 依赖
- 确保开发环境对 diff 类型的支持和代码智能提示
- 安装包版本为 7.0.2，许可证为 MIT

package-lock.json

@@ -36,6 +36,7 @@
             "devDependencies": {
                 "@commitlint/cli": "^19.8.0",
                 "@commitlint/config-conventional": "^19.8.0",
+                "@types/diff": "^7.0.2",
                 "@types/lodash-es": "^4.17.12",
                 "@types/node": "^24.10.14",
                 "@vitejs/plugin-vue": "^6.0.2",
@@ -1667,6 +1668,13 @@
                 "@types/node": "*"
             }
         },
+        "node_modules/@types/diff": {
+            "version": "7.0.2",
+            "resolved": "https://registry.npmmirror.com/@types/diff/-/diff-7.0.2.tgz",
+            "integrity": "sha512-JSWRMozjFKsGlEjiiKajUjIJVKuKdE3oVy2DNtK+fUo8q82nhFZ2CPQwicAIkXrofahDXrWJ7mjelvZphMS98Q==",
+            "dev": true,
+            "license": "MIT"
+        },
         "node_modules/@types/estree": {
             "version": "1.0.8",
             "resolved": "https://registry.npmmirror.com/@types/estree/-/estree-1.0.8.tgz",

package.json

@@ -45,6 +45,7 @@
     "devDependencies": {
         "@commitlint/cli": "^19.8.0",
         "@commitlint/config-conventional": "^19.8.0",
+        "@types/diff": "^7.0.2",
         "@types/lodash-es": "^4.17.12",
         "@types/node": "^24.10.14",
         "@vitejs/plugin-vue": "^6.0.2",

src/components/CommonExportModal.vue

-<template>
-    <CommonModal v-model="show" title="导出确认" :width="500">
-        <div class="p-4 py-6">
-            <n-form-item label="选择导出范围" label-placement="left">
-                <n-radio-group v-model:value="exportMode" name="exportMode">
-                    <n-space>
-                        <n-radio value="page">当前页数据</n-radio>
-                        <n-radio value="all">
-                            全量数据
-                            <n-text depth="3" class="text-xs ml-1">(最多 2,147,483,647 条)</n-text>
-                        </n-radio>
-                    </n-space>
-                </n-radio-group>
-            </n-form-item>
-
-            <n-alert v-if="exportMode === 'all'" title="提示" type="info" class="mt-4">全量导出可能会耗时较长，具体取决于系统数据总量。</n-alert>
-
-            <n-progress v-if="loading" type="line" :percentage="exportProgress" :indicator-placement="'inside'" processing class="mt-4" />
-        </div>
-
-        <template #footer>
-            <n-space justify="end">
-                <CommonButton @click="show = false" :disabled="loading">取消</CommonButton>
-                <CommonButton type="primary" :loading="loading" @click="handleConfirm">开始导出</CommonButton>
-            </n-space>
-        </template>
-    </CommonModal>
-</template>
-
-<script setup lang="ts">
-const show = ref(false)
-const loading = ref(false)
-const exportProgress = ref(0)
-const exportMode = ref<'page' | 'all'>('page')
-let progressTimer: any = null
-
-// 导出上下文
-const context = ref<{
-    fileName: string
-    functionCode: string
-    params: any
-} | null>(null)
-
-/**
- * 打开导出选择弹窗
- * @param options 导出配置
- */
-const open = (options: { fileName: string; functionCode: string; params: any }) => {
-    context.value = options
-    exportMode.value = 'page' // 默认当前页
-    show.value = true
-}
-
-/** 执行下载 */
-const handleConfirm = async () => {
-    if (!context.value) return
-
-    loading.value = true
-    exportProgress.value = 0
-
-    // 开启模拟进度条定时器
-    progressTimer = setInterval(() => {
-        if (exportProgress.value < 90) {
-            exportProgress.value += Math.floor(Math.random() * 3) + 1
-        } else if (exportProgress.value < 98) {
-            exportProgress.value += 0.3
-        }
-    }, 200)
-
-    const { fileName, functionCode, params } = context.value
-
-    const exportParams = {
-        ...params,
-        functionCode,
-        fileName,
-        page: exportMode.value === 'all' ? 1 : params.page || 1,
-        rows: exportMode.value === 'all' ? 2147483647 : params.rows || 15
-    }
-
-    try {
-        const success = await service.download('/excel/export', exportParams, `${fileName}_${new Date().getTime()}.xlsx`, {
-            showLoading: false
-        })
-
-        if (success) {
-            exportProgress.value = 100
-            window.$message.success('导出任务已启动，请查看浏览器下载')
-            // 延迟关闭，让用户看到 100% 进度
-            setTimeout(() => {
-                show.value = false
-            }, 500)
-        }
-    } catch (err) {
-        console.error('Export failed', err)
-        exportProgress.value = 0
-    } finally {
-        loading.value = false
-        if (progressTimer) {
-            clearInterval(progressTimer)
-            progressTimer = null
-        }
-    }
-}
-
-defineExpose({ open })
-</script>

src/components/CommonImportModal.vue

@@ -27,26 +27,10 @@
         </div>
 
         <template #footer>
-            <div class="flex justify-between items-center w-full">
-                <CommonButton v-if="showDownload" type="primary" secondary @click="handleDownloadTemplate">
-                    <template #icon>
-                        <n-icon><DownloadOutline /></n-icon>
-                    </template>
-                    下载导入模板
-                </CommonButton>
-                <div v-else></div>
-                <n-space>
             <CommonButton @click="showModal = false">取消</CommonButton>
-                    <CommonButton
-                        type="primary"
-                        :loading="uploading"
-                        :disabled="!importResult?.success && fileList.length === 0"
-                        @click="handleConfirm"
-                    >
+            <CommonButton type="primary" :loading="uploading" :disabled="!importResult?.success && fileList.length === 0" @click="handleConfirm">
                 {{ importResult?.success ? '完成' : '确定' }}
             </CommonButton>
-                </n-space>
-            </div>
         </template>
     </CommonModal>
 </template>
@@ -78,7 +62,6 @@ const context = ref<ImportOptions | null>(null)
 let progressTimer: any = null
 
 const title = computed(() => context.value?.title || '批量导入')
-const showDownload = computed(() => !!(context.value?.templateName || context.value?.templateApi))
 
 /**
  * 打开导入弹窗
@@ -185,21 +168,6 @@ const handleConfirm = async () => {
     }
 }
 
-const handleDownloadTemplate = () => {
-    if (!context.value?.templateName && !context.value?.templateApi) return
-    const params = {
-        ...(context.value.templateName ? { filename: context.value.templateName } : {}),
-        ...(context.value.downloadParams || {})
-    }
-    const downloadApi = context.value.templateApi || '/v1/plugins/ATTACHMENT_DOWN'
-    const fileName = context.value.templateTitle || '导入模板.xlsx'
-    openDownloadModal({
-        downloadFunc: () => service.download(downloadApi, params, fileName),
-        fileName,
-        title: '下载导入模板'
-    })
-}
-
 const emit = defineEmits(['success'])
 
 defineExpose({

src/components/CommonModal.vue

@@ -9,7 +9,7 @@
         :draggable="{ bounds: 'none' }"
         v-bind="$attrs"
         :style="modalStyle"
-        class="app-modal"
+        :class="['app-modal', { 'is-fullscreen': fullscreen }]"
         header-class="!px-[20px] !py-[15px]"
         content-class="!p-0"
         footer-class="!m-0 !p-0"
@@ -65,6 +65,7 @@ interface Props {
     maxHeight?: string | number
     padding?: string | number
     scrollable?: boolean
+    fullscreen?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -78,12 +79,22 @@ const props = withDefaults(defineProps<Props>(), {
     width: '600px',
     maxHeight: '75vh',
     padding: '15px',
-    scrollable: true
+    scrollable: true,
+    fullscreen: false
 })
 
 const emit = defineEmits(['update:modelValue', 'confirm', 'cancel'])
 
 const modalStyle = computed(() => {
+    if (props.fullscreen) {
+        return {
+            width: '100vw',
+            height: '100vh',
+            maxHeight: '100vh',
+            margin: 0,
+            borderRadius: 0
+        }
+    }
     const w = props.width
     return {
         width: typeof w === 'number' ? `${w}px` : w
@@ -104,7 +115,43 @@ const handleCancel = () => {
     emit('cancel')
 }
 </script>
-<style></style>
+<style>
+.app-modal.is-fullscreen {
+    width: 100vw !important;
+    height: 100vh !important;
+    max-height: 100vh !important;
+    margin: 0 !important;
+    border-radius: 0 !important;
+    display: flex !important;
+    flex-direction: column !important;
+}
+.app-modal.is-fullscreen > .n-card__content {
+    flex: 1 !important;
+    display: flex !important;
+    flex-direction: column !important;
+    min-height: 0 !important;
+    padding: 0 !important;
+}
+.app-modal.is-fullscreen > .n-card__content > .n-spin-container {
+    flex: 1 !important;
+    display: flex !important;
+    flex-direction: column !important;
+    min-height: 0 !important;
+}
+.app-modal.is-fullscreen > .n-card__content > .n-spin-container > .n-spin-content {
+    flex: 1 !important;
+    display: flex !important;
+    flex-direction: column !important;
+    min-height: 0 !important;
+}
+.app-modal.is-fullscreen > .n-card__content > .n-spin-container > .n-spin-content > .space-y-4 {
+    flex: 1 !important;
+    display: flex !important;
+    flex-direction: column !important;
+    min-height: 0 !important;
+    margin: 0 !important;
+}
+</style>
 <style scoped>
 :deep(.rule-op) {
     @apply text-primary font-bold;

src/layouts/MainLayout.vue

@@ -11,7 +11,6 @@
 
         <!-- 全局弹窗组件，供 window 全局挂载调用 -->
         <CommonImportModal ref="globalImportModalRef" />
-        <CommonExportModal ref="globalExportModalRef" />
         <CommonUploadModal ref="globalUploadModalRef" />
         <CommonDownloadModal ref="globalDownloadModalRef" />
     </div>
@@ -19,13 +18,10 @@
 
 <script setup lang="ts">
 import { useAppStore } from '@/store/app/index'
-import { useEditorStore } from '@/store/editor'
-import CommonDownloadModal from '@/components/CommonDownloadModal.vue'
 
 const themeVars = useThemeVars()
 const appStore = useAppStore()
 const globalImportModalRef = ref()
-const globalExportModalRef = ref()
 const globalAttachmentModalRef = ref()
 const globalUploadModalRef = ref()
 const globalPreviewModalRef = ref()
@@ -36,7 +32,6 @@ useKeyboardShortcuts({}, true)
 
 onMounted(() => {
     window.$importModal = globalImportModalRef.value
-    window.$exportModal = globalExportModalRef.value
     window.$attachmentModal = globalAttachmentModalRef.value
     window.$uploadModal = globalUploadModalRef.value
     window.$previewModal = globalPreviewModalRef.value

src/layouts/components/SettingsDrawer.vue

@@ -242,13 +242,31 @@
                         <div class="text-sm font-semibold mb-3" :style="{ color: themeVars.textColor2 }">编辑器设置</div>
 
                         <!-- 自动展开新增节点 -->
-                        <div class="flex items-center justify-between py-3" :style="{ borderColor: themeVars.dividerColor }">
+                        <div class="flex items-center justify-between py-3 border-b" :style="{ borderColor: themeVars.dividerColor }">
                             <div>
                                 <div class="text-sm" :style="{ color: themeVars.textColor1 }">插入节点自动展开</div>
                                 <div class="text-xs mt-0.5" :style="{ color: themeVars.textColor3 }">插入/粘贴节点及表格行列时，自动展开相关节点</div>
                             </div>
                             <n-switch v-model:value="appStore.autoExpandOnInsert" />
                         </div>
+
+                        <!-- 表格新增列默认宽度 -->
+                        <div class="py-3" :style="{ borderColor: themeVars.dividerColor }">
+                            <div class="flex items-center justify-between mb-1.5">
+                                <span class="text-sm" :style="{ color: themeVars.textColor1 }">表格新增列默认宽度比</span>
+                                <div class="w-32">
+                                    <n-input-number
+                                        v-model:value="appStore.defaultNewColWidth"
+                                        :min="0.05"
+                                        :max="2.0"
+                                        :step="0.05"
+                                        size="small"
+                                        placeholder="默认 0.2"
+                                    />
+                                </div>
+                            </div>
+                            <div class="text-xs" :style="{ color: themeVars.textColor3 }">设定新增列占常规平分列宽的比例或折算系数</div>
+                        </div>
                     </div>
                 </n-tab-pane>
 
@@ -410,6 +428,7 @@ const resetPrefs = () => {
     appStore.collapsed = false
     appStore.transitionName = 'none'
     appStore.autoExpandOnInsert = true
+    appStore.defaultNewColWidth = 0.2
     customColor.value = '#165DFF'
     applyAndSave()
     window.$message.success('已重置为默认设置')
@@ -425,7 +444,8 @@ const copyPrefs = async () => {
             colorWeak: appStore.colorWeak,
             grayMode: appStore.grayMode,
             transitionName: appStore.transitionName,
-            autoExpandOnInsert: appStore.autoExpandOnInsert
+            autoExpandOnInsert: appStore.autoExpandOnInsert,
+            defaultNewColWidth: appStore.defaultNewColWidth
         },
         null,
         2
@@ -456,6 +476,7 @@ const importPrefs = async () => {
         if (typeof conf.grayMode === 'boolean') appStore.grayMode = conf.grayMode
         if (conf.transitionName) appStore.transitionName = conf.transitionName
         if (typeof conf.autoExpandOnInsert === 'boolean') appStore.autoExpandOnInsert = conf.autoExpandOnInsert
+        if (typeof conf.defaultNewColWidth === 'number') appStore.defaultNewColWidth = conf.defaultNewColWidth
 
         applyAndSave()
         window.$message.success('偏好设置已成功导入并应用')

src/store/app/index.ts

@@ -20,7 +20,8 @@ export const useAppStore = defineStore('app', {
         transitionName: 'none',
         settingsPinned: false,
         settingsOpen: false,
-        autoExpandOnInsert: true
+        autoExpandOnInsert: true,
+        defaultNewColWidth: 0.2
     }),
     actions: {
         toggleSidebar() {

src/store/app/types.ts

@@ -20,4 +20,5 @@ export interface AppState {
     settingsPinned: boolean
     settingsOpen: boolean
     autoExpandOnInsert: boolean // 新增/粘贴节点及表格行列时自动展开
+    defaultNewColWidth: number // 表格新增列的默认宽度比例 (当前默认 0.2)
 }

src/types/diff.ts

+export interface DiffResult {
+    value: string
+    added?: boolean
+    removed?: boolean
+    count?: number
+}

src/types/xmlNode.ts

@@ -17,6 +17,8 @@ export interface XmlNode {
     mixedContent: MixedContentItem[]
     /** 父节点 ID（不参与序列化） */
     parentId: string | null
+    /** 比对差异状态 */
+    diffStatus?: 'added' | 'removed' | 'modified' | 'none'
 }
 
 /**
@@ -30,6 +32,10 @@ export interface MixedContentItem {
     text?: string
     /** 子元素节点 ID（type=element 时） */
     nodeId?: string
+    /** 比对差异状态 */
+    diffStatus?: 'added' | 'removed' | 'modified' | 'none'
+    /** 单词级差异详情 */
+    diffWords?: { value: string; added?: boolean; removed?: boolean }[]
 }
 
 /**

src/utils/diff.ts

+import * as Diff from 'diff'
+import type { XmlNode } from '@/types/xmlNode'
+import type { DiffResult } from '@/types/diff'
+import { serializeTreeToXml } from './xmlParser'
+
+/**
+ * 比较两份工卡（XML 字符串或 XmlNode 树结构）的行差异
+ * @param oldCard 旧工卡（可以是 XML 字符串或 XmlNode 树结构）
+ * @param newCard 新工卡（可以是 XML 字符串或 XmlNode 树结构）
+ * @returns 差异结果数组
+ */
+export function diffJobCardsLines(
+    oldCard: string | XmlNode,
+    newCard: string | XmlNode
+): DiffResult[] {
+    const oldXml = typeof oldCard === 'string' ? oldCard : serializeTreeToXml(oldCard, 0, false)
+    const newXml = typeof newCard === 'string' ? newCard : serializeTreeToXml(newCard, 0, false)
+
+    return Diff.diffLines(oldXml, newXml)
+}
+
+/**
+ * 比较两份工卡（XML 字符串或 XmlNode 树结构）的单词差异
+ * @param oldCard 旧工卡
+ * @param newCard 新工卡
+ * @returns 差异结果数组
+ */
+export function diffJobCardsWords(
+    oldCard: string | XmlNode,
+    newCard: string | XmlNode
+): DiffResult[] {
+    const oldXml = typeof oldCard === 'string' ? oldCard : serializeTreeToXml(oldCard, 0, false)
+    const newXml = typeof newCard === 'string' ? newCard : serializeTreeToXml(newCard, 0, false)
+
+    return Diff.diffWords(oldXml, newXml)
+}
+
+/**
+ * 比较两个 XmlNode 对象的 JSON 结构差异
+ * @param oldNode 旧节点
+ * @param newNode 新节点
+ * @returns 差异结果数组
+ */
+export function diffJobCardsJson(
+    oldNode: XmlNode,
+    newNode: XmlNode
+): DiffResult[] {
+    // 序列化为规范 JSON 字符串，排除 parentId 以免产生循环引用
+    const replacer = (key: string, value: any) => {
+        if (key === 'parentId') return undefined
+        return value
+    }
+    const oldJson = JSON.stringify(oldNode, replacer, 2)
+    const newJson = JSON.stringify(newNode, replacer, 2)
+
+    return Diff.diffJson(oldJson, newJson)
+}

src/utils/xmlParser.ts

@@ -152,6 +152,19 @@ export function serializeTreeToXml(node: XmlNode, indent: number = 0, compact: b
 }
 
 /**
+ * 格式化 XML 字符串（转换为带换行和缩进的排版形式）
+ */
+export function formatXmlText(xmlStr: string): string {
+    if (!xmlStr) return ''
+    try {
+        const tree = parseXmlToTree(xmlStr)
+        return serializeTreeToXml(tree, 0, false)
+    } catch (e) {
+        return xmlStr
+    }
+}
+
+/**
  * 转义 XML 属性值
  */
 function escapeXmlAttr(str: string): string {

src/views/editor/components/DocNodeRenderer/functionals/index.ts

@@ -496,3 +496,13 @@ export const isAllEinDataSameEffect = (einlst: XmlNode): boolean => {
     const firstEff = getEffString(einlst.children[0])
     return einlst.children.every((c) => getEffString(c) === firstEff)
 }
+
+export const getDiffWordClass = (w: { added?: boolean; removed?: boolean }, notItalic = false): string => {
+    if (w.added) {
+        return `bg-success-1 text-success-6 dark:text-success-5 font-bold border-b border-success-3 px-0.5 rounded${notItalic ? ' not-italic' : ''}`
+    }
+    if (w.removed) {
+        return `bg-danger-1 text-danger-6 dark:text-danger-5 line-through border-b border-danger-3 px-0.5 rounded${notItalic ? ' not-italic' : ''}`
+    }
+    return ''
+}

src/views/editor/components/EditorToolbar/components/CompareModal/constants/index.ts

+export interface DiffMixedContentItem {
+    type: 'text' | 'element'
+    text?: string
+    nodeId?: string
+    diffStatus?: 'added' | 'removed' | 'modified' | 'none'
+    diffWords?: { value: string; added?: boolean; removed?: boolean }[]
+}
+
+export interface DiffXmlNode {
+    id: string
+    tagName: string
+    attributes: Record<string, string>
+    children: DiffXmlNode[]
+    textContent: string
+    mixedContent: DiffMixedContentItem[]
+    parentId: string | null
+    diffStatus: 'added' | 'removed' | 'modified' | 'none'
+}
+
+export interface DiffLine {
+    type: 'added' | 'removed' | 'normal' | 'empty'
+    num?: number
+    content: string
+}
+

src/views/editor/components/EditorToolbar/components/CreateTableModal/constants/index.ts

+export const CELL_CHILD_OPTIONS = [
+    { label: 'PARAC (中文)', value: 'PARAC' },
+    { label: 'PARA (英文)', value: 'PARA' }
+]

src/views/editor/components/EditorToolbar/components/CreateTableModal/functionals/index.ts

+import type { FormInst, FormRules } from 'naive-ui'
+import { CHINESE_FIRST_PARA_TAGS } from '@/configs/xmlTags'
+
+export const useCreateTableModal = (
+    emit: (event: 'confirm', rows: number, cols: number, cellChildTags: string[]) => void
+) => {
+    const show = ref(false)
+    const formRef = ref<FormInst | null>(null)
+
+    const form = reactive({
+        rows: 3,
+        cols: 3,
+        cellChildTags: [...CHINESE_FIRST_PARA_TAGS]
+    })
+
+    const rules: FormRules = {
+        rows: { type: 'number', required: true, message: '请指定行数', trigger: ['blur', 'change'] },
+        cols: { type: 'number', required: true, message: '请指定列数', trigger: ['blur', 'change'] }
+    }
+
+    const open = () => {
+        form.rows = 3
+        form.cols = 3
+        form.cellChildTags = [...CHINESE_FIRST_PARA_TAGS]
+        show.value = true
+    }
+
+    const handleConfirm = async () => {
+        try {
+            await formRef.value?.validate()
+            emit('confirm', form.rows, form.cols, form.cellChildTags)
+            show.value = false
+        } catch (err) {
+            // validation failed
+        }
+    }
+
+    return {
+        show,
+        formRef,
+        form,
+        rules,
+        open,
+        handleConfirm
+    }
+}

src/views/editor/components/EditorToolbar/components/CreateTableModal/index.vue

@@ -30,7 +30,7 @@
                 </div>
                 <n-form-item label="单元格初始化段落节点" path="cellChildTags">
                     <div class="w-full bg-fill-2 p-3 rounded border border-divider">
-                        <CommonCheckbox v-model:value="form.cellChildTags" :options="cellChildOptions" :space-size="24" />
+                        <CommonCheckbox v-model:value="form.cellChildTags" :options="CELL_CHILD_OPTIONS" :space-size="24" />
                     </div>
                 </n-form-item>
             </div>
@@ -39,48 +39,14 @@
 </template>
 
 <script setup lang="ts">
-import type { FormInst, FormRules } from 'naive-ui'
-import { CHINESE_FIRST_PARA_TAGS } from '@/configs/xmlTags'
+import { CELL_CHILD_OPTIONS } from './constants'
+import { useCreateTableModal } from './functionals'
 
 const emit = defineEmits<{
     confirm: [rows: number, cols: number, cellChildTags: string[]]
 }>()
 
-const cellChildOptions = [
-    { label: 'PARAC (中文)', value: 'PARAC' },
-    { label: 'PARA (英文)', value: 'PARA' }
-]
-
-const show = ref(false)
-const formRef = ref<FormInst | null>(null)
-
-const form = reactive({
-    rows: 3,
-    cols: 3,
-    cellChildTags: [...CHINESE_FIRST_PARA_TAGS]
-})
-
-const rules: FormRules = {
-    rows: { type: 'number', required: true, message: '请指定行数', trigger: ['blur', 'change'] },
-    cols: { type: 'number', required: true, message: '请指定列数', trigger: ['blur', 'change'] }
-}
-
-const open = () => {
-    form.rows = 3
-    form.cols = 3
-    form.cellChildTags = [...CHINESE_FIRST_PARA_TAGS]
-    show.value = true
-}
-
-const handleConfirm = async () => {
-    try {
-        await formRef.value?.validate()
-        emit('confirm', form.rows, form.cols, form.cellChildTags)
-        show.value = false
-    } catch (err) {
-        // validation failed
-    }
-}
+const { show, formRef, form, rules, open, handleConfirm } = useCreateTableModal(emit)
 
 defineExpose({ open })
 </script>

src/views/editor/components/EditorToolbar/index.vue

@@ -91,6 +91,14 @@
                 <n-icon class="text-base"><search-outline /></n-icon>
                 <span class="text-xs font-medium">搜索翻译</span>
             </button>
+            <button
+                type="button"
+                class="toolbar-btn flex items-center gap-1.5 px-2.5 h-7 rounded text-color2 hover:bg-fill-2 active:bg-fill-3 transition-colors select-none focus:outline-none flex-shrink-0"
+                @click="compareModalRef?.open()"
+            >
+                <n-icon class="text-base"><git-compare-outline /></n-icon>
+                <span class="text-xs font-medium">对比工卡</span>
+            </button>
         </div>
 
         <div class="w-px h-5 flex-shrink-0 mx-3" style="background: #d0d0d0"></div>
@@ -223,6 +231,9 @@
 
         <!-- 搜索翻译数据库弹窗 -->
         <SearchTranslateModal ref="searchTranslateModalRef" />
+
+        <!-- 工卡对比弹窗 -->
+        <CompareModal ref="compareModalRef" />
     </div>
 </template>
 
@@ -241,7 +252,8 @@ import {
     CodeWorkingOutline,
     SyncOutline,
     CheckmarkCircleOutline,
-    SettingsOutline
+    SettingsOutline,
+    GitCompareOutline
 } from '@vicons/ionicons5'
 import { useEditorToolbar } from './functionals'
 import { GREEN_BUTTONS } from './constants'
@@ -252,6 +264,7 @@ import CreateSignoffModal from './components/CreateSignoffModal/index.vue'
 import BatchTranslateModal from './components/BatchTranslateModal/index.vue'
 import ExtractTranslateModal from './components/ExtractTranslateModal/index.vue'
 import SearchTranslateModal from './components/SearchTranslateModal/index.vue'
+import CompareModal from './components/CompareModal/index.vue'
 
 const emit = defineEmits(['save', 'validate', 'export', 'preview', 'download-html'])
 
@@ -276,6 +289,7 @@ const {
 } = useEditorToolbar(emit)
 
 const insertFragmentModalRef = ref<any>(null)
+const compareModalRef = ref<any>(null)
 </script>
 
 <style scoped>

src/views/editor/components/NodeTree/components/ViewXmlModal/functionals/index.ts

+import { viewXmlVisible, viewXmlTitle, viewXmlContent } from '../../../functionals'
+
+export const useViewXmlModal = () => {
+    const handleCopyXml = async () => {
+        try {
+            await navigator.clipboard.writeText(viewXmlContent.value)
+            window.$message?.success('XML 片段已成功复制到剪贴板')
+        } catch (err) {
+            window.$message?.error('复制失败，请手动选择复制')
+        }
+    }
+
+    const open = (title: string, content: string) => {
+        viewXmlTitle.value = title
+        viewXmlContent.value = content
+        viewXmlVisible.value = true
+    }
+
+    return {
+        viewXmlVisible,
+        viewXmlTitle,
+        viewXmlContent,
+        handleCopyXml,
+        open
+    }
+}

src/views/editor/components/NodeTree/components/ViewXmlModal/index.vue

@@ -25,22 +25,9 @@
 
 <script setup lang="ts">
 import { ClipboardOutline } from '@vicons/ionicons5'
-import { viewXmlVisible, viewXmlTitle, viewXmlContent } from '../../functionals'
+import { useViewXmlModal } from './functionals'
 
-const handleCopyXml = async () => {
-    try {
-        await navigator.clipboard.writeText(viewXmlContent.value)
-        window.$message?.success('XML 片段已成功复制到剪贴板')
-    } catch (err) {
-        window.$message?.error('复制失败，请手动选择复制')
-    }
-}
-
-const open = (title: string, content: string) => {
-    viewXmlTitle.value = title
-    viewXmlContent.value = content
-    viewXmlVisible.value = true
-}
+const { viewXmlVisible, viewXmlTitle, viewXmlContent, handleCopyXml, open } = useViewXmlModal()
 
 defineExpose({ open })
 </script>

src/views/editor/components/NodeTree/functionals/index.ts

@@ -420,15 +420,9 @@ export function useNodeTree(
         return lines
     })
 
-    // 仅渲染可视区域的垂直虚线
+    // 渲染所有计算出的垂直虚线，防止视口尺寸监控失效或滚动缓冲区外节点连线断裂
     const visibleVerticalLines = computed(() => {
-        const sTop = scrollTop.value
-        const vHeight = viewportHeight.value
-        const sBottom = sTop + vHeight
-        return verticalLines.value.filter((line) => {
-            const lineBottom = line.top + line.height
-            return lineBottom >= sTop && line.top <= sBottom
-        })
+        return verticalLines.value
     })
 
     // 展开/折叠逻辑

src/views/editor/components/NodeTree/index.vue

@@ -56,7 +56,7 @@
                 </div>
 
                 <!-- 可见列表节点 -->
-                <div :style="{ transform: `translateY(${startOffset}px)` }" class="absolute top-0 left-0 right-0 space-y-0.5">
+                <div :style="{ transform: `translateY(${startOffset}px)` }" class="absolute top-0 left-0 right-0">
                     <div
                         v-for="item in visibleItems"
                         :key="item.id"

src/views/editor/components/TableEditor/functionals/index.ts

@@ -45,6 +45,8 @@ const setDeepText = (node: XmlNode, text: string): void => {
 export function useTableEditor(props: { node: XmlNode }) {
     const store = useEditorStore()
     const appStore = useAppStore()
+    const isDiffModeRaw = inject<any>('diffMode', false)
+    const isDiffMode = computed(() => typeof isDiffModeRaw === 'boolean' ? isDiffModeRaw : (isDiffModeRaw?.value ?? false))
 
     const structure = ref<TableStructureModel>({
         cols: 0,
@@ -552,12 +554,44 @@ export function useTableEditor(props: { node: XmlNode }) {
         }
 
         const colSpecs = tgroup.children.filter((c) => c.tagName === 'COLSPEC')
+
+        // 计算新增列的自适应默认宽度，从偏好设置 store 中读取比重系数，防止权重失衡
+        const ratio = appStore.defaultNewColWidth ?? 0.2
+        let defaultWidth = `${ratio}*`
+        const activeWidths = colSpecs
+            .map((spec) => spec.attributes.COLWIDTH || spec.attributes.colwidth || '')
+            .filter((w) => !!w)
+
+        if (activeWidths.length > 0) {
+            const starWidths = activeWidths
+                .filter((w) => w.includes('*'))
+                .map((w) => parseFloat(w.replace('*', '')))
+                .filter((v) => !isNaN(v))
+
+            if (starWidths.length > 0) {
+                const avgStar = starWidths.reduce((sum, v) => sum + v, 0) / starWidths.length
+                // 基于偏好设置的比例，星号下限根据设定的比例安全限制
+                const starLimit = Math.max(0.05, ratio / 2)
+                defaultWidth = `${Math.max(starLimit, Math.round(avgStar * ratio * 10) / 10)}*`
+            } else {
+                const absWidths = activeWidths
+                    .map((w) => parseFloat(w))
+                    .filter((v) => !isNaN(v))
+                if (absWidths.length > 0) {
+                    const avgAbs = absWidths.reduce((sum, v) => sum + v, 0) / absWidths.length
+                    // 基于偏好设置的像素比例，下限为 20px
+                    defaultWidth = `${Math.max(20, Math.round(avgAbs * ratio))}px`
+                }
+            }
+        }
+
         const newColSpec: XmlNode = {
             id: crypto.randomUUID(),
             tagName: 'COLSPEC',
             attributes: {
                 COLNAME: `col_temp_${Date.now()}`,
-                COLNUM: ''
+                COLNUM: '',
+                COLWIDTH: defaultWidth
             },
             children: [],
             textContent: '',
@@ -1008,7 +1042,22 @@ export function useTableEditor(props: { node: XmlNode }) {
                 allCells.push(...row.cells)
             }
 
-            const matchedCell = allCells.find((c) => c.id === newId || c.paragraphs.some((p) => p.id === newId))
+            // 优先通过 nodeMap 向上回溯祖先链寻找最近的 ENTRY 节点，以支持嵌套复杂子节点时的精确定位
+            let entryId: string | null = null
+            if (allCells.some((c) => c.id === newId)) {
+                entryId = newId
+            } else {
+                let curr = store.nodeMap.get(newId)
+                while (curr) {
+                    if (curr.node.tagName === 'ENTRY') {
+                        entryId = curr.node.id
+                        break
+                    }
+                    curr = curr.parent ? store.nodeMap.get(curr.parent.id) : undefined
+                }
+            }
+
+            const matchedCell = entryId ? allCells.find((c) => c.id === entryId) : null
             if (matchedCell) {
                 if (selectedCellIds.value.includes(matchedCell.id)) {
                     return
@@ -1078,31 +1127,7 @@ export function useTableEditor(props: { node: XmlNode }) {
         }
 
         const expectedArea = (maxCol - minCol + 1) * (maxRow - minRow + 1)
-        if (actualArea !== expectedArea) return false
-
-        const mask = Array.from({ length: rows }, () => Array(cols).fill(false))
-        for (const cell of cells) {
-            const cIdx = cell.colIdx ?? 0
-            const rIdx = cell.rowIdx ?? 0
-            const cSpan = cell.colspan ?? 1
-            const rSpan = cell.rowspan ?? 1
-
-            for (let dr = 0; dr < rSpan; dr++) {
-                for (let dc = 0; dc < cSpan; dc++) {
-                    if (rIdx + dr < rows && cIdx + dc < cols) {
-                        mask[rIdx + dr][cIdx + dc] = true
-                    }
-                }
-            }
-        }
-
-        for (let r = minRow; r <= maxRow; r++) {
-            for (let c = minCol; c <= maxCol; c++) {
-                if (!mask[r][c]) return false
-            }
-        }
-
-        return true
+        return actualArea === expectedArea
     })
 
     const canSplitSelected = computed(() => {
@@ -1122,6 +1147,8 @@ export function useTableEditor(props: { node: XmlNode }) {
             }
             if (selectedCellIds.value.length > 0) {
                 store.setSelectedNodeId(selectedCellIds.value[selectedCellIds.value.length - 1])
+            } else {
+                store.setSelectedNodeId(props.node.id)
             }
         } else {
             selectedCellIds.value = [cell.id]
@@ -1130,14 +1157,41 @@ export function useTableEditor(props: { node: XmlNode }) {
     }
 
     const handleCellClick = (cell: TableCellModel, e: MouseEvent) => {
+        const isCtrl = e.ctrlKey || e.metaKey
         if (preventCellClick.value) return
+        // 如果是 Ctrl 键点击，多选逻辑已在捕获阶段处理，冒泡阶段直接忽略
+        if (isCtrl) return
         selectCellLogic(cell, e)
     }
 
+    const handleCellClickCapture = (cell: TableCellModel, e: MouseEvent) => {
+        const isCtrl = e.ctrlKey || e.metaKey
+        if (isDiffMode.value) return
+        if (preventCellClick.value) return
+        if (isCtrl) {
+            e.stopImmediatePropagation()
+            e.stopPropagation()
+            e.preventDefault()
+            selectCellLogic(cell, e)
+        }
+    }
+
+    const handleCellMousedownCapture = (e: MouseEvent) => {
+        const isCtrl = e.ctrlKey || e.metaKey
+        if (isDiffMode.value) return
+        if (isCtrl) {
+            e.preventDefault()
+        }
+    }
+
     const handleParaClick = (para: any, cell: TableCellModel, e: MouseEvent) => {
+        const isCtrl = e.ctrlKey || e.metaKey
         if (preventCellClick.value) return
-        store.setSelectedNodeId(para.id)
         selectCellLogic(cell, e)
+        // 只有非 Ctrl 点击（单选）且单元格已被选中时，才将全局选中节点联动为该段落，避免多选时被段落选中状态干扰
+        if (!isCtrl && selectedCellIds.value.includes(cell.id)) {
+            store.setSelectedNodeId(para.id)
+        }
     }
 
     const handleCellBlur = (cellId: string, e: FocusEvent) => {
@@ -1815,6 +1869,8 @@ export function useTableEditor(props: { node: XmlNode }) {
         canSplitSelected,
         selectedCells,
         handleCellClick,
+        handleCellClickCapture,
+        handleCellMousedownCapture,
         handleParaClick,
         handleCellBlur,
         handleRowAddSelect,

src/views/editor/components/TextBlockEditor/index.vue

@@ -81,7 +81,7 @@
                                     :options="attrDef.enumValues.map((v: any) => ({ label: v, value: v }))"
                                     size="tiny"
                                     class="flex-1"
-                                    @update:value="syncMixedContent"
+                                    @change="syncMixedContent"
                                 />
                                 <n-input v-else v-model:value="item.attributes[attrName]" size="tiny" class="flex-1" @input="syncMixedContent" />
                             </div>

src/views/editor/functionals/index.ts

@@ -5,7 +5,7 @@ import { DEFAULT_FILE_NAME } from '../constants'
 // 静态导入 DTD JSON
 import dtdJson from '@/assets/json/dtd.json'
 // 导入原始 XML 文本 (?raw)
-import xmlText from '@/assets/file/AMEA-A282400-02-1_0_0.xml?raw'
+import xmlText from '@/assets/file/AMEA-A282400-02-1_0_0_updated.xml?raw'
 
 /**
  * 工卡 XML 编辑器核心业务逻辑 Hook