Commit f5e2a4b4 by pangchong

style(editor): 优化样式变量使用与控件属性

- 统一移除多余的 fallback 颜色,改为直接使用 CSS 变量
- 使用 color-mix 函数替代固定 rgba 值,实现主题色混合效果
- 替换部分组件为自定义组件 CommonInputNumber,增加 strict 属性
- 删除部分无用的 placeholder 属性,简化表单输入提示
- 调整错误提示组件颜色变量,使用更语义化的变量名
- 改进错误处理顺序,优化提取翻译时的 loading 状态管理
- 移除多余的选中节点赋值逻辑,避免冗余操作
parent ee29f1ca
......@@ -540,7 +540,7 @@ watch(
<style scoped>
.text-danger {
color: var(--error-color, var(--danger6, #f53f3f));
color: var(--error-color);
}
.node-item {
box-sizing: border-box;
......@@ -556,14 +556,14 @@ watch(
line-height: 1.3;
}
.node-item-active {
background-color: rgba(24, 160, 88, 0.09) !important;
border-color: rgba(24, 160, 88, 0.35) !important;
background-color: color-mix(in srgb, var(--primary-color) 9%, transparent) !important;
border-color: color-mix(in srgb, var(--primary-color) 35%, transparent) !important;
}
.node-item-active span {
color: var(--primary-color, #18a058) !important;
color: var(--primary-color) !important;
}
.node-item-active span.text-color3 {
color: var(--primary-color, #18a058) !important;
color: var(--primary-color) !important;
opacity: 0.8;
}
.node-item-flash {
......@@ -571,12 +571,12 @@ watch(
}
@keyframes flash-green-anim {
0% {
background-color: rgba(24, 160, 88, 0.45) !important;
border-color: rgba(24, 160, 88, 0.8) !important;
background-color: color-mix(in srgb, var(--primary-color) 45%, transparent) !important;
border-color: color-mix(in srgb, var(--primary-color) 80%, transparent) !important;
}
100% {
background-color: rgba(24, 160, 88, 0.09) !important;
border-color: rgba(24, 160, 88, 0.35) !important;
background-color: color-mix(in srgb, var(--primary-color) 9%, transparent) !important;
border-color: color-mix(in srgb, var(--primary-color) 35%, transparent) !important;
}
}
......
......@@ -255,11 +255,12 @@
<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
<CommonInputNumber
v-model:value="appStore.defaultNewColWidth"
:min="0.05"
:max="2.0"
:step="0.05"
:strict="true"
size="small"
placeholder="默认 0.2"
/>
......
......@@ -311,9 +311,6 @@ export function useEditorPanel() {
return
}
el.scrollIntoView({ behavior: 'auto', block: 'center' })
if (foundNodeId && foundNodeId !== editorStore.selectedNodeId) {
editorStore.setSelectedNodeId(foundNodeId)
}
return
}
......@@ -333,23 +330,18 @@ export function useEditorPanel() {
setTimeout(() => {
if (!viewportRef.value) return
let targetEl: HTMLElement | null = null
let subFoundId: string | null = null
// 优先寻找虚拟文本节点本身
targetEl = viewportRef.value.querySelector(`[data-node-id="${newId}"]`) as HTMLElement | null
if (!targetEl && path && path.length > 0) {
for (let i = path.length - 1; i >= 0; i--) {
targetEl = viewportRef.value.querySelector(`[data-node-id="${path[i].id}"]`) as HTMLElement | null
if (targetEl) {
subFoundId = path[i].id
break
}
}
}
if (targetEl) {
targetEl.scrollIntoView({ behavior: 'auto', block: 'center' })
if (subFoundId && subFoundId !== editorStore.selectedNodeId) {
editorStore.setSelectedNodeId(subFoundId)
}
}
}, 100)
})
......
......@@ -12,7 +12,6 @@
:strict="true"
:show-button="true"
class="w-full"
placeholder="请输入行数"
/>
</n-form-item>
<n-form-item label="列数" path="cols">
......@@ -24,7 +23,6 @@
:strict="true"
:show-button="true"
class="w-full"
placeholder="请输入列数"
/>
</n-form-item>
</div>
......
......@@ -100,15 +100,15 @@ export function useExtractTranslate() {
resultDownloadUrl.value = `${getBaseOrigin()}/translations/xml/extract/download/${res.file_id}/extracted_translations.xlsx`
}
loading.value = false
completed.value = true
window.$message.success('翻译对照对提取成功!')
} else {
throw new Error(res.message || '提取翻译对照失败')
}
} catch (err: any) {
loading.value = false
window.$message.error(`提取出错: ${err.message || err}`)
} finally {
loading.value = false
}
}
......
......@@ -109,13 +109,13 @@ defineExpose({ open })
<style scoped>
.text-danger {
color: var(--error-color, var(--danger6, #f53f3f));
color: var(--error-color);
}
.text-success {
color: var(--success-color, var(--success6, #00b42a));
color: var(--success-color);
}
.style-error-alert {
background-color: var(--danger1, #ffece8);
border: 1px solid var(--danger2, #fdcdc5);
background-color: var(--error-color-suppl);
border: 1px solid var(--error-color-hover);
}
</style>
......@@ -11,7 +11,6 @@
:strict="true"
:show-button="true"
class="w-full"
placeholder="请输入数量"
/>
</n-form-item>
<template v-if="!isDelete">
......
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