Merge branch 'nice_dev' into develop
This commit is contained in:
commit
27d55e4241
3 changed files with 145 additions and 122 deletions
|
|
@ -1,15 +1,16 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive, watch } from "vue";
|
import { ref, reactive, watch } from "vue";
|
||||||
import { useQuasar } from "quasar";
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
import http from "@/plugins/http";
|
||||||
import config from "@/app.config";
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
/** importType*/
|
||||||
import type { QTableProps } from "quasar";
|
import type { QTableProps } from "quasar";
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
import type {
|
||||||
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
|
Position,
|
||||||
import DialogHeader from "@/components/DialogHeader.vue";
|
SeaechResult,
|
||||||
import type { Position } from "@/modules/02_organizationalNew/interface/index/organizational";
|
FormPositionFilter,
|
||||||
|
} from "@/modules/02_organizationalNew/interface/index/organizational";
|
||||||
import type {
|
import type {
|
||||||
DataOption,
|
DataOption,
|
||||||
NewPagination,
|
NewPagination,
|
||||||
|
|
@ -18,37 +19,20 @@ import type {
|
||||||
OptionType,
|
OptionType,
|
||||||
OptionExecutive,
|
OptionExecutive,
|
||||||
OptionLevel,
|
OptionLevel,
|
||||||
|
SelectPerson,
|
||||||
|
TypePos,
|
||||||
} from "@/modules/02_organizationalNew/interface/response/organizational";
|
} from "@/modules/02_organizationalNew/interface/response/organizational";
|
||||||
interface FormDetailPosition {
|
|
||||||
positionNo: string;
|
|
||||||
positionType: string;
|
|
||||||
positionLevel: string;
|
|
||||||
personal: string;
|
|
||||||
position: string;
|
|
||||||
status: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface SeaechResult {
|
/** importCompoonents*/
|
||||||
id: string;
|
import DialogHeader from "@/components/DialogHeader.vue";
|
||||||
citizenId: string;
|
|
||||||
name: string;
|
|
||||||
posTypeName: string;
|
|
||||||
posLevelName: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
|
/** import*Store*/
|
||||||
const isDisValidate = ref<boolean>(false);
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
const executiveOpsMain = ref<DataOption[]>([]);
|
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
|
||||||
const typeOpsMain = ref<DataOption[]>([]);
|
|
||||||
const levelOpsMain = ref<DataOption[]>([]);
|
/** use*/
|
||||||
const typeOps = ref<DataOption[]>([]);
|
|
||||||
const levelOps = ref<DataOption[]>([]);
|
|
||||||
const dataLevel = ref<any>();
|
|
||||||
const selected = ref<Position[]>([]);
|
|
||||||
const isSit = ref<boolean>(false);
|
|
||||||
const executiveOps = ref<DataOption[]>([]);
|
|
||||||
const store = useOrganizational();
|
|
||||||
const $q = useQuasar();
|
const $q = useQuasar();
|
||||||
|
const store = useOrganizational();
|
||||||
const {
|
const {
|
||||||
dialogConfirm,
|
dialogConfirm,
|
||||||
showLoader,
|
showLoader,
|
||||||
|
|
@ -58,9 +42,8 @@ const {
|
||||||
dialogMessageNotify,
|
dialogMessageNotify,
|
||||||
} = useCounterMixin();
|
} = useCounterMixin();
|
||||||
|
|
||||||
|
/** props*/
|
||||||
const modal = defineModel<boolean>("modal", { required: true });
|
const modal = defineModel<boolean>("modal", { required: true });
|
||||||
// const modal = ref<boolean>(true);
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
fetchActive: {
|
fetchActive: {
|
||||||
type: Function,
|
type: Function,
|
||||||
|
|
@ -72,10 +55,18 @@ const props = defineProps({
|
||||||
required: true,
|
required: true,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
const row = ref<Position[]>([]);
|
|
||||||
const rowResult = ref<SeaechResult[]>([]);
|
|
||||||
|
|
||||||
const formData = reactive<FormDetailPosition>({
|
const isReadonly = ref<boolean>(false); // อ่านได้อย่างเดียว
|
||||||
|
const isDisValidate = ref<boolean>(false);
|
||||||
|
const typeOpsMain = ref<DataOption[]>([]);
|
||||||
|
const levelOpsMain = ref<DataOption[]>([]);
|
||||||
|
const typeOps = ref<DataOption[]>([]);
|
||||||
|
const levelOps = ref<DataOption[]>([]);
|
||||||
|
const dataLevel = ref<TypePos[]>([]);
|
||||||
|
const selected = ref<Position[]>([]);
|
||||||
|
const isSit = ref<boolean>(false);
|
||||||
|
|
||||||
|
const formData = reactive<FormPositionFilter>({
|
||||||
positionNo: "", //*เลขที่ตำแหน่ง
|
positionNo: "", //*เลขที่ตำแหน่ง
|
||||||
positionType: "", //*เลขที่ตำแหน่ง
|
positionType: "", //*เลขที่ตำแหน่ง
|
||||||
positionLevel: "", //*เลขที่ตำแหน่ง
|
positionLevel: "", //*เลขที่ตำแหน่ง
|
||||||
|
|
@ -84,6 +75,7 @@ const formData = reactive<FormDetailPosition>({
|
||||||
status: "",
|
status: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/** Table*/
|
||||||
const visibleColumnsResult = ref<String[]>([
|
const visibleColumnsResult = ref<String[]>([
|
||||||
"no",
|
"no",
|
||||||
"citizenId",
|
"citizenId",
|
||||||
|
|
@ -91,7 +83,6 @@ const visibleColumnsResult = ref<String[]>([
|
||||||
"posTypeName",
|
"posTypeName",
|
||||||
"posLevelName",
|
"posLevelName",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const columns = ref<QTableProps["columns"]>([
|
const columns = ref<QTableProps["columns"]>([
|
||||||
{
|
{
|
||||||
name: "no",
|
name: "no",
|
||||||
|
|
@ -222,11 +213,15 @@ const columnsResult = ref<QTableProps["columns"]>([
|
||||||
style: "font-size: 14px",
|
style: "font-size: 14px",
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
const row = ref<Position[]>([]);
|
||||||
|
const rowResult = ref<SeaechResult[]>([]);
|
||||||
|
|
||||||
|
/** function closePopup*/
|
||||||
function close() {
|
function close() {
|
||||||
modal.value = false;
|
modal.value = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** function เรียกข้อมูลประเภทตำแหน่ง*/
|
||||||
async function fetchType() {
|
async function fetchType() {
|
||||||
showLoader();
|
showLoader();
|
||||||
await http
|
await http
|
||||||
|
|
@ -247,26 +242,6 @@ async function fetchType() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** function เรียกรายการตำแหน่งทางการบริหาร */
|
|
||||||
async function fetchExecutive() {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.orgPosExecutive)
|
|
||||||
.then((res) => {
|
|
||||||
executiveOpsMain.value = res.data.result.map((e: OptionExecutive) => ({
|
|
||||||
id: e.id,
|
|
||||||
name: e.posExecutiveName,
|
|
||||||
}));
|
|
||||||
executiveOps.value = executiveOpsMain.value;
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
messageError($q, err);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* ส่งค่า css ออกไปตามเงื่อนไข
|
* ส่งค่า css ออกไปตามเงื่อนไข
|
||||||
* @param val true/false
|
* @param val true/false
|
||||||
|
|
@ -278,51 +253,10 @@ function inputEdit(val: boolean) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function clearForm() {
|
/** function เรียกข้แมูลระดับตำแหน่ง*/
|
||||||
formData.positionType = "";
|
|
||||||
formData.positionLevel = "";
|
|
||||||
formData.personal = "";
|
|
||||||
formData.position = "";
|
|
||||||
row.value = [];
|
|
||||||
rowResult.value = [];
|
|
||||||
}
|
|
||||||
|
|
||||||
watch(
|
|
||||||
() => modal.value,
|
|
||||||
() => {
|
|
||||||
if (modal.value == true) {
|
|
||||||
clearForm();
|
|
||||||
fetchType();
|
|
||||||
fetchExecutive();
|
|
||||||
|
|
||||||
if (props.dataDetailPos) {
|
|
||||||
formData.positionNo = props.dataDetailPos.posMasterNo;
|
|
||||||
formData.status =
|
|
||||||
store.typeOrganizational === "current"
|
|
||||||
? "ปกติ"
|
|
||||||
: store.typeOrganizational === "draft"
|
|
||||||
? "แบบร่าง"
|
|
||||||
: "ยุบเลิก";
|
|
||||||
row.value = props.dataDetailPos.positions.map((e: Position) => ({
|
|
||||||
...e,
|
|
||||||
positionName: e.positionName ? e.positionName : "-",
|
|
||||||
positionField: e.positionField ? e.positionField : "-",
|
|
||||||
posTypeName: e.posTypeName ? e.posTypeName : "-",
|
|
||||||
posLevelName: e.posLevelName ? e.posLevelName : "-",
|
|
||||||
posExecutiveName: e.posExecutiveName ? e.posExecutiveName : "-",
|
|
||||||
positionExecutiveField: e.positionExecutiveField
|
|
||||||
? e.positionExecutiveField
|
|
||||||
: "-",
|
|
||||||
positionArea: e.positionArea ? e.positionArea : "-",
|
|
||||||
}));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
function updateSelectType(val: string) {
|
function updateSelectType(val: string) {
|
||||||
const listLevel = dataLevel.value.find((e: any) => e.id === val);
|
const listLevel: any = dataLevel.value.find((e: TypePos) => e.id === val);
|
||||||
levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({
|
levelOpsMain.value = listLevel?.posLevels.map((e: OptionLevel) => ({
|
||||||
id: e.id,
|
id: e.id,
|
||||||
name: e.posLevelName,
|
name: e.posLevelName,
|
||||||
}));
|
}));
|
||||||
|
|
@ -341,16 +275,11 @@ function validateForm() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** ฟังชั่น บันทึก */
|
/** function ยืนยันการบันทึกข้อมูล */
|
||||||
function onSubmit() {
|
function onSubmit() {
|
||||||
dialogConfirm(
|
dialogConfirm(
|
||||||
$q,
|
$q,
|
||||||
() => {
|
() => {
|
||||||
// console.log("ตำแหน่ง==>", selected.value[0]?.id);
|
|
||||||
// console.log("ตำแหน่ง==>", selectedProfile.value[0]?.id);
|
|
||||||
// console.log("ทับที่==>", isSit.value);
|
|
||||||
// console.log(props.dataDetailPos);
|
|
||||||
|
|
||||||
const body = {
|
const body = {
|
||||||
posMaster: props.dataDetailPos?.id, //*id อัตรากำลัง
|
posMaster: props.dataDetailPos?.id, //*id อัตรากำลัง
|
||||||
position: selected.value[0]?.id, //*id ตำแหน่ง
|
position: selected.value[0]?.id, //*id ตำแหน่ง
|
||||||
|
|
@ -378,14 +307,13 @@ function onSubmit() {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
/** เมื่อ enter ให้ทำการ ค้นหาข้อมูล */
|
|
||||||
const page = ref<number>(1);
|
const page = ref<number>(1);
|
||||||
const pageSize = ref<number>(10);
|
const pageSize = ref<number>(10);
|
||||||
const totalPage = ref<number>(0);
|
const totalPage = ref<number>(0);
|
||||||
const selectedProfile = ref<SeaechResult[]>([]);
|
const selectedProfile = ref<SeaechResult[]>([]);
|
||||||
|
/** functiuon ค้นหาคนครอง */
|
||||||
async function searchData() {
|
async function searchData() {
|
||||||
showLoader();
|
showLoader();
|
||||||
console.log(formData);
|
|
||||||
const reqBody = {
|
const reqBody = {
|
||||||
posTypeId: formData.positionType, // id ประเภทตำแหน่ง
|
posTypeId: formData.positionType, // id ประเภทตำแหน่ง
|
||||||
posLevelId: formData.positionLevel, // id ระดับตำแหน่ง
|
posLevelId: formData.positionLevel, // id ระดับตำแหน่ง
|
||||||
|
|
@ -397,12 +325,11 @@ async function searchData() {
|
||||||
await http
|
await http
|
||||||
.post(config.API.orgSearchProfile, reqBody)
|
.post(config.API.orgSearchProfile, reqBody)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
console.log(res);
|
|
||||||
totalPage.value = Math.ceil(res.data.result.total / pageSize.value);
|
totalPage.value = Math.ceil(res.data.result.total / pageSize.value);
|
||||||
const list = res.data.result.data.map((e: any) => ({
|
const list = res.data.result.data.map((e: SelectPerson) => ({
|
||||||
id: e.id,
|
id: e.id,
|
||||||
citizenId: e.citizenId,
|
citizenId: e.citizenId,
|
||||||
name: `${e.prefix + e.firstName + e.lastName}`,
|
name: `${e.prefix + e.firstName + " " + e.lastName}`,
|
||||||
posTypeName: e.posType ?? "-",
|
posTypeName: e.posType ?? "-",
|
||||||
positionName: e.position ?? "-",
|
positionName: e.position ?? "-",
|
||||||
posLevelName: e.posLevel ?? "-",
|
posLevelName: e.posLevel ?? "-",
|
||||||
|
|
@ -416,24 +343,70 @@ async function searchData() {
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
hideLoader();
|
hideLoader();
|
||||||
});
|
});
|
||||||
|
|
||||||
// rowResult.value = data;
|
|
||||||
// props.fetchListDisciplinary?.();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** function update PageSize*/
|
||||||
|
function updatePagination(newPagination: NewPagination) {
|
||||||
|
pageSize.value = newPagination.rowsPerPage;
|
||||||
|
page.value = 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** function เคลียร์Form*/
|
||||||
|
function clearForm() {
|
||||||
|
formData.positionType = "";
|
||||||
|
formData.positionLevel = "";
|
||||||
|
formData.personal = "";
|
||||||
|
formData.position = "";
|
||||||
|
row.value = [];
|
||||||
|
rowResult.value = [];
|
||||||
|
selected.value = [];
|
||||||
|
selectedProfile.value = [];
|
||||||
|
isSit.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** function เคลียร์ตำแหน่ง*/
|
||||||
function clearPosition() {
|
function clearPosition() {
|
||||||
formData.positionType = "";
|
formData.positionType = "";
|
||||||
formData.positionLevel = "";
|
formData.positionLevel = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** callback function ทำงานเมื่อเปิด popup*/
|
||||||
|
watch(
|
||||||
|
() => modal.value,
|
||||||
|
() => {
|
||||||
|
if (modal.value == true) {
|
||||||
|
clearForm();
|
||||||
|
fetchType();
|
||||||
|
|
||||||
|
if (props.dataDetailPos) {
|
||||||
|
formData.positionNo = props.dataDetailPos.posMasterNo;
|
||||||
|
formData.status =
|
||||||
|
store.typeOrganizational === "current"
|
||||||
|
? "ปกติ"
|
||||||
|
: store.typeOrganizational === "draft"
|
||||||
|
? "แบบร่าง"
|
||||||
|
: "ยุบเลิก";
|
||||||
|
row.value = props.dataDetailPos.positions.map((e: Position) => ({
|
||||||
|
...e,
|
||||||
|
positionName: e.positionName ? e.positionName : "-",
|
||||||
|
positionField: e.positionField ? e.positionField : "-",
|
||||||
|
posTypeName: e.posTypeName ? e.posTypeName : "-",
|
||||||
|
posLevelName: e.posLevelName ? e.posLevelName : "-",
|
||||||
|
posExecutiveName: e.posExecutiveName ? e.posExecutiveName : "-",
|
||||||
|
positionExecutiveField: e.positionExecutiveField
|
||||||
|
? e.positionExecutiveField
|
||||||
|
: "-",
|
||||||
|
positionArea: e.positionArea ? e.positionArea : "-",
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
/** callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination*/
|
||||||
watch([() => page.value, () => pageSize.value], () => {
|
watch([() => page.value, () => pageSize.value], () => {
|
||||||
searchData();
|
searchData();
|
||||||
});
|
});
|
||||||
|
|
||||||
function updatePagination(newPagination: NewPagination) {
|
|
||||||
pageSize.value = newPagination.rowsPerPage;
|
|
||||||
page.value = 1;
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -81,4 +81,27 @@ interface DataTree {
|
||||||
children?: DataTree[];
|
children?: DataTree[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export type { DataPosition, Position, FormDetailPosition, DataTree };
|
interface SeaechResult {
|
||||||
|
id: string;
|
||||||
|
citizenId: string;
|
||||||
|
name: string;
|
||||||
|
posTypeName: string;
|
||||||
|
posLevelName: string;
|
||||||
|
}
|
||||||
|
interface FormPositionFilter {
|
||||||
|
positionNo: string;
|
||||||
|
positionType: string;
|
||||||
|
positionLevel: string;
|
||||||
|
personal: string;
|
||||||
|
position: string;
|
||||||
|
status: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type {
|
||||||
|
DataPosition,
|
||||||
|
Position,
|
||||||
|
FormDetailPosition,
|
||||||
|
DataTree,
|
||||||
|
SeaechResult,
|
||||||
|
FormPositionFilter,
|
||||||
|
};
|
||||||
|
|
|
||||||
|
|
@ -156,6 +156,30 @@ interface HistoryPos {
|
||||||
posMasterNoSuffix: string; //Suffix หลังเลขที่ตำแหน่ง เช่น ช.
|
posMasterNoSuffix: string; //Suffix หลังเลขที่ตำแหน่ง เช่น ช.
|
||||||
}
|
}
|
||||||
|
|
||||||
|
interface SelectPerson {
|
||||||
|
citizenId: string;
|
||||||
|
firstName: string;
|
||||||
|
id: string;
|
||||||
|
lastName: string;
|
||||||
|
posLevel: string;
|
||||||
|
posType: string;
|
||||||
|
position: string;
|
||||||
|
prefix: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface PosLevels {
|
||||||
|
id: string;
|
||||||
|
posLevelAuthority: null;
|
||||||
|
posLevelName: string;
|
||||||
|
posLevelRank: number;
|
||||||
|
}
|
||||||
|
interface TypePos {
|
||||||
|
id: string;
|
||||||
|
PosLevels: PosLevels[];
|
||||||
|
posTypeName: string;
|
||||||
|
posTypeRank: number;
|
||||||
|
}
|
||||||
|
|
||||||
export type {
|
export type {
|
||||||
DataActive,
|
DataActive,
|
||||||
OrgTree,
|
OrgTree,
|
||||||
|
|
@ -170,4 +194,7 @@ export type {
|
||||||
Position2,
|
Position2,
|
||||||
SumPosition,
|
SumPosition,
|
||||||
HistoryPos,
|
HistoryPos,
|
||||||
|
SelectPerson,
|
||||||
|
TypePos,
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue