diff --git a/simple-mind-map/example/exampleData.js b/simple-mind-map/example/exampleData.js index d1e23677..2851f417 100644 --- a/simple-mind-map/example/exampleData.js +++ b/simple-mind-map/example/exampleData.js @@ -795,6 +795,6 @@ export default { }, // "layout": "mindMap", // "layout": "logicalStructure" - "layout": "catalogOrganization" - // "layout": "organizationStructure" + // "layout": "catalogOrganization" + "layout": "organizationStructure" } \ No newline at end of file diff --git a/simple-mind-map/src/themes/dark2.js b/simple-mind-map/src/themes/dark2.js new file mode 100644 index 00000000..bb5d3264 --- /dev/null +++ b/simple-mind-map/src/themes/dark2.js @@ -0,0 +1,46 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 暗色2 + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: 'rgb(75, 81, 78)', + lineWidth: 3, + // 背景颜色 + backgroundColor: 'rgb(27, 31, 34)', + // 根节点样式 + root: { + fillColor: 'rgb(36, 179, 96)', + color: '#fff', + borderColor: '', + borderWidth: 0, + active: { + borderColor: 'rgb(254, 199, 13)', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: 'rgb(254, 199, 13)', + color: 'rgb(0, 0, 0)', + borderColor: '', + borderWidth: 0, + fontSize: 14, + active: { + borderColor: 'rgb(36, 179, 96)', + borderWidth: 2 + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: 'rgb(204, 204, 204)', + active: { + borderColor: 'rgb(254, 199, 13)' + } + } +}) \ No newline at end of file diff --git a/simple-mind-map/src/themes/gold.js b/simple-mind-map/src/themes/gold.js new file mode 100644 index 00000000..06125e21 --- /dev/null +++ b/simple-mind-map/src/themes/gold.js @@ -0,0 +1,46 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 金色vip + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: 'rgb(51, 56, 62)', + lineWidth: 3, + // 背景颜色 + backgroundColor: '#fff', + // 根节点样式 + root: { + fillColor: 'rgb(51, 56, 62)', + color: 'rgb(247, 208, 160)', + borderColor: '', + borderWidth: 0, + active: { + borderColor: 'rgb(247, 208, 160)', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: 'rgb(239, 209, 176)', + color: 'rgb(81, 58, 42)', + borderColor: '', + borderWidth: 0, + fontSize: 14, + active: { + borderColor: 'rgb(51, 56, 62)', + borderWidth: 2 + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: '#222', + active: { + borderColor: 'rgb(0, 192, 184)' + } + } +}) \ No newline at end of file diff --git a/simple-mind-map/src/themes/greenLeaf.js b/simple-mind-map/src/themes/greenLeaf.js new file mode 100644 index 00000000..4dd9fcb2 --- /dev/null +++ b/simple-mind-map/src/themes/greenLeaf.js @@ -0,0 +1,46 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 绿叶 + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: 'rgb(40, 193, 84)', + lineWidth: 3, + // 背景颜色 + backgroundColor: 'rgb(238, 255, 243)', + // 根节点样式 + root: { + fillColor: 'rgb(25, 193, 73)', + color: '#fff', + borderColor: '', + borderWidth: 0, + active: { + borderColor: '#222', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: '#fff', + color: 'rgb(69, 149, 96)', + borderColor: '', + borderWidth: 0, + fontSize: 14, + active: { + borderColor: 'rgb(25, 193, 73)', + borderWidth: 2 + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: '#222', + active: { + borderColor: 'rgb(25, 193, 73)' + } + } +}) \ No newline at end of file diff --git a/simple-mind-map/src/themes/index.js b/simple-mind-map/src/themes/index.js index 03434e45..5210b91b 100644 --- a/simple-mind-map/src/themes/index.js +++ b/simple-mind-map/src/themes/index.js @@ -13,6 +13,12 @@ import classicGreen from './classicGreen' import classicBlue from './classicBlue' import minions from './minions' import pinkGrape from './pinkGrape' +import mint from './mint' +import gold from './gold' +import vitalityOrange from './vitalityOrange' +import greenLeaf from './greenLeaf' +import dark2 from './dark2' +import skyGreen from './skyGreen' export default { default: defaultTheme, @@ -29,5 +35,11 @@ export default { classicGreen, classicBlue, minions, - pinkGrape + pinkGrape, + mint, + gold, + vitalityOrange, + greenLeaf, + dark2, + skyGreen } \ No newline at end of file diff --git a/simple-mind-map/src/themes/mint.js b/simple-mind-map/src/themes/mint.js new file mode 100644 index 00000000..9578c155 --- /dev/null +++ b/simple-mind-map/src/themes/mint.js @@ -0,0 +1,44 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 薄荷 + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: 'rgb(104, 204, 202)', + lineWidth: 3, + // 背景颜色 + backgroundColor: 'rgb(239, 255, 255)', + // 根节点样式 + root: { + fillColor: 'rgb(0, 192, 184)', + borderColor: '', + borderWidth: 0, + active: { + borderColor: 'rgb(255, 160, 36)', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: '#fff', + color: '#222', + borderColor: 'rgb(184, 235, 233)', + borderWidth: 2, + fontSize: 14, + active: { + borderColor: 'rgb(0, 192, 184)' + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: '#222', + active: { + borderColor: 'rgb(0, 192, 184)' + } + } +}) \ No newline at end of file diff --git a/simple-mind-map/src/themes/skyGreen.js b/simple-mind-map/src/themes/skyGreen.js new file mode 100644 index 00000000..74e17c87 --- /dev/null +++ b/simple-mind-map/src/themes/skyGreen.js @@ -0,0 +1,46 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 天清绿 + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: '#fff', + lineWidth: 3, + // 背景颜色 + backgroundColor: 'rgb(80, 156, 170)', + // 根节点样式 + root: { + fillColor: '#fff', + borderColor: '', + borderWidth: 0, + color: 'rgb(65, 89, 158)', + active: { + borderColor: 'rgb(251, 227, 188)', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: 'rgb(251, 227, 188)', + color: 'rgb(65, 89, 158)', + borderColor: '', + borderWidth: 0, + fontSize: 14, + active: { + borderColor: '#fff', + borderWidth: 2, + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: 'rgb(65, 89, 158)', + active: { + borderColor: 'rgb(251, 227, 188)' + } + } +}) \ No newline at end of file diff --git a/simple-mind-map/src/themes/vitalityOrange.js b/simple-mind-map/src/themes/vitalityOrange.js new file mode 100644 index 00000000..6e4c8817 --- /dev/null +++ b/simple-mind-map/src/themes/vitalityOrange.js @@ -0,0 +1,46 @@ +import defaultTheme from './default'; +import merge from 'deepmerge'; + +/** + * @Author: 王林 + * @Date: 2021-04-11 15:22:18 + * @Desc: 活力橙 + */ +export default merge(defaultTheme, { + // 连线的颜色 + lineColor: 'rgb(254, 146, 0)', + lineWidth: 3, + // 背景颜色 + backgroundColor: 'rgb(255, 246, 243)', + // 根节点样式 + root: { + fillColor: 'rgb(255, 112, 52)', + color: '#fff', + borderColor: '', + borderWidth: 0, + active: { + borderColor: 'rgb(51, 51, 51)', + borderWidth: 3, + } + }, + // 二级节点样式 + second: { + fillColor: '#fff', + color: 'rgb(51, 51, 51)', + borderColor: '', + borderWidth: 0, + fontSize: 14, + active: { + borderColor: 'rgb(255, 112, 52)', + borderWidth: 2 + } + }, + // 三级及以下节点样式 + node: { + fontSize: 12, + color: '#222', + active: { + borderColor: 'rgb(255, 112, 52)' + } + } +}) \ No newline at end of file diff --git a/web/src/assets/icon-font/demo_index.html b/web/src/assets/icon-font/demo_index.html index eb11f7f8..4dd3e0de 100644 --- a/web/src/assets/icon-font/demo_index.html +++ b/web/src/assets/icon-font/demo_index.html @@ -54,6 +54,18 @@