ย้ายตำแหน่ง

src/modules/02_organizationalNew/components/tableTree.vue

@@ -17,6 +17,7 @@ import type { PosMaster2 } from "@/modules/02_organizationalNew/interface/respon
 import DialogFormPosotion from "@/modules/02_organizationalNew/components/DialogFormPosition.vue";
 import DialogPositionDetail from "@/modules/02_organizationalNew/components/PositionDetail.vue";
 import DialogSort from "@/modules/02_organizationalNew/components/DialogSortPosition.vue";
+import DialogMovePos from "@/modules/02_organizationalNew/components/DialogMovePos.vue";
 
 /** importStore*/
 import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
@@ -33,20 +34,22 @@ const props = defineProps({
     require: true,
     default: () => {},
   },
+  fetchDataTree: {
+    type: Function,
+    require: true,
+    default: () => {},
+  },
 });
 
-const dataSort = ref<Array<any>>([]);
 const modalSort = ref<boolean>(false);
-const showAllData = ref<boolean>(false);
 
-const currentPage = ref<number>(1);
+const nodeTree = defineModel<any>("nodeTree", { required: true });
 const orgLevel = defineModel<number>("orgLevel", { required: true });
 const treeId = defineModel<string>("treeId", { required: true });
 const reqMaster = defineModel<FilterMaster>("reqMaster", { required: true });
 const totalPage = defineModel<number>("totalPage", { required: true });
 const posMaster = defineModel<PosMaster2[]>("posMaster", { required: true });
 const stroe = useOrganizational();
-const filter = ref<string>("");
 const actionType = ref<string>("");
 const listMenu = ref<ListMenu[]>([
   {
@@ -61,6 +64,12 @@ const listMenu = ref<ListMenu[]>([
     type: "DEL",
     color: "red",
   },
+  {
+    label: "ย้ายตำแหน่ง",
+    icon: "mdi-cursor-move",
+    type: "MOVE",
+    color: "positive",
+  },
   {
     label: "ดูรายละเอียด",
     icon: "mdi-eye",
@@ -247,6 +256,15 @@ function onClickDelete(id: string) {
 function onClickSort() {
   modalSort.value = true;
 }
+
+const modalDialogMMove = ref<boolean>(false);
+const typeMove = ref<string>("");
+
+function onClickMovePos(id: string, type: string) {
+  modalDialogMMove.value = !modalDialogMMove.value;
+  typeMove.value = type;
+  rowId.value = id;
+}
 function updatePagination(newPagination: NewPagination) {
   reqMaster.value.pageSize = newPagination.rowsPerPage;
   reqMaster.value.page = 1;
@@ -278,6 +296,17 @@ function updatePagination(newPagination: NewPagination) {
         >
           <q-tooltip>จัดลำดับ</q-tooltip>
         </q-btn>
+
+        <q-btn
+          flat
+          round
+          dense
+          color="positive"
+          icon="mdi-cursor-move"
+          @click="onClickMovePos('', 'All')"
+        >
+          <q-tooltip>ย้ายตำแหน่ง</q-tooltip>
+        </q-btn>
       </div>
 
       <q-btn flat round dense color="blue-10" icon="save_alt">
@@ -395,6 +424,8 @@ function updatePagination(newPagination: NewPagination) {
                         ? onClickPosition('EDIT', props.row.id)
                         : item.type === 'DEL'
                         ? onClickDelete(props.row.id)
+                        : item.type === 'MOVE'
+                        ? onClickMovePos(props.row.id, 'SINGER')
                         : null
                     "
                   >
@@ -502,6 +533,10 @@ function updatePagination(newPagination: NewPagination) {
     </d-table>
   </div>
 
+  <!-- รายละเอียดตำแหน่ง -->
+  <DialogPositionDetail v-model:position-detail="dialogDetail" />
+
+  <!-- อัตรากำลัง -->
   <DialogFormPosotion
     :modal="dialogPosition"
     :close="onClickPosition"
@@ -513,9 +548,19 @@ function updatePagination(newPagination: NewPagination) {
     :fetchDataTable="props.fetchDataTable"
   />
 
-  <!-- รายละเอียดตำแหน่ง -->
-  <DialogPositionDetail v-model:position-detail="dialogDetail" />
+  <!-- จัดลำดับ -->
   <DialogSort v-model:sort-position="modalSort" />
+
+  <!-- ย้ายตำแหน่ง -->
+  <DialogMovePos
+    v-model:modal="modalDialogMMove"
+    v-model:nodeTree="nodeTree"
+    v-model:columns="columns as QTableProps[]"
+    v-model:rows="posMaster"
+    :fetchDataTree="props.fetchDataTree"
+    :type="typeMove"
+    :rowId="rowId"
+  />
 </template>
 
 <style lang="scss" scoped>