UX: Improve category reordering functionality

This commit is contained in:
Vinoth Kannan 2018-11-16 00:52:10 +05:30
parent 6fba8b8aef
commit d5df746cc3
2 changed files with 15 additions and 7 deletions

View File

@ -34,8 +34,6 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, {
return anyChanged;
}.property("categoriesBuffered.@each.hasBufferedChanges"),
saveDisabled: Ember.computed.alias("showApplyAll"),
moveDir(cat, dir) {
const cats = this.get("categoriesOrdered");
const curIdx = cats.indexOf(cat);
@ -82,11 +80,15 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, {
);
}
}
this.send("commit");
},
actions: {
change(cat, e) {
let position = parseInt($(e.target).val());
cat.set("position", position);
this.fixIndices();
},
moveUp(cat) {
this.moveDir(cat, -1);
},
@ -95,6 +97,8 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, {
},
commit() {
this.fixIndices();
this.get("categoriesBuffered").forEach(bc => {
if (bc.get("hasBufferedChanges")) {
bc.applyBufferedChanges();
@ -104,7 +108,7 @@ export default Ember.Controller.extend(ModalFunctionality, Ember.Evented, {
},
saveOrder() {
this.fixIndices();
this.send("commit");
const data = {};
this.get("categoriesBuffered").forEach(cat => {

View File

@ -8,7 +8,10 @@
{{#each categoriesOrdered as |cat|}}
<tr data-category-id="{{cat.id}}">
<td>
{{number-field number=cat.position}}
{{#if cat.parent_category_id}}
&nbsp;&nbsp;&nbsp;&nbsp;
{{/if}}
{{number-field number=(readonly cat.position) change=(action 'change' cat)}}
{{d-button class="btn-default no-text" action="moveUp" actionParam=cat icon="arrow-up"}}
{{d-button class="btn-default no-text" action="moveDown" actionParam=cat icon="arrow-down"}}
{{#if cat.hasBufferedChanges}}
@ -25,6 +28,7 @@
<div class="modal-footer">
{{#if showApplyAll}}
{{d-button action="commit" icon="check" label="categories.reorder.apply_all"}}
{{else}}
{{d-button class="btn-primary" action="saveOrder" label="categories.reorder.save"}}
{{/if}}
{{d-button class="btn-primary" disabled=saveDisabled action="saveOrder" label="categories.reorder.save"}}
</div>