Merge branch 'develop' into dev-tee
This commit is contained in:
setthawutttty
commit
dead2eb39e
21 changed files with 970 additions and 466 deletions
|
|
@ -82,6 +82,7 @@
|
|||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
v-if="!(status == 'REPORT' || status == 'DONE')"
|
||||
/>
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
|
|
@ -616,7 +617,7 @@ const title = ref<ResponseTitle>({
|
|||
positionTypeOld: "",
|
||||
});
|
||||
|
||||
const value = ref<number>(123554);
|
||||
const status = ref<string>("");
|
||||
|
||||
const myForm = ref<QForm | null>(null);
|
||||
const edit = ref<boolean>(false);
|
||||
|
|
@ -790,6 +791,7 @@ const getData = async () => {
|
|||
posNo.value = data.positionNumberOld ?? "";
|
||||
salary.value = data.amountOld ?? 0;
|
||||
reason.value = data.reason ?? "";
|
||||
status.value = data.status ?? "";
|
||||
|
||||
await calRetire(new Date(dateToISO(new Date(data.dateOfBirth))));
|
||||
dateBefore.value = new Date(data.dateOfBirth);
|
||||
|
|
|
|||
|
|
@ -2,12 +2,13 @@
|
|||
import { ref, computed, onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useTransferDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import { useRouter } from "vue-router";
|
||||
import DialogFooter from "@/modules/05_placement/components/Receive/DialogFooter.vue";
|
||||
|
||||
import DialogHeader from "@/modules/05_placement/components/Receive/DialogHeader.vue";
|
||||
import DialogOrgTree from "@/modules/05_placement/components/Receive/receiveModal.vue";
|
||||
|
||||
|
|
@ -20,6 +21,8 @@ import type {
|
|||
const $q = useQuasar();
|
||||
const router = useRouter();
|
||||
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
|
||||
const transferStore = useTransferDataStore();
|
||||
const { statusText } = transferStore;
|
||||
const {
|
||||
showLoader,
|
||||
hideLoader,
|
||||
|
|
@ -34,6 +37,11 @@ const selected = ref<ResponseRow[]>([]);
|
|||
|
||||
const modal = ref<boolean>(false);
|
||||
const popup = () => {
|
||||
const row = filters.value.filter(
|
||||
(r: ResponseRow) =>
|
||||
r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
|
||||
);
|
||||
rows2.value = row;
|
||||
modal.value = true;
|
||||
};
|
||||
|
||||
|
|
@ -46,6 +54,8 @@ const visibleColumns = ref<string[]>([
|
|||
"fullname",
|
||||
"organizationName",
|
||||
"birthday",
|
||||
"dateText",
|
||||
"statusText",
|
||||
]);
|
||||
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
|
|
@ -54,6 +64,8 @@ const visibleColumns2 = ref<string[]>([
|
|||
"fullname",
|
||||
"organizationName",
|
||||
"birthday",
|
||||
"dateText",
|
||||
"statusText",
|
||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterKeyword2 = ref<string>("");
|
||||
|
|
@ -96,6 +108,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "citizenId",
|
||||
|
|
@ -105,6 +119,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
|
|
@ -114,6 +130,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organizationName",
|
||||
|
|
@ -134,6 +152,31 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "birthday",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateText",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "dateText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "statusText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
|
|
@ -145,6 +188,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "citizenId",
|
||||
|
|
@ -154,6 +199,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "citizenId",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
|
|
@ -163,6 +210,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organizationName",
|
||||
|
|
@ -183,6 +232,31 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "birthday",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateText",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "dateText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
label: "สถานะ",
|
||||
sortable: true,
|
||||
field: "statusText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
|
||||
|
|
@ -218,8 +292,12 @@ const fecthlistRecevice = async () => {
|
|||
positionPath: e.positionPath,
|
||||
birthday: e.dateOfBirth == null ? "-" : date2Thai(e.dateOfBirth),
|
||||
status: e.status,
|
||||
statusText: statusText(e.status ?? ""),
|
||||
createdAt: e.createdAt !== null ? new Date(e.createdAt) : null,
|
||||
dateText: e.createdAt !== null ? date2Thai(e.createdAt) : "-",
|
||||
});
|
||||
});
|
||||
// console.log(list);
|
||||
rows.value = list;
|
||||
filters.value = list;
|
||||
})
|
||||
|
|
@ -243,12 +321,6 @@ const checkSelected = computed(() => {
|
|||
}
|
||||
});
|
||||
|
||||
const row = filters.value.filter(
|
||||
(r: ResponseRow) =>
|
||||
r.status == "WAITTING" || r.status == "PENDING" || r.status == "APPROVE"
|
||||
);
|
||||
rows2.value = row;
|
||||
|
||||
const add = () => {
|
||||
router.push(`/receive/add`);
|
||||
};
|
||||
|
|
@ -465,6 +537,20 @@ const saveOrder = async () => {
|
|||
>
|
||||
{{ props.row.birthday }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="dateText"
|
||||
:props="props"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.dateText }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="statusText"
|
||||
:props="props"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.statusText }}
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
icon="mdi-dots-vertical"
|
||||
|
|
@ -483,6 +569,10 @@ const saveOrder = async () => {
|
|||
clickable
|
||||
v-close-popup
|
||||
@click="openModalTree(props.row.personalId)"
|
||||
:disable="
|
||||
props.row.status == 'REPORT' ||
|
||||
props.row.status == 'DONE'
|
||||
"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -490,7 +580,12 @@ const saveOrder = async () => {
|
|||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="primary"
|
||||
:color="
|
||||
props.row.status == 'REPORT' ||
|
||||
props.row.status == 'DONE'
|
||||
? 'grey'
|
||||
: 'primary'
|
||||
"
|
||||
size="xs"
|
||||
name="mdi-bookmark-outline"
|
||||
/>
|
||||
|
|
@ -503,6 +598,10 @@ const saveOrder = async () => {
|
|||
clickable
|
||||
v-close-popup
|
||||
@click="openDelete(props.row.personalId)"
|
||||
:disable="
|
||||
props.row.status == 'REPORT' ||
|
||||
props.row.status == 'DONE'
|
||||
"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -510,7 +609,16 @@ const saveOrder = async () => {
|
|||
class="q-py-sm"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||
<q-icon color="red" size="xs" name="mdi-delete" />
|
||||
<q-icon
|
||||
:color="
|
||||
props.row.status == 'REPORT' ||
|
||||
props.row.status == 'DONE'
|
||||
? 'grey'
|
||||
: 'red'
|
||||
"
|
||||
size="xs"
|
||||
name="mdi-delete"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>ลบ</q-item-section>
|
||||
</q-item>
|
||||
|
|
@ -660,6 +768,16 @@ const saveOrder = async () => {
|
|||
<q-td key="birthday" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.row.birthday }}
|
||||
</q-td>
|
||||
<q-td key="dateText" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.row.dateText }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="statusText"
|
||||
:props="props"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.statusText }}
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</d-table>
|
||||
|
|
|
|||
|
|
@ -39,20 +39,24 @@ const modal = ref<boolean>(false);
|
|||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
"posNo",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
// "organization",
|
||||
"createdAt",
|
||||
"statusText",
|
||||
"btn",
|
||||
]);
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
"posNo",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
// "organization",
|
||||
"createdAt",
|
||||
"statusText",
|
||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
const filterKeyword = ref<string>("");
|
||||
|
|
@ -134,6 +138,15 @@ 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: "position",
|
||||
align: "left",
|
||||
|
|
@ -170,6 +183,18 @@ 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",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
|
|
@ -208,6 +233,15 @@ const columns2 = 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: "position",
|
||||
align: "left",
|
||||
|
|
@ -244,6 +278,18 @@ const columns2 = 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",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
|
|
@ -436,6 +482,13 @@ onMounted(async () => {
|
|||
>
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="posNo"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.posNo }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="position"
|
||||
:props="props"
|
||||
|
|
@ -468,6 +521,13 @@ onMounted(async () => {
|
|||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td
|
||||
key="createdAt"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="statusText"
|
||||
:props="props"
|
||||
|
|
@ -479,11 +539,18 @@ onMounted(async () => {
|
|||
<q-btn
|
||||
icon="delete"
|
||||
size="14px"
|
||||
color="red-7"
|
||||
:color="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
? 'grey'
|
||||
: 'red-7'
|
||||
"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
@click="clickDelete(props.row.fullname, props.row.id)"
|
||||
:disable="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -584,6 +651,9 @@ onMounted(async () => {
|
|||
<q-td key="fullname" :props="props">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="posNo" :props="props">
|
||||
{{ props.row.posNo }}
|
||||
</q-td>
|
||||
<q-td key="position" :props="props">
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
|
|
@ -600,6 +670,9 @@ onMounted(async () => {
|
|||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="createdAt" :props="props">
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td key="statusText" :props="props">
|
||||
{{ props.row.statusText }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,30 @@
|
|||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
รายละเอียดการส่งตัวกลับ {{ fullname }}
|
||||
</div>
|
||||
<q-card bordered class="row col-12 text-dark">
|
||||
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
|
||||
<div class="q-pl-sm text-weight-bold text-subtitle2">{{ fullname }}</div>
|
||||
<q-space />
|
||||
<q-btn outline color="blue" dense icon-right="mdi-open-in-new" class="q-px-sm" label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="router.push(`/registry/${personId}`)" />
|
||||
<q-btn
|
||||
outline
|
||||
color="blue"
|
||||
dense
|
||||
icon-right="mdi-open-in-new"
|
||||
class="q-px-sm"
|
||||
label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="router.push(`/registry/${personId}`)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row col-12 q-pa-md">
|
||||
|
|
@ -60,11 +76,28 @@
|
|||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
v-if="!(status == 'REPORT' || status == 'DONE')"
|
||||
/> -->
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
<q-btn outline color="public" dense class="q-px-sm" label="บันทึก" style="width: 80px" @click="conditionSave" />
|
||||
<q-btn outline color="red" dense class="q-px-sm" label="ยกเลิก" style="width: 80px" @click="cancelBtn" />
|
||||
<q-btn
|
||||
outline
|
||||
color="public"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="บันทึก"
|
||||
style="width: 80px"
|
||||
@click="conditionSave"
|
||||
/>
|
||||
<q-btn
|
||||
outline
|
||||
color="red"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="ยกเลิก"
|
||||
style="width: 80px"
|
||||
@click="cancelBtn"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
|
|
@ -78,64 +111,140 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="organizationPositionOld" :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
||||
hide-bottom-space :label="`${'ตำแหน่ง/สังกัด'}`" type="textarea" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="organizationPositionOld"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่ง/สังกัด'}`"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="positionTypeOld" :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]" hide-bottom-space
|
||||
:label="`${'ตำแหน่งประเภท'}`" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="positionTypeOld"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่งประเภท'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="positionLevelOld" :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]" hide-bottom-space
|
||||
:label="`${'ระดับ'}`" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="positionLevelOld"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ระดับ'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="posNo" :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]" hide-bottom-space
|
||||
:label="`${'เลขที่'}`" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="posNo"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'เลขที่'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-3 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="salary" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]" hide-bottom-space
|
||||
:label="`${'เงินเดือน'}`" type="number" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="salary"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'เงินเดือน'}`"
|
||||
type="number"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="col-xs-6 col-sm-6 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="organization" :rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]" hide-bottom-space
|
||||
:label="`${'โอนไปสังกัด'}`" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="organization"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'โอนไปสังกัด'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 row items-center">
|
||||
<div class="col-12">
|
||||
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="date" :locale="'th'" autoApply
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
:readonly="!edit"
|
||||
v-model="date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:borderless="!edit"
|
||||
:model-value="date !== null ? date2Thai(date) : null"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]" hide-bottom-space :label="`${'ตั้งแต่วัน'}`">
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตั้งแต่วัน'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" :style="edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
">
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
:style="
|
||||
edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
|
|
@ -144,9 +253,19 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="reason" :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]" hide-bottom-space
|
||||
:label="`${'หมายเหตุ '}`" type="textarea" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="reason"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'หมายเหตุ '}`"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -38,6 +38,7 @@ const visibleColumns = ref<string[]>([
|
|||
"organizationPositionOld",
|
||||
"organization",
|
||||
"statustext",
|
||||
"dateText",
|
||||
]);
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
"no",
|
||||
|
|
@ -47,6 +48,7 @@ const visibleColumns2 = ref<string[]>([
|
|||
"organizationPositionOld",
|
||||
"organization",
|
||||
"statustext",
|
||||
"dateText",
|
||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterKeyword2 = ref<string>("");
|
||||
|
|
@ -72,6 +74,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
|
|
@ -81,6 +85,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
|
|
@ -90,6 +96,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "position",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "positionLevel",
|
||||
|
|
@ -99,6 +107,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organizationPositionOld",
|
||||
|
|
@ -108,6 +118,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "organizationPositionOld",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
|
|
@ -117,6 +129,20 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateText",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "dateText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
|
|
@ -126,6 +152,8 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "statustext",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
|
|
@ -137,6 +165,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "no",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "fullname",
|
||||
|
|
@ -146,6 +176,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "fullname",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
|
|
@ -155,6 +187,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "position",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "positionLevel",
|
||||
|
|
@ -164,6 +198,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "positionLevel",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organizationPositionOld",
|
||||
|
|
@ -173,6 +209,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "organizationPositionOld",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
|
|
@ -182,6 +220,20 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateText",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "dateText",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
|
|
@ -191,6 +243,8 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
field: "statustext",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
|
||||
|
|
@ -219,7 +273,9 @@ const getData = async () => {
|
|||
let list: ResponseData[] = [];
|
||||
data.map((r: ResponseData) => {
|
||||
list.push({
|
||||
createdAt: new Date(),
|
||||
dateText:
|
||||
r.createdAt !== null ? date2Thai(new Date(r.createdAt)) : "-",
|
||||
createdAt: r.createdAt !== null ? new Date(r.createdAt) : null,
|
||||
date: new Date(),
|
||||
firstName: r.firstName ?? "",
|
||||
id: r.id ?? "",
|
||||
|
|
@ -384,6 +440,9 @@ const saveOrder = async () => {
|
|||
</q-tooltip> -->
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="dateText" :props="props">
|
||||
{{ props.row.dateText }}
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
|
|
@ -491,6 +550,9 @@ const saveOrder = async () => {
|
|||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="dateText" :props="props">
|
||||
{{ props.row.dateText }}
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -164,6 +164,9 @@
|
|||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
v-if="
|
||||
!(responseData.status == 'REPORT' || responseData.status == 'DONE')
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,30 @@
|
|||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
รายละเอียดการช่วยราชการ {{ fullname }}
|
||||
</div>
|
||||
<q-card bordered class="row col-12 text-dark">
|
||||
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
|
||||
<div class="q-pl-sm text-weight-bold text-subtitle2">{{ fullname }}</div>
|
||||
<q-space />
|
||||
<q-btn outline color="blue" dense icon-right="mdi-open-in-new" class="q-px-sm" label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="router.push(`/registry/${profileId}`)" />
|
||||
<q-btn
|
||||
outline
|
||||
color="blue"
|
||||
dense
|
||||
icon-right="mdi-open-in-new"
|
||||
class="q-px-sm"
|
||||
label="ดูข้อมูลทะเบียนประวัติ"
|
||||
@click="router.push(`/registry/${profileId}`)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row col-12 q-pa-md">
|
||||
|
|
@ -51,12 +67,37 @@
|
|||
</div>
|
||||
<q-space />
|
||||
<div class="q-gutter-sm" v-if="!edit">
|
||||
<q-btn outline color="primary" dense icon-right="mdi-file-edit-outline" class="q-px-sm" label="แก้ไข"
|
||||
style="width: 80px" @click="edit = !edit" />
|
||||
<q-btn
|
||||
outline
|
||||
color="primary"
|
||||
dense
|
||||
icon-right="mdi-file-edit-outline"
|
||||
class="q-px-sm"
|
||||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
v-if="!(status == 'REPORT' || status == 'DONE')"
|
||||
/>
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
<q-btn outline color="public" dense class="q-px-sm" label="บันทึก" style="width: 80px" @click="conditionSave" />
|
||||
<q-btn outline color="red" dense class="q-px-sm" label="ยกเลิก" style="width: 80px" @click="cancelBtn" />
|
||||
<q-btn
|
||||
outline
|
||||
color="public"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="บันทึก"
|
||||
style="width: 80px"
|
||||
@click="conditionSave"
|
||||
/>
|
||||
<q-btn
|
||||
outline
|
||||
color="red"
|
||||
dense
|
||||
class="q-px-sm"
|
||||
label="ยกเลิก"
|
||||
style="width: 80px"
|
||||
@click="cancelBtn"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
|
|
@ -70,9 +111,19 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="organizationPositionOld" :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
||||
hide-bottom-space :label="`${'ตำแหน่ง'}`" type="textarea" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="organizationPositionOld"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่ง'}`"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-xs-6 col-sm-3 row items-center">
|
||||
|
|
@ -143,28 +194,60 @@
|
|||
<div class="col-12"><q-separator /></div>
|
||||
<div class="col-xs-6 col-sm-4 row items-center">
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="organization" :rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]" hide-bottom-space
|
||||
:label="`${'หน่วยงานที่ให้ช่วยราชการ'}`" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="organization"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกโอนไปสังกัด'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'หน่วยงานที่ให้ช่วยราชการ'}`"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-4 row items-center">
|
||||
<div class="col-12">
|
||||
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="dateStart" :locale="'th'" autoApply
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
:readonly="!edit"
|
||||
v-model="dateStart"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense :readonly="!edit" lazy-rules :borderless="!edit"
|
||||
:model-value="dateStart !== null ? date2Thai(dateStart) : null"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]" hide-bottom-space :label="`${'ตั้งแต่วัน'}`">
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
:readonly="!edit"
|
||||
lazy-rules
|
||||
:borderless="!edit"
|
||||
:model-value="
|
||||
dateStart !== null ? date2Thai(dateStart) : null
|
||||
"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตั้งแต่วัน'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" :style="edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
">
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
:style="
|
||||
edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
|
|
@ -174,21 +257,42 @@
|
|||
</div>
|
||||
<div class="col-xs-6 col-sm-4 row items-center">
|
||||
<div class="col-12">
|
||||
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="dateEnd" :locale="'th'" autoApply
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
:readonly="!edit"
|
||||
v-model="dateEnd"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input :readonly="!edit" :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
|
||||
<q-input
|
||||
:readonly="!edit"
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:borderless="!edit"
|
||||
:model-value="dateEnd !== null ? date2Thai(dateEnd) : null"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]" hide-bottom-space :label="`${'ถึงวันที่'}`">
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ถึงวันที่'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" :style="edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
">
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
:style="
|
||||
edit
|
||||
? 'color: var(--q-primary)'
|
||||
: 'color: var(--q-grey)'
|
||||
"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
|
|
@ -197,9 +301,19 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit" :borderless="!edit"
|
||||
v-model="reason" :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]" hide-bottom-space
|
||||
:label="`${'หมายเหตุ '}`" type="textarea" />
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="reason"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'หมายเหตุ '}`"
|
||||
type="textarea"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -270,6 +384,7 @@ const getData = async () => {
|
|||
.get(config.API.officerDetail(dataId))
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
|
||||
(fullname.value = `${data.prefix}${data.firstName} ${data.lastName}`),
|
||||
(id.value = data.id);
|
||||
profileId.value = data.profileId;
|
||||
|
|
@ -316,7 +431,7 @@ const conditionSave = async () => {
|
|||
"ต้องการแก้ไขข้อมูลหรือไม่?",
|
||||
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
|
||||
);
|
||||
}
|
||||
};
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
|
|
|
|||
|
|
@ -39,20 +39,28 @@ const modal = ref<boolean>(false);
|
|||
const visibleColumns = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
"posNo",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
// "organization",
|
||||
"organization",
|
||||
"dateStart",
|
||||
"dateEnd",
|
||||
"createdAt",
|
||||
"statusText",
|
||||
"btn",
|
||||
]);
|
||||
const visibleColumns2 = ref<string[]>([
|
||||
"no",
|
||||
"fullname",
|
||||
"posNo",
|
||||
"position",
|
||||
"positionLevel",
|
||||
"organizationPositionOld",
|
||||
// "organization",
|
||||
"organization",
|
||||
"dateStart",
|
||||
"dateEnd",
|
||||
"createdAt",
|
||||
"statusText",
|
||||
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
|
||||
const filterKeyword = ref<string>("");
|
||||
|
|
@ -134,6 +142,15 @@ 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: "position",
|
||||
align: "left",
|
||||
|
|
@ -170,6 +187,40 @@ const columns = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "dateStart",
|
||||
align: "left",
|
||||
label: "วันเริ่มช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateStart",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateEnd",
|
||||
align: "left",
|
||||
label: "วันสิ้นสุดการช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateEnd",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "createdAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
|
|
@ -208,6 +259,15 @@ const columns2 = 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: "position",
|
||||
align: "left",
|
||||
|
|
@ -244,6 +304,40 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "dateStart",
|
||||
align: "left",
|
||||
label: "วันเริ่มช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateStart",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "dateEnd",
|
||||
align: "left",
|
||||
label: "วันสิ้นสุดการช่วยราชการ",
|
||||
sortable: true,
|
||||
field: "dateEnd",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "createdAt",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "createdAt",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statusText",
|
||||
align: "left",
|
||||
|
|
@ -278,7 +372,7 @@ const getData = async () => {
|
|||
.get(config.API.officerMain())
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
console.log("data==>", data);
|
||||
// console.log("data==>", data);
|
||||
rows.value = data.map((item: officerType) => ({
|
||||
id: item.id,
|
||||
fullname: `${item.prefix}${item.firstName} ${item.lastName}`,
|
||||
|
|
@ -297,8 +391,11 @@ const getData = async () => {
|
|||
positionNumberOld: item.positionNumberOld,
|
||||
organizationPositionOld: item.organizationPositionOld,
|
||||
isActive: item.isActive,
|
||||
dateEnd: item.dateEnd == null ? "-" : date2Thai(new Date(item.dateEnd)),
|
||||
dateStart:
|
||||
item.dateStart == null ? "-" : date2Thai(new Date(item.dateStart)),
|
||||
}));
|
||||
console.log(rows.value);
|
||||
// console.log(rows.value);
|
||||
})
|
||||
.catch((e) => {
|
||||
// messageError($q, e);
|
||||
|
|
@ -436,6 +533,13 @@ onMounted(async () => {
|
|||
>
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="posNo"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.posNo }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="position"
|
||||
:props="props"
|
||||
|
|
@ -468,6 +572,27 @@ onMounted(async () => {
|
|||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td
|
||||
key="dateStart"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.dateStart }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="dateEnd"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.dateEnd }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="createdAt"
|
||||
:props="props"
|
||||
@click="openDetail(props.row.id)"
|
||||
>
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="statusText"
|
||||
:props="props"
|
||||
|
|
@ -479,11 +604,18 @@ onMounted(async () => {
|
|||
<q-btn
|
||||
icon="delete"
|
||||
size="14px"
|
||||
color="red-7"
|
||||
:color="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
? 'grey'
|
||||
: 'red-7'
|
||||
"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
@click="clickDelete(props.row.fullname, props.row.id)"
|
||||
:disable="
|
||||
props.row.status == 'REPORT' || props.row.status == 'DONE'
|
||||
"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -584,6 +716,9 @@ onMounted(async () => {
|
|||
<q-td key="fullname" :props="props">
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td key="posNo" :props="props">
|
||||
{{ props.row.posNo }}
|
||||
</q-td>
|
||||
<q-td key="position" :props="props">
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
|
|
@ -600,6 +735,15 @@ onMounted(async () => {
|
|||
{{ props.row.organization }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="dateStart" :props="props">
|
||||
{{ props.row.dateStart }}
|
||||
</q-td>
|
||||
<q-td key="dateEnd" :props="props">
|
||||
{{ props.row.dateEnd }}
|
||||
</q-td>
|
||||
<q-td key="createdAt" :props="props">
|
||||
{{ props.row.createdAt }}
|
||||
</q-td>
|
||||
<q-td key="statusText" :props="props">
|
||||
{{ props.row.statusText }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -16,6 +16,9 @@ interface ResponseRow {
|
|||
positionPath: string;
|
||||
birthday: string | null;
|
||||
status: string;
|
||||
statusText: string;
|
||||
createdAt: Date | null;
|
||||
dateText: string | null;
|
||||
}
|
||||
|
||||
interface ResponseData {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
interface ResponseData {
|
||||
createdAt: Date;
|
||||
dateText: string | null;
|
||||
createdAt: Date | null;
|
||||
date: Date;
|
||||
firstName: string;
|
||||
id: string;
|
||||
|
|
|
|||
|
|
@ -1,23 +1,25 @@
|
|||
interface officerType {
|
||||
no:number,
|
||||
id: string,
|
||||
prefix: string,
|
||||
firstName: string,
|
||||
lastName: string,
|
||||
position: string,
|
||||
posNo: string,
|
||||
positionLevel: string,
|
||||
createdAt: Date,
|
||||
organization: string,
|
||||
reason: string,
|
||||
status: string,
|
||||
date: Date,
|
||||
salary: number,
|
||||
positionTypeOld: string,
|
||||
positionLevelOld: string,
|
||||
positionNumberOld: string,
|
||||
organizationPositionOld: string,
|
||||
isActive: true
|
||||
no: number;
|
||||
id: string;
|
||||
prefix: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
position: string;
|
||||
posNo: string;
|
||||
positionLevel: string;
|
||||
createdAt: Date;
|
||||
organization: string;
|
||||
reason: string;
|
||||
status: string;
|
||||
date: Date;
|
||||
salary: number;
|
||||
positionTypeOld: string;
|
||||
positionLevelOld: string;
|
||||
positionNumberOld: string;
|
||||
organizationPositionOld: string;
|
||||
isActive: boolean;
|
||||
dateEnd: string;
|
||||
dateStart: string;
|
||||
}
|
||||
|
||||
export type { officerType};
|
||||
export type { officerType };
|
||||
|
|
|
|||
|
|
@ -99,6 +99,18 @@ const columns = ref<QTableProps["columns"]>([
|
|||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "datetext",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "datetext",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
align: "left",
|
||||
|
|
@ -119,6 +131,7 @@ const visibleColumns = ref<string[]>([
|
|||
"positionLevelOld",
|
||||
"positionNumberOld",
|
||||
"organizationPositionOld",
|
||||
"datetext",
|
||||
"statustext",
|
||||
]);
|
||||
|
||||
|
|
@ -203,6 +216,18 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "datetext",
|
||||
align: "left",
|
||||
label: "วันที่ดำเนินการ",
|
||||
sortable: true,
|
||||
field: "datetext",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
sortOrder: "da",
|
||||
},
|
||||
{
|
||||
name: "statustext",
|
||||
align: "left",
|
||||
|
|
@ -223,6 +248,7 @@ const visibleColumns2 = ref<string[]>([
|
|||
"positionLevelOld",
|
||||
"positionNumberOld",
|
||||
"organizationPositionOld",
|
||||
"datetext",
|
||||
"statustext",
|
||||
]);
|
||||
|
||||
|
|
@ -270,8 +296,10 @@ const fecthlist = async () => {
|
|||
|
||||
data.map((r: ResponseItems) => {
|
||||
list.push({
|
||||
datetext:
|
||||
r.createdAt == null ? "-" : date2Thai(new Date(r.createdAt)),
|
||||
activeDate: new Date(),
|
||||
createdAt: new Date(),
|
||||
createdAt: new Date(r.createdAt),
|
||||
firstName: r.firstName ?? "",
|
||||
id: r.id ?? "",
|
||||
isActive: r.isActive ? r.isActive : false,
|
||||
|
|
@ -429,6 +457,9 @@ const saveOrder = async () => {
|
|||
{{ props.row.organizationPositionOld }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="datetext" :props="props">
|
||||
{{ props.row.datetext }}
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
|
|
@ -538,6 +569,9 @@ const saveOrder = async () => {
|
|||
{{ props.row.organizationPositionOld }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td key="datetext" :props="props">
|
||||
{{ props.row.datetext }}
|
||||
</q-td>
|
||||
<q-td key="statustext" :props="props">
|
||||
{{ props.row.statustext }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -147,6 +147,7 @@
|
|||
label="แก้ไข"
|
||||
style="width: 80px"
|
||||
@click="edit = !edit"
|
||||
v-if="!(status == 'REPORT' || status == 'DONE')"
|
||||
/>
|
||||
</div>
|
||||
<div class="q-gutter-sm" v-else>
|
||||
|
|
@ -488,6 +489,7 @@ const id = ref<string>(route.params.id.toString());
|
|||
const myForm = ref<QForm | null>(null);
|
||||
const edit = ref<boolean>(false);
|
||||
const dataDetail = ref<ResponseItems>({
|
||||
datetext: "",
|
||||
activeDate: new Date(),
|
||||
createdAt: new Date(),
|
||||
firstName: "",
|
||||
|
|
@ -518,6 +520,7 @@ const date = ref<Date | null>(null);
|
|||
const dateLeave = ref<Date | null>(null);
|
||||
const reason = ref<string>("");
|
||||
const location = ref<string>("");
|
||||
const status = ref<string>("");
|
||||
|
||||
// const modalPass = ref<boolean>(false);
|
||||
// const modalPassNot = ref<boolean>(false);
|
||||
|
|
@ -531,6 +534,7 @@ const fetchData = async (id: string) => {
|
|||
.get(config.API.resingByid(id))
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
console.log(data);
|
||||
dataDetail.value = data;
|
||||
|
||||
organizationPositionOld.value = data.organizationPositionOld ?? "";
|
||||
|
|
@ -542,6 +546,7 @@ const fetchData = async (id: string) => {
|
|||
dateLeave.value = data.activeDate ? new Date(data.activeDate) : null;
|
||||
reason.value = data.reason ?? "";
|
||||
location.value = data.location ?? "";
|
||||
status.value = data.status ?? "";
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
|
|
|
|||
|
|
@ -27,6 +27,7 @@ interface ResponseItems {
|
|||
status: string;
|
||||
statustext: string;
|
||||
fullname: string;
|
||||
datetext: string | null;
|
||||
}
|
||||
|
||||
export type { resMain, ResponseItems };
|
||||
|
|
|
|||
|
|
@ -31,7 +31,6 @@ const visibleColumns = ref<string[]>([
|
|||
"position",
|
||||
"level",
|
||||
"salary",
|
||||
"organization",
|
||||
"insigniaType",
|
||||
"insigniaSend",
|
||||
"insigniaLevel",
|
||||
|
|
@ -93,15 +92,7 @@ const columns = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
align: "left",
|
||||
label: "หน่วยงาน",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
|
||||
{
|
||||
name: "insigniaType",
|
||||
align: "left",
|
||||
|
|
@ -139,61 +130,6 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows = ref<any[]>([
|
||||
{
|
||||
no: "1",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายใจดี ยอดใจ ",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "1",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "2",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายจักกริน บัณฑิต",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "3",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวกัณฐิมา กาฬสินธุ์",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "4",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวเมขลา กระจ่างมนตรี",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
]);
|
||||
|
||||
const columns2 = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -232,7 +168,7 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
align: "left",
|
||||
},
|
||||
]);
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
|
||||
const rows2 = ref<any[]>([]);
|
||||
|
||||
const Note = ref<string>("");
|
||||
|
|
@ -254,12 +190,11 @@ const props = defineProps({
|
|||
type: Function,
|
||||
},
|
||||
});
|
||||
const typeinsignia = ref<number | string>("all");
|
||||
const typeinsigniaOptions = reactive<any>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
const typeinsigniaValues: Set<number> = new Set();
|
||||
|
||||
onMounted(async () => {
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
organization.value = organizationOptions.value[2].id;
|
||||
DataStore.typeOc = organization.value;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
|
|
@ -271,7 +206,6 @@ onMounted(async () => {
|
|||
"officer",
|
||||
props.tab
|
||||
);
|
||||
filtertypeInsignia();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -345,7 +279,7 @@ const clickAdd = async (id: string) => {
|
|||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
addlistperson(id);
|
||||
await addlistperson(id);
|
||||
},
|
||||
"ยืนยันการเพิ่มรายชื่อขอพระราชทานเครื่องราชฯ",
|
||||
"ต้องการยืนยันการเพิ่มรายชื่อขอพระราชทานเครื่องราชฯ นี้หรือไม่ ?"
|
||||
|
|
@ -389,7 +323,11 @@ const addlistperson = async (id: string) => {
|
|||
// actionModal.value = action;
|
||||
// modalNote.value = true;
|
||||
// };
|
||||
const clickmodalEdit = () => {
|
||||
const clickmodalEdit = (props: any) => {
|
||||
insignia.value = "";
|
||||
insigniaType.value = "";
|
||||
person.value = props;
|
||||
console.log(person.value);
|
||||
modalEdit.value = true;
|
||||
fecthInsignia();
|
||||
fecthInsigniaType();
|
||||
|
|
@ -398,62 +336,95 @@ const clickSave = () => {
|
|||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
await listEdit();
|
||||
await listEdit(person.value.id);
|
||||
},
|
||||
"ยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอ",
|
||||
"ต้องการยืนยันการแก้ไขเครื่องราชฯ ที่ยื่นขอนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const listEdit = async () => {
|
||||
let data = { insigniaId: organization.value };
|
||||
console.log(data);
|
||||
const listEdit = async (profileId: string) => {
|
||||
let data: any = {
|
||||
insigniaId: insignia.value,
|
||||
insigniaTypeId: insigniaType.value,
|
||||
};
|
||||
await http
|
||||
.get(config.API.insigniaEdit(), data)
|
||||
.put(config.API.insigniaEdit(profileId), data)
|
||||
.then(() => {
|
||||
success($q, "แก้ไขเครื่องราชฯ ที่ยื่นขอสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(async () => {
|
||||
modalEdit.value = false;
|
||||
if (props.fecthInsigniaByOc) {
|
||||
await props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
const clickReject = () => {
|
||||
const clickReject = (profileId: string) => {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
async () => {
|
||||
await listreject();
|
||||
await listreject(profileId);
|
||||
},
|
||||
"ยืนยันการย้ายข้อมูล",
|
||||
"ต้องการยืนยันการย้ายข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const listreject = async () => {
|
||||
const listreject = async (profileId: string) => {
|
||||
await http
|
||||
.get(config.API.insigniaReject())
|
||||
.get(config.API.insigniaReject(profileId))
|
||||
.then(() => {
|
||||
success($q, "ย้ายข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(async () => {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
await props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
const clickDelete = () => {
|
||||
const clickDelete = (profileId: string) => {
|
||||
dialogRemove(
|
||||
$q,
|
||||
async () => {
|
||||
await listdelete();
|
||||
await listdelete(profileId);
|
||||
},
|
||||
"ยืนยันการลบออกข้ออมูล",
|
||||
"ต้องการยืนยันการลบข้อมูลนี้หรือไม่ ?"
|
||||
);
|
||||
};
|
||||
const listdelete = async () => {
|
||||
const listdelete = async (profileId: string) => {
|
||||
await http
|
||||
.get(config.API.insigniaDelete())
|
||||
.get(config.API.insigniaDelete(profileId))
|
||||
.then(() => {
|
||||
success($q, "ลบข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(async () => {
|
||||
if (props.fecthInsigniaByOc) {
|
||||
await props.fecthInsigniaByOc(
|
||||
props.roundId,
|
||||
organization.value,
|
||||
"officer",
|
||||
props.tab
|
||||
);
|
||||
}
|
||||
});
|
||||
};
|
||||
const insignia = ref<string>("");
|
||||
|
|
@ -477,32 +448,6 @@ const fecthInsigniaType = async () => {
|
|||
.catch((err) => {});
|
||||
};
|
||||
|
||||
const listinsignia = ref<any>([]);
|
||||
const filtertypeInsignia = async () => {
|
||||
listinsignia.value = rows.value;
|
||||
for (const data of listinsignia.value) {
|
||||
const Type = data.insigniaType;
|
||||
if (Type !== null && !typeinsigniaValues.has(Type)) {
|
||||
typeinsigniaOptions.push({
|
||||
id: Type.toString(),
|
||||
name: Type.toString(),
|
||||
});
|
||||
typeinsigniaValues.add(Type);
|
||||
}
|
||||
}
|
||||
};
|
||||
const searchFilterTable = async () => {
|
||||
if (typeinsignia.value !== undefined && typeinsignia.value !== null) {
|
||||
if (typeinsignia.value === "all") {
|
||||
rows.value = listinsignia.value;
|
||||
} else {
|
||||
rows.value = listinsignia.value.filter(
|
||||
(e) => e.insigniaType === typeinsignia.value
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterKeyword2 = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
|
|
@ -538,6 +483,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
<div class="col-12 row q-pa-md">
|
||||
<div class="row col-12">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<!-- {{ DataStore.typeinsigniaOptions }} -->
|
||||
<q-select
|
||||
v-model="organization"
|
||||
label="หน่วยงาน"
|
||||
|
|
@ -557,12 +503,12 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<q-select
|
||||
v-model="typeinsignia"
|
||||
v-model="DataStore.typeinsignia"
|
||||
label="ปรเภทเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="typeinsigniaOptions"
|
||||
:options="DataStore.typeinsigniaOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
|
|
@ -572,7 +518,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="searchFilterTable"
|
||||
@update:model-value="DataStore.searchFilterTable"
|
||||
/>
|
||||
<div>
|
||||
<q-btn size="md" icon="mdi-download" flat round color="primary">
|
||||
|
|
@ -632,7 +578,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
<q-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:rows="DataStore.rows"
|
||||
:filter="filterKeyword"
|
||||
row-key="name"
|
||||
flat
|
||||
|
|
@ -672,9 +618,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
<q-td key="salary" :props="props">
|
||||
{{ props.row.salary }}
|
||||
</q-td>
|
||||
<q-td key="organization" :props="props">
|
||||
{{ props.row.organization }}
|
||||
</q-td>
|
||||
|
||||
<q-td key="insigniaType" :props="props">
|
||||
{{ props.row.insigniaType }}
|
||||
</q-td>
|
||||
|
|
@ -718,7 +662,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="clickReject(props.row)"
|
||||
@click="clickReject(props.row.profileId)"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -737,7 +681,7 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="clickDelete(props.row)"
|
||||
@click="clickDelete(props.row.profileId)"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
|
|
@ -884,33 +828,12 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
/>
|
||||
</q-toolbar>
|
||||
<q-separator />
|
||||
|
||||
<div class="q-pa-md">
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col">
|
||||
<q-select
|
||||
v-model="insigniaType"
|
||||
label="ประเภทเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="insigniaTypeOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
:readonly="false"
|
||||
:borderless="false"
|
||||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-select
|
||||
v-model="insignia"
|
||||
label="ชั้นเครื่องราชฯ"
|
||||
label="ชื่อเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
|
|
@ -924,7 +847,25 @@ const paginationLabel2 = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<q-select
|
||||
v-model="insigniaType"
|
||||
label="ชั้นเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="insigniaTypeOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
:readonly="false"
|
||||
:borderless="false"
|
||||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ const visibleColumns = ref<string[]>([
|
|||
"position",
|
||||
"level",
|
||||
"salary",
|
||||
"organization",
|
||||
|
||||
"insigniaType",
|
||||
"insigniaSend",
|
||||
"insigniaLevel",
|
||||
|
|
@ -92,15 +92,6 @@ const columns = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
align: "left",
|
||||
label: "หน่วยงาน",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "insigniaType",
|
||||
align: "left",
|
||||
|
|
@ -139,63 +130,11 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows = ref<any[]>([
|
||||
{
|
||||
no: "1",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายใจดี ยอดใจ ",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "1",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "2",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายจักกริน บัณฑิต",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "3",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวกัณฐิมา กาฬสินธุ์",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "4",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวเมขลา กระจ่างมนตรี",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
]);
|
||||
|
||||
onMounted(async () => {
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
DataStore.typeOc = organization.value;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
|
|
@ -207,7 +146,6 @@ onMounted(async () => {
|
|||
"officer",
|
||||
props.tab
|
||||
);
|
||||
filtertypeInsignia();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -222,35 +160,6 @@ const changtypeOc = () => {
|
|||
}
|
||||
};
|
||||
|
||||
const typeinsignia = ref<number | string>("all");
|
||||
const typeinsigniaOptions = reactive<any>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
const typeinsigniaValues: Set<number> = new Set();
|
||||
const listinsignia = ref<any>([]);
|
||||
const filtertypeInsignia = async () => {
|
||||
listinsignia.value = rows.value;
|
||||
for (const data of listinsignia.value) {
|
||||
const Type = data.insigniaType;
|
||||
if (Type !== null && !typeinsigniaValues.has(Type)) {
|
||||
typeinsigniaOptions.push({
|
||||
id: Type.toString(),
|
||||
name: Type.toString(),
|
||||
});
|
||||
typeinsigniaValues.add(Type);
|
||||
}
|
||||
}
|
||||
};
|
||||
const searchFilterTable = async () => {
|
||||
if (typeinsignia.value !== undefined && typeinsignia.value !== null) {
|
||||
if (typeinsignia.value === "all") {
|
||||
rows.value = listinsignia.value;
|
||||
} else {
|
||||
rows.value = listinsignia.value.filter(
|
||||
(e) => e.insigniaType === typeinsignia.value
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
const resetFilter = () => {
|
||||
|
|
@ -272,6 +181,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<template>
|
||||
<div class="col-12 row q-pa-md">
|
||||
<div class="row col-12">
|
||||
<!-- {{ DataStore.typeinsigniaOptions }} -->
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<q-select
|
||||
v-model="organization"
|
||||
|
|
@ -292,12 +202,12 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<q-select
|
||||
v-model="typeinsignia"
|
||||
v-model="DataStore.typeinsignia"
|
||||
label="ปรเภทเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="typeinsigniaOptions"
|
||||
:options="DataStore.typeinsigniaOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
|
|
@ -307,7 +217,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="searchFilterTable"
|
||||
@update:model-value="DataStore.searchFilterTable"
|
||||
/>
|
||||
<q-space />
|
||||
|
||||
|
|
@ -352,7 +262,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<q-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:rows="DataStore.rows"
|
||||
:filter="filterKeyword"
|
||||
row-key="name"
|
||||
flat
|
||||
|
|
@ -395,9 +305,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<q-td key="salary" :props="props">
|
||||
{{ props.row.salary }}
|
||||
</q-td>
|
||||
<q-td key="organization" :props="props">
|
||||
{{ props.row.organization }}
|
||||
</q-td>
|
||||
|
||||
<q-td key="insigniaType" :props="props">
|
||||
{{ props.row.insigniaType }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -30,7 +30,6 @@ const visibleColumns = ref<string[]>([
|
|||
"position",
|
||||
"level",
|
||||
"salary",
|
||||
"organization",
|
||||
"insigniaType",
|
||||
"insigniaSend",
|
||||
"insigniaLevel",
|
||||
|
|
@ -91,15 +90,6 @@ const columns = ref<QTableProps["columns"]>([
|
|||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "organization",
|
||||
align: "left",
|
||||
label: "หน่วยงาน",
|
||||
sortable: true,
|
||||
field: "organization",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "insigniaType",
|
||||
align: "left",
|
||||
|
|
@ -137,64 +127,10 @@ const columns = ref<QTableProps["columns"]>([
|
|||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows = ref<any[]>([
|
||||
{
|
||||
no: "1",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายใจดี ยอดใจ ",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "1",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "2",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นายจักกริน บัณฑิต",
|
||||
position: "นักวิชาการพัสดุ",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "3",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวกัณฐิมา กาฬสินธุ์",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
{
|
||||
no: "4",
|
||||
citizenId: "1xxxxxxxxxx",
|
||||
name: "นางสาวเมขลา กระจ่างมนตรี",
|
||||
position: "นักจัดการงานทั่วไป",
|
||||
level: "ปฏิบัติการ",
|
||||
salary: "15000",
|
||||
organization: "บริหาร",
|
||||
insigniaType: "ทวีติยาภรณ์ช้างเผือก",
|
||||
insigniaSend: "ตริตาภรณ์ช้างเผือก",
|
||||
insigniaLevel: "ต่ำกว่าสายสะพาย",
|
||||
dateSend: "31 ม.ค. 2566",
|
||||
},
|
||||
]);
|
||||
onMounted(async () => {
|
||||
organizationOptions.value = DataStore.optionsTypeOc;
|
||||
organization.value = organizationOptions.value[0].id;
|
||||
DataStore.typeOc = organization.value;
|
||||
// if (props.fecthInsigniaAll) {
|
||||
// await props.fecthInsigniaAll(props.roundId, props.tab);
|
||||
// }
|
||||
|
|
@ -206,7 +142,6 @@ onMounted(async () => {
|
|||
"officer",
|
||||
props.tab
|
||||
);
|
||||
filtertypeInsignia();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -221,35 +156,6 @@ const changtypeOc = () => {
|
|||
}
|
||||
};
|
||||
|
||||
const typeinsignia = ref<number | string>("all");
|
||||
const typeinsigniaOptions = reactive<any>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
const typeinsigniaValues: Set<number> = new Set();
|
||||
const listinsignia = ref<any>([]);
|
||||
const filtertypeInsignia = async () => {
|
||||
listinsignia.value = rows.value;
|
||||
for (const data of listinsignia.value) {
|
||||
const Type = data.insigniaType;
|
||||
if (Type !== null && !typeinsigniaValues.has(Type)) {
|
||||
typeinsigniaOptions.push({
|
||||
id: Type.toString(),
|
||||
name: Type.toString(),
|
||||
});
|
||||
typeinsigniaValues.add(Type);
|
||||
}
|
||||
}
|
||||
};
|
||||
const searchFilterTable = async () => {
|
||||
if (typeinsignia.value !== undefined && typeinsignia.value !== null) {
|
||||
if (typeinsignia.value === "all") {
|
||||
rows.value = listinsignia.value;
|
||||
} else {
|
||||
rows.value = listinsignia.value.filter(
|
||||
(e) => e.insigniaType === typeinsignia.value
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
const resetFilter = () => {
|
||||
|
|
@ -291,12 +197,12 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
@update:model-value="changtypeOc"
|
||||
/>
|
||||
<q-select
|
||||
v-model="typeinsignia"
|
||||
v-model="DataStore.typeinsignia"
|
||||
label="ปรเภทเครื่องราชฯ"
|
||||
dense
|
||||
emit-value
|
||||
map-options
|
||||
:options="typeinsigniaOptions"
|
||||
:options="DataStore.typeinsigniaOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
lazy-rules
|
||||
|
|
@ -306,7 +212,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
:outlined="true"
|
||||
:hide-dropdown-icon="false"
|
||||
style="min-width: 150px"
|
||||
@update:model-value="searchFilterTable"
|
||||
@update:model-value="DataStore.searchFilterTable"
|
||||
/>
|
||||
<q-space />
|
||||
|
||||
|
|
@ -351,7 +257,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<q-table
|
||||
ref="table"
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:rows="DataStore.rows"
|
||||
:filter="filterKeyword"
|
||||
row-key="name"
|
||||
flat
|
||||
|
|
@ -394,9 +300,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
<q-td key="salary" :props="props">
|
||||
{{ props.row.salary }}
|
||||
</q-td>
|
||||
<q-td key="organization" :props="props">
|
||||
{{ props.row.organization }}
|
||||
</q-td>
|
||||
|
||||
<q-td key="insigniaType" :props="props">
|
||||
{{ props.row.insigniaType }}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -36,13 +36,12 @@ const stat = ref<any>({
|
|||
disclaim: 0,
|
||||
});
|
||||
onMounted(async () => {
|
||||
console.log(DataStore.optionsTypeOc);
|
||||
await fecthlistRound();
|
||||
await fecthType();
|
||||
});
|
||||
const fecthlistRound = async () => {
|
||||
await http
|
||||
.get(config.API.listRoundInsignia("insignia"))
|
||||
.get(config.API.listRoundInsignia())
|
||||
.then((res: any) => {
|
||||
optionRound.value = res.data.result.map((e: any) => ({
|
||||
id: e.period_id,
|
||||
|
|
@ -84,8 +83,6 @@ const fecthStat = async (id: string) => {
|
|||
.get(config.API.insigniaDashboard(id))
|
||||
.then((res) => {
|
||||
stat.value = res.data.result;
|
||||
// console.log(res);
|
||||
console.log(stat.value);
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
|
|
@ -96,6 +93,7 @@ const fecthStat = async (id: string) => {
|
|||
};
|
||||
const changround = () => {
|
||||
fecthStat(round.value);
|
||||
fecthInsigniaByOc(round.value, DataStore.typeOc, "officer", tab.value);
|
||||
};
|
||||
const fecthInsigniaAll = async (periodId: string, tab: string) => {
|
||||
// let data: any = [];
|
||||
|
|
@ -118,14 +116,20 @@ const fecthInsigniaByOc = async (
|
|||
role: string,
|
||||
status: string
|
||||
) => {
|
||||
console.log(status);
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.insigniaList(roundId, ocId, role, status))
|
||||
.then((res) => {
|
||||
.then(async (res) => {
|
||||
console.log(res);
|
||||
|
||||
await DataStore.fetchData(res.data.result.items);
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
// messageError($q);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
|
@ -143,6 +147,7 @@ const fecthInsigniaByOc = async (
|
|||
v-model="round"
|
||||
:options="optionRound"
|
||||
map-options
|
||||
emit-value
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
@update:model-value="changround"
|
||||
|
|
|
|||
|
|
@ -1,9 +1,73 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { ref, } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
const mixin = useCounterMixin();
|
||||
const {
|
||||
date2Thai
|
||||
} = mixin;
|
||||
|
||||
|
||||
export const useInsigniaDataStore = defineStore("insignia", () => {
|
||||
let optionsTypeOc = ref<any>([]);
|
||||
let typeOc = ref<string>("")
|
||||
let rows = ref<any>([])
|
||||
const listinsignia = ref<any>([])
|
||||
const typeinsigniaValues: Set<number> = new Set();
|
||||
const typeinsignia = ref<number | string>("all");
|
||||
let typeinsigniaOptions = ref<any>([{ id: "all", name: "ทั้งหมด" }]);
|
||||
|
||||
|
||||
const fetchData = async (data: any) => {
|
||||
if (data !== null) {
|
||||
rows.value = await data.map((e: any) =>
|
||||
({
|
||||
id: e.id,
|
||||
profileId: e.profileId,
|
||||
name: e.fullName,
|
||||
position: e.position,
|
||||
level: e.rank,
|
||||
salary2: e.salary,
|
||||
salary: Number(e.salary).toLocaleString(),
|
||||
insigniaType: e.lastInsignia,
|
||||
insigniaSend: e.requestInsignia,
|
||||
insigniaLevel: e.level,
|
||||
dateSend: date2Thai(e.requestDate),
|
||||
}))
|
||||
listinsignia.value = await rows.value
|
||||
filtertypeInsignia()
|
||||
} else rows.value = []
|
||||
|
||||
|
||||
}
|
||||
const filtertypeInsignia = async () => {
|
||||
typeinsignia.value = "all"
|
||||
for (const data of listinsignia.value) {
|
||||
const Type = data.insigniaType;
|
||||
if (Type !== null && !typeinsigniaValues.has(Type)) {
|
||||
typeinsigniaOptions.value.push({ id: Type, name: Type })
|
||||
typeinsigniaValues.add(Type);
|
||||
}
|
||||
}
|
||||
};
|
||||
const searchFilterTable = async () => {
|
||||
if (typeinsignia.value !== undefined && typeinsignia.value !== null) {
|
||||
if (typeinsignia.value === "all") {
|
||||
rows.value = listinsignia.value;
|
||||
} else {
|
||||
rows.value = listinsignia.value.filter(
|
||||
(e: any) => e.insigniaType === typeinsignia.value
|
||||
);
|
||||
}
|
||||
}
|
||||
};
|
||||
return {
|
||||
optionsTypeOc
|
||||
optionsTypeOc,
|
||||
typeOc,
|
||||
rows,
|
||||
typeinsigniaOptions,
|
||||
typeinsignia,
|
||||
fetchData,
|
||||
searchFilterTable,
|
||||
|
||||
};
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue