jingrow/jingrow
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

更新whiteboard属性面板的翻译

Browse Source
This commit is contained in:
jingrow 2026-05-04 01:21:35 +08:00
parent 780c44e757
commit 14ac8acfcd
2 changed files with 152 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
frontend/src/core/features/whiteboard/WhiteboardEditor.vue
View File

@ -127,6 +127,31 @@ const hasStrokeWidthControl = computed(() => {
// 是否显示圆角（矩形）
const hasBorderRadiusControl = computed(() => selectedElement.value?.type === 'rectangle')
// 元素类型标签映射
const elementTypeLabel = computed(() => {
if (!selectedElement.value) return ''
const type = selectedElement.value.type
if (type === 'line') return t('Line Tool')
if (type === 'sticky-note') return t('Sticky Note')
return t(type.charAt(0).toUpperCase() + type.slice(1))
})
// 元素类型图标映射
const elementTypeIcon = computed(() => {
if (!selectedElement.value) return 'tabler:box'
const t = selectedElement.value.type
if (t === 'rectangle') return 'tabler:rectangle'
if (t === 'ellipse') return 'tabler:circle'
if (t === 'diamond') return 'tabler:diamond'
if (t === 'sticky-note') return 'tabler:note'
if (t === 'text') return 'tabler:typography'
if (t === 'arrow') return 'tabler:arrow-right'
if (t === 'line') return 'tabler:line'
if (t === 'freehand') return 'tabler:pencil'
if (t === 'image') return 'tabler:photo'
return 'tabler:box'
})
// 是否为箭头/线条元素
const isArrowElement = computed(() => {
const t = selectedElement.value?.type
@ -182,22 +207,22 @@ const currentLineStyle = computed(() => {
// 线条风格选项（可视化图标按钮组）
const lineStyleOptions: { label: string; value: LineStyle; icon: string }[] = [
{
label: 'Solid',
label: t('Solid'),
value: 'solid',
icon: `<svg width="40" height="16" viewBox="0 0 40 16" xmlns="http://www.w3.org/2000/svg"><line x1="2" y1="8" x2="38" y2="8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>`,
},
{
label: 'Dashed',
label: t('Dashed'),
value: 'dashed',
icon: `<svg width="40" height="16" viewBox="0 0 40 16" xmlns="http://www.w3.org/2000/svg"><line x1="2" y1="8" x2="38" y2="8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-dasharray="8 5"/></svg>`,
},
{
label: 'Dotted',
label: t('Dotted'),
value: 'dotted',
icon: `<svg width="40" height="16" viewBox="0 0 40 16" xmlns="http://www.w3.org/2000/svg"><line x1="2" y1="8" x2="38" y2="8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-dasharray="2 4"/></svg>`,
},
{
label: 'Dash-Dot',
label: t('Dash-Dot'),
value: 'dash-dot',
icon: `<svg width="40" height="16" viewBox="0 0 40 16" xmlns="http://www.w3.org/2000/svg"><line x1="2" y1="8" x2="38" y2="8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-dasharray="8 4 2 4"/></svg>`,
},
@ -206,36 +231,36 @@ const lineStyleOptions: { label: string; value: LineStyle; icon: string }[] = [
// 文字水平对齐选项
const textAlignOptions: { label: string; value: TextAlign; icon: string }[] = [
{
label: 'Left',
label: t('Align Left'),
value: 'left',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 3H14M2 6H10M2 9H12M2 12H8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>`,
},
{
label: 'Center',
label: t('Align Center'),
value: 'center',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 3H14M4 6H12M3 9H13M5 12H11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>`,
},
{
label: 'Right',
label: t('Align Right'),
value: 'right',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 3H14M6 6H14M4 9H14M8 12H14" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg>`,
},
]
// 文字垂直对齐选项（Tabler Icons: layout-align-top/center/bottom）
// 文字垂直对齐选项
const textBaselineOptions: { label: string; value: TextBaseline; icon: string }[] = [
{
label: 'Top',
label: t('Align Top'),
value: 'top',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.67 2.67L13.33 2.67" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M6 7.33C6 6.6 6.6 6 7.33 6H8.67C9.4 6 10 6.6 10 7.33V12.67C10 13.4 9.4 14 8.67 14H7.33C6.6 14 6 13.4 6 12.67V7.33Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`,
},
{
label: 'Middle',
label: t('Align Middle'),
value: 'middle',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8 2.67V5.33" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M8 10.67V13.33" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M4 7.33C4 6.6 4.6 6 5.33 6H10.67C11.4 6 12 6.6 12 7.33V8.67C12 9.4 11.4 10 10.67 10H5.33C4.6 10 4 9.4 4 8.67V7.33Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`,
},
{
label: 'Bottom',
label: t('Align Bottom'),
value: 'bottom',
icon: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.67 13.33L13.33 13.33" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><path d="M6 3.33C6 2.6 6.6 2 7.33 2H8.67C9.4 2 10 2.6 10 3.33V8.67C10 9.4 9.4 10 8.67 10H7.33C6.6 10 6 9.4 6 8.67V3.33Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`,
},
@ -334,7 +359,7 @@ const toolGroups = computed(() => [
label: t('Lines'),
items: [
{ label: t('Arrow'), key: 'arrow', icon: 'tabler:arrow-right' },
{ label: t('Line'), key: 'line', icon: 'tabler:line' },
{ label: t('Line Tool'), key: 'line', icon: 'tabler:line' },
]
},
{
@ -969,20 +994,11 @@ function handleResize(): void {
<n-tooltip v-if="selectedIds.length === 1 && selectedElement" trigger="hover">
<template #trigger>
<button class="panel-type-badge">
<Icon :icon="selectedElement.type === 'rectangle' ? 'tabler:rectangle' :
selectedElement.type === 'ellipse' ? 'tabler:circle' :
selectedElement.type === 'diamond' ? 'tabler:diamond' :
selectedElement.type === 'sticky-note' ? 'tabler:note' :
selectedElement.type === 'text' ? 'tabler:typography' :
selectedElement.type === 'arrow' ? 'tabler:arrow-right' :
selectedElement.type === 'line' ? 'tabler:line' :
selectedElement.type === 'freehand' ? 'tabler:pencil' :
selectedElement.type === 'image' ? 'tabler:photo' :
'tabler:box'" size="12" />
{{ selectedElement.type }}
<Icon :icon="elementTypeIcon" size="12" />
{{ elementTypeLabel }}
</button>
</template>
Element type
{{ t('Element type') }}
</n-tooltip>
<span v-else-if="selectedIds.length > 1" class="panel-multi-badge">
{{ selectedIds.length }} {{ t('selected') }}
@ -1137,16 +1153,16 @@ function handleResize(): void {
<template v-if="hasArrowControl">
<div class="panel-section">
<!-- 连线样式（路由） -->
<div class="panel-section-title">{{ t('Route Style') }}</div>
<div class="panel-section-title">{{ t('Arrow Style') }}</div>
<div class="prop-row">
<n-select
size="tiny"
:value="currentRouteStyle"
@update:value="handleRouteStyleChange"
:options="[
{ label: 'Straight', value: 'straight' },
{ label: 'Orthogonal', value: 'orthogonal' },
{ label: 'Bezier', value: 'bezier' },
{ label: t('Straight'), value: 'straight' },
{ label: t('Orthogonal'), value: 'orthogonal' },
{ label: t('Bezier'), value: 'bezier' },
]"
style="width: 100%;"
/>
@ -1240,10 +1256,10 @@ function handleResize(): void {
:value="selectedElement?.style?.fontWeight || '400'"
@update:value="handleFontWeightChange"
:options="[
{ label: 'Light', value: '300' },
{ label: 'Regular', value: '400' },
{ label: 'Medium', value: '500' },
{ label: 'Bold', value: '700' },
{ label: t('Light', undefined, 'Whiteboard'), value: '300' },
{ label: t('Regular', undefined, 'Whiteboard'), value: '400' },
{ label: t('Medium', undefined, 'Whiteboard'), value: '500' },
{ label: t('Bold', undefined, 'Whiteboard'), value: '700' },
]"
style="width: 90px;"
/>
@ -1264,7 +1280,7 @@ function handleResize(): void {
</div>
<!-- 文字垂直对齐 -->
<div class="prop-row">
<label>{{ t('Vertical') }}</label>
<label>{{ t('Vertical Align') }}</label>
<div class="align-picker">
<button
v-for="opt in textBaselineOptions"

106
jingrow/locale/zh.po
View File

@ -26675,6 +26675,15 @@ msgstr "近期注册用户过多，注册功能已临时关闭。请一小时后
msgid "Tools"
msgstr "工具"
msgid "Shapes"
msgstr "形状"
msgid "Lines"
msgstr "连接线"
msgid "Draw"
msgstr "绘制"
#. Option for the 'Position' (Select) field in PageType 'Form Tour Step'
#: jingrow/desk/pagetype/form_tour_step/form_tour_step.json
#: jingrow/public/js/print_format_builder/PrintFormatControls.vue:153
@ -35824,8 +35833,29 @@ msgstr "起点箭头"
msgid "End Arrow"
msgstr "终点箭头"
msgid "Route Style"
msgstr "线路样式"
msgid "Arrow Style"
msgstr "箭头样式"
msgid "Straight"
msgstr "直线"
msgid "Orthogonal"
msgstr "折线"
msgid "Bezier"
msgstr "曲线"
msgid "Solid"
msgstr "实线"
msgid "Dashed"
msgstr "虚线"
msgid "Dotted"
msgstr "点线"
msgid "Dash-Dot"
msgstr "点划线"
msgid "Stroke Width"
msgstr "描边宽度"
@ -35873,4 +35903,74 @@ msgid "Arrow Filled"
msgstr "实心箭头"
msgid "Arrow Open"
msgstr "空心箭头"
msgstr "空心箭头"
msgid "Element type"
msgstr "元素类型"
msgid "Arrow"
msgstr "箭头"
msgid "Line Tool"
msgstr "线条"
msgid "Rectangle"
msgstr "矩形"
msgid "Ellipse"
msgstr "椭圆"
msgid "Diamond"
msgstr "菱形"
msgid "Sticky Note"
msgstr "便利贴"
msgid "Freehand"
msgstr "手绘"
msgid "Image"
msgstr "图片"
msgid "Hand"
msgstr "平移"
msgid "Eraser"
msgstr "橡皮擦"
msgid "Vertical Align"
msgstr "垂直对齐"
msgid "Align Left"
msgstr "左对齐"
msgid "Align Center"
msgstr "居中"
msgid "Align Right"
msgstr "右对齐"
msgid "Align Top"
msgstr "顶对齐"
msgid "Align Middle"
msgstr "居中对齐"
msgid "Align Bottom"
msgstr "底对齐"
msgctxt "Whiteboard"
msgid "Light"
msgstr "细"
msgctxt "Whiteboard"
msgid "Regular"
msgstr "常规"
msgctxt "Whiteboard"
msgid "Medium"
msgstr "中等"
msgctxt "Whiteboard"
msgid "Bold"
msgstr "粗"