fix move element list
This commit is contained in:
@@ -25,9 +25,9 @@
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="queue-body scrollable" v-if="selectedTab == 'Sinistra'">
|
||||
<Container @drag-start="onDrag" @drag-end="onDragEnd" @drop="changePosition($event)" :get-child-payload="getPayloadForItemQueue">
|
||||
<Container @drop="changePosition($event)" :get-child-payload="getPayloadForItemQueue">
|
||||
<Draggable v-for="pp in partPrograms" :key="pp.id">
|
||||
<div class="element-queue">
|
||||
<div class="draggable-item element-queue">
|
||||
<label class="number">{{pp.id}}</label><card-element-queue @click="deleteItemQueue(selectedProcess, pp)" :selected-process="selectedProcess" :id-part-program="pp.id" :name="pp.partProgramName" :number="pp.reps" :remaining-reps="pp.remainingReps" :status="pp.status" @position="positionBoxReps($event,pp)"></card-element-queue>
|
||||
</div>
|
||||
</Draggable>
|
||||
@@ -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;
|
||||
|
||||
@@ -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
|
||||
};
|
||||
@@ -36,15 +36,15 @@ export class FileService extends baseRestService {
|
||||
}
|
||||
|
||||
async deleteItemQueue(processId, model){
|
||||
debugger
|
||||
var result = await this.Delete<any>(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<any>(this.BASE_URL + "queue/" + processId + "/move", itemsPositions, true);
|
||||
productionActions.movePartPrograms(store,result);
|
||||
async moveItemsQueue(processId, position, model){
|
||||
var result = await this.Put<any>(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<any>(this.BASE_URL + "queue/" + processId + "/edit/" + model.id, {reps: model.reps});
|
||||
productionActions.updatePartProgram(store, result);
|
||||
return result;
|
||||
|
||||
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user