@jx3box/jx3box-editor 2.2.47 → 3.0.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/config/global.js +79 -0
- package/config/global.less +16 -0
- package/index.js +21 -8
- package/package.json +64 -63
- package/readme.md +25 -99
- package/src/Article.vue +96 -57
- package/src/ArticleMarkdown.vue +54 -47
- package/src/BoxResource.vue +67 -42
- package/src/Buff.vue +18 -7
- package/src/GameText.vue +32 -45
- package/src/Item.vue +143 -235
- package/src/ItemSimple.vue +27 -37
- package/src/Markdown.vue +362 -210
- package/src/Npc.vue +51 -30
- package/src/Resource.vue +296 -252
- package/src/Skill.vue +36 -26
- package/src/Tinymce.vue +162 -126
- package/src/Upload.vue +238 -155
- package/src/UploadAlbum.vue +189 -118
- package/{assets → src/assets}/css/article.less +1 -0
- package/src/assets/css/markdown.less +4 -0
- package/{assets → src/assets}/css/module/author.less +4 -3
- package/{assets → src/assets}/css/module/directory.less +23 -32
- package/{assets → src/assets}/css/module/talent.less +2 -2
- package/{assets → src/assets}/css/resource.less +56 -22
- package/src/assets/css/tinymce/_.less +28 -0
- package/src/assets/css/tinymce/a.less +21 -0
- package/{assets → src/assets}/css/tinymce/code.less +1 -1
- package/{assets/css → src/assets/css/tinymce}/combo.less +123 -18
- package/{assets → src/assets}/css/tinymce/fold.less +3 -6
- package/src/assets/css/tinymce/h.less +90 -0
- package/{assets → src/assets}/css/tinymce/latex.less +14 -14
- package/{assets → src/assets}/css/tinymce/macro.less +3 -3
- package/{assets → src/assets}/css/tinymce/pz.less +2 -2
- package/{assets → src/assets}/css/tinymce/table.less +5 -10
- package/{assets → src/assets}/css/tinymce.less +8 -4
- package/src/assets/css/upload.less +195 -0
- package/src/assets/css/upload_album.less +164 -0
- package/src/assets/css/var.less +2 -0
- package/src/assets/img/other/qr-code.svg +1 -0
- package/{assets → src/assets}/js/audio.js +2 -2
- package/{assets → src/assets}/js/directory.js +51 -23
- package/src/assets/js/hljs_languages.js +177 -0
- package/src/assets/js/katex.js +211 -0
- package/src/assets/js/renderImgPreview.js +49 -0
- package/{assets → src/assets}/js/xss.js +48 -5
- package/src/components/Author.vue +32 -13
- package/src/components/Avatar.vue +22 -3
- package/src/components/Combo.vue +118 -72
- package/src/components/PostAuthor.vue +13 -11
- package/src/components/QRcode.vue +136 -0
- package/src/components/SkillMartial.vue +13 -12
- package/src/pages/article.js +14 -0
- package/src/pages/index.js +5 -0
- package/src/pages/markdown.js +14 -0
- package/src/pages/tinymce.js +49 -0
- package/src/pages/upload.js +14 -0
- package/{service → src/service}/author.js +2 -2
- package/{service → src/service}/cms.js +5 -3
- package/{service → src/service}/database.js +4 -2
- package/{service → src/service}/item.js +1 -1
- package/{service → src/service}/node.js +1 -1
- package/{service → src/service}/resource.js +1 -1
- package/src/views/article.vue +72 -0
- package/src/views/index.vue +11 -0
- package/src/views/markdown.vue +58 -0
- package/src/views/tinymce.vue +58 -0
- package/src/views/upload.vue +111 -0
- package/.env +0 -2
- package/.vscode/settings.json +0 -5
- package/assets/css/katex-fix.css +0 -20
- package/assets/css/tinymce/_.less +0 -30
- package/assets/css/tinymce/a.less +0 -30
- package/assets/css/tinymce/combo.less +0 -111
- package/assets/css/tinymce/h.less +0 -58
- package/assets/css/upload.less +0 -105
- package/assets/js/katex.js +0 -191
- package/assets/js/renderImgPreview.js +0 -25
- package/babel.config.js +0 -3
- package/docs/markdown.md +0 -16
- package/jsconfig.json +0 -9
- package/public/article.html +0 -15
- package/public/css/article.css +0 -2481
- package/public/css/article.less +0 -3
- package/public/favicon.ico +0 -0
- package/public/tinymce.html +0 -33
- package/src/Equip.vue +0 -301
- package/src/components/LetterDemo.vue +0 -93
- package/src/components/medal.vue +0 -43
- package/test-audio.html +0 -121
- package/vue.config.js +0 -147
- /package/{assets → src/assets}/css/markdown/_.less +0 -0
- /package/{assets → src/assets}/css/markdown/macro.less +0 -0
- /package/{assets/css/article_markdown.less → src/assets/css/markdown/markdown-article.less} +0 -0
- /package/{assets/css/markdown.less → src/assets/css/markdown/markdown-editor.less} +0 -0
- /package/{assets → src/assets}/css/markdown/talent.less +0 -0
- /package/{assets → src/assets}/css/markdown/video.less +0 -0
- /package/{assets → src/assets}/css/module/buff.less +0 -0
- /package/{assets → src/assets}/css/module/icon.less +0 -0
- /package/{assets → src/assets}/css/module/item.less +0 -0
- /package/{assets → src/assets}/css/module/item_simple.less +0 -0
- /package/{assets → src/assets}/css/module/jx3_element.less +0 -0
- /package/{assets → src/assets}/css/module/macro.less +0 -0
- /package/{assets → src/assets}/css/module/npc.less +0 -0
- /package/{assets → src/assets}/css/module/resource.less +0 -0
- /package/{assets → src/assets}/css/module/skill.less +0 -0
- /package/{assets → src/assets}/css/tinymce/hr.less +0 -0
- /package/{assets → src/assets}/css/tinymce/img.less +0 -0
- /package/{assets → src/assets}/css/tinymce/imgpreview.less +0 -0
- /package/{assets → src/assets}/css/tinymce/list.less +0 -0
- /package/{assets → src/assets}/css/tinymce/nextpage.less +0 -0
- /package/{assets → src/assets}/css/tinymce/p.less +0 -0
- /package/{assets → src/assets}/css/tinymce/plugin.less +0 -0
- /package/{assets → src/assets}/css/tinymce/qixue.less +0 -0
- /package/{assets → src/assets}/css/tinymce/quote.less +0 -0
- /package/{assets → src/assets}/css/tinymce/video.less +0 -0
- /package/{assets → src/assets}/css/tinymce/voice.less +0 -0
- /package/{assets → src/assets}/data/detach_type.json +0 -0
- /package/{assets → src/assets}/data/game_font.json +0 -0
- /package/{assets → src/assets}/data/markdown_whitelist.json +0 -0
- /package/{assets → src/assets}/data/weapon_type.json +0 -0
- /package/{assets → src/assets}/img/buff.svg +0 -0
- /package/{assets → src/assets}/img/equip_bg.png +0 -0
- /package/{assets → src/assets}/img/file.svg +0 -0
- /package/{assets → src/assets}/img/icons.svg +0 -0
- /package/{assets → src/assets}/img/item/pve.png +0 -0
- /package/{assets → src/assets}/img/item/pvp.png +0 -0
- /package/{assets → src/assets}/img/item/pvx.png +0 -0
- /package/{assets → src/assets}/img/item/std.png +0 -0
- /package/{assets → src/assets}/img/item/wujie.png +0 -0
- /package/{assets → src/assets}/img/item.svg +0 -0
- /package/{assets → src/assets}/img/jx3.svg +0 -0
- /package/{assets → src/assets}/img/jx3box.svg +0 -0
- /package/{assets → src/assets}/img/npc/attack.svg +0 -0
- /package/{assets → src/assets}/img/npc/buff.svg +0 -0
- /package/{assets → src/assets}/img/npc/energy.svg +0 -0
- /package/{assets → src/assets}/img/npc/miss.svg +0 -0
- /package/{assets → src/assets}/img/npc/npc.svg +0 -0
- /package/{assets → src/assets}/img/npc/radar.svg +0 -0
- /package/{assets → src/assets}/img/npc/shield.svg +0 -0
- /package/{assets → src/assets}/img/npc/sight.svg +0 -0
- /package/{assets → src/assets}/img/npc/skull.svg +0 -0
- /package/{assets → src/assets}/img/npc/target.svg +0 -0
- /package/{assets → src/assets}/img/skill.svg +0 -0
- /package/{assets → src/assets}/img/skillset.png +0 -0
- /package/{assets → src/assets}/js/a.js +0 -0
- /package/{assets → src/assets}/js/code.js +0 -0
- /package/{assets → src/assets}/js/combo.js +0 -0
- /package/{assets → src/assets}/js/drag.js +0 -0
- /package/{assets → src/assets}/js/filter2.js +0 -0
- /package/{assets → src/assets}/js/fold.js +0 -0
- /package/{assets → src/assets}/js/gallery.js +0 -0
- /package/{assets → src/assets}/js/iframe.js +0 -0
- /package/{assets → src/assets}/js/img.js +0 -0
- /package/{assets → src/assets}/js/item/attribute_percent.js +0 -0
- /package/{assets → src/assets}/js/item/bind.js +0 -0
- /package/{assets → src/assets}/js/item/border.js +0 -0
- /package/{assets → src/assets}/js/item/border_quest.js +0 -0
- /package/{assets → src/assets}/js/item/color.js +0 -0
- /package/{assets → src/assets}/js/item/hljs_languages.js +0 -0
- /package/{assets → src/assets}/js/item/icon_url.js +0 -0
- /package/{assets → src/assets}/js/item/second_format.js +0 -0
- /package/{assets → src/assets}/js/jx3_element.js +0 -0
- /package/{assets → src/assets}/js/macro.js +0 -0
- /package/{assets → src/assets}/js/nextpage.js +0 -0
- /package/{assets → src/assets}/js/pswp.js +0 -0
- /package/{assets → src/assets}/js/pswp_template.js +0 -0
- /package/{assets → src/assets}/js/pz_iframe.js +0 -0
- /package/{assets → src/assets}/js/qixue.js +0 -0
- /package/{assets → src/assets}/js/script.js +0 -0
- /package/{assets → src/assets}/js/talent2.js +0 -0
- /package/{assets → src/assets}/js/tex-mml-chtml.js +0 -0
- /package/{service → src/service}/enum/CollectionPublic.js +0 -0
- /package/{service → src/service}/enum/EquipPosition.js +0 -0
- /package/{service → src/service}/enum/EquipType.js +0 -0
package/public/css/article.less
DELETED
package/public/favicon.ico
DELETED
|
Binary file
|
package/public/tinymce.html
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="zh-CN">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8" />
|
|
5
|
-
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
|
6
|
-
<meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
|
7
|
-
<meta name="renderer" content="webkit" />
|
|
8
|
-
<title><%= htmlWebpackPlugin.options.title %></title>
|
|
9
|
-
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
|
10
|
-
<script>
|
|
11
|
-
window.RX_TINYMCE_ROOT = "https://cdn.jx3box.com/static/tinymce";
|
|
12
|
-
// window.RX_TINYMCE_ROOT = "http://localhost:3000";
|
|
13
|
-
</script>
|
|
14
|
-
<script src="https://cdn.jx3box.com/static/tinymce/tinymce.min.js?v=1.9.0"></script>
|
|
15
|
-
<!-- TODO: -->
|
|
16
|
-
<!-- <script src="http://localhost:3000/tinymce.min.js?v=1.9.0"></script> -->
|
|
17
|
-
</head>
|
|
18
|
-
<body>
|
|
19
|
-
<div id="app"></div>
|
|
20
|
-
<div id="c-ie-tips" style="display: none; background-color: #fef0f0; color: #f56c6c; padding: 10px; font-weight: bold; text-align: center; width: 60%; margin: 200px auto">
|
|
21
|
-
<p>你的浏览器版本太低,可能无法正常使用本站,建议下载<a href="https://www.google.cn/intl/zh-CN/chrome/" target="_blank">Chrome</a>或其它极速浏览器</p>
|
|
22
|
-
<p>www.jx3box.com</p>
|
|
23
|
-
</div>
|
|
24
|
-
<script>
|
|
25
|
-
let ua = window.navigator.userAgent.toLocaleLowerCase();
|
|
26
|
-
let isIE = ua.indexOf("trident") > 0 || ua.indexOf("msie") > 0;
|
|
27
|
-
if (isIE) document.getElementById("c-ie-tips").style.display = "block";
|
|
28
|
-
</script>
|
|
29
|
-
<div style="display: none">
|
|
30
|
-
<script type="text/javascript" src="https://s9.cnzz.com/z_stat.php?id=1277938200&web_id=1277938200"></script>
|
|
31
|
-
</div>
|
|
32
|
-
</body>
|
|
33
|
-
</html>
|
package/src/Equip.vue
DELETED
|
@@ -1,301 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="c-equip" v-if="plan">
|
|
3
|
-
<div
|
|
4
|
-
class="u-equip"
|
|
5
|
-
:class="'u-equip-' + label"
|
|
6
|
-
v-for="(item, label) in equip"
|
|
7
|
-
:key="label"
|
|
8
|
-
>
|
|
9
|
-
<jx3-item-simple
|
|
10
|
-
:item="item"
|
|
11
|
-
:onlyIcon="true"
|
|
12
|
-
iconSize="56px"
|
|
13
|
-
:withName="true"
|
|
14
|
-
/>
|
|
15
|
-
</div>
|
|
16
|
-
<div class="u-info">
|
|
17
|
-
<div class="u-title">{{ plan.title }}</div>
|
|
18
|
-
<a class="u-author" :href="userpage" target="_blank">
|
|
19
|
-
<img :src="avatar" class="u-author-avatar" />
|
|
20
|
-
<span class="u-author-name">{{ plan.user_nickname }}</span>
|
|
21
|
-
</a>
|
|
22
|
-
<div class="u-time">
|
|
23
|
-
<i class="el-icon-date"></i>
|
|
24
|
-
{{ (plan.updated * 1000) | showTime }}
|
|
25
|
-
</div>
|
|
26
|
-
<div class="u-desc">{{ plan.description }}</div>
|
|
27
|
-
<div class="u-qrcodebox">
|
|
28
|
-
<QRcode :href="link" :s="120" v="static" />
|
|
29
|
-
</div>
|
|
30
|
-
</div>
|
|
31
|
-
<div class="u-misc">
|
|
32
|
-
<a class="u-logo" :href="link" target="_blank">
|
|
33
|
-
<img svg-inline src="../assets/img/jx3box.svg" />
|
|
34
|
-
<span>配装ID:{{ plan.id }}</span>
|
|
35
|
-
</a>
|
|
36
|
-
</div>
|
|
37
|
-
</div>
|
|
38
|
-
</template>
|
|
39
|
-
|
|
40
|
-
<script>
|
|
41
|
-
import EquipPosition from "../service/enum/EquipPosition";
|
|
42
|
-
import ItemSimple from "./ItemSimple";
|
|
43
|
-
import { authorLink } from "@jx3box/jx3box-common/js/utils";
|
|
44
|
-
import QRcode from "@jx3box/jx3box-common-ui/src/interact/QRcode.vue";
|
|
45
|
-
import { showTime } from "@jx3box/jx3box-common/js/moment.js";
|
|
46
|
-
import { get_plan } from "../service/item.js";
|
|
47
|
-
import { __Root } from "@jx3box/jx3box-common/data/jx3box.json";
|
|
48
|
-
export default {
|
|
49
|
-
props: ["data", "id"],
|
|
50
|
-
data: function() {
|
|
51
|
-
return {
|
|
52
|
-
plan_data: "",
|
|
53
|
-
};
|
|
54
|
-
},
|
|
55
|
-
computed: {
|
|
56
|
-
plan: function() {
|
|
57
|
-
return this.id ? this.plan_data : this.data;
|
|
58
|
-
},
|
|
59
|
-
equip: function() {
|
|
60
|
-
return {
|
|
61
|
-
weapon_1: this.plan.relation_items[
|
|
62
|
-
EquipPosition.MELEE_WEAPON
|
|
63
|
-
][0],
|
|
64
|
-
weapon_2: this.plan.relation_items[
|
|
65
|
-
EquipPosition.RANGE_WEAPON
|
|
66
|
-
][0],
|
|
67
|
-
cap: this.plan.relation_items[EquipPosition.HELM][0],
|
|
68
|
-
cloth: this.plan.relation_items[EquipPosition.CHEST][0],
|
|
69
|
-
belt: this.plan.relation_items[EquipPosition.WAIST][0],
|
|
70
|
-
wrist: this.plan.relation_items[EquipPosition.BANGLE][0],
|
|
71
|
-
trousers: this.plan.relation_items[EquipPosition.PANTS][0],
|
|
72
|
-
shoes: this.plan.relation_items[EquipPosition.BOOTS][0],
|
|
73
|
-
necklace: this.plan.relation_items[EquipPosition.AMULET][0],
|
|
74
|
-
pendant: this.plan.relation_items[EquipPosition.PENDANT][0],
|
|
75
|
-
ring_1: this.plan.relation_items[EquipPosition.RING_1][0],
|
|
76
|
-
ring_2: this.plan.relation_items[EquipPosition.RING_2][0],
|
|
77
|
-
};
|
|
78
|
-
},
|
|
79
|
-
avatar: function() {
|
|
80
|
-
return this.plan ? this.plan.user_avatar : "";
|
|
81
|
-
},
|
|
82
|
-
username: function() {
|
|
83
|
-
return this.plan ? this.plan.user_nickname : "";
|
|
84
|
-
},
|
|
85
|
-
uid: function() {
|
|
86
|
-
return this.plan ? this.plan.user_id : "";
|
|
87
|
-
},
|
|
88
|
-
userpage: function() {
|
|
89
|
-
return this.uid ? authorLink(this.uid) : "";
|
|
90
|
-
},
|
|
91
|
-
link: function() {
|
|
92
|
-
return this.plan ? __Root + `item/#/plan_view/${this.plan.id}` : "";
|
|
93
|
-
},
|
|
94
|
-
},
|
|
95
|
-
methods: {},
|
|
96
|
-
filters: {
|
|
97
|
-
showTime,
|
|
98
|
-
},
|
|
99
|
-
mounted: function() {
|
|
100
|
-
if (this.id) {
|
|
101
|
-
get_plan(this.id).then((res) => {
|
|
102
|
-
this.plan_data = res.data.data;
|
|
103
|
-
});
|
|
104
|
-
}
|
|
105
|
-
},
|
|
106
|
-
components: {
|
|
107
|
-
"jx3-item-simple": ItemSimple,
|
|
108
|
-
QRcode,
|
|
109
|
-
},
|
|
110
|
-
};
|
|
111
|
-
</script>
|
|
112
|
-
|
|
113
|
-
<style lang="less">
|
|
114
|
-
.c-equip {
|
|
115
|
-
.dbi;
|
|
116
|
-
.size(500px, 750px);
|
|
117
|
-
// background:url('../assets/img/equip_bg.png') no-repeat 0 0;
|
|
118
|
-
// background-color:#324f4a;
|
|
119
|
-
// background-color:#fff;
|
|
120
|
-
// border:6px solid #f5f7fa;
|
|
121
|
-
background-color: @bg-black;
|
|
122
|
-
border: 6px solid #444;
|
|
123
|
-
.r(6px);
|
|
124
|
-
|
|
125
|
-
.u-info {
|
|
126
|
-
.mt(20px);
|
|
127
|
-
.w(280px);
|
|
128
|
-
.auto(x);
|
|
129
|
-
.x;
|
|
130
|
-
}
|
|
131
|
-
.u-title {
|
|
132
|
-
.nobreak;
|
|
133
|
-
.fz(1rem, 2);
|
|
134
|
-
.bold;
|
|
135
|
-
color: #fff;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
.u-author {
|
|
139
|
-
// .pa;.lt(50%);
|
|
140
|
-
// transform: translate3d(-50%,-50%,0);
|
|
141
|
-
img {
|
|
142
|
-
.r(2px);
|
|
143
|
-
.size(20px);
|
|
144
|
-
.y;
|
|
145
|
-
}
|
|
146
|
-
img {
|
|
147
|
-
.mr(5px);
|
|
148
|
-
}
|
|
149
|
-
span {
|
|
150
|
-
.fz(13px, 2.5);
|
|
151
|
-
color: #ccc;
|
|
152
|
-
}
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
.u-desc {
|
|
156
|
-
.mt(10px);
|
|
157
|
-
color: #ccc;
|
|
158
|
-
font-size: 13px;
|
|
159
|
-
line-height: 1.8;
|
|
160
|
-
.break(10);
|
|
161
|
-
.h(240px);
|
|
162
|
-
white-space: pre-wrap;
|
|
163
|
-
text-align: left;
|
|
164
|
-
background: #2b2e31;
|
|
165
|
-
padding: 10px;
|
|
166
|
-
box-sizing: border-box;
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
.u-time {
|
|
170
|
-
// .x(right);
|
|
171
|
-
color: #999;
|
|
172
|
-
.fz(12px);
|
|
173
|
-
// .mt(5px);
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
.u-qrcodebox {
|
|
177
|
-
.mt(60px);
|
|
178
|
-
.w(140px);
|
|
179
|
-
.auto(x);
|
|
180
|
-
|
|
181
|
-
.w-qrcode-static {
|
|
182
|
-
.u-txt {
|
|
183
|
-
.mt(10px);
|
|
184
|
-
color: #999;
|
|
185
|
-
.fz(12px, 16px);
|
|
186
|
-
}
|
|
187
|
-
svg {
|
|
188
|
-
fill: #999;
|
|
189
|
-
.size(16px);
|
|
190
|
-
.y(-4px);
|
|
191
|
-
}
|
|
192
|
-
.u-pic {
|
|
193
|
-
padding: 10px 8px 8px 8px;
|
|
194
|
-
border-radius: 2px;
|
|
195
|
-
}
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
.pr;
|
|
200
|
-
.u-equip {
|
|
201
|
-
.pa;
|
|
202
|
-
.u-name {
|
|
203
|
-
.none;
|
|
204
|
-
}
|
|
205
|
-
.u-uiid {
|
|
206
|
-
.none;
|
|
207
|
-
}
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
.u-equip-weapon_1 {
|
|
211
|
-
.lt(170px, 630px);
|
|
212
|
-
}
|
|
213
|
-
.u-equip-weapon_2 {
|
|
214
|
-
.lt(240px, 630px);
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
.u-equip-cap {
|
|
218
|
-
.lt(12px, 90px);
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
.u-equip-cloth {
|
|
222
|
-
.lt(12px, 270px);
|
|
223
|
-
}
|
|
224
|
-
|
|
225
|
-
.u-equip-belt {
|
|
226
|
-
.lt(12px, 450px);
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
.u-equip-wrist {
|
|
230
|
-
.lt(400px, 90px);
|
|
231
|
-
}
|
|
232
|
-
|
|
233
|
-
.u-equip-trousers {
|
|
234
|
-
.lt(400px, 180px);
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
.u-equip-shoes {
|
|
238
|
-
.lt(400px, 270px);
|
|
239
|
-
}
|
|
240
|
-
|
|
241
|
-
.u-equip-necklace {
|
|
242
|
-
.lt(400px, 360px);
|
|
243
|
-
}
|
|
244
|
-
|
|
245
|
-
.u-equip-pendant {
|
|
246
|
-
.lt(400px, 450px);
|
|
247
|
-
}
|
|
248
|
-
|
|
249
|
-
.u-equip-ring_1 {
|
|
250
|
-
.lt(400px, 540px);
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
.u-equip-ring_2 {
|
|
254
|
-
.lt(400px, 630px);
|
|
255
|
-
}
|
|
256
|
-
|
|
257
|
-
.u-misc {
|
|
258
|
-
.pa;
|
|
259
|
-
.lt(30px, 630px);
|
|
260
|
-
}
|
|
261
|
-
|
|
262
|
-
.u-logo {
|
|
263
|
-
.db;
|
|
264
|
-
svg,
|
|
265
|
-
span {
|
|
266
|
-
transition: 0.2s ease-in-out;
|
|
267
|
-
}
|
|
268
|
-
svg {
|
|
269
|
-
.size(56px);
|
|
270
|
-
fill: #fff;
|
|
271
|
-
}
|
|
272
|
-
span {
|
|
273
|
-
.db;
|
|
274
|
-
color: #fff;
|
|
275
|
-
font-family: Consolas;
|
|
276
|
-
.fz(12px);
|
|
277
|
-
// .bold;
|
|
278
|
-
}
|
|
279
|
-
&:hover {
|
|
280
|
-
span {
|
|
281
|
-
color: #0cf;
|
|
282
|
-
}
|
|
283
|
-
svg {
|
|
284
|
-
fill: #0cf;
|
|
285
|
-
}
|
|
286
|
-
}
|
|
287
|
-
}
|
|
288
|
-
|
|
289
|
-
.u-meta {
|
|
290
|
-
// .mt(5px);
|
|
291
|
-
.fz(12px);
|
|
292
|
-
.db;
|
|
293
|
-
// color:#1bbfe0;
|
|
294
|
-
color: #fff;
|
|
295
|
-
// &:hover{
|
|
296
|
-
// color:#ff0;
|
|
297
|
-
// }
|
|
298
|
-
// .pa;.lb(20px,20px);
|
|
299
|
-
}
|
|
300
|
-
}
|
|
301
|
-
</style>
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="c-letter-paper">
|
|
3
|
-
<div
|
|
4
|
-
:class="`c-letter-title c-letter-title__${data.slug}`"
|
|
5
|
-
:style="{
|
|
6
|
-
backgroundImage: `url(${data.img_title || ''})`,
|
|
7
|
-
backgroundRepeat: 'no-repeat',
|
|
8
|
-
backgroundSize: 'cover',
|
|
9
|
-
}"
|
|
10
|
-
>
|
|
11
|
-
我是抬头
|
|
12
|
-
</div>
|
|
13
|
-
<div
|
|
14
|
-
:class="`c-letter-content c-letter-content__${data.slug}`"
|
|
15
|
-
:style="{
|
|
16
|
-
backgroundImage: `url(${data.img_body || ''})`,
|
|
17
|
-
}"
|
|
18
|
-
>
|
|
19
|
-
<div
|
|
20
|
-
class="u-header"
|
|
21
|
-
:style="{
|
|
22
|
-
backgroundImage: `url(${data.img_header || ''})`,
|
|
23
|
-
backgroundRepeat: 'no-repeat',
|
|
24
|
-
backgroundPosition: 'top center',
|
|
25
|
-
}"
|
|
26
|
-
>
|
|
27
|
-
<div
|
|
28
|
-
class="u-footer"
|
|
29
|
-
:style="{
|
|
30
|
-
backgroundImage: `url(${data.img_footer || ''})`,
|
|
31
|
-
backgroundRepeat: 'no-repeat',
|
|
32
|
-
backgroundPosition: 'bottom center',
|
|
33
|
-
}"
|
|
34
|
-
>
|
|
35
|
-
<p v-for="o in 4" :key="o">明月几时有,把酒问青天。</p>
|
|
36
|
-
</div>
|
|
37
|
-
</div>
|
|
38
|
-
</div>
|
|
39
|
-
</div>
|
|
40
|
-
</template>
|
|
41
|
-
|
|
42
|
-
<script>
|
|
43
|
-
export default {
|
|
44
|
-
name: "letter-demo",
|
|
45
|
-
props: {
|
|
46
|
-
data: {
|
|
47
|
-
type: Object,
|
|
48
|
-
default: () => {},
|
|
49
|
-
},
|
|
50
|
-
},
|
|
51
|
-
data() {
|
|
52
|
-
return {
|
|
53
|
-
styleTag: null,
|
|
54
|
-
};
|
|
55
|
-
},
|
|
56
|
-
watch: {
|
|
57
|
-
"data.style": {
|
|
58
|
-
immediate: true,
|
|
59
|
-
handler(val) {
|
|
60
|
-
this.insertStyle(val);
|
|
61
|
-
},
|
|
62
|
-
},
|
|
63
|
-
},
|
|
64
|
-
methods: {
|
|
65
|
-
insertStyle(style) {
|
|
66
|
-
if (this.styleTag) {
|
|
67
|
-
document.body.removeChild(this.styleTag);
|
|
68
|
-
}
|
|
69
|
-
this.styleTag = document.createElement("style");
|
|
70
|
-
this.styleTag.textContent = style;
|
|
71
|
-
document.body.appendChild(this.styleTag);
|
|
72
|
-
},
|
|
73
|
-
},
|
|
74
|
-
};
|
|
75
|
-
</script>
|
|
76
|
-
<style lang="less">
|
|
77
|
-
.c-letter-title {
|
|
78
|
-
background-size: cover;
|
|
79
|
-
}
|
|
80
|
-
.c-letter-content {
|
|
81
|
-
margin-top: 20px;
|
|
82
|
-
background-repeat: repeat-y;
|
|
83
|
-
background-size: contain;
|
|
84
|
-
}
|
|
85
|
-
.c-letter-content .u-header,
|
|
86
|
-
.c-letter-content .u-footer {
|
|
87
|
-
background-size: contain;
|
|
88
|
-
background-repeat: no-repeat;
|
|
89
|
-
}
|
|
90
|
-
.c-letter-content .u-footer {
|
|
91
|
-
background-position: bottom;
|
|
92
|
-
}
|
|
93
|
-
</style>
|
package/src/components/medal.vue
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="m-medal">
|
|
3
|
-
<a :href="medalLink(item)" target="_blank" class="u-medal" v-for="item in medals" :key="item.id" :title="item.medal_desc">
|
|
4
|
-
<img class="u-medal-img" :src="showIcon(item.medal)">
|
|
5
|
-
</a>
|
|
6
|
-
</div>
|
|
7
|
-
</template>
|
|
8
|
-
|
|
9
|
-
<script>
|
|
10
|
-
import { getMedalLink } from '@jx3box/jx3box-common/js/utils'
|
|
11
|
-
export default {
|
|
12
|
-
name: 'author_medal',
|
|
13
|
-
props: {
|
|
14
|
-
medals: {
|
|
15
|
-
type: Array,
|
|
16
|
-
default: () => [], // [{ rank_id, medal_desc, medal }]
|
|
17
|
-
},
|
|
18
|
-
showIcon: {
|
|
19
|
-
type: Function,
|
|
20
|
-
default: () => true,
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
methods: {
|
|
24
|
-
|
|
25
|
-
medalLink({ rank_id, medal_type = 'rank' }) {
|
|
26
|
-
return getMedalLink(rank_id, medal_type)
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
</script>
|
|
31
|
-
|
|
32
|
-
<style lang="less">
|
|
33
|
-
.m-medal {
|
|
34
|
-
display: flex;
|
|
35
|
-
.u-medal {
|
|
36
|
-
cursor: pointer;
|
|
37
|
-
.u-medal-img {
|
|
38
|
-
width: 20px;
|
|
39
|
-
height: 20px;
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
</style>
|
package/test-audio.html
DELETED
|
@@ -1,121 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="zh-CN">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
-
<title>音频播放器测试</title>
|
|
7
|
-
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
8
|
-
<style>
|
|
9
|
-
body {
|
|
10
|
-
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
11
|
-
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
12
|
-
min-height: 100vh;
|
|
13
|
-
padding: 40px 20px;
|
|
14
|
-
margin: 0;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
.container {
|
|
18
|
-
max-width: 800px;
|
|
19
|
-
margin: 0 auto;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
h1 {
|
|
23
|
-
color: white;
|
|
24
|
-
text-align: center;
|
|
25
|
-
margin-bottom: 40px;
|
|
26
|
-
font-size: 32px;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.demo-section {
|
|
30
|
-
background: white;
|
|
31
|
-
border-radius: 15px;
|
|
32
|
-
padding: 30px;
|
|
33
|
-
margin-bottom: 30px;
|
|
34
|
-
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.demo-section h2 {
|
|
38
|
-
margin-top: 0;
|
|
39
|
-
color: #333;
|
|
40
|
-
border-bottom: 2px solid #9b87f5;
|
|
41
|
-
padding-bottom: 10px;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
.code-block {
|
|
45
|
-
background: #f5f5f5;
|
|
46
|
-
border-radius: 8px;
|
|
47
|
-
padding: 15px;
|
|
48
|
-
margin: 15px 0;
|
|
49
|
-
overflow-x: auto;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.code-block code {
|
|
53
|
-
font-family: "Monaco", "Courier New", monospace;
|
|
54
|
-
font-size: 14px;
|
|
55
|
-
color: #333;
|
|
56
|
-
}
|
|
57
|
-
</style>
|
|
58
|
-
</head>
|
|
59
|
-
<body>
|
|
60
|
-
<div class="container">
|
|
61
|
-
<h1>🎵 JX3 音频播放器演示</h1>
|
|
62
|
-
|
|
63
|
-
<div class="demo-section">
|
|
64
|
-
<h2>使用示例</h2>
|
|
65
|
-
<p>在文章内容中插入以下格式的文本,会自动渲染为音频播放器:</p>
|
|
66
|
-
<div class="code-block">
|
|
67
|
-
<code>name:123;author:1231;user_id:8719;src:https://cdn.jx3box.com/upload/voice/jx3cxk/2026/8719-1768912381447.mp3</code>
|
|
68
|
-
</div>
|
|
69
|
-
</div>
|
|
70
|
-
|
|
71
|
-
<div class="demo-section">
|
|
72
|
-
<h2>实际效果</h2>
|
|
73
|
-
<div class="w-audio">name:123;author:1231;user_id:8719;src:https://cdn.jx3box.com/upload/voice/jx3cxk/2026/8719-1768912381447.mp3</div>
|
|
74
|
-
</div>
|
|
75
|
-
|
|
76
|
-
<div class="demo-section">
|
|
77
|
-
<h2>功能特性</h2>
|
|
78
|
-
<ul>
|
|
79
|
-
<li>✨ 美观的紫色渐变卡片设计</li>
|
|
80
|
-
<li>🎨 旋转的黑胶唱片动画效果</li>
|
|
81
|
-
<li>🎯 可拖拽的进度条</li>
|
|
82
|
-
<li>⏯️ 播放/暂停控制</li>
|
|
83
|
-
<li>⏱️ 实时时间显示</li>
|
|
84
|
-
<li>📱 响应式设计,支持移动端</li>
|
|
85
|
-
<li>🎼 唱针动画效果</li>
|
|
86
|
-
</ul>
|
|
87
|
-
</div>
|
|
88
|
-
|
|
89
|
-
<div class="demo-section">
|
|
90
|
-
<h2>在项目中使用</h2>
|
|
91
|
-
<p><strong>1. 导入模块:</strong></p>
|
|
92
|
-
<div class="code-block">
|
|
93
|
-
<code>import renderVoice from '@/assets/js/voice.js';</code>
|
|
94
|
-
</div>
|
|
95
|
-
|
|
96
|
-
<p><strong>2. 在组件挂载后调用:</strong></p>
|
|
97
|
-
<div class="code-block">
|
|
98
|
-
<code
|
|
99
|
-
>mounted() {<br />
|
|
100
|
-
renderVoice('.w-audio');<br />
|
|
101
|
-
}</code
|
|
102
|
-
>
|
|
103
|
-
</div>
|
|
104
|
-
|
|
105
|
-
<p><strong>3. HTML 中使用:</strong></p>
|
|
106
|
-
<div class="code-block">
|
|
107
|
-
<code><div class="w-audio">name:音频名称;author:作者;user_id:123;src:音频地址</div></code>
|
|
108
|
-
</div>
|
|
109
|
-
</div>
|
|
110
|
-
</div>
|
|
111
|
-
|
|
112
|
-
<script type="module">
|
|
113
|
-
import renderVoice from "./assets/js/voice.js";
|
|
114
|
-
|
|
115
|
-
// 页面加载完成后渲染音频播放器
|
|
116
|
-
$(document).ready(function () {
|
|
117
|
-
renderVoice(".w-audio");
|
|
118
|
-
});
|
|
119
|
-
</script>
|
|
120
|
-
</body>
|
|
121
|
-
</html>
|