@jx3box/jx3box-editor 0.9.9 → 1.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.
@@ -15,6 +15,7 @@
15
15
  .h(780px);
16
16
  .v-note-wrapper{
17
17
  .h(780px);
18
+ .z(1);
18
19
  }
19
20
  }
20
21
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jx3box/jx3box-editor",
3
- "version": "0.9.9",
3
+ "version": "1.0.0",
4
4
  "description": "JX3BOX Article & Editor",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/Resource.vue CHANGED
@@ -1,9 +1,7 @@
1
1
  <template>
2
2
  <div class="c-resource">
3
3
  <!-- 上传触发按钮 -->
4
- <el-button class="u-switch" type="primary" @click="dialogVisible = true" :disabled="!enable">
5
- <img class="u-icon" svg-inline src="../assets/img/jx3.svg" />剑三资源
6
- </el-button>
4
+ <el-button class="u-switch" type="primary" @click="openDialog" :disabled="!enable"> <img class="u-icon" svg-inline src="../assets/img/jx3.svg" />剑三资源 </el-button>
7
5
 
8
6
  <!-- 弹出界面 -->
9
7
  <el-dialog class="c-large-dialog" title="剑三数据库" :visible.sync="dialogVisible">
@@ -13,21 +11,10 @@
13
11
  <el-radio-button label="std">正式服</el-radio-button>
14
12
  <el-radio-button label="origin">怀旧服</el-radio-button>
15
13
  </el-radio-group>
16
- <el-input
17
- class="u-input"
18
- placeholder="请输入 ID 或 名称"
19
- v-model="query"
20
- @change="search"
21
- @keyup.enter.native="search"
22
- >
14
+ <el-input class="u-input" placeholder="请输入 ID 或 名称" v-model="query" @change="search" @keyup.enter.native="search">
23
15
  <template slot="prepend">ID /名称</template>
24
16
  <template slot="append" v-if="isPC">
25
- <el-switch
26
- v-model="strict"
27
- active-text="精确匹配"
28
- @change="search"
29
- title="仅对Buff/Skill有效"
30
- ></el-switch>
17
+ <el-switch v-model="strict" active-text="精确匹配" @change="search" title="仅对Buff/Skill有效"></el-switch>
31
18
  </template>
32
19
  </el-input>
33
20
  </div>
@@ -40,8 +27,7 @@
40
27
  <em class="u-count">{{ stat.buff }}</em>
41
28
  </span>
42
29
  <div v-if="buff.length && done" class="m-resource-count">
43
- <i class="el-icon-s-data"></i> 共找到
44
- <b>{{ buff.length }}</b> 条记录
30
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ buff.length }}</b> 条记录
45
31
  <div class="u-mode">
46
32
  插入模式:
47
33
  <el-radio-group v-model="buff_mode" size="mini" @change="changeMode">
@@ -51,25 +37,12 @@
51
37
  </div>
52
38
  </div>
53
39
  <ul class="m-resource-list">
54
- <li
55
- v-for="(o, i) in buff"
56
- class="u-item"
57
- :key="i"
58
- :class="{ on: !!o.isSelected }"
59
- @click="selectBuff(o, i)"
60
- ref="buff"
61
- >
40
+ <li v-for="(o, i) in buff" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectBuff(o, i)" ref="buff">
62
41
  <span class="u-id">
63
42
  ID:{{ o.BuffID }}
64
- <span
65
- class="u-detach"
66
- >{{o.DetachType | showDetachType}}</span>
43
+ <span class="u-detach">{{ o.DetachType | showDetachType }}</span>
67
44
  </span>
68
- <img
69
- class="u-pic"
70
- :title="'IconID:' + o.IconID"
71
- :src="iconURL(o.IconID)"
72
- />
45
+ <img class="u-pic" :title="'IconID:' + o.IconID" :src="iconURL(o.IconID)" />
73
46
  <span class="u-primary">
74
47
  <span class="u-name">
75
48
  {{ o.Name }}
@@ -79,12 +52,7 @@
79
52
  </span>
80
53
  </li>
81
54
  </ul>
82
- <el-alert
83
- v-if="!buff.length && done"
84
- title="没有找到相关条目"
85
- type="info"
86
- show-icon
87
- ></el-alert>
55
+ <el-alert v-if="!buff.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
88
56
  </el-tab-pane>
89
57
  <el-tab-pane label="技能" name="skill">
90
58
  <span slot="label">
@@ -93,8 +61,7 @@
93
61
  <em class="u-count">{{ stat.skill }}</em>
94
62
  </span>
95
63
  <div v-if="skill.length && done" class="m-resource-count">
96
- <i class="el-icon-s-data"></i> 共找到
97
- <b>{{ skill.length }}</b> 条记录
64
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ skill.length }}</b> 条记录
98
65
  <div class="u-mode">
99
66
  插入模式:
100
67
  <el-radio-group v-model="skill_mode" size="mini" @change="changeMode">
@@ -104,39 +71,21 @@
104
71
  </div>
105
72
  </div>
106
73
  <ul class="m-resource-list">
107
- <li
108
- v-for="(o, i) in skill"
109
- class="u-item"
110
- :key="i"
111
- :class="{ on: !!o.isSelected }"
112
- @click="selectSkill(o, i)"
113
- ref="skill"
114
- >
74
+ <li v-for="(o, i) in skill" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectSkill(o, i)" ref="skill">
115
75
  <span class="u-id">ID:{{ o.SkillID }}</span>
116
- <img
117
- class="u-pic"
118
- :title="'IconID:' + o.IconID"
119
- :src="iconURL(o.IconID)"
120
- />
76
+ <img class="u-pic" :title="'IconID:' + o.IconID" :src="iconURL(o.IconID)" />
121
77
  <span class="u-primary">
122
78
  <span class="u-name">
123
79
  {{ o.Name }}
124
80
  <em v-if="o.SkillName">({{ o.SkillName }})</em>
125
81
  </span>
126
82
  <span class="u-content">
127
- {{
128
- o.Desc | filterRaw
129
- }}
83
+ {{ o.Desc | filterRaw }}
130
84
  </span>
131
85
  </span>
132
86
  </li>
133
87
  </ul>
134
- <el-alert
135
- v-if="!skill.length && done"
136
- title="没有找到相关条目"
137
- type="info"
138
- show-icon
139
- ></el-alert>
88
+ <el-alert v-if="!skill.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
140
89
  </el-tab-pane>
141
90
  <el-tab-pane label="物品" name="item">
142
91
  <span slot="label">
@@ -145,39 +94,20 @@
145
94
  <em class="u-count">{{ stat.item }}</em>
146
95
  </span>
147
96
  <p v-if="item.length && done" class="m-resource-count">
148
- <i class="el-icon-s-data"></i> 共找到
149
- <b>{{ item.length }}</b> 条记录
97
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ item.length }}</b> 条记录
150
98
  </p>
151
99
  <ul class="m-resource-list" v-if="item.length">
152
- <li
153
- v-for="(o, i) in item"
154
- :key="i"
155
- class="u-item"
156
- :class="{ on: o.isSelected }"
157
- @click="selectItem(o, i)"
158
- ref="item"
159
- >
100
+ <li v-for="(o, i) in item" :key="i" class="u-item" :class="{ on: o.isSelected }" @click="selectItem(o, i)" ref="item">
160
101
  <span class="u-id">ID:{{ o.id }}</span>
161
- <img
162
- class="u-pic"
163
- :title="'IconID:' + o.IconID"
164
- :src="iconURL(o.IconID)"
165
- />
102
+ <img class="u-pic" :title="'IconID:' + o.IconID" :src="iconURL(o.IconID)" />
166
103
  <span class="u-name">{{ o.Name }}</span>
167
104
  <span class="u-content" v-html="o.DescHtml"></span>
168
105
  <span class="u-remark">
169
- {{
170
- o.Requirement
171
- }}
106
+ {{ o.Requirement }}
172
107
  </span>
173
108
  </li>
174
109
  </ul>
175
- <el-alert
176
- v-if="!item.length && done"
177
- title="没有找到相关条目"
178
- type="info"
179
- show-icon
180
- ></el-alert>
110
+ <el-alert v-if="!item.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
181
111
  </el-tab-pane>
182
112
  <el-tab-pane label="图标" name="icon">
183
113
  <span slot="label">
@@ -186,18 +116,10 @@
186
116
  <em class="u-count">{{ stat.icon }}</em>
187
117
  </span>
188
118
  <p v-if="icon.length && done" class="m-resource-count">
189
- <i class="el-icon-s-data"></i> 共找到
190
- <b>{{ icon.length }}</b> 条记录
119
+ <i class="el-icon-s-data"></i> 共找到 <b>{{ icon.length }}</b> 条记录
191
120
  </p>
192
121
  <ul class="m-resource-iconlist">
193
- <li
194
- v-for="(o, i) in icon"
195
- class="u-item"
196
- :key="i"
197
- :class="{ on: !!o.isSelected }"
198
- @click="selectIcon(o)"
199
- ref="icon"
200
- >
122
+ <li v-for="(o, i) in icon" class="u-item" :key="i" :class="{ on: !!o.isSelected }" @click="selectIcon(o)" ref="icon">
201
123
  <!-- <el-tooltip
202
124
  effect="dark"
203
125
  :content="o.Name || query"
@@ -207,24 +129,13 @@
207
129
  <!-- </el-tooltip> -->
208
130
  </li>
209
131
  </ul>
210
- <el-alert
211
- v-if="!icon.length && done"
212
- title="没有找到相关条目"
213
- type="info"
214
- show-icon
215
- ></el-alert>
132
+ <el-alert v-if="!icon.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
216
133
  </el-tab-pane>
217
134
  </el-tabs>
218
135
 
219
136
  <template v-if="multipage">
220
137
  <!-- 下一页 -->
221
- <el-button
222
- class="m-archive-more"
223
- :class="{ show: hasNextPage }"
224
- type="primary"
225
- icon="el-icon-arrow-down"
226
- @click="appendPage"
227
- >加载更多</el-button>
138
+ <el-button class="m-archive-more" :class="{ show: hasNextPage }" type="primary" icon="el-icon-arrow-down" @click="appendPage">加载更多</el-button>
228
139
  <!-- 分页 -->
229
140
  <el-pagination
230
141
  class="m-archive-pages"
@@ -245,9 +156,7 @@
245
156
  <span slot="footer" class="dialog-footer">
246
157
  <el-button @click="dialogVisible = false">取 消</el-button>
247
158
  <el-button type="primary" @click="insert">
248
- {{
249
- buttonTXT
250
- }}
159
+ {{ buttonTXT }}
251
160
  </el-button>
252
161
  </span>
253
162
  </el-dialog>
@@ -257,26 +166,22 @@
257
166
  <script>
258
167
  import axios from "axios";
259
168
  import { loadResource, loadStat, getIcons } from "../service/database";
260
- import {
261
- __ossRoot,
262
- __iconPath,
263
- __Root,
264
- __OriginRoot,
265
- } from "@jx3box/jx3box-common/data/jx3box.json";
169
+ import { __ossRoot, __iconPath, __Root, __OriginRoot } from "@jx3box/jx3box-common/data/jx3box.json";
266
170
  import detach_types from "../assets/data/detach_type.json";
267
171
  import User from "@jx3box/jx3box-common/js/user";
268
172
  import { iconLink } from "@jx3box/jx3box-common/js/utils";
269
173
  export default {
270
174
  name: "Resource",
271
175
  props: {
272
- enable : {
176
+ enable: {
273
177
  type: Boolean,
274
- default : true,
275
- }
178
+ default: true,
179
+ },
276
180
  },
277
- data: function () {
181
+ data: function() {
278
182
  return {
279
183
  dialogVisible: false,
184
+ actived: false,
280
185
 
281
186
  type: "buff",
282
187
  query: "",
@@ -314,35 +219,35 @@ export default {
314
219
  };
315
220
  },
316
221
  computed: {
317
- buttonTXT: function () {
222
+ buttonTXT: function() {
318
223
  return this.selectedCount ? "插 入" : "确 定";
319
224
  },
320
- isBlank: function () {
225
+ isBlank: function() {
321
226
  return !this.query && !this[this.type]["length"];
322
227
  },
323
- selectedCount: function () {
228
+ selectedCount: function() {
324
229
  return !!this.html;
325
230
  },
326
- isNumber: function () {
231
+ isNumber: function() {
327
232
  return !isNaN(this.query);
328
233
  },
329
- hasNextPage: function () {
234
+ hasNextPage: function() {
330
235
  return this.total > 1 && this.page < this.pages;
331
236
  },
332
- multipage: function () {
237
+ multipage: function() {
333
238
  return this.type !== "icon" && this.done && this.pages > 1;
334
239
  },
335
- iconDir: function () {
240
+ iconDir: function() {
336
241
  return this.client == "origin" ? "origin_icon" : "icon";
337
242
  },
338
243
  },
339
244
  watch: {
340
- html: function (newval) {
245
+ html: function(newval) {
341
246
  this.$emit("update", newval);
342
247
  },
343
248
  },
344
249
  methods: {
345
- getData: function (page = 1, append = false) {
250
+ getData: function(page = 1, append = false) {
346
251
  if (!this.query) return;
347
252
 
348
253
  this.loading = true;
@@ -401,115 +306,105 @@ export default {
401
306
  });
402
307
  }
403
308
  },
404
- search: function () {
309
+ search: function() {
405
310
  this.getData();
406
311
  },
407
- appendPage: function () {
312
+ appendPage: function() {
408
313
  this.getData(++this.page, true);
409
314
  },
410
- changePage: function (i) {
315
+ changePage: function(i) {
411
316
  this.getData(i);
412
317
  },
413
- changeType: function () {
318
+ changeType: function() {
414
319
  this.page = 1;
415
320
  this.getData();
416
321
  },
417
- insert: function () {
322
+ insert: function() {
418
323
  this.dialogVisible = false;
419
324
  this.$emit("insert", this.html);
420
325
  },
421
- transformData: function (data) {
326
+ transformData: function(data) {
422
327
  data.forEach((item) => {
423
328
  item.isSelected = false;
424
329
  });
425
330
  return data;
426
331
  },
427
- changeMode : function (){
332
+ changeMode: function() {
428
333
  this.resetItems();
429
334
  },
430
- selectBuff: function (o, i) {
335
+ selectBuff: function(o, i) {
431
336
  this.resetItems();
432
337
  o.isSelected = true;
433
338
  if (this.buff_mode == "simple") {
434
339
  // <img src="${this.iconURL(
435
340
  // o.IconID
436
341
  // )}">
437
- this.html = `<a data-type="buff" class="e-jx3-buff w-jx3-element ${
438
- o.CanCancel == 1 ? "isBuff" : "isDebuff"
439
- }" href="${this.getLink(
342
+ this.html = `<a data-type="buff" class="e-jx3-buff w-jx3-element ${o.CanCancel == 1 ? "isBuff" : "isDebuff"}" href="${this.getLink(
440
343
  "buff",
441
344
  this.client,
442
345
  o.BuffID,
443
346
  o.Level
444
- )}" data-client="${this.client}" data-id="${
445
- o.BuffID
446
- }" data-level="${o.Level}">[${o.Name}]</a>`;
347
+ )}" data-client="${this.client}" data-id="${o.BuffID}" data-level="${o.Level}">[${o.Name}]</a>`;
447
348
  } else {
448
- this.html = `<pre data-type="buff" data-id="${
449
- o.BuffID
450
- }" class="e-jx3-resource">${
451
- this.$refs[this.type][i]["innerHTML"]
452
- }</pre>`;
349
+ this.html = `<pre data-type="buff" data-id="${o.BuffID}" class="e-jx3-resource">${this.$refs[this.type][i]["innerHTML"]}</pre>`;
453
350
  }
454
351
  },
455
- selectSkill: function (o, i) {
352
+ selectSkill: function(o, i) {
456
353
  this.resetItems();
457
354
  o.isSelected = true;
458
355
  if (this.skill_mode == "simple") {
459
- this.html = `<a data-type="skill" class="e-jx3-skill w-jx3-element" href="${this.getLink(
460
- "skill",
461
- this.client,
462
- o.SkillID,
463
- o.Level
464
- )}" data-client="${this.client}" data-id="${
356
+ this.html = `<a data-type="skill" class="e-jx3-skill w-jx3-element" href="${this.getLink("skill", this.client, o.SkillID, o.Level)}" data-client="${this.client}" data-id="${
465
357
  o.SkillID
466
358
  }" data-level="${o.Level}">[${o.Name}]</a>`;
467
359
  } else {
468
- this.html = `<pre data-type="skill" data-id="${
469
- o.SkillID
470
- }" class="e-jx3-resource">${
471
- this.$refs[this.type][i]["innerHTML"]
472
- }</pre>`;
360
+ this.html = `<pre data-type="skill" data-id="${o.SkillID}" class="e-jx3-resource">${this.$refs[this.type][i]["innerHTML"]}</pre>`;
473
361
  }
474
362
  },
475
- selectItem: function (o, i) {
363
+ selectItem: function(o, i) {
476
364
  this.resetItems();
477
365
  o.isSelected = true;
478
366
  this.html = `<a data-type="item" class="e-jx3-item e-jx3-item-q${o.Quality} w-jx3-element" data-mode="" data-id="${o.id}" data-quality="${o.Quality}" data-client="${this.client}" target="_blank" href="${o.Link}">[${o.Name}]</a>`;
479
367
  },
480
- selectIcon: function (o) {
368
+ selectIcon: function(o) {
481
369
  this.resetItems();
482
370
  o.isSelected = true;
483
371
  this.html = `<img class="e-jx3-icon" src="${__iconPath}${this.iconDir}/${o.iconID}.png" alt="${o.iconID}"/>`;
484
372
  },
485
- resetItems: function () {
373
+ resetItems: function() {
486
374
  let data = this[this.type];
487
375
  data.forEach((item) => {
488
376
  item.isSelected = false;
489
377
  });
490
- this.html = ''
378
+ this.html = "";
491
379
  },
492
- checkUA: function () {
380
+ checkUA: function() {
493
381
  this.isPC = window.innerWidth > 720;
494
382
  },
495
- iconURL: function (id) {
496
- return iconLink(id,this.client);
383
+ iconURL: function(id) {
384
+ return iconLink(id, this.client);
497
385
  },
498
- getLink: function (type, client, id, level) {
386
+ getLink: function(type, client, id, level) {
499
387
  let domain = client == "origin" ? __OriginRoot : __Root;
500
- return (
501
- domain +
502
- "app/database/?type=" +
503
- type +
504
- `&query=${id}&level=${level}`
505
- );
388
+ return domain + "app/database/?type=" + type + `&query=${id}&level=${level}`;
389
+ },
390
+
391
+ // 杂项
392
+ // ==============================
393
+ openDialog: function() {
394
+ this.dialogVisible = true;
395
+ if (!this.actived) {
396
+ loadStat().then((data) => {
397
+ this.stat = data;
398
+ this.actived = true;
399
+ });
400
+ }
506
401
  },
507
402
  },
508
403
  filters: {
509
- filterRaw: function (str) {
404
+ filterRaw: function(str) {
510
405
  return str && str.replace(/\\n/g, "\n");
511
406
  },
512
- showDetachType: function (val) {
407
+ showDetachType: function(val) {
513
408
  if (val && detach_types[val]) {
514
409
  return detach_types[val];
515
410
  } else {
@@ -517,11 +412,8 @@ export default {
517
412
  }
518
413
  },
519
414
  },
520
- created: function () {
415
+ created: function() {
521
416
  this.checkUA();
522
- loadStat().then((data) => {
523
- this.stat = data;
524
- });
525
417
  },
526
418
  components: {},
527
419
  };