Merge branch 'develop' into warunee-dev
This commit is contained in:
commit
56ebfb89c7
24 changed files with 3319 additions and 1016 deletions
|
|
@ -97,7 +97,7 @@
|
|||
map-options
|
||||
option-label="name"
|
||||
:options="OrderTypeOption"
|
||||
option-value="id"
|
||||
option-value="name"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
:readonly="false"
|
||||
|
|
@ -115,7 +115,7 @@
|
|||
map-options
|
||||
option-label="name"
|
||||
:options="OrderStatusOption"
|
||||
option-value="id"
|
||||
option-value="name"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
:readonly="false"
|
||||
|
|
@ -153,54 +153,30 @@
|
|||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
key="Order"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-tr
|
||||
:props="props"
|
||||
class="cursor-pointer"
|
||||
@click="redirectToPage(props.row.orderId)"
|
||||
>
|
||||
<q-td key="Order" :props="props">
|
||||
{{ props.row.Order }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="OrderNum"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-td key="OrderNum" :props="props">
|
||||
{{ props.row.OrderNum }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="OrderType"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.OrderType)"
|
||||
>
|
||||
<q-td key="OrderType" :props="props">
|
||||
{{ props.row.OrderType }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="OrderDate"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-td key="OrderDate" :props="props">
|
||||
{{ props.row.OrderDate }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="OrderBy"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-td key="OrderBy" :props="props">
|
||||
{{ props.row.OrderBy }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="Signer"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-td key="Signer" :props="props">
|
||||
{{ props.row.Signer }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="OrderStatus"
|
||||
:props="props"
|
||||
@click="redirectToPage(props.row.Order)"
|
||||
>
|
||||
<q-td key="OrderStatus" :props="props">
|
||||
{{ props.row.OrderStatus }}
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
|
|
@ -210,7 +186,7 @@
|
|||
flat
|
||||
round
|
||||
color="red"
|
||||
@click="clickDelete(props.row.id)"
|
||||
@click.stop="clickDelete(props.row.orderId)"
|
||||
icon="mdi-delete"
|
||||
>
|
||||
<q-tooltip>ลบข้อมูล</q-tooltip>
|
||||
|
|
@ -241,14 +217,23 @@
|
|||
import { onMounted, reactive, ref, useAttrs, computed } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { FormOrderPlacementMainData } from "@/modules/05_placement/interface/request/Main";
|
||||
import type { DataOption } from "@/modules/05_placement/interface/index/Main";
|
||||
import type {
|
||||
DataOption,
|
||||
DataOption1,
|
||||
} from "@/modules/05_placement/interface/index/Main";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useOrderPlacementDataStore } from "@/modules/05_placement/store";
|
||||
import router from "@/router";
|
||||
import { useQuasar } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError, date2Thai, dateText, success } =
|
||||
mixin;
|
||||
const DataStore = useOrderPlacementDataStore();
|
||||
|
||||
const pagination = ref({
|
||||
sortBy: "desc",
|
||||
descending: false,
|
||||
|
|
@ -256,9 +241,6 @@ const pagination = ref({
|
|||
rowsPerPage: 10,
|
||||
});
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { dateText } = mixin;
|
||||
|
||||
// แปลงเวลา ค.ศ ให้เป็น พ.ศ
|
||||
const textDate = (value: Date) => {
|
||||
return dateText(value);
|
||||
|
|
@ -364,146 +346,17 @@ const columns = ref<QTableProps["columns"]>([
|
|||
|
||||
// ข้อมูลตาราง (จำลอง)
|
||||
const rows = ref<FormOrderPlacementMainData[]>([
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2565",
|
||||
fiscalYear: 2565,
|
||||
OrderDate: "30 พ.ค. 2565",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "จัดทำร่างคำสั่ง",
|
||||
OrderType: "คำสั่งย้าย",
|
||||
},
|
||||
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2565",
|
||||
fiscalYear: 2565,
|
||||
OrderDate: "30 พ.ค. 2565",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "จัดทำร่างคำสั่ง",
|
||||
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2564",
|
||||
fiscalYear: 2564,
|
||||
OrderDate: "30 พ.ค. 2564",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "บัญชีแนบท้าย",
|
||||
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2564",
|
||||
fiscalYear: 2564,
|
||||
OrderDate: "30 พ.ค. 2564",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "บัญชีแนบท้าย",
|
||||
OrderType: "คำสั่งย้าย",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2564",
|
||||
fiscalYear: 2564,
|
||||
OrderDate: "30 พ.ค. 2564",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ส่งสำเนาคำสั่ง",
|
||||
OrderType: "คำสั่งย้าย",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2564",
|
||||
fiscalYear: 2564,
|
||||
OrderDate: "30 พ.ค. 2564",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ส่งสำเนาคำสั่ง",
|
||||
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2566",
|
||||
fiscalYear: 2566,
|
||||
OrderDate: "30 พ.ค. 2566",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "รอลงนาม",
|
||||
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2566",
|
||||
fiscalYear: 2566,
|
||||
OrderDate: "30 พ.ค. 2566",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2565",
|
||||
fiscalYear: 2565,
|
||||
OrderDate: "30 พ.ค. 2565",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งบรรจุและแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2566",
|
||||
fiscalYear: 2566,
|
||||
OrderDate: "30 พ.ค. 2566",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งแต่งตั้ง",
|
||||
},
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2566",
|
||||
fiscalYear: 2566,
|
||||
OrderDate: "30 พ.ค. 2566",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งย้าย",
|
||||
},
|
||||
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2564",
|
||||
fiscalYear: 2564,
|
||||
OrderDate: "30 พ.ค. 2564",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งแต่งตั้ง",
|
||||
},
|
||||
|
||||
{
|
||||
Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
OrderNum: "1/2566",
|
||||
fiscalYear: 2566,
|
||||
OrderDate: "30 พ.ค. 2566",
|
||||
OrderBy: "สำนักงาน กทม.",
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: "ออกคำสั่งแล้ว",
|
||||
OrderType: "คำสั่งแต่งตั้ง",
|
||||
},
|
||||
// {
|
||||
// Order: "คำสั่งแต่งตั้งผู้สอบแข่งขันได้",
|
||||
// OrderNum: "1/2565",
|
||||
// fiscalYear: 2565,
|
||||
// OrderDate: "30 พ.ค. 2565",
|
||||
// OrderBy: "สำนักงาน กทม.",
|
||||
// Signer: "นาม สมคิด ยอดใจ ",
|
||||
// OrderStatus: "จัดทำร่างคำสั่ง",
|
||||
// OrderType: "คำสั่งย้าย",
|
||||
// },
|
||||
]);
|
||||
// const OrderStatusOption = [
|
||||
// "ทั้งหมด",
|
||||
// "ยังไม่ได้บรรจุ",
|
||||
// "บรรจุแล้ว",
|
||||
// "ยังไม่ได้ออกคำสั่ง",
|
||||
// ];
|
||||
|
||||
let OriginalData = ref<FormOrderPlacementMainData[]>([]);
|
||||
let UpdataData = ref<FormOrderPlacementMainData[]>([]);
|
||||
|
|
@ -517,14 +370,27 @@ onMounted(async () => {
|
|||
});
|
||||
|
||||
const OriginalDataFetch = async () => {
|
||||
// API
|
||||
// await http
|
||||
// .get(config.API.// ตัวอย่าง)
|
||||
// .then((res: any) => {
|
||||
// })
|
||||
// .catch((e: any) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
await http
|
||||
.get(config.API.listOrder())
|
||||
.then((res: any) => {
|
||||
console.log("list", res);
|
||||
rows.value = res.data.result.map((e: any) => ({
|
||||
orderId: e.orderId,
|
||||
Order: e.orderName,
|
||||
OrderNum: e.orderNo,
|
||||
fiscalYear: Number(e.fiscalYear),
|
||||
OrderDate: date2Thai(e.orderDate),
|
||||
OrderBy: e.orderBy,
|
||||
Signer: "นาม สมคิด ยอดใจ ",
|
||||
OrderStatus: e.orderStatusName,
|
||||
orderStatusValue: e.orderStatusValue,
|
||||
OrderType: e.orderTypeName,
|
||||
orderTypeValue: e.orderTypeValue,
|
||||
}));
|
||||
})
|
||||
.catch((e: any) => {
|
||||
messageError($q, e);
|
||||
});
|
||||
// .finally(async () => {
|
||||
// });
|
||||
await DataStore.DataMainOrder(rows.value);
|
||||
|
|
@ -533,9 +399,8 @@ const OriginalDataFetch = async () => {
|
|||
};
|
||||
|
||||
// ดูรายการหน้าต่อไป
|
||||
const redirectToPage = (id?: number) => {
|
||||
// router.push({ name: "placementDetail" });
|
||||
router.push(`/placement/order/detail`);
|
||||
const redirectToPage = (id?: string) => {
|
||||
router.push(`/placement/order/detail/${id}`);
|
||||
};
|
||||
|
||||
const clickDelete = (id: string) => {
|
||||
|
|
@ -549,30 +414,30 @@ const clickDelete = (id: string) => {
|
|||
persistent: true,
|
||||
})
|
||||
.onOk(async () => {
|
||||
// await deleteData(id);
|
||||
await deleteData(id);
|
||||
})
|
||||
.onCancel(() => {})
|
||||
.onDismiss(() => {});
|
||||
};
|
||||
|
||||
// const deleteData = async (id: string) => {
|
||||
// showLoader();
|
||||
// await http
|
||||
// .delete(config.API.orderReplace(id))
|
||||
// .then((res) => {
|
||||
// success($q, "ลบข้อมูลสำเร็จ");
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(async () => {
|
||||
// hideLoader();
|
||||
// await fetchData();
|
||||
// });
|
||||
// };
|
||||
const deleteData = async (id: string) => {
|
||||
showLoader();
|
||||
await http
|
||||
.delete(config.API.deleteOrder(id))
|
||||
.then((res) => {
|
||||
success($q, "ลบข้อมูลสำเร็จ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
hideLoader();
|
||||
await OriginalDataFetch();
|
||||
});
|
||||
};
|
||||
|
||||
const clickAdd = () => {
|
||||
router.push({ name: "OrderplacementDetail" });
|
||||
router.push({ name: "Orderplacementadd" });
|
||||
};
|
||||
|
||||
// const viewDetail = (id: string, status: string) => {
|
||||
|
|
@ -588,6 +453,15 @@ const fiscalyear = ref<number | null>(0);
|
|||
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
|
||||
const addedfiscalYearValues: number[] = [];
|
||||
const fiscalYearFilter = async () => {
|
||||
await http.get(config.API.yearOptionsOrder()).then((res) => {
|
||||
// console.log(res);
|
||||
const response = res.data.result;
|
||||
fiscalyearOP.push(...response);
|
||||
// const maxNumber = fiscalyearOP.reduce((max: any, e: any) => {
|
||||
// return e.id > max ? e.id : max;
|
||||
// }, "");
|
||||
// fiscalyear.value = maxNumber;
|
||||
});
|
||||
// API
|
||||
// await http
|
||||
// .get(config.API.// ตัวอย่าง)
|
||||
|
|
@ -600,25 +474,37 @@ const fiscalYearFilter = async () => {
|
|||
// })
|
||||
// .finally(async () => {
|
||||
// });
|
||||
for (let data of OriginalData.value) {
|
||||
const year = data.fiscalYear;
|
||||
console.log(year);
|
||||
// for (let data of OriginalData.value) {
|
||||
// console.log(OriginalData.value);
|
||||
|
||||
if (fiscalyear.value === null || year > fiscalyear.value) {
|
||||
fiscalyear.value = year;
|
||||
}
|
||||
// const year = data.fiscalYear;
|
||||
// console.log(year);
|
||||
|
||||
if (!addedfiscalYearValues.includes(year)) {
|
||||
fiscalyearOP.push({ id: year, name: year.toString() });
|
||||
addedfiscalYearValues.push(year);
|
||||
}
|
||||
}
|
||||
// if (fiscalyear.value === null || year > fiscalyear.value) {
|
||||
// fiscalyear.value = year;
|
||||
// }
|
||||
|
||||
// if (!addedfiscalYearValues.includes(year)) {
|
||||
// fiscalyearOP.push({ id: year, name: year.toString() });
|
||||
// addedfiscalYearValues.push(year);
|
||||
// }
|
||||
// }
|
||||
};
|
||||
|
||||
const OrderType = ref<string>("");
|
||||
const OrderTypeOption = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
|
||||
const OrderTypeOption = reactive<DataOption1[]>([{ id: "", name: "ทั้งหมด" }]);
|
||||
const addedOrderTypeValues: string[] = [];
|
||||
const OrderTypeFilter = async () => {
|
||||
await http
|
||||
.get(config.API.typeOrder())
|
||||
.then((res) => {
|
||||
// console.log(res.data);
|
||||
const response = res.data.result;
|
||||
OrderTypeOption.push(...response);
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
});
|
||||
// API
|
||||
// await http
|
||||
// .get(config.API.// ตัวอย่าง)
|
||||
|
|
@ -631,35 +517,37 @@ const OrderTypeFilter = async () => {
|
|||
// })
|
||||
// .finally(async () => {
|
||||
// });
|
||||
for (let data of OriginalData.value) {
|
||||
const OrderTypeValue = data.OrderType;
|
||||
console.log(OrderTypeValue);
|
||||
// for (let data of OriginalData.value) {
|
||||
// const OrderTypeValue = data.OrderType;
|
||||
// console.log(OrderTypeValue);
|
||||
|
||||
// if (OrderTypeValue === null || OrderType > OrderTypeValue) {
|
||||
// OrderTypeValue = OrderType;
|
||||
// }
|
||||
if (!addedOrderTypeValues.includes(OrderTypeValue)) {
|
||||
OrderTypeOption.push({
|
||||
// id: OrderTypeValue ?? 0,
|
||||
id: OrderTypeOption.length,
|
||||
name: OrderTypeValue,
|
||||
});
|
||||
addedOrderTypeValues.push(OrderTypeValue);
|
||||
}
|
||||
// if (!addedOrderTypeValues.includes(OrderTypeValue)) {
|
||||
// OrderTypeOption.push({
|
||||
// id: OrderTypeValue,
|
||||
// name: OrderTypeValue.toString(),
|
||||
// });
|
||||
// addedOrderTypeValues.push(OrderTypeValue);
|
||||
// }
|
||||
}
|
||||
// if (OrderTypeValue === null || OrderType > OrderTypeValue) {
|
||||
// OrderTypeValue = OrderType;
|
||||
// }
|
||||
// if (!addedOrderTypeValues.includes(OrderTypeValue)) {
|
||||
// OrderTypeOption.push({
|
||||
// // id: OrderTypeValue ?? 0,
|
||||
// id: OrderTypeOption.length,
|
||||
// name: OrderTypeValue,
|
||||
// });
|
||||
// addedOrderTypeValues.push(OrderTypeValue);
|
||||
// }
|
||||
// if (!addedOrderTypeValues.includes(OrderTypeValue)) {
|
||||
// OrderTypeOption.push({
|
||||
// id: OrderTypeValue,
|
||||
// name: OrderTypeValue.toString(),
|
||||
// });
|
||||
// addedOrderTypeValues.push(OrderTypeValue);
|
||||
// }
|
||||
// }
|
||||
};
|
||||
const OrderStatus = ref<string>("");
|
||||
const OrderStatusText = ref<FormOrderPlacementMainData[]>(
|
||||
DataStore.DataMainOrigOrder
|
||||
);
|
||||
const OrderStatusOption = reactive<DataOption[]>([{ id: 1, name: "ทั้งหมด" }]);
|
||||
const OrderStatusOption = reactive<DataOption1[]>([
|
||||
{ id: "", name: "ทั้งหมด" },
|
||||
]);
|
||||
const addedOrderStatusValues: string[] = [];
|
||||
const OrderStatusFilter = async () => {
|
||||
// API
|
||||
|
|
@ -676,7 +564,6 @@ const OrderStatusFilter = async () => {
|
|||
// });
|
||||
for (let data of OriginalData.value) {
|
||||
const OrderStatusValue = data.OrderStatus;
|
||||
console.log(OrderStatusValue);
|
||||
|
||||
if (
|
||||
OrderStatusValue === null ||
|
||||
|
|
@ -686,31 +573,17 @@ const OrderStatusFilter = async () => {
|
|||
}
|
||||
|
||||
if (!addedOrderStatusValues.includes(OrderStatusValue)) {
|
||||
// console.log(OrderStatusValue);
|
||||
|
||||
OrderStatusOption.push({
|
||||
// id: OrderStatusValue,
|
||||
id: OrderStatusOption.length,
|
||||
id: OrderStatusOption.length.toString(),
|
||||
name: OrderStatusValue,
|
||||
});
|
||||
addedOrderStatusValues.push(OrderStatusValue);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// เลือกปีงบประมาณตาม API
|
||||
const searchfiscalyear = () => {
|
||||
console.log("Input value changed:", fiscalyear.value);
|
||||
// API
|
||||
// await http
|
||||
// .get(config.API.// ตัวอย่าง)
|
||||
// .then((res: any) => {
|
||||
// })
|
||||
// .catch((e: any) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(async () => {
|
||||
// });
|
||||
};
|
||||
|
||||
// ค้นหาในตาราง
|
||||
const filterKeyword = ref<string>("");
|
||||
const filterRef = ref<any>(null);
|
||||
|
|
@ -722,16 +595,27 @@ const resetFilter = () => {
|
|||
const attrs = ref<any>(useAttrs());
|
||||
|
||||
const searchFilterTable = async () => {
|
||||
// console.log('Input value changed:', examTime.value, examType.value, expiredAccount.value);
|
||||
if (OrderType.value == "ทั้งหมด") {
|
||||
OrderType.value = "";
|
||||
}
|
||||
if (OrderStatus.value == "ทั้งหมด") {
|
||||
OrderStatus.value = "";
|
||||
}
|
||||
console.log(
|
||||
"Input value changed:",
|
||||
OrderType.value,
|
||||
OrderStatus.value,
|
||||
fiscalyear.value
|
||||
);
|
||||
|
||||
await DataStore.DataUpdateOrder(
|
||||
OrderType.value,
|
||||
OrderStatus.value,
|
||||
fiscalyear.value
|
||||
);
|
||||
UpdataData.value = DataStore.DataMainUpdateOrder;
|
||||
// console.log(UpdataData.value);
|
||||
};
|
||||
// UpdataData.value = DataStore.DataMainUpdate;
|
||||
// console.log("Input value changed:", OrderStatus.value, OrderType.value);
|
||||
|
||||
const paging = ref<boolean>(true);
|
||||
const paginationLabel = (start: string, end: string, total: string) => {
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
@click="router.go(-1), destroyLocalStorage()"
|
||||
/>
|
||||
ออกคำสั่ง
|
||||
</div>
|
||||
|
|
@ -61,7 +61,7 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
import { ref, defineAsyncComponent, onMounted } from "vue";
|
||||
import type { QStepper } from "quasar";
|
||||
|
||||
const step01 = defineAsyncComponent(
|
||||
|
|
@ -87,11 +87,22 @@ const stepper = ref<QStepper>();
|
|||
|
||||
const nextStep = () => {
|
||||
stepper.value!.next();
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
};
|
||||
|
||||
const previousStep = () => {
|
||||
stepper.value!.previous();
|
||||
localStorage.setItem("currentStep", step.value.toString());
|
||||
};
|
||||
const destroyLocalStorage = () => {
|
||||
localStorage.clear();
|
||||
};
|
||||
onMounted(() => {
|
||||
const currentStep = localStorage.getItem("currentStep");
|
||||
if (currentStep) {
|
||||
step.value = Number(currentStep);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
.q-stepper--horizontal .q-stepper__step-inner {
|
||||
|
|
|
|||
|
|
@ -1,394 +1,212 @@
|
|||
<template>
|
||||
<div style="max-height: 68vh; overflow-y: scroll;">
|
||||
<q-form ref="myForm" class="q-pa-md">
|
||||
<div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="typeOrder"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกประเภทคำสั่ง'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ประเภทคำสั่ง'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="typeOrderOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'typeOrderOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div style="max-height: 68vh; overflow-y: scroll">
|
||||
<q-form ref="myForm" class="q-pa-md">
|
||||
<div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="typeOrder"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกประเภทคำสั่ง'}`]" hide-bottom-space
|
||||
:label="`${'ประเภทคำสั่ง'}`" @update:modelValue="clickEditRow" emit-value map-options option-label="name"
|
||||
:options="typeOrderOption" option-value="id" use-input input-debounce="0" />
|
||||
<!-- @filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'typeOrderOption'
|
||||
) " -->
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
:borderless="!edit" -->
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="nameOrder"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
|
||||
:label="`${'คำสั่งเรื่อง'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<q-input :class="getClass(true)" outlined dense lazy-rules v-model="nameOrder"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]" :label="`${'คำสั่งเรื่อง'}`"
|
||||
@update:modelValue="clickEditRow" hide-bottom-space />
|
||||
</div>
|
||||
|
||||
<div class="row col-xs-7 col-md-3 q-col-gutter-x-xs">
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="command"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่ง'}`]"
|
||||
:label="`${'คำสั่ง'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
hide-bottom-space
|
||||
type="number"
|
||||
/>
|
||||
</div>
|
||||
<label class="col-1 flex justify-center items-center text-bold"
|
||||
>/</label
|
||||
>
|
||||
<div class="col-5">
|
||||
<datepicker
|
||||
v-model="dateYear"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
@update:modelValue="clickEditRow"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
:model-value="dateYear + 543"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
|
||||
:label="`${'พ.ศ.'}`"
|
||||
dense
|
||||
outlined
|
||||
>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="row col-xs-7 col-md-3 q-col-gutter-x-xs">
|
||||
<div class="col-6">
|
||||
<q-input :class="getClass(true)" outlined dense lazy-rules v-model="command"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกคำสั่ง'}`]" :label="`${'คำสั่ง'}`" @update:modelValue="clickEditRow"
|
||||
hide-bottom-space type="number" />
|
||||
</div>
|
||||
<div class="col-xs-5 col-md-3">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateCommand"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<label class="col-1 flex justify-center items-center text-bold">/</label>
|
||||
<div class="col-5">
|
||||
<datepicker v-model="dateYear" :locale="'th'" autoApply year-picker :enableTimePicker="false"
|
||||
@update:modelValue="clickEditRow">
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
dateCommand != null ? date2Thai(dateCommand) : null
|
||||
"
|
||||
:label="`${'วันที่มีผลออกคำสั่ง'}`"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณาเลือกวันที่มีผลออกคำสั่ง'}`,
|
||||
]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="byOrder"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกคำสั่งโดย'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'คำสั่งโดย'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="byOrderOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'byOrderOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
:borderless="!edit" -->
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="nameCommand"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]"
|
||||
:label="`${'ผู้มีอำนาจลงนาม'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
:borderless="!edit" -->
|
||||
<q-input
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="positionCommand"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`,
|
||||
]"
|
||||
:label="`${'ตำแหน่งผู้มีอำนาจลงนาม'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-separator />
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="test"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกรอบการสอบ'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'รอบการสอบ'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="testOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'testOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="position"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกตำแหน่งรับสมัคร'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่งรับสมัคร'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="positionOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'positionOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="register"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'มติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="registerOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'registerOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateRegister"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
dateRegister != null ? date2Thai(dateRegister) : null
|
||||
"
|
||||
:label="`${'ลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`"
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || `${'กรุณาเลือกลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`,
|
||||
]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector
|
||||
:class="getClass(true)"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="announce"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง ผลการสอบแข่งขัน)'}`]"
|
||||
hide-bottom-space
|
||||
:label="`${'มติ กก. ครั้งที่ (เรื่อง ผลการสอบแข่งขัน)'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="announceOption"
|
||||
option-value="id"
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'announceOption'
|
||||
) "
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateAnnounce"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
dateAnnounce != null ? date2Thai(dateAnnounce) : null
|
||||
"
|
||||
:label="`${'ลงวันที่ (เรื่อง ผลการสอบแข่งขัน)'}`"
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val ||
|
||||
`${'กรุณาเลือกลงวันที่ (เรื่อง ผลการสอบแข่งขัน)'}`,
|
||||
]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
<q-input :model-value="dateYear + 543" :rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
|
||||
:label="`${'พ.ศ.'}`" dense outlined>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="flex justify-end q-pa-sm q-gutter-sm">
|
||||
<q-btn unelevated label="บันทึก" color="public" @click="submit"
|
||||
><!-- icon="mdi-content-save-outline"
|
||||
<q-tooltip>บันทึก</q-tooltip> -->
|
||||
</q-btn>
|
||||
<!-- <q-btn flat round color="primary" icon="chevron_left" @click="previous">
|
||||
<div class="col-xs-5 col-md-3">
|
||||
<datepicker menu-class-name="modalfix" v-model="dateCommand" :locale="'th'" autoApply borderless
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input outlined dense class="full-width datepicker" :model-value="dateCommand != null ? date2Thai(dateCommand) : null
|
||||
" :label="`${'วันที่มีผลออกคำสั่ง'}`" :rules="[
|
||||
(val) => !!val || `${'กรุณาเลือกวันที่มีผลออกคำสั่ง'}`,
|
||||
]">
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="byOrder"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกคำสั่งโดย'}`]" hide-bottom-space :label="`${'คำสั่งโดย'}`"
|
||||
@update:modelValue="clickEditRow" emit-value map-options option-label="name" :options="byOrderOption"
|
||||
option-value="id" use-input input-debounce="0" />
|
||||
<!-- @filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'byOrderOption'
|
||||
) " -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
:borderless="!edit" -->
|
||||
<q-input :class="getClass(true)" outlined dense lazy-rules v-model="nameCommand"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกผู้มีอำนาจลงนาม'}`]" :label="`${'ผู้มีอำนาจลงนาม'}`"
|
||||
@update:modelValue="clickEditRow" hide-bottom-space />
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<!-- :readonly="!edit"
|
||||
:borderless="!edit" -->
|
||||
<q-input :class="getClass(true)" outlined dense lazy-rules v-model="positionCommand"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]" :label="`${'ตำแหน่งผู้มีอำนาจลงนาม'}`"
|
||||
@update:modelValue="clickEditRow" hide-bottom-space />
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-separator />
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="examRound"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกรอบการสอบ'}`]" hide-bottom-space :label="`${'รอบการสอบ'}`"
|
||||
@update:modelValue="clickEditRow" emit-value map-options option-label="examRoundName"
|
||||
:options="examRoundOption" option-value="examRoundValue" use-input input-debounce="0" />
|
||||
<!-- @filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'testOption'
|
||||
) " -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="position"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งรับสมัคร'}`]" hide-bottom-space
|
||||
:label="`${'ตำแหน่งรับสมัคร'}`" @update:modelValue="clickEditRow" emit-value map-options option-label="name"
|
||||
:options="positionOption" option-value="id" use-input input-debounce="0" />
|
||||
<!-- @filter="(inputValue:string, doneFn:Function) =>
|
||||
filterSelector(inputValue, doneFn,'positionOption' ) " -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="register"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`]" hide-bottom-space
|
||||
:label="`${'มติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`" @update:modelValue="clickEditRow" emit-value
|
||||
map-options option-label="name" :options="registerOption" option-value="id" use-input input-debounce="0" />
|
||||
</div>
|
||||
<!-- @filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'registerOption'
|
||||
) " -->
|
||||
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker menu-class-name="modalfix" v-model="dateRegister" :locale="'th'" autoApply borderless
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input outlined dense class="full-width datepicker" :model-value="dateRegister != null ? date2Thai(dateRegister) : null
|
||||
" :label="`${'ลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`" :rules="[
|
||||
(val) =>
|
||||
!!val || `${'กรุณาเลือกลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`,
|
||||
]">
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<selector :class="getClass(true)" outlined dense lazy-rules v-model="announce"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง ผลการสอบแข่งขัน)'}`]"
|
||||
hide-bottom-space :label="`${'มติ กก. ครั้งที่ (เรื่อง ผลการสอบแข่งขัน)'}`" @update:modelValue="clickEditRow"
|
||||
emit-value map-options option-label="name" :options="announceOption" option-value="id" use-input
|
||||
input-debounce="0" />
|
||||
<!-- @filter="(inputValue:string,
|
||||
doneFn:Function) => filterSelector(inputValue, doneFn,'announceOption'
|
||||
) " -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-md-6">
|
||||
<datepicker menu-class-name="modalfix" v-model="dateAnnounce" :locale="'th'" autoApply borderless
|
||||
:enableTimePicker="false" week-start="0">
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input outlined dense class="full-width datepicker" :model-value="dateAnnounce != null ? date2Thai(dateAnnounce) : null
|
||||
" :label="`${'ลงวันที่ (เรื่อง ผลการสอบแข่งขัน)'}`" :rules="[
|
||||
(val) =>
|
||||
!!val || `${'กรุณาเลือกลงวันที่ (เรื่อง ผลการสอบแข่งขัน)'}`,
|
||||
]">
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="flex justify-end q-pa-sm q-gutter-sm">
|
||||
<q-btn unelevated label="บันทึก" color="public" @click="submit">
|
||||
<q-tooltip>บันทึก</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- <q-btn flat round color="primary" icon="chevron_left" @click="previous">
|
||||
<q-tooltip>ย้อนกลับ</q-tooltip>
|
||||
</q-btn> -->
|
||||
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
|
||||
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
|
||||
<q-tooltip>ต่อไป</q-tooltip>
|
||||
</q-btn> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import type { DataOption } from "@/modules/05_placement/interface/index/Main";
|
||||
import { ref, onMounted } from "vue";
|
||||
import type {
|
||||
DataOption1,
|
||||
DataOption,
|
||||
} from "@/modules/05_placement/interface/index/Main";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import type { QForm } from "quasar";
|
||||
import http from "@/plugins/http";
|
||||
import { useQuasar } from "quasar";
|
||||
import config from "@/app.config";
|
||||
import { useRoute } from "vue-router";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
|
||||
const $q = useQuasar(); //ใช้ noti quasar
|
||||
const route = useRoute();
|
||||
|
||||
const props = defineProps({
|
||||
next: {
|
||||
|
|
@ -402,6 +220,7 @@ const props = defineProps({
|
|||
});
|
||||
const next = () => props.next();
|
||||
const previous = () => props.previous();
|
||||
const orderId = route.params.orderid;
|
||||
|
||||
const myForm = ref<QForm>();
|
||||
|
||||
|
|
@ -411,98 +230,225 @@ const nameOrder = ref<string>("");
|
|||
const nameCommand = ref<string>("");
|
||||
const positionCommand = ref<string>("");
|
||||
const dateYear = ref<number>(new Date().getFullYear());
|
||||
const command = ref<string>("");
|
||||
const command = ref<number>();
|
||||
const dateCommand = ref<Date>(new Date());
|
||||
const dateRegister = ref<Date>(new Date());
|
||||
const dateAnnounce = ref<Date>(new Date());
|
||||
|
||||
const typeOrder = ref<string>("");
|
||||
const typeOrderOption = ref<DataOption[]>([]);
|
||||
const typeOrderOptionFilter = ref<DataOption[]>([]);
|
||||
const typeOrder = ref<number>();
|
||||
const typeOrderOption = ref<DataOption1[]>([
|
||||
{ name: "คำสั่งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const typeOrderOptionFilter = ref<DataOption1[]>([]);
|
||||
|
||||
const byOrder = ref<string>("");
|
||||
const byOrderOption = ref<DataOption[]>([]);
|
||||
const byOrderOptionFilter = ref<DataOption[]>([]);
|
||||
const byOrderOption = ref<DataOption1[]>([
|
||||
{ name: "นายดด นน", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const byOrderOptionFilter = ref<DataOption1[]>([]);
|
||||
|
||||
const register = ref<string>("");
|
||||
const registerOption = ref<DataOption[]>([]);
|
||||
const registerOption = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const registerOptionFilter = ref<DataOption[]>([]);
|
||||
|
||||
const announce = ref<string>("");
|
||||
const announceOption = ref<DataOption[]>([]);
|
||||
const announceOption = ref<DataOption1[]>([
|
||||
{ name: "ครั้งที่ 1", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const announceOptionFilter = ref<DataOption[]>([]);
|
||||
|
||||
const position = ref<string>("");
|
||||
const positionOption = ref<DataOption[]>([]);
|
||||
const positionOption = ref<DataOption1[]>([
|
||||
{ name: "ผู้ช่วย", id: "3fa85f64-5717-4562-b3fc-2c963f66afa6" },
|
||||
]);
|
||||
const positionOptionFilter = ref<DataOption[]>([]);
|
||||
|
||||
const test = ref<string>("");
|
||||
const testOption = ref<DataOption[]>([]);
|
||||
const examRound = ref<string>("");
|
||||
const examRoundOption = ref<DataOption1[]>([]);
|
||||
const testOptionFilter = ref<DataOption[]>([]);
|
||||
|
||||
const clickEditRow = () => (editRow.value = true);
|
||||
|
||||
const filterSelector = (val: any, update: Function, filtername: string) => {
|
||||
switch (filtername) {
|
||||
case "typeOrderOption":
|
||||
update(() => {
|
||||
typeOrderOption.value = typeOrderOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "byOrderOption":
|
||||
update(() => {
|
||||
byOrderOption.value = byOrderOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
// const filterSelector = (val: any, update: Function, filtername: string) => {
|
||||
// switch (filtername) {
|
||||
// case "typeOrderOption":
|
||||
// update(() => {
|
||||
// typeOrderOption.value = typeOrderOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
// case "byOrderOption":
|
||||
// update(() => {
|
||||
// byOrderOption.value = byOrderOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
|
||||
case "registerOption":
|
||||
update(() => {
|
||||
registerOption.value = registerOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
// case "registerOption":
|
||||
// update(() => {
|
||||
// registerOption.value = registerOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
|
||||
case "announceOption":
|
||||
update(() => {
|
||||
announceOption.value = announceOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
// case "announceOption":
|
||||
// update(() => {
|
||||
// announceOption.value = announceOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
|
||||
case "positionOption":
|
||||
update(() => {
|
||||
positionOption.value = positionOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "testOption":
|
||||
update(() => {
|
||||
testOption.value = testOptionFilter.value.filter(
|
||||
(v: DataOption) => v.name!.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
// case "positionOption":
|
||||
// update(() => {
|
||||
// positionOption.value = positionOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
// case "testOption":
|
||||
// update(() => {
|
||||
// testOption.value = testOptionFilter.value.filter(
|
||||
// (v: DataOption) => v.name!.indexOf(val) > -1
|
||||
// );
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// break;
|
||||
// }
|
||||
// };
|
||||
onMounted(async () => {
|
||||
if (orderId) {
|
||||
await fetchdetailOrder();
|
||||
} else {
|
||||
fecthTypeOption();
|
||||
fecthExamRoundOption();
|
||||
}
|
||||
};
|
||||
|
||||
// const data = localStorage.getItem("formData");
|
||||
// if (data) {
|
||||
// const parsedData = JSON.parse(data);
|
||||
// typeOrder.value = parsedData.orderTypeValue;
|
||||
// nameOrder.value = parsedData.orderTitle;
|
||||
// command.value = parsedData.orderNo;
|
||||
// dateYear.value = parsedData.orderYear;
|
||||
// dateCommand.value = parsedData.orderDate;
|
||||
// byOrder.value = parsedData.orderBy;
|
||||
// nameCommand.value = parsedData.signatoryBy;
|
||||
// positionCommand.value = parsedData.signatoryPosition;
|
||||
// test.value = parsedData.examRound;
|
||||
// position.value = parsedData.registerPosition;
|
||||
// register.value = parsedData.conclusionRegisterNo;
|
||||
// dateRegister.value = parsedData.conclusionRegisterDate;
|
||||
// announce.value = parsedData.conclusionResultNo;
|
||||
// dateAnnounce.value = parsedData.conclusionResultDate;
|
||||
// }
|
||||
});
|
||||
const fetchdetailOrder = async () => {
|
||||
showLoader();
|
||||
console.log(orderId);
|
||||
let orderIdString = orderId.toString();
|
||||
await http
|
||||
.get(config.API.detailOrder(orderIdString))
|
||||
.then((res: any) => {
|
||||
const data = res.data.result;
|
||||
typeOrder.value = data.orderTypeValue;
|
||||
nameOrder.value = data.orderTitle;
|
||||
command.value = data.orderNo;
|
||||
dateYear.value = Number(data.orderYear);
|
||||
dateCommand.value = data.orderDate;
|
||||
byOrder.value = data.orderBy;
|
||||
nameCommand.value = data.signatoryBy;
|
||||
positionCommand.value = data.signatoryPosition;
|
||||
examRound.value = data.examRound;
|
||||
position.value = data.registerPosition;
|
||||
register.value = data.conclusionRegisterNo;
|
||||
dateRegister.value = data.conclusionRegisterDate;
|
||||
announce.value = data.conclusionResultNo;
|
||||
dateAnnounce.value = data.conclusionResultDate;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
fecthTypeOption();
|
||||
fecthExamRoundOption();
|
||||
});
|
||||
};
|
||||
const fecthTypeOption = async () => {
|
||||
await http
|
||||
.get(config.API.typeOrder())
|
||||
.then((res) => {
|
||||
typeOrderOption.value = res.data.result;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
});
|
||||
};
|
||||
const fecthExamRoundOption = async () => {
|
||||
await http
|
||||
.get(config.API.examroundOrder())
|
||||
.then((res) => {
|
||||
examRoundOption.value = res.data.result;
|
||||
console.log(examRoundOption.value);
|
||||
})
|
||||
.catch((e) => { });
|
||||
};
|
||||
const submit = async () => {
|
||||
next();
|
||||
// await myForm.value!.validate().then((result: boolean) => {
|
||||
// if (result) {
|
||||
// next();
|
||||
// }
|
||||
// });
|
||||
const formdata = {
|
||||
orderTypeValue: typeOrder.value,
|
||||
orderTitle: nameOrder.value,
|
||||
orderNo: Number(command.value),
|
||||
orderYear: dateYear.value,
|
||||
orderDate: dateCommand.value,
|
||||
orderBy: byOrder.value,
|
||||
signatoryBy: nameCommand.value,
|
||||
signatoryPosition: positionCommand.value,
|
||||
examRound: examRound.value,
|
||||
registerPosition: position.value,
|
||||
conclusionRegisterNo: register.value,
|
||||
conclusionRegisterDate: dateRegister.value,
|
||||
conclusionResultNo: announce.value.toString(),
|
||||
conclusionResultDate: dateAnnounce.value,
|
||||
};
|
||||
await myForm.value!.validate().then((result: boolean) => {
|
||||
if (result) {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการบันทึกข้อมูล",
|
||||
message: "ต้องการบันทึกข้อมูลนี้ใช่หรือไม่?",
|
||||
cancel: {
|
||||
flat: true,
|
||||
color: "negative",
|
||||
},
|
||||
persistent: true,
|
||||
}).onOk(async () => {
|
||||
showLoader();
|
||||
createListOrder(formdata);
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
const createListOrder = async (formData: Object) => {
|
||||
console.log(formData);
|
||||
await http
|
||||
.post(config.API.createOrder(), formData)
|
||||
.then((res) => {
|
||||
console.log(res);
|
||||
next();
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
|
||||
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
|
||||
|
|
|
|||
|
|
@ -5,7 +5,12 @@
|
|||
<Information v-model:statusEdit="statusEdit" :statusAdd="false" />
|
||||
</div>
|
||||
<div id="government" name="16" class="row col-12 q-mt-md">
|
||||
<Government v-model:statusEdit="statusEdit" :statusAdd="false" />
|
||||
<Government
|
||||
v-model:statusEdit="statusEdit"
|
||||
:statusAdd="false"
|
||||
profileType="test"
|
||||
employeeClass="test"
|
||||
/>
|
||||
</div>
|
||||
<div id="address" name="17" class="row col-12 q-mt-md">
|
||||
<Address v-model:statusEdit="statusEdit" :statusAdd="false" />
|
||||
|
|
@ -14,7 +19,7 @@
|
|||
<Family v-model:statusEdit="statusEdit" :statusAdd="false" />
|
||||
</div>
|
||||
<div id="certicate" name="15" class="row col-12 q-mt-md">
|
||||
<Certicate v-model:statusEdit="statusEdit" />
|
||||
<Certicate v-model:statusEdit="statusEdit" profileType="test" />
|
||||
</div>
|
||||
<div id="education" name="2" class="row col-12 q-mt-md">
|
||||
<EducationVue v-model:statusEdit="statusEdit" />
|
||||
|
|
@ -70,6 +75,7 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
import Image from "@/components/information/Image.vue";
|
||||
import Information from "@/components/information/Information.vue";
|
||||
import Government from "@/components/information/Government.vue";
|
||||
|
|
|
|||
|
|
@ -282,10 +282,10 @@ const columns2 = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
const openModalTree = (pid: string) => {
|
||||
modalTree.value = true;
|
||||
personalId.value = pid;
|
||||
const openModalTree = (id: string) => {
|
||||
personalId.value = id;
|
||||
personal.value = [];
|
||||
modalTree.value = true;
|
||||
};
|
||||
|
||||
const closeModalTree = async () => {
|
||||
|
|
@ -293,8 +293,10 @@ const closeModalTree = async () => {
|
|||
modalTree.value = false;
|
||||
};
|
||||
|
||||
const nextPage = (id: string) => {
|
||||
router.push(`/receive/${id}`);
|
||||
const nextPage = (row: any) => {
|
||||
router.push({
|
||||
path: `/receive/${row.personalId}`,
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -367,57 +369,42 @@ const nextPage = (id: string) => {
|
|||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th auto-width />
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td
|
||||
key="no"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
<q-td key="no" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="fullname"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.fullname }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="position"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.position }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="positionLevel"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
@click="nextPage(props.row)"
|
||||
>
|
||||
{{ props.row.positionLevel }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="oc"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
<q-td key="oc" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.row.oc }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="agency"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
<q-td key="agency" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.row.agency }}
|
||||
</q-td>
|
||||
<q-td
|
||||
key="status"
|
||||
:props="props"
|
||||
@click="nextPage(props.row.personalId)"
|
||||
>
|
||||
<q-td key="status" :props="props" @click="nextPage(props.row)">
|
||||
{{ props.row.status }}
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
|
|
|
|||
|
|
@ -95,7 +95,17 @@ export default [
|
|||
},
|
||||
},
|
||||
{
|
||||
path: "/placement/order/detail",
|
||||
path: "/placement/order/add",
|
||||
name: "Orderplacementadd",
|
||||
component: detailOrderReplace,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [6.9],
|
||||
Role: "placement",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/placement/order/detail/:orderid",
|
||||
name: "OrderplacementDetail",
|
||||
component: detailOrderReplace,
|
||||
meta: {
|
||||
|
|
|
|||
|
|
@ -229,6 +229,8 @@ export const useOrderPlacementDataStore = defineStore("placementOrder", () => {
|
|||
) => {
|
||||
DataMainUpdateOrder.value = [];
|
||||
|
||||
|
||||
|
||||
if (filter_1 === "" && filter_2 === "" && filterYear === 0) {
|
||||
DataMainUpdateOrder.value = DataMainOrigOrder.value;
|
||||
} else if (filter_1 !== "" && filter_2 === "" && filterYear === 0) {
|
||||
|
|
@ -267,6 +269,8 @@ export const useOrderPlacementDataStore = defineStore("placementOrder", () => {
|
|||
item.OrderStatus === filter_2 &&
|
||||
item.fiscalYear === filterYear
|
||||
);
|
||||
} else if (filter_1 == "ทั้งหมด" && filter_2 == "ทั้งหมด" && filterYear !== null) {
|
||||
DataMainUpdateOrder.value = DataMainOrigOrder.value;
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue