vue-editify 0.0.51 → 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/examples/App.vue +20 -5594
- package/lib/editify.es.js +6873 -7843
- package/lib/editify.umd.js +1 -1
- package/lib/style.css +1 -1
- package/package.json +2 -2
- package/src/Editify.vue +258 -1241
- package/src/components/{bussiness/Menu.vue → Menu.vue} +235 -142
- package/src/components/{bussiness/Toolbar.vue → Toolbar.vue} +227 -141
- package/src/components/base/Button.vue +6 -6
- package/src/components/base/Checkbox.vue +4 -4
- package/src/components/base/Layer.vue +12 -12
- package/src/components/{bussiness → common}/InsertImage.vue +7 -7
- package/src/components/{bussiness → common}/InsertVideo.vue +7 -7
- package/src/core/function.js +1044 -0
- package/src/core/rule.js +239 -0
- package/src/core/{index.js → tool.js} +60 -296
- package/src/index.js +1 -1
- /package/src/components/{bussiness → common}/Colors.vue +0 -0
- /package/src/components/{bussiness → common}/InsertLink.vue +0 -0
- /package/src/components/{bussiness → common}/InsertTable.vue +0 -0
@@ -4,16 +4,16 @@
|
|
4
4
|
</div>
|
5
5
|
</template>
|
6
6
|
<script>
|
7
|
-
import Icon from '
|
8
|
-
import Button from '
|
9
|
-
import Colors from './Colors'
|
10
|
-
import InsertLink from './InsertLink'
|
11
|
-
import InsertImage from './InsertImage'
|
12
|
-
import InsertVideo from './InsertVideo'
|
13
|
-
import InsertTable from './InsertTable'
|
7
|
+
import Icon from './base/Icon'
|
8
|
+
import Button from './base/Button'
|
9
|
+
import Colors from './common/Colors'
|
10
|
+
import InsertLink from './common/InsertLink'
|
11
|
+
import InsertImage from './common/InsertImage'
|
12
|
+
import InsertVideo from './common/InsertVideo'
|
13
|
+
import InsertTable from './common/InsertTable'
|
14
14
|
import { h, getCurrentInstance } from 'vue'
|
15
|
-
import {
|
16
|
-
import
|
15
|
+
import { common as DapCommon } from 'dap-util'
|
16
|
+
import { getLinkText, setHeading, setIndentIncrease, setIndentDecrease, setQuote, setAlign, setList, setTask, setTextStyle, setTextMark, removeTextStyle, removeTextMark, setLineHeight, insertLink, insertImage, insertVideo, insertTable, insertCodeBlock, hasPreInRange, hasTableInRange, hasQuoteInRange, hasLinkInRange, isRangeInQuote, isRangeInList, isRangeInTask, queryTextStyle, queryTextMark, getCurrentParsedomElement } from '../core/function'
|
17
17
|
export default {
|
18
18
|
name: 'Menu',
|
19
19
|
props: {
|
@@ -22,11 +22,6 @@ export default {
|
|
22
22
|
type: Object,
|
23
23
|
default: null
|
24
24
|
},
|
25
|
-
//是否禁用整个菜单栏
|
26
|
-
disabled: {
|
27
|
-
type: Boolean,
|
28
|
-
default: false
|
29
|
-
},
|
30
25
|
//主题色
|
31
26
|
color: {
|
32
27
|
type: String,
|
@@ -338,6 +333,10 @@ export default {
|
|
338
333
|
}
|
339
334
|
},
|
340
335
|
computed: {
|
336
|
+
//整个菜单栏是否禁用
|
337
|
+
disabled() {
|
338
|
+
return this.$parent.disabled || !this.$parent.canUseMenu
|
339
|
+
},
|
341
340
|
//菜单名称数组
|
342
341
|
menuNames() {
|
343
342
|
return Object.keys(this.config.sequence).sort((a, b) => {
|
@@ -816,18 +815,7 @@ export default {
|
|
816
815
|
hideScroll: true,
|
817
816
|
onLayerShow: () => {
|
818
817
|
//存在选区的情况下预置链接文本值
|
819
|
-
|
820
|
-
const result = this.$parent.$parent.editor.getElementsByRange().flatIncludes
|
821
|
-
result.forEach(item => {
|
822
|
-
if (item.element.isText()) {
|
823
|
-
if (item.offset) {
|
824
|
-
text += item.element.textContent.substring(item.offset[0], item.offset[1])
|
825
|
-
} else {
|
826
|
-
text += item.element.textContent || ''
|
827
|
-
}
|
828
|
-
}
|
829
|
-
})
|
830
|
-
this.$parent.linkConfig.text = text
|
818
|
+
this.$parent.linkConfig.text = getLinkText(this.$parent.$parent)
|
831
819
|
}
|
832
820
|
},
|
833
821
|
{
|
@@ -1016,7 +1004,7 @@ export default {
|
|
1016
1004
|
}
|
1017
1005
|
|
1018
1006
|
/** 下面是拓展菜单的配置 */
|
1019
|
-
if (
|
1007
|
+
if (DapCommon.isObject(this.$parent.config.extends)) {
|
1020
1008
|
//获取菜单按钮的配置
|
1021
1009
|
const configuration = this.$parent.config.extends[this.name]
|
1022
1010
|
if (configuration) {
|
@@ -1082,9 +1070,11 @@ export default {
|
|
1082
1070
|
methods: {
|
1083
1071
|
//按钮操作触发函数
|
1084
1072
|
handleOperate(name, val) {
|
1073
|
+
//菜单栏禁用
|
1085
1074
|
if (this.disabled) {
|
1086
1075
|
return
|
1087
1076
|
}
|
1077
|
+
//没有获取焦点
|
1088
1078
|
if (!this.$parent.editor.range) {
|
1089
1079
|
return
|
1090
1080
|
}
|
@@ -1098,109 +1088,208 @@ export default {
|
|
1098
1088
|
}
|
1099
1089
|
//设置标题
|
1100
1090
|
else if (name == 'heading') {
|
1101
|
-
this.$parent
|
1091
|
+
setHeading(this.$parent, val)
|
1092
|
+
this.$parent.editor.formatElementStack()
|
1093
|
+
this.$parent.editor.domRender()
|
1094
|
+
this.$parent.editor.rangeRender()
|
1102
1095
|
}
|
1103
1096
|
//设置缩进
|
1104
1097
|
else if (name == 'indent') {
|
1105
1098
|
//增加缩进
|
1106
1099
|
if (val == 'indent-increase') {
|
1107
|
-
this.$parent
|
1100
|
+
setIndentIncrease(this.$parent)
|
1108
1101
|
}
|
1109
1102
|
//减少缩进
|
1110
1103
|
else if (val == 'indent-decrease') {
|
1111
|
-
this.$parent
|
1104
|
+
setIndentDecrease(this.$parent)
|
1112
1105
|
}
|
1106
|
+
this.$parent.editor.formatElementStack()
|
1107
|
+
this.$parent.editor.domRender()
|
1108
|
+
this.$parent.editor.rangeRender()
|
1113
1109
|
}
|
1114
1110
|
//设置引用
|
1115
1111
|
else if (name == 'quote') {
|
1116
|
-
this.$parent
|
1112
|
+
setQuote(this.$parent)
|
1113
|
+
this.$parent.editor.formatElementStack()
|
1114
|
+
this.$parent.editor.domRender()
|
1115
|
+
this.$parent.editor.rangeRender()
|
1117
1116
|
}
|
1118
1117
|
//设置对齐方式
|
1119
1118
|
else if (name == 'align') {
|
1120
|
-
this.$parent
|
1119
|
+
setAlign(this.$parent, val)
|
1120
|
+
this.$parent.editor.formatElementStack()
|
1121
|
+
this.$parent.editor.domRender()
|
1122
|
+
this.$parent.editor.rangeRender()
|
1121
1123
|
}
|
1122
1124
|
//设置有序列表
|
1123
1125
|
else if (name == 'orderList') {
|
1124
|
-
this.$parent
|
1126
|
+
setList(this.$parent, true)
|
1127
|
+
this.$parent.editor.formatElementStack()
|
1128
|
+
this.$parent.editor.domRender()
|
1129
|
+
this.$parent.editor.rangeRender()
|
1125
1130
|
}
|
1126
1131
|
//设置无序列表
|
1127
1132
|
else if (name == 'unorderList') {
|
1128
|
-
this.$parent
|
1133
|
+
setList(this.$parent, false)
|
1134
|
+
this.$parent.editor.formatElementStack()
|
1135
|
+
this.$parent.editor.domRender()
|
1136
|
+
this.$parent.editor.rangeRender()
|
1129
1137
|
}
|
1130
1138
|
//设置任务列表
|
1131
1139
|
else if (name == 'task') {
|
1132
|
-
this.$parent
|
1140
|
+
setTask(this.$parent)
|
1141
|
+
this.$parent.editor.formatElementStack()
|
1142
|
+
this.$parent.editor.domRender()
|
1143
|
+
this.$parent.editor.rangeRender()
|
1133
1144
|
}
|
1134
1145
|
//设置粗体
|
1135
1146
|
else if (name == 'bold') {
|
1136
|
-
this.$parent
|
1147
|
+
if (queryTextStyle(this.$parent, 'font-weight', 'bold') || queryTextStyle(this.$parent, 'font-weight', '700')) {
|
1148
|
+
removeTextStyle(this.$parent, ['font-weight'])
|
1149
|
+
} else {
|
1150
|
+
setTextStyle(this.$parent, {
|
1151
|
+
'font-weight': 'bold'
|
1152
|
+
})
|
1153
|
+
}
|
1154
|
+
this.$parent.editor.formatElementStack()
|
1155
|
+
this.$parent.editor.domRender()
|
1156
|
+
this.$parent.editor.rangeRender()
|
1137
1157
|
}
|
1138
1158
|
//设置下划线
|
1139
1159
|
else if (name == 'underline') {
|
1140
|
-
this.$parent
|
1160
|
+
if (queryTextStyle(this.$parent, 'text-decoration', 'underline') || queryTextStyle(this.$parent, 'text-decoration-line', 'underline')) {
|
1161
|
+
removeTextStyle(this.$parent, ['text-decoration', 'text-decoration-line'])
|
1162
|
+
} else {
|
1163
|
+
setTextStyle(this.$parent, {
|
1164
|
+
'text-decoration': 'underline'
|
1165
|
+
})
|
1166
|
+
}
|
1167
|
+
this.$parent.editor.formatElementStack()
|
1168
|
+
this.$parent.editor.domRender()
|
1169
|
+
this.$parent.editor.rangeRender()
|
1141
1170
|
}
|
1142
1171
|
//设置斜体
|
1143
1172
|
else if (name == 'italic') {
|
1144
|
-
this.$parent
|
1173
|
+
if (queryTextStyle(this.$parent, 'font-style', 'italic')) {
|
1174
|
+
removeTextStyle(this.$parent, ['font-style'])
|
1175
|
+
} else {
|
1176
|
+
setTextStyle(this.$parent, {
|
1177
|
+
'font-style': 'italic'
|
1178
|
+
})
|
1179
|
+
}
|
1180
|
+
this.$parent.editor.formatElementStack()
|
1181
|
+
this.$parent.editor.domRender()
|
1182
|
+
this.$parent.editor.rangeRender()
|
1145
1183
|
}
|
1146
1184
|
//设置删除线
|
1147
1185
|
else if (name == 'strikethrough') {
|
1148
|
-
this.$parent
|
1186
|
+
if (queryTextStyle(this.$parent, 'text-decoration', 'line-through') || queryTextStyle(this.$parent, 'text-decoration-line', 'line-through')) {
|
1187
|
+
removeTextStyle(this.$parent, ['text-decoration', 'text-decoration-line'])
|
1188
|
+
} else {
|
1189
|
+
setTextStyle(this.$parent, {
|
1190
|
+
'text-decoration': 'line-through'
|
1191
|
+
})
|
1192
|
+
}
|
1193
|
+
this.$parent.editor.formatElementStack()
|
1194
|
+
this.$parent.editor.domRender()
|
1195
|
+
this.$parent.editor.rangeRender()
|
1149
1196
|
}
|
1150
1197
|
//设置行内代码
|
1151
1198
|
else if (name == 'code') {
|
1152
|
-
this.$parent
|
1199
|
+
if (queryTextMark(this.$parent, 'data-editify-code')) {
|
1200
|
+
removeTextMark(this.$parent, ['data-editify-code'])
|
1201
|
+
} else {
|
1202
|
+
setTextMark(this.$parent, {
|
1203
|
+
'data-editify-code': true
|
1204
|
+
})
|
1205
|
+
}
|
1206
|
+
this.$parent.editor.formatElementStack()
|
1207
|
+
this.$parent.editor.domRender()
|
1208
|
+
this.$parent.editor.rangeRender()
|
1153
1209
|
}
|
1154
1210
|
//设置上标
|
1155
1211
|
else if (name == 'super') {
|
1156
|
-
this.$parent
|
1212
|
+
if (queryTextStyle(this.$parent, 'vertical-align', 'super')) {
|
1213
|
+
removeTextStyle(this.$parent, ['vertical-align'])
|
1214
|
+
} else {
|
1215
|
+
setTextStyle(this.$parent, {
|
1216
|
+
'vertical-align': 'super'
|
1217
|
+
})
|
1218
|
+
}
|
1219
|
+
this.$parent.editor.formatElementStack()
|
1220
|
+
this.$parent.editor.domRender()
|
1221
|
+
this.$parent.editor.rangeRender()
|
1157
1222
|
}
|
1158
1223
|
//设置下标
|
1159
1224
|
else if (name == 'sub') {
|
1160
|
-
this.$parent
|
1225
|
+
if (queryTextStyle(this.$parent, 'vertical-align', 'sub')) {
|
1226
|
+
removeTextStyle(this.$parent, ['vertical-align'])
|
1227
|
+
} else {
|
1228
|
+
setTextStyle(this.$parent, {
|
1229
|
+
'vertical-align': 'sub'
|
1230
|
+
})
|
1231
|
+
}
|
1232
|
+
this.$parent.editor.formatElementStack()
|
1233
|
+
this.$parent.editor.domRender()
|
1234
|
+
this.$parent.editor.rangeRender()
|
1161
1235
|
}
|
1162
1236
|
//清除格式
|
1163
1237
|
else if (name == 'formatClear') {
|
1164
|
-
this.$parent
|
1238
|
+
removeTextStyle(this.$parent)
|
1239
|
+
removeTextMark(this.$parent)
|
1240
|
+
this.$parent.editor.formatElementStack()
|
1241
|
+
this.$parent.editor.domRender()
|
1242
|
+
this.$parent.editor.rangeRender()
|
1165
1243
|
}
|
1166
1244
|
//设置字号
|
1167
1245
|
else if (name == 'fontSize') {
|
1168
|
-
this.$parent
|
1246
|
+
setTextStyle(this.$parent, {
|
1247
|
+
'font-size': val
|
1248
|
+
})
|
1249
|
+
this.$parent.editor.formatElementStack()
|
1250
|
+
this.$parent.editor.domRender()
|
1251
|
+
this.$parent.editor.rangeRender()
|
1169
1252
|
}
|
1170
1253
|
//设置字体
|
1171
1254
|
else if (name == 'fontFamily') {
|
1172
|
-
this.$parent
|
1255
|
+
setTextStyle(this.$parent, {
|
1256
|
+
'font-family': val
|
1257
|
+
})
|
1258
|
+
this.$parent.editor.formatElementStack()
|
1259
|
+
this.$parent.editor.domRender()
|
1260
|
+
this.$parent.editor.rangeRender()
|
1173
1261
|
}
|
1174
1262
|
//设置行高
|
1175
1263
|
else if (name == 'lineHeight') {
|
1176
|
-
this.$parent
|
1264
|
+
setLineHeight(this.$parent, val)
|
1265
|
+
this.$parent.editor.formatElementStack()
|
1266
|
+
this.$parent.editor.domRender()
|
1267
|
+
this.$parent.editor.rangeRender()
|
1177
1268
|
}
|
1178
1269
|
//设置前景色
|
1179
1270
|
else if (name == 'foreColor') {
|
1180
|
-
this.$parent
|
1271
|
+
setTextStyle(this.$parent, {
|
1272
|
+
color: val
|
1273
|
+
})
|
1274
|
+
this.$parent.editor.formatElementStack()
|
1275
|
+
this.$parent.editor.domRender()
|
1276
|
+
this.$parent.editor.rangeRender()
|
1181
1277
|
}
|
1182
1278
|
//设置背景色
|
1183
1279
|
else if (name == 'backColor') {
|
1184
|
-
this.$parent
|
1280
|
+
setTextStyle(this.$parent, {
|
1281
|
+
'background-color': val
|
1282
|
+
})
|
1283
|
+
this.$parent.editor.formatElementStack()
|
1284
|
+
this.$parent.editor.domRender()
|
1285
|
+
this.$parent.editor.rangeRender()
|
1185
1286
|
}
|
1186
1287
|
//插入链接
|
1187
1288
|
else if (name == 'link') {
|
1188
1289
|
if (!val.url) {
|
1189
1290
|
return
|
1190
1291
|
}
|
1191
|
-
|
1192
|
-
text = url
|
1193
|
-
}
|
1194
|
-
const marks = {
|
1195
|
-
href: val.url
|
1196
|
-
}
|
1197
|
-
if (val.newOpen) {
|
1198
|
-
marks.target = '_blank'
|
1199
|
-
}
|
1200
|
-
const linkEle = new AlexElement('inline', 'a', marks, null, null)
|
1201
|
-
const textEle = new AlexElement('text', null, null, null, val.text)
|
1202
|
-
this.$parent.editor.addElementTo(textEle, linkEle)
|
1203
|
-
this.$parent.editor.insertElement(linkEle)
|
1292
|
+
insertLink(this.$parent, val.text, val.url, val.newOpen)
|
1204
1293
|
this.$parent.editor.formatElementStack()
|
1205
1294
|
this.$parent.editor.domRender()
|
1206
1295
|
this.$parent.editor.rangeRender()
|
@@ -1210,22 +1299,34 @@ export default {
|
|
1210
1299
|
if (!val) {
|
1211
1300
|
return
|
1212
1301
|
}
|
1213
|
-
this.$parent
|
1302
|
+
insertImage(this.$parent, val)
|
1303
|
+
this.$parent.editor.formatElementStack()
|
1304
|
+
this.$parent.editor.domRender()
|
1305
|
+
this.$parent.editor.rangeRender()
|
1214
1306
|
}
|
1215
1307
|
//插入视频
|
1216
1308
|
else if (name == 'video') {
|
1217
1309
|
if (!val) {
|
1218
1310
|
return
|
1219
1311
|
}
|
1220
|
-
this.$parent
|
1312
|
+
insertVideo(this.$parent, val)
|
1313
|
+
this.$parent.editor.formatElementStack()
|
1314
|
+
this.$parent.editor.domRender()
|
1315
|
+
this.$parent.editor.rangeRender()
|
1221
1316
|
}
|
1222
1317
|
//插入表格
|
1223
1318
|
else if (name == 'table') {
|
1224
|
-
this.$parent
|
1319
|
+
insertTable(this.$parent, val.row, val.column)
|
1320
|
+
this.$parent.editor.formatElementStack()
|
1321
|
+
this.$parent.editor.domRender()
|
1322
|
+
this.$parent.editor.rangeRender()
|
1225
1323
|
}
|
1226
1324
|
//插入代码块
|
1227
1325
|
else if (name == 'codeBlock') {
|
1228
|
-
this.$parent
|
1326
|
+
insertCodeBlock(this.$parent)
|
1327
|
+
this.$parent.editor.formatElementStack()
|
1328
|
+
this.$parent.editor.domRender()
|
1329
|
+
this.$parent.editor.rangeRender()
|
1229
1330
|
}
|
1230
1331
|
//代码视图
|
1231
1332
|
else if (name == 'sourceView') {
|
@@ -1243,31 +1344,23 @@ export default {
|
|
1243
1344
|
}
|
1244
1345
|
},
|
1245
1346
|
//处理光标更新
|
1246
|
-
handleRangeUpdate(
|
1247
|
-
|
1248
|
-
|
1249
|
-
}
|
1250
|
-
if (!this.$parent.editor.range) {
|
1251
|
-
return
|
1252
|
-
}
|
1253
|
-
//获取选区的元素
|
1254
|
-
const result = this.$parent.editor.getElementsByRange(useCache).includes
|
1255
|
-
//选区是否含有代码块元素
|
1256
|
-
const hasPreStyle = this.$parent.hasPreStyle(true)
|
1347
|
+
handleRangeUpdate() {
|
1348
|
+
//选区是否含有代码块
|
1349
|
+
const value_hasPreInRange = hasPreInRange(this.$parent)
|
1257
1350
|
//选区是否含有表格元素
|
1258
|
-
const
|
1351
|
+
const value_hasTableInRange = hasTableInRange(this.$parent)
|
1259
1352
|
//选区是否含有引用元素
|
1260
|
-
const
|
1353
|
+
const value_hasQuoteInRange = hasQuoteInRange(this.$parent)
|
1261
1354
|
//选区是否都在引用元素内
|
1262
|
-
const
|
1355
|
+
const value_isRangeInQuote = isRangeInQuote(this.$parent)
|
1263
1356
|
//选区是否含有链接元素
|
1264
|
-
const
|
1357
|
+
const value_hasLinkInRange = hasLinkInRange(this.$parent)
|
1265
1358
|
//选区是否都在有序列表内
|
1266
|
-
const
|
1359
|
+
const value_isRangeInOrderList = isRangeInList(this.$parent, true)
|
1267
1360
|
//选区是否都在无序列表内
|
1268
|
-
const
|
1361
|
+
const value_isRangeInUnorderList = isRangeInList(this.$parent, false)
|
1269
1362
|
//选区是否都在任务列表内
|
1270
|
-
const
|
1363
|
+
const value_isRangeInTask = isRangeInTask(this.$parent)
|
1271
1364
|
//额外禁用判定
|
1272
1365
|
const extraDisabled = name => {
|
1273
1366
|
if (typeof this.config.extraDisabled == 'function') {
|
@@ -1285,120 +1378,120 @@ export default {
|
|
1285
1378
|
//显示已设置标题
|
1286
1379
|
const findHeadingItem = this.headingConfig.displayConfig.options.find(item => {
|
1287
1380
|
let val = item
|
1288
|
-
if (
|
1381
|
+
if (DapCommon.isObject(item)) {
|
1289
1382
|
val = item.value
|
1290
1383
|
}
|
1291
1384
|
if (this.$parent.editor.range.anchor.isEqual(this.$parent.editor.range.focus)) {
|
1292
1385
|
return this.$parent.editor.range.anchor.element.getBlock().parsedom == val
|
1293
1386
|
}
|
1294
|
-
return
|
1387
|
+
return this.$parent.dataRangeCaches.list.every(el => {
|
1295
1388
|
if (el.element.isBlock()) {
|
1296
1389
|
return el.element.parsedom == val
|
1297
1390
|
}
|
1298
1391
|
return el.element.getBlock().parsedom == val
|
1299
1392
|
})
|
1300
1393
|
})
|
1301
|
-
this.headingConfig.displayConfig.value = findHeadingItem ? (
|
1394
|
+
this.headingConfig.displayConfig.value = findHeadingItem ? (DapCommon.isObject(findHeadingItem) ? findHeadingItem.value : findHeadingItem) : this.headingConfig.defaultValue
|
1302
1395
|
//标题禁用
|
1303
|
-
this.headingConfig.disabled =
|
1396
|
+
this.headingConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('heading')
|
1304
1397
|
|
1305
1398
|
//缩进禁用
|
1306
|
-
this.indentConfig.disabled =
|
1399
|
+
this.indentConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('indent')
|
1307
1400
|
|
1308
1401
|
//引用按钮激活
|
1309
|
-
this.quoteConfig.active =
|
1402
|
+
this.quoteConfig.active = value_isRangeInQuote
|
1310
1403
|
//引用按钮禁用
|
1311
|
-
this.quoteConfig.disabled =
|
1404
|
+
this.quoteConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('quote')
|
1312
1405
|
|
1313
1406
|
//对齐方式按钮禁用
|
1314
|
-
this.alignConfig.disabled =
|
1407
|
+
this.alignConfig.disabled = value_hasPreInRange || extraDisabled('align')
|
1315
1408
|
|
1316
1409
|
//有序列表按钮激活
|
1317
|
-
this.orderListConfig.active =
|
1410
|
+
this.orderListConfig.active = value_isRangeInOrderList
|
1318
1411
|
//有序列表禁用
|
1319
|
-
this.orderListConfig.disabled =
|
1412
|
+
this.orderListConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('orderList')
|
1320
1413
|
|
1321
1414
|
//无序列表按钮激活
|
1322
|
-
this.unorderListConfig.active =
|
1415
|
+
this.unorderListConfig.active = value_isRangeInUnorderList
|
1323
1416
|
//无序列表禁用
|
1324
|
-
this.unorderListConfig.disabled =
|
1417
|
+
this.unorderListConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('unorderList')
|
1325
1418
|
|
1326
1419
|
//任务列表按钮激活
|
1327
|
-
this.taskConfig.active =
|
1420
|
+
this.taskConfig.active = value_isRangeInTask
|
1328
1421
|
//任务列表禁用
|
1329
|
-
this.taskConfig.disabled =
|
1422
|
+
this.taskConfig.disabled = value_hasPreInRange || value_hasTableInRange || extraDisabled('task')
|
1330
1423
|
|
1331
1424
|
//粗体按钮激活
|
1332
|
-
this.boldConfig.active = this.$parent
|
1425
|
+
this.boldConfig.active = queryTextStyle(this.$parent, 'font-weight', 'bold') || queryTextStyle(this.$parent, 'font-weight', '700')
|
1333
1426
|
//粗体按钮禁用
|
1334
|
-
this.boldConfig.disabled =
|
1427
|
+
this.boldConfig.disabled = value_hasPreInRange || extraDisabled('bold')
|
1335
1428
|
|
1336
1429
|
//下划线按钮激活
|
1337
|
-
this.underlineConfig.active = this.$parent
|
1430
|
+
this.underlineConfig.active = queryTextStyle(this.$parent, 'text-decoration', 'underline') || queryTextStyle(this.$parent, 'text-decoration-line', 'underline')
|
1338
1431
|
//下划线按钮禁用
|
1339
|
-
this.underlineConfig.disabled =
|
1432
|
+
this.underlineConfig.disabled = value_hasPreInRange || extraDisabled('underline')
|
1340
1433
|
|
1341
1434
|
//斜体按钮激活
|
1342
|
-
this.italicConfig.active = this.$parent
|
1435
|
+
this.italicConfig.active = queryTextStyle(this.$parent, 'font-style', 'italic')
|
1343
1436
|
//斜体按钮禁用
|
1344
|
-
this.italicConfig.disabled =
|
1437
|
+
this.italicConfig.disabled = value_hasPreInRange || extraDisabled('italic')
|
1345
1438
|
|
1346
1439
|
//删除线按钮激活
|
1347
|
-
this.strikethroughConfig.active = this.$parent
|
1440
|
+
this.strikethroughConfig.active = queryTextStyle(this.$parent, 'text-decoration', 'line-through') || queryTextStyle(this.$parent, 'text-decoration-line', 'line-through')
|
1348
1441
|
//删除线按钮禁用
|
1349
|
-
this.strikethroughConfig.disabled =
|
1442
|
+
this.strikethroughConfig.disabled = value_hasPreInRange || extraDisabled('strikethrough')
|
1350
1443
|
|
1351
1444
|
//行内代码按钮激活
|
1352
|
-
this.codeConfig.active = this.$parent
|
1445
|
+
this.codeConfig.active = queryTextMark(this.$parent, 'data-editify-code')
|
1353
1446
|
//行内代码按钮禁用
|
1354
|
-
this.codeConfig.disabled =
|
1447
|
+
this.codeConfig.disabled = value_hasPreInRange || extraDisabled('code')
|
1355
1448
|
|
1356
1449
|
//上标按钮激活
|
1357
|
-
this.superConfig.active = this.$parent
|
1450
|
+
this.superConfig.active = queryTextStyle(this.$parent, 'vertical-align', 'super')
|
1358
1451
|
//上标按钮禁用
|
1359
|
-
this.superConfig.disabled =
|
1452
|
+
this.superConfig.disabled = value_hasPreInRange || extraDisabled('super')
|
1360
1453
|
|
1361
1454
|
//下标按钮激活
|
1362
|
-
this.subConfig.active = this.$parent
|
1455
|
+
this.subConfig.active = queryTextStyle(this.$parent, 'vertical-align', 'sub')
|
1363
1456
|
//下标按钮禁用
|
1364
|
-
this.subConfig.disabled =
|
1457
|
+
this.subConfig.disabled = value_hasPreInRange || extraDisabled('sub')
|
1365
1458
|
|
1366
1459
|
//清除格式按钮禁用
|
1367
|
-
this.formatClearConfig.disabled =
|
1460
|
+
this.formatClearConfig.disabled = value_hasPreInRange || extraDisabled('formatClear')
|
1368
1461
|
|
1369
1462
|
//显示已选择字号
|
1370
1463
|
const findFontItem = this.fontSizeConfig.displayConfig.options.find(item => {
|
1371
|
-
if (
|
1372
|
-
return this.$parent
|
1464
|
+
if (DapCommon.isObject(item)) {
|
1465
|
+
return queryTextStyle(this.$parent, 'font-size', item.value)
|
1373
1466
|
}
|
1374
|
-
return this.$parent
|
1467
|
+
return queryTextStyle(this.$parent, 'font-size', item)
|
1375
1468
|
})
|
1376
|
-
this.fontSizeConfig.displayConfig.value = findFontItem ? (
|
1469
|
+
this.fontSizeConfig.displayConfig.value = findFontItem ? (DapCommon.isObject(findFontItem) ? findFontItem.value : findFontItem) : this.fontSizeConfig.defaultValue
|
1377
1470
|
//字号按钮禁用
|
1378
|
-
this.fontSizeConfig.disabled =
|
1471
|
+
this.fontSizeConfig.disabled = value_hasPreInRange || extraDisabled('fontSize')
|
1379
1472
|
|
1380
1473
|
//显示已选择字体
|
1381
1474
|
const findFamilyItem = this.fontFamilyConfig.displayConfig.options.find(item => {
|
1382
|
-
if (
|
1383
|
-
return this.$parent
|
1475
|
+
if (DapCommon.isObject(item)) {
|
1476
|
+
return queryTextStyle(this.$parent, 'font-family', item.value)
|
1384
1477
|
}
|
1385
|
-
return this.$parent
|
1478
|
+
return queryTextStyle(this.$parent, 'font-family', item)
|
1386
1479
|
})
|
1387
|
-
this.fontFamilyConfig.displayConfig.value = findFamilyItem ? (
|
1480
|
+
this.fontFamilyConfig.displayConfig.value = findFamilyItem ? (DapCommon.isObject(findFamilyItem) ? findFamilyItem.value : findFamilyItem) : this.fontFamilyConfig.defaultValue
|
1388
1481
|
//字体按钮禁用
|
1389
|
-
this.fontFamilyConfig.disabled =
|
1482
|
+
this.fontFamilyConfig.disabled = value_hasPreInRange || extraDisabled('fontFamily')
|
1390
1483
|
|
1391
1484
|
//显示已设置行高
|
1392
1485
|
const findHeightItem = this.lineHeightConfig.displayConfig.options.find(item => {
|
1393
1486
|
let val = item
|
1394
|
-
if (
|
1487
|
+
if (DapCommon.isObject(item)) {
|
1395
1488
|
val = item.value
|
1396
1489
|
}
|
1397
1490
|
if (this.$parent.editor.range.anchor.isEqual(this.$parent.editor.range.focus)) {
|
1398
1491
|
const block = this.$parent.editor.range.anchor.element.getBlock()
|
1399
1492
|
return block.hasStyles() && block.styles['line-height'] == val
|
1400
1493
|
}
|
1401
|
-
return
|
1494
|
+
return this.$parent.dataRangeCaches.list.every(el => {
|
1402
1495
|
if (el.element.isBlock() || el.element.isInblock()) {
|
1403
1496
|
return el.element.hasStyles() && el.element.styles['line-height'] == val
|
1404
1497
|
}
|
@@ -1410,48 +1503,48 @@ export default {
|
|
1410
1503
|
return block.hasStyles() && block.styles['line-height'] == val
|
1411
1504
|
})
|
1412
1505
|
})
|
1413
|
-
this.lineHeightConfig.displayConfig.value = findHeightItem ? (
|
1506
|
+
this.lineHeightConfig.displayConfig.value = findHeightItem ? (DapCommon.isObject(findHeightItem) ? findHeightItem.value : findHeightItem) : this.lineHeightConfig.defaultValue
|
1414
1507
|
//行高按钮禁用
|
1415
|
-
this.lineHeightConfig.disabled =
|
1508
|
+
this.lineHeightConfig.disabled = value_hasPreInRange || extraDisabled('lineHeight')
|
1416
1509
|
|
1417
1510
|
//显示已选择的前景色
|
1418
1511
|
const findForeColorItem = this.foreColorConfig.selectConfig.options.find(item => {
|
1419
|
-
if (
|
1420
|
-
return this.$parent
|
1512
|
+
if (DapCommon.isObject(item)) {
|
1513
|
+
return queryTextStyle(this.$parent, 'color', item.value)
|
1421
1514
|
}
|
1422
|
-
return this.$parent
|
1515
|
+
return queryTextStyle(this.$parent, 'color', item)
|
1423
1516
|
})
|
1424
|
-
this.foreColorConfig.value = findForeColorItem ? (
|
1517
|
+
this.foreColorConfig.value = findForeColorItem ? (DapCommon.isObject(findForeColorItem) ? findForeColorItem.value : findForeColorItem) : ''
|
1425
1518
|
//前景色按钮禁用
|
1426
|
-
this.foreColorConfig.disabled =
|
1519
|
+
this.foreColorConfig.disabled = value_hasPreInRange || extraDisabled('foreColor')
|
1427
1520
|
|
1428
1521
|
//显示已选择的背景色
|
1429
1522
|
const findBackColorItem = this.backColorConfig.selectConfig.options.find(item => {
|
1430
|
-
if (
|
1431
|
-
return this.$parent
|
1523
|
+
if (DapCommon.isObject(item)) {
|
1524
|
+
return queryTextStyle(this.$parent, 'background-color', item.value)
|
1432
1525
|
}
|
1433
|
-
return this.$parent
|
1526
|
+
return queryTextStyle(this.$parent, 'background-color', item)
|
1434
1527
|
})
|
1435
|
-
this.backColorConfig.value = findBackColorItem ? (
|
1528
|
+
this.backColorConfig.value = findBackColorItem ? (DapCommon.isObject(findBackColorItem) ? findBackColorItem.value : findBackColorItem) : ''
|
1436
1529
|
//背景色按钮禁用
|
1437
|
-
this.backColorConfig.disabled =
|
1530
|
+
this.backColorConfig.disabled = value_hasPreInRange || extraDisabled('backColor')
|
1438
1531
|
|
1439
1532
|
//链接按钮禁用
|
1440
|
-
this.linkConfig.disabled =
|
1533
|
+
this.linkConfig.disabled = value_hasLinkInRange || value_hasPreInRange || extraDisabled('link')
|
1441
1534
|
|
1442
1535
|
//插入图片按钮禁用
|
1443
|
-
this.imageConfig.disabled =
|
1536
|
+
this.imageConfig.disabled = value_hasPreInRange || extraDisabled('image')
|
1444
1537
|
|
1445
1538
|
//插入视频按钮禁用
|
1446
|
-
this.videoConfig.disabled =
|
1539
|
+
this.videoConfig.disabled = value_hasPreInRange || extraDisabled('video')
|
1447
1540
|
|
1448
1541
|
//表格按钮禁用
|
1449
|
-
this.tableConfig.disabled =
|
1542
|
+
this.tableConfig.disabled = value_hasPreInRange || value_hasTableInRange || value_hasQuoteInRange || extraDisabled('table')
|
1450
1543
|
|
1451
1544
|
//代码块按钮激活
|
1452
|
-
this.codeBlockConfig.active = !!this.$parent
|
1545
|
+
this.codeBlockConfig.active = !!getCurrentParsedomElement(this.$parent, 'pre')
|
1453
1546
|
//代码块按钮禁用
|
1454
|
-
this.codeBlockConfig.disabled =
|
1547
|
+
this.codeBlockConfig.disabled = value_hasTableInRange || value_hasQuoteInRange || extraDisabled('codeBlock')
|
1455
1548
|
|
1456
1549
|
//代码视图按钮激活
|
1457
1550
|
this.sourceViewConfig.active = this.$parent.isSourceView
|