vue-editify 0.1.47 → 0.1.48
Sign up to get free protection for your applications and to get access to all the features.
- package/examples/App.vue +30 -51
- package/lib/core/function.d.ts +50 -63
- package/lib/editify.es.js +18653 -18044
- package/lib/editify.umd.js +1 -1
- package/lib/index.d.ts +6 -2
- package/lib/plugins/infoBlock/index.d.ts +55 -0
- package/lib/plugins/panel/index.d.ts +48 -0
- package/lib/style.css +1 -1
- package/package.json +2 -2
- package/src/components/menu/menu.vue +14 -13
- package/src/components/toolbar/toolbar.vue +146 -111
- package/src/core/function.ts +249 -183
- package/src/core/rule.ts +78 -48
- package/src/editify/editify.less +52 -1
- package/src/editify/editify.vue +29 -29
- package/src/icon/iconfont.css +8 -0
- package/src/icon/iconfont.ttf +0 -0
- package/src/icon/iconfont.woff +0 -0
- package/src/index.ts +8 -2
- package/src/locale/en_US.ts +9 -1
- package/src/locale/zh_CN.ts +9 -1
- package/src/plugins/attachment/index.ts +10 -6
- package/src/plugins/infoBlock/index.ts +238 -0
- package/src/plugins/mathformula/index.ts +1 -3
- package/src/plugins/panel/index.ts +228 -0
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "vue-editify",
|
3
|
-
"version": "0.1.
|
3
|
+
"version": "0.1.48",
|
4
4
|
"private": false,
|
5
5
|
"sideEffects": [
|
6
6
|
"*.css"
|
@@ -17,7 +17,7 @@
|
|
17
17
|
"lib": "vue-tsc && vite build"
|
18
18
|
},
|
19
19
|
"dependencies": {
|
20
|
-
"alex-editor": "^1.4.
|
20
|
+
"alex-editor": "^1.4.13",
|
21
21
|
"dap-util": "^1.5.4",
|
22
22
|
"highlight.js": "^11.8.0",
|
23
23
|
"katex": "^0.16.10",
|
@@ -14,7 +14,7 @@ import InsertVideo from '../insertVideo/insertVideo.vue'
|
|
14
14
|
import InsertTable from '../insertTable/insertTable.vue'
|
15
15
|
import { h, getCurrentInstance, ref, computed, inject, ComponentInternalInstance, Ref, ComputedRef, defineComponent } from 'vue'
|
16
16
|
import { common as DapCommon } from 'dap-util'
|
17
|
-
import { getRangeText, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, hasPreInRange, hasTableInRange,
|
17
|
+
import { getRangeText, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, hasPreInRange, hasTableInRange, hasLinkInRange, isRangeInQuote, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getMatchElementByRange, hasImageInRange, hasVideoInRange, insertSeparator } from '../../core/function'
|
18
18
|
import { MenuProps } from './props'
|
19
19
|
import { MenuModeType, ObjectType, PluginResultType, MenuExtendType, MenuSequenceType, mergeObject } from '../../core/tool'
|
20
20
|
import { AlexEditor, AlexElementsRangeType } from 'alex-editor'
|
@@ -457,7 +457,7 @@ const handleOperate = (name: string, val: any) => {
|
|
457
457
|
}
|
458
458
|
//设置对齐方式
|
459
459
|
else if (name == 'align') {
|
460
|
-
setAlign(editor.value, dataRangeCaches.value,
|
460
|
+
setAlign(editor.value, dataRangeCaches.value, val as 'left' | 'right' | 'center' | 'justify')
|
461
461
|
editor.value.formatElementStack()
|
462
462
|
editor.value.domRender()
|
463
463
|
editor.value.rangeRender()
|
@@ -712,22 +712,20 @@ const handleRangeUpdate = () => {
|
|
712
712
|
const value_hasPreInRange = hasPreInRange(editor.value, dataRangeCaches.value)
|
713
713
|
//选区是否含有表格元素
|
714
714
|
const value_hasTableInRange = hasTableInRange(editor.value, dataRangeCaches.value)
|
715
|
-
//选区是否含有引用元素
|
716
|
-
const value_hasQuoteInRange = hasQuoteInRange(editor.value, dataRangeCaches.value)
|
717
|
-
//选区是否都在引用元素内
|
718
|
-
const value_isRangeInQuote = isRangeInQuote(editor.value, dataRangeCaches.value)
|
719
715
|
//选区是否含有链接元素
|
720
716
|
const value_hasLinkInRange = hasLinkInRange(editor.value, dataRangeCaches.value)
|
717
|
+
//选区是否含有图片
|
718
|
+
const value_hasImageInRange = hasImageInRange(editor.value, dataRangeCaches.value)
|
719
|
+
//选区是否含有视频
|
720
|
+
const value_hasVideoInRange = hasVideoInRange(editor.value, dataRangeCaches.value)
|
721
|
+
//选区是否都在引用元素内
|
722
|
+
const value_isRangeInQuote = isRangeInQuote(editor.value, dataRangeCaches.value)
|
721
723
|
//选区是否都在有序列表内
|
722
724
|
const value_isRangeInOrderList = isRangeInList(editor.value, dataRangeCaches.value, true)
|
723
725
|
//选区是否都在无序列表内
|
724
726
|
const value_isRangeInUnorderList = isRangeInList(editor.value, dataRangeCaches.value, false)
|
725
727
|
//选区是否都在任务列表内
|
726
728
|
const value_isRangeInTask = isRangeInTask(editor.value, dataRangeCaches.value)
|
727
|
-
//选区是否含有图片
|
728
|
-
const value_hasImageInRange = hasImageInRange(editor.value, dataRangeCaches.value)
|
729
|
-
//选区是否含有视频
|
730
|
-
const value_hasVideoInRange = hasVideoInRange(editor.value, dataRangeCaches.value)
|
731
729
|
//额外禁用判定
|
732
730
|
const extraDisabled = (name: string) => {
|
733
731
|
//对插件列表的menu的extraDisabled配置进行处理,获取最终是否禁用的结果
|
@@ -784,6 +782,9 @@ const handleRangeUpdate = () => {
|
|
784
782
|
//引用按钮禁用
|
785
783
|
quoteConfig.value.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('quote')
|
786
784
|
|
785
|
+
//分隔线按钮禁用
|
786
|
+
separatorConfig.value.disabled = value_hasPreInRange || extraDisabled('separator')
|
787
|
+
|
787
788
|
//对齐方式按钮禁用
|
788
789
|
alignConfig.value.disabled = value_hasPreInRange || extraDisabled('align')
|
789
790
|
|
@@ -920,12 +921,12 @@ const handleRangeUpdate = () => {
|
|
920
921
|
videoConfig.value.disabled = value_hasPreInRange || extraDisabled('video')
|
921
922
|
|
922
923
|
//表格按钮禁用
|
923
|
-
tableConfig.value.disabled = value_hasPreInRange || value_hasTableInRange ||
|
924
|
+
tableConfig.value.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('table')
|
924
925
|
|
925
926
|
//代码块按钮激活
|
926
|
-
codeBlockConfig.value.active =
|
927
|
+
codeBlockConfig.value.active = !!getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' })
|
927
928
|
//代码块按钮禁用
|
928
|
-
codeBlockConfig.value.disabled = value_hasTableInRange ||
|
929
|
+
codeBlockConfig.value.disabled = value_hasTableInRange || value_hasImageInRange || value_hasVideoInRange || extraDisabled('codeBlock')
|
929
930
|
|
930
931
|
//代码视图按钮激活
|
931
932
|
sourceViewConfig.value.active = isSourceView.value
|
@@ -215,9 +215,9 @@ import Button from '../button/button.vue'
|
|
215
215
|
import Icon from '../icon/icon.vue'
|
216
216
|
import Checkbox from '../checkbox/checkbox.vue'
|
217
217
|
import Colors from '../colors/colors.vue'
|
218
|
-
import { AlexEditor, AlexElement, AlexElementsRangeType } from 'alex-editor'
|
218
|
+
import { AlexEditor, AlexElement, AlexElementCreateConfigType, AlexElementsRangeType } from 'alex-editor'
|
219
219
|
import { common as DapCommon } from 'dap-util'
|
220
|
-
import { getCellSpanNumber, getTableSize,
|
220
|
+
import { getCellSpanNumber, getTableSize, getMatchElementByRange, removeTextStyle, removeTextMark, setTextStyle, setLineHeight, setTextMark, setList, setTask, setHeading, setAlign, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getMatchElementByElement, getCellMergeElement, setTableCellMerged } from '../../core/function'
|
221
221
|
import { ToolbarProps } from './props'
|
222
222
|
import { Ref, computed, inject, ref } from 'vue'
|
223
223
|
import { ObjectType } from '../../core/tool'
|
@@ -800,7 +800,7 @@ const _setHeading = (_name: string, value: string) => {
|
|
800
800
|
}
|
801
801
|
//设置对齐方式
|
802
802
|
const _setAlign = (_name: string, value: string) => {
|
803
|
-
setAlign(editor.value, dataRangeCaches.value, value)
|
803
|
+
setAlign(editor.value, dataRangeCaches.value, value as 'left' | 'right' | 'center' | 'justify')
|
804
804
|
editor.value.formatElementStack()
|
805
805
|
editor.value.domRender()
|
806
806
|
editor.value.rangeRender()
|
@@ -847,13 +847,13 @@ const modifyLink = () => {
|
|
847
847
|
if (!linkConfig.value.url) {
|
848
848
|
return
|
849
849
|
}
|
850
|
-
const
|
851
|
-
if (
|
852
|
-
|
850
|
+
const link = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
|
851
|
+
if (link) {
|
852
|
+
link.marks!.href = linkConfig.value.url
|
853
853
|
if (linkConfig.value.newOpen) {
|
854
|
-
|
854
|
+
link.marks!.target = '_blank'
|
855
855
|
} else {
|
856
|
-
delete
|
856
|
+
delete link.marks!.target
|
857
857
|
}
|
858
858
|
editor.value.formatElementStack()
|
859
859
|
editor.value.domRender()
|
@@ -861,12 +861,12 @@ const modifyLink = () => {
|
|
861
861
|
}
|
862
862
|
//移除链接
|
863
863
|
const removeLink = () => {
|
864
|
-
const
|
865
|
-
if (
|
866
|
-
|
867
|
-
delete
|
868
|
-
delete
|
869
|
-
delete
|
864
|
+
const link = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
|
865
|
+
if (link) {
|
866
|
+
link.parsedom = AlexElement.TEXT_NODE
|
867
|
+
delete link.marks!['target']
|
868
|
+
delete link.marks!['href']
|
869
|
+
delete link.marks!['data-editify-element']
|
870
870
|
editor.value.formatElementStack()
|
871
871
|
editor.value.domRender()
|
872
872
|
editor.value.rangeRender()
|
@@ -874,9 +874,9 @@ const removeLink = () => {
|
|
874
874
|
}
|
875
875
|
//选择代码语言
|
876
876
|
const selectLanguage = (_name: string, value: string) => {
|
877
|
-
const
|
878
|
-
if (
|
879
|
-
Object.assign(
|
877
|
+
const pre = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' })
|
878
|
+
if (pre) {
|
879
|
+
Object.assign(pre.marks!, {
|
880
880
|
'data-editify-hljs': value
|
881
881
|
})
|
882
882
|
editor.value.formatElementStack()
|
@@ -890,15 +890,22 @@ const insertParagraphWithPre = (type: string | undefined = 'up') => {
|
|
890
890
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
891
891
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
892
892
|
}
|
893
|
-
const
|
894
|
-
if (
|
895
|
-
const paragraph =
|
896
|
-
|
897
|
-
|
893
|
+
const pre = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'pre' })
|
894
|
+
if (pre) {
|
895
|
+
const paragraph = AlexElement.create({
|
896
|
+
type: 'block',
|
897
|
+
parsedom: AlexElement.BLOCK_NODE,
|
898
|
+
children: [
|
899
|
+
{
|
900
|
+
type: 'closed',
|
901
|
+
parsedom: 'br'
|
902
|
+
}
|
903
|
+
]
|
904
|
+
})
|
898
905
|
if (type == 'up') {
|
899
|
-
editor.value.addElementBefore(paragraph,
|
906
|
+
editor.value.addElementBefore(paragraph, pre)
|
900
907
|
} else {
|
901
|
-
editor.value.addElementAfter(paragraph,
|
908
|
+
editor.value.addElementAfter(paragraph, pre)
|
902
909
|
}
|
903
910
|
editor.value.range!.anchor.moveToEnd(paragraph)
|
904
911
|
editor.value.range!.focus.moveToEnd(paragraph)
|
@@ -913,20 +920,27 @@ const insertTableColumn = (type: string | undefined = 'left') => {
|
|
913
920
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
914
921
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
915
922
|
}
|
916
|
-
const
|
917
|
-
if (
|
918
|
-
const row =
|
923
|
+
const column = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
|
924
|
+
if (column) {
|
925
|
+
const row = column.parent!
|
919
926
|
const tbody = row.parent!
|
920
927
|
const table = tbody.parent!
|
921
928
|
const rows = tbody.children
|
922
929
|
const index = row.children!.findIndex(item => {
|
923
|
-
return item.isEqual(
|
930
|
+
return item.isEqual(column)
|
924
931
|
})
|
925
932
|
//插入列
|
926
933
|
rows!.forEach(item => {
|
927
|
-
const newColumn =
|
928
|
-
|
929
|
-
|
934
|
+
const newColumn = AlexElement.create({
|
935
|
+
type: 'inblock',
|
936
|
+
parsedom: 'td',
|
937
|
+
children: [
|
938
|
+
{
|
939
|
+
type: 'closed',
|
940
|
+
parsedom: 'br'
|
941
|
+
}
|
942
|
+
]
|
943
|
+
})
|
930
944
|
if (type == 'left') {
|
931
945
|
editor.value.addElementTo(newColumn, item, index)
|
932
946
|
} else {
|
@@ -937,18 +951,21 @@ const insertTableColumn = (type: string | undefined = 'left') => {
|
|
937
951
|
const colgroup = table.children!.find(item => {
|
938
952
|
return item.parsedom == 'colgroup'
|
939
953
|
})!
|
940
|
-
const col =
|
954
|
+
const col = AlexElement.create({
|
955
|
+
type: 'closed',
|
956
|
+
parsedom: 'col'
|
957
|
+
})
|
941
958
|
if (type == 'left') {
|
942
959
|
editor.value.addElementTo(col, colgroup, index)
|
943
960
|
} else {
|
944
961
|
editor.value.addElementTo(col, colgroup, index + 1)
|
945
962
|
}
|
946
963
|
if (type == 'left') {
|
947
|
-
const previousColumn = editor.value.getPreviousElement(
|
964
|
+
const previousColumn = editor.value.getPreviousElement(column)!
|
948
965
|
editor.value.range!.anchor.moveToStart(previousColumn)
|
949
966
|
editor.value.range!.focus.moveToStart(previousColumn)
|
950
967
|
} else {
|
951
|
-
const nextColumn = editor.value.getNextElement(
|
968
|
+
const nextColumn = editor.value.getNextElement(column)!
|
952
969
|
editor.value.range!.anchor.moveToStart(nextColumn)
|
953
970
|
editor.value.range!.focus.moveToStart(nextColumn)
|
954
971
|
}
|
@@ -964,21 +981,32 @@ const insertTableRow = (type: string | undefined = 'up') => {
|
|
964
981
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
965
982
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
966
983
|
}
|
967
|
-
const
|
968
|
-
if (
|
969
|
-
const tbody =
|
984
|
+
const row = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'tr' })
|
985
|
+
if (row) {
|
986
|
+
const tbody = row.parent!
|
970
987
|
const { columnNumber } = getTableSize(tbody.children!)
|
971
|
-
const
|
988
|
+
const children: AlexElementCreateConfigType[] = []
|
972
989
|
for (let i = 0; i < columnNumber; i++) {
|
973
|
-
|
974
|
-
|
975
|
-
|
976
|
-
|
990
|
+
children.push({
|
991
|
+
type: 'inblock',
|
992
|
+
parsedom: 'td',
|
993
|
+
children: [
|
994
|
+
{
|
995
|
+
type: 'closed',
|
996
|
+
parsedom: 'br'
|
997
|
+
}
|
998
|
+
]
|
999
|
+
})
|
977
1000
|
}
|
1001
|
+
const newRow = AlexElement.create({
|
1002
|
+
type: 'inblock',
|
1003
|
+
parsedom: 'tr',
|
1004
|
+
children
|
1005
|
+
})
|
978
1006
|
if (type == 'up') {
|
979
|
-
editor.value.addElementBefore(newRow,
|
1007
|
+
editor.value.addElementBefore(newRow, row)
|
980
1008
|
} else {
|
981
|
-
editor.value.addElementAfter(newRow,
|
1009
|
+
editor.value.addElementAfter(newRow, row)
|
982
1010
|
}
|
983
1011
|
//重置光标
|
984
1012
|
editor.value.range!.anchor.moveToStart(newRow)
|
@@ -995,15 +1023,22 @@ const insertTableRow = (type: string | undefined = 'up') => {
|
|
995
1023
|
}
|
996
1024
|
//表格前后插入段落
|
997
1025
|
const insertParagraphWithTable = (type: string | undefined = 'up') => {
|
998
|
-
const
|
999
|
-
if (
|
1000
|
-
const paragraph =
|
1001
|
-
|
1002
|
-
|
1026
|
+
const table = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'table' })
|
1027
|
+
if (table) {
|
1028
|
+
const paragraph = AlexElement.create({
|
1029
|
+
type: 'block',
|
1030
|
+
parsedom: AlexElement.BLOCK_NODE,
|
1031
|
+
children: [
|
1032
|
+
{
|
1033
|
+
type: 'closed',
|
1034
|
+
parsedom: 'br'
|
1035
|
+
}
|
1036
|
+
]
|
1037
|
+
})
|
1003
1038
|
if (type == 'up') {
|
1004
|
-
editor.value.addElementBefore(paragraph,
|
1039
|
+
editor.value.addElementBefore(paragraph, table)
|
1005
1040
|
} else {
|
1006
|
-
editor.value.addElementAfter(paragraph,
|
1041
|
+
editor.value.addElementAfter(paragraph, table)
|
1007
1042
|
}
|
1008
1043
|
editor.value.range!.anchor.moveToEnd(paragraph)
|
1009
1044
|
editor.value.range!.focus.moveToEnd(paragraph)
|
@@ -1014,9 +1049,9 @@ const insertParagraphWithTable = (type: string | undefined = 'up') => {
|
|
1014
1049
|
}
|
1015
1050
|
//删除元素
|
1016
1051
|
const deleteElement = (parsedom: string) => {
|
1017
|
-
const
|
1018
|
-
if (
|
1019
|
-
|
1052
|
+
const element = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom })
|
1053
|
+
if (element) {
|
1054
|
+
element.toEmpty()
|
1020
1055
|
editor.value.formatElementStack()
|
1021
1056
|
editor.value.domRender()
|
1022
1057
|
editor.value.rangeRender()
|
@@ -1028,10 +1063,10 @@ const deleteTableRow = () => {
|
|
1028
1063
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
1029
1064
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
1030
1065
|
}
|
1031
|
-
const
|
1032
|
-
if (
|
1066
|
+
const column = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
|
1067
|
+
if (column) {
|
1033
1068
|
//光标所在行
|
1034
|
-
const row =
|
1069
|
+
const row = column.parent!
|
1035
1070
|
//如果只有一行则删除表格
|
1036
1071
|
if (row.parent!.children!.length == 1) {
|
1037
1072
|
deleteElement('table')
|
@@ -1039,7 +1074,7 @@ const deleteTableRow = () => {
|
|
1039
1074
|
}
|
1040
1075
|
//光标所在的单元格在行中的序列
|
1041
1076
|
const index = row.children!.findIndex(item => {
|
1042
|
-
return item.isEqual(
|
1077
|
+
return item.isEqual(column)
|
1043
1078
|
})
|
1044
1079
|
//上一行
|
1045
1080
|
const previousRow = editor.value.getPreviousElement(row)
|
@@ -1103,10 +1138,10 @@ const deleteTableColumn = () => {
|
|
1103
1138
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
1104
1139
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
1105
1140
|
}
|
1106
|
-
const
|
1107
|
-
if (
|
1141
|
+
const column = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
|
1142
|
+
if (column) {
|
1108
1143
|
//光标所在行
|
1109
|
-
const row =
|
1144
|
+
const row = column.parent!
|
1110
1145
|
//所有的行元素
|
1111
1146
|
const rows = row.parent!.children!
|
1112
1147
|
//表格元素
|
@@ -1118,12 +1153,12 @@ const deleteTableColumn = () => {
|
|
1118
1153
|
}
|
1119
1154
|
//光标所在的单元格在行中的序列
|
1120
1155
|
const index = row.children!.findIndex(item => {
|
1121
|
-
return item.isEqual(
|
1156
|
+
return item.isEqual(column)
|
1122
1157
|
})
|
1123
1158
|
//前一个单元格
|
1124
|
-
const previousColumn = editor.value.getPreviousElement(
|
1159
|
+
const previousColumn = editor.value.getPreviousElement(column)
|
1125
1160
|
//后一个单元格
|
1126
|
-
const nextColumn = editor.value.getNextElement(
|
1161
|
+
const nextColumn = editor.value.getNextElement(column)
|
1127
1162
|
//遍历所有的行元素
|
1128
1163
|
rows.forEach(item => {
|
1129
1164
|
//对应序列的单元格
|
@@ -1185,14 +1220,14 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1185
1220
|
editor.value.range!.anchor.element = editor.value.range!.focus.element
|
1186
1221
|
editor.value.range!.anchor.offset = editor.value.range!.focus.offset
|
1187
1222
|
}
|
1188
|
-
const
|
1189
|
-
if (
|
1223
|
+
const column = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'td' })
|
1224
|
+
if (column) {
|
1190
1225
|
//向左合并单元格
|
1191
1226
|
if (type == 'left') {
|
1192
1227
|
//当前单元格所占行数和列数
|
1193
|
-
const cellSpanNum = getCellSpanNumber(
|
1228
|
+
const cellSpanNum = getCellSpanNumber(column)
|
1194
1229
|
//获取左侧单元格
|
1195
|
-
const previousColumn = editor.value.getPreviousElement(
|
1230
|
+
const previousColumn = editor.value.getPreviousElement(column)
|
1196
1231
|
//如果左侧单元格存在
|
1197
1232
|
if (previousColumn) {
|
1198
1233
|
//左侧单元格是隐藏的单元格
|
@@ -1205,11 +1240,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1205
1240
|
//进行合并
|
1206
1241
|
if (rowspan == cellSpanNum.rowspan) {
|
1207
1242
|
crossColumnElement.marks!['colspan'] = colspan + cellSpanNum.colspan
|
1208
|
-
|
1243
|
+
column.children!.forEach(item => {
|
1209
1244
|
crossColumnElement.children!.push(item)
|
1210
1245
|
item.parent = crossColumnElement
|
1211
1246
|
})
|
1212
|
-
setTableCellMerged(
|
1247
|
+
setTableCellMerged(column)
|
1213
1248
|
editor.value.range!.anchor.moveToEnd(crossColumnElement)
|
1214
1249
|
editor.value.range!.focus.moveToEnd(crossColumnElement)
|
1215
1250
|
editor.value.formatElementStack()
|
@@ -1231,11 +1266,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1231
1266
|
colspan: colspan + cellSpanNum.colspan
|
1232
1267
|
}
|
1233
1268
|
}
|
1234
|
-
|
1269
|
+
column.children!.forEach(item => {
|
1235
1270
|
previousColumn.children!.push(item)
|
1236
1271
|
item.parent = previousColumn
|
1237
1272
|
})
|
1238
|
-
setTableCellMerged(
|
1273
|
+
setTableCellMerged(column)
|
1239
1274
|
editor.value.range!.anchor.moveToEnd(previousColumn)
|
1240
1275
|
editor.value.range!.focus.moveToEnd(previousColumn)
|
1241
1276
|
editor.value.formatElementStack()
|
@@ -1248,9 +1283,9 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1248
1283
|
//向右合并单元格
|
1249
1284
|
else if (type == 'right') {
|
1250
1285
|
//当前单元格所占行数和列数
|
1251
|
-
const cellSpanNum = getCellSpanNumber(
|
1286
|
+
const cellSpanNum = getCellSpanNumber(column)
|
1252
1287
|
//获取右侧的单元格
|
1253
|
-
let nextColumn = editor.value.getNextElement(
|
1288
|
+
let nextColumn = editor.value.getNextElement(column)
|
1254
1289
|
//如果右侧单元格存在
|
1255
1290
|
while (nextColumn) {
|
1256
1291
|
//右侧单元格是隐藏的单元格
|
@@ -1272,20 +1307,20 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1272
1307
|
const { rowspan, colspan } = getCellSpanNumber(nextColumn)
|
1273
1308
|
//如果一致则可以合并
|
1274
1309
|
if (rowspan == cellSpanNum.rowspan) {
|
1275
|
-
if (
|
1276
|
-
|
1310
|
+
if (column.hasMarks()) {
|
1311
|
+
column.marks!['colspan'] = cellSpanNum.colspan + colspan
|
1277
1312
|
} else {
|
1278
|
-
|
1313
|
+
column.marks = {
|
1279
1314
|
colspan: cellSpanNum.colspan + colspan
|
1280
1315
|
}
|
1281
1316
|
}
|
1282
1317
|
nextColumn.children!.forEach(item => {
|
1283
|
-
|
1284
|
-
item.parent =
|
1318
|
+
column.children!.push(item)
|
1319
|
+
item.parent = column
|
1285
1320
|
})
|
1286
1321
|
setTableCellMerged(nextColumn)
|
1287
|
-
editor.value.range!.anchor.moveToEnd(
|
1288
|
-
editor.value.range!.focus.moveToEnd(
|
1322
|
+
editor.value.range!.anchor.moveToEnd(column)
|
1323
|
+
editor.value.range!.focus.moveToEnd(column)
|
1289
1324
|
editor.value.formatElementStack()
|
1290
1325
|
editor.value.domRender()
|
1291
1326
|
editor.value.rangeRender()
|
@@ -1298,11 +1333,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1298
1333
|
//向上合并单元格
|
1299
1334
|
else if (type == 'up') {
|
1300
1335
|
//当前单元格所占行数和列数
|
1301
|
-
const cellSpanNum = getCellSpanNumber(
|
1336
|
+
const cellSpanNum = getCellSpanNumber(column)
|
1302
1337
|
//获取单元格在行中的序列
|
1303
|
-
const index =
|
1338
|
+
const index = column.parent!.children!.findIndex(item => item.isEqual(column))
|
1304
1339
|
//获取上一行
|
1305
|
-
const previousRow = editor.value.getPreviousElement(
|
1340
|
+
const previousRow = editor.value.getPreviousElement(column.parent!)
|
1306
1341
|
//如果上一行存在
|
1307
1342
|
if (previousRow) {
|
1308
1343
|
//获取上一行中对应序列的单元格
|
@@ -1317,11 +1352,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1317
1352
|
//进行合并
|
1318
1353
|
if (colspan == cellSpanNum.colspan) {
|
1319
1354
|
crossRowElement.marks!['rowspan'] = rowspan + cellSpanNum.rowspan
|
1320
|
-
|
1355
|
+
column.children!.forEach(item => {
|
1321
1356
|
crossRowElement.children!.push(item)
|
1322
1357
|
item.parent = crossRowElement
|
1323
1358
|
})
|
1324
|
-
setTableCellMerged(
|
1359
|
+
setTableCellMerged(column)
|
1325
1360
|
editor.value.range!.anchor.moveToEnd(crossRowElement)
|
1326
1361
|
editor.value.range!.focus.moveToEnd(crossRowElement)
|
1327
1362
|
editor.value.formatElementStack()
|
@@ -1343,11 +1378,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1343
1378
|
rowspan: rowspan + cellSpanNum.rowspan
|
1344
1379
|
}
|
1345
1380
|
}
|
1346
|
-
|
1381
|
+
column.children!.forEach(item => {
|
1347
1382
|
previousColumn.children!.push(item)
|
1348
1383
|
item.parent = previousColumn
|
1349
1384
|
})
|
1350
|
-
setTableCellMerged(
|
1385
|
+
setTableCellMerged(column)
|
1351
1386
|
editor.value.range!.anchor.moveToEnd(previousColumn)
|
1352
1387
|
editor.value.range!.focus.moveToEnd(previousColumn)
|
1353
1388
|
editor.value.formatElementStack()
|
@@ -1360,11 +1395,11 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1360
1395
|
//向下合并单元格
|
1361
1396
|
else if (type == 'down') {
|
1362
1397
|
//当前单元格所占行数和列数
|
1363
|
-
const cellSpanNum = getCellSpanNumber(
|
1398
|
+
const cellSpanNum = getCellSpanNumber(column)
|
1364
1399
|
//获取单元格在行中的序列
|
1365
|
-
const index =
|
1400
|
+
const index = column.parent!.children!.findIndex(item => item.isEqual(column))
|
1366
1401
|
//获取下一行
|
1367
|
-
let nextRow = editor.value.getNextElement(
|
1402
|
+
let nextRow = editor.value.getNextElement(column.parent!)
|
1368
1403
|
//如果下一行存在
|
1369
1404
|
while (nextRow) {
|
1370
1405
|
//获取下一行中对应序列的单元格
|
@@ -1388,20 +1423,20 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1388
1423
|
const { rowspan, colspan } = getCellSpanNumber(nextColumn)
|
1389
1424
|
//如果一致则可以合并
|
1390
1425
|
if (colspan == cellSpanNum.colspan) {
|
1391
|
-
if (
|
1392
|
-
|
1426
|
+
if (column.hasMarks()) {
|
1427
|
+
column.marks!['rowspan'] = cellSpanNum.rowspan + rowspan
|
1393
1428
|
} else {
|
1394
|
-
|
1429
|
+
column.marks = {
|
1395
1430
|
rowspan: cellSpanNum.rowspan + rowspan
|
1396
1431
|
}
|
1397
1432
|
}
|
1398
1433
|
nextColumn.children!.forEach(item => {
|
1399
|
-
|
1400
|
-
item.parent =
|
1434
|
+
column.children!.push(item)
|
1435
|
+
item.parent = column
|
1401
1436
|
})
|
1402
1437
|
setTableCellMerged(nextColumn)
|
1403
|
-
editor.value.range!.anchor.moveToEnd(
|
1404
|
-
editor.value.range!.focus.moveToEnd(
|
1438
|
+
editor.value.range!.anchor.moveToEnd(column)
|
1439
|
+
editor.value.range!.focus.moveToEnd(column)
|
1405
1440
|
editor.value.formatElementStack()
|
1406
1441
|
editor.value.domRender()
|
1407
1442
|
editor.value.rangeRender()
|
@@ -1417,29 +1452,29 @@ const mergeCells = (type: 'left' | 'right' | 'up' | 'down') => {
|
|
1417
1452
|
const layerShow = () => {
|
1418
1453
|
//链接初始化展示
|
1419
1454
|
if (props.type == 'link') {
|
1420
|
-
const
|
1421
|
-
if (
|
1422
|
-
linkConfig.value.url =
|
1423
|
-
linkConfig.value.newOpen =
|
1455
|
+
const link = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'a' })
|
1456
|
+
if (link) {
|
1457
|
+
linkConfig.value.url = link.marks!['href']
|
1458
|
+
linkConfig.value.newOpen = link.marks!['target'] == '_blank'
|
1424
1459
|
}
|
1425
1460
|
}
|
1426
1461
|
//视频初始化显示
|
1427
1462
|
else if (props.type == 'video') {
|
1428
|
-
const
|
1429
|
-
if (
|
1430
|
-
videoConfig.value.autoplay = !!
|
1431
|
-
videoConfig.value.loop = !!
|
1432
|
-
videoConfig.value.controls = !!
|
1433
|
-
videoConfig.value.muted = !!
|
1463
|
+
const video = getMatchElementByRange(editor.value, dataRangeCaches.value, { parsedom: 'video' })
|
1464
|
+
if (video) {
|
1465
|
+
videoConfig.value.autoplay = !!video.marks!['autoplay']
|
1466
|
+
videoConfig.value.loop = !!video.marks!['loop']
|
1467
|
+
videoConfig.value.controls = !!video.marks!['controls']
|
1468
|
+
videoConfig.value.muted = !!video.marks!['muted']
|
1434
1469
|
}
|
1435
1470
|
}
|
1436
1471
|
//代码块初始化展示设置
|
1437
1472
|
else if (props.type == 'codeBlock') {
|
1438
|
-
const
|
1473
|
+
const pre = getMatchElementByRange(editor.value, dataRangeCaches.value, {
|
1439
1474
|
parsedom: 'pre'
|
1440
1475
|
})
|
1441
|
-
if (
|
1442
|
-
languageConfig.value.displayConfig.value =
|
1476
|
+
if (pre) {
|
1477
|
+
languageConfig.value.displayConfig.value = pre.marks!['data-editify-hljs'] || ''
|
1443
1478
|
}
|
1444
1479
|
}
|
1445
1480
|
//文本工具条初始化显示
|