Demo:新增节点连线样式是否允许继承祖先的样式的设置、优化页面各处滚动条样式

This commit is contained in:
街角小林 2025-02-13 09:22:53 +08:00
parent 86c84cba0b
commit 88cea27d1e
8 changed files with 35 additions and 12 deletions

View File

@ -84,7 +84,8 @@ export default {
changeRichTextTip3: 'Do you want to switch to non rich text mode?', changeRichTextTip3: 'Do you want to switch to non rich text mode?',
enableDragImport: 'Is it allowed to directly drag and drop files to the page for import', enableDragImport: 'Is it allowed to directly drag and drop files to the page for import',
imgTextMargin: 'Node image and text margin', imgTextMargin: 'Node image and text margin',
textContentMargin: 'Node contents margin' textContentMargin: 'Node contents margin',
enableInheritAncestorLineStyle: 'Node connection style inherits the style of ancestor nodes',
}, },
color: { color: {
moreColor: 'More color' moreColor: 'More color'

View File

@ -75,6 +75,7 @@ export default {
tagPositionBottom: '文本下面', tagPositionBottom: '文本下面',
alwaysShowExpandBtn: '是否一直显示展开收起按钮', alwaysShowExpandBtn: '是否一直显示展开收起按钮',
enableAutoEnterTextEditWhenKeydown: '键盘输入时自动进入文本编辑', enableAutoEnterTextEditWhenKeydown: '键盘输入时自动进入文本编辑',
enableInheritAncestorLineStyle: '节点连线样式继承祖先节点的样式',
confirm: '确定', confirm: '确定',
cancel: '取消', cancel: '取消',
changeRichTextTip: changeRichTextTip:

View File

@ -42,9 +42,7 @@ export default {
notUseRainbowLines: '不使用彩虹線條', notUseRainbowLines: '不使用彩虹線條',
outerFramePadding: '外框內距', outerFramePadding: '外框內距',
tagPositionRight: '文本右側', tagPositionRight: '文本右側',
tagPositionBottom: '文本下面', tagPositionBottom: '文本下面'
alwaysShowExpandBtn: '是否壹直顯示展開收起按鈕',
enableAutoEnterTextEditWhenKeydown: '鍵盤輸入時自動進入文本編輯'
}, },
setting: { setting: {
title: '設置', title: '設置',
@ -84,7 +82,10 @@ export default {
changeRichTextTip3: '是否切換爲非富文本模式?', changeRichTextTip3: '是否切換爲非富文本模式?',
enableDragImport: '是否允許直接拖拽文件到頁面進行導入', enableDragImport: '是否允許直接拖拽文件到頁面進行導入',
imgTextMargin: '節點圖片和文本間隔', imgTextMargin: '節點圖片和文本間隔',
textContentMargin: '節點各種內容間隔' textContentMargin: '節點各種內容間隔',
enableAutoEnterTextEditWhenKeydown: '鍵盤輸入時自動進入文本編輯',
enableInheritAncestorLineStyle: '節點連線樣式繼承祖先節點的樣式',
alwaysShowExpandBtn: '是否壹直顯示展開收起按鈕'
}, },
color: { color: {
moreColor: '更多顏色' moreColor: '更多顏色'

View File

@ -1,6 +1,6 @@
<template> <template>
<Sidebar ref="sidebar" :title="$t('baseStyle.title')"> <Sidebar ref="sidebar" :title="$t('baseStyle.title')">
<div class="sidebarContent" :class="{ isDark: isDark }" v-if="data"> <div class="sidebarContent customScrollbar" :class="{ isDark: isDark }" v-if="data">
<!-- 背景 --> <!-- 背景 -->
<div class="title noTop">{{ $t('baseStyle.background') }}</div> <div class="title noTop">{{ $t('baseStyle.background') }}</div>
<div class="row"> <div class="row">

View File

@ -18,7 +18,7 @@
> >
</div> </div>
<div class="title">{{ $t('formulaSidebar.common') }}</div> <div class="title">{{ $t('formulaSidebar.common') }}</div>
<div class="formulaList"> <div class="formulaList customScrollbar">
<div class="formulaItem" v-for="(item, index) in list" :key="index"> <div class="formulaItem" v-for="(item, index) in list" :key="index">
<div class="overview" v-html="item.overview"></div> <div class="overview" v-html="item.overview"></div>
<div class="text" @click="formulaText = item.text"> <div class="text" @click="formulaText = item.text">

View File

@ -1,6 +1,6 @@
<template> <template>
<Sidebar ref="sidebar" :title="$t('setting.title')"> <Sidebar ref="sidebar" :title="$t('setting.title')">
<div class="sidebarContent" :class="{ isDark: isDark }" v-if="data"> <div class="sidebarContent customScrollbar" :class="{ isDark: isDark }" v-if="data">
<!-- 水印 --> <!-- 水印 -->
<div class="row"> <div class="row">
<!-- 是否显示水印 --> <!-- 是否显示水印 -->
@ -230,6 +230,18 @@
> >
</div> </div>
</div> </div>
<!-- 节点连线样式是否允许继承祖先的连线样式 -->
<div class="row">
<div class="rowItem">
<el-checkbox
v-model="config.enableInheritAncestorLineStyle"
@change="
updateOtherConfig('enableInheritAncestorLineStyle', $event)
"
>{{ $t('setting.enableInheritAncestorLineStyle') }}</el-checkbox
>
</div>
</div>
<!-- 是否开启手绘风格 --> <!-- 是否开启手绘风格 -->
<div class="row" v-if="supportHandDrawnLikeStyle"> <div class="row" v-if="supportHandDrawnLikeStyle">
<div class="rowItem"> <div class="rowItem">
@ -387,7 +399,8 @@ export default {
alwaysShowExpandBtn: false, alwaysShowExpandBtn: false,
enableAutoEnterTextEditWhenKeydown: true, enableAutoEnterTextEditWhenKeydown: true,
imgTextMargin: 0, imgTextMargin: 0,
textContentMargin: 0 textContentMargin: 0,
enableInheritAncestorLineStyle: false
}, },
watermarkConfig: { watermarkConfig: {
show: false, show: false,
@ -479,7 +492,14 @@ export default {
storeConfig({ storeConfig({
config: this.data.config config: this.data.config
}) })
if (['alwaysShowExpandBtn', 'imgTextMargin', 'textContentMargin'].includes(key)) { if (
[
'alwaysShowExpandBtn',
'imgTextMargin',
'textContentMargin',
'enableInheritAncestorLineStyle'
].includes(key)
) {
this.mindMap.reRender() this.mindMap.reRender()
} }
}, },

View File

@ -9,7 +9,7 @@
<div class="sidebarHeader" v-if="title"> <div class="sidebarHeader" v-if="title">
{{ title }} {{ title }}
</div> </div>
<div class="sidebarContent" ref="sidebarContent"> <div class="sidebarContent customScrollbar" ref="sidebarContent">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>

View File

@ -5,7 +5,7 @@
:class="{ isDark: isDark }" :class="{ isDark: isDark }"
v-if="activeNodes.length > 0" v-if="activeNodes.length > 0"
> >
<div class="sidebarContent"> <div class="sidebarContent customScrollbar">
<!-- 文字 --> <!-- 文字 -->
<div class="title noTop">{{ $t('style.text') }}</div> <div class="title noTop">{{ $t('style.text') }}</div>
<div class="row"> <div class="row">