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 @@
                 </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;
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<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;
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);