หน้า ui รายการส่งตัวกลับ

2023-08-11 17:09:10 +07:00 · 2023-08-11 17:09:10 +07:00 · 8710baa643
commit 8710baa643
parent 42e6b26198
6 changed files with 1549 additions and 268 deletions
--- a/src/modules/05_placement/components/helpgovernment/mainHelp.vue
+++ b/src/modules/05_placement/components/helpgovernment/mainHelp.vue
@ -4,16 +4,17 @@ import type { QTableProps } from "quasar";
 import { useQuasar } from "quasar";
 import { useRouter } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
-
+import { useTransferDataStore } from "@/modules/05_placement/store";
 import http from "@/plugins/http";
 import config from "@/app.config";
-
+const transferStore = useTransferDataStore();
+const { statusText } = transferStore;
 import DialogFooter from "@/modules/05_placement/components/PersonalList/DialogFooter.vue";
 import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";

 import type { officerType } from "@/modules/05_placement/interface/response/officer";

-const selected = ref([]);
+const selected = ref<officerType[]>([]);
 const checkSelected = computed(() => {
  if (selected.value.length === 0) {
    return true;
@ -31,6 +32,7 @@ const {
  hideLoader,
  success,
  dialogMessage,
+
  
 } = mixin;

@ -39,18 +41,10 @@ const visibleColumns = ref<string[]>([
  "no",
  "fullname",
  "position",
-  "posNo",
  "positionLevel",
-  "organization",
-  "reason",
-  "status",
-  "date",
-  "salary",
-  "positionTypeOld",
-  "positionLevelOld",
-  "positionNumberOld",
  "organizationPositionOld",
-  "createdAt",
+  "organization",
+  "statusText",
  "btn",
 ]);
 const visibleColumns2 = ref<string[]>([
@ -58,9 +52,9 @@ const visibleColumns2 = ref<string[]>([
  "fullname",
  "position",
  "positionLevel",
-  "oc",
-  "agency",
-  "status",
+  "organizationPositionOld",
+  "organization",
+  "statusText",
 ]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
 const filterKeyword = ref<string>("");
 const filterKeyword2 = ref<string>("");
@ -141,70 +135,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
-  {
-    name: "createdAt",
-    align: "left",
-    label: "วันเวลาที่ขอย้าย",
-    sortable: true,
-    field: "createdAt",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionTypeOld",
-    align: "left",
-    label: "ตำแหน่งในสายงานก่อนหน้า",
-    sortable: true,
-    field: "positionTypeOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionNumberOld",
-    align: "left",
-    label: "เลขที่ตำเเหน่งก่อนหน้า",
-    sortable: true,
-    field: "positionNumberOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "positionLevelOld",
-    align: "left",
-    label: "ระดับก่อนหน้า",
-    sortable: true,
-    field: "positionLevelOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "organizationPositionOld",
-    align: "left",
-    label: "หน่วยงานก่อนหน้า",
-    sortable: true,
-    field: "organizationPositionOld",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "salary",
-    align: "left",
-    label: "เงินเดือนก่อนหน้า",
-    sortable: true,
-    field: "salary",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "reason",
-    align: "left",
-    label: "เหตุผลที่ย้ายหน่วยงาน",
-    sortable: true,
-    field: "reason",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-
  {
    name: "position",
    align: "left",
@ -214,18 +144,6 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
-
-  {
-    name: "posNo",
-    align: "left",
-    label: "เลขที่ตำเเหน่ง",
-    sortable: true,
-    field: "posNo",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-
-
  {
    name: "positionLevel",
    align: "left",
@ -235,7 +153,15 @@ const columns = ref<QTableProps["columns"]>([
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
-
+  {
+    name: "organizationPositionOld",
+    align: "left",
+    label: "สังกัด",
+    sortable: true,
+    field: "organizationPositionOld",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
  {
    name: "organization",
    align: "left",
@ -246,11 +172,11 @@ const columns = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
  {
-    name: "status",
+    name: "statusText",
    align: "left",
    label: "สถานะ",
    sortable: true,
-    field: "status",
+    field: "statusText",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
@ -302,29 +228,29 @@ const columns2 = ref<QTableProps["columns"]>([
    style: "font-size: 14px",
  },
  {
-    name: "oc",
+    name: "organizationPositionOld",
    align: "left",
    label: "สังกัด",
    sortable: true,
-    field: "oc",
+    field: "organizationPositionOld",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "agency",
+    name: "organization",
    align: "left",
    label: "หน่วยงานที่ขอโอนไป",
    sortable: true,
-    field: "agency",
+    field: "organization",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
  {
-    name: "status",
+    name: "statusText",
    align: "left",
    label: "สถานะ",
    sortable: true,
-    field: "status",
+    field: "statusText",
    headerStyle: "font-size: 14px",
    style: "font-size: 14px",
  },
@ -337,7 +263,14 @@ const openDetail = (id:string) => {
 }
 const openModal = () => (modal.value = true);
 const closeModal = () => (modal.value = false);
-
+const openModalOrder = () => {
+  openModal();
+  const row = rows.value.filter(
+    (item: officerType) =>
+      item.status == "WAITTING" || item.status == "PENDING" || item.status == "APPROVE"
+  );
+  rows2.value = row;
+};
 const getData = async () => {
  showLoader();
  await http
@ -355,6 +288,7 @@ const getData = async () => {
        organization: item.organization,
        reason: item.reason,
        status: item.status,
+        statusText:statusText(item.status),
        date: item.date,
        salary: item.salary,
        positionTypeOld: item.positionTypeOld,
@ -364,6 +298,7 @@ const getData = async () => {
        isActive: item.isActive,
      })
      );
+      console.log(rows.value )
    })
    .catch((e) => {
      // messageError($q, e);
@ -372,7 +307,29 @@ const getData = async () => {
      hideLoader();
    });
 };
+const saveOrder = async () => {
+  const id = selected.value.map((item) => item.id);
+  const body = {
+    id,
+  };

+  showLoader();
+  await http
+    .post(config.API.officerMainReport(), body)
+    .then((res: any) => {
+      //   const data = res.data.result;
+      //   console.log(data);
+      success($q, "ส่งไปออกคำสั่งช่วยราชการสำเร็จ");
+      closeModal();
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      await getData();
+      hideLoader();
+    });
+};
 const deleteData = async (id:string) => {
  await http
  .delete(config.API.officerMainDelete(id))
@ -387,6 +344,8 @@ const deleteData = async (id:string) => {
          await getData();
        });
 }
+
+
 const clickDelete = async (name:string,id:string) => {
  dialogMessage(
    $q,
@ -413,14 +372,14 @@ onMounted(async () => {
      <div class="col-12">
        <div class="row col-12">
          <q-btn
-            @click="openModal"
+            @click="openModalOrder"
            size="14px"
            flat
            round
            color="add"
            icon="mdi-account-arrow-right"
          >
-            <q-tooltip>ส่งไปออกคำสั่งโอนออก</q-tooltip>
+            <q-tooltip>ส่งไปออกคำสั่งช่วยราชการ</q-tooltip>
          </q-btn>

          <q-space />
@ -485,77 +444,36 @@ onMounted(async () => {
                <q-td key="fullname" :props="props" @click="openDetail(props.row.id)">
                  {{ props.row.fullname }}
                </q-td>
-                <q-td key="createdAt" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.createdAt }}
-                </q-td>
-                <q-td key="positionTypeOld" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.positionTypeOld }}
-                </q-td>
-                <q-td key="positionNumberOld" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.positionNumberOld }}
-                </q-td>
-                <q-td key="positionLevelOld" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.positionLevelOld }}
-                </q-td>
-                <q-td key="organizationPositionOld" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.organizationPositionOld }}
-                </q-td>
-                <q-td key="salary" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.salary }}
-                </q-td>
-                <q-td key="reason" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.reason }}
-                </q-td>
                <q-td key="position" :props="props" @click="openDetail(props.row.id)">
                  {{ props.row.position }}
                </q-td>
-                <q-td key="posNo" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.posNo }}
-                </q-td>
                <q-td key="positionLevel" :props="props" @click="openDetail(props.row.id)">
                  {{ props.row.positionLevel }}
                </q-td>
+                <q-td key="organizationPositionOld" :props="props" @click="openDetail(props.row.id)">
+                  <div class="table_ellipsis">
+                  {{ props.row.organizationPositionOld }}
+                </div>
+                </q-td>
                <q-td key="organization" :props="props" @click="openDetail(props.row.id)">
+                  <div class="table_ellipsis">
                  {{ props.row.organization }}
+                </div>
                </q-td>
-                <q-td key="agency" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.agency }}
-                </q-td>
-                <q-td key="status" :props="props" @click="openDetail(props.row.id)">
-                  {{ props.row.status }}
+                <q-td key="statusText" :props="props" @click="openDetail(props.row.id)">
+                  {{ props.row.statusText }}
                </q-td>
                <q-td auto-width>
                  <q-btn
-                    icon="mdi-dots-vertical"
-                    size="12px"
-                    color="grey-7"
+                    icon="delete"
+                    size="14px"
+                    color="red-7"
                    flat
                    round
                    dense
+                    @click="clickDelete(props.row.fullname,props.row.id)"
                  >
-                    <q-menu
-                      transition-show="jump-down"
-                      transition-hide="jump-up"
-                    >
-                      <q-list dense style="min-width: 100px">
-
-                        <q-item
-                          clickable
-                          v-close-popup
-                          @click="clickDelete(props.row.fullname,props.row.id)"
-                        >
-                          <q-item-section
-                            style="min-width: 0px"
-                            avatar
-                            class="q-py-sm"
-                          >
-                            <q-tooltip>ลบข้อมูล</q-tooltip>
-                            <q-icon color="red" size="xs" name="mdi-delete" />
-                          </q-item-section>
-                          <q-item-section>ลบ</q-item-section>
-                        </q-item>
-                      </q-list>
-                    </q-menu>
+                  <q-tooltip>ลบข้อมูล</q-tooltip>
                  </q-btn>
                </q-td>
              </q-tr>
@ -568,7 +486,7 @@ onMounted(async () => {

  <q-dialog v-model="modal">
    <q-card style="width: 1200px; max-width: 80vw">
-      <DialogHeader title="ส่งไปออกคำสั่งโอนออก" :close="closeModal" />
+      <DialogHeader title="ส่งไปออกคำสั่งช่วยราชการ" :close="closeModal" />
      <q-separator />
      <q-card-section class="q-pt-none">
        <div class="row justify-end">
@ -660,14 +578,18 @@ onMounted(async () => {
              <q-td key="positionLevel" :props="props">
                {{ props.row.positionLevel }}
              </q-td>
-              <q-td key="oc" :props="props">
-                {{ props.row.oc }}
+              <q-td key="organizationPositionOld" :props="props">
+                <div class="table_ellipsis">
+                {{ props.row.organizationPositionOld }}
+              </div>
              </q-td>
-              <q-td key="agency" :props="props">
-                {{ props.row.agency }}
+              <q-td key="organization" :props="props">
+                <div class="table_ellipsis">
+                {{ props.row.organization }}
+              </div>
              </q-td>
-              <q-td key="status" :props="props">
-                {{ props.row.status }}
+              <q-td key="statusText" :props="props">
+                {{ props.row.statusText }}
              </q-td>
            </q-tr>
          </template>
@ -677,7 +599,7 @@ onMounted(async () => {
      <q-card-actions align="right" class="bg-white text-teal">
        <q-btn
          label="ส่งไปออกคำสั่ง"
-          @click=""
+          @click="saveOrder"
          :disable="checkSelected"
          color="public"
        />