Merge branch 'develop' into develop-tee
This commit is contained in:
setthawutttty
commit
b481965b11
10 changed files with 344 additions and 758 deletions
|
|
@ -455,8 +455,8 @@
|
|||
lazy-rules
|
||||
:readonly="!editvisible"
|
||||
:borderless="!editvisible"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก ฃื่อ'}`]"
|
||||
label="ฃื่อ"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
|
||||
label="ชื่อ"
|
||||
/>
|
||||
<q-input
|
||||
v-model="inputLink"
|
||||
|
|
|
|||
|
|
@ -568,6 +568,14 @@ const clickAdd = () => {
|
|||
router.push({ name: "OrderplacementDetail" });
|
||||
};
|
||||
|
||||
// const viewDetail = (id: string, status: string) => {
|
||||
// if (status == "checkPayment") {
|
||||
// router.push(`${route.fullPath}/payment/${id}`);
|
||||
// } else {
|
||||
// router.push(`${route.fullPath}/profile/${id}`);
|
||||
// }
|
||||
// };
|
||||
|
||||
// เลือกปีงบประมาณ
|
||||
const fiscalyear = ref<number | null>(0);
|
||||
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="q-pa-sm" style="max-height: 68vh; overflow-y: scroll">
|
||||
<div class="q-py-md q-pl-md" style="height: 68vh; overflow-y: scroll">
|
||||
<div class="col-12 row q-pb-sm items-center">
|
||||
<q-btn flat round color="primary" @click="refresh" icon="mdi-refresh">
|
||||
<q-tooltip>อัปเดตข้อมูล</q-tooltip>
|
||||
|
|
@ -49,7 +49,6 @@
|
|||
<q-table
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
:visible-columns="visibleColumns"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
|
||||
<div class="q-py-md q-pl-md" style="height: 68vh; overflow-y: scroll">
|
||||
<div class="col-12 row q-py-sm items-center">
|
||||
<q-btn flat round color="primary" @click="clickAdd" icon="mdi-plus">
|
||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||
|
|
@ -713,7 +713,7 @@ const deleteData = async (id: string) => {};
|
|||
color: #4154b3;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
height: auto;
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,22 +9,24 @@
|
|||
<template v-slot:before>
|
||||
<div class="space">
|
||||
<div @click="setTab('main')" :class="getClass(tab == 'main')">
|
||||
<label>คำสั่ง</label>
|
||||
<div class="q-pr-sm">คำสั่ง</div>
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
icon="mdi-download"
|
||||
:disable="tab !== 'main'"
|
||||
:color="tab !== 'main' ? 'grey' : 'add'"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
<q-menu>
|
||||
<q-list style="min-width: 100px">
|
||||
<q-list style="min-width: 150px">
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .PDF</q-item-section>
|
||||
</q-item>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar><q-icon color="blue" name="mdi-file-word" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .docx</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
|
@ -32,38 +34,40 @@
|
|||
</q-btn>
|
||||
</div>
|
||||
<div @click="setTab('second')" :class="getClass(tab == 'second')">
|
||||
<label>เอกสารแนบท้าย</label>
|
||||
<div class="q-pr-sm">เอกสารแนบท้าย</div>
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
:color="tab !== 'second' ? 'grey' : 'add'"
|
||||
icon="mdi-download"
|
||||
:disable="tab !== 'second'"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
<q-menu>
|
||||
<q-list style="min-width: 100px">
|
||||
<q-list style="min-width: 150px">
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .PDF</q-item-section>
|
||||
</q-item>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section>ไฟล์ .docx</q-item-section>
|
||||
<q-item-section avatar><q-icon color="green-7" name="mdi-file-excel" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .xls</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-pdf q-ma-md q-pa-md">
|
||||
<div class="q-pa-sm">
|
||||
<q-separator style="margin-top: -1px; z-index: 1;" />
|
||||
<q-card bordered class="card-pdf q-ma-md q-pa-md">
|
||||
<div
|
||||
class="justify-between items-center align-center q-py-sm row"
|
||||
class="justify-between items-center align-center q-pb-sm row"
|
||||
>
|
||||
<q-btn
|
||||
class="text-grey"
|
||||
outline
|
||||
round
|
||||
class="text-dark bg-grey-4"
|
||||
flat
|
||||
dense
|
||||
@click="page = page > 1 ? page - 1 : page"
|
||||
>
|
||||
<q-icon name="mdi-chevron-left" />
|
||||
|
|
@ -74,9 +78,9 @@
|
|||
</span>
|
||||
|
||||
<q-btn
|
||||
class="text-grey"
|
||||
outline
|
||||
round
|
||||
class="text-dark bg-grey-4"
|
||||
flat
|
||||
dense
|
||||
@click="page = page < numOfPages ? page + 1 : page"
|
||||
>
|
||||
<q-icon name="mdi-chevron-right" />
|
||||
|
|
@ -87,12 +91,12 @@
|
|||
<!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
|
||||
</div>
|
||||
<div
|
||||
class="justify-between items-center align-center q-py-sm row"
|
||||
class="justify-between items-center align-center q-pt-sm row"
|
||||
>
|
||||
<q-btn
|
||||
class="text-grey"
|
||||
outline
|
||||
round
|
||||
class="text-dark bg-grey-4"
|
||||
flat
|
||||
dense
|
||||
@click="page = page > 1 ? page - 1 : page"
|
||||
>
|
||||
<q-icon name="mdi-chevron-left" />
|
||||
|
|
@ -103,16 +107,15 @@
|
|||
</span>
|
||||
|
||||
<q-btn
|
||||
class="text-grey"
|
||||
outline
|
||||
round
|
||||
class="text-dark bg-grey-4"
|
||||
flat
|
||||
dense
|
||||
@click="page = page < numOfPages ? page + 1 : page"
|
||||
>
|
||||
<q-icon name="mdi-chevron-right" />
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
<!-- <div class="card-pdf q-ma-md q-pa-md" v-if="tab == 'main'">
|
||||
<pdf-viewer v-model:PDFV="vuePDFRef" />
|
||||
</div> -->
|
||||
|
|
@ -134,9 +137,9 @@
|
|||
<template v-slot:after>
|
||||
<q-form ref="myForm">
|
||||
<div class="q-pa-md q-gutter-y-md">
|
||||
<fieldset class="border q-pa-lg">
|
||||
<legend class="text-header">อัปโหลดไฟล์</legend>
|
||||
<div class="q-gutter-y-lg">
|
||||
<fieldset class="border q-px-lg q-py-md">
|
||||
<legend class="text-header q-px-sm">อัปโหลดไฟล์</legend>
|
||||
<div class="q-gutter-y-md q-mb-md">
|
||||
<div>
|
||||
<label class="text-file">คำสั่ง</label>
|
||||
<q-file
|
||||
|
|
@ -144,6 +147,7 @@
|
|||
dense
|
||||
v-model="fileOrder"
|
||||
label="เลือกไฟล์คำสั่ง"
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
:rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']"
|
||||
>
|
||||
|
|
@ -152,7 +156,6 @@
|
|||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<!-- <div class="q-py-lg" /> -->
|
||||
<div>
|
||||
<label class="text-file">เอกสารแนบท้าย</label>
|
||||
<q-file
|
||||
|
|
@ -160,6 +163,7 @@
|
|||
dense
|
||||
v-model="fileTailer"
|
||||
label="เลือกไฟล์เอกสารแนบท้าย"
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
:rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']"
|
||||
>
|
||||
|
|
@ -171,9 +175,9 @@
|
|||
</div>
|
||||
</fieldset>
|
||||
|
||||
<fieldset class="border q-pa-lg">
|
||||
<legend class="text-header">รายละเอียด</legend>
|
||||
<div class="q-gutter-y-md">
|
||||
<fieldset class="border q-px-lg q-py-md">
|
||||
<legend class="text-header q-px-sm">รายละเอียด</legend>
|
||||
<div class="q-gutter-y-md q-mb-md">
|
||||
<div>
|
||||
<label class="text-file">เลขที่คำสั่ง</label>
|
||||
<q-input
|
||||
|
|
@ -249,6 +253,7 @@
|
|||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
hide-bottom-space
|
||||
:model-value="date != null ? date2Thai(date) : null"
|
||||
:label="`${'วันที่มีผลออกคำสั่ง'}`"
|
||||
:rules="[
|
||||
|
|
@ -414,24 +419,26 @@ const setTab = (val: string) => {
|
|||
}
|
||||
.text-header {
|
||||
color: #34373c;
|
||||
font-size: 1.2rem;
|
||||
font-weight: normal;
|
||||
font-size: 1rem;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.text-file {
|
||||
padding-top: 5px;
|
||||
color: #34373c;
|
||||
font-size: 1.1rem;
|
||||
font-weight: bold;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.space {
|
||||
background-color: #e9eaec;
|
||||
background-color: #e9eaec61;
|
||||
display: flex;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
margin-top: 5px;
|
||||
background-color: #e9eaec;
|
||||
background-color: transparent;
|
||||
padding: 2px !important;
|
||||
border-radius: 10px 10px 0px 0px;
|
||||
width: 200px;
|
||||
display: flex;
|
||||
|
|
@ -442,21 +449,23 @@ const setTab = (val: string) => {
|
|||
|
||||
.card-header-active {
|
||||
margin-top: 5px;
|
||||
margin-left: -1px;
|
||||
background-color: white;
|
||||
padding: 2px !important;
|
||||
border-radius: 10px 10px 0px 0px;
|
||||
border: 1px solid #e9eaec;
|
||||
width: 200px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border-bottom-style: none;
|
||||
font-weight: bold;
|
||||
font-weight: 600;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.card-pdf {
|
||||
border-radius: 10px;
|
||||
border: 1px solid #e9eaec;
|
||||
background-color: #e9eaec;
|
||||
background-color: #e9eaec61;
|
||||
// height: 60vh;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -905,7 +905,7 @@ const getClass = (val: boolean) => {
|
|||
/>
|
||||
</div> -->
|
||||
<div
|
||||
class="col-xs-6 col-sm-3 col-md-3"
|
||||
class="col-xs-6 col-sm-4 col-md-4"
|
||||
v-if="informaData.profileType == 'employee'"
|
||||
>
|
||||
<selector
|
||||
|
|
@ -933,7 +933,7 @@ const getClass = (val: boolean) => {
|
|||
/>
|
||||
</div>
|
||||
<div
|
||||
class="col-xs-6 col-sm-3 col-md-3"
|
||||
class="col-xs-6 col-sm-2 col-md-2"
|
||||
v-if="informaData.profileType == 'employee'"
|
||||
>
|
||||
<selector
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { ref, onMounted, watch } from "vue";
|
||||
import { useQuasar, QForm } from "quasar";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -9,6 +9,7 @@ import DialogCard from "@/modules/05_placement/components/pass/TableDetail.vue";
|
|||
import DialogFooter from "@/modules/05_placement/components/pass/DialogFooter.vue";
|
||||
import DialogHeader from "@/modules/05_placement/components/pass/DialogHeader.vue";
|
||||
import type { TableName } from "@/modules/05_placement/interface/request/placement";
|
||||
// import type Deferment from "@/modules/05_placement/components/pass/Deferment.vue";
|
||||
import type {
|
||||
treeTab,
|
||||
DataOption,
|
||||
|
|
@ -16,6 +17,10 @@ import type {
|
|||
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
import router from "@/router";
|
||||
|
||||
let roleAdmin = ref<boolean>(false);
|
||||
|
||||
const edit = ref<boolean>(true);
|
||||
const modal = ref<boolean>(false); //modal add detail
|
||||
|
|
@ -77,6 +82,7 @@ const $q = useQuasar(); // show dialog
|
|||
const positionLevelOptions = ref<any[]>([]);
|
||||
const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
|
||||
mixin;
|
||||
|
||||
const fetchPosition = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
|
|
@ -158,7 +164,7 @@ const fetchPosition = async () => {
|
|||
});
|
||||
// positionLevelOptionsFilter.value = optionPositionLevels;
|
||||
})
|
||||
.catch((e: any) => {})
|
||||
.catch((e: any) => { })
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
|
|
@ -290,8 +296,12 @@ const getClass = (val: boolean) => {
|
|||
};
|
||||
};
|
||||
const selectData = (props: TableName) => {
|
||||
itemtest.value = props.personalId;
|
||||
modal.value = true;
|
||||
itemtest.value = props;
|
||||
if (roleAdmin.value === true) {
|
||||
modal.value = true;
|
||||
} else {
|
||||
router.push("/placement/detail/08db7322-5712-4626-8a76-e2d28cd1a13b");
|
||||
}
|
||||
};
|
||||
const onSelected = async (id: string) => {
|
||||
await fetchPositionNumber(id);
|
||||
|
|
@ -346,15 +356,15 @@ const editDetail = (
|
|||
};
|
||||
placementData.mappingPosition.columns.length == 0
|
||||
? (visibleColumns.value = [
|
||||
"position",
|
||||
"Name",
|
||||
"ExamOrder",
|
||||
"Unit",
|
||||
"ReportingDate",
|
||||
"BMAOfficer",
|
||||
"Status",
|
||||
"checkList",
|
||||
])
|
||||
"position",
|
||||
"Name",
|
||||
"ExamOrder",
|
||||
"Unit",
|
||||
"ReportingDate",
|
||||
"BMAOfficer",
|
||||
"Status",
|
||||
"checkList",
|
||||
])
|
||||
: (visibleColumns.value = placementData.mappingPosition.columns);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -672,40 +682,40 @@ const rows = ref<TableName[]>([
|
|||
examResult: "ผ่าน",
|
||||
},
|
||||
},
|
||||
{personalId:"",
|
||||
profileID: "401650002245",
|
||||
position: 7,
|
||||
fullName: "นายอภินัน บอบู่",
|
||||
dateOfBirth: "17 ก.พ. 2535",
|
||||
gender: "ชาย",
|
||||
ExamOrder: 7,
|
||||
unitId: "",
|
||||
UnitGroup: "กลุ่มงานช่วยนักบริหาร (กบห.)",
|
||||
Unit: "นักทรัพยากรบุคคล (กบห.4)",
|
||||
ReportingDate: "2023-05-30", //วันที่รายงานตัว
|
||||
BMAOfficer: "ลูกจ้างชั่วคราว",
|
||||
Status: "ขอผ่อนผัน",
|
||||
checkList: null,
|
||||
address:
|
||||
"200/88 ซอยศาลายา3 ถนนพุทธมณฑลสาย4 แขวงศาลายา เขตพุทธมณฑล อำเภอพุทธมณฑล จังหวัดนครปฐม 73170",
|
||||
university: "มหาวิทยาลัยบูรพา",
|
||||
degree: "การศึกษาบัณฑิต",
|
||||
major: "เทคโนโลยีการศึกษา",
|
||||
remark: "-",
|
||||
number: 3,
|
||||
examCount: 5,
|
||||
scoreResult: {
|
||||
scoreAFull: 200,
|
||||
scoreA: 133,
|
||||
scoreBFull: 200,
|
||||
scoreB: 149,
|
||||
scoreCFull: 100,
|
||||
scoreC: 0,
|
||||
scoreSumFull: 500,
|
||||
scoreSum: 282,
|
||||
examResult: "ผ่าน",
|
||||
},
|
||||
},
|
||||
// {
|
||||
// profileID: "401650002245",
|
||||
// position: 7,
|
||||
// fullName: "นายอภินัน บอบู่",
|
||||
// dateOfBirth: "17 ก.พ. 2535",
|
||||
// gender: "ชาย",
|
||||
// ExamOrder: 7,
|
||||
// unitId: "",
|
||||
// UnitGroup: "กลุ่มงานช่วยนักบริหาร (กบห.)",
|
||||
// Unit: "นักทรัพยากรบุคคล (กบห.4)",
|
||||
// ReportingDate: "2023-05-30", //วันที่รายงานตัว
|
||||
// BMAOfficer: "ลูกจ้างชั่วคราว",
|
||||
// Status: "ขอผ่อนผัน",
|
||||
// checkList: null,
|
||||
// address:
|
||||
// "200/88 ซอยศาลายา3 ถนนพุทธมณฑลสาย4 แขวงศาลายา เขตพุทธมณฑล อำเภอพุทธมณฑล จังหวัดนครปฐม 73170",
|
||||
// university: "มหาวิทยาลัยบูรพา",
|
||||
// degree: "การศึกษาบัณฑิต",
|
||||
// major: "เทคโนโลยีการศึกษา",
|
||||
// remark: "-",
|
||||
// number: 3,
|
||||
// examCount: 5,
|
||||
// scoreResult: {
|
||||
// scoreAFull: 200,
|
||||
// scoreA: 133,
|
||||
// scoreBFull: 200,
|
||||
// scoreB: 149,
|
||||
// scoreCFull: 100,
|
||||
// scoreC: 0,
|
||||
// scoreSumFull: 500,
|
||||
// scoreSum: 282,
|
||||
// examResult: "ผ่าน",
|
||||
// },
|
||||
// },
|
||||
]);
|
||||
|
||||
const refOptions = ref<DataOption[]>([
|
||||
|
|
@ -1012,6 +1022,13 @@ const save = () => {
|
|||
console.log("rows===>", rows.value);
|
||||
};
|
||||
onMounted(async () => {
|
||||
if (keycloak.tokenParsed != null) {
|
||||
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||
console.log("roleAdmin===>", roleAdmin)
|
||||
|
||||
|
||||
}
|
||||
|
||||
await fetchPosition();
|
||||
await nodeTree();
|
||||
// await fetchData();
|
||||
|
|
@ -1058,186 +1075,104 @@ const listKeyId = (data: any) => {
|
|||
optionsLevel: positionLevelOptions.value,
|
||||
};
|
||||
};
|
||||
|
||||
const expiredAccount = ref<boolean>(false);
|
||||
|
||||
|
||||
watch(expiredAccount, () => {
|
||||
console.log("expiredAccount===>", expiredAccount.value);
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-form ref="myForm">
|
||||
<Table
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
:filter="filter"
|
||||
:visible-columns="visibleColumns"
|
||||
v-model:inputfilter="filter"
|
||||
v-model:inputvisible="visibleColumns"
|
||||
v-model:editvisible="editvisible"
|
||||
:history="true"
|
||||
:boss="true"
|
||||
:saveNoDraft="true"
|
||||
:add="save"
|
||||
>
|
||||
<template #columns="props">
|
||||
<q-tr :props="props">
|
||||
<q-icon
|
||||
class="q-mr-sm"
|
||||
size="15px"
|
||||
color="primary"
|
||||
name="mdi-bookmark"
|
||||
v-if="props.row.isDirector"
|
||||
></q-icon>
|
||||
<!-- <q-form ref="myForm"> -->
|
||||
<Table :expired-account="expiredAccount" :rows="rows" :columns="columns" :filter="filter"
|
||||
:visible-columns="visibleColumns" v-model:inputfilter="filter" v-model:inputvisible="visibleColumns"
|
||||
v-model:editvisible="editvisible" v-model:expiredaccountfilter="expiredAccount" :history="true" :boss="true"
|
||||
:saveNoDraft="true" :add="save" :role-admin="roleAdmin">
|
||||
<template #columns="props">
|
||||
<q-tr :props="props">
|
||||
<q-icon class="q-mr-sm" size="15px" color="primary" name="mdi-bookmark" v-if="props.row.isDirector"></q-icon>
|
||||
|
||||
<q-td
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
@click="selectData(props.row)"
|
||||
class="cursor-pointer"
|
||||
>
|
||||
<div v-if="col.name == 'Name'" class="table_ellipsis">
|
||||
{{ col.value }}
|
||||
<div class="row col-12 text-no-wrap items-center">
|
||||
<img
|
||||
v-if="props.row.avatar == null"
|
||||
src="@/assets/avatar_user.jpg"
|
||||
class="col-4 img-info"
|
||||
/>
|
||||
<img v-else :src="props.row.avatar" class="col-4 img-info" />
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.fullName }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ props.row.profileID }}
|
||||
</div>
|
||||
<q-td v-for="col in props.cols" :key="col.name" :props="props" @click="selectData(props.row)"
|
||||
class="cursor-pointer">
|
||||
<div v-if="col.name == 'Name'" class="table_ellipsis">
|
||||
{{ col.value }}
|
||||
<div class="row col-12 text-no-wrap items-center">
|
||||
<img v-if="props.row.avatar == null" src="@/assets/avatar_user.jpg" class="col-4 img-info" />
|
||||
<img v-else :src="props.row.avatar" class="col-4 img-info" />
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.fullName }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ props.row.profileID }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'Unit'" class="table_ellipsis">
|
||||
<div
|
||||
v-if="
|
||||
props.row.Status == 'ยังไม่บรรจุ' ||
|
||||
props.row.Status == 'สละสิทธิ์'
|
||||
"
|
||||
>
|
||||
-
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ props.row.UnitGroup }}
|
||||
<p>{{ col.value }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'Unit'" class="table_ellipsis">
|
||||
<div v-if="props.row.Status == 'ยังไม่บรรจุ' ||
|
||||
props.row.Status == 'สละสิทธิ์'
|
||||
">
|
||||
-
|
||||
</div>
|
||||
<div
|
||||
v-else-if="col.name == 'ReportingDate' && col.value != '-'"
|
||||
class="table_ellipsis"
|
||||
>
|
||||
{{ mixin.date2Thai(col.value) }}
|
||||
<div v-else>
|
||||
{{ props.row.UnitGroup }}
|
||||
<p>{{ col.value }}</p>
|
||||
</div>
|
||||
<div v-else class="table_ellipsis">
|
||||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
v-if="
|
||||
props.row.Status !== 'สละสิทธิ์' &&
|
||||
props.row.Status !== 'บรรจุเเล้ว'
|
||||
"
|
||||
icon="mdi-dots-vertical"
|
||||
size="12px"
|
||||
color="grey-7"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
>
|
||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||
<q-list dense style="min-width: 100px">
|
||||
<q-item
|
||||
v-if="props.row.Status === 'ยังไม่บรรจุ'"
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="openAppointModal"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="primary"
|
||||
size="xs"
|
||||
name="mdi-bookmark-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>เลือกหน่วยงานที่รับบรรจุ</q-item-section>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
<q-item
|
||||
v-if="props.row.Status === 'ยังไม่บรรจุ'"
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="editDetail(props.row, 'wait')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="blue"
|
||||
size="xs"
|
||||
name="mdi-account-alert-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>ขอผ่อนผัน</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
v-else-if="props.row.Status === 'ขอผ่อนผัน'"
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="editDetail(props.row, 'waitInfo')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="blue"
|
||||
size="xs"
|
||||
name="mdi-account-details-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>ข้อมูลการผ่อนผัน</q-item-section>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
<q-item
|
||||
v-if="
|
||||
props.row.Status === 'ยังไม่บรรจุ' ||
|
||||
props.row.Status === 'เตรียมบรรจุ'
|
||||
"
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="editDetail(props.row, 'cancel')"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="pink"
|
||||
size="xs"
|
||||
name="mdi-account-cancel-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>สละสิทธิ์</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</Table>
|
||||
</q-form>
|
||||
</div>
|
||||
<div v-else-if="col.name == 'ReportingDate' && col.value != '-'" class="table_ellipsis">
|
||||
{{ mixin.date2Thai(col.value) }}
|
||||
</div>
|
||||
<div v-else class="table_ellipsis">
|
||||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn v-if="props.row.Status !== 'สละสิทธิ์' &&
|
||||
props.row.Status !== 'บรรจุเเล้ว'
|
||||
" icon="mdi-dots-vertical" size="12px" color="grey-7" flat round dense>
|
||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||
<q-list dense style="min-width: 100px">
|
||||
<q-item v-if="roleAdmin === true && props.row.Status === 'ยังไม่บรรจุ'" clickable v-close-popup
|
||||
@click="openAppointModal">
|
||||
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
|
||||
<q-icon color="primary" size="xs" name="mdi-bookmark-outline" />
|
||||
</q-item-section>
|
||||
<q-item-section>เลือกหน่วยงานที่รับบรรจุ</q-item-section>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
<q-item v-if="roleAdmin === true && props.row.Status === 'ยังไม่บรรจุ'" clickable v-close-popup
|
||||
@click="editDetail(props.row, 'wait')">
|
||||
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
|
||||
<q-icon color="blue" size="xs" name="mdi-account-alert-outline" />
|
||||
</q-item-section>
|
||||
<q-item-section>ขอผ่อนผัน</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-else-if="props.row.Status === 'ขอผ่อนผัน'" clickable v-close-popup
|
||||
@click="editDetail(props.row, 'waitInfo')">
|
||||
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
|
||||
<q-icon color="blue" size="xs" name="mdi-account-details-outline" />
|
||||
</q-item-section>
|
||||
<q-item-section>ข้อมูลการผ่อนผัน</q-item-section>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
<q-item v-if="props.row.Status === 'ยังไม่บรรจุ' ||
|
||||
props.row.Status === 'เตรียมบรรจุ'
|
||||
" clickable v-close-popup @click="editDetail(props.row, 'cancel')">
|
||||
<q-item-section style="min-width: 0px" avatar class="q-py-sm">
|
||||
<q-icon color="pink" size="xs" name="mdi-account-cancel-outline" />
|
||||
</q-item-section>
|
||||
<q-item-section>สละสิทธิ์</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</Table>
|
||||
<!-- </q-form> -->
|
||||
|
||||
<q-dialog v-model="appointModal" persistent full-width>
|
||||
<q-card>
|
||||
|
|
@ -1249,50 +1184,25 @@ const listKeyId = (data: any) => {
|
|||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-card flat bordered class="fit q-pa-sm">
|
||||
<q-scroll-area visible style="height: 70vh">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="search"
|
||||
placeholder="ค้นหา"
|
||||
class="q-mb-sm"
|
||||
>
|
||||
<q-input outlined dense v-model="search" placeholder="ค้นหา" class="q-mb-sm">
|
||||
<template v-slot:append>
|
||||
<q-icon name="mdi-magnify" />
|
||||
</template>
|
||||
</q-input>
|
||||
<q-tree
|
||||
no-transition
|
||||
ref="qtreeEdit"
|
||||
:nodes="nodesTree"
|
||||
node-key="keyId"
|
||||
@lazy-load="onLazyLoad"
|
||||
dense
|
||||
>
|
||||
<q-tree no-transition ref="qtreeEdit" :nodes="nodesTree" node-key="keyId" @lazy-load="onLazyLoad" dense>
|
||||
<!--organization บรรทัดแสดงชื่อหน่วยงาน & ปุ่ม + -->
|
||||
<template v-slot:header-organization="prop">
|
||||
<div class="col">
|
||||
<div
|
||||
class="row items-center q-px-xs q-pt-xs q-gutter-sm"
|
||||
>
|
||||
<div class="row items-center q-px-xs q-pt-xs q-gutter-sm">
|
||||
<!--แสดงชื่อแผนก พิมพ์ตัวหนา คลิกแล้วกาง/หุบ Tree-->
|
||||
<div class="text-weight-medium">
|
||||
{{ prop.node.organizationName }}
|
||||
</div>
|
||||
|
||||
<!--แสดง Total Count PositionNum-->
|
||||
<q-badge
|
||||
rounded
|
||||
color="grey-2"
|
||||
text-color="dark"
|
||||
:label="prop.node.totalPositionCount"
|
||||
/>
|
||||
<q-badge
|
||||
v-if="prop.node.totalPositionVacant > 0"
|
||||
rounded
|
||||
color="red"
|
||||
outline
|
||||
:label="prop.node.totalPositionVacant"
|
||||
/>
|
||||
<q-badge rounded color="grey-2" text-color="dark" :label="prop.node.totalPositionCount" />
|
||||
<q-badge v-if="prop.node.totalPositionVacant > 0" rounded color="red" outline
|
||||
:label="prop.node.totalPositionVacant" />
|
||||
|
||||
<q-space />
|
||||
</div>
|
||||
|
|
@ -1305,51 +1215,31 @@ const listKeyId = (data: any) => {
|
|||
</div>
|
||||
</template>
|
||||
<template v-slot:header-person="prop">
|
||||
<q-item
|
||||
clickable
|
||||
:active="clickAction === prop.node.keyId"
|
||||
@click="
|
||||
clickAction =
|
||||
prop.node.name == `ว่าง` ||
|
||||
prop.node.name == `N/A` ||
|
||||
prop.node.name == null
|
||||
? listKeyId(prop)
|
||||
: ''
|
||||
"
|
||||
active-class="my-list-link text-primary text-weight-medium"
|
||||
:class="
|
||||
prop.node.name == `ว่าง` ||
|
||||
<q-item clickable :active="clickAction === prop.node.keyId" @click="
|
||||
clickAction =
|
||||
prop.node.name == `ว่าง` ||
|
||||
prop.node.name == `N/A` ||
|
||||
prop.node.name == null
|
||||
? 'row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list'
|
||||
: 'row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list disabled'
|
||||
"
|
||||
>
|
||||
<img
|
||||
v-if="
|
||||
prop.node.avatar == '' ||
|
||||
prop.node.avatar ==
|
||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
||||
"
|
||||
src="@/assets/avatar_user.jpg"
|
||||
class="col-xs-1 col-sm-2"
|
||||
style="width: 28px; height: 28px; border-radius: 50%"
|
||||
/>
|
||||
<img
|
||||
v-else
|
||||
:src="prop.node.avatar"
|
||||
class="col-xs-1 col-sm-2"
|
||||
style="width: 28px; height: 28px; border-radius: 50%"
|
||||
/>
|
||||
? listKeyId(prop)
|
||||
: ''
|
||||
" active-class="my-list-link text-primary text-weight-medium" :class="prop.node.name == `ว่าง` ||
|
||||
prop.node.name == `N/A` ||
|
||||
prop.node.name == null
|
||||
? 'row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list'
|
||||
: 'row items-center text-dark q-py-xs q-pl-sm rounded-borders my-list disabled'
|
||||
">
|
||||
<img v-if="prop.node.avatar == '' ||
|
||||
prop.node.avatar ==
|
||||
'https://cdn.quasar.dev/img/boy-avatar.png'
|
||||
" src="@/assets/avatar_user.jpg" class="col-xs-1 col-sm-2"
|
||||
style="width: 28px; height: 28px; border-radius: 50%" />
|
||||
<img v-else :src="prop.node.avatar" class="col-xs-1 col-sm-2"
|
||||
style="width: 28px; height: 28px; border-radius: 50%" />
|
||||
<!--=====ตำแหน่งว่าง สีแดง=====-->
|
||||
<div
|
||||
v-if="
|
||||
prop.node.name == `ว่าง` ||
|
||||
prop.node.name == `N/A` ||
|
||||
prop.node.name == null
|
||||
"
|
||||
class="q-px-sm text-weight-medium text-red"
|
||||
>
|
||||
<div v-if="prop.node.name == `ว่าง` ||
|
||||
prop.node.name == `N/A` ||
|
||||
prop.node.name == null
|
||||
" class="q-px-sm text-weight-medium text-red">
|
||||
ว่าง
|
||||
</div>
|
||||
<!--=====หัวหน้า สีเขียว=====-->
|
||||
|
|
@ -1374,13 +1264,8 @@ const listKeyId = (data: any) => {
|
|||
<div class="q-pr-sm">
|
||||
{{ prop.node.positionLevel }}
|
||||
</div>
|
||||
<q-icon
|
||||
v-if="prop.node.positionLeaderFlag"
|
||||
class="q-mr-sm"
|
||||
size="15px"
|
||||
color="primary"
|
||||
name="mdi-bookmark"
|
||||
></q-icon>
|
||||
<q-icon v-if="prop.node.positionLeaderFlag" class="q-mr-sm" size="15px" color="primary"
|
||||
name="mdi-bookmark"></q-icon>
|
||||
|
||||
<q-space />
|
||||
</q-item>
|
||||
|
|
@ -1395,46 +1280,24 @@ const listKeyId = (data: any) => {
|
|||
<div class="row col-12 q-col-gutter-xs">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12"></div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
:readonly="!edit"
|
||||
v-model="date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
@update:modelValue="clickEditRow"
|
||||
week-start="0"
|
||||
>
|
||||
<datepicker menu-class-name="modalfix" :readonly="!edit" v-model="date" :locale="'th'" autoApply
|
||||
:enableTimePicker="false" @update:modelValue="clickEditRow" 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"
|
||||
:model-value="date2Thai(date)"
|
||||
:rules="[
|
||||
(val: string) =>
|
||||
!!val ||
|
||||
`${'วันที่รายงานตัว'}`,
|
||||
]"
|
||||
:label="`${'วันที่รายงานตัว'}`"
|
||||
hide-bottom-space
|
||||
>
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
|
||||
:model-value="date2Thai(date)" :rules="[
|
||||
(val: string) =>
|
||||
!!val ||
|
||||
`${'วันที่รายงานตัว'}`,
|
||||
]" :label="`${'วันที่รายงานตัว'}`" hide-bottom-space>
|
||||
<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>
|
||||
|
|
@ -1443,145 +1306,58 @@ const listKeyId = (data: any) => {
|
|||
</div>
|
||||
<q-space />
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
disable
|
||||
standout
|
||||
readonly
|
||||
class="custom-input"
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="posNoId"
|
||||
:label="`${'เลขที่ตำแหน่ง'}`"
|
||||
/>
|
||||
<q-input disable standout readonly class="custom-input" dense lazy-rules v-model="posNoId"
|
||||
:label="`${'เลขที่ตำแหน่ง'}`" />
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
disable
|
||||
readonly
|
||||
class="custom-input"
|
||||
standout
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="positionId"
|
||||
:label="`${'ตำแหน่ง'}`"
|
||||
/>
|
||||
<q-input disable readonly class="custom-input" standout dense lazy-rules v-model="positionId"
|
||||
:label="`${'ตำแหน่ง'}`" />
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
:readonly="!edit"
|
||||
class="custom-input"
|
||||
standout
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
v-model="positionPathSideId"
|
||||
:rules="[(val:string) => !!val || `${'ด้าน/สาขา'}`]"
|
||||
:label="`${'ด้าน/สาขา'}`"
|
||||
/>
|
||||
<q-select :class="getClass(edit)" :outlined="edit" :readonly="!edit" class="custom-input" standout
|
||||
dense hide-bottom-space lazy-rules v-model="positionPathSideId"
|
||||
:rules="[(val: string) => !!val || `${'ด้าน/สาขา'}`]" :label="`${'ด้าน/สาขา'}`" />
|
||||
</div>
|
||||
<!-- :rules="[(val:string) => !!val || `${'กรุณาเลือกด้าน/สาขา'}`]" -->
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
disable
|
||||
readonly
|
||||
class="custom-input"
|
||||
standout
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="positionTypeId"
|
||||
:label="`${'ประเภทตำแหน่ง'}`"
|
||||
/>
|
||||
<q-input disable readonly class="custom-input" standout dense lazy-rules v-model="positionTypeId"
|
||||
:label="`${'ประเภทตำแหน่ง'}`" />
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
disable
|
||||
readonly
|
||||
class="custom-input"
|
||||
standout
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="positionLineId"
|
||||
:label="`${'สายงาน'}`"
|
||||
/>
|
||||
<q-input disable readonly class="custom-input" standout dense lazy-rules v-model="positionLineId"
|
||||
:label="`${'สายงาน'}`" />
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
:readonly="!edit"
|
||||
class="custom-input"
|
||||
standout
|
||||
dense
|
||||
lazy-rules
|
||||
:options="positionLevelOptions"
|
||||
v-model="positionLevelId"
|
||||
:label="`${'ระดับ'}`"
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกระดับ'}`]"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
<q-select :class="getClass(edit)" :outlined="edit" :readonly="!edit" class="custom-input" standout
|
||||
dense lazy-rules :options="positionLevelOptions" v-model="positionLevelId" :label="`${'ระดับ'}`"
|
||||
hide-bottom-space :rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]" emit-value
|
||||
map-options />
|
||||
</div>
|
||||
<div class="col-sx-12 col-sm-12 col-md-12">
|
||||
<q-separator inset size="2px" class="q-my-md" />
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="amount"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||
:label="`${'เงินเดือน'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
type="number"
|
||||
hide-bottom-space
|
||||
/>
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit"
|
||||
:borderless="!edit" v-model="amount" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||
:label="`${'เงินเดือน'}`" @update:modelValue="clickEditRow" type="number" hide-bottom-space />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="positionSalaryAmount"
|
||||
:rules="[
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit"
|
||||
:borderless="!edit" v-model="positionSalaryAmount" :rules="[
|
||||
(val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`,
|
||||
]"
|
||||
:label="`${'เงินประจำตำแหน่ง'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
type="number"
|
||||
hide-bottom-space
|
||||
/>
|
||||
]" :label="`${'เงินประจำตำแหน่ง'}`" @update:modelValue="clickEditRow" type="number"
|
||||
hide-bottom-space />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="mouthSalaryAmount"
|
||||
:rules="[
|
||||
<q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit"
|
||||
:borderless="!edit" v-model="mouthSalaryAmount" :rules="[
|
||||
(val) =>
|
||||
!!val || `${'กรุณากรอกเงินค่าตอบแทนรายเดือน'}`,
|
||||
]"
|
||||
:label="`${'เงินค่าตอบแทนรายเดือน'}`"
|
||||
@update:modelValue="clickEditRow"
|
||||
type="number"
|
||||
hide-bottom-space
|
||||
/>
|
||||
]" :label="`${'เงินค่าตอบแทนรายเดือน'}`" @update:modelValue="clickEditRow" type="number"
|
||||
hide-bottom-space />
|
||||
</div>
|
||||
</div>
|
||||
</q-scroll-area>
|
||||
|
|
@ -1591,87 +1367,47 @@ const listKeyId = (data: any) => {
|
|||
</q-card-section>
|
||||
|
||||
<q-separator />
|
||||
<DialogFooter
|
||||
v-model:editvisible="edit"
|
||||
:validate="validateData"
|
||||
v-model:modalEdit="modalEdit"
|
||||
:save="saveAppoint"
|
||||
/>
|
||||
<DialogFooter v-model:editvisible="edit" :validate="validateData" v-model:modalEdit="modalEdit"
|
||||
:save="saveAppoint" />
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-form ref="myForm">
|
||||
<DialogCard
|
||||
v-model:Modal="modal"
|
||||
:getdetail="itemtest"
|
||||
:close="clickClose"
|
||||
:validate="validateData"
|
||||
/>
|
||||
<DialogCard v-model:Modal="modal" :getdetail="itemtest" :close="clickClose" :validate="validateData" />
|
||||
</q-form>
|
||||
<q-dialog v-model="modal_right" persistent>
|
||||
<q-card style="width: 800px">
|
||||
<q-card style="width: 800px">
|
||||
|
||||
<q-form ref="myForm">
|
||||
<DialogHeader
|
||||
:title="`${modalEdit ? 'ขอผ่อนผัน' : 'สละสิทธิ์'} ชื่อ${Name}`"
|
||||
:close="clickClose"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section class="q-p-sm">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
:class="getClass(edit)"
|
||||
hide-bottom-space
|
||||
:outlined="edit"
|
||||
dense
|
||||
lazy-rules
|
||||
:rules="[(val) => !!val || 'กรุณากรอกเหตุผล']"
|
||||
:readonly="!edit"
|
||||
:borderless="!edit"
|
||||
v-model="positionMasterUserNote"
|
||||
:label="`${'กรอกเหตุผล'}`"
|
||||
@update:model-value="clickEditRow"
|
||||
|
||||
type="textarea"
|
||||
/>
|
||||
<q-file
|
||||
v-if="getNumFile === 1"
|
||||
v-model="files"
|
||||
dense
|
||||
:label="`${'เลือกไฟล์เอกสารหลักฐาน'}`"
|
||||
outlined
|
||||
use-chips
|
||||
:rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']"
|
||||
multiple
|
||||
@update:model-value="clickEditRow"
|
||||
class="q-py-sm"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" color="primary" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<DialogFooter
|
||||
v-model:editvisible="edit"
|
||||
v-model:modalEdit="modalEdit"
|
||||
:validate="validateData"
|
||||
:save="modalEdit ? savePostpone : saveDisclaim"
|
||||
/>
|
||||
</q-form>
|
||||
</q-card>
|
||||
<q-form ref="myForm">
|
||||
<DialogHeader :title="`${modalEdit ? 'ขอผ่อนผัน' : 'สละสิทธิ์'} ชื่อ${Name}`" :close="clickClose" />
|
||||
<q-separator />
|
||||
<q-card-section class="q-p-sm">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input :class="getClass(edit)" hide-bottom-space :outlined="edit" dense lazy-rules
|
||||
:rules="[(val) => !!val || 'กรุณากรอกเหตุผล']" :readonly="!edit" :borderless="!edit"
|
||||
v-model="positionMasterUserNote" :label="`${'กรอกเหตุผล'}`" @update:model-value="clickEditRow"
|
||||
type="textarea" />
|
||||
<q-file v-if="getNumFile === 1" v-model="files" dense :label="`${'เลือกไฟล์เอกสารหลักฐาน'}`" outlined
|
||||
use-chips :rules="[(val) => !!val || 'กรุณาเลือกไฟล์เอกสารหลักฐาน']" multiple
|
||||
@update:model-value="clickEditRow" class="q-py-sm">
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" color="primary" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<DialogFooter v-model:editvisible="edit" v-model:modalEdit="modalEdit" :validate="validateData"
|
||||
:save="modalEdit ? savePostpone : saveDisclaim" />
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- dialog ขอผ่อนผัน / สละสิทธิ์ -->
|
||||
<q-dialog v-model="modalwaitInfo" persistent>
|
||||
<q-card style="width: 500px; max-width: 500px">
|
||||
<q-form ref="myForm"
|
||||
>สละสิทธิ์
|
||||
<DialogHeader
|
||||
:title="`${modalEdit ? 'ขอผ่อนผัน' : 'สละสิทธิ์'} ชื่อ${Name}`"
|
||||
:close="clickClose"
|
||||
/>
|
||||
<q-form ref="myForm">
|
||||
<DialogHeader :title="`${modalEdit ? 'ขอผ่อนผัน' : 'สละสิทธิ์'} ชื่อ${Name}`" :close="clickClose" />
|
||||
<q-separator />
|
||||
<q-card-section class="q-p-sm">
|
||||
<div class="row">
|
||||
|
|
@ -1681,14 +1417,7 @@ const listKeyId = (data: any) => {
|
|||
<div class="row q-pt-md">
|
||||
<div class="col-3 text-grey-7 q-mt-sm">เอกสารหลักฐาน</div>
|
||||
<div class="col-2 q-mt-sm">กรอกเหตุผล</div>
|
||||
<q-btn
|
||||
color="primary"
|
||||
flat
|
||||
dense
|
||||
round
|
||||
size="14px"
|
||||
icon="mdi-download"
|
||||
/>
|
||||
<q-btn color="primary" flat dense round size="14px" icon="mdi-download" />
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
|
@ -1701,6 +1430,7 @@ const listKeyId = (data: any) => {
|
|||
.custom-input {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.my-list-link {
|
||||
border-radius: 5px;
|
||||
|
||||
|
|
@ -1712,6 +1442,7 @@ const listKeyId = (data: any) => {
|
|||
margin-bottom: 0;
|
||||
color: #818181;
|
||||
}
|
||||
|
||||
.img-info {
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
|
|
|
|||
|
|
@ -1,132 +1,30 @@
|
|||
<template>
|
||||
<div class="q-px-md q-pb-md">
|
||||
<div class="col-12 row q-py-sm" v-if="nornmalData == false">
|
||||
<div class="col-12 row q-py-sm">
|
||||
<q-toggle v-if="roleAdmin === false" class="col-xs-12 col-sm-5 col-md-5 toggle-expired-account"
|
||||
:model-value="expiredAccount" color="blue" label="แสดงบัญชีหมดอายุ" @update:model-value="updateExpiredAccount" />
|
||||
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<div
|
||||
class="row items-center"
|
||||
style="display: flex"
|
||||
v-if="publicData == false && publicNoBtn == false"
|
||||
></div>
|
||||
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
:model-value="inputfilter"
|
||||
ref="filterRef"
|
||||
@update:model-value="updateInput"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="q-ml-sm"
|
||||
>
|
||||
<q-input standout dense :model-value="inputfilter" ref="filterRef" @update:model-value="updateInput" outlined
|
||||
debounce="300" placeholder="ค้นหา" style="max-width: 200px" class="q-ml-sm">
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="inputfilter == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="inputfilter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
<q-icon v-if="inputfilter !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
|
||||
</template>
|
||||
</q-input>
|
||||
<!-- แสดง table ใน คอลัมน์ -->
|
||||
<q-select
|
||||
:model-value="inputvisible"
|
||||
@update:model-value="updateVisible"
|
||||
:display-value="$q.lang.table.columns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
:options="attrs.columns"
|
||||
options-dense
|
||||
option-value="name"
|
||||
map-options
|
||||
emit-value
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
<q-select :model-value="inputvisible" @update:model-value="updateVisible" :display-value="$q.lang.table.columns"
|
||||
multiple outlined dense :options="attrs.columns" options-dense option-value="name" map-options emit-value
|
||||
style="min-width: 150px" class="gt-xs q-ml-sm" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row q-py-sm items-center" v-if="nornmalData == true">
|
||||
<span class="text-subtitle1">{{ titleText }}</span>
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
color="primary"
|
||||
@click="refresh"
|
||||
icon="mdi-refresh"
|
||||
v-if="props.refreshBtn"
|
||||
>
|
||||
<q-tooltip>อัปเดตข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
:model-value="inputfilter"
|
||||
ref="filterRef"
|
||||
@update:model-value="updateInput"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="q-ml-sm"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="inputfilter == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="inputfilter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<!-- แสดงคอลัมน์ใน table -->
|
||||
<q-select
|
||||
:model-value="inputvisible"
|
||||
@update:model-value="updateVisible"
|
||||
:display-value="$q.lang.table.columns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
:options="attrs.columns"
|
||||
options-dense
|
||||
option-value="name"
|
||||
map-options
|
||||
emit-value
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<q-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
class="custom-header-table"
|
||||
v-bind="attrs"
|
||||
virtual-scroll
|
||||
:virtual-scroll-sticky-size-start="48"
|
||||
dense
|
||||
:pagination-label="paginationLabel"
|
||||
v-model:pagination="pagination"
|
||||
>
|
||||
<q-table ref="table" flat bordered class="custom-header-table" v-bind="attrs" virtual-scroll
|
||||
:virtual-scroll-sticky-size-start="48" dense :pagination-label="paginationLabel" v-model:pagination="pagination">
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="pagination.page"
|
||||
color="primary"
|
||||
:max="scope.pagesNumber"
|
||||
:max-pages="5"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
></q-pagination>
|
||||
<q-pagination v-model="pagination.page" color="primary" :max="scope.pagesNumber" :max-pages="5" size="sm"
|
||||
boundary-links direction-links></q-pagination>
|
||||
</template>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
|
|
@ -142,6 +40,7 @@
|
|||
</q-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -240,6 +139,8 @@ const props = defineProps({
|
|||
type: Function,
|
||||
default: () => console.log("not function"),
|
||||
},
|
||||
expiredAccount: Boolean,
|
||||
roleAdmin: Boolean
|
||||
});
|
||||
const pagination = ref({
|
||||
sortBy: "desc",
|
||||
|
|
@ -263,11 +164,9 @@ const emit = defineEmits([
|
|||
"update:editvisible",
|
||||
"update:titleText",
|
||||
"update:inputvisibleFilter",
|
||||
"update:expiredaccountfilter"
|
||||
]);
|
||||
|
||||
const updateEdit = (value: any) => {
|
||||
emit("update:editvisible", value);
|
||||
};
|
||||
const updateInput = (value: any) => {
|
||||
emit("update:inputfilter", value);
|
||||
};
|
||||
|
|
@ -278,6 +177,10 @@ const updateVisibleFilter = (value: any) => {
|
|||
emit("update:inputvisibleFilter", value);
|
||||
};
|
||||
|
||||
const updateExpiredAccount = (value: any) => {
|
||||
emit("update:expiredaccountfilter", value);
|
||||
};
|
||||
|
||||
const checkSave = () => {
|
||||
props.validate();
|
||||
props.save();
|
||||
|
|
@ -288,71 +191,6 @@ const checkSave = () => {
|
|||
// });
|
||||
// }
|
||||
};
|
||||
const clickEdit = () => {
|
||||
updateEdit(!props.editvisible);
|
||||
editvisible.value = !editvisible.value;
|
||||
props.edit();
|
||||
};
|
||||
const clickCancel = () => {
|
||||
updateEdit(!props.editvisible);
|
||||
editvisible.value = !editvisible.value;
|
||||
props.cancel();
|
||||
};
|
||||
const publishModal = () => {
|
||||
props.validate();
|
||||
const filter = attrs.value.rows.filter((r: any) => r.name == "");
|
||||
|
||||
if (filter.length == 0 || attrs.value.rows.length == 0) {
|
||||
// modalPublish.value = true;
|
||||
dialogMessage(
|
||||
$q,
|
||||
"ต้องการเผยแพร่ข้อมูลนี้หรือไม่?",
|
||||
"ข้อมูลที่กำลังถูกเผยแพร่นี้จะมีผลใช้งานทันที",
|
||||
"public",
|
||||
"เผยแพร่",
|
||||
"public",
|
||||
props.publish,
|
||||
undefined
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const DeleteModal = () => {
|
||||
// modalDelete.value = true;
|
||||
dialogMessage(
|
||||
$q,
|
||||
"ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?",
|
||||
"ข้อมูลบันทึกร่างที่กำลังถูกลบนี้จะมีผลใช้งานทันที",
|
||||
"mdi-file-remove-outline",
|
||||
"ลบบันทึก",
|
||||
"red",
|
||||
props.deleted,
|
||||
undefined
|
||||
);
|
||||
};
|
||||
|
||||
const edit = async () => {
|
||||
updateEdit(!props.editvisible);
|
||||
props.edit();
|
||||
};
|
||||
|
||||
const add = async () => {
|
||||
// if (myForm.value !== null) {
|
||||
// myForm.value.validate();
|
||||
// }
|
||||
props.validate();
|
||||
props.add();
|
||||
await table.value.lastPage();
|
||||
await table.value.scrollTo(attrs.value.rows.length - 1);
|
||||
};
|
||||
|
||||
const deleted = async () => {
|
||||
// const deletedF = () => {
|
||||
if (props.publicNoBtn === false) {
|
||||
updateEdit(false);
|
||||
}
|
||||
props.deleted();
|
||||
};
|
||||
|
||||
const resetFilter = () => {
|
||||
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ const Main = () => import("@/modules/08_registryEmployee/views/Main.vue");
|
|||
|
||||
export default [
|
||||
{
|
||||
path: "/registryEmployee",
|
||||
path: "/registry-employee",
|
||||
name: "registryEmployee",
|
||||
component: Main,
|
||||
meta: {
|
||||
|
|
|
|||
|
|
@ -112,7 +112,7 @@
|
|||
dense
|
||||
>
|
||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||
<q-list dense style="min-width: 100px">
|
||||
<q-list dense style="min-width: 150px">
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
|
|
@ -166,6 +166,7 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import router from "@/router";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import type { QInput, QForm } from "quasar";
|
||||
|
|
@ -528,7 +529,7 @@ const clickClose = async () => {
|
|||
};
|
||||
|
||||
const clickAdd = () => {
|
||||
modal.value = true;
|
||||
router.push({ name: "" });
|
||||
};
|
||||
|
||||
const clickDelete = (id: string) => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue