zydx-plus 1.33.379 → 1.33.381
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/package.json +1 -1
- package/src/components/editor/src/butJson.js +22 -11
- package/src/components/editor/src/editor.vue +470 -77
- package/src/components/editor/src/extend/insertHorizontalLine.js +48 -0
- package/src/components/editor/src/isSelect.vue +20 -0
- package/src/components/editor/src/margin-moderation.vue +68 -0
- package/src/components/editor/src/margin-narrow.vue +70 -0
- package/src/components/editor/src/margin-standard.vue +66 -0
- package/src/components/editor/src/margin-wide.vue +66 -0
- package/src/index.js +1 -1
package/package.json
CHANGED
|
@@ -23,6 +23,12 @@ const num = {
|
|
|
23
23
|
|
|
24
24
|
export function butJson(editor, data) {
|
|
25
25
|
return {
|
|
26
|
+
switchingFormat:{
|
|
27
|
+
name: '切换版式',
|
|
28
|
+
key: 'switchingFormat',
|
|
29
|
+
menuKeys:[
|
|
30
|
+
]
|
|
31
|
+
},
|
|
26
32
|
shortcut: {
|
|
27
33
|
name: '快捷排版',
|
|
28
34
|
key: 'shortcut',
|
|
@@ -47,12 +53,12 @@ export function butJson(editor, data) {
|
|
|
47
53
|
menuKeys: [],
|
|
48
54
|
html: `<p class="author" data-signId="author" style="text-align: center;"><span style="color: rgb(0, 0, 0);font-size: 14px;font-family: FangSong;">${menusData(data, 'authorMenu').text}：</span></p>`
|
|
49
55
|
},
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
+
{
|
|
57
|
+
name: '抬 头',
|
|
58
|
+
key: 'lookUp',
|
|
59
|
+
menuKeys: [],
|
|
60
|
+
html: `<p data-signId="lookUp"><span style="color: rgb(0, 0, 0);font-size: 14px; font-family:SimHei;font-weight: 700;">请在此处输入抬头:</span><span> </span></p>`
|
|
61
|
+
},
|
|
56
62
|
{
|
|
57
63
|
name: '摘 要',
|
|
58
64
|
key: 'abstractMenu',
|
|
@@ -98,10 +104,10 @@ export function butJson(editor, data) {
|
|
|
98
104
|
name: '页边距',
|
|
99
105
|
key: 'pageMargin',
|
|
100
106
|
menuKeys: [
|
|
101
|
-
{name: '标准', key: 'standard'},
|
|
102
|
-
{name: '窄', key: 'narrow'},
|
|
103
|
-
{name: '适中', key: 'moderate'},
|
|
104
|
-
{name: '宽', key: 'wide'},
|
|
107
|
+
// {name: '标准', key: 'standard'},
|
|
108
|
+
// {name: '窄', key: 'narrow'},
|
|
109
|
+
// {name: '适中', key: 'moderate'},
|
|
110
|
+
// {name: '宽', key: 'wide'},
|
|
105
111
|
],
|
|
106
112
|
},
|
|
107
113
|
paragraph: {
|
|
@@ -169,7 +175,7 @@ export function butJson(editor, data) {
|
|
|
169
175
|
}
|
|
170
176
|
},
|
|
171
177
|
outlineMenu: {
|
|
172
|
-
name: '
|
|
178
|
+
name: '大纲级别',
|
|
173
179
|
key: 'outlineMenu',
|
|
174
180
|
menuKeys: [
|
|
175
181
|
{name: '一级标题', key: 'title-1'},
|
|
@@ -225,6 +231,11 @@ export function butJson(editor, data) {
|
|
|
225
231
|
name: '插入链接',
|
|
226
232
|
key: 'interposition',
|
|
227
233
|
menuKeys: [
|
|
234
|
+
{
|
|
235
|
+
name: '插入横线',
|
|
236
|
+
key: 'insertHorizontalLine',
|
|
237
|
+
childMenuKeys: []
|
|
238
|
+
},
|
|
228
239
|
{
|
|
229
240
|
name: '插入图片',
|
|
230
241
|
key: 'group-image',
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
<img :src="menusData('signMenu')?.ico" alt=""/>
|
|
74
74
|
<span>{{ menusData('signMenu')?.text }}</span>
|
|
75
75
|
</div>
|
|
76
|
-
<editor-content :editor="editor" class="editing-cont"
|
|
76
|
+
<editor-content :editor="editor" class="editing-cont" @click.stop="editorContentClick"
|
|
77
77
|
@paste.native.capture.prevent="preventPaste"></editor-content>
|
|
78
78
|
<div class="menu">
|
|
79
79
|
<button v-if="readOnly" class="but" @click="enlSee">查看</button>
|
|
@@ -119,7 +119,7 @@
|
|
|
119
119
|
<!-- ,width: wit + 'px'-->
|
|
120
120
|
<div v-for="(item,index) in htmlArr" :key="index" :style="{height: wit * 1.6 + 'px'}"
|
|
121
121
|
class="read-only-page" @click="menusTap">
|
|
122
|
-
<div
|
|
122
|
+
<div :style="{width: wit + 'px',margin:'0 auto'}" class="read-only-p" v-html="item"></div>
|
|
123
123
|
<div class="read-only-a">{{ index + 1 }}/{{ htmlArr.length }}</div>
|
|
124
124
|
</div>
|
|
125
125
|
</div>
|
|
@@ -175,7 +175,7 @@
|
|
|
175
175
|
</div>
|
|
176
176
|
<!-- 段落设置-->
|
|
177
177
|
<zydx-drag-popup
|
|
178
|
-
v-if="showRetractionPopup" :dragStatus="false" :enlargeShow="false" :minimize="false"
|
|
178
|
+
v-if="showRetractionPopup" :drag-text-show="false" :dragStatus="false" :enlargeShow="false" :minimize="false"
|
|
179
179
|
:minimizeCir="false" height="290" @close="closeDragPopup">
|
|
180
180
|
<template #content>
|
|
181
181
|
<div class="p-popup">
|
|
@@ -200,7 +200,7 @@
|
|
|
200
200
|
</template>
|
|
201
201
|
</zydx-drag-popup>
|
|
202
202
|
<zydx-drag-popup
|
|
203
|
-
v-if="showSpacingPopup" :dragStatus="false" :enlargeShow="false" :minimize="false"
|
|
203
|
+
v-if="showSpacingPopup" :drag-text-show="false" :dragStatus="false" :enlargeShow="false" :minimize="false"
|
|
204
204
|
:minimizeCir="false" height="320" @close="closeDragPopup">
|
|
205
205
|
<template #content>
|
|
206
206
|
<div class="p-popup">
|
|
@@ -230,7 +230,7 @@
|
|
|
230
230
|
</template>
|
|
231
231
|
</zydx-drag-popup>
|
|
232
232
|
<!-- 链接注释-->
|
|
233
|
-
<zydx-drag-popup v-if="isShowPopup" :dragStatus="false"
|
|
233
|
+
<zydx-drag-popup v-if="isShowPopup" :drag-text-show="false" :dragStatus="false"
|
|
234
234
|
:enlargeShow="false" :minimize="false"
|
|
235
235
|
:minimizeCir="false" :title="titlePopup"
|
|
236
236
|
height="auto" @close="isShowPopup=false">
|
|
@@ -278,12 +278,77 @@
|
|
|
278
278
|
</div>
|
|
279
279
|
</template>
|
|
280
280
|
</zydx-drag-popup>
|
|
281
|
-
<!--
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
281
|
+
<!-- 页边距-->
|
|
282
|
+
<zydx-drag-popup v-if="isShowPageMargin" :drag-text-show="false" :dragStatus="false" :enlargeShow="false"
|
|
283
|
+
:minimize="false" :minimizeCir="false" fixedStart
|
|
284
|
+
height="444"
|
|
285
|
+
width="900" @close="isShowPageMargin=false">
|
|
286
|
+
<template #content>
|
|
287
|
+
<div class="p-popup-box">
|
|
288
|
+
<div class="page-margin-box">
|
|
289
|
+
<div class="page-margin-title"> 页边距</div>
|
|
290
|
+
<div class="page-margin-select">
|
|
291
|
+
<div v-for="(item,index) in pageMarginSvg" :key="index" class="page-margin-select-item"
|
|
292
|
+
@click="selectMargin(item)">
|
|
293
|
+
<component :is="item.iconName"></component>
|
|
294
|
+
<isSelect v-if="item.isSelect" class="is-select"></isSelect>
|
|
295
|
+
<div class="page-margin-select-name">
|
|
296
|
+
{{ item.title }}
|
|
297
|
+
</div>
|
|
298
|
+
</div>
|
|
299
|
+
</div>
|
|
300
|
+
</div>
|
|
301
|
+
<div class="tip-btnBox">
|
|
302
|
+
<div @click="changeMargin" v-html="`确定`"></div>
|
|
303
|
+
<div @click="isShowPageMargin=false" v-html="`关闭`"></div>
|
|
304
|
+
</div>
|
|
305
|
+
</div>
|
|
306
|
+
</template>
|
|
307
|
+
</zydx-drag-popup>
|
|
308
|
+
<!-- 插入横线-->
|
|
309
|
+
<zydx-drag-popup v-if="isShowHorizontalLine" :drag-text-show="false" :dragStatus="false" :enlargeShow="false"
|
|
310
|
+
:minimize="false" :minimizeCir="false" fixedStart
|
|
311
|
+
height="214"
|
|
312
|
+
width="600" @close="isShowHorizontalLine=false">
|
|
313
|
+
<template #content>
|
|
314
|
+
<div class="p-popup-box" style="position: absolute;">
|
|
315
|
+
<div class="page-margin-box">
|
|
316
|
+
<div class="page-margin-title"> 插入横线</div>
|
|
317
|
+
<div class="page-line-select">
|
|
318
|
+
<div class="name">样 式</div>
|
|
319
|
+
：
|
|
320
|
+
<zydx-select v-model:value="lineType" :options="lineOptions" ></zydx-select>
|
|
321
|
+
</div>
|
|
322
|
+
</div>
|
|
323
|
+
<div class="tip-btnBox">
|
|
324
|
+
<div @click="changeLineType" v-html="`确定`"></div>
|
|
325
|
+
<div @click="isShowHorizontalLine=false" v-html="`关闭`"></div>
|
|
326
|
+
</div>
|
|
327
|
+
</div>
|
|
328
|
+
</template>
|
|
329
|
+
</zydx-drag-popup>
|
|
330
|
+
<!-- 切换版式-->
|
|
331
|
+
<zydx-drag-popup v-if="isShowSwitchingFormat" :drag-text-show="false" :dragStatus="false" :enlargeShow="false"
|
|
332
|
+
:minimize="false" :minimizeCir="false" fixedStart
|
|
333
|
+
height="214"
|
|
334
|
+
width="600" @close="isShowSwitchingFormat=false">
|
|
335
|
+
<template #content>
|
|
336
|
+
<div class="p-popup-box" style="position: absolute;">
|
|
337
|
+
<div class="page-margin-box">
|
|
338
|
+
<div class="page-margin-title"> 切换版式</div>
|
|
339
|
+
<div class="page-line-select">
|
|
340
|
+
<div class="name">选择版式：</div>
|
|
341
|
+
：
|
|
342
|
+
<zydx-select v-model:value="templateType" :options="templateOptions" ></zydx-select>
|
|
343
|
+
</div>
|
|
344
|
+
</div>
|
|
345
|
+
<div class="tip-btnBox">
|
|
346
|
+
<div @click="changeTemplateType" v-html="`确定`"></div>
|
|
347
|
+
<div @click="isShowSwitchingFormat=false" v-html="`关闭`"></div>
|
|
348
|
+
</div>
|
|
349
|
+
</div>
|
|
350
|
+
</template>
|
|
351
|
+
</zydx-drag-popup>
|
|
287
352
|
|
|
288
353
|
<div ref="bubbleMenu" :style="menusStyle" class="menu-one">
|
|
289
354
|
<div v-if="bubbleData&&bubbleData.type === 'taggingMenu'" class="menu-one-title">
|
|
@@ -319,9 +384,12 @@
|
|
|
319
384
|
<!-- 展示弹窗 -->
|
|
320
385
|
<div v-for="(item,index) in interpositionData" :key="index">
|
|
321
386
|
<zydx-drag-popup v-if="item.isShow" :enlargeShow="false" :minHeight="183"
|
|
322
|
-
:minWidth="['importWorks', 'linkCourseware', 'importArticles', 'videoLink'].indexOf(item.type) === -1 ? 640 :905"
|
|
323
|
-
:
|
|
324
|
-
:
|
|
387
|
+
:minWidth="['importWorks', 'linkCourseware', 'importArticles', 'videoLink'].indexOf(item.type) === -1 ? 640 :905"
|
|
388
|
+
:minimize="false" :minimizeCir="false"
|
|
389
|
+
:title="titleDragPopup[item.type]?titleDragPopup[item.type]:'参考文献'"
|
|
390
|
+
:width="['importWorks', 'linkCourseware', 'importArticles', 'videoLink'].indexOf(item.type) === -1 ? 640 :905"
|
|
391
|
+
height="auto"
|
|
392
|
+
@close="closeDataShowPopup(item)">
|
|
325
393
|
<template #content>
|
|
326
394
|
<div v-if="item.type === 'taggingMenu'" style="padding: 5px 10px 10px 10px">
|
|
327
395
|
<div class="p-popup-title-box">
|
|
@@ -522,6 +590,7 @@ import BubbleMenu from '@tiptap/extension-bubble-menu'
|
|
|
522
590
|
import Link from "@tiptap/extension-link";
|
|
523
591
|
import {FontSize} from "./extend/font-size";
|
|
524
592
|
import {Margin} from "./extend/margin";
|
|
593
|
+
import {borderBottom} from "./extend/insertHorizontalLine";
|
|
525
594
|
import {signId} from "./extend/sign-id";
|
|
526
595
|
import {lineHeightId} from "./extend/line-height-id";
|
|
527
596
|
import {Contenteditable} from "./extend/contenteditable";
|
|
@@ -542,11 +611,21 @@ import zydxDragPopup from '../../dragPopup'
|
|
|
542
611
|
import zydxSelect from '../../select'
|
|
543
612
|
import {exegesisId} from "./extend/exegesis-id";
|
|
544
613
|
import {html2json, json2html} from '../../utils/html2json.js'
|
|
614
|
+
import MarginModeration from "../src/margin-moderation.vue";
|
|
615
|
+
import MarginNarrow from "../src/margin-narrow.vue";
|
|
616
|
+
import MarginStandard from "../src/margin-standard.vue";
|
|
617
|
+
import MarginWide from "../src/margin-wide.vue";
|
|
618
|
+
import isSelect from "../src/isSelect.vue";
|
|
545
619
|
|
|
546
620
|
const img = require('./image/annotation.png')
|
|
547
621
|
export default {
|
|
548
622
|
name: 'zydx-editor',
|
|
549
623
|
components: {
|
|
624
|
+
isSelect,
|
|
625
|
+
MarginWide,
|
|
626
|
+
MarginStandard,
|
|
627
|
+
MarginNarrow,
|
|
628
|
+
MarginModeration,
|
|
550
629
|
zydxTextarea,
|
|
551
630
|
zydxRead,
|
|
552
631
|
svgs,
|
|
@@ -565,6 +644,31 @@ export default {
|
|
|
565
644
|
},
|
|
566
645
|
data() {
|
|
567
646
|
return {
|
|
647
|
+
pageMarginSvg: [
|
|
648
|
+
{
|
|
649
|
+
iconName: 'MarginStandard',
|
|
650
|
+
title: '标准',
|
|
651
|
+
isSelect: true,
|
|
652
|
+
key: 'standard'
|
|
653
|
+
},
|
|
654
|
+
{
|
|
655
|
+
iconName: 'MarginNarrow',
|
|
656
|
+
title: '窄',
|
|
657
|
+
isSelect: false,
|
|
658
|
+
key: 'narrow'
|
|
659
|
+
},
|
|
660
|
+
{
|
|
661
|
+
iconName: 'MarginModeration',
|
|
662
|
+
title: '适中',
|
|
663
|
+
isSelect: false,
|
|
664
|
+
key: 'moderate'
|
|
665
|
+
},
|
|
666
|
+
{
|
|
667
|
+
iconName: 'MarginWide',
|
|
668
|
+
title: '宽',
|
|
669
|
+
isSelect: false,
|
|
670
|
+
key: 'wide'
|
|
671
|
+
}],
|
|
568
672
|
checkboxObj: {value: '1', label: '是否开启缩进', checked: false},
|
|
569
673
|
checkbox: false,
|
|
570
674
|
titleDragPopup: {
|
|
@@ -648,7 +752,7 @@ export default {
|
|
|
648
752
|
time: {},
|
|
649
753
|
hex: '',
|
|
650
754
|
toolbar: [
|
|
651
|
-
'shortcut', 'pageMargin', 'paragraph',
|
|
755
|
+
'switchingFormat','shortcut', 'pageMargin', 'paragraph',
|
|
652
756
|
'outlineMenu', 'alignmentMode', 'titleMenu',
|
|
653
757
|
'textMenu', 'color', 'interposition'],
|
|
654
758
|
bubbleData: {},
|
|
@@ -664,6 +768,15 @@ export default {
|
|
|
664
768
|
{label: '2.00倍', value: '2'},
|
|
665
769
|
{label: '2.50倍', value: '2.5'},
|
|
666
770
|
{label: '3.00倍', value: '3'}],
|
|
771
|
+
lineOptions: [
|
|
772
|
+
{label: '————————————————', value: 'solid'},
|
|
773
|
+
{label: '---------------------------------------', value: 'dashed'},
|
|
774
|
+
{label: '════════════════════════', value: 'double'}],
|
|
775
|
+
templateOptions: [
|
|
776
|
+
{label: '公文版式', value: 'officialDocumentFormat'},
|
|
777
|
+
{label: '新闻版式', value: 'newsFormat'},
|
|
778
|
+
{label: '论文版式', value: 'paperFormat'}],
|
|
779
|
+
lineType:'solid',
|
|
667
780
|
paragraph: {
|
|
668
781
|
left: 0,
|
|
669
782
|
right: 0,
|
|
@@ -671,7 +784,33 @@ export default {
|
|
|
671
784
|
bottom: 0,
|
|
672
785
|
distance: '1.5',
|
|
673
786
|
},
|
|
674
|
-
isInsertLink:false
|
|
787
|
+
isInsertLink: false,
|
|
788
|
+
isEditorContentClick: true,
|
|
789
|
+
timeOut: null,
|
|
790
|
+
isShowPageMargin: false,
|
|
791
|
+
isShowHorizontalLine: false,
|
|
792
|
+
isShowSwitchingFormat: false,
|
|
793
|
+
templateType:'officialDocumentFormat',
|
|
794
|
+
switchingFormat:[
|
|
795
|
+
{
|
|
796
|
+
name: '公文版式',
|
|
797
|
+
key: 'officialDocumentFormat',
|
|
798
|
+
menuKeys: [],
|
|
799
|
+
html:`<p style="text-align: center"><span style="font-size: 48px; color: rgb(225, 60, 57)">请在此输入红头名称</span></p><p data-signid="red" style="text-align: center"><span style="font-size: 16px; color: rgb(0, 0, 0)">请在此输入文件号xxx[xxx]xxxx号</span></p><p contenteditable="false" class="solid"></p><p data-signid="subject" style="text-align: center;margin: 80px 0 60px"><strong><span style="font-size: 24px; font-family: SimHei; color: rgb(0, 0, 0);line-height: 1;">请在此处输入标题</span></strong></p><p data-signid="lookUp"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入抬头:</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-1" class="title drrvcvmj indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">一、请在此处输入一级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-2" class="title xxhnhuja indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">（一）请在此处输入二级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="paragraph" style="margin: 30px 0px 0px; text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入落款</span></strong></p><p style="text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入日期</span></strong></p>`
|
|
800
|
+
},
|
|
801
|
+
{
|
|
802
|
+
name: '新闻版式',
|
|
803
|
+
key: 'newsFormat',
|
|
804
|
+
menuKeys: [],
|
|
805
|
+
html:`<p data-signid="subject" style="text-align: center;"><strong><span style="font-size: 24px; font-family: SimHei; color: rgb(0, 0, 0);">请在此处输入标题</span></strong></p><p data-signid="author" class="author" style="text-align: center;padding-bottom: 30px;"><span style="font-size: 14px; font-family: FangSong; color: rgb(0, 0, 0);">请在此处输入作者/来源</span></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-1" class="title drrvcvmj indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">一、请在此处输入一级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-2" class="title xxhnhuja indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">（一）请在此处输入二级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="paragraph" style="margin: 30px 0px 0px; text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入落款</span></strong></p><p style="text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入日期</span></strong></p>`
|
|
806
|
+
},
|
|
807
|
+
{
|
|
808
|
+
name: '论文版式',
|
|
809
|
+
key: 'paperFormat',
|
|
810
|
+
menuKeys: [],
|
|
811
|
+
html:`<p data-signid="subject" style="text-align: center;"><strong><span style="font-size: 24px; font-family: SimHei; color: rgb(0, 0, 0);">请在此处输入题目</span></strong></p><p data-signid="author" class="author" style="text-align: center;padding-bottom: 30px;"><span style="font-size: 14px; font-family: FangSong; color: rgb(0, 0, 0);">请在此处输入作者</span></p><p data-signid="abstract" class="abstract abstract"><strong><span style="font-size: 14px; font-family: SimSun; color: rgb(0, 0, 0)">摘要:</span></strong> <span style="font-size: 14px; font-family: FangSong; color: rgb(0, 0, 0)">请在此处输入摘要文本...</span></p><p data-signid="keyword" class="keyword keyword"><strong><span contenteditable="false" style="font-size: 14px; font-family: SimSun; color: rgb(0, 0, 0)">关键词:</span></strong> <span style="font-size: 14px; font-family: FangSong; color: rgb(0, 0, 0)"> 请在此处输入关键字...</span></p><p></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-1" class="title drrvcvmj indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">一、请在此处输入一级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本</span></p><p data-signid="title-2" class="title xxhnhuja indent"><strong><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">（一）请在此处输入二级标题</span></strong></p><p class="indent indent"><span style="font-size: 14px; font-family: SimHei; color: rgb(0, 0, 0)">请在此处输入正文文本（复用格式建议直接复制粘贴段落）</span></p><p data-signid="splitLine" contenteditable="false" class="paging-line">分 页 线（保存文档时线下内容另起一页）</p><p></p><p data-signid="annotation" contenteditable="false" style="text-align: center;"><strong><span style="font-size: 24px; font-family: SimHei; color: rgb(0, 0, 0);">注释</span></strong></p><p data-signid="author" contenteditable="false" class="author" style="text-align: center;padding-bottom: 30px;"><span style="font-size: 14px;font-weight: 700; color: rgba(0, 0, 0, 0.5);">（请在文中标识要注释的内容，此处将生成注释的序号而后需要作者填写注释内容）</span></p><p data-signid="a-0" class="text" contenteditable="false"><span style="font-size: 12px; font-family: FangSong;text-indent: 2em;">① 注释：是指解释字句的文字，也指用文字解释字句，可以是文字符号图片等多种形式。（当前文本只是示例展示，不会出现在保存的文本中。）</span></p><p data-signid="splitLine" contenteditable="false" class="paging-line">分 页 线（保存文档时线下内容另起一页）</p><p></p><p contenteditable="false" data-signId="reference" style="text-align: center;margin-bottom: 30px;"><span font-family: SimHei; style="font-weight: 700;font-size: 24px;">参考文献</span></p><p data-signid="author" contenteditable="false" class="author" style="text-align: center;padding-bottom: 30px;"><span style="font-size: 14px;font-weight: 700; color: rgba(0, 0, 0, 0.5);">（请在文中标识要注释的内容，此处将生成注释的序号而后需要作者填写注释内容）</span></p><p data-signid="r-0" class="text" contenteditable="false"><span style="font-size: 12px; font-family: FangSong;text-indent: 2em;"> [1] 孙品一.高校学报编辑工作现代化特征[C].中国高等学校自然科学学报研究会.科技编辑学论文集(2).北京：北京师范大学出版社，1998:10-22. （当前文本只是示例展示，不会出现在保存的文本中。）</span></p><p data-signid="r-0" class="text" contenteditable="false"><span style="font-size: 12px; font-family: FangSong;text-indent: 2em;"> [2] 张和生.地质力学系统理论[D].太原：太原理工大学，1998. （当前文本只是示例展示，不会出现在保存的文本中。）</span></p><p data-signid="referenceSplitLine" contenteditable="false" class="paging-line">分 页 线（保存文档时线下内容另起一页）</p><p></p><p data-signid="ack" style="text-align: center"><strong><span style="font-size: 16px; color: rgb(0, 0, 0)">致谢</span></strong></p><p><span style="font-size: 14px; font-family: KaiTi; color: rgb(0, 0, 0)">致谢内容...</span></p><p data-signid="paragraph" style="margin: 30px 0px 0px; text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入落款</span></strong></p><p style="text-align: right"><strong><span style="font-size: 14px; color: rgb(0, 0, 0)">请在此处输入日期</span></strong></p>`
|
|
812
|
+
}
|
|
813
|
+
]
|
|
675
814
|
}
|
|
676
815
|
},
|
|
677
816
|
props: {
|
|
@@ -858,7 +997,7 @@ export default {
|
|
|
858
997
|
const _this = this
|
|
859
998
|
_this.htmlJson = _this.html ? JSON.parse(JSON.stringify(_this.html)) : []
|
|
860
999
|
// let dataHtml = json2html({node: "root", child: (_this.html === undefined || _this.html === null) ? [] : _this.html})
|
|
861
|
-
this.interpositionData = _this.htmlJson.popupsData?_this.htmlJson.popupsData.data:[]
|
|
1000
|
+
this.interpositionData = _this.htmlJson.popupsData ? _this.htmlJson.popupsData.data : []
|
|
862
1001
|
let dataHtml = _this.htmlJson
|
|
863
1002
|
if (dataHtml.sign?.tag === 'sign') {
|
|
864
1003
|
this.signMenuShow = true
|
|
@@ -972,7 +1111,10 @@ export default {
|
|
|
972
1111
|
FontSize.configure({ // 字体大小
|
|
973
1112
|
types: ['textStyle'],
|
|
974
1113
|
}),
|
|
975
|
-
Margin.configure({ //
|
|
1114
|
+
Margin.configure({ // 边距
|
|
1115
|
+
types: ['paragraph'],
|
|
1116
|
+
}),
|
|
1117
|
+
borderBottom.configure({ // 边框
|
|
976
1118
|
types: ['paragraph'],
|
|
977
1119
|
}),
|
|
978
1120
|
FontFamily.configure({ // 字体
|
|
@@ -1003,6 +1145,7 @@ export default {
|
|
|
1003
1145
|
],
|
|
1004
1146
|
injectCSS: true,
|
|
1005
1147
|
onBlur: () => {
|
|
1148
|
+
this.isEditorContentClick = true
|
|
1006
1149
|
_this.limits = false
|
|
1007
1150
|
_this.menuStast = null
|
|
1008
1151
|
_this.close()
|
|
@@ -1012,6 +1155,7 @@ export default {
|
|
|
1012
1155
|
},
|
|
1013
1156
|
// 获取焦点
|
|
1014
1157
|
onFocus: () => {
|
|
1158
|
+
this.isEditorContentClick = false
|
|
1015
1159
|
this.limits = true
|
|
1016
1160
|
},
|
|
1017
1161
|
onUpdate: ({editor}) => {
|
|
@@ -1119,6 +1263,76 @@ export default {
|
|
|
1119
1263
|
},
|
|
1120
1264
|
emits: ['confirm', 'enclosure', 'enlDownload', 'enlSee'],
|
|
1121
1265
|
methods: {
|
|
1266
|
+
selectMargin(selectItem) {
|
|
1267
|
+
this.pageMarginSvg.forEach(item => {
|
|
1268
|
+
item.isSelect = item.title === selectItem.title;
|
|
1269
|
+
})
|
|
1270
|
+
},
|
|
1271
|
+
//修改分割线类型
|
|
1272
|
+
changeLineType(){
|
|
1273
|
+
if(this.lineType==='solid'){
|
|
1274
|
+
let html = `${this.selection()===1?'<p></p>':''}<p contenteditable="false" class="solid"></p><p></p>`
|
|
1275
|
+
this.editor.chain().focus().insertContentAt(this.selection(), html).run()
|
|
1276
|
+
}
|
|
1277
|
+
if(this.lineType==='dashed'){
|
|
1278
|
+
let html = `${this.selection()===1?'<p></p>':''}<p contenteditable="false" class="dashed"></p><p></p>`
|
|
1279
|
+
this.editor.chain().focus().insertContentAt(this.selection(), html).run()
|
|
1280
|
+
}
|
|
1281
|
+
if(this.lineType==='double'){
|
|
1282
|
+
let html = `${this.selection()===1?'<p></p>':''}<p contenteditable="false" class="double"></p><p></p>`
|
|
1283
|
+
this.editor.chain().focus().insertContentAt(this.selection(), html).run()
|
|
1284
|
+
}
|
|
1285
|
+
this.isShowHorizontalLine = false
|
|
1286
|
+
},
|
|
1287
|
+
//修改模板类型
|
|
1288
|
+
async changeTemplateType(){
|
|
1289
|
+
await Message(
|
|
1290
|
+
{type: 'text', promptContent: '切换版式后，已编辑的内容将被清空且无法保存，是否确认切换版式？'}).then(() => {
|
|
1291
|
+
// 公文版式
|
|
1292
|
+
if (this.templateType === 'officialDocumentFormat') {
|
|
1293
|
+
const html = this.switchingFormat.filter(item => item.key === this.templateType)[0].html
|
|
1294
|
+
this.editor.chain().setContent(html).run()
|
|
1295
|
+
}
|
|
1296
|
+
// 新闻版式
|
|
1297
|
+
if (this.templateType === 'newsFormat') {
|
|
1298
|
+
const html = this.switchingFormat.filter(item => item.key === this.templateType)[0].html
|
|
1299
|
+
this.editor.chain().setContent(html).run()
|
|
1300
|
+
}
|
|
1301
|
+
// 论文版式
|
|
1302
|
+
if (this.templateType === 'paperFormat') {
|
|
1303
|
+
const html = this.switchingFormat.filter(item => item.key === this.templateType)[0].html
|
|
1304
|
+
this.editor.chain().setContent(html).run()
|
|
1305
|
+
}
|
|
1306
|
+
this.isShowSwitchingFormat = false
|
|
1307
|
+
}).catch((err) => {
|
|
1308
|
+
console.log('取消', err)
|
|
1309
|
+
})
|
|
1310
|
+
},
|
|
1311
|
+
// 修改边距
|
|
1312
|
+
changeMargin() {
|
|
1313
|
+
const data = document.querySelectorAll('.editing-cont')[0]
|
|
1314
|
+
this.pageMarginSvg.forEach(item => {
|
|
1315
|
+
if (item.isSelect) {
|
|
1316
|
+
if (item.key === 'standard') {
|
|
1317
|
+
data.style.padding = '8% 0'
|
|
1318
|
+
data.style.margin = '0 15%'
|
|
1319
|
+
}
|
|
1320
|
+
if (item.key === 'narrow') {
|
|
1321
|
+
data.style.padding = '4% 0'
|
|
1322
|
+
data.style.margin = '0 6%'
|
|
1323
|
+
}
|
|
1324
|
+
if (item.key === 'moderate') {
|
|
1325
|
+
data.style.padding = '8% 0'
|
|
1326
|
+
data.style.margin = '0 9%'
|
|
1327
|
+
}
|
|
1328
|
+
if (item.key === 'wide') {
|
|
1329
|
+
data.style.padding = '8% 0'
|
|
1330
|
+
data.style.margin = '0 24%'
|
|
1331
|
+
}
|
|
1332
|
+
this.isShowPageMargin = false
|
|
1333
|
+
}
|
|
1334
|
+
})
|
|
1335
|
+
},
|
|
1122
1336
|
checkboxTao(checkboxObj) {
|
|
1123
1337
|
this.checkbox = checkboxObj.value
|
|
1124
1338
|
},
|
|
@@ -1529,6 +1743,12 @@ export default {
|
|
|
1529
1743
|
const text2 = text.replace(/[\r\n]/g, '').replace(/\s*/g, '')
|
|
1530
1744
|
this.editor.chain().focus().insertContentAt(this.selection(), text2).run()
|
|
1531
1745
|
},
|
|
1746
|
+
|
|
1747
|
+
editorContentClick() {
|
|
1748
|
+
if (this.isEditorContentClick) {
|
|
1749
|
+
this.editor.commands.focus('end')
|
|
1750
|
+
}
|
|
1751
|
+
},
|
|
1532
1752
|
// 上传word
|
|
1533
1753
|
uploadDoc(e) {
|
|
1534
1754
|
let that = this
|
|
@@ -1720,6 +1940,11 @@ export default {
|
|
|
1720
1940
|
html = ''
|
|
1721
1941
|
}
|
|
1722
1942
|
}
|
|
1943
|
+
if (data[i].dataset?.signid === 'splitLine') {
|
|
1944
|
+
this.htmlArr.push(html)
|
|
1945
|
+
pHeight = 0
|
|
1946
|
+
html = ''
|
|
1947
|
+
}
|
|
1723
1948
|
if (data[i].dataset?.signid === 'ack') {
|
|
1724
1949
|
this.htmlArr.push(html)
|
|
1725
1950
|
pHeight = 0
|
|
@@ -1738,47 +1963,47 @@ export default {
|
|
|
1738
1963
|
let color = '#000'
|
|
1739
1964
|
let className = data[i].className
|
|
1740
1965
|
let signid = data[i].dataset.signid
|
|
1741
|
-
let signidArr = signid?signid.split('-'):[]
|
|
1966
|
+
let signidArr = signid ? signid.split('-') : []
|
|
1742
1967
|
let label = 'span'
|
|
1743
|
-
if(child && child.nodeName !== '#text'){
|
|
1968
|
+
if (child && child.nodeName !== '#text') {
|
|
1744
1969
|
fontSize = window.getComputedStyle(child, null).fontSize
|
|
1745
1970
|
fontFamily = window.getComputedStyle(child, null).fontFamily
|
|
1746
1971
|
color = window.getComputedStyle(child, null).color
|
|
1747
1972
|
}
|
|
1748
|
-
if(childNodes && childNodes.nodeName === 'MARK'){
|
|
1973
|
+
if (childNodes && childNodes.nodeName === 'MARK') {
|
|
1749
1974
|
childBColor = window.getComputedStyle(childNodes, null).backgroundColor
|
|
1750
1975
|
childColor = window.getComputedStyle(childNodes, null).color
|
|
1751
1976
|
}
|
|
1752
|
-
if(signid && signidArr[0]==='title'){
|
|
1977
|
+
if (signid && signidArr[0] === 'title') {
|
|
1753
1978
|
label = 'strong'
|
|
1754
|
-
}else {
|
|
1979
|
+
} else {
|
|
1755
1980
|
label = 'span'
|
|
1756
1981
|
}
|
|
1757
|
-
if(child && child.nodeName !== '#text'){
|
|
1758
|
-
if(childNodes && childNodes.nodeName === 'MARK'){
|
|
1759
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}"><mark class="custom-class" data-color="${childBColor}" style="background-color: ${childBColor}; color: ${childColor};">${start.data}</mark></${label}></p>`
|
|
1760
|
-
}else {
|
|
1761
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}">${start.data}</${label}></p>`
|
|
1982
|
+
if (child && child.nodeName !== '#text') {
|
|
1983
|
+
if (childNodes && childNodes.nodeName === 'MARK') {
|
|
1984
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}"><mark class="custom-class" data-color="${childBColor}" style="background-color: ${childBColor}; color: ${childColor};">${start.data}</mark></${label}></p>`
|
|
1985
|
+
} else {
|
|
1986
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}">${start.data}</${label}></p>`
|
|
1762
1987
|
}
|
|
1763
|
-
}else {
|
|
1764
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${size}px;">${start.data}</${label}></p>`
|
|
1988
|
+
} else {
|
|
1989
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}" class="${className}"><${label} style="font-size: ${size}px;">${start.data}</${label}></p>`
|
|
1765
1990
|
}
|
|
1766
1991
|
this.htmlArr.push(html)
|
|
1767
1992
|
pHeight = 0
|
|
1768
1993
|
html = ''
|
|
1769
|
-
if(child && child.nodeName !== '#text'){
|
|
1770
|
-
if(childNodes && childNodes.nodeName === 'MARK'){
|
|
1771
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}"><mark class="custom-class" data-color="${childBColor}" style="background-color: ${childBColor}; color: ${childColor};">${end.data}</mark></${label}></p>`
|
|
1772
|
-
}else {
|
|
1773
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}">${end.data}</${label}></p>`
|
|
1994
|
+
if (child && child.nodeName !== '#text') {
|
|
1995
|
+
if (childNodes && childNodes.nodeName === 'MARK') {
|
|
1996
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}"><mark class="custom-class" data-color="${childBColor}" style="background-color: ${childBColor}; color: ${childColor};">${end.data}</mark></${label}></p>`
|
|
1997
|
+
} else {
|
|
1998
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}"><${label} style="font-size: ${fontSize}; font-family: ${fontFamily};color:${color}">${end.data}</${label}></p>`
|
|
1774
1999
|
}
|
|
1775
|
-
}else {
|
|
1776
|
-
html += `<p ${signid?'data-signid='+signid:''} style="text-align: ${textAlign}"><${label} style="font-size: ${size}px;">${end.data}</${label}></p>`
|
|
2000
|
+
} else {
|
|
2001
|
+
html += `<p ${signid ? 'data-signid=' + signid : ''} style="text-align: ${textAlign}"><${label} style="font-size: ${size}px;">${end.data}</${label}></p>`
|
|
1777
2002
|
}
|
|
1778
2003
|
pHeight = end.size
|
|
1779
2004
|
} else {
|
|
1780
2005
|
pHeight += text
|
|
1781
|
-
html += data[i].outerHTML
|
|
2006
|
+
if(data[i].dataset?.signid !== 'splitLine'&&data[i].dataset?.signid !== 'referenceSplitLine')html += data[i].outerHTML
|
|
1782
2007
|
}
|
|
1783
2008
|
if (i === data.length - 1) {
|
|
1784
2009
|
this.htmlArr.push(html)
|
|
@@ -1965,12 +2190,12 @@ export default {
|
|
|
1965
2190
|
let directoryJson = html2json(this.editor.getHTML()).child
|
|
1966
2191
|
let editorHtml = this.editor.getHTML()
|
|
1967
2192
|
let editorJson = this.editor.getJSON()
|
|
1968
|
-
let sign = {
|
|
2193
|
+
let sign = {node: 'element', tag: 'sign', child: []}
|
|
1969
2194
|
let popupsData = {type: 'interpositionData', data: [...this.interpositionData]}
|
|
1970
2195
|
let data = {
|
|
1971
2196
|
directoryJson, editorHtml, editorJson, popupsData
|
|
1972
2197
|
}
|
|
1973
|
-
if(this.signMenuShow){
|
|
2198
|
+
if (this.signMenuShow) {
|
|
1974
2199
|
data.sign = sign
|
|
1975
2200
|
}
|
|
1976
2201
|
// data.push(this.editor.getJSON())
|
|
@@ -1988,12 +2213,12 @@ export default {
|
|
|
1988
2213
|
let directoryJson = html2json(this.editor.getHTML()).child
|
|
1989
2214
|
let editorHtml = this.editor.getHTML()
|
|
1990
2215
|
let editorJson = this.editor.getJSON()
|
|
1991
|
-
let sign = {
|
|
2216
|
+
let sign = {node: 'element', tag: 'sign', child: []}
|
|
1992
2217
|
let popupsData = {type: 'interpositionData', data: [...this.interpositionData]}
|
|
1993
2218
|
let data = {
|
|
1994
2219
|
directoryJson, editorHtml, editorJson, popupsData
|
|
1995
2220
|
}
|
|
1996
|
-
if(this.signMenuShow){
|
|
2221
|
+
if (this.signMenuShow) {
|
|
1997
2222
|
data.sign = sign
|
|
1998
2223
|
}
|
|
1999
2224
|
// let data = []
|
|
@@ -2388,7 +2613,10 @@ export default {
|
|
|
2388
2613
|
},
|
|
2389
2614
|
|
|
2390
2615
|
async butTap(data, key, childKey) {
|
|
2391
|
-
|
|
2616
|
+
// 快捷排版
|
|
2617
|
+
if (data.key === 'switchingFormat') {
|
|
2618
|
+
this.isShowSwitchingFormat = true
|
|
2619
|
+
}
|
|
2392
2620
|
// 快捷排版
|
|
2393
2621
|
if (data.key === 'shortcut') {
|
|
2394
2622
|
const menusHtml = butJson(this.editor, this.menusText)[data.key].menuKeys
|
|
@@ -2488,14 +2716,63 @@ export default {
|
|
|
2488
2716
|
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2489
2717
|
this.editor.chain().focus().insertContentAt(this.selection(), html).run()
|
|
2490
2718
|
}
|
|
2719
|
+
// 抬头
|
|
2720
|
+
if (key.key === 'lookUp') {
|
|
2721
|
+
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2722
|
+
this.editor.chain().focus().insertContentAt(this.selection(), html).run()
|
|
2723
|
+
}
|
|
2491
2724
|
// 信息源
|
|
2492
2725
|
if (key.key === 'sourcesInfo') {
|
|
2493
2726
|
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2494
2727
|
let form = this.selection()
|
|
2495
2728
|
this.editor.chain().focus().insertContentAt(form, html).run()
|
|
2496
2729
|
}
|
|
2730
|
+
// 致谢
|
|
2731
|
+
if (key.key === 'ackMenu') {
|
|
2732
|
+
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2733
|
+
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
2734
|
+
const r = await this.signIdData('ack')//致谢
|
|
2735
|
+
const n = await this.signIdData('paragraph')//落款
|
|
2736
|
+
const b = await this.signIdData('enclosure')//附件
|
|
2737
|
+
// const a = await this.signIdData('reference')//参考文献
|
|
2738
|
+
if (b === -1) {
|
|
2739
|
+
if (n === -1) {
|
|
2740
|
+
if (r === -1) {
|
|
2741
|
+
this.editor.chain().focus().insertContentAt(last, html[0]).run()
|
|
2742
|
+
this.editor.chain().focus().insertContentAt(last + 3, html[1]).run()
|
|
2743
|
+
}
|
|
2744
|
+
return
|
|
2745
|
+
}
|
|
2746
|
+
const num = this.upSort(this.editor, 'paragraph')
|
|
2747
|
+
if (r === -1) {
|
|
2748
|
+
this.editor.chain().focus().insertContentAt(num.len-6, html[0]).run()
|
|
2749
|
+
this.editor.chain().focus().insertContentAt(num.len-2, html[1]).run()
|
|
2750
|
+
}
|
|
2751
|
+
return
|
|
2752
|
+
}
|
|
2753
|
+
const num = this.selectionPath('enclosure')
|
|
2754
|
+
if (r === -1) {
|
|
2755
|
+
this.editor.chain().focus().insertContentAt(num - 7, html[0]).run()
|
|
2756
|
+
const ackNum = this.selectionPath('ack')
|
|
2757
|
+
this.editor.chain().focus().insertContentAt(ackNum, html[1]).run()
|
|
2758
|
+
}
|
|
2759
|
+
}
|
|
2497
2760
|
// 添加落款
|
|
2498
2761
|
if (key.key === 'paragraphMenu') {
|
|
2762
|
+
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2763
|
+
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
2764
|
+
const r = await this.signIdData('paragraph')//落款
|
|
2765
|
+
const n = await this.signIdData('enclosure')//附件
|
|
2766
|
+
if (n === -1) {
|
|
2767
|
+
if (r === -1) this.editor.chain().focus().insertContentAt(last, html).run()
|
|
2768
|
+
return
|
|
2769
|
+
}
|
|
2770
|
+
const num = this.selectionPath('enclosure')
|
|
2771
|
+
if (r === -1) this.editor.chain().focus().insertContentAt(num - 7, html).run()
|
|
2772
|
+
return
|
|
2773
|
+
}
|
|
2774
|
+
// 添加落款
|
|
2775
|
+
/*if (key.key === 'paragraphMenu') {
|
|
2499
2776
|
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2500
2777
|
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
2501
2778
|
const r = await this.signIdData('paragraph')//落款
|
|
@@ -2518,9 +2795,9 @@ export default {
|
|
|
2518
2795
|
}
|
|
2519
2796
|
const num = this.upSort(this.editor, 'ack')
|
|
2520
2797
|
if (r === -1) this.editor.chain().focus().insertContentAt(num.len - 3, html).run()
|
|
2521
|
-
}
|
|
2798
|
+
}*/
|
|
2522
2799
|
// 致谢
|
|
2523
|
-
if (key.key === 'ackMenu') {
|
|
2800
|
+
/* if (key.key === 'ackMenu') {
|
|
2524
2801
|
const html = menusHtml.filter(item => item.key == key.key)[0].html
|
|
2525
2802
|
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
2526
2803
|
const r = await this.signIdData('ack')
|
|
@@ -2556,30 +2833,14 @@ export default {
|
|
|
2556
2833
|
// }else {
|
|
2557
2834
|
// // if (r === -1) this.editor.chain().focus().insertContentAt(num.len - 3, html).run()
|
|
2558
2835
|
// }
|
|
2559
|
-
}
|
|
2836
|
+
}*/
|
|
2560
2837
|
}
|
|
2561
2838
|
|
|
2562
2839
|
if (data.key === 'textMenu' && key === 0 || data.key === 'titleMenu' && key === 0) return
|
|
2563
2840
|
// 边距
|
|
2564
2841
|
if (data.key === 'pageMargin') {
|
|
2842
|
+
this.isShowPageMargin = true
|
|
2565
2843
|
this.menuStast = 'pageMargin'
|
|
2566
|
-
const data = document.querySelectorAll('.editing-cont')[0]
|
|
2567
|
-
if (key.key === 'standard') {
|
|
2568
|
-
data.style.padding = '8% 0'
|
|
2569
|
-
data.style.margin = '0 15%'
|
|
2570
|
-
}
|
|
2571
|
-
if (key.key === 'narrow') {
|
|
2572
|
-
data.style.padding = '4% 0'
|
|
2573
|
-
data.style.margin = '0 6%'
|
|
2574
|
-
}
|
|
2575
|
-
if (key.key === 'moderate') {
|
|
2576
|
-
data.style.padding = '8% 0'
|
|
2577
|
-
data.style.margin = '0 9%'
|
|
2578
|
-
}
|
|
2579
|
-
if (key.key === 'wide') {
|
|
2580
|
-
data.style.padding = '8% 0'
|
|
2581
|
-
data.style.margin = '0 24%'
|
|
2582
|
-
}
|
|
2583
2844
|
}
|
|
2584
2845
|
// 段落
|
|
2585
2846
|
if (data.key === 'paragraph') {
|
|
@@ -2676,6 +2937,9 @@ export default {
|
|
|
2676
2937
|
}
|
|
2677
2938
|
// 插入
|
|
2678
2939
|
if (data.key === 'interposition') {
|
|
2940
|
+
if (key.key === 'insertHorizontalLine') {
|
|
2941
|
+
this.isShowHorizontalLine = true
|
|
2942
|
+
}
|
|
2679
2943
|
if (key.key === 'group-upload') {
|
|
2680
2944
|
this.isShowUpload = true
|
|
2681
2945
|
}
|
|
@@ -2738,8 +3002,7 @@ export default {
|
|
|
2738
3002
|
}
|
|
2739
3003
|
// 文献
|
|
2740
3004
|
if (key.key === 'literatureMenu' && childKey) {
|
|
2741
|
-
|
|
2742
|
-
if (this.isInsertLink){
|
|
3005
|
+
if (this.isInsertLink) {
|
|
2743
3006
|
Message({type: 'text', promptContent: '光标位置不可编辑'})
|
|
2744
3007
|
return
|
|
2745
3008
|
}
|
|
@@ -3126,9 +3389,9 @@ export default {
|
|
|
3126
3389
|
this.isShowPopup = false
|
|
3127
3390
|
},
|
|
3128
3391
|
nounExplainSubmit(bubbleData) {
|
|
3129
|
-
if(this.$refs.textarea.length){
|
|
3392
|
+
if (this.$refs.textarea.length) {
|
|
3130
3393
|
this.taggingText = this.$refs.textarea[0].getContent()
|
|
3131
|
-
}else {
|
|
3394
|
+
} else {
|
|
3132
3395
|
this.taggingText = this.$refs.textarea.getContent()
|
|
3133
3396
|
}
|
|
3134
3397
|
if (!this.taggingText) {
|
|
@@ -3144,7 +3407,7 @@ export default {
|
|
|
3144
3407
|
exegesis: this.tipTitle,
|
|
3145
3408
|
text: this.taggingText
|
|
3146
3409
|
}
|
|
3147
|
-
if (this.exegesisType === 'edit' || (bubbleData&&bubbleData.edit)) {
|
|
3410
|
+
if (this.exegesisType === 'edit' || (bubbleData && bubbleData.edit)) {
|
|
3148
3411
|
this.interpositionData.forEach(item => {
|
|
3149
3412
|
if (item.id === this.bubbleData.id) {
|
|
3150
3413
|
item.text = this.taggingText
|
|
@@ -3363,12 +3626,30 @@ export default {
|
|
|
3363
3626
|
}
|
|
3364
3627
|
},
|
|
3365
3628
|
|
|
3629
|
+
async addAnnotationMenu(data){
|
|
3630
|
+
const t = await this.signIdData('annotation')
|
|
3631
|
+
const html = `<p contenteditable="false" data-signId="annotation" style="text-align: center;margin-bottom: 30px;"><span style="font-weight: 700;font-size: 16px;">注释：</span></p>`
|
|
3632
|
+
const html2 = `<p contenteditable="false" class="text" data-signId="r-${data.number}"><span style="font-family: FangSong;font-size: 12px;line-height25px">${data.text}</span></p>`
|
|
3633
|
+
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
3634
|
+
if (t === -1) this.editor.chain().focus().insertContentAt(last, html).run()
|
|
3635
|
+
let last1 = this.editor.state.selection.$anchor.path[0].content.size
|
|
3636
|
+
// const num = this.selectionPath('reference')
|
|
3637
|
+
this.editor.chain().focus().insertContentAt(last1, html2).run()
|
|
3638
|
+
},
|
|
3639
|
+
|
|
3366
3640
|
async addReferenceMenu(data) {
|
|
3367
3641
|
const t = await this.signIdData('reference')
|
|
3642
|
+
const b = await this.signIdData('referenceSplitLine') // 判断是否有分页线
|
|
3368
3643
|
const html = `<p contenteditable="false" data-signId="reference" style="text-align: center;margin-bottom: 30px;"><span style="font-weight: 700;font-size: 16px;">参考文献：</span></p>`
|
|
3369
|
-
const html2 = `<p contenteditable="false" data-signId="r-${data.number}"><span style="font-family: FangSong;font-size: 12px;line-height25px">${data.text}</span></p>`
|
|
3644
|
+
const html2 = `<p contenteditable="false" class="text" data-signId="r-${data.number}"><span style="font-family: FangSong;font-size: 12px;line-height25px">${data.text}</span></p>`
|
|
3370
3645
|
const last = this.editor.state.selection.$anchor.path[0].content.size
|
|
3371
|
-
if (t === -1) this.editor.chain().focus().insertContentAt(last, html).run()
|
|
3646
|
+
// if (t === -1) this.editor.chain().focus().insertContentAt(last, html).run()
|
|
3647
|
+
|
|
3648
|
+
if (b === -1) {
|
|
3649
|
+
if (t === -1) this.editor.chain().focus().insertContentAt(last, html).run()
|
|
3650
|
+
} else {
|
|
3651
|
+
if (t === -1) this.editor.chain().focus().insertContentAt(this.selectionPath('referenceSplitLine'), html).run()
|
|
3652
|
+
}
|
|
3372
3653
|
let last1 = this.editor.state.selection.$anchor.path[0].content.size
|
|
3373
3654
|
// const num = this.selectionPath('reference')
|
|
3374
3655
|
this.editor.chain().focus().insertContentAt(last1, html2).run()
|
|
@@ -3480,13 +3761,13 @@ export default {
|
|
|
3480
3761
|
.read-only-p {
|
|
3481
3762
|
width: 100%;
|
|
3482
3763
|
height: 100%;
|
|
3483
|
-
white-space:pre-wrap;
|
|
3764
|
+
white-space: pre-wrap;
|
|
3484
3765
|
}
|
|
3485
3766
|
|
|
3486
3767
|
:deep(.read-only-p p) {
|
|
3487
3768
|
line-height: 24px;
|
|
3488
3769
|
text-align: justify;
|
|
3489
|
-
white-space:pre-wrap;
|
|
3770
|
+
white-space: pre-wrap;
|
|
3490
3771
|
}
|
|
3491
3772
|
|
|
3492
3773
|
:deep(p[data-signid="subject"]) {
|
|
@@ -4062,11 +4343,9 @@ li {
|
|
|
4062
4343
|
height: 30px;
|
|
4063
4344
|
display: flex;
|
|
4064
4345
|
flex-direction: row;
|
|
4065
|
-
justify-content: flex-start;
|
|
4066
4346
|
align-items: center;
|
|
4067
4347
|
margin-bottom: 5px;
|
|
4068
4348
|
position: relative;
|
|
4069
|
-
display: flex;
|
|
4070
4349
|
justify-content: space-between;
|
|
4071
4350
|
}
|
|
4072
4351
|
|
|
@@ -4159,8 +4438,122 @@ li {
|
|
|
4159
4438
|
flex-direction: column;
|
|
4160
4439
|
justify-content: space-between;
|
|
4161
4440
|
}
|
|
4162
|
-
|
|
4163
|
-
|
|
4164
|
-
|
|
4441
|
+
|
|
4442
|
+
:deep(p) {
|
|
4443
|
+
white-space: pre-wrap;
|
|
4444
|
+
word-break: break-all;
|
|
4445
|
+
}
|
|
4446
|
+
|
|
4447
|
+
.page-margin-box {
|
|
4448
|
+
width: 100%;
|
|
4449
|
+
height: calc(100% - 70px);
|
|
4450
|
+
padding-top: 30px
|
|
4451
|
+
}
|
|
4452
|
+
|
|
4453
|
+
.page-margin-title {
|
|
4454
|
+
width: 100%;
|
|
4455
|
+
font-size: 18px;
|
|
4456
|
+
font-weight: 700;
|
|
4457
|
+
line-height: 24px;
|
|
4458
|
+
text-align: center;
|
|
4459
|
+
}
|
|
4460
|
+
|
|
4461
|
+
.page-line-select {
|
|
4462
|
+
width: 100%;
|
|
4463
|
+
height: calc(100% - 34px);
|
|
4464
|
+
display: flex;
|
|
4465
|
+
flex-direction: row;
|
|
4466
|
+
align-items: center;
|
|
4467
|
+
padding: 0 90px;
|
|
4468
|
+
margin-top: 10px;
|
|
4469
|
+
position: relative;
|
|
4470
|
+
}
|
|
4471
|
+
|
|
4472
|
+
.page-line-select > .name {
|
|
4473
|
+
width: 80px;
|
|
4474
|
+
font-size: 16px;
|
|
4475
|
+
text-align: justify;
|
|
4476
|
+
text-align-last: justify;
|
|
4477
|
+
}
|
|
4478
|
+
|
|
4479
|
+
.page-line-select :deep(input) {
|
|
4480
|
+
width: 300px;
|
|
4481
|
+
}
|
|
4482
|
+
|
|
4483
|
+
.page-margin-select {
|
|
4484
|
+
width: 100%;
|
|
4485
|
+
height: calc(100% - 34px);
|
|
4486
|
+
display: flex;
|
|
4487
|
+
flex-direction: row;
|
|
4488
|
+
justify-content: space-between;
|
|
4489
|
+
padding: 0 90px;
|
|
4490
|
+
margin-top: 10px
|
|
4491
|
+
}
|
|
4492
|
+
|
|
4493
|
+
.page-margin-select-item {
|
|
4494
|
+
width: 160px;
|
|
4495
|
+
height: 100%;
|
|
4496
|
+
display: flex;
|
|
4497
|
+
flex-direction: column;
|
|
4498
|
+
justify-content: space-between;
|
|
4499
|
+
align-items: center;
|
|
4500
|
+
position: relative;
|
|
4501
|
+
}
|
|
4502
|
+
|
|
4503
|
+
.is-select {
|
|
4504
|
+
position: absolute;
|
|
4505
|
+
top: 50%;
|
|
4506
|
+
transform: translateY(-100%);
|
|
4507
|
+
}
|
|
4508
|
+
|
|
4509
|
+
.page-margin-select-name {
|
|
4510
|
+
font-size: 18px;
|
|
4511
|
+
font-weight: 400;
|
|
4512
|
+
line-height: 24px;
|
|
4513
|
+
color: rgba(0, 0, 0, 1);
|
|
4514
|
+
}
|
|
4515
|
+
|
|
4516
|
+
:deep(.solid){
|
|
4517
|
+
height: 0;
|
|
4518
|
+
border-bottom:1px solid #000;
|
|
4519
|
+
}
|
|
4520
|
+
|
|
4521
|
+
:deep(.dashed){
|
|
4522
|
+
height: 0;
|
|
4523
|
+
border-bottom:1px dashed #000;
|
|
4524
|
+
}
|
|
4525
|
+
|
|
4526
|
+
:deep(.double){
|
|
4527
|
+
height: 0;
|
|
4528
|
+
border-style:double;
|
|
4529
|
+
border-top:none;
|
|
4530
|
+
border-left: none;
|
|
4531
|
+
border-right: none;
|
|
4532
|
+
}
|
|
4533
|
+
|
|
4534
|
+
:deep(.paging-line){
|
|
4535
|
+
width: 100%;
|
|
4536
|
+
font-size: 12px;
|
|
4537
|
+
font-weight: 400;
|
|
4538
|
+
line-height: 12px;
|
|
4539
|
+
color: rgba(204, 204, 204, 1);
|
|
4540
|
+
text-align: center;
|
|
4541
|
+
margin: 60px 0 120px;
|
|
4542
|
+
display: flex;
|
|
4543
|
+
flex-direction: row;
|
|
4544
|
+
justify-content: space-around;
|
|
4545
|
+
align-items: center;
|
|
4546
|
+
}
|
|
4547
|
+
:deep(.paging-line)::before,:deep(.paging-line)::after{
|
|
4548
|
+
content:'';
|
|
4549
|
+
flex: 1;
|
|
4550
|
+
height: 0px;
|
|
4551
|
+
border-bottom: 1px dashed rgba(204, 204, 204, 1);
|
|
4552
|
+
}
|
|
4553
|
+
:deep(.paging-line)::before{
|
|
4554
|
+
//margin-right: 0.25rem;
|
|
4555
|
+
}
|
|
4556
|
+
:deep(.paging-line)::after{
|
|
4557
|
+
//margin-left: 0.25rem;
|
|
4165
4558
|
}
|
|
4166
4559
|
</style>
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { Extension, nodeInputRule } from '@tiptap/core'
|
|
2
|
+
|
|
3
|
+
export const borderBottom = Extension.create({
|
|
4
|
+
name: 'borderBottom',
|
|
5
|
+
|
|
6
|
+
addOptions() {
|
|
7
|
+
return {
|
|
8
|
+
types: ['heading', 'paragraph'],
|
|
9
|
+
}
|
|
10
|
+
},
|
|
11
|
+
|
|
12
|
+
addGlobalAttributes() {
|
|
13
|
+
return [
|
|
14
|
+
{
|
|
15
|
+
types: this.options.types,
|
|
16
|
+
attributes: {
|
|
17
|
+
borderBottom: {
|
|
18
|
+
default: null,
|
|
19
|
+
parseHTML: element => element.style.borderBottom.replace(/['"]+/g, ''),
|
|
20
|
+
renderHTML: attributes => {
|
|
21
|
+
if (!attributes.borderBottom) {
|
|
22
|
+
return {}
|
|
23
|
+
}
|
|
24
|
+
return {
|
|
25
|
+
style:`border-bottom: ${attributes.borderBottom}`,
|
|
26
|
+
}
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
},
|
|
30
|
+
},
|
|
31
|
+
]
|
|
32
|
+
},
|
|
33
|
+
|
|
34
|
+
addCommands() {
|
|
35
|
+
return {
|
|
36
|
+
setMargin: borderBottom => ({ chain }) => {
|
|
37
|
+
return chain()
|
|
38
|
+
.setNode('paragraph', { borderBottom })
|
|
39
|
+
.run()
|
|
40
|
+
},
|
|
41
|
+
unsetMargin: () => ({ chain }) => {
|
|
42
|
+
return chain()
|
|
43
|
+
.setNode('paragraph', { borderBottom: null })
|
|
44
|
+
.run()
|
|
45
|
+
},
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
})
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
export default {
|
|
3
|
+
name: "siSelect"
|
|
4
|
+
}
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<svg fill="none" height="40" viewBox="0 0 40 40" width="40"
|
|
9
|
+
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
10
|
+
<circle cx="20" cy="20" fill="#13BF6C" r="20">
|
|
11
|
+
</circle>
|
|
12
|
+
<path d="M12.4167 20.0033L17.8367 25.4133L28.6667 14.5833" stroke="rgba(255, 255, 255, 1)" stroke-linecap="round" stroke-linejoin="round"
|
|
13
|
+
stroke-width="3">
|
|
14
|
+
</path>
|
|
15
|
+
</svg>
|
|
16
|
+
</template>
|
|
17
|
+
|
|
18
|
+
<style scoped>
|
|
19
|
+
|
|
20
|
+
</style>
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="181" height="247" viewBox="0 0 181 247" fill="none">
|
|
3
|
+
<g filter="url(#filter_123_83)">
|
|
4
|
+
<rect x="10.5" y="10.5" width="160" height="226" rx="2" fill="#FFFFFF" >
|
|
5
|
+
</rect>
|
|
6
|
+
<path fill="rgba(204, 204, 204, 0.7)" d="M12.5 10L168.5 10C169.881 10 171 11.1193 171 12.5L171 234.5C171 235.881 169.881 237 168.5 237L12.5 237C11.1193 237 10 235.881 10 234.5L10 12.5C10 11.1193 11.1193 10 12.5 10ZM12.5 11C11.6716 11 11 11.6716 11 12.5L11 234.5C11 235.328 11.6716 236 12.5 236L168.5 236C169.328 236 170 235.328 170 234.5L170 12.5C170 11.6716 169.328 11 168.5 11L12.5 11Z">
|
|
7
|
+
</path>
|
|
8
|
+
</g>
|
|
9
|
+
<rect x="72.5" y="29.5" width="38" height="9.999999999999998" fill="#CCCCCC" >
|
|
10
|
+
</rect>
|
|
11
|
+
<rect x="38.5" y="44.5" width="118" height="6" fill="#CCCCCC" >
|
|
12
|
+
</rect>
|
|
13
|
+
<rect x="25.5" y="88.5" width="131" height="6" fill="#CCCCCC" >
|
|
14
|
+
</rect>
|
|
15
|
+
<rect x="25.5" y="132.5" width="131" height="6" fill="#CCCCCC" >
|
|
16
|
+
</rect>
|
|
17
|
+
<rect x="25.5" y="176.5" width="131" height="6" fill="#CCCCCC" >
|
|
18
|
+
</rect>
|
|
19
|
+
<rect x="25.5" y="66.5" width="131" height="6" fill="#CCCCCC" >
|
|
20
|
+
</rect>
|
|
21
|
+
<rect x="25.5" y="110.5" width="131" height="6" fill="#CCCCCC" >
|
|
22
|
+
</rect>
|
|
23
|
+
<rect x="25.5" y="154.5" width="131" height="6" fill="#CCCCCC" >
|
|
24
|
+
</rect>
|
|
25
|
+
<rect x="25.5" y="198.5" width="131" height="6" fill="#CCCCCC" >
|
|
26
|
+
</rect>
|
|
27
|
+
<rect x="25.5" y="55.5" width="131" height="6" fill="#CCCCCC" >
|
|
28
|
+
</rect>
|
|
29
|
+
<rect x="25.5" y="99.5" width="131" height="6" fill="#CCCCCC" >
|
|
30
|
+
</rect>
|
|
31
|
+
<rect x="25.5" y="143.5" width="131" height="6" fill="#CCCCCC" >
|
|
32
|
+
</rect>
|
|
33
|
+
<rect x="25.5" y="187.5" width="131" height="6" fill="#CCCCCC" >
|
|
34
|
+
</rect>
|
|
35
|
+
<rect x="25.5" y="77.5" width="131" height="6" fill="#CCCCCC" >
|
|
36
|
+
</rect>
|
|
37
|
+
<rect x="25.5" y="121.5" width="131" height="6" fill="#CCCCCC" >
|
|
38
|
+
</rect>
|
|
39
|
+
<rect x="25.5" y="165.5" width="131" height="6" fill="#CCCCCC" >
|
|
40
|
+
</rect>
|
|
41
|
+
<rect x="25.5" y="209.5" width="99" height="6" fill="#CCCCCC" >
|
|
42
|
+
</rect>
|
|
43
|
+
<defs>
|
|
44
|
+
<filter id="filter_123_83" x="0" y="0" width="181" height="247" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
45
|
+
<feFlood flood-opacity="0" result="feFloodId_123_83"/>
|
|
46
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha_123_83"/>
|
|
47
|
+
<feOffset dx="0" dy="0"/>
|
|
48
|
+
<feGaussianBlur stdDeviation="5"/>
|
|
49
|
+
<feComposite in2="hardAlpha_123_83" operator="out"/>
|
|
50
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/>
|
|
51
|
+
<feBlend mode="normal" in2="feFloodId_123_83" result="dropShadow_1_123_83"/>
|
|
52
|
+
<feBlend mode="normal" in="SourceGraphic" in2="dropShadow_1_123_83" result="shape_123_83"/>
|
|
53
|
+
</filter>
|
|
54
|
+
</defs>
|
|
55
|
+
</svg>
|
|
56
|
+
</template>
|
|
57
|
+
|
|
58
|
+
<script>
|
|
59
|
+
export default {
|
|
60
|
+
name: "margin-moderation",
|
|
61
|
+
props: {
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
</script>
|
|
65
|
+
|
|
66
|
+
<style scoped>
|
|
67
|
+
|
|
68
|
+
</style>
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
export default {
|
|
3
|
+
name: "margin-narrow"
|
|
4
|
+
}
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="181" height="247" viewBox="0 0 181 247" fill="none">
|
|
9
|
+
<g filter="url(#filter_123_82)">
|
|
10
|
+
<rect x="10.5" y="10.5" width="160" height="226" rx="2" fill="#FFFFFF" >
|
|
11
|
+
</rect>
|
|
12
|
+
<path fill="rgba(204, 204, 204, 0.7)" d="M12.5 10L168.5 10C169.881 10 171 11.1193 171 12.5L171 234.5C171 235.881 169.881 237 168.5 237L12.5 237C11.1193 237 10 235.881 10 234.5L10 12.5C10 11.1193 11.1193 10 12.5 10ZM12.5 11C11.6716 11 11 11.6716 11 12.5L11 234.5C11 235.328 11.6716 236 12.5 236L168.5 236C169.328 236 170 235.328 170 234.5L170 12.5C170 11.6716 169.328 11 168.5 11L12.5 11Z">
|
|
13
|
+
</path>
|
|
14
|
+
</g>
|
|
15
|
+
<rect x="71.5" y="19.5" width="38" height="9.999999999999998" fill="#CCCCCC" >
|
|
16
|
+
</rect>
|
|
17
|
+
<rect x="36.75" y="34.5" width="123.74999618530273" height="6" fill="#CCCCCC" >
|
|
18
|
+
</rect>
|
|
19
|
+
<rect x="20.5" y="78.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
20
|
+
</rect>
|
|
21
|
+
<rect x="20.5" y="122.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
22
|
+
</rect>
|
|
23
|
+
<rect x="20.5" y="166.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
24
|
+
</rect>
|
|
25
|
+
<rect x="20.5" y="56.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
26
|
+
</rect>
|
|
27
|
+
<rect x="20.5" y="100.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
28
|
+
</rect>
|
|
29
|
+
<rect x="20.5" y="144.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
30
|
+
</rect>
|
|
31
|
+
<rect x="20.5" y="188.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
32
|
+
</rect>
|
|
33
|
+
<rect x="20.5" y="210.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
34
|
+
</rect>
|
|
35
|
+
<rect x="20.5" y="199.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
36
|
+
</rect>
|
|
37
|
+
<rect x="20.5" y="45.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
38
|
+
</rect>
|
|
39
|
+
<rect x="20.5" y="89.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
40
|
+
</rect>
|
|
41
|
+
<rect x="20.5" y="133.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
42
|
+
</rect>
|
|
43
|
+
<rect x="20.5" y="177.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
44
|
+
</rect>
|
|
45
|
+
<rect x="20.5" y="67.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
46
|
+
</rect>
|
|
47
|
+
<rect x="20.5" y="111.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
48
|
+
</rect>
|
|
49
|
+
<rect x="20.5" y="155.5" width="140.00003051757812" height="6" fill="#CCCCCC" >
|
|
50
|
+
</rect>
|
|
51
|
+
<rect x="20.5" y="221.5" width="99" height="6" fill="#CCCCCC" >
|
|
52
|
+
</rect>
|
|
53
|
+
<defs>
|
|
54
|
+
<filter id="filter_123_82" x="0" y="0" width="181" height="247" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
55
|
+
<feFlood flood-opacity="0" result="feFloodId_123_82"/>
|
|
56
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha_123_82"/>
|
|
57
|
+
<feOffset dx="0" dy="0"/>
|
|
58
|
+
<feGaussianBlur stdDeviation="5"/>
|
|
59
|
+
<feComposite in2="hardAlpha_123_82" operator="out"/>
|
|
60
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/>
|
|
61
|
+
<feBlend mode="normal" in2="feFloodId_123_82" result="dropShadow_1_123_82"/>
|
|
62
|
+
<feBlend mode="normal" in="SourceGraphic" in2="dropShadow_1_123_82" result="shape_123_82"/>
|
|
63
|
+
</filter>
|
|
64
|
+
</defs>
|
|
65
|
+
</svg>
|
|
66
|
+
</template>
|
|
67
|
+
|
|
68
|
+
<style scoped>
|
|
69
|
+
|
|
70
|
+
</style>
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
export default {
|
|
3
|
+
name: "margin-standard"
|
|
4
|
+
}
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="181" height="247" viewBox="0 0 181 247" fill="none">
|
|
9
|
+
<g filter="url(#filter_123_81)">
|
|
10
|
+
<rect x="10.5" y="10.5" width="160" height="226" rx="2" fill="#FFFFFF" >
|
|
11
|
+
</rect>
|
|
12
|
+
<path fill="rgba(204, 204, 204, 0.7)" d="M12.5 10L168.5 10C169.881 10 171 11.1193 171 12.5L171 234.5C171 235.881 169.881 237 168.5 237L12.5 237C11.1193 237 10 235.881 10 234.5L10 12.5C10 11.1193 11.1193 10 12.5 10ZM12.5 11C11.6716 11 11 11.6716 11 12.5L11 234.5C11 235.328 11.6716 236 12.5 236L168.5 236C169.328 236 170 235.328 170 234.5L170 12.5C170 11.6716 169.328 11 168.5 11L12.5 11Z">
|
|
13
|
+
</path>
|
|
14
|
+
</g>
|
|
15
|
+
<rect x="71.5" y="29.5" width="38" height="9.999999999999998" fill="#CCCCCC" >
|
|
16
|
+
</rect>
|
|
17
|
+
<rect x="47.5" y="44.5" width="99" height="6" fill="#CCCCCC" >
|
|
18
|
+
</rect>
|
|
19
|
+
<rect x="34.5" y="88.5" width="112" height="6" fill="#CCCCCC" >
|
|
20
|
+
</rect>
|
|
21
|
+
<rect x="34.5" y="132.5" width="112" height="6" fill="#CCCCCC" >
|
|
22
|
+
</rect>
|
|
23
|
+
<rect x="34.5" y="176.5" width="112" height="6" fill="#CCCCCC" >
|
|
24
|
+
</rect>
|
|
25
|
+
<rect x="34.5" y="66.5" width="112" height="6" fill="#CCCCCC" >
|
|
26
|
+
</rect>
|
|
27
|
+
<rect x="34.5" y="110.5" width="112" height="6" fill="#CCCCCC" >
|
|
28
|
+
</rect>
|
|
29
|
+
<rect x="34.5" y="154.5" width="112" height="6" fill="#CCCCCC" >
|
|
30
|
+
</rect>
|
|
31
|
+
<rect x="34.5" y="198.5" width="112" height="6" fill="#CCCCCC" >
|
|
32
|
+
</rect>
|
|
33
|
+
<rect x="34.5" y="55.5" width="112" height="6" fill="#CCCCCC" >
|
|
34
|
+
</rect>
|
|
35
|
+
<rect x="34.5" y="99.5" width="112" height="6" fill="#CCCCCC" >
|
|
36
|
+
</rect>
|
|
37
|
+
<rect x="34.5" y="143.5" width="112" height="6" fill="#CCCCCC" >
|
|
38
|
+
</rect>
|
|
39
|
+
<rect x="34.5" y="187.5" width="112" height="6" fill="#CCCCCC" >
|
|
40
|
+
</rect>
|
|
41
|
+
<rect x="34.5" y="77.5" width="112" height="6" fill="#CCCCCC" >
|
|
42
|
+
</rect>
|
|
43
|
+
<rect x="34.5" y="121.5" width="112" height="6" fill="#CCCCCC" >
|
|
44
|
+
</rect>
|
|
45
|
+
<rect x="34.5" y="165.5" width="112" height="6" fill="#CCCCCC" >
|
|
46
|
+
</rect>
|
|
47
|
+
<rect x="34.5" y="209.5" width="99" height="6" fill="#CCCCCC" >
|
|
48
|
+
</rect>
|
|
49
|
+
<defs>
|
|
50
|
+
<filter id="filter_123_81" x="0" y="0" width="181" height="247" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
51
|
+
<feFlood flood-opacity="0" result="feFloodId_123_81"/>
|
|
52
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha_123_81"/>
|
|
53
|
+
<feOffset dx="0" dy="0"/>
|
|
54
|
+
<feGaussianBlur stdDeviation="5"/>
|
|
55
|
+
<feComposite in2="hardAlpha_123_81" operator="out"/>
|
|
56
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/>
|
|
57
|
+
<feBlend mode="normal" in2="feFloodId_123_81" result="dropShadow_1_123_81"/>
|
|
58
|
+
<feBlend mode="normal" in="SourceGraphic" in2="dropShadow_1_123_81" result="shape_123_81"/>
|
|
59
|
+
</filter>
|
|
60
|
+
</defs>
|
|
61
|
+
</svg>
|
|
62
|
+
</template>
|
|
63
|
+
|
|
64
|
+
<style scoped>
|
|
65
|
+
|
|
66
|
+
</style>
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
<script>
|
|
2
|
+
export default {
|
|
3
|
+
name: "margin-wide"
|
|
4
|
+
}
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<template>
|
|
8
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="181" height="247" viewBox="0 0 181 247" fill="none">
|
|
9
|
+
<g filter="url(#filter_123_84)">
|
|
10
|
+
<rect x="10.5" y="10.5" width="160" height="226" rx="2" fill="#FFFFFF" >
|
|
11
|
+
</rect>
|
|
12
|
+
<path fill="rgba(204, 204, 204, 0.7)" d="M12.5 10L168.5 10C169.881 10 171 11.1193 171 12.5L171 234.5C171 235.881 169.881 237 168.5 237L12.5 237C11.1193 237 10 235.881 10 234.5L10 12.5C10 11.1193 11.1193 10 12.5 10ZM12.5 11C11.6716 11 11 11.6716 11 12.5L11 234.5C11 235.328 11.6716 236 12.5 236L168.5 236C169.328 236 170 235.328 170 234.5L170 12.5C170 11.6716 169.328 11 168.5 11L12.5 11Z">
|
|
13
|
+
</path>
|
|
14
|
+
</g>
|
|
15
|
+
<rect x="71.5" y="35.5" width="38" height="9.999999999999998" fill="#CCCCCC" >
|
|
16
|
+
</rect>
|
|
17
|
+
<rect x="56.736572265625" y="50.5" width="74.96000000000001" height="6" fill="#CCCCCC" >
|
|
18
|
+
</rect>
|
|
19
|
+
<rect x="48.5" y="94.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
20
|
+
</rect>
|
|
21
|
+
<rect x="48.5" y="138.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
22
|
+
</rect>
|
|
23
|
+
<rect x="48.5" y="182.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
24
|
+
</rect>
|
|
25
|
+
<rect x="48.5" y="72.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
26
|
+
</rect>
|
|
27
|
+
<rect x="48.5" y="116.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
28
|
+
</rect>
|
|
29
|
+
<rect x="48.5" y="160.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
30
|
+
</rect>
|
|
31
|
+
<rect x="48.5" y="204.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
32
|
+
</rect>
|
|
33
|
+
<rect x="48.5" y="61.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
34
|
+
</rect>
|
|
35
|
+
<rect x="48.5" y="105.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
36
|
+
</rect>
|
|
37
|
+
<rect x="48.5" y="149.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
38
|
+
</rect>
|
|
39
|
+
<rect x="48.5" y="193.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
40
|
+
</rect>
|
|
41
|
+
<rect x="48.5" y="83.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
42
|
+
</rect>
|
|
43
|
+
<rect x="48.5" y="127.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
44
|
+
</rect>
|
|
45
|
+
<rect x="48.5" y="171.5" width="83.2" height="6" fill="#CCCCCC" >
|
|
46
|
+
</rect>
|
|
47
|
+
<rect x="48.5" y="215.5" width="74" height="6" fill="#CCCCCC" >
|
|
48
|
+
</rect>
|
|
49
|
+
<defs>
|
|
50
|
+
<filter id="filter_123_84" x="0" y="0" width="181" height="247" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
|
51
|
+
<feFlood flood-opacity="0" result="feFloodId_123_84"/>
|
|
52
|
+
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha_123_84"/>
|
|
53
|
+
<feOffset dx="0" dy="0"/>
|
|
54
|
+
<feGaussianBlur stdDeviation="5"/>
|
|
55
|
+
<feComposite in2="hardAlpha_123_84" operator="out"/>
|
|
56
|
+
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/>
|
|
57
|
+
<feBlend mode="normal" in2="feFloodId_123_84" result="dropShadow_1_123_84"/>
|
|
58
|
+
<feBlend mode="normal" in="SourceGraphic" in2="dropShadow_1_123_84" result="shape_123_84"/>
|
|
59
|
+
</filter>
|
|
60
|
+
</defs>
|
|
61
|
+
</svg>
|
|
62
|
+
</template>
|
|
63
|
+
|
|
64
|
+
<style scoped>
|
|
65
|
+
|
|
66
|
+
</style>
|