From 603e07cd7ef066fa9f972591eb901bafc8eb5bfb Mon Sep 17 00:00:00 2001 From: Alessandro Francia Date: Thu, 20 Sep 2018 16:19:00 +0200 Subject: [PATCH] fix move element list --- .../cards/card-queue-production.vue | 39 ++++++++--------- .../modules/base-components/cards/utils.js | 17 ++++++++ Step/wwwroot/src/services/fileService.ts | 9 ++-- Step/wwwroot/src/store/production.store.ts | 42 ++++++++++++++----- 4 files changed, 72 insertions(+), 35 deletions(-) create mode 100644 Step/wwwroot/src/modules/base-components/cards/utils.js diff --git a/Step/wwwroot/src/modules/base-components/cards/card-queue-production.vue b/Step/wwwroot/src/modules/base-components/cards/card-queue-production.vue index 90cc0bc3..9e80e055 100644 --- a/Step/wwwroot/src/modules/base-components/cards/card-queue-production.vue +++ b/Step/wwwroot/src/modules/base-components/cards/card-queue-production.vue @@ -25,9 +25,9 @@ -->
- + -
+
@@ -63,6 +63,7 @@ import {ModalHelper} from "src/modules/base-components"; import modalAddElementQueue from "src/modules/base-components/modal-add-element-queue.vue" import { FileService } from '../../../services/fileService'; import { productionActions } from "src/store/production.store"; +import { applyDrag } from "./utils"; import { store, AppModel } from "src/store"; import { Container, Draggable, } from "vue-smooth-dnd"; export default { @@ -111,19 +112,18 @@ export default { await new FileService().deleteQueue(id); }, async deleteItemQueue(processId, item){ - debugger await new FileService().deleteItemQueue(processId, item); }, - onDrag({ isSource, payload, willAcceptDrop }) { - this.enablePopup = false; - this.draggingIn = true; - this.draggingItem = payload; - }, + // onDrag({ isSource, payload, willAcceptDrop }) { + // this.enablePopup = false; + // this.draggingIn = true; + // this.draggingItem = payload; + // }, - onDragEnd() { - this.draggingIn = false; - // this.draggingTool = null; - }, + // onDragEnd({ isSource, payload, willAcceptDrop }) { + // this.draggingIn = false; + // this.draggingItem = payload; + // }, onDragEnter(position) { this.draggingPosition = position; @@ -136,13 +136,14 @@ export default { if(event.payload && event.payload.status != 1 && event.payload.status != 3 && event.addedIndex != event.removedIndex){ this.draggingIn = false; this.draggingItem = null; - var itemsPositions = {objectId: event.payload.id, newPosition: event.addedIndex}; - await new FileService().moveItemsQueue(this.selectedProcess,itemsPositions,this.partPrograms).then(function(){ - response = true; - }); - if(response && event.addedIndex && event.removeIndex){ - this.partPrograms.splice(event.addedIndex, 0, this.partPrograms.splice(event.removedIndex,1)[0]); - } + var itemsPositions = {objectId: event.payload.id, newPosition: event.addedIndex, oldPosition: event.removedIndex}; + await new FileService().moveItemsQueue(this.selectedProcess,itemsPositions,this.partPrograms); + // .then(function(){ + // response = true; + // }); + // if(response && event.addedIndex && event.removeIndex){ + // this.partPrograms.splice(event.addedIndex, 0, this.partPrograms.splice(event.removedIndex,1)[0]); + // } } else{ event = null; diff --git a/Step/wwwroot/src/modules/base-components/cards/utils.js b/Step/wwwroot/src/modules/base-components/cards/utils.js new file mode 100644 index 00000000..1d980371 --- /dev/null +++ b/Step/wwwroot/src/modules/base-components/cards/utils.js @@ -0,0 +1,17 @@ +export const applyDrag = (arr, dragResult) => { + const { removedIndex, addedIndex, payload } = dragResult + if (removedIndex === null && addedIndex === null) return arr + + const result = [...arr] + let itemToAdd = payload + + if (removedIndex !== null) { + itemToAdd = result.splice(removedIndex, 1)[0] + } + + if (addedIndex !== null) { + result.splice(addedIndex, 0, itemToAdd) + } + + return result +}; \ No newline at end of file diff --git a/Step/wwwroot/src/services/fileService.ts b/Step/wwwroot/src/services/fileService.ts index 331c4165..72512217 100644 --- a/Step/wwwroot/src/services/fileService.ts +++ b/Step/wwwroot/src/services/fileService.ts @@ -36,15 +36,15 @@ export class FileService extends baseRestService { } async deleteItemQueue(processId, model){ - debugger var result = await this.Delete(this.BASE_URL + "queue/" + processId + "/remove/" + model.id, true); productionActions.deletePartProgram(store,model); return result; } - async moveItemsQueue(processId, itemsPositions, model){ - var result = await this.Put(this.BASE_URL + "queue/" + processId + "/move", itemsPositions, true); - productionActions.movePartPrograms(store,result); + async moveItemsQueue(processId, position, model){ + var result = await this.Put(this.BASE_URL + "queue/" + processId + "/move", position, true); + model = result; + productionActions.movePartProgram(store,{model,position}); return result; } @@ -59,7 +59,6 @@ export class FileService extends baseRestService { } async changeReps(processId,model){ - debugger var result = await this.Put(this.BASE_URL + "queue/" + processId + "/edit/" + model.id, {reps: model.reps}); productionActions.updatePartProgram(store, result); return result; diff --git a/Step/wwwroot/src/store/production.store.ts b/Step/wwwroot/src/store/production.store.ts index d1ca1e52..8c30ecec 100644 --- a/Step/wwwroot/src/store/production.store.ts +++ b/Step/wwwroot/src/store/production.store.ts @@ -11,7 +11,8 @@ export interface ProductionActions { updatePartPrograms(context, model:server.PartProgramModel[]); deletePartPrograms(context); deletePartProgram(context, model:server.PartProgramModel); - movePartPrograms(context, model:server.PartProgramModel[]); + movePartPrograms(context, model:server.PartProgramModel[]); + movePartProgram(context, {model,position}); } export const productionStore = { @@ -23,24 +24,39 @@ export const productionStore = { }, mutations: { UpdatePartProgram(store, model: server.PartProgramModel) { - debugger store._partProgram.set(model.id, model); store.partProgram = Array.from(store._partProgram.values()); }, + UpdatePartPrograms(store, model: server.PartProgramModel[]){ + store._partProgram.clear(); + store.partProgram = []; + for(const key in model){ + const element = model[key]; + store._partProgram.set(element.id,element); + store.partProgram = Array.from(store._partProgram.values()); + } + }, DeletePartPrograms(store) { store.partProgram = []; }, DeletePartProgram(store, model:server.PartProgramModel) { - debugger - let idx = store.partProgram.indexOf(model); - if(store.partProgram[idx] && model && store.partProgram[idx].id == model.id){ - store.partProgram.splice(idx,1); - } - // store._partProgram.delete(model.id); - // store.partProgram = Array.from(store._partProgram.values()); + // let idx = store.partProgram.indexOf(model); + // if(store.partProgram[idx] && model && store.partProgram[idx].id == model.id){ + // store.partProgram.splice(idx,1); + // } + store._partProgram.delete(model.id); + store.partProgram = Array.from(store._partProgram.values()); }, MovePartPrograms(store, model:server.PartProgramModel[]) { - store.partProgram = model; + store.partProgram = []; + store.partProgram = model; + }, + MovePartProgram(store, {model,position}) { + if(position){ + var model = store.partProgram.splice(position.oldPosition, 1)[0]; + store.partProgram.splice(position.newPosition, 0, model); + // store.partProgram.splice(position.newPosition, 0, store.partProgram.splice(position.oldPosition,1)[0]); + } } }, actions: { @@ -48,10 +64,14 @@ export const productionStore = { context.commit("UpdatePartProgram", model); }, updatePartPrograms(context, model:server.PartProgramModel[]) { - context.commit("MovePartPrograms", model); + context.commit("UpdatePartPrograms", model); + // context.commit("MovePartPrograms", model); }, movePartPrograms(context, model:server.PartProgramModel[]) { context.commit("MovePartPrograms", model); + }, + movePartProgram(context, {model,position}) { + context.commit("MovePartProgram", {model,position}); }, deletePartProgram(context, model:server.PartProgramModel) { context.commit("DeletePartProgram", model);