fix folder name 12 evaluate personal
This commit is contained in:
parent
cabe986fec
commit
b3641876df
25 changed files with 99 additions and 172 deletions
|
|
@ -0,0 +1,73 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-stepper
|
||||
v-model="store.step"
|
||||
vertical
|
||||
animated
|
||||
flat
|
||||
ref="stepper"
|
||||
:bordered="false"
|
||||
>
|
||||
<q-step
|
||||
keep-alive
|
||||
:name="1"
|
||||
prefix="1"
|
||||
title="ตรวจสอบคุณสมบัติ"
|
||||
:done="store.step > 1"
|
||||
>
|
||||
</q-step>
|
||||
|
||||
<q-step :name="2" prefix="2" title="จัดเตรียมเอกสาร" :done="store.step > 2">
|
||||
</q-step>
|
||||
|
||||
<q-step :name="3" prefix="3" title="ตรวจสอบเอกสาร" :done="store.step > 3">
|
||||
</q-step>
|
||||
|
||||
<q-step
|
||||
:name="4"
|
||||
prefix="4"
|
||||
title="รอตรวจสอบคุณสมบัติ"
|
||||
:done="store.step > 4"
|
||||
>
|
||||
</q-step>
|
||||
|
||||
<q-step
|
||||
:name="5"
|
||||
prefix="5"
|
||||
title="ประกาศบนเว็บไซต์"
|
||||
:done="store.step > 5"
|
||||
>
|
||||
</q-step>
|
||||
|
||||
<q-step
|
||||
:name="6"
|
||||
prefix="6"
|
||||
title="จัดเตรียมเอกสารเล่ม 2"
|
||||
:done="store.step > 6"
|
||||
>
|
||||
</q-step>
|
||||
|
||||
<q-step
|
||||
:name="7"
|
||||
prefix="7"
|
||||
title="ตรวจสอบเอกสารเล่ม 2"
|
||||
:done="store.step > 7"
|
||||
>
|
||||
</q-step>
|
||||
|
||||
<q-step :name="8" prefix="8" title="รอพิจารณาผล" :done="store.step > 8">
|
||||
</q-step>
|
||||
|
||||
<q-step :name="9" prefix="9" title="เสร็จสิ้น" :done="store.step > 9">
|
||||
</q-step>
|
||||
</q-stepper>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
137
src/modules/12_evaluatePersonal/components/Detail/Tab1.vue
Normal file
137
src/modules/12_evaluatePersonal/components/Detail/Tab1.vue
Normal file
|
|
@ -0,0 +1,137 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import Stepper from "@/modules/12_evaluatePersonal/components/Detail/Stepper.vue";
|
||||
import Step1 from "@/modules/12_evaluatePersonal/components/Detail/step/step1.vue";
|
||||
import Step2 from "@/modules/12_evaluatePersonal/components/Detail/step/step2.vue";
|
||||
import Step3 from "@/modules/12_evaluatePersonal/components/Detail/step/step3.vue";
|
||||
import Step4 from "@/modules/12_evaluatePersonal/components/Detail/step/step4.vue";
|
||||
import Step5 from "@/modules/12_evaluatePersonal/components/Detail/step/step5.vue";
|
||||
import Step6 from "@/modules/12_evaluatePersonal/components/Detail/step/step6.vue";
|
||||
import Step7 from "@/modules/12_evaluatePersonal/components/Detail/step/step7.vue";
|
||||
import Step8 from "@/modules/12_evaluatePersonal/components/Detail/step/step8.vue";
|
||||
import Step9 from "@/modules/12_evaluatePersonal/components/Detail/step/step9.vue";
|
||||
|
||||
import ViewStep1 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue";
|
||||
import ViewStep3 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue";
|
||||
import ViewStep7 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue";
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
const mixin = useCounterMixin();
|
||||
const { dialogConfirm } = mixin;
|
||||
|
||||
const $q = useQuasar();
|
||||
|
||||
const externalLink =
|
||||
"https://accreditation.ocsc.go.th/accreditation/search/curriculum";
|
||||
|
||||
function onCilckNextStep() {
|
||||
store.step < 9 &&
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => {
|
||||
store.step++;
|
||||
},
|
||||
"ยืนยันการดำเนินการ",
|
||||
"ต้องการยืนยันการดำเนินการต่อใช่หรือไม่?"
|
||||
);
|
||||
}
|
||||
|
||||
function onCilckprPeviousStep() {
|
||||
store.step > 1 &&
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => {
|
||||
store.step--;
|
||||
},
|
||||
"ยืนยันการย้อนกลับ",
|
||||
"ต้องการย้อนกลับใช่หรือไม่?"
|
||||
);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
store.step = 1;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-xs-12 col-sm-3">
|
||||
<div class="toptitle">ประเมินชำนาญการ</div>
|
||||
<Stepper />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-9">
|
||||
<div class="col-12 row">
|
||||
<div class="toptitle">
|
||||
{{ store.step }}.{{ store.titel[store.step - 1] }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div
|
||||
:class="
|
||||
store.step === 2 ||
|
||||
store.step === 4 ||
|
||||
store.step === 5 ||
|
||||
store.step === 6 ||
|
||||
store.step === 8 ||
|
||||
store.step === 9
|
||||
? 'col-xs-12 col-sm-12 row'
|
||||
: 'col-xs-12 col-sm-5 row'
|
||||
"
|
||||
>
|
||||
<q-card flat bordered class="col-12 q-pa-md">
|
||||
<q-card-section>
|
||||
<Step1 v-if="store.step === 1" />
|
||||
<Step2 v-if="store.step === 2" />
|
||||
<Step3 v-if="store.step === 3" />
|
||||
<Step4 v-if="store.step === 4" />
|
||||
<Step5 v-if="store.step === 5" />
|
||||
<Step6 v-if="store.step === 6" />
|
||||
<Step7 v-if="store.step === 7" />
|
||||
<Step8 v-if="store.step === 8" />
|
||||
<Step9 v-if="store.step === 9" />
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
<div
|
||||
class="col-xs-12 col-sm-7 row"
|
||||
v-if="store.step === 1 || store.step === 3 || store.step === 7"
|
||||
>
|
||||
<q-card flat bordered class="col-12">
|
||||
<q-card-section>
|
||||
<ViewStep1 v-if="store.step === 1" />
|
||||
<ViewStep3 v-if="store.step === 3" />
|
||||
<ViewStep7 v-if="store.step === 7" /> </q-card-section
|
||||
></q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="q-mt-md q-gutter-md" align="right">
|
||||
<q-btn
|
||||
v-if="store.step !== 1"
|
||||
unelevated
|
||||
outline
|
||||
label="ย้อนกลับ"
|
||||
color="public"
|
||||
@click="onCilckprPeviousStep"
|
||||
/>
|
||||
<q-btn
|
||||
unelevated
|
||||
label="ดำเนินการต่อ"
|
||||
color="public"
|
||||
@click="onCilckNextStep"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.q-stepper--vertical .q-stepper__step-inner {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
62
src/modules/12_evaluatePersonal/components/Detail/Tab2.vue
Normal file
62
src/modules/12_evaluatePersonal/components/Detail/Tab2.vue
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import Stepper from "@/modules/12_evaluatePersonal/components/Detail/Stepper.vue";
|
||||
import Step1 from "@/modules/12_evaluatePersonal/components/Detail/step/step1.vue";
|
||||
import Step2 from "@/modules/12_evaluatePersonal/components/Detail/step/step2.vue";
|
||||
import Step3 from "@/modules/12_evaluatePersonal/components/Detail/step/step3.vue";
|
||||
import Step4 from "@/modules/12_evaluatePersonal/components/Detail/step/step4.vue";
|
||||
import Step5 from "@/modules/12_evaluatePersonal/components/Detail/step/step5.vue";
|
||||
import Step6 from "@/modules/12_evaluatePersonal/components/Detail/step/step6.vue";
|
||||
import Step7 from "@/modules/12_evaluatePersonal/components/Detail/step/step7.vue";
|
||||
import Step8 from "@/modules/12_evaluatePersonal/components/Detail/step/step8.vue";
|
||||
import Step9 from "@/modules/12_evaluatePersonal/components/Detail/step/step9.vue";
|
||||
|
||||
import ViewStep1 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue";
|
||||
import ViewStep3 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue";
|
||||
import ViewStep7 from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue";
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
const mixin = useCounterMixin();
|
||||
const { dialogConfirm } = mixin;
|
||||
|
||||
const $q = useQuasar();
|
||||
|
||||
function onCilckNextStep() {
|
||||
store.step < 9 &&
|
||||
dialogConfirm($q, () => {
|
||||
store.step++;
|
||||
});
|
||||
}
|
||||
|
||||
function onCilckprPeviousStep() {
|
||||
store.step > 1 &&
|
||||
dialogConfirm($q, () => {
|
||||
store.step--;
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
store.step = 1;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12">
|
||||
<div class="toptitle">กรรมการและการประชุม</div>
|
||||
|
||||
<div class="row col-12">
|
||||
<q-card> xx </q-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.q-stepper--vertical .q-stepper__step-inner {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
117
src/modules/12_evaluatePersonal/components/Detail/step/step1.vue
Normal file
117
src/modules/12_evaluatePersonal/components/Detail/step/step1.vue
Normal file
|
|
@ -0,0 +1,117 @@
|
|||
<script setup lang="ts">
|
||||
import { reactive } from "vue";
|
||||
|
||||
const formData = reactive<any>({
|
||||
isEducationalQft: false, // คุณวุฒิการศึกษา
|
||||
isGovermantServiceHtr: false, // ประวัติการรับราชการ
|
||||
isOperatingExp: false, // ประสบการณ์ในการปฏิบัติงาน
|
||||
isMinPeriodOfTenure: false, // ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก
|
||||
isHaveSpecificQft: false, // มีคุณสมบัติตรงตามคุณสมบัติเฉพาะสำหรับตำแหน่งที่กำหนด ในมาตราฐานกำหนดตำแหน่ง
|
||||
isHaveProLicense: false, // มีใบอนุญาตประกอบวิชาชีพของสายงานต่างๆ
|
||||
isHaveMinPeriodOrHoldPos: false, // มีระยะเวลาขั้นต่ำในการดำรงตำแหน่งหรือเคยดำรงตำแหน่งในสายงานที่จะคัดเลือกตามคุณวุฒิของบุคคลและระดับตำแหน่งที่จะคัดเลือก]
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-list>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isEducationalQft"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label>คุณวุฒิการศึกษา </q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isGovermantServiceHtr"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label>ประวัติการรับราชการ </q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isOperatingExp"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label>ประสบการณ์ในการปฏิบัติงาน </q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isMinPeriodOfTenure"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label
|
||||
>ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก</q-item-label
|
||||
>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isHaveSpecificQft"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label
|
||||
>มีคุณสมบัติตรงตามคุณสมบัติเฉพาะ สำหรับตำแหน่งที่กำหนด
|
||||
ในมาตรฐานกำหนดตำแหน่ง</q-item-label
|
||||
>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isHaveProLicense"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label
|
||||
>มีใบอนุญาตประกอบวิชาชีพของสายงานต่างๆ และ/หรือ
|
||||
คุณวุฒิเพิ่มเติมครบถ้วนตามที่ ก.ก. กำหนด (แพทย์พยาบาล วิศวกรโยธา
|
||||
สถาปนิก ฯลฯ)</q-item-label
|
||||
>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple>
|
||||
<q-item-section avatar>
|
||||
<q-checkbox
|
||||
keep-color
|
||||
color="primary"
|
||||
v-model="formData.isHaveMinPeriodOrHoldPos"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label
|
||||
>มีระยะเวลาขั้นต่ำในการดำรงตำแหน่งหรือเคย
|
||||
ดำรงตำแหน่งในสายงานที่จะคัดเลือก
|
||||
ตามคุณวุฒิของบุคคลและระดับตำแหน่งที่จะคัดเลือก</q-item-label
|
||||
>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
564
src/modules/12_evaluatePersonal/components/Detail/step/step2.vue
Normal file
564
src/modules/12_evaluatePersonal/components/Detail/step/step2.vue
Normal file
|
|
@ -0,0 +1,564 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import keycloak from "@/plugins/keycloak";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import genReport from "@/plugins/genreport";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const $q = useQuasar();
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { showLoader, hideLoader, messageError } = mixin;
|
||||
|
||||
const fullName = ref<string>(
|
||||
keycloak.tokenParsed ? keycloak.tokenParsed.name!.toString() : ""
|
||||
);
|
||||
|
||||
const fileEvaluation1 = ref<any>();
|
||||
const fileEvaluation2 = ref<any>();
|
||||
const fileEvaluation3 = ref<any>();
|
||||
const fileEvaluation4 = ref<any>();
|
||||
const fileEvaluation5 = ref<any>();
|
||||
const fileEvaluation6 = ref<any>();
|
||||
|
||||
const modalView = ref<boolean>(false);
|
||||
const numOfPages = ref<number>(0);
|
||||
const page = ref<number>(1);
|
||||
const pdfSrc = ref<any>();
|
||||
|
||||
function onClickViewPDF(file: any) {
|
||||
pdfSrc.value = file.webkitRelativePath;
|
||||
modalView.value = true;
|
||||
}
|
||||
|
||||
/** ไปหน้าต่อไปของรายงาน */
|
||||
function nextPage() {
|
||||
if (page.value < numOfPages.value) {
|
||||
page.value++;
|
||||
}
|
||||
}
|
||||
|
||||
/** กลับหน้าก่อนหน้าของรายงาน */
|
||||
function backPage() {
|
||||
if (page.value !== 1) {
|
||||
page.value--;
|
||||
}
|
||||
}
|
||||
|
||||
async function onClickDowloadFile(
|
||||
tp: string,
|
||||
templateName: string,
|
||||
fileName: string
|
||||
) {
|
||||
showLoader();
|
||||
const data = Object.assign(
|
||||
{ fullName: fullName.value },
|
||||
tp === "EV1_005" || tp === "EV1_007"
|
||||
? { organizationName: "หน่วยงาน" }
|
||||
: null,
|
||||
tp === "EV1_007" ? { positionName: "ตำแหน่ง" } : null,
|
||||
tp === "EV1_007" ? { positionLeaveName: "ระดับ" } : null
|
||||
);
|
||||
const body = {
|
||||
template: tp,
|
||||
reportName: templateName,
|
||||
data: data,
|
||||
};
|
||||
await genReport(body, fileName);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row q-col-gutter-md">
|
||||
<!-- แบบพิจารณาคุณสมบัติบุคคล -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
แบบพิจารณาคุณสมบัติบุคคล
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_005',
|
||||
'template-1',
|
||||
'แบบพิจารณาคุณสมบัติบุคคล'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation1"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
@click="onClickViewPDF(fileEvaluation1)"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation1"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- แบบแสดงรายละเอียดการเสนอผลงาน -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
แบบแสดงรายละเอียดการเสนอผลงาน
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_006',
|
||||
'template-2',
|
||||
'แบบแสดงรายละเอียดการเสนอผลงาน'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation2"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation2"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_007',
|
||||
'template-3',
|
||||
'แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation3"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation3"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- แบบประเมินคุณลักษณะบุคคล -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
แบบประเมินคุณลักษณะบุคคล
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_008',
|
||||
'template-4',
|
||||
'แบบประเมินคุณลักษณะบุคคล'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation4"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation4"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!-- แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_009',
|
||||
'template-5',
|
||||
'แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก'
|
||||
)
|
||||
"
|
||||
>
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation5"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation5"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<!--ผลงานที่จะส่งประเมิน -->
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
ผลงานที่จะส่งประเมิน
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
@click="
|
||||
onClickDowloadFile(
|
||||
'EV1_010',
|
||||
'template-6',
|
||||
'ผลงานที่จะส่งประเมิน'
|
||||
)
|
||||
"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation6"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation6"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Dialog Full Screen -->
|
||||
<q-dialog
|
||||
v-model="modalView"
|
||||
persistent
|
||||
:maximized="true"
|
||||
transition-show="slide-up"
|
||||
transition-hide="slide-down"
|
||||
>
|
||||
<q-card class="bg-white">
|
||||
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
size="12px"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
<div class="q-pa-md">
|
||||
<div class="row items-start items-center">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row items- items-center">
|
||||
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
|
||||
</div>
|
||||
<div class="row items- items-end">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
|
||||
const selectedItem = ref(1);
|
||||
|
||||
function handleItemClick(itemNumber: number) {
|
||||
store.tabPanels = itemNumber.toString();
|
||||
selectedItem.value = itemNumber;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-list separator>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 1 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(1)"
|
||||
>
|
||||
<q-item-section>แบบพิจารณาคุณสมบัติบุคคล</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 2 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(2)"
|
||||
>
|
||||
<q-item-section>แบบแสดงรายละเอียดการเสนอผลงาน</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 3 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(3)"
|
||||
>
|
||||
<q-item-section
|
||||
>แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล</q-item-section
|
||||
>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 4 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(4)"
|
||||
>
|
||||
<q-item-section> แบบประเมินคุณลักษณะบุคคล </q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 5 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(5)"
|
||||
>
|
||||
<q-item-section> แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก </q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 6 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(6)"
|
||||
>
|
||||
<q-item-section> ผลงานที่จะส่งประเมิน </q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
const status = ref<string>("WAIT_CHECK_DOC_V1");
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">
|
||||
<q-badge
|
||||
v-if="status == 'WAIT_CHECK_DOC_V1'"
|
||||
outline
|
||||
color="orange-5"
|
||||
label="รอตรวจสอบคุณสมบัติ"
|
||||
class="q-pa-sm"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
const status = ref<string>("ANNOUNCE_WEB");
|
||||
const website = ref<string>("https://bma-ehr.frappet.com/");
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-12 text-center q-">
|
||||
<q-badge
|
||||
v-if="status == 'ANNOUNCE_WEB'"
|
||||
outline
|
||||
color="primary"
|
||||
label="ประกาศบนเว็บไซต์"
|
||||
class="q-pa-sm"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
<div>
|
||||
<a :href="website" target="_blank">{{ website }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
106
src/modules/12_evaluatePersonal/components/Detail/step/step6.vue
Normal file
106
src/modules/12_evaluatePersonal/components/Detail/step/step6.vue
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
|
||||
|
||||
const fileEvaluation1 = ref<any>();
|
||||
|
||||
const pdfSrc = ref<any>();
|
||||
|
||||
const modalView = ref<boolean>(false);
|
||||
function onClickViewPDF(file: any) {
|
||||
pdfSrc.value = file.webkitRelativePath;
|
||||
modalView.value = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row q-col-gutter-md">
|
||||
<div class="col-6">
|
||||
<q-card bordered style="border: 1px solid #d6dee1">
|
||||
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
|
||||
เอกสารเล่ม 2
|
||||
</div>
|
||||
<div class="col-12"><q-separator /></div>
|
||||
<div class="row">
|
||||
<div class="col-12 q-pa-sm">
|
||||
<div class="row q-col-gutter-md col-12">
|
||||
<!-- <div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
class="col-12"
|
||||
outline
|
||||
icon="download"
|
||||
label="ดาวน์โหลดต้นแบบ"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
|
||||
>
|
||||
</div> -->
|
||||
<div class="col-xs-12 col-sm-6 row">
|
||||
<q-btn
|
||||
v-if="fileEvaluation1"
|
||||
class="col-12"
|
||||
outline
|
||||
icon="visibility"
|
||||
label="ดูไฟล์เอกสาร"
|
||||
color="primary"
|
||||
@click="onClickViewPDF(fileEvaluation1)"
|
||||
>
|
||||
<q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 row">
|
||||
<q-file
|
||||
v-model="fileEvaluation1"
|
||||
class="col-12"
|
||||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
accept=".pdf"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-1 self-center text-center">
|
||||
<q-btn flat round dense color="primary" icon="mdi-upload"
|
||||
><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Dialog Full Screen -->
|
||||
<q-dialog
|
||||
v-model="modalView"
|
||||
persistent
|
||||
:maximized="true"
|
||||
transition-show="slide-up"
|
||||
transition-hide="slide-down"
|
||||
>
|
||||
<q-card class="bg-white">
|
||||
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
size="12px"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="q-pa-md">
|
||||
<ViewPDF />
|
||||
</div>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
|
||||
const selectedItem = ref(1);
|
||||
|
||||
function handleItemClick(itemNumber: number) {
|
||||
store.tabPanels = itemNumber.toString();
|
||||
selectedItem.value = itemNumber;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-list separator>
|
||||
<q-item
|
||||
clickable
|
||||
v-ripple
|
||||
:active="selectedItem === 1 ? true : false"
|
||||
active-class="text-primary"
|
||||
@click="handleItemClick(1)"
|
||||
>
|
||||
<q-item-section>เอกสารเล่ม 2</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
const status = ref<string>("WAIT_CHECK_DOC_V2");
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">
|
||||
<q-badge
|
||||
v-if="status == 'WAIT_CHECK_DOC_V2'"
|
||||
outline
|
||||
color="orange-5"
|
||||
label="รอพิจารณาผลการประเมิน"
|
||||
class="q-pa-sm"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
const status = ref<string>("DONE");
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">
|
||||
<q-badge
|
||||
v-if="status == 'DONE'"
|
||||
outline
|
||||
color="green"
|
||||
label="เสร็จสิ้น"
|
||||
class="q-pa-sm"
|
||||
style="font-size: 16px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,180 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
|
||||
const splitterModel = ref(14);
|
||||
const numOfPages = ref<number>(0);
|
||||
const page = ref<number>(1);
|
||||
const pdfSrc = ref<any>();
|
||||
|
||||
/** ไปหน้าต่อไปของรายงาน */
|
||||
function nextPage() {
|
||||
if (page.value < numOfPages.value) {
|
||||
page.value++;
|
||||
}
|
||||
}
|
||||
|
||||
/** กลับหน้าก่อนหน้าของรายงาน */
|
||||
function backPage() {
|
||||
if (page.value !== 1) {
|
||||
page.value--;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-splitter
|
||||
v-model="splitterModel"
|
||||
horizontal
|
||||
style="
|
||||
height: 50vh;
|
||||
border: 1px solid rgb(210, 210, 210);
|
||||
border-radius: 5px;
|
||||
"
|
||||
before-class="overflow-hidden disable"
|
||||
separator-class="bg-white disabled"
|
||||
>
|
||||
<template v-slot:before>
|
||||
<div class="q-px-sm">
|
||||
<div class="row items-start items-center">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:after>
|
||||
<div class="q-pa-md">
|
||||
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:default>
|
||||
<div class="q-pa-md">
|
||||
<div class="row items-start items-center">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</q-splitter>
|
||||
<!-- <q-card class="bg-white">
|
||||
<div class="q-pa-md">
|
||||
<div class="row items-start items-center">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row items- items-center">
|
||||
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
|
||||
</div>
|
||||
<div class="row items- items-end">
|
||||
<div class="col">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-left"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
class="my-auto"
|
||||
@click="backPage"
|
||||
:disable="page == 1"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto">
|
||||
<div class="q-pa-md flex">
|
||||
หน้าที่ {{ page }} จาก {{ numOfPages }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<q-btn
|
||||
padding="xs"
|
||||
icon="mdi-chevron-right"
|
||||
color="grey-2"
|
||||
text-color="grey-5"
|
||||
size="md"
|
||||
@click="nextPage"
|
||||
:disable="page === numOfPages"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card> -->
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,304 @@
|
|||
<script setup lang="ts">
|
||||
import { storeToRefs } from "pinia";
|
||||
import { useEvalutuonStore } from "@/modules/12_evaluatePersonal/store/Evaluate";
|
||||
|
||||
const storageEvalutuon = useEvalutuonStore();
|
||||
const {
|
||||
rows,
|
||||
columnsLicense,
|
||||
columnPeriodhistory,
|
||||
columnTrainingHistory,
|
||||
columnProjectsProposed,
|
||||
} = storeToRefs(storageEvalutuon);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-card class="bg-grey-2">
|
||||
<div class="text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ข้อมูลส่วนตัว</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="นาย" label="คำนำหน้าชื่อ" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="ธนพนธ์ แสงจันทร์"
|
||||
label="ชื่อ - นามสกุล"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
borderless
|
||||
model-value="19/03/44"
|
||||
readonly
|
||||
label="วันเดือนปีเกิด"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon class="size-icon" name="o_calendar_today" />
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="ไม่มี" label="ตำแหน่ง" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="กย.11"
|
||||
label="ตำแหน่งเลขที่"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-9 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="หน่วยใหม่กับหน่วยเก่า"
|
||||
label="สังกัด"
|
||||
/>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="" label="เงินเดือน" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="" label="ระดับปัจจุบัน" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="" label="ระดับที่ประเมิน" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="1000 ปี" label="อายุราชการ" />
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ประวัติการศึกษา</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="ปริญญาตรี"
|
||||
label="ระดับศึกษา"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="มหาวิทยาลัยก."
|
||||
label="สถานศึกษา"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless model-value="19/03/44" readonly label="ตั้งแต่">
|
||||
<template v-slot:prepend>
|
||||
<q-icon class="size-icon" name="o_calendar_today" />
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless model-value="19/03/44" readonly label="ถึง">
|
||||
<template v-slot:prepend>
|
||||
<q-icon class="size-icon" name="o_calendar_today" />
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
borderless
|
||||
model-value="19/03/44"
|
||||
readonly
|
||||
label="วันทราสำเร็จการศึกษา"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon class="size-icon" name="o_calendar_today" />
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="ปริญญาตรี"
|
||||
label="วุฒิการศึกษาในตําแหน่ง"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
borderless
|
||||
readonly
|
||||
model-value="ปริญญาตรี"
|
||||
label="วุฒิการศึกษา"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input borderless readonly model-value="-" label="สาขาวิชา/ทาง" />
|
||||
</div>
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions class="q-ml-md">
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="-" label="ทุน" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input borderless readonly model-value="3.33" label="เกรดเฉลี่ย" />
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input borderless readonly model-value="ไทย" label="ประเทศ" />
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ใบอนุญาตประกอบวิชาชีพ</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ma-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-table
|
||||
table-header-class="bg-grey-4 "
|
||||
flat
|
||||
bordered
|
||||
:rows="rows"
|
||||
:columns="columnsLicense"
|
||||
>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ประวัติการรับราชการ</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ma-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-table
|
||||
table-header-class="bg-grey-4 "
|
||||
flat
|
||||
bordered
|
||||
:rows="rows"
|
||||
:columns="columnPeriodhistory"
|
||||
>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ประวัติการฝึกอบรมดูงาน</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ma-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-table
|
||||
table-header-class="bg-grey-4 "
|
||||
flat
|
||||
bordered
|
||||
:rows="rows"
|
||||
:columns="columnTrainingHistory"
|
||||
>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ประสบการณ์ในการปฏิบัติงาน</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ma-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-table
|
||||
table-header-class="bg-grey-4 "
|
||||
flat
|
||||
bordered
|
||||
:rows="rows"
|
||||
:columns="columnTrainingHistory"
|
||||
>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
||||
<q-card class="bg-grey-2 q-mt-xl">
|
||||
<div class=" text-weight-bold row items-center">
|
||||
<span class="q-ml-lg q-my-sm">ผลงานทีเคยเสนอขอประเมิน (ถ้ามี)</span>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
|
||||
<q-card-actions class="q-ma-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-table
|
||||
table-header-class="bg-grey-4 "
|
||||
flat
|
||||
bordered
|
||||
:rows="rows"
|
||||
:columns="columnProjectsProposed"
|
||||
>
|
||||
</q-table>
|
||||
</div>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.size-icon {
|
||||
font-size: 20px; /* ปรับขนาดตามที่คุณต้องการ */
|
||||
}
|
||||
|
||||
</style>
|
||||
@/modules/12_evaluatePersonal/store/evaluate
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<script setup lang="ts">
|
||||
import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-tab-panels v-model="store.tabPanels" animated swipeable vertical>
|
||||
<q-tab-panel name="1">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="2">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="3">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="4">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="5">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="6">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<script setup lang="ts">
|
||||
import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-tab-panels v-model="store.tabPanels" animated swipeable vertical>
|
||||
<q-tab-panel name="1">
|
||||
<ViewPDF />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
229
src/modules/12_evaluatePersonal/components/Table.vue
Normal file
229
src/modules/12_evaluatePersonal/components/Table.vue
Normal file
|
|
@ -0,0 +1,229 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, useAttrs, watch } from "vue";
|
||||
|
||||
const table = ref<any>(null);
|
||||
const filterRef = ref<any>(null);
|
||||
const attrs = ref<any>(useAttrs());
|
||||
const paging = ref<boolean>(true);
|
||||
|
||||
/** รับ props มาจากหน้าหลัก */
|
||||
const props = defineProps({
|
||||
count: Number,
|
||||
pass: Number,
|
||||
notpass: Number,
|
||||
inputfilter: String,
|
||||
name: String,
|
||||
icon: String,
|
||||
inputvisible: Array,
|
||||
editvisible: Boolean,
|
||||
validate: {
|
||||
type: Function,
|
||||
default: () => console.log("not function"),
|
||||
},
|
||||
nornmalData: {
|
||||
type: Boolean,
|
||||
defualt: true,
|
||||
},
|
||||
conclude: {
|
||||
type: Boolean,
|
||||
defualt: false,
|
||||
},
|
||||
page: {
|
||||
type: Number,
|
||||
},
|
||||
pageSize: {
|
||||
type: Number,
|
||||
},
|
||||
maxPage: {
|
||||
type: Number,
|
||||
},
|
||||
});
|
||||
|
||||
const currentPage = ref<number>(1);
|
||||
const filter = ref<string>("");
|
||||
const pagination = ref({
|
||||
descending: false,
|
||||
page: props.page,
|
||||
rowsPerPage: props.pageSize,
|
||||
});
|
||||
|
||||
const emit = defineEmits([
|
||||
"update:inputfilter",
|
||||
"update:inputvisible",
|
||||
"update:editvisible",
|
||||
"update:queryString",
|
||||
]);
|
||||
|
||||
function updateInput(value: string | number | null) {
|
||||
emit("update:inputfilter", value);
|
||||
}
|
||||
|
||||
function updateVisible(value: []) {
|
||||
emit("update:inputvisible", value);
|
||||
}
|
||||
|
||||
function resetFilter() {
|
||||
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
|
||||
emit("update:inputfilter", "");
|
||||
filterRef.value.focus();
|
||||
}
|
||||
|
||||
function updateRowsPerPage(newPagination: any) {
|
||||
pagination.value = newPagination;
|
||||
currentPage.value = 1;
|
||||
}
|
||||
|
||||
function filterFn() {
|
||||
updatePaging(1, Number(pagination.value.rowsPerPage), filter.value);
|
||||
}
|
||||
|
||||
function updatePaging(p: number, pS: number, key: string) {
|
||||
emit("update:queryString", p, pS, key);
|
||||
}
|
||||
|
||||
watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
|
||||
emit(
|
||||
"update:queryString",
|
||||
currentPage.value,
|
||||
Number(pagination.value.rowsPerPage),
|
||||
filter.value
|
||||
);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="q-pb-sm row q-col-gutter-sm">
|
||||
<div class="q-gutter-sm" v-if="nornmalData == true">
|
||||
<!-- <q-btn
|
||||
to="/discipline-result/add"
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
color="add"
|
||||
icon="mdi-plus"
|
||||
>
|
||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||
</q-btn> -->
|
||||
</div>
|
||||
<q-space />
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
v-model="filter"
|
||||
ref="filterRef"
|
||||
@keydown.enter.prevent="filterFn"
|
||||
outlined
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="filter == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="filter !== ''"
|
||||
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
|
||||
class="col-xs-12 col-sm-3 col-md-2 gt-xs"
|
||||
>
|
||||
</q-select>
|
||||
</div>
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
v-bind="attrs"
|
||||
virtual-scroll
|
||||
:virtual-scroll-sticky-size-start="48"
|
||||
dense
|
||||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
:pagination="pagination"
|
||||
@update:pagination="updateRowsPerPage"
|
||||
>
|
||||
<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" v-html="col.label" />
|
||||
</q-th>
|
||||
<q-th auto-width />
|
||||
</q-tr>
|
||||
</template>
|
||||
<template #body="props">
|
||||
<slot v-bind="props" name="columns"></slot>
|
||||
</template>
|
||||
<template v-slot:pagination="scope">
|
||||
<q-pagination
|
||||
v-model="currentPage"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="Number(props.maxPage)"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
></q-pagination>
|
||||
</template>
|
||||
</d-table>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
color: #4154b3;
|
||||
}
|
||||
|
||||
.custom-table2 {
|
||||
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;
|
||||
}
|
||||
|
||||
.q-table td:nth-of-type(2) {
|
||||
z-index: 3 !important;
|
||||
}
|
||||
|
||||
.q-table th:nth-of-type(2),
|
||||
.q-table td:nth-of-type(2) {
|
||||
position: sticky;
|
||||
left: 0;
|
||||
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>
|
||||
86
src/modules/12_evaluatePersonal/interface/index/Main.ts
Normal file
86
src/modules/12_evaluatePersonal/interface/index/Main.ts
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
interface DataOption {
|
||||
id: string;
|
||||
name: string;
|
||||
}
|
||||
interface DataOptionYear {
|
||||
id: number;
|
||||
name: string;
|
||||
}
|
||||
interface DataOptioGroup {
|
||||
id: string;
|
||||
name: string;
|
||||
|
||||
disable: Boolean;
|
||||
}
|
||||
|
||||
interface DataNumberOption {
|
||||
id: number;
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface InvestigatefactsDataRowType {
|
||||
id: string;
|
||||
title: string;
|
||||
respondentType: string;
|
||||
offenseDetails: string;
|
||||
investigationDetail: string;
|
||||
dateInvestigate: string;
|
||||
investigationStatusResult: string;
|
||||
status: string;
|
||||
}
|
||||
|
||||
interface investigateDisDataRowType {
|
||||
id: string; //id รายการ
|
||||
title: string; //เรื่องร้องเรียน
|
||||
interrogated: string; //ผู้ถูกสอบสวน
|
||||
descMistake: string; //ลักษณะความผิด
|
||||
mistakeLevel: string; //ระดับโทษความผิด
|
||||
mistakeCase: string; //กรณีความผิด
|
||||
investigationDate: Date | null; //วันที่สอบสวน
|
||||
status: string | null; //สถานะ
|
||||
isResultConfirmed: Boolean; //ยืนยันผลเเล้ว/ยังไม่ได้ยืนยันผล
|
||||
}
|
||||
|
||||
interface directorType {
|
||||
id: string;
|
||||
directorId?: string;
|
||||
prefix: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
position: string;
|
||||
email: string;
|
||||
phone: string;
|
||||
total?: number;
|
||||
duty?: string;
|
||||
}
|
||||
interface responseType {
|
||||
id: string;
|
||||
directorId?: string;
|
||||
prefix: string;
|
||||
firstName: string;
|
||||
lastName: string;
|
||||
position: string;
|
||||
email: string;
|
||||
phone: string;
|
||||
total?: number;
|
||||
duty?: string;
|
||||
|
||||
}
|
||||
|
||||
interface FileLists {
|
||||
id: string; //id เอกสาร
|
||||
fileName: string; //ชื่่อเอกสาร
|
||||
pathName: string; //link file
|
||||
}
|
||||
|
||||
export type {
|
||||
DataOption,
|
||||
InvestigatefactsDataRowType,
|
||||
investigateDisDataRowType,
|
||||
directorType,
|
||||
DataNumberOption,
|
||||
responseType,
|
||||
FileLists,
|
||||
DataOptioGroup,
|
||||
DataOptionYear,
|
||||
};
|
||||
26
src/modules/12_evaluatePersonal/router.ts
Normal file
26
src/modules/12_evaluatePersonal/router.ts
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
const mainPage = () => import("@/modules/12_evaluatePersonal/views/MainPage.vue");
|
||||
const detailPage = () =>
|
||||
import("@/modules/12_evaluatePersonal/views/DetailPage.vue");
|
||||
|
||||
export default [
|
||||
{
|
||||
path: "/evaluate",
|
||||
name: "evaluate",
|
||||
component: mainPage,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [1.1],
|
||||
Role: "discipline",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/evaluate/detail",
|
||||
name: "evaluateDetail",
|
||||
component: detailPage,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [12.2],
|
||||
Role: "discipline",
|
||||
},
|
||||
},
|
||||
];
|
||||
426
src/modules/12_evaluatePersonal/store/Evaluate.ts
Normal file
426
src/modules/12_evaluatePersonal/store/Evaluate.ts
Normal file
|
|
@ -0,0 +1,426 @@
|
|||
import { defineStore } from "pinia";
|
||||
import { ref } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import type { DataOption } from "@/modules/12_evaluatePersonal/interface/index/Main";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
|
||||
/** function สถานะ*/
|
||||
function convertStatus(val: string) {
|
||||
switch (val) {
|
||||
case "CHECK_SPEC":
|
||||
return "ตรวจสอบคุณสมบัติด้วยตนเอง";
|
||||
case "PREPARE_DOC_V1":
|
||||
return "จัดเตรียมเอกสารเล่ม";
|
||||
case "CHECK_DOC_V1":
|
||||
return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
|
||||
case "WAIT_CHECK_DOC_V1":
|
||||
return "รอตรวจสอบคุณสมบัติ";
|
||||
case "ANNOUNCE_WEB":
|
||||
return "ประกาศบนเว็บไซต์";
|
||||
case "PREPARE_DOC_V2":
|
||||
return "จัดเตรียมเอกสารเล่ม";
|
||||
case "WAIT_CHECK_DOC_V2":
|
||||
return "รอพิจารณาผลการประเมิน";
|
||||
case "CHECK_DOC_V2":
|
||||
return "ตรวจสอบความถูกต้องของเอกสารเล่ม";
|
||||
case "DONE":
|
||||
return "เสร็จสิ้น";
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// ตรวจสอบคุณสมบัติด้วยตนเอง -> CHECK_SPEC
|
||||
// จัดเตรียมเอกสารเล่ม 1-> PREPARE_DOC_V1
|
||||
// ตรวจสอบความถูกต้องของเอกสารเล่ม 1 -> CHECK_DOC_V1
|
||||
// รอตรวจสอบคุณสมบัติ -> WAIT_CHECK_DOC_V1
|
||||
// ประกาศบนเว็บไซต์ -> ANNOUNCE_WEB
|
||||
// จัดเตรียมเอกสารเล่ม 2 -> PREPARE_DOC_V2
|
||||
// ตรวจสอบความถูกต้องของเอกสารเล่ม 2 -> CHECK_DOC_V2
|
||||
// รอพิจารณาผลการประเมิน -> WAIT_CHECK_DOC_V2
|
||||
// เสร็จสิ้น -> DONE
|
||||
|
||||
const visibleColumns = ref<String[]>([
|
||||
"citizanId",
|
||||
"fullName",
|
||||
"position",
|
||||
"level",
|
||||
"positionNumber",
|
||||
"agency",
|
||||
"status",
|
||||
]);
|
||||
const rows = ref<any[]>([]);
|
||||
function fetchData(data: any[]) {
|
||||
const dataList: any[] = data.map((data: any) => ({
|
||||
citizanId: data.citizanId,
|
||||
fullName: data.fullName,
|
||||
position: data.position,
|
||||
level: data.level,
|
||||
positionNumber: data.positionNumber,
|
||||
agency: data.agency,
|
||||
status: convertStatus(data.status),
|
||||
}));
|
||||
rows.value = dataList;
|
||||
console.log(dataList);
|
||||
}
|
||||
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "citizanId",
|
||||
align: "center",
|
||||
label: "เลขประจำตัวประชาชน",
|
||||
sortable: false,
|
||||
field: "citizanId",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "fullName",
|
||||
align: "left",
|
||||
label: "ชื่อ-นามสกุล",
|
||||
sortable: true,
|
||||
field: "fullName",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "position",
|
||||
align: "left",
|
||||
label: "ตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "position",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "level",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
sortable: true,
|
||||
field: "level",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "positionNumber",
|
||||
align: "left",
|
||||
label: "ตำแหน่งเลขที่",
|
||||
sortable: true,
|
||||
field: "positionNumber",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "agency",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "agency",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "status",
|
||||
align: "left",
|
||||
label: "สถานะ(ตรวจสอบคุณสมบัติ)",
|
||||
sortable: true,
|
||||
field: "status",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
const columnsLicense = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "",
|
||||
align: "center",
|
||||
label: "ชื่อใบอนุณาต",
|
||||
sortable: false,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "หน่วยงานผู้ออกใบอนุญาต",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "เลขที่ใบอนุญาต",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "วันที่ออกใบอนุญาต",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "วันที่หมดอายุ",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
]);
|
||||
|
||||
const columnPeriodhistory = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "",
|
||||
align: "center",
|
||||
label: "วัน เดือน ปี",
|
||||
sortable: false,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "สังกัด",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ตำแหน่ง",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ตำแหน่งเลขที่",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "สายงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ด้าน/สาขา",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ตำแหน่งประเภท",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ระดับ",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ตำแหน่งทางการบริหาร",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ด้านทางการบริหาร",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
const columnTrainingHistory = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "",
|
||||
align: "center",
|
||||
label: "ชื่อโครงการ/หลักสูตรการฝึกอบรม",
|
||||
sortable: false,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "หัวข้อการฝึกอบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "วันเริ่มต้นการฝึกอบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "วันสิ้นสุดการฝึกอบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ปีที่อบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "รวมระยะเวลาในการฝึกอบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "หน่วยงานที่รับผิดชอบจัดการฝึกอบรม/ดูงาน",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
const columnProjectsProposed = ref<QTableProps["columns"]>([
|
||||
{
|
||||
name: "",
|
||||
align: "center",
|
||||
label: "วันที่ได้รับ",
|
||||
sortable: false,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "ผู้มีอำนาจลงนาม",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "รายละเอียด",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "เลขที่คำสั่ง",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
align: "left",
|
||||
label: "เอกสารอ้างอิง",
|
||||
sortable: true,
|
||||
field: "",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
},
|
||||
]);
|
||||
|
||||
return {
|
||||
visibleColumns,
|
||||
columns,
|
||||
rows,
|
||||
convertStatus,
|
||||
fetchData,
|
||||
columnsLicense,
|
||||
columnPeriodhistory,
|
||||
columnTrainingHistory,
|
||||
columnProjectsProposed,
|
||||
};
|
||||
});
|
||||
28
src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
Normal file
28
src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
|
||||
import { defineStore } from "pinia";
|
||||
import { ref } from "vue";
|
||||
|
||||
export const useEvaluateDetailStore = defineStore("evaluateDetailStore", () => {
|
||||
const tabMenu = ref<string>("1");
|
||||
const step = ref<number>(1);
|
||||
const titel = ref<string[]>([
|
||||
"ตรวจสอบคุณสมบัติ",
|
||||
"จัดเตรียมเอกสาร",
|
||||
"ตรวจสอบเอกสาร",
|
||||
"รอตรวจสอบคุณสมบัติ",
|
||||
"ประกาศบนเว็บไซต์",
|
||||
"จัดเตรียมเอกสารเล่ม 2",
|
||||
"ตรวจสอบเอกสารเล่ม 2",
|
||||
"รอพิจารณาผล",
|
||||
"เสร็จสิ้น",
|
||||
]);
|
||||
|
||||
const tabPanels = ref<string>("1");
|
||||
|
||||
return {
|
||||
tabMenu,
|
||||
step,
|
||||
titel,
|
||||
tabPanels,
|
||||
};
|
||||
});
|
||||
51
src/modules/12_evaluatePersonal/views/DetailPage.vue
Normal file
51
src/modules/12_evaluatePersonal/views/DetailPage.vue
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRouter } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import Tab1 from "@/modules/12_evaluatePersonal/components/Detail/Tab1.vue"; // ชำนาญการ
|
||||
import Tab2 from "@/modules/12_evaluatePersonal/components/Detail/Tab2.vue"; // ชำนาญการพิเศษ
|
||||
|
||||
import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
|
||||
|
||||
const store = useEvaluateDetailStore();
|
||||
const router = useRouter();
|
||||
const $q = useQuasar();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
รายละเอียดการประเมินของ นาวสาววารุณี แต้มคู
|
||||
</div>
|
||||
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
|
||||
<div class="col-xs-12 col-sm-12 col-md-11 row q-col-gutter-md">
|
||||
<div class="col-12 row">
|
||||
<q-card bordered class="col-12 row caedNone">
|
||||
<q-card class="col-12 items-center">
|
||||
<q-tabs
|
||||
v-model="store.tabMenu"
|
||||
dense
|
||||
align="left"
|
||||
inline-label
|
||||
class="rounded-borders"
|
||||
indicator-color="primary"
|
||||
active-bg-color="teal-1"
|
||||
active-class="text-primary"
|
||||
>
|
||||
<q-tab name="1" label="รายละเอียดการประเมิน" />
|
||||
<q-tab name="2" label="กรรมการและการประชุม" />
|
||||
</q-tabs>
|
||||
<q-separator />
|
||||
<q-tab-panels v-model="store.tabMenu" animated>
|
||||
<q-tab-panel name="1"> <Tab1 /></q-tab-panel>
|
||||
|
||||
<q-tab-panel name="2"> <Tab2 /></q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-card>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
233
src/modules/12_evaluatePersonal/views/MainPage.vue
Normal file
233
src/modules/12_evaluatePersonal/views/MainPage.vue
Normal file
|
|
@ -0,0 +1,233 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, ref } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRouter } from "vue-router";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import Table from "@/modules/12_evaluatePersonal/components/Table.vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useEvalutuonStore } from "@/modules/12_evaluatePersonal/store/Evaluate";
|
||||
import type { Pagination } from "@/modules/03_recruiting/interface/index/Main";
|
||||
|
||||
const $q = useQuasar(); // show dialog
|
||||
const router = useRouter();
|
||||
//search data table
|
||||
const mixin = useCounterMixin();
|
||||
const store = useEvalutuonStore();
|
||||
const { showLoader, hideLoader, messageError } = mixin;
|
||||
|
||||
const initialPagination = ref<Pagination>({
|
||||
rowsPerPage: 0,
|
||||
});
|
||||
function Detailpage() {
|
||||
router.push("/evaluate/detail");
|
||||
}
|
||||
|
||||
const page = ref<number>(1);
|
||||
const pageSize = ref<number>(10);
|
||||
const maxPage = ref<number>(1);
|
||||
const filter = ref<string>("");
|
||||
|
||||
/**เมื่อเริ่มโหลดหน้า
|
||||
* ส่งข้อมูลจำลองไปยัง store
|
||||
*/
|
||||
onMounted(async () => {
|
||||
store.fetchData([
|
||||
{
|
||||
citizanId: "1230030004001",
|
||||
fullName: "นางวัศยา ศรีสร้อย",
|
||||
position: "ผู้อำนวยการสถาบัน",
|
||||
level: "ปฏิบัติการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานกฎหมาย",
|
||||
status: "WAIT_CHECK_DOC_V1",
|
||||
},
|
||||
{
|
||||
citizanId: "172223000401",
|
||||
fullName: "นางธัญพร ปัทมเดชา",
|
||||
position: "หัวหน้าสำนักงาน",
|
||||
level: "ปฏิบัติการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานกฎหมาย",
|
||||
status: "WAIT_CHECK_DOC_V1",
|
||||
},
|
||||
{
|
||||
citizanId: "122222000401",
|
||||
fullName: "นายสิริศักดิ์ พรมบุตร",
|
||||
position: "นักบริหาร",
|
||||
level: "ชำนาญการพิเศษ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานกฎหมายอาคาร",
|
||||
status: "WAIT_CHECK_DOC_V2",
|
||||
},
|
||||
{
|
||||
citizanId: "111111100401",
|
||||
fullName: "นายเอกฉัท วีระโชติ ",
|
||||
position: "นักบริหาร",
|
||||
level: "อำนวยการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานการคลัง",
|
||||
status: "DONE",
|
||||
},
|
||||
{
|
||||
citizanId: "122203000401",
|
||||
fullName: "นางธนิดา มั่นคงประสิทธิ์",
|
||||
position: "ผู้อำนวยการกอง",
|
||||
level: "อาวุโส",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มกิจการสภา",
|
||||
status: "WAIT_CHECK_DOC_V1",
|
||||
},
|
||||
{
|
||||
citizanId: "123003111401",
|
||||
fullName: "นางณิชมน ลือขำ ",
|
||||
position: "ผู้อำนวยการสถาบัน",
|
||||
level: "ชำนาญงาน",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มกิจการสภา",
|
||||
status: "WAIT_CHECK_DOC_V2",
|
||||
},
|
||||
{
|
||||
citizanId: "111111100401",
|
||||
fullName: "นายเอกฉัท วีระโชติ ",
|
||||
position: "นักบริหาร",
|
||||
level: "อำนวยการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานการคลัง",
|
||||
status: "ANNOUNCE_WEB",
|
||||
},
|
||||
{
|
||||
citizanId: "111111100401",
|
||||
fullName: "นายเอกฉัท วีระโชติ ",
|
||||
position: "นักบริหาร",
|
||||
level: "อำนวยการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานการคลัง",
|
||||
status: "PREPARE_DOC_V2",
|
||||
},
|
||||
{
|
||||
citizanId: "111111100401",
|
||||
fullName: "นายเอกฉัท วีระโชติ ",
|
||||
position: "นักบริหาร",
|
||||
level: "อำนวยการ",
|
||||
positionNumber: "สก.ก412",
|
||||
agency: "กลุ่มงานการคลัง",
|
||||
status: "CHECK_DOC_V2",
|
||||
},
|
||||
]);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
รายการคำขอประเมิน
|
||||
</div>
|
||||
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm q-pa-md">
|
||||
<div>
|
||||
<Table
|
||||
style="max-height: 80vh"
|
||||
:rows="store.rows"
|
||||
:columns="store.columns"
|
||||
:visible-columns="store.visibleColumns"
|
||||
v-model:inputfilter="filter"
|
||||
v-model:inputvisible="store.visibleColumns"
|
||||
:pagination="initialPagination"
|
||||
:nornmalData="true"
|
||||
:paging="true"
|
||||
:titleText="''"
|
||||
:page="page"
|
||||
:pageSize="pageSize"
|
||||
:maxPage="maxPage"
|
||||
>
|
||||
<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>
|
||||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
icon="mdi-dots-vertical"
|
||||
size="12px"
|
||||
color="grey-7"
|
||||
flat
|
||||
round
|
||||
dense
|
||||
>
|
||||
<q-menu transition-show="jump-down" transition-hide="jump-up">
|
||||
{{ props.rows && props.rows.status }}
|
||||
<q-list dense style="min-width: 100px">
|
||||
<q-item
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="Detailpage()"
|
||||
v-if="props.row.status === 'รอตรวจสอบคุณสมบัติ'"
|
||||
>
|
||||
<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 clickable v-close-popup>
|
||||
<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
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="Detailpage()"
|
||||
v-if="props.row.status === 'รอพิจารณาผลการประเมิน'"
|
||||
>
|
||||
<q-item-section
|
||||
style="min-width: 0px"
|
||||
avatar
|
||||
class="q-py-sm"
|
||||
>
|
||||
<q-icon
|
||||
color="primary"
|
||||
size="xs"
|
||||
name="mdi-account-outline"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>พิจารณาผลการประเมิน </q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</Table>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<style></style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue