hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Merge branch 'develop' into working

Browse source
This commit is contained in:
Tanyalak 2023-06-29 11:05:21 +07:00
commit 3a8ecb9d82
32 changed files with 1900 additions and 2373 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/interface/request/main/main.ts
View file

@ -182,11 +182,13 @@ const menuList = readonly<any[]>([
role: "placement",
children: [
{
key: 6.1,
label: "รายชื่อผู้สอบผ่าน" /* รายชื่อผู้สอบผ่าน */,
path: "placement",
role: "placement",
},
{
key: 6.2,
label: "ออกคำสั่ง" /* ออกคำสั่งบรรจุ */,
path: "Orderplacement",
role: "placement",
@ -289,7 +291,7 @@ const tabList = readonly<tabType[]>([
},
]);
const tabList_placement = readonly<tabType[]>([
const tabListPlacement = readonly<tabType[]>([
{
key: 1,
label: "ข้อมูลทั่วไป",
@ -297,30 +299,25 @@ const tabList_placement = readonly<tabType[]>([
},
{
key: 2,
label: "ประวัติการศึกษา",
tag: "education",
},
{
key: 3,
label: "ใบอนุญาตประกอบอาชีพ",
tag: "certicate",
},
{
key: 4,
label: "เครื่องราชอิสริยาภรณ์",
tag: "insignia",
key: 3,
label: "ประวัติการศึกษา",
tag: "education",
},
{
key: 5,
key: 4,
label: "ผลการสอบ",
tag: "examresult",
},
{
key: 6,
key: 5,
label: "การคัดกรองคุณสมบัติ",
tag: "qualification",
},
]);
export { menuList, tabList, tabList_placement };
export { menuList, tabList, tabListPlacement };
export type { ScrollType, tabType, menuType, notiType, optionType };

77
src/modules/04_registry/components/DialogFooter.vue
View file

@ -1,5 +1,5 @@
<template>
<q-card-actions class="text-primary q-py-sm">
<q-card-actions class="text-primary q-py-sm q-gutter-sm">
<q-btn
flat
round
@ -19,51 +19,48 @@
:color="!next ? 'grey-7' : 'public'"
/>
<q-space />
<q-btn
v-if="modalEdit == true"
flat
round
color="red"
@click="clickDelete"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
<q-btn
v-if="!editvisible"
flat
round
outline
:disabled="editvisible"
:color="editvisible ? 'grey-7' : 'primary'"
@click="edit"
icon="mdi-pencil-outline"
>
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
label="แก้ไขข้อมูล"
><!-- icon="mdi-pencil-outline"
<q-tooltip>แก้ไขข้อมูล</q-tooltip> -->
</q-btn>
<q-btn
v-show="editvisible"
flat
:disabled="!editvisible"
:outline="!editvisible"
:color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()"
label="ยกเลิกแก้ไข"
v-if="modalEdit == true"
> <!-- icon="mdi-undo"
<q-tooltip>ยกเลิก</q-tooltip> -->
</q-btn>
<q-btn
v-if="modalEdit == true"
unelevated
color="red"
@click="clickDelete"
label="ลบข้อมูล"
><!-- icon="mdi-delete"
<q-tooltip>ลบข้อมูล</q-tooltip> -->
</q-btn>
<q-btn
v-if="editvisible"
unelevated
label="บันทึก"
:disabled="!editvisible"
:color="!editvisible ? 'grey-7' : 'public'"
@click="checkSave"
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<div v-else>
<q-btn
flat
round
:disabled="!editvisible"
:outline="!editvisible"
:color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()"
icon="mdi-undo"
v-if="modalEdit == true"
>
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
<q-btn
flat
round
:disabled="!editvisible"
:color="!editvisible ? 'grey-7' : 'public'"
@click="checkSave"
icon="mdi-content-save-outline"
>
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
</q-card-actions>
</template>
<script setup lang="ts">

84
src/modules/04_registry/components/Leave.vue
View file

@ -251,50 +251,48 @@
<q-form ref="myForm">
<DialogHeader tittle="การลา" :close="clickClose" />
<q-separator />
<q-card-section>
<div class="col-xs-12 col-sm-12 col-md-12">
<data-table
:rows="rowsTotal"
:columns="columnsTotal"
:filter="filterTotal"
:visible-columns="visibleColumnsTotal"
v-model:inputfilter="filterTotal"
v-model:inputvisible="visibleColumnsTotal"
:nornmalData="true"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
<div class="col-xs-12 col-sm-12 col-md-12">
<data-table
:rows="rowsTotal"
:columns="columnsTotal"
:filter="filterTotal"
:visible-columns="visibleColumnsTotal"
v-model:inputfilter="filterTotal"
v-model:inputvisible="visibleColumnsTotal"
:nornmalData="true"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div
v-else-if="
col.name == 'numLeave' ||
col.name == 'sumLeave' ||
col.name == 'totalLeave'
"
class="table_ellipsis"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div
v-else-if="
col.name == 'numLeave' ||
col.name == 'sumLeave' ||
col.name == 'totalLeave'
"
class="table_ellipsis"
>
{{
col.value == null
? ""
: col.value.toLocaleString("en-US")
}}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</data-table>
</div>
</q-card-section>
{{
col.value == null
? ""
: col.value.toLocaleString("en-US")
}}
</div>
<div v-else>
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</data-table>
</div>
<q-separator />
</q-form>
</q-card>

9
src/modules/04_registry/components/Profile.vue
View file

@ -487,13 +487,12 @@
<q-separator />
<q-card-actions align="right">
<q-btn
flat
round
unelevated
label="บันทึก"
color="public"
@click="Retire"
icon="mdi-content-save-outline"
>
<q-tooltip>บันทึก</q-tooltip>
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
</q-card-actions>
</q-card>

0
src/modules/05_placement/components/exams_sorkorcho/Main.vue → src/modules/05_placement/components/Main.vue
View file

287
src/modules/05_placement/components/OrderPlacement/MainOrderPlacement.vue
View file

@ -1,10 +1,11 @@
<template>
<div class="toptitle text-dark col-12 row items-center">ออกคำสั่ง</div>
<div>
<q-card flat bordered class="col-12 q-mt-sm">
<div class="row q-pa-md">
<div class="col-xs-12 col-sm-3 col-md-2">
<q-card flat bordered class="col-12 q-mt-sm q-pa-md">
<div class="row q-col-gutter-md">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-2"
v-model="fiscalyear"
label="ปีงบประมาณ"
dense
@ -21,26 +22,27 @@
:hide-dropdown-icon="false"
@update:model-value="searchfiscalyear"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-6">
<q-btn size="12px" flat round color="add" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
<q-menu>
<q-list style="min-width: 100px">
<q-item clickable v-close-popup disable>
<q-item-section
>ลายเซ็นอิเล็กทรอนิกส์ (ออนไลน์)</q-item-section
>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</div>
<div class="col-xs-12 col-sm-3 col-md-2">
<div>
<q-btn size="12px" flat round color="add" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
<q-menu>
<q-list style="min-width: 100px">
<q-item clickable v-close-popup disable>
<q-item-section
>ลายเซ็นอิเล็กทรอนิกส์ (ออนไลน์)</q-item-section
>
</q-item>
<q-item clickable @click="clickAdd">
<q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</div>
<q-space/>
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
@ -48,7 +50,6 @@
outlined
debounce="300"
placeholder="ค้นหา"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
@ -60,8 +61,7 @@
/>
</template>
</q-input>
</div>
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select
v-model="visibleColumns"
multiple
@ -75,15 +75,14 @@
option-value="name"
options-cover
style="min-width: 150px"
class="gt-xs q-ml-sm"
class="col-xs-12 col-sm-3 col-md-2"
/>
</div>
</div>
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
<q-card bordered class="col-12 filter-card">
<div class="row q-pa-sm">
<div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
<div class="col-12">
<q-card bordered class="col-12 filter-card q-pa-sm">
<div class="row col-12 q-col-gutter-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-2"
v-model="OrderType"
label="ประเภท"
dense
@ -100,9 +99,8 @@
:hide-dropdown-icon="false"
@update:model-value="searchFilterTable"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
<q-select
class="col-xs-12 col-sm-3 col-md-2"
v-model="OrderStatus"
label="สถานะ"
dense
@ -120,117 +118,118 @@
@update:model-value="searchFilterTable"
/>
</div>
</div>
</q-card>
</div>
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
<q-table
ref="table"
:columns="columns"
:rows="UpdataData"
:filter="filterKeyword"
row-key="Order"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<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="Order"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.Order }}
</q-td>
<q-td
key="OrderNum"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderNum }}
</q-td>
<q-td
key="OrderDate"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderDate }}
</q-td>
<q-td
key="OrderBy"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderBy }}
</q-td>
<q-td
key="Signer"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.Signer }}
</q-td>
<q-td
key="OrderStatus"
:props="props"
@click="redirectToPage(props.row.Order)"
>
<q-icon
v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
name="hourglass_top"
color="orange"
class="text-h5"
/>
<q-icon
v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
name="mdi-check"
color="positive"
class="text-h5"
/>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.id)"
icon="mdi-delete"
</div>
<div class="col-12">
<q-table
ref="table"
:columns="columns"
:rows="UpdataData"
:filter="filterKeyword"
row-key="Order"
flat
bordered
:paging="true"
dense
class="custom-header-table"
v-bind="attrs"
:visible-columns="visibleColumns"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<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="Order"
:props="props"
@click="redirectToPage(props.row.Order)"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
<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>
</template>
</q-table>
{{ props.row.Order }}
</q-td>
<q-td
key="OrderNum"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderNum }}
</q-td>
<q-td
key="OrderDate"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderDate }}
</q-td>
<q-td
key="OrderBy"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.OrderBy }}
</q-td>
<q-td
key="Signer"
:props="props"
@click="redirectToPage(props.row.Order)"
>
{{ props.row.Signer }}
</q-td>
<q-td
key="OrderStatus"
:props="props"
@click="redirectToPage(props.row.Order)"
>
<q-icon
v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
name="mdi-timer-sand"
color="orange"
size="20px"
/>
<q-icon
v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
name="mdi-check"
color="positive"
size="20px"
/>
</q-td>
<q-td auto-width>
<q-btn
dense
size="12px"
flat
round
color="red"
@click="clickDelete(props.row.id)"
icon="mdi-delete"
>
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
</div>
</q-card>
</div>
@ -329,7 +328,7 @@ const columns = ref<QTableProps["columns"]>([
},
{
name: "OrderStatus",
align: "left",
align: "center",
label: "สถานะคำสั่ง",
sortable: false,
field: "OrderStatus",
@ -703,7 +702,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
<style lang="scss" scope>
.filter-card {
background-color: #ededed;
background-color: #f1f1f1b0;
}
.toggle-expired-account {

8
src/modules/05_placement/components/OrderPlacement/detailOrderPlacement.vue
View file

@ -18,6 +18,7 @@
ref="stepper"
color="primary"
animated
class="step"
header-class="bg-grey-1"
>
<q-step
@ -96,4 +97,11 @@ const previousStep = () => {
.q-stepper--horizontal .q-stepper__step-inner {
padding: 0px;
}
.step .q-stepper__tab--done .q-stepper__title,.step .q-stepper__tab--active .q-stepper__title{
color: #35473C !important;
font-weight: 500 ;
}
.step .q-stepper__header--standard-labels .q-stepper__tab{
min-height: 60px;
}
</style>

13
src/modules/05_placement/components/OrderPlacement/step/step01.vue
View file

@ -1,6 +1,6 @@
<template>
<div>
<div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
<div class="q-pa-md" style="max-height: 68vh; overflow-y: scroll">
<q-form ref="myForm">
<div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
<div class="col-xs-12 col-md-6">
@ -369,15 +369,14 @@
</q-form>
</div>
<q-separator />
<div class="flex justify-end q-px-md q-gutter-sm">
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
flat
round
unelevated
label="บันทึก"
color="public"
icon="mdi-content-save-outline"
@click="next"
>
<q-tooltip>บันทึก</q-tooltip>
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<!-- <q-btn flat round color="primary" icon="chevron_left" @click="previous">
<q-tooltip>ย้อนกลับ</q-tooltip>

34
src/modules/05_placement/components/OrderPlacement/step/step02.vue
View file

@ -1,7 +1,7 @@
<template>
<div>
<div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
<div class="col-12 row q-py-sm items-center">
<div class="q-pa-sm" style="max-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>
</q-btn>
@ -126,22 +126,29 @@
</q-table>
</div>
<q-separator />
<div class="flex justify-end q-px-md q-gutter-sm">
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@click="previous"
class="q-pr-md"
label="กรอกรายละเอียด">
</q-btn>
<q-btn
flat
round
dense
unelevated
label="บันทึก"
color="public"
icon="mdi-content-save-outline"
@click="next"
>
<q-tooltip>บันทึก</q-tooltip>
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<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 dense flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn>
</q-btn> -->
</div>
</div>
</template>
@ -303,7 +310,6 @@ const getClass = (val: boolean) => {
color: #4154b3;
}
.custom-header-table {
max-height: 64vh;
.q-table tr:nth-child(odd) td {
background: white;
}

171
src/modules/05_placement/components/OrderPlacement/step/step03.vue
View file

@ -1,7 +1,7 @@
<template>
<div>
<div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
<div class="col-12 row q-py-sm items-center">
<div class="q-pa-sm" style="max-height: 68vh; overflow-y: scroll">
<div class="col-12 row q-pb-sm items-center">
<q-btn
size="12px"
flat
@ -55,93 +55,99 @@
/>
</div>
</div>
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
<q-table
flat
bordered
dense
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="name"
v-model:selected="selected"
class="custom-header-table"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:body-cell="props">
<q-td :props="props">
<div v-if="props.col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="props.col.name == 'notification'">
<q-select
:class="getClass(true)"
hide-bottom-space
multiple
:outlined="true"
dense
use-chips
lazy-rules
:readonly="!true"
:borderless="!true"
v-model="props.value"
:rules="[(val:any) => !!val || `${'กรุณาเลือกช่องทาง'}`,(val:any) => val.length > 0 || `${'กรุณาเลือกช่องทาง'}`]"
:label="`${'เลือกช่องทาง'}`"
emit-value
map-options
option-label="name"
:options="notificationOption"
option-value="id"
input-debounce="0"
color="primary"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-black">
ไม่พบข้อมูลที่ค้นหา
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div v-else @click="click(props)">
{{ props.value }}
</div>
</q-td>
</template>
<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>
</template>
</q-table>
</div>
<q-table
flat
bordered
dense
:rows="rows"
:columns="columns"
:visible-columns="visibleColumns"
:filter="filter"
row-key="name"
v-model:selected="selected"
class="custom-header-table"
:pagination-label="paginationLabel"
v-model:pagination="pagination"
>
<template v-slot:body-cell="props">
<q-td :props="props">
<div v-if="props.col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="props.col.name == 'notification'">
<q-select
:class="getClass(true)"
hide-bottom-space
multiple
:outlined="true"
dense
use-chips
lazy-rules
:readonly="!true"
:borderless="!true"
v-model="props.value"
:rules="[(val:any) => !!val || `${'กรุณาเลือกช่องทาง'}`,(val:any) => val.length > 0 || `${'กรุณาเลือกช่องทาง'}`]"
:label="`${'เลือกช่องทาง'}`"
emit-value
map-options
option-label="name"
:options="notificationOption"
option-value="id"
input-debounce="0"
color="primary"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-black">
ไม่พบข้อมูลที่ค้นหา
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div v-else @click="click(props)">
{{ props.value }}
</div>
</q-td>
</template>
<template v-slot:pagination="scope">
<q-pagination
v-model="pagination.page"
active-color="primary"
color="dark"
:max="scope.pagesNumber"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</q-table>
</div>
<q-separator />
<div class="flex justify-end q-px-md q-gutter-sm">
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@click="previous"
class="q-pr-md"
label="เลือกรายชื่อ">
</q-btn>
<q-btn
flat
round
dense
unelevated
label="บันทึก"
color="public"
icon="mdi-content-save-outline"
@click="next"
>
<q-tooltip>บันทึก</q-tooltip>
class="q-px-md"
><!-- icon="mdi-content-save-outline"
<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>
</q-btn> -->
</div>
</div>
</template>
@ -355,7 +361,6 @@ const getClass = (val: boolean) => {
color: #4154b3;
}
.custom-header-table {
max-height: 64vh;
.q-table tr:nth-child(odd) td {
background: white;
}

24
src/modules/05_placement/components/OrderPlacement/step/step04.vue
View file

@ -93,19 +93,25 @@
</q-splitter>
</div>
<q-separator />
<div class="flex justify-end q-px-md q-gutter-sm">
<div class="flex justify-end q-pa-sm q-gutter-sm">
<q-btn
dense
outline
color="primary"
icon="chevron_left"
@click="previous"
class="q-pr-md"
label="เลือกรายชื่อส่งสำเนา">
</q-btn>
<q-btn
flat
round
unelevated
label="บันทึก"
color="public"
icon="mdi-content-save-outline"
@click="next"
>
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
<q-btn flat round color="primary" icon="chevron_left" @click="previous">
<q-tooltip>ย้อนกลับ</q-tooltip>
> <!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
<q-tooltip>ต่อไป</q-tooltip>
</q-btn> -->

54
src/modules/05_placement/components/exams_other/Detail.vue → src/modules/05_placement/components/PersonalDetail/Detail.vue
View file

@ -2,22 +2,25 @@
<script setup lang="ts">
import { onMounted, reactive, ref } from "vue";
import { useDataStore } from "@/stores/data";
import { useRouter } from "vue-router";
import { useRoute, useRouter } from "vue-router";
const router = useRouter();
import Informationvue from "@/modules/05_placement/components/exams_other/Information/layout.vue";
import EducationVue from "@/modules/05_placement/components/exams_other/Education.vue";
import Certicate from "@/modules/05_placement/components/exams_other/Information/Certicate.vue";
import InsigniaVue from "@/modules/05_placement/components/exams_other/Insignia.vue";
import ExamResult from "@/modules/05_placement/components/exams_other/ExamResult.vue";
import Qualification from "@/modules/05_placement/components/exams_other/Qualification.vue";
import Informationvue from "@/modules/05_placement/components/PersonalDetail/Information/layout.vue";
import EducationVue from "@/modules/05_placement/components/PersonalDetail/Education.vue";
import Certicate from "@/modules/05_placement/components/PersonalDetail/Information/Certicate.vue";
import ExamResult from "@/modules/05_placement/components/PersonalDetail/ExamResult.vue";
import Qualification from "@/modules/05_placement/components/PersonalDetail/Qualification.vue";
import Family from "@/modules/05_placement/components/PersonalDetail/Information/Family.vue";
const store = useDataStore();
const { changeTab } = store;
const statusEdit = ref<boolean>(false);
const profileType = ref<string>("");
const route = useRoute();
const examId = ref<string>(route.params.personalId.toString());
const FormData = reactive<any>({
fullName: "นาย กอ กอกอก",
fullName: examId,
});
onMounted(async () => {
@ -35,29 +38,34 @@ onMounted(async () => {
รายละเอียดของ {{ FormData.fullName }}
</div>
</div>
<div>
<q-card flat bordered class="q-px-lg q-pb-lg">
<div id="information" name="1" class="row col-12 information">
<div class="q-pb-lg">
<q-card class="row q-pb-lg">
<div id="information" name="1" class="col-12 q-pa-sm">
<Informationvue v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div class="horizontal-line"></div>
<div id="education" name="2" class="row col-12 q-mt-md">
<EducationVue v-model:statusEdit="statusEdit" />
<div id="family" name="10" class="col-12 q-pa-sm" >
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<Family v-model:statusEdit="statusEdit" />
</div>
<div class="horizontal-line"></div>
<div id="certicate" name="4" class="row col-12 q-mt-md">
<div id="certicate" name="2" class="col-12 q-pa-sm" >
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<Certicate v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div class="horizontal-line"></div>
<div id="insignia" name="5" class="row col-12 q-mt-md">
<InsigniaVue v-model:statusEdit="statusEdit" />
<div id="education" name="3" class="col-12 q-pa-sm" >
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<EducationVue v-model:statusEdit="statusEdit" />
</div>
<div class="horizontal-line"></div>
<div id="examresult" name="6" class="q-px-lg q-py-lg">
<div id="examresult" name="4" class="col-12 q-pa-sm" >
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<ExamResult />
</div>
<div class="horizontal-line"></div>
<div id="qualification" name="7" class="q-px-lg q-py-lg">
<div id="qualification" name="5" class="col-12 q-pa-sm" >
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<Qualification v-model:statusEdit="statusEdit" />
</div>
</q-card>

68
src/modules/05_placement/components/exams_other/DialogFooter.vue → src/modules/05_placement/components/PersonalDetail/DialogFooter.vue
View file

@ -67,27 +67,61 @@ const clickPrevious = async () => {
</script>
<template>
<q-card-actions class="text-primary q-py-sm">
<q-btn flat round icon="mdi-menu-left" @click="clickPrevious" v-if="modalEdit == true" :disable="previous == false"
<q-btn
flat round
icon="mdi-menu-left"
@click="clickPrevious"
v-if="modalEdit == true"
:disable="previous == false"
:color="!previous ? 'grey-7' : 'public'" />
<q-btn flat round icon="mdi-menu-right" @click="clickNext" v-if="modalEdit == true" :disable="next == false"
<q-btn
flat round
icon="mdi-menu-right"
@click="clickNext"
v-if="modalEdit == true" :disable="next == false"
:color="!next ? 'grey-7' : 'public'" />
<q-space />
<q-btn v-if="modalEdit == true" flat round color="red" @click="clickDelete" icon="mdi-delete">
<q-tooltip>ลบข้อมูล</q-tooltip>
<q-btn
v-if="modalEdit == true"
unelevated
label="ลบข้อมูล"
color="red"
@click="clickDelete"
><!-- icon="mdi-delete"
<q-tooltip>ลบข้อมูล</q-tooltip> -->
</q-btn>
<q-btn v-if="!editvisible" flat round :disabled="editvisible" :color="editvisible ? 'grey-7' : 'primary'"
@click="edit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
<q-btn
v-show="editvisible"
flat
:disabled="!editvisible"
:outline="!editvisible"
:color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()"
label="ยกเลิกแก้ไข"
v-if="modalEdit == true">
<!-- icon="mdi-undo"
<q-tooltip>ยกเลิก</q-tooltip> -->
</q-btn>
<q-btn
v-if="!editvisible"
outline
label="แก้ไขข้อมูล"
:disabled="editvisible"
:color="editvisible ? 'grey-7' : 'primary'"
@click="edit">
<!-- icon="mdi-pencil-outline"
<q-tooltip></q-tooltip> -->
</q-btn>
<q-btn
v-if="editvisible"
unelevated
:disabled="!editvisible"
:color="!editvisible ? 'grey-7' : 'public'"
@click="checkSave"
label="บันทึก"
><!-- icon="mdi-content-save-outline"
<q-tooltip>บันทึก</q-tooltip> -->
</q-btn>
<div v-else>
<q-btn flat round :disabled="!editvisible" :outline="!editvisible" :color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()" icon="mdi-undo" v-if="modalEdit == true">
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
<q-btn flat round :disabled="!editvisible" :color="!editvisible ? 'grey-7' : 'public'" @click="checkSave"
icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
</q-card-actions>
</template>

0
src/modules/05_placement/components/exams_other/DialogHeader.vue → src/modules/05_placement/components/PersonalDetail/DialogHeader.vue
View file

6
src/modules/05_placement/components/exams_other/Education.vue → src/modules/05_placement/components/PersonalDetail/Education.vue
View file

@ -4,9 +4,9 @@ import { useRoute } from "vue-router";
import { useProfileDataStore } from "@/modules/05_placement/store";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStore } from "@/stores/data";
import ProfileTable from "@/modules/05_placement/components/exams_other/Table.vue";
import DialogHeader from "@/modules/05_placement/components/exams_other/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/exams_other/DialogFooter.vue";
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Table.vue";
import DialogHeader from "@/modules/05_placement/components/PersonalDetail/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
import { useQuasar } from "quasar";
import type {
RequestItemsObject,

24
src/modules/05_placement/components/exams_other/ExamResult.vue → src/modules/05_placement/components/PersonalDetail/ExamResult.vue
View file

@ -1,14 +1,14 @@
<script setup lang="ts">
</script>
<template>
<div class="row">
<div class="row col-12 q-px-lg q-pt-lg q-pb-sm no-border">
<q-icon name="mdi-briefcase-edit" size="1.5em" color="grey-5" class="q-pr-md" />
<span class="text-bold text-subtitle2 ">ผลการสอบ</span>
<span class="text-bold text-subtitle2">ผลการสอบ</span>
</div>
<div class="row">
<div class="col-7 q-pl-xl">
<div class="row q-px-md">
<div class="col-7">
<q-card class="card-exam">
<div class="row">
<div class="row q-px-md q-py-sm">
<div class="col q-pa-xs header-sub-text-exam">
<div class="q-pb-xs"> ประเภท </div>
<div class="q-pb-xs"> ภาค ก </div>
@ -35,12 +35,12 @@
</div>
<div class="col q-pl-xl">
<q-card class="q-pt-xs">
<div class="header-text-right">ผลการสอบ</div>
<div class="sub-text-right q-pb-xs">ผ่าน</div>
<div class="header-text-right">ลำดับที่สอบได้</div>
<div class="sub-text-right q-pb-xs">3</div>
<div class="header-text-right">จำนวนครั้งที่สมัครสอบ</div>
<div class="sub-text-right q-pb-xs">5</div>
<div class="header-text-right q-px-xs">ผลการสอบ</div>
<div class="sub-text-right q-px-xs q-pb-sm">ผ่าน</div>
<div class="header-text-right q-px-xs">ลำดับที่สอบได้</div>
<div class="sub-text-right q-px-xs q-pb-sm">3</div>
<div class="header-text-right q-px-xs">จำนวนครั้งที่สมัครสอบ</div>
<div class="sub-text-right q-px-xs q-pb-sm">5</div>
</q-card>
</div>
</div>
@ -53,7 +53,7 @@
}
.header-text-right {
font-size: 12px;
font-size: 14px;
font-weight: 400;
line-height: 150%;
color: #818181;

104
src/modules/05_placement/components/exams_other/Information/Address.vue → src/modules/05_placement/components/PersonalDetail/Information/Address.vue
View file

@ -10,9 +10,9 @@ import type {
Address,
DataOption,
zipCodeOption,
} from "@/modules/05_placement/components/exams_other/profileType";
import { defaultAddress } from "@/modules/05_placement/components/exams_other/profileType";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
} from "@/modules/05_placement/components/PersonalDetail/profileType";
import { defaultAddress } from "@/modules/05_placement/components/PersonalDetail/profileType";
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
import type { RequestItemsHistoryObject } from "@/modules//05_placement/interface/request/Address";
import type { ResponseObject } from "@/modules//05_placement/interface/response/Address";
import HistoryTable from "@/components/TableHistory.vue";
@ -348,56 +348,56 @@ const fetchData = async () => {
};
const editData = async () => {
const body: ResponseObject = {
registrationSame: addressData.value.same == "1",
registrationAddress: addressData.value.address,
registrationSubDistrictId: addressData.value.subdistrictId,
registrationDistrictId: addressData.value.districtId,
registrationProvinceId: addressData.value.provinceId,
registrationZipCode: codep.value,
currentAddress:
addressData.value.same == "1"
? addressData.value.address
: addressData.value.addressC,
currentSubDistrictId:
addressData.value.same == "1"
? addressData.value.subdistrictId
: addressData.value.subdistrictIdC,
currentDistrictId:
addressData.value.same == "1"
? addressData.value.districtId
: addressData.value.districtIdC,
currentProvinceId:
addressData.value.same == "1"
? addressData.value.provinceId
: addressData.value.provinceIdC,
currentZipCode: addressData.value.same == "1" ? codep.value : codec.value,
createdAt: new Date(),
createdFullName: "-",
};
showLoader();
await http
.put(config.API.profileAdrsId(route.params.id.toString()), body)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await getNewData();
});
// const body: ResponseObject = {
// registrationSame: addressData.value.same == "1",
// registrationAddress: addressData.value.address,
// registrationSubDistrictId: addressData.value.subdistrictId,
// registrationDistrictId: addressData.value.districtId,
// registrationProvinceId: addressData.value.provinceId,
// registrationZipCode: codep.value,
// currentAddress:
// addressData.value.same == "1"
// ? addressData.value.address
// : addressData.value.addressC,
// currentSubDistrictId:
// addressData.value.same == "1"
// ? addressData.value.subdistrictId
// : addressData.value.subdistrictIdC,
// currentDistrictId:
// addressData.value.same == "1"
// ? addressData.value.districtId
// : addressData.value.districtIdC,
// currentProvinceId:
// addressData.value.same == "1"
// ? addressData.value.provinceId
// : addressData.value.provinceIdC,
// currentZipCode: addressData.value.same == "1" ? codep.value : codec.value,
// createdAt: new Date(),
// createdFullName: "-",
// };
// showLoader();
// await http
// .put(config.API.profileAdrsId(route.params.id.toString()), body)
// .then((res) => {
// success($q, "บันทึกข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// edit.value = false;
// emit("update:statusEdit", false);
// await getNewData();
// });
};
const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
} else {
}
});
// await myform.value.validate().then(async (success: boolean) => {
// if (success) {
// await editData();
// } else {
// }
// });
};
const selectProvince = async (e: string | null, name: string) => {
@ -546,13 +546,13 @@ const getClass = (val: boolean) => {
};
</script>
<template>
<q-card flat class="col-12 q-px-lg q-py-md q-mt-md no-border">
<q-card class="col-12 q-px-lg q-py-md q-mt-md no-border">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
:history="true"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"

6
src/modules/05_placement/components/exams_other/Information/Certicate.vue → src/modules/05_placement/components/PersonalDetail/Information/Certicate.vue
View file

@ -5,9 +5,9 @@ import { useRoute } from "vue-router";
import { useProfileDataStore } from "@/modules/05_placement/store";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStore } from "@/stores/data";
import ProfileTable from "@/modules/05_placement/components/exams_other/Table.vue";
import DialogHeader from "@/modules/05_placement/components/exams_other/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/exams_other/DialogFooter.vue";
import ProfileTable from "@/modules/05_placement/components/PersonalDetail/Table.vue";
import DialogHeader from "@/modules/05_placement/components/PersonalDetail/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/PersonalDetail/DialogFooter.vue";
import { useQuasar } from "quasar";
import type {
RequestItemsObject,

1099
src/modules/05_placement/components/PersonalDetail/Information/Family.vue Normal file
View file

File diff suppressed because it is too large Load diff

94
src/modules/05_placement/components/exams_other/Information/Information.vue → src/modules/05_placement/components/PersonalDetail/Information/Information.vue
View file

@ -7,15 +7,15 @@ import { useQuasar } from "quasar";
import type {
Information,
DataOption,
} from "@/modules/05_placement/components/exams_other/profileType";
import { defaultInformation } from "@/modules/05_placement/components/exams_other/profileType";
} from "@/modules/05_placement/components/PersonalDetail/profileType";
import { defaultInformation } from "@/modules/05_placement/components/PersonalDetail/profileType";
import type {
RequestItemsHistoryObject,
Columns,
} from "@/modules/05_placement/interface/request/Information";
import type { ResponseObject } from "@/modules/05_placement/interface/response/Information";
import type { InformationOps } from "@/modules/05_placement/interface/index/Main";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
import HistoryTable from "@/components/TableHistory.vue";
import http from "@/plugins/http";
import config from "@/app.config";
@ -293,10 +293,10 @@ onMounted(async () => {
});
const onCancel = async () => {
if (myform.value != null) {
myform.value.reset();
}
await fetchData();
// if (myform.value != null) {
// myform.value.reset();
// }
// await fetchData();
};
/**
@ -538,45 +538,45 @@ const fetchData = async () => {
};
const editData = async () => {
if (age.value == false) {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
return;
}
const body: any = {
citizenId: informaData.value.cardid,
prefixId: informaData.value.prefixId,
firstName: informaData.value.firstname,
lastName: informaData.value.lastname,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.ethnicity,
religionId: informaData.value.religionId,
birthDate: dateToISO(informaData.value.birthDate) ?? dateToISO(new Date()),
bloodGroupId: informaData.value.bloodId,
relationshipId: informaData.value.statusId,
telephoneNumber: informaData.value.tel,
createdAt: new Date(),
age: null,
employeeType: informaData.value.employeeType,
employeeClass: informaData.value.employeeClass,
profileType: informaData.value.profileType,
createdFullName: "-",
};
showLoader();
await http
.put(config.API.profileInforId(route.params.id.toString()), body)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await fetchData();
await changeBirth(informaData.value.birthDate ?? new Date());
});
// if (age.value == false) {
// modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
// return;
// }
// const body: any = {
// citizenId: informaData.value.cardid,
// prefixId: informaData.value.prefixId,
// firstName: informaData.value.firstname,
// lastName: informaData.value.lastname,
// genderId: informaData.value.genderId,
// nationality: informaData.value.nationality,
// race: informaData.value.ethnicity,
// religionId: informaData.value.religionId,
// birthDate: dateToISO(informaData.value.birthDate) ?? dateToISO(new Date()),
// bloodGroupId: informaData.value.bloodId,
// relationshipId: informaData.value.statusId,
// telephoneNumber: informaData.value.tel,
// createdAt: new Date(),
// age: null,
// employeeType: informaData.value.employeeType,
// employeeClass: informaData.value.employeeClass,
// profileType: informaData.value.profileType,
// createdFullName: "-",
// };
// showLoader();
// await http
// .put(config.API.profileInforId(route.params.id.toString()), body)
// .then((res) => {
// success($q, "บันทึกข้อมูลสำเร็จ");
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// edit.value = false;
// emit("update:statusEdit", false);
// await fetchData();
// await changeBirth(informaData.value.birthDate ?? new Date());
// });
};
const saveData = async () => {
@ -617,7 +617,7 @@ const getClass = (val: boolean) => {
header="ข้อมูลส่วนตัว"
icon="mdi-account"
:save="saveData"
:history="true"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"

21
src/modules/05_placement/components/exams_other/Information/layout.vue → src/modules/05_placement/components/PersonalDetail/Information/layout.vue
View file

@ -1,8 +1,8 @@
<!-- card รวม ข้อมูลส่วนตัว กับ ที่อยู่ -->
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import Information from "@/modules/05_placement/components/exams_other/Information/Information.vue";
import Address from "@/modules/05_placement/components/exams_other/Information/Address.vue";
import Information from "@/modules/05_placement/components/PersonalDetail/Information/Information.vue";
import Address from "@/modules/05_placement/components/PersonalDetail/Information/Address.vue";
import { useCounterMixin } from "@/stores/mixin";
const props = defineProps({
@ -46,18 +46,21 @@ const closeModalError = () => {
</script>
<template>
<div>
<Information :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
</div>
<div class="horizontal-line"></div>
<div>
<Address :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
<div class="row col-12 items-center">
<div>
<Information :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
</div>
<div class="col-12 q-px-md"><q-separator size="4px"/></div>
<div>
<Address :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
</div>
</div>
</template>
<style lang="scss" scoped>
.horizontal-line {
background-color: #F4F4F4;
width: 100%;
height: 5px;
}
</style>

0
src/modules/05_placement/components/exams_other/Information/top.vue → src/modules/05_placement/components/PersonalDetail/Information/top.vue
View file

91
src/modules/05_placement/components/PersonalDetail/Qualification.vue Normal file
View file

@ -0,0 +1,91 @@
<script setup lang="ts">
import { ref } from 'vue';
import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
import type { QForm } from 'quasar';
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
const $q = useQuasar();
const mixin = useCounterMixin();
const {
modalError,
} = mixin;
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
notiNoEdit: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits(["update:statusEdit"]);
const edit = ref<boolean>(false);
const myform = ref<QForm | null>(null);
const saveData = async () => {
if (myform.value != null) {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
} else {
}
});
}
};
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);
}
} else {
emit("update:statusEdit", false);
}
};
const editData = async () => {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
}
const onCancel = async () => {
if (myform.value != null) {
myform.value.reset();
}
// await fetchData();
};
const selection = ref([]);
const checkboxItems: CheckboxItem[] = [
{ id: 1, label: 'ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง' },
{ id: 2, label: 'ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.' },
{ id: 3, label: 'ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 4, label: 'ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม' },
{ id: 5, label: 'ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง' },
{ id: 6, label: 'ไม่เป็นบุคคลล้มละลาย' },
{ id: 7, label: 'ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ' },
{ id: 8, label: 'ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ' },
{ id: 9, label: 'เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 10, label: 'เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 11, label: 'เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ' },
]
</script>
<template>
<div class="row col-12 q-px-lg q-pt-lg q-pb-sm no-border">
<HeaderTop v-model:edit="edit" header="การคัดกรองคุณสมบัติ" icon="mdi-account-search" :save="saveData"
:history="false" :changeBtn="changeBtn" :disable="statusEdit" :cancel="onCancel" />
</div>
<div class="row col-12 q-px-lg">
<div v-for="item of checkboxItems" :key="item.id" class="q-pt-sm">
<q-checkbox size="xs" v-model="selection" :val="item.id" :label="item.label" keep-color color="gray-5"
:disable="!statusEdit" />
<q-separator />
</div>
</div>
</template>

2
src/modules/05_placement/components/exams_other/Table.vue → src/modules/05_placement/components/PersonalDetail/Table.vue
View file

@ -1,6 +1,6 @@
<script setup lang="ts">
import { ref, useAttrs } from "vue";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
import HeaderTop from "@/modules/05_placement/components/PersonalDetail/Information/top.vue";
import type { Pagination } from "@/modules/05_placement/interface/index/Main";
const attrs = ref<any>(useAttrs());

0
src/modules/05_placement/components/exams_other/profileType.ts → src/modules/05_placement/components/PersonalDetail/profileType.ts
View file

1199
src/modules/05_placement/components/exams_other/Insignia.vue
View file

File diff suppressed because it is too large Load diff

421
src/modules/05_placement/components/exams_other/Main.vue
View file

@ -1,421 +0,0 @@
<script setup lang="ts">
import { onMounted, reactive, ref, useAttrs } from 'vue';
import type { QTableProps } from 'quasar';
import type { FormPlacementMainData } from "@/modules/05_placement/interface/request/Main";
import type { DataOption } from "@/modules/05_placement/interface/index/Main";
import { useCounterMixin } from "@/stores/mixin";
import { usePlacementDataStore } from "@/modules/05_placement/store";
import router from '@/router';
const DataStore = usePlacementDataStore()
const mixin = useCounterMixin();
const { dateText } = mixin;
// แปลงเวลา ค.ศ ให้เป็น พ.ศ
const textDate = (value: Date) => {
return dateText(value);
};
// หัวตาราง
const columns = ref<QTableProps["columns"]>([
{
name: "id",
align: "left",
label: "ลำดับ",
sortable: true,
field: "id",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "examRound",
align: "left",
label: "รอบการสอบ",
sortable: true,
field: "examRound",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "examOrder",
align: "left",
label: "ครั้งที่",
sortable: true,
field: "examOrder",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "fiscalYear",
align: "left",
label: "ปีงบประมาณ",
sortable: true,
field: "fiscalYear",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "numberofCandidates",
align: "left",
label: "จำนวนผู้สอบได้",
sortable: false,
field: "numberofCandidates",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "examType",
align: "left",
label: "ประเภทการสอบ",
sortable: false,
field: "examType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "accountExpirationDate",
align: "left",
label: "วันที่บัญชีหมดอายุ",
sortable: true,
field: "accountExpirationDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
// ข้อมูลตาราง (จำลอง)
const rows = ref<FormPlacementMainData[]>([{
id: 1,
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 3,
fiscalYear: 2023,
numberofCandidates: 8,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 2,
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 12,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 3,
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 20,
examType: 1,
accountExpirationDate: "2023-01-31T14:47:04.1785384Z"
},
{
id: 4,
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2022,
numberofCandidates: 16,
examType: 2,
accountExpirationDate: "2023-11-30T14:47:04.1785384Z"
},
{
id: 5,
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 1,
fiscalYear: 2021,
numberofCandidates: 20,
examType: 2,
accountExpirationDate: "2024-05-21T14:47:04.1785384Z",
},
]);
let OriginalData = ref<FormPlacementMainData[]>([]);
let UpdataData = ref<FormPlacementMainData[]>([]);
const OriginalDataFetch = async () => {
// API
// await http
// .get(config.API.// ตัวอย่าง)
// .then((res: any) => {
// })
// .catch((e: any) => {
// messageError($q, e);
// })
// .finally(async () => {
// });
await DataStore.DataMain(rows.value)
OriginalData.value = await DataStore.DataMainOrig
UpdataData.value = OriginalData.value
}
onMounted(async () => {
await OriginalDataFetch()
fiscalYearFilter()
examTimeFilter()
examTypeFilter()
await expiredAccountFilter()
searchFilterTable()
})
// ดูรายการสอบแข่งขัน หน้าต่อไป
const redirectToPage = (id?: number) => {
router.push(`/placement2/detail`);
};
// เลือกปีงบประมาณ
const fiscalyear = ref<number | null>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: 'ทั้งหมด' }]);
const addedfiscalYearValues: number[] = [];
const fiscalYearFilter = async () => {
// API
// await http
// .get(config.API.// ตัวอย่าง)
// .then((res: any) => {
// DataStore.DataMainYearSet(rows.value);
// fiscalyearOP.value = DataStore.DataMainYearGet;
// })
// .catch((e: any) => {
// messageError($q, e);
// })
// .finally(async () => {
// });
for (let data of OriginalData.value) {
const year = data.fiscalYear + 543;
if (fiscalyear.value === null || year > fiscalyear.value) {
fiscalyear.value = year;
}
if (!addedfiscalYearValues.includes(year)) {
fiscalyearOP.push({ id: year, name: year.toString() });
addedfiscalYearValues.push(year);
}
}
}
// เลือกปีงบประมาณตาม 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);
const resetFilter = () => {
filterKeyword.value = "";
filterRef.value.focus();
};
const attrs = ref<any>(useAttrs());
const visibleColumns = ref<string[]>(['id', 'examRound', 'examOrder', 'fiscalYear', 'numberofCandidates', 'examType', 'accountExpirationDate']) //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
// ครั้งที่สอบ
const examTime = ref<number | null>(null);
const examTimeOP = ref<number[]>([]);
const examTimeFilter = async () => {
for (let data of OriginalData.value) {
if (!examTimeOP.value.includes(data.examOrder)) {
examTimeOP.value.push(data.examOrder);
}
}
examTimeOP.value.sort((a, b) => a - b); // เรียงลำดับ
}
// ประเภทการสอบ
const examType = ref<number | null>(0);
const examTypeOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const addedexamTypeValues: number[] = [];
const examTypeFilter = async () => {
for (let data of OriginalData.value) {
const examTypeValue = data.examType;
if (examTypeValue == 1 && !addedexamTypeValues.includes(1)) {
examTypeOP.push({ id: 1, name: "คัดเลือก" });
addedexamTypeValues.push(1);
} else if (examTypeValue == 2 && !addedexamTypeValues.includes(2)) {
examTypeOP.push({ id: 2, name: "สอบแข่งขัน" });
addedexamTypeValues.push(2);
}
}
}
const searchFilterTable = async () => {
// console.log('Input value changed:', examTime.value, examType.value, expiredAccount.value);
await DataStore.DataUpdateMain(examTime.value, examType.value, expiredAccount.value);
UpdataData.value = DataStore.DataMainUpdate
};
// บัญชีหมดอายุ
const expiredAccount = ref<boolean>(false);
const expiredAccountFilter = async () => {
const currentDate = new Date();
const updatedRows = OriginalData.value.map((data) => {
let expirationDate = new Date(data.accountExpirationDate);
let isExpired = expirationDate < currentDate
return { ...data, isExpired };
});
await DataStore.DataMain(updatedRows);
};
const paging = ref<boolean>(true);
const paginationLabel = (start: string, end: string, total: string) => {
if (paging.value == true)
return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
};
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
รายการสอบแข่งขัน / คัดเลือก
</div>
<div>
<q-card flat bordered class="col-12 q-mt-sm">
<div class="row q-pa-md">
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select v-model="fiscalyear" label="ปีงบประมาณ" dense clearable emit-value map-options :options="fiscalyearOP"
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchfiscalyear" />
</div>
<div class="col-xs-12 col-sm-3 col-md-6"></div>
<div class="col-xs-12 col-sm-3 col-md-2">
<q-input standout dense v-model="filterKeyword" ref="filterRef" outlined debounce="300" placeholder="ค้นหา"
class="q-ml-sm">
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
</template>
</q-input>
</div>
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select v-model="visibleColumns" multiple outlined dense options-dense :display-value="$q.lang.table.columns"
emit-value map-options :options="columns" option-value="name" options-cover style="min-width: 150px"
class="gt-xs q-ml-sm" />
</div>
</div>
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
<q-card bordered class="col-12 filter-card">
<div class="row q-pa-sm">
<div class="col-xs-12 col-sm-3 col-md-2 q-pl-sm">
<q-select v-model="examTime" label="ครั้งที่" dense clearable emit-value map-options :options="examTimeOP"
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
</div>
<div class="col-xs-12 col-sm-3 col-md-2 q-pl-sm">
<q-select v-model="examType" label="ประเภทการสอบ" dense clearable emit-value map-options option-label="name"
:options="examTypeOP" option-value="id" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFilterTable" />
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-toggle v-model="expiredAccount" class="toggle-expired-account" color="blue" label="แสดงบัญชีหมดอายุ"
@update:model-value="searchFilterTable" />
</div>
</div>
</q-card>
</div>
<div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
<q-table ref="table" :columns="columns" :rows="UpdataData" :filter="filterKeyword" row-key="id" flat bordered
dense class="custom-header-table" v-bind="attrs" :visible-columns="visibleColumns"
:pagination-label="paginationLabel">
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer" @click="redirectToPage(props.row.id)">
<q-td key="id" :props="props">
{{ props.row.id }}
</q-td>
<q-td key="examRound" :props="props">
{{ props.row.examRound }}
</q-td>
<q-td key="examOrder" :props="props">
{{ props.row.examOrder }}
</q-td>
<q-td key="fiscalYear" :props="props">
{{ props.row.fiscalYear + 543 }}
</q-td>
<q-td key="numberofCandidates" :props="props">
{{ props.row.numberofCandidates }}
</q-td>
<q-td key="examType" :props="props">
{{ props.row.examType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
</q-td>
<q-td key="accountExpirationDate" :props="props">
{{ textDate(props.row.accountExpirationDate) }}
</q-td>
</q-tr>
</template>
</q-table>
</div>
</q-card>
</div>
</template>
<style lang="scss" scope>
.filter-card {
background-color: #f1f1f1b0;
}
.toggle-expired-account {
font-size: 12px;
font-weight: 400;
font-size: 15px;
line-height: 150%;
color: #35373C;
}
.icon-color {
color: #4154b3;
}
.custom-header-table {
max-height: 64vh;
.q-table tr:nth-child(odd) td {
background: white;
}
.q-table tr:nth-child(even) td {
background: #f8f8f8;
}
.q-table thead tr {
background: #ecebeb;
}
.q-table thead tr th {
position: sticky;
z-index: 1;
}
/* this will be the loading indicator */
.q-table thead tr:last-child th {
/* height of all previous header rows */
top: 48px;
}
.q-table thead tr:first-child th {
top: 0;
}
}
</style>

105
src/modules/05_placement/components/exams_other/Qualification.vue
View file

@ -1,105 +0,0 @@
<script setup lang="ts">
import { ref } from 'vue';
import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
import type { QForm } from 'quasar';
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
const $q = useQuasar();
const mixin = useCounterMixin();
const {
modalError,
} = mixin;
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
notiNoEdit: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits(["update:statusEdit"]);
const edit = ref<boolean>(false);
const myform = ref<QForm | null>(null);
const saveData = async () => {
if (myform.value != null) {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
} else {
}
});
}
};
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);
}
} else {
emit("update:statusEdit", false);
}
};
const editData = async () => {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
}
const onCancel = async () => {
if (myform.value != null) {
myform.value.reset();
}
// await fetchData();
};
const selection = ref([]);
const checkboxItems: CheckboxItem[] = [
{ id: 1, label: 'ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง' },
{ id: 2, label: 'ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.' },
{ id: 3, label: 'ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 4, label: 'ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม' },
{ id: 5, label: 'ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง' },
{ id: 6, label: 'ไม่เป็นบุคคลล้มละลาย' },
{ id: 7, label: 'ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ' },
{ id: 8, label: 'ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ' },
{ id: 9, label: 'เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 10, label: 'เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 11, label: 'เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ' },
]
</script>
<template>
<div class="row">
<HeaderTop
v-model:edit="edit"
header="การคัดกรองคุณสมบัติ"
icon="mdi-briefcase-edit"
:save="saveData"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
/>
</div>
<div class="contanier-checkbox">
<div v-for="item of checkboxItems" :key="item.id" class="q-pt-md">
<q-checkbox size="xs" v-model="selection" :val="item.id" :label="item.label" keep-color color="teal"
:disable="false" />
<q-separator />
</div>
</div>
</template>
<style lang="scss" scoped>
.contanier-checkbox {
padding-left: 20px;
padding-top: 10px;
}
</style>

24
src/modules/05_placement/components/pass/DialogFooter.vue
View file

@ -45,15 +45,25 @@ const checkSave = () => {
<template>
<q-card-actions class="text-primary">
<q-space />
<q-btn v-if="!editvisible" flat round :disabled="editvisible" :color="editvisible ? 'grey-7' : 'primary'"
@click="edit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
<q-btn
v-if="!editvisible"
outline
:disabled="editvisible"
:color="editvisible ? 'grey-7' : 'primary'"
@click="edit"
><!-- icon="mdi-pencil-outline"
<q-tooltip>แก้ไขข้อมูล</q-tooltip> -->
</q-btn>
<div v-else>
<q-btn flat round :disabled="!editvisible" :color="!editvisible ? 'grey-7' : 'public'" @click="checkSave"
icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
<q-btn
unelevated
label="บันทึก"
:disabled="!editvisible"
:color="!editvisible ? 'grey-7' : 'public'"
@click="checkSave"
>
</q-btn><!-- icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip> -->
</div>
</q-card-actions>
</template>

21
src/modules/05_placement/interface/index/Main.ts
View file

@ -1,4 +1,4 @@
import type { zipCodeOption } from "../../components/exams_other/profileType";
import type { zipCodeOption } from "../../components/PersonalDetail/profileType";
interface DataOption {
id: number | string;
name: string;
@ -16,7 +16,6 @@ interface EduOps {
positionPathOptions: DataOption[];
}
interface InformationOps {
prefixOps: DataOption[];
genderOps: DataOption[];
@ -54,14 +53,14 @@ interface CheckboxItem {
label: string;
}
export type {
DataOption,
DataOptionInsignia,
treeTab,
InformationOps,
AddressOps,
Pagination,
EduOps,
export type {
DataOption,
DataOptionInsignia,
treeTab,
InformationOps,
AddressOps,
Pagination,
EduOps,
InsigniaOps,
CheckboxItem
CheckboxItem,
};

66
src/modules/05_placement/router.ts
View file

@ -2,14 +2,12 @@
* Router บรรจุ แต่งตั้ง ย้าย โอน (Placement)
*/
const MainSorkorcho = () =>
import("@/modules/05_placement/components/exams_sorkorcho/Main.vue");
const PlacementMain = () =>
import("@/modules/05_placement/components/Main.vue");
const PlacementDetail = () =>
import("@/modules/05_placement/components/pass/Detail.vue");
const MainOther = () =>
import("@/modules/05_placement/components/exams_other/Main.vue");
const Placement2Detail = () =>
import("@/modules/05_placement/components/exams_other/Detail.vue");
const PlacementPersonalDetail = () =>
import("@/modules/05_placement/components/PersonalDetail/Detail.vue");
const addOrderPlacement = () =>
import(
"@/modules/05_placement/components/OrderPlacement/addOrderPlacement.vue"
@ -25,32 +23,12 @@ const detailOrderReplace = () =>
export default [
{
path: "/placement/Sorkorcho",
path: "/placement",
name: "placement",
component: MainSorkorcho,
component: PlacementMain,
meta: {
Auth: true,
Key: [7],
Role: "placement",
},
},
{
path: "/placement/order",
name: "Orderplacement",
component: MainOrderPlacement,
meta: {
Auth: true,
Key: [7],
Role: "placement",
},
},
{
path: "/placement/order/detail",
name: "OrderplacementDetail",
component: detailOrderReplace,
meta: {
Auth: true,
Key: [7],
Key: [6.1],
Role: "placement",
},
},
@ -60,27 +38,37 @@ export default [
component: PlacementDetail,
meta: {
Auth: true,
Key: [7],
Key: [6.1],
Role: "placement",
},
},
{
path: "/placement2",
name: "placement2",
component: MainOther,
path: "/placement/detail/:personalId",
name: "PlacementPersonalDetail",
component: PlacementPersonalDetail,
meta: {
Auth: true,
Key: [7],
Key: [6.1],
Role: "placement",
},
},
{
path: "/placement2/detail",
name: "placement2Detail",
component: Placement2Detail,
path: "/placement/order",
name: "Orderplacement",
component: MainOrderPlacement,
meta: {
Auth: true,
Key: [7],
Key: [6.2],
Role: "placement",
},
},
{
path: "/placement/order/detail",
name: "OrderplacementDetail",
component: detailOrderReplace,
meta: {
Auth: true,
Key: [6.2],
Role: "placement",
},
},
@ -90,7 +78,7 @@ export default [
component: addOrderPlacement,
meta: {
Auth: true,
Key: [8],
Key: [6.2],
Role: "placement",
},
},

140
src/views/MainLayout.vue
View file

@ -13,7 +13,7 @@ import type {
import {
menuList,
tabList,
tabList_placement,
tabListPlacement,
} from "../interface/request/main/main";
const { setVerticalScrollPosition, getVerticalScrollPosition } = scroll;
@ -71,10 +71,6 @@ const tabScroll = () => {
return route.name == "registryDetail";
};
const tabScroll2 = () => {
return route.name == "placement2Detail";
};
/**
* toggleBtnRight ปุ่มย่อ ขยาย drawer ขวา
*/
@ -101,7 +97,7 @@ const toggleBtnLeft = () => {
const onScroll = (scroll: ScrollType) => {
const { position } = scroll;
updateScroll(position);
updateScroll2(position);
updateScrollPlacement(position);
};
/**
@ -161,60 +157,6 @@ const activeBtn = () => {
return route.name == "registryDetail" && rightActive.value;
};
const updateScroll2 = (position: number) => {
// เมื่อ position เป็น undifind ให้ position เป็น ตำแหน่ง top ที่ scroll
if (position === void 0) {
position = document.documentElement.scrollTop || document.body.scrollTop;
}
let last;
/**
* วนหา id ของ div นั้น
*/
for (const i in tabList_placement) {
const section = tabList_placement[i];
const item = document.getElementById(section.tag);
/**
* วนหา id ของ div หน้านั้น
* เมื่อหาไม่เจอให้ไปต่อตัวต่อไป
* เมื่อเจอแล้ว ให้ ตำแหน่งบนสุดของ div นั้น มากกว่าหรือเท่ากับ ตำแหน่ง top ที่ scroll บวกกับ แทปด้านบน 155
* ถ้า last เป็น undifind ให้ last เท่ากับ tag แล้ว หยุดลูป
* ถ้าไม่ใช้ undifind ให้ last เท่ากับ tag แล้ว ลูปหาต่อ กรณี div นั้นยาว
*/
if (item === null) {
continue;
}
if (item.offsetTop >= position + 155) {
if (last === void 0) {
last = section.tag;
}
break;
} else {
last = section.tag;
}
}
/**
* ถ้า last ไม่เท่ากับ undifind
* ใช้ เซ็ท active ให้เป็นแทปสีฟ้า
* และใช้ scrollIntoView ย้ายตำแหน่ง activeโดยการเลื่อนไปหา
*/
if (last !== void 0) {
changeTab(last);
const tocEl = document.getElementById("tab--" + last);
if (tocEl) {
tocEl.scrollIntoView({ block: "nearest" });
}
}
};
/**
* ให้แสดง แทปด้านขวา เมื่อเข้าหน้า รายละเอียดหน่อยงานอื่นๆ และ rightActive เท่ากับ true
*/
const activeBtn2 = () => {
return route.name == "placement2Detail" && rightActive.value;
};
/**
* เมื่อเริ่มต้นโปรแกรมให้ฟัง event resize และ function myEventHandler
* set function myEventHandler เพราะ state ยังไม่เซ็ท , state เซ็ทเมื่อ หน้าจอเริ่ม ขยับหน้าจอ
@ -298,8 +240,7 @@ const tagClick = (tag: string) => {
// router.replace({ hash });
if (route.hash !== hash) {
const check = activeBtn();
const check2 = activeBtn2();
if (check || check2) {
if (check) {
// router.replace({ hash, position: { x: 0, y: 0 } });
// router.replace({ hash }).then(() => {
// setVerticalScrollPosition(window, offset, 300);
@ -314,6 +255,71 @@ const tagClick = (tag: string) => {
}
};
//**** Tab Right หน้าจอแก้ไขข้อมูลส่วนตัวของผู้สอบผ่าน ****\\
const tabScrollPlacement = () => {
return route.name == "PlacementPersonalDetail";
};
const updateScrollPlacement = (position: number) => {
if (position === void 0) {
position = document.documentElement.scrollTop || document.body.scrollTop;
}
let last;
for (const i in tabListPlacement) {
const section = tabListPlacement[i];
const item = document.getElementById(section.tag);
if (item === null) {
continue;
}
if (item.offsetTop >= position + 100) {
if (last === void 0) {
last = section.tag;
}
break;
} else {
last = section.tag;
}
}
if (last !== void 0) {
changeTab(last);
const tocEl = document.getElementById("tab--" + last);
if (tocEl) {
tocEl.scrollIntoView({ block: "nearest" });
}
}
};
const activeBtnPlacement = () => {
return route.name == "PlacementPersonalDetail" && rightActive.value;
};
const activeTabPlacement = (tag: string) => {
return tabData.value == tag;
};
const tagClickPlacement = (tag: string) => {
const hash = `#${tag}`;
const items = document.getElementById(tag);
const offset = Math.max(0, items == null ? 0 : items.offsetTop + 50);
// router.replace({ hash });
if (route.hash !== hash) {
const checkPlacement = activeBtnPlacement();
if (checkPlacement) {
drawerR.value = !drawerR.value;
setVerticalScrollPosition(window, offset, 300);
} else {
setVerticalScrollPosition(window, offset, 300);
}
} else {
setVerticalScrollPosition(window, offset, 300);
}
};
//**** End Tab Right หน้าจอแก้ไขข้อมูลส่วนตัวของผู้สอบผ่าน ****\\
/**
* logout keycloak
* confirm ก่อนออกจากระบบ
@ -500,7 +506,7 @@ if (keycloak.tokenParsed != null) {
<q-btn
size="13px"
class="bg-blue-1"
v-if="activeBtn() || activeBtn2()"
v-if="activeBtn() || activeBtnPlacement()"
flat
dense
round
@ -848,7 +854,7 @@ if (keycloak.tokenParsed != null) {
side="right"
class="bg-grey-2"
show-if-above
v-if="tabScroll2()"
v-if="tabScrollPlacement()"
v-model="drawerR"
:width="220"
:breakpoint="1023"
@ -856,17 +862,17 @@ if (keycloak.tokenParsed != null) {
<q-scroll-area class="fit">
<q-list padding>
<q-item
v-for="(tabItem, index) in tabList_placement"
v-for="(tabItem, index) in tabListPlacement"
:key="index"
:id="'tab--' + tabItem.tag"
class="tabNative"
active-class="text-blue-7 active-item text-weight-medium tabActive"
:active="activeTab(tabItem.tag)"
:active="activeTabPlacement(tabItem.tag)"
clickable
v-ripple
dense
exact
@click="tagClick(tabItem.tag)"
@click="tagClickPlacement(tabItem.tag)"
>
<q-item-section>
<q-item-label