@jx3box/jx3box-editor 2.0.5 → 2.0.7
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/BoxResource.vue +11 -15
- package/src/components/Letter.vue +3 -11
package/package.json
CHANGED
package/src/BoxResource.vue
CHANGED
|
@@ -361,9 +361,9 @@ export default {
|
|
|
361
361
|
selectLetter(o) {
|
|
362
362
|
this.resetItems();
|
|
363
363
|
o.isSelected = true;
|
|
364
|
-
const { slug, style } = o;
|
|
365
|
-
const titleHtml = `<div class="e-letter-title letter-title--${slug}"
|
|
366
|
-
const contentHtml = `<div class="e-letter-content letter-
|
|
364
|
+
const { slug, style, remark } = o;
|
|
365
|
+
const titleHtml = `<div class="e-letter-title letter-title--${slug}">${remark}</div>`;
|
|
366
|
+
const contentHtml = `<div class="e-letter-content letter-body--${slug}"><div class="u-letter-content--header letter-header--${slug}"><div class="u-letter-content--footer letter-footer--${slug}"><p>~ 魔盒真好玩，魔盒真好用 ~</p></div></div></div>`;
|
|
367
367
|
this.html = `<div class="e-letter letter--${slug}">${titleHtml}<br/> ${contentHtml}</div></div><style>${style}</style>`;
|
|
368
368
|
},
|
|
369
369
|
resetItems: function () {
|
|
@@ -421,19 +421,9 @@ export default {
|
|
|
421
421
|
.m-letter {
|
|
422
422
|
.pointer;
|
|
423
423
|
.pr;
|
|
424
|
+
.size(20%,80px);
|
|
424
425
|
box-sizing: border-box;
|
|
425
426
|
border: 3px solid transparent;
|
|
426
|
-
&::after {
|
|
427
|
-
content: "";
|
|
428
|
-
display: block;
|
|
429
|
-
.full;
|
|
430
|
-
.pa;
|
|
431
|
-
.lt(0);
|
|
432
|
-
.z(1);
|
|
433
|
-
.tm(0.3);
|
|
434
|
-
.r(3px);
|
|
435
|
-
background: #000;
|
|
436
|
-
}
|
|
437
427
|
&.active {
|
|
438
428
|
.r(5px);
|
|
439
429
|
border: 3px solid #409eff;
|
|
@@ -442,7 +432,13 @@ export default {
|
|
|
442
432
|
}
|
|
443
433
|
}
|
|
444
434
|
.e-letter {
|
|
445
|
-
|
|
435
|
+
.w(100%);
|
|
436
|
+
.e-letter-title {
|
|
437
|
+
.w(100%);
|
|
438
|
+
}
|
|
439
|
+
.e-letter-content {
|
|
440
|
+
.none;
|
|
441
|
+
}
|
|
446
442
|
}
|
|
447
443
|
}
|
|
448
444
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
<script>
|
|
6
6
|
export default {
|
|
7
|
-
name: "Letter",
|
|
7
|
+
name: "Letter",
|
|
8
8
|
props: {
|
|
9
9
|
data: {
|
|
10
10
|
type: Object,
|
|
@@ -20,18 +20,10 @@ export default {
|
|
|
20
20
|
data: {
|
|
21
21
|
immediate: true,
|
|
22
22
|
deep: true,
|
|
23
|
-
handler(
|
|
24
|
-
this.html =
|
|
23
|
+
handler({ slug, style, remark }) {
|
|
24
|
+
this.html = `<div class="e-letter letter--${slug}"><div class="e-letter-title letter-title--${slug}">${remark}</div></div><style>${style}</style>`;
|
|
25
25
|
},
|
|
26
26
|
},
|
|
27
27
|
},
|
|
28
|
-
methods: {
|
|
29
|
-
// 默认html
|
|
30
|
-
htmlDemo({ slug, style }) {
|
|
31
|
-
const titleHtml = `<div class="e-letter-title letter-title--${slug}">我是标题</div>`;
|
|
32
|
-
const contentHtml = `<div class="e-letter-content letter-body--${slug}"><div class="u-letter-content--header letter-header--${slug}"><div class="u-letter-content--footer letter-footer--${slug}"><p contenteditable="true">明月几时有，把酒问青天。</p></div></div></div>`;
|
|
33
|
-
return `<div class="e-letter letter--${slug}">${titleHtml}<br/> ${contentHtml}</div></div><style>${style}</style>`;
|
|
34
|
-
},
|
|
35
|
-
},
|
|
36
28
|
};
|
|
37
29
|
</script>
|