Spiegel von
https://github.com/paviliondev/discourse-custom-wizard.git
synchronisiert 2024-11-09 11:52:54 +01:00
IMPROVE: Remove sortable and add manual step and field sorting (#135)
* IMPROVE: Remove sortable and add manual step and field sorting * Apply eslint * Apply prettier
Dieser Commit ist enthalten in:
Ursprung
247f7ca466
Commit
911a47db28
3 geänderte Dateien mit 31 neuen und 28 gelöschten Zeilen
|
@ -1,15 +1,10 @@
|
|||
import {
|
||||
default as discourseComputed,
|
||||
observes,
|
||||
on,
|
||||
} from "discourse-common/utils/decorators";
|
||||
import discourseComputed from "discourse-common/utils/decorators";
|
||||
import { generateName } from "../lib/wizard";
|
||||
import {
|
||||
setWizardDefaults,
|
||||
default as wizardSchema,
|
||||
} from "../lib/wizard-schema";
|
||||
import { notEmpty } from "@ember/object/computed";
|
||||
import { scheduleOnce } from "@ember/runloop";
|
||||
import EmberObject from "@ember/object";
|
||||
import Component from "@ember/component";
|
||||
import { A } from "@ember/array";
|
||||
|
@ -19,28 +14,12 @@ export default Component.extend({
|
|||
items: A(),
|
||||
anyLinks: notEmpty("links"),
|
||||
|
||||
@on("didInsertElement")
|
||||
@observes("links.[]")
|
||||
setupSortable() {
|
||||
scheduleOnce("afterRender", () => this.applySortable());
|
||||
},
|
||||
|
||||
applySortable() {
|
||||
$(this.element)
|
||||
.find(".link-list")
|
||||
.sortable({ tolerance: "pointer" })
|
||||
.on("sortupdate", (e, ui) => {
|
||||
this.updateItemOrder(ui.item.data("id"), ui.item.index());
|
||||
});
|
||||
},
|
||||
|
||||
updateItemOrder(itemId, newIndex) {
|
||||
const items = this.items;
|
||||
const item = items.findBy("id", itemId);
|
||||
items.removeObject(item);
|
||||
item.set("index", newIndex);
|
||||
items.insertAt(newIndex, item);
|
||||
scheduleOnce("afterRender", this, () => this.applySortable());
|
||||
},
|
||||
|
||||
@discourseComputed("itemType")
|
||||
|
@ -58,7 +37,7 @@ export default Component.extend({
|
|||
return;
|
||||
}
|
||||
|
||||
return items.map((item) => {
|
||||
return items.map((item, index) => {
|
||||
if (item) {
|
||||
let link = {
|
||||
id: item.id,
|
||||
|
@ -77,6 +56,15 @@ export default Component.extend({
|
|||
}
|
||||
|
||||
link.classes = classes;
|
||||
link.index = index;
|
||||
|
||||
if (index === 0) {
|
||||
link.first = true;
|
||||
}
|
||||
|
||||
if (index === items.length - 1) {
|
||||
link.last = true;
|
||||
}
|
||||
|
||||
return link;
|
||||
}
|
||||
|
@ -118,6 +106,14 @@ export default Component.extend({
|
|||
this.set("current", newItem);
|
||||
},
|
||||
|
||||
back(item) {
|
||||
this.updateItemOrder(item.id, item.index - 1);
|
||||
},
|
||||
|
||||
forward(item) {
|
||||
this.updateItemOrder(item.id, item.index + 1);
|
||||
},
|
||||
|
||||
change(itemId) {
|
||||
this.set("current", this.items.findBy("id", itemId));
|
||||
},
|
||||
|
|
|
@ -2,10 +2,16 @@
|
|||
|
||||
<div class="link-list">
|
||||
{{#if anyLinks}}
|
||||
{{#each links as |l|}}
|
||||
<div data-id={{l.id}}>
|
||||
{{d-button action="change" actionParam=l.id translatedLabel=l.label class=l.classes}}
|
||||
{{d-button action="remove" actionParam=l.id icon="times" class="remove"}}
|
||||
{{#each links as |link|}}
|
||||
<div data-id={{link.id}}>
|
||||
{{d-button action="change" actionParam=link.id translatedLabel=link.label class=link.classes}}
|
||||
{{#unless link.first}}
|
||||
{{d-button action="back" actionParam=link icon="arrow-left" class="back"}}
|
||||
{{/unless}}
|
||||
{{#unless link.last}}
|
||||
{{d-button action="forward" actionParam=link icon="arrow-right" class="forward"}}
|
||||
{{/unless}}
|
||||
{{d-button action="remove" actionParam=link.id icon="times" class="remove"}}
|
||||
</div>
|
||||
{{/each}}
|
||||
{{/if}}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
# frozen_string_literal: true
|
||||
# name: discourse-custom-wizard
|
||||
# about: Create custom wizards
|
||||
# version: 0.8.0
|
||||
# version: 0.8.1
|
||||
# authors: Angus McLeod
|
||||
# url: https://github.com/paviliondev/discourse-custom-wizard
|
||||
# contact emails: angus@thepavilion.io
|
||||
|
@ -33,6 +33,7 @@ if respond_to?(:register_svg_icon)
|
|||
register_svg_icon "chevron-right"
|
||||
register_svg_icon "chevron-left"
|
||||
register_svg_icon "save"
|
||||
register_svg_icon "arrow-right"
|
||||
end
|
||||
|
||||
class ::Sprockets::DirectiveProcessor
|
||||
|
|
Laden …
In neuem Issue referenzieren