Skip to content

Commit f6077e3

Browse files
KaviileeKaviilee
committed
fix: pvp combo
1 parent c2e1350 commit f6077e3

6 files changed

Lines changed: 91 additions & 33 deletions

File tree

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
},
3131
"dependencies": {
3232
"@element-plus/icons-vue": "^2.3.2",
33+
"@imengyu/vue3-context-menu": "^1.5.4",
3334
"@jx3box/jx3box-common": "^9.2.1",
3435
"@jx3box/jx3box-data": "^3.9.4",
3536
"@jx3box/jx3box-editor": "^3.1.1",

‎src/assets/css/publish/pvp.less‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -67,17 +67,17 @@
6767
cursor: pointer;
6868
// .none;
6969

70-
background-color:#c00;
70+
background-color: #c00;
7171
.size(12px);
7272
.r(50%);
7373
.db;
74-
i{
75-
color:#fff;
74+
i {
75+
color: #fff;
7676
.fz(12px);
7777
.db;
7878
}
7979
&:hover {
80-
background-color:#f00;
80+
background-color: #f00;
8181
}
8282
}
8383

@@ -92,8 +92,8 @@
9292
.r(50%);
9393
.db;
9494

95-
i{
96-
color:#fff;
95+
i {
96+
color: #fff;
9797
.fz(12px);
9898
.db;
9999
}
@@ -307,6 +307,7 @@
307307
// 已选数据
308308
.m-selected-skills {
309309
height: 70px;
310+
box-sizing: content-box;
310311
border: 1px solid #ddd;
311312
padding: 10px;
312313
.scrollbar();
@@ -393,7 +394,7 @@
393394
}
394395
}
395396

396-
.m-pvp-martial {
397+
.m-pvp-martial__container {
397398
display: flex;
398399
background: #1a2b22;
399400
padding: 20px;
@@ -464,5 +465,4 @@
464465
}
465466
}
466467
}
467-
468468
}

‎src/components/publish/publish_guide.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
>
1616
<el-option v-for="item in prev" :key="item.ID" :value="item.ID" :label="item.post_title">
1717
<div class="u-post-select__item">
18-
<el-tag v-if="item.post_type" :type="item.visible != 0 ? 'warning' : ''">{{
18+
<el-tag v-if="item.post_type" v-bind="item.visible != 0 ? { type: 'warning' } : {}">{{
1919
showPostType(item.post_type)
2020
}}</el-tag>
2121
{{ item.post_title }}
@@ -36,7 +36,7 @@
3636
>
3737
<el-option v-for="item in next" :key="item.ID" :value="item.ID" :label="item.post_title">
3838
<div class="u-post-select__item">
39-
<el-tag v-if="item.post_type" :type="item.visible != 0 ? 'warning' : ''">{{
39+
<el-tag v-if="item.post_type" v-bind="item.visible != 0 ? { type: 'warning' } : {}">{{
4040
showPostType(item.post_type)
4141
}}</el-tag>
4242
{{ item.post_title }}

‎src/components/publish/publish_pvp.vue‎

Lines changed: 72 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,9 @@
118118
</span>
119119
</template>
120120
</div>
121-
<el-button type="primary" size="medium" @click="addSkill" icon="Plus">新增技能</el-button>
121+
<el-button type="primary" class="u-add-skill" size="medium" @click="addSkill" icon="Plus"
122+
>新增技能</el-button
123+
>
122124
</el-form-item>
123125
<el-form-item label="连招说明" class="m-macro-desc">
124126
<el-input
@@ -165,6 +167,8 @@ import SkillDialog from "@/components/publish/skill_dialog.vue";
165167
import { iconLink } from "@jx3box/jx3box-common/js/utils";
166168
167169
import Sortable from "sortablejs";
170+
import ContextMenu from "@imengyu/vue3-context-menu";
171+
import "@imengyu/vue3-context-menu/lib/vue3-context-menu.css";
168172
import publish_qixue from "./publish_qixue.vue";
169173
// META空模板
170174
const default_meta = {
@@ -218,6 +222,8 @@ export default {
218222
219223
zhNum: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十"],
220224
showSkillDialog: false,
225+
tabsSortable: null,
226+
skillSortable: null,
221227
};
222228
},
223229
emits: ["update", "update:modelValue"],
@@ -263,6 +269,19 @@ export default {
263269
});
264270
},
265271
},
272+
"pvpData.has_sq": {
273+
immediate: true,
274+
handler(val) {
275+
this.$nextTick(() => {
276+
if (!val) {
277+
this.destroySortables();
278+
return;
279+
}
280+
this.initTabsSort();
281+
this.initSkillSort();
282+
});
283+
},
284+
},
266285
},
267286
methods: {
268287
// 添加连招
@@ -281,6 +300,10 @@ export default {
281300
desc: "",
282301
});
283302
this.activeIndex = index;
303+
this.$nextTick(() => {
304+
this.initTabsSort();
305+
this.initSkillSort();
306+
});
284307
},
285308
// 删除宏
286309
removeCombo: function (name) {
@@ -300,6 +323,10 @@ export default {
300323
this.pvpData.data.splice(i, 1);
301324
// 调整focus位置
302325
this.activeIndex = "1";
326+
this.$nextTick(() => {
327+
this.initTabsSort();
328+
this.initSkillSort();
329+
});
303330
}
304331
},
305332
});
@@ -347,12 +374,19 @@ export default {
347374
const sq = this.pvpData.data[this.activeIndex - 1].sq?.push(..._skill) || _skill;
348375
},
349376
iconLink,
377+
destroySortables() {
378+
this.tabsSortable?.destroy();
379+
this.skillSortable?.destroy();
380+
this.tabsSortable = null;
381+
this.skillSortable = null;
382+
},
350383
// 初始化技能排序
351384
initSkillSort() {
352385
const el = document.querySelector(`.tabs-sort .tab-content${this.activeIndex} .u-skills`);
353386
if (!el) return;
387+
this.skillSortable?.destroy();
354388
const _this = this;
355-
const sortSkills = Sortable.create(el, {
389+
this.skillSortable = Sortable.create(el, {
356390
animation: 200,
357391
onEnd({ newIndex, oldIndex }) {
358392
const data = cloneDeep(_this.pvpData.data[_this.activeIndex - 1].sq);
@@ -365,19 +399,42 @@ export default {
365399
},
366400
});
367401
},
402+
initTabsSort() {
403+
const el = document.querySelector(".tabs-sort .el-tabs__nav");
404+
if (!el) return;
405+
this.tabsSortable?.destroy();
406+
const _this = this;
407+
this.tabsSortable = Sortable.create(el, {
408+
animation: 200,
409+
filter: ".el-icon-close",
410+
onEnd({ newIndex, oldIndex }) {
411+
const data = cloneDeep(_this.pvpData.data);
412+
const currRow = cloneDeep(data.splice(oldIndex, 1)[0]);
413+
data.splice(newIndex, 0, currRow);
414+
_this.pvpData.data = [];
415+
_this.$nextTick(function () {
416+
_this.pvpData.data = data;
417+
_this.$nextTick(() => {
418+
_this.initTabsSort();
419+
_this.initSkillSort();
420+
});
421+
});
422+
},
423+
});
424+
},
368425
onContextmenu(event, skill) {
369-
// console.log(skill)
370-
this.$contextmenu({
426+
event.preventDefault();
427+
ContextMenu.showContextMenu({
428+
x: event.x ?? event.clientX,
429+
y: event.y ?? event.clientY,
371430
items: [
372431
{
373432
label: !skill?.WithoutGcd ? "设置为无GCD技能" : "设置为有GCD技能",
374433
onClick: () => {
375434
skill.WithoutGcd = !skill.WithoutGcd;
376435
},
377-
icon: !skill?.WithoutGcd ? "el-icon-check" : "el-icon-close",
378436
},
379437
],
380-
event,
381438
customClass: "custom-class",
382439
zIndex: 3,
383440
minWidth: 230,
@@ -386,23 +443,14 @@ export default {
386443
},
387444
},
388445
mounted: function () {
389-
let el = document.querySelector(".tabs-sort .el-tabs__nav");
390-
if (!el) return;
391-
const _this = this;
392-
let sortTabs = Sortable.create(el, {
393-
animation: 200,
394-
filter: ".el-icon-close",
395-
onEnd({ newIndex, oldIndex }) {
396-
const data = cloneDeep(_this.pvpData.data);
397-
const currRow = cloneDeep(data.splice(oldIndex, 1)[0]);
398-
data.splice(newIndex, 0, currRow);
399-
_this.pvpData.data = [];
400-
_this.$nextTick(function () {
401-
_this.pvpData.data = data;
402-
});
403-
},
446+
this.$nextTick(() => {
447+
this.initTabsSort();
448+
this.initSkillSort();
404449
});
405450
},
451+
beforeUnmount() {
452+
this.destroySortables();
453+
},
406454
};
407455
</script>
408456
@@ -411,5 +459,8 @@ export default {
411459
.u-skill .u-skill-icon {
412460
.size(48px);
413461
}
462+
.u-add-skill {
463+
margin-left: 10px;
464+
}
414465
}
415466
</style>

‎src/components/publish/pvp_martial.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<div class="m-pvp-martial">
2+
<div class="m-pvp-martial__container">
33
<div class="m-martial-skill" v-for="(kungfu, index) in kungfu_skills" :key="index">
44
<div class="u-title">
55
<span class="u-title-name">{{ kungfu[0].kungfu_name }}</span>

‎src/post/pvp.vue‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,12 @@
5454
<!-- 正文 -->
5555
<div class="m-publish-content">
5656
<el-divider content-position="left">正文</el-divider>
57-
<el-radio-group class="m-publish-editormode" size="large" :class="`is-${post.post_mode}`" v-model="post.post_mode">
57+
<el-radio-group
58+
class="m-publish-editormode"
59+
size="large"
60+
:class="`is-${post.post_mode}`"
61+
v-model="post.post_mode"
62+
>
5863
<el-radio-button value="tinymce">可视化编辑器</el-radio-button>
5964
<el-radio-button value="markdown">Markdown</el-radio-button>
6065
</el-radio-group>
@@ -68,6 +73,7 @@
6873
v-model="post.post_content"
6974
:attachmentEnable="true"
7075
:resourceEnable="true"
76+
:subtype="post.post_subtype"
7177
v-show="!post.post_mode || post.post_mode == 'tinymce'"
7278
/>
7379
</div>

0 commit comments

Comments
 (0)