Merge branch 'develop' into dev-tee
This commit is contained in:
setthawutttty
commit
0063e5167f
25 changed files with 2999 additions and 116 deletions
|
|
@ -468,6 +468,7 @@ const saveData = async () => {
|
|||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
modal.value = false;
|
||||
await fetchData();
|
||||
});
|
||||
};
|
||||
|
|
@ -493,6 +494,7 @@ const editData = async () => {
|
|||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
modal.value = false;
|
||||
await fetchData();
|
||||
});
|
||||
};
|
||||
|
|
|
|||
|
|
@ -497,6 +497,7 @@ const saveData = async () => {
|
|||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
modal.value = false;
|
||||
await fetchData();
|
||||
});
|
||||
};
|
||||
|
|
|
|||
|
|
@ -58,6 +58,17 @@
|
|||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
size="md"
|
||||
icon="mdi-content-save-move-outline"
|
||||
round
|
||||
flat
|
||||
color="indigo"
|
||||
v-if="statusPayment && setSeat == true"
|
||||
@click="candidateToPlacement"
|
||||
>
|
||||
<q-tooltip>บรรจุผู้ผ่านการคัดเลือก</q-tooltip>
|
||||
</q-btn>
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
|
|
@ -137,7 +148,7 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from "vue";
|
||||
import { useRoute } from "vue-router";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { useDataStore } from "@/stores/data";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import http from "@/plugins/http";
|
||||
|
|
@ -145,6 +156,7 @@ import config from "@/app.config";
|
|||
import { useQuasar } from "quasar";
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const dataStore = useDataStore();
|
||||
const { loaderPage } = dataStore;
|
||||
const mixin = useCounterMixin();
|
||||
|
|
@ -277,6 +289,34 @@ const uploadFile = async () => {
|
|||
}
|
||||
};
|
||||
|
||||
const candidateToPlacement = async () => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการนำผู้ผ่านคัดเลือกเข้าสู่ระบบบรรจุ",
|
||||
message: "ต้องการนำผู้ผ่านคัดเลือกเข้าสู่ระบบบรรจุใช่หรือไม่?",
|
||||
cancel: {
|
||||
flat: true,
|
||||
color: "negative",
|
||||
},
|
||||
persistent: true,
|
||||
})
|
||||
.onOk(async () => {
|
||||
await http
|
||||
.get(config.API.periodExamToPlacement(examId.value))
|
||||
.then((res) => {
|
||||
success($q, "นำผู้ผ่านคัดเลือกเข้าสู่ระบบบรรจุ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
loaderPage(false);
|
||||
router.go(-1);
|
||||
});
|
||||
})
|
||||
.onCancel(() => {})
|
||||
.onDismiss(() => {});
|
||||
};
|
||||
|
||||
const uploadDataSeat = async () => {
|
||||
loaderPage(true);
|
||||
const formData = new FormData();
|
||||
|
|
|
|||
|
|
@ -13,6 +13,17 @@
|
|||
/>
|
||||
รายชื่อผู้สมัครสอบแข่งขัน {{ name }} ครั้งที่ {{ round }}/{{ year }}
|
||||
<q-space />
|
||||
<q-btn
|
||||
size="md"
|
||||
icon="mdi-content-save-move-outline"
|
||||
round
|
||||
flat
|
||||
color="indigo"
|
||||
v-if="rows.length > 0"
|
||||
@click="candidateToPlacement"
|
||||
>
|
||||
<q-tooltip>บรรจุผู้ผ่านการคัดเลือกผู้พิการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn class="bg-teal-1" icon="mdi-download" round color="primary" flat>
|
||||
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
|
||||
<q-menu>
|
||||
|
|
@ -122,7 +133,7 @@ const router = useRouter();
|
|||
const route = useRoute();
|
||||
const { loaderPage } = dataStore;
|
||||
const mixin = useCounterMixin();
|
||||
const { messageError } = mixin;
|
||||
const { messageError, success } = mixin;
|
||||
const year = ref<string>("");
|
||||
const round = ref<string>("");
|
||||
const name = ref<string>("");
|
||||
|
|
@ -440,10 +451,12 @@ const fetchData = async () => {
|
|||
notpass.value = header.notpass;
|
||||
|
||||
// period information
|
||||
name.value = period.name;
|
||||
round.value = period.order as string;
|
||||
year.value =
|
||||
period.year >= 2500 ? period.year : ((period.year + 543) as string);
|
||||
if (period != null) {
|
||||
name.value = period.name;
|
||||
round.value = period.order;
|
||||
year.value =
|
||||
period.year >= 2500 ? period.year : ((period.year + 543) as string);
|
||||
}
|
||||
|
||||
const data = res.data.result.data;
|
||||
if (data.length > 0) {
|
||||
|
|
@ -464,6 +477,35 @@ const fetchData = async () => {
|
|||
loaderPage(false);
|
||||
});
|
||||
};
|
||||
|
||||
const candidateToPlacement = async () => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการนำผู้ผ่านสอบแข่งขันเข้าสู่ระบบบรรจุ",
|
||||
message: "ต้องการนำผู้ผ่านสอบแข่งขันเข้าสู่ระบบบรรจุใช่หรือไม่?",
|
||||
cancel: {
|
||||
flat: true,
|
||||
color: "negative",
|
||||
},
|
||||
persistent: true,
|
||||
})
|
||||
.onOk(async () => {
|
||||
loaderPage(true);
|
||||
await http
|
||||
.get(config.API.periodRecruitToPlacement(importId.value))
|
||||
.then((res) => {
|
||||
success($q, "นำผู้ผ่านสอบแข่งขันเข้าสู่ระบบบรรจุ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
loaderPage(false);
|
||||
router.go(-1);
|
||||
});
|
||||
})
|
||||
.onCancel(() => {})
|
||||
.onDismiss(() => {});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
|
|
|
|||
|
|
@ -13,6 +13,17 @@
|
|||
/>
|
||||
รายชื่อผู้สมัครสอบรอบ {{ name }} ครั้งที่ {{ round }}/{{ year }}
|
||||
<q-space />
|
||||
<q-btn
|
||||
size="md"
|
||||
icon="mdi-content-save-move-outline"
|
||||
round
|
||||
flat
|
||||
color="indigo"
|
||||
v-if="rows.length > 0"
|
||||
@click="candidateToPlacement"
|
||||
>
|
||||
<q-tooltip>บรรจุผู้ผ่านการคัดเลือกผู้พิการ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn class="bg-teal-1" icon="mdi-download" round color="primary" flat>
|
||||
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
|
||||
<q-menu>
|
||||
|
|
@ -129,7 +140,7 @@ const pass = ref<number>(0);
|
|||
const notpass = ref<number>(0);
|
||||
const importId = ref<string>(route.params.id as string); // Period Import Id
|
||||
const mixin = useCounterMixin();
|
||||
const { messageError } = mixin;
|
||||
const { messageError, success } = mixin;
|
||||
const filter = ref<string>(""); //search data table
|
||||
const visibleColumns = ref<String[]>([
|
||||
"examID",
|
||||
|
|
@ -419,6 +430,35 @@ const fetchData = async () => {
|
|||
loaderPage(false);
|
||||
});
|
||||
};
|
||||
|
||||
const candidateToPlacement = async () => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการนำผู้ผ่านคัดเลือกคนพิการเข้าสู่ระบบบรรจุ",
|
||||
message: "ต้องการนำผู้ผ่านคัดเลือกคนพิการเข้าสู่ระบบบรรจุใช่หรือไม่?",
|
||||
cancel: {
|
||||
flat: true,
|
||||
color: "negative",
|
||||
},
|
||||
persistent: true,
|
||||
})
|
||||
.onOk(async () => {
|
||||
loaderPage(true);
|
||||
await http
|
||||
.get(config.API.periodDisableToPlacement(importId.value))
|
||||
.then((res) => {
|
||||
success($q, "นำผู้ผ่านคัดเลือกคนพิการเข้าสู่ระบบบรรจุ");
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(async () => {
|
||||
loaderPage(false);
|
||||
router.go(-1);
|
||||
});
|
||||
})
|
||||
.onCancel(() => {})
|
||||
.onDismiss(() => {});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
|
|
|
|||
|
|
@ -455,7 +455,7 @@ const columns = ref<QTableProps["columns"]>([
|
|||
{
|
||||
name: "registerDate",
|
||||
align: "left",
|
||||
label: "วันเและเวลาที่สมัคร",
|
||||
label: "วันและเวลาที่สมัคร",
|
||||
sortable: true,
|
||||
field: "registerDate",
|
||||
headerStyle: "font-size: 14px; min-width: 200px",
|
||||
|
|
@ -514,7 +514,7 @@ const fetchData = async () => {
|
|||
avatar: r.profileImg != null ? r.profileImg.detail : "",
|
||||
citizenId: r.citizenId,
|
||||
number: r.number,
|
||||
registerDate: r.registerDate,
|
||||
registerDate: date2Thai(r.registerDate),
|
||||
examIdenNumber: r.examIdenNumber,
|
||||
seatNumber: r.seatNumber,
|
||||
resultC: r.resultC,
|
||||
|
|
|
|||
|
|
@ -6,15 +6,15 @@ import cardTop from "@/modules/05_placement/components/PersonalList/StatCard.vue
|
|||
import keycloak from "@/plugins/keycloak";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import { useCounterMixin } from "@/stores/mixin"
|
||||
import { useQuasar } from "quasar"
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
import { usePlacementDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
const DataStore = usePlacementDataStore();
|
||||
|
||||
const $q = useQuasar
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError, showLoader, hideLoader } = mixin
|
||||
const $q = useQuasar;
|
||||
const mixin = useCounterMixin();
|
||||
const { messageError, showLoader, hideLoader } = mixin;
|
||||
let roleAdmin = ref<boolean>(false);
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
|
@ -53,7 +53,7 @@ const getStat = async () => {
|
|||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
|
|
@ -65,14 +65,15 @@ onMounted(async () => {
|
|||
roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
|
||||
}
|
||||
|
||||
await getStat()
|
||||
await getStat();
|
||||
|
||||
examData.value = await DataStore.DataMainOrig.find((x: any) => x.id == examId);
|
||||
|
||||
title.value = examData.value.examRound;
|
||||
round.value = examData.value.examOrder;
|
||||
year.value = examData.value.fiscalYear;
|
||||
examData.value = await DataStore.DataMainOrig.find(
|
||||
(x: any) => x.id == examId
|
||||
);
|
||||
|
||||
title.value = examData.value == null ? null : examData.value.examRound;
|
||||
round.value = examData.value == null ? null : examData.value.examOrder;
|
||||
year.value = examData.value == null ? null : examData.value.fiscalYear;
|
||||
});
|
||||
|
||||
const fetchPlacementData = async () => {
|
||||
|
|
@ -93,18 +94,48 @@ const fetchPlacementData = async () => {
|
|||
<template>
|
||||
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 row">
|
||||
<div class="toptitle">
|
||||
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
รายชื่อผู้สอบในรอบ {{ title }} ครั้งที่ {{ round }} ปี {{ year }}
|
||||
</div>
|
||||
<q-card bordered class="q-py-sm row col-12">
|
||||
<div class="col-12 row bg-white">
|
||||
<div class="fit q-px-md q-py-sm">
|
||||
<div class="row col-12 q-col-gutter-md fit">
|
||||
<cardTop :amount="stat.total" label="จำนวนทั้งหมด" color="#016987" />
|
||||
<cardTop v-if="roleAdmin" :amount="stat.unContain" label="จำนวนที่ยังไม่บรรจุ" color="#02A998" />
|
||||
<cardTop :amount="stat.prepareContain" label="จำนวนที่เตรียมบรรจุ" color="#2EA0FF" />
|
||||
<cardTop :amount="stat.contain" label="จำนวนที่บรรจุแล้ว" color="#4154B3" />
|
||||
<cardTop :amount="stat.disclaim" label="จำนวนที่สละสิทธิ์" color="#FF5C5F" />
|
||||
<cardTop
|
||||
:amount="stat.total"
|
||||
label="จำนวนทั้งหมด"
|
||||
color="#016987"
|
||||
/>
|
||||
<cardTop
|
||||
v-if="roleAdmin"
|
||||
:amount="stat.unContain"
|
||||
label="จำนวนที่ยังไม่บรรจุ"
|
||||
color="#02A998"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.prepareContain"
|
||||
label="จำนวนที่เตรียมบรรจุ"
|
||||
color="#2EA0FF"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.contain"
|
||||
label="จำนวนที่บรรจุแล้ว"
|
||||
color="#4154B3"
|
||||
/>
|
||||
<cardTop
|
||||
:amount="stat.disclaim"
|
||||
label="จำนวนที่สละสิทธิ์"
|
||||
color="#FF5C5F"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -112,7 +143,11 @@ const fetchPlacementData = async () => {
|
|||
</div>
|
||||
<q-card flat bordered class="col-12 q-mt-sm q-pt-sm">
|
||||
<div>
|
||||
<AddTablePosition :statCard="getStat" class="q-pa-none" @get-stat="getStat" />
|
||||
<AddTablePosition
|
||||
:statCard="getStat"
|
||||
class="q-pa-none"
|
||||
@get-stat="getStat"
|
||||
/>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -232,7 +232,10 @@ const getTable = async () => {
|
|||
organizationShortName: data.organizationShortName,
|
||||
positionNumber: data.positionNumber,
|
||||
positionPath: data.positionPath,
|
||||
reportingDate: dateText(new Date(data.reportingDate)),
|
||||
reportingDate:
|
||||
data.reportingDate == null
|
||||
? null
|
||||
: dateText(new Date(data.reportingDate)),
|
||||
examNumber: data.examNumber,
|
||||
bmaOfficer: convertBmaOfficer(data.bmaOfficer),
|
||||
statusId: data.statusId,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,83 @@
|
|||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 row items-center">
|
||||
ผู้บังคับบัญชาผู้มอบหมายงาน
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select
|
||||
class="col-xs-12 col-sm-8"
|
||||
dense
|
||||
v-model="Autherise"
|
||||
outlined
|
||||
:options="option"
|
||||
label="ผู้บังคับบัญชา"
|
||||
/>
|
||||
<div class="col-xs-12 col-sm-4">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateAutherise"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker col-3"
|
||||
:model-value="
|
||||
dateAutherise != null ? date2Thai(dateAutherise) : null
|
||||
"
|
||||
:label="`${'ลงวันที่'}`"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
const Autherise = ref<any>(null);
|
||||
|
||||
const dateAutherise = ref<any>(new Date());
|
||||
|
||||
const option = ref<any>(["นาย ภูริณัฐ บุญขาว", "นาย พงศกร วรารักษ์"]);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,369 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const Part2 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part2.vue"
|
||||
)
|
||||
);
|
||||
const Part3 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part3.vue"
|
||||
)
|
||||
);
|
||||
const Footer = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/Footer.vue"
|
||||
)
|
||||
);
|
||||
|
||||
const $q = useQuasar();
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list1_1 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
|
||||
];
|
||||
const list1_2 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่เกิดขึ้น 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่เกิดขึ้น 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่เกิดขึ้น 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่เกิดขึ้น 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่เกิดขึ้น 5" },
|
||||
];
|
||||
|
||||
const etc_text = ref<any>(null);
|
||||
const text2_1 = ref<string>("");
|
||||
|
||||
const model = ref<any>(0);
|
||||
const model1 = ref<any>(0);
|
||||
const model1_2 = ref<any>(0);
|
||||
const model1_3 = ref<any>(0);
|
||||
const model1_4 = ref<any>(0);
|
||||
const model1_5 = ref<any>(0);
|
||||
const model1_6 = ref<any>(0);
|
||||
const modelEtc = ref<any>(0);
|
||||
const etc = ref<any>(false);
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
const dateToday = ref<Date>(new Date("10-10-2023"));
|
||||
const dateEnd = ref<Date>(new Date("12-10-2023"));
|
||||
const period = ref<number>(1);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
<span class="text-black q-px-sm">{{ "ครั้งที่" + period }}</span>
|
||||
ระหว่างวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 q-pt-md">
|
||||
<q-separator size="3px" color="grey-2" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
||||
ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row no-margin">
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.1. ความรู้ความสามารถ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ทักษะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.3. สมมรถนะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.4. ความสามารถในการเรียนรู้งาน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.5. ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.6. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.7 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc" /></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card v-if="etc" class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section class="q-ml-md">
|
||||
<q-item-label>
|
||||
<q-input v-model="etc_text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space outlined
|
||||
class="bg-white" :rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="modelEtc" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Part 2 -->
|
||||
<Part2 />
|
||||
|
||||
<!-- Part 3 -->
|
||||
<Part3 />
|
||||
|
||||
<!-- Footer -->
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
|
||||
.q-card {
|
||||
box-shadow: 0px 0px 0px 0px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,369 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const Part2 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part2.vue"
|
||||
)
|
||||
);
|
||||
const Part3 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part3.vue"
|
||||
)
|
||||
);
|
||||
const Footer = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/Footer.vue"
|
||||
)
|
||||
);
|
||||
|
||||
const $q = useQuasar();
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list1_1 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
|
||||
];
|
||||
const list1_2 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่เกิดขึ้น 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่เกิดขึ้น 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่เกิดขึ้น 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่เกิดขึ้น 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่เกิดขึ้น 5" },
|
||||
];
|
||||
|
||||
const etc_text = ref<any>(null);
|
||||
const text2_1 = ref<string>("");
|
||||
|
||||
const model = ref<any>(0);
|
||||
const model1 = ref<any>(0);
|
||||
const model1_2 = ref<any>(0);
|
||||
const model1_3 = ref<any>(0);
|
||||
const model1_4 = ref<any>(0);
|
||||
const model1_5 = ref<any>(0);
|
||||
const model1_6 = ref<any>(0);
|
||||
const modelEtc = ref<any>(0);
|
||||
const etc = ref<any>(false);
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
const dateToday = ref<Date>(new Date("10-10-2023"));
|
||||
const dateEnd = ref<Date>(new Date("12-10-2023"));
|
||||
const period = ref<number>(1);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
<span class="text-black q-px-sm">{{ "ครั้งที่" + period }}</span>
|
||||
ระหว่างวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 q-pt-md">
|
||||
<q-separator size="3px" color="grey-2" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
||||
ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row no-margin">
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.1. ความรู้ความสามารถ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ทักษะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.3. สมมรถนะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.4. ความสามารถในการเรียนรู้งาน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.5. ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.6. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.7 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc" /></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card v-if="etc" class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section class="q-ml-md">
|
||||
<q-item-label>
|
||||
<q-input v-model="etc_text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space outlined
|
||||
class="bg-white" :rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="modelEtc" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Part 2 -->
|
||||
<Part2 />
|
||||
|
||||
<!-- Part 3 -->
|
||||
<Part3 />
|
||||
|
||||
<!-- Footer -->
|
||||
<Footer />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
|
||||
.q-card {
|
||||
box-shadow: 0px 0px 0px 0px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,469 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const Part2 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part2.vue"
|
||||
)
|
||||
);
|
||||
const Part3 = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/Part3.vue"
|
||||
)
|
||||
);
|
||||
const Footer = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/Footer.vue"
|
||||
)
|
||||
);
|
||||
const $q = useQuasar();
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list1_1 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
|
||||
];
|
||||
const list1_2 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่เกิดขึ้น 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่เกิดขึ้น 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่เกิดขึ้น 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่เกิดขึ้น 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่เกิดขึ้น 5" },
|
||||
];
|
||||
|
||||
const etc_text = ref<any>(null);
|
||||
const text2_1 = ref<string>("");
|
||||
|
||||
const model = ref<any>(0);
|
||||
const model1 = ref<any>(0);
|
||||
const model1_2 = ref<any>(0);
|
||||
const model1_3 = ref<any>(0);
|
||||
const model1_4 = ref<any>(0);
|
||||
const model1_5 = ref<any>(0);
|
||||
const model1_6 = ref<any>(0);
|
||||
const modelEtc = ref<any>(0);
|
||||
const text2_2 = ref<string>("");
|
||||
const etc = ref<any>(false);
|
||||
|
||||
const mixin = useCounterMixin();
|
||||
const { date2Thai } = mixin;
|
||||
const dateToday = ref<Date>(new Date("10-10-2023"));
|
||||
const dateEnd = ref<Date>(new Date("12-10-2023"));
|
||||
const period = ref<number>(1);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
<span class="text-black q-px-sm">{{ "ครั้งที่" + period }}</span>
|
||||
ระหว่างวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateToday) }}</span>
|
||||
ถึงวันที่
|
||||
<span class="text-black q-px-sm">{{ date2Thai(dateEnd) }}</span>
|
||||
</div>
|
||||
<div class="col-12 q-pt-md">
|
||||
<q-separator size="3px" color="grey-2" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
||||
ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.1 ความสำเร็จของงานที่ได้รับมอบหมาย
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
|
||||
1.ผลผลิตของงานที่คาดหวัง
|
||||
</div>
|
||||
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
|
||||
<q-list dense v-for="(list, i) in list1_1" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ list.label }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model" :val="list.id" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list1_1.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2 ความสำเร็จของงานที่ได้รับมอบหมาย
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
|
||||
1.ผลผลิตของงานที่เกิดขึ้น
|
||||
</div>
|
||||
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
|
||||
<q-list dense v-for="(list, i) in list1_2" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<!-- <q-item-label>{{ list.label }}</q-item-label> -->
|
||||
<q-input outlined dense v-model="text2_1" class="col-xs-12 col-sm-11 col-md-10 offset-md-1" lazy-rules
|
||||
type="textarea" label="ผลผลิตของงานที่เกิดขึ้นจริง" hide-bottom-space :row="1" />
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1" :val="list.id" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list1_2.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row">
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ความรู้ความสามารถ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ทักษะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.4. สมมรถนะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.5. ความสามารถในการเรียนรู้งาน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.6. ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.7. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.8 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc" /></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card v-if="etc" class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section class="q-ml-md">
|
||||
<q-item-label>
|
||||
<q-input v-model="etc_text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space outlined
|
||||
class="bg-white" :rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="modelEtc" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
จุดเด่น (ไม่เกิน 5 บรรทัด)
|
||||
</div>
|
||||
<q-input outlined dense v-model="text2_1" class="col-xs-12 col-sm-11 col-md-10 offset-md-1" lazy-rules
|
||||
type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5"
|
||||
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']" />
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
|
||||
</div>
|
||||
<q-input outlined dense v-model="text2_2" class="col-xs-12 col-sm-11 col-md-10 offset-md-1" lazy-rules
|
||||
type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
|
||||
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Part 2 -->
|
||||
<Part2 />
|
||||
|
||||
<!-- Part 3 -->
|
||||
<Part3 />
|
||||
|
||||
<!-- Footer -->
|
||||
<Footer />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
|
||||
.q-card {
|
||||
box-shadow: 0px 0px 0px 0px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
const tabHead = ref<string>("save1");
|
||||
|
||||
const props = defineProps({
|
||||
changeTab: {
|
||||
type: Function,
|
||||
default() {
|
||||
return 'Default function'
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
watch(tabHead, () => {
|
||||
props.changeTab(tabHead.value)
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-header class="bg-grey-1">
|
||||
<div class="bg-grey-1">
|
||||
<div class="col-12 row q-gutter-x-md items-center">
|
||||
<q-tabs
|
||||
dense
|
||||
v-model="tabHead"
|
||||
active-class="text-primary text-weight-medium"
|
||||
indicator-color="grey-1"
|
||||
class="text-grey-7"
|
||||
>
|
||||
<q-tab name="save1" label="บันทึกผลครั้งที่ 1" />
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
dense
|
||||
icon="mdi-download"
|
||||
:disable="tabHead !== 'save1'"
|
||||
:color="tabHead !== 'save1' ? 'grey' : 'add'"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
<q-menu>
|
||||
<q-list style="min-width: 150px">
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar
|
||||
><q-icon color="red" name="mdi-file-pdf"
|
||||
/></q-item-section>
|
||||
<q-item-section>ไฟล์ .PDF</q-item-section>
|
||||
</q-item>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar
|
||||
><q-icon color="blue" name="mdi-file-word"
|
||||
/></q-item-section>
|
||||
<q-item-section>ไฟล์ .docx</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
|
||||
<q-tab name="save2" label="บันทึกผลครั้งที่ 2" />
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
dense
|
||||
icon="mdi-download"
|
||||
:disable="tabHead !== 'save2'"
|
||||
:color="tabHead !== 'save2' ? 'grey' : 'add'"
|
||||
>
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
<q-menu>
|
||||
<q-list style="min-width: 150px">
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar
|
||||
><q-icon color="red" name="mdi-file-pdf"
|
||||
/></q-item-section>
|
||||
<q-item-section>ไฟล์ .PDF</q-item-section>
|
||||
</q-item>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar
|
||||
><q-icon color="blue" name="mdi-file-word"
|
||||
/></q-item-section>
|
||||
<q-item-section>ไฟล์ .docx</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn>
|
||||
<!-- <q-tab name="save3" label="บันทึกผลครั้งที่ 3" />
|
||||
<q-btn size="12px" flat dense icon="mdi-download" :disable="tab !== 'save3'"
|
||||
:color="tab !== 'save3' ? 'grey' : 'add'">
|
||||
<q-tooltip>ดาวน์โหลด</q-tooltip>
|
||||
<q-menu>
|
||||
<q-list style="min-width: 150px">
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar><q-icon color="red"
|
||||
name="mdi-file-pdf" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .PDF</q-item-section>
|
||||
</q-item>
|
||||
<q-item clickable v-close-popup>
|
||||
<q-item-section avatar><q-icon color="blue"
|
||||
name="mdi-file-word" /></q-item-section>
|
||||
<q-item-section>ไฟล์ .docx</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-btn> -->
|
||||
</q-tabs>
|
||||
<div>
|
||||
<q-btn color="blue" flat dense icon="mdi-plus">
|
||||
<q-tooltip> เพิ่มบันทึกผลการทดลอง </q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
</div>
|
||||
</q-header>
|
||||
|
||||
</template>
|
||||
|
|
@ -0,0 +1,432 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
const PartHighlightImprove = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/FormEvaluation/SubForm/PartHighlightImprove.vue"
|
||||
)
|
||||
);
|
||||
|
||||
const $q = useQuasar();
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list1_1 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
|
||||
];
|
||||
const list1_2 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่เกิดขึ้น 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่เกิดขึ้น 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่เกิดขึ้น 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่เกิดขึ้น 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่เกิดขึ้น 5" },
|
||||
];
|
||||
|
||||
const etc_text = ref<any>(null);
|
||||
const text2_1 = ref<string>("");
|
||||
|
||||
const model = ref<any>(0);
|
||||
const model1 = ref<any>(0);
|
||||
const model1_2 = ref<any>(0);
|
||||
const model1_3 = ref<any>(0);
|
||||
const model1_4 = ref<any>(0);
|
||||
const model1_5 = ref<any>(0);
|
||||
const model1_6 = ref<any>(0);
|
||||
const modelEtc = ref<any>(0);
|
||||
const etc = ref<any>(false);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
||||
ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.1 ความสำเร็จของงานที่ได้รับมอบหมาย
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
|
||||
1.ผลผลิตของงานที่คาดหวัง
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense v-for="(list, i) in list1_1" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ list.label }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="model"
|
||||
:val="list.id"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list1_1.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2 ความสำเร็จของงานที่ได้รับมอบหมาย
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
|
||||
1.ผลผลิตของงานที่เกิดขึ้น
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense v-for="(list, i) in list1_2" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<!-- <q-item-label>{{ list.label }}</q-item-label> -->
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="text2_1"
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
|
||||
lazy-rules
|
||||
type="textarea"
|
||||
label="ผลผลิตของงานที่เกิดขึ้นจริง"
|
||||
hide-bottom-space
|
||||
:row="1"
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="model1"
|
||||
:val="list.id"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list1_2.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
|
||||
<div class="col-12 row">
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ความรู้ความสามารถ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ทักษะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.4. สมมรถนะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.5. ความสามารถในการเรียนรู้งาน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.6. ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.7. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.8 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc" /></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card v-if="etc" class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section class="q-ml-md">
|
||||
<q-item-label>
|
||||
<q-input v-model="etc_text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space outlined
|
||||
class="bg-white" :rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="modelEtc" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
</div>
|
||||
|
||||
<PartHighlightImprove />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
.q-card {
|
||||
box-shadow: 0px 0px 0px 0px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,312 @@
|
|||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
||||
ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row no-margin">
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.1. ความรู้ความสามารถ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.2. ทักษะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.3. สมมรถนะ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.4. ความสามารถในการเรียนรู้งาน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.5. ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.6. ความสำเร็จของงานที่ได้รับมอบหมาย</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="model1_2" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card class="text-top0 col-12 q-pa-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
1.7 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc" /></q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
<q-card v-if="etc" class="text-top0 col-12 q-pa-sm q-mt-sm q-pl-lg">
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section class="q-ml-md">
|
||||
<q-item-label>
|
||||
<q-input v-model="etc_text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space outlined
|
||||
class="bg-white" :rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating v-model="modelEtc" max="5" size="sm" color="grey" :color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม">
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
|
||||
const $q = useQuasar();
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list1_1 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่คาดหวัง 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่คาดหวัง 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่คาดหวัง 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่คาดหวัง 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่คาดหวัง 5" },
|
||||
];
|
||||
const list1_2 = [
|
||||
{ id: "1", label: "ผลผลิตของงานที่เกิดขึ้น 1" },
|
||||
{ id: "2", label: "ผลผลิตของงานที่เกิดขึ้น 2" },
|
||||
{ id: "3", label: "ผลผลิตของงานที่เกิดขึ้น 3" },
|
||||
{ id: "4", label: "ผลผลิตของงานที่เกิดขึ้น 4" },
|
||||
{ id: "5", label: "ผลผลิตของงานที่เกิดขึ้น 5" },
|
||||
];
|
||||
|
||||
const etc_text = ref<any>(null);
|
||||
const text2_1 = ref<string>("");
|
||||
|
||||
const model = ref<any>(0);
|
||||
const model1 = ref<any>(0);
|
||||
const model1_2 = ref<any>(0);
|
||||
const model1_3 = ref<any>(0);
|
||||
const model1_4 = ref<any>(0);
|
||||
const model1_5 = ref<any>(0);
|
||||
const model1_6 = ref<any>(0);
|
||||
const modelEtc = ref<any>(0);
|
||||
const etc = ref<any>(false);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top2 {
|
||||
font-weight: 500;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
.q-card {
|
||||
box-shadow: 0px 0px 0px 0px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,289 @@
|
|||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">2</q-avatar>
|
||||
พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
2.1 ความประพฤติ
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense v-for="(list, i) in list2_1" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ list.label }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="model"
|
||||
:val="list.id"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list2_1.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
2.2 ความมีคุณธรรมจริยธรรม
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense v-for="(list, i) in list2_2" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ list.label }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="model"
|
||||
:val="list.id"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list2_2.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
2.3 การรักษาวินัย
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense v-for="(list, i) in list2_3" :key="i">
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ list.label }}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="model"
|
||||
:val="list.id"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" v-if="i + 1 < list2_3.length" />
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
2.4 อื่นๆ
|
||||
<q-checkbox class="q-ml-sm" dense v-model="etc_4" />
|
||||
</div>
|
||||
<q-card
|
||||
v-if="etc_4"
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>
|
||||
<q-input
|
||||
v-model="etc_text2"
|
||||
label="กรอกอื่นๆ"
|
||||
dense
|
||||
lazy-rules
|
||||
autogrow
|
||||
hide-bottom-space
|
||||
outlined
|
||||
class="bg-white"
|
||||
:rules="[
|
||||
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
|
||||
]"
|
||||
/>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-rating
|
||||
v-model="modelEtc"
|
||||
max="5"
|
||||
size="sm"
|
||||
color="grey"
|
||||
:color-selected="ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
<FormComment />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import { useProbationDataStore } from "@/modules/05_placement/store";
|
||||
const FormComment = defineAsyncComponent(
|
||||
() =>
|
||||
import(
|
||||
"@/modules/05_placement/components/probation/form/formEvacomment.vue"
|
||||
)
|
||||
);
|
||||
const probationStore = useProbationDataStore();
|
||||
const { ratingColors } = probationStore;
|
||||
|
||||
const list2_1 = [
|
||||
{ id: "1", label: "ให้บริการประชาชนหรือผู้รับบริการด้วยอัธยาศัยดี" },
|
||||
{ id: "2", label: "มีความรับผิดชอบในการปฏิบัติบัติงาน" },
|
||||
{
|
||||
id: "3",
|
||||
label:
|
||||
"ให้บริการประชาชนหรือผู้รับบริการด้วยความรวดเร็ว เอาใจใส่เป็นมาตรฐานเดียวกัน",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
label: "ตั้งใจปฏิบัติบัติหน้าที่ราชการด้วยความอุตสาหะ ขยันหมั่นเพียร",
|
||||
},
|
||||
];
|
||||
const list2_2 = [
|
||||
{
|
||||
id: "1",
|
||||
label: "อุทิศตนและเสียสละเวลาในการปฏิบัติบัติงานอย่างเต็มกำลังความสามารถ",
|
||||
},
|
||||
{ id: "2", label: "มีจิตสำนึกที่ดี ปฏิบัติบัติงานด้วยความซื่อสัตย์ สุจริต" },
|
||||
{
|
||||
id: "3",
|
||||
label:
|
||||
"ยึดมั่นในสถาบันบัพระมหากษัตริย์ และไม่กระทำการใด ๆ อันจะก่อให้เกิดความเสียหายต่อประเทศชาติ",
|
||||
},
|
||||
];
|
||||
|
||||
const list2_3 = [
|
||||
{ id: "1", label: "มีความรับรัผิดชอบในการรักษาเวลาทำงาน" },
|
||||
{
|
||||
id: "2",
|
||||
label: "แต่งกายในการปฏิบัติบัติงานได้อย่างเหมาะสมกับการเป็นข้าราชการ",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
label: "ไม่กระทำการใด ๆ อันอาจก่อให้เกิดความเสียหายแก่ชื่อเสียงของหน่วยงาน",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
label:
|
||||
"ไม่กระทำการใด ๆ อันเป็นการเสื่อมเกียรติและศักดิ์ศรีของความเป็นข้าราชการ",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
label: "ปฏิบัติบัติหน้าที่อย่างตรงไปตรงมาโดยยึกหลักจรรยาบรรณวิชาชีพ",
|
||||
},
|
||||
];
|
||||
|
||||
const etc_text2 = ref<any>(null);
|
||||
const modelEtc = ref<any>(0);
|
||||
const etc_4 = ref<any>(false);
|
||||
const model = ref<any>(0);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
|
||||
.q-rating__icon {
|
||||
text-shadow: transparent !important;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
const radio_1 = ref<any>(null);
|
||||
const radio_2 = ref<any>(null);
|
||||
const radio_3 = ref<any>(null);
|
||||
const radio_4 = ref<any>(null);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row justify-center">
|
||||
<div class="col-12 text-top0 items-center">
|
||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
|
||||
การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<q-card
|
||||
flat
|
||||
bordered
|
||||
class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
|
||||
>
|
||||
<q-list dense>
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>1. การปฐมนิเทศ</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<div class="row">
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_1"
|
||||
val="1"
|
||||
label="ดำเนินการเเล้ว"
|
||||
/>
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_1"
|
||||
val="0"
|
||||
label=" ยังไม่ได้ดำเนินการ"
|
||||
/>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" />
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>2. การเรียนรู้ด้วยตนเอง</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<div class="row">
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_2"
|
||||
val="1"
|
||||
label="ดำเนินการเเล้ว"
|
||||
/>
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_2"
|
||||
val="0"
|
||||
label=" ยังไม่ได้ดำเนินการ"
|
||||
/>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" />
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label>3. การอบรมสัมนาร่วมกัน</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<div class="row">
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_3"
|
||||
val="1"
|
||||
label="ดำเนินการเเล้ว"
|
||||
/>
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_3"
|
||||
val="0"
|
||||
label=" ยังไม่ได้ดำเนินการ"
|
||||
/>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator class="q-my-xs" />
|
||||
<q-item dense tag="label" v-ripple>
|
||||
<q-item-section>
|
||||
<q-item-label
|
||||
>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)</q-item-label
|
||||
>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<div class="row">
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_4"
|
||||
val="1"
|
||||
label="ดำเนินการเเล้ว"
|
||||
/>
|
||||
<q-radio
|
||||
checked-icon="task_alt"
|
||||
unchecked-icon="panorama_fish_eye"
|
||||
v-model="radio_4"
|
||||
val="0"
|
||||
label=" ยังไม่ได้ดำเนินการ"
|
||||
/>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.text-top0 {
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<div class="row col-12 q-gutter-lg no-margin">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
จุดเด่น (ไม่เกิน 5 บรรทัด)
|
||||
</div>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="text2_1"
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
|
||||
lazy-rules
|
||||
type="textarea"
|
||||
label="กรอกจุดเด่น"
|
||||
hide-bottom-space
|
||||
:row="5"
|
||||
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top0 row items-center q-pl-lg">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)
|
||||
</div>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
v-model="text2_2"
|
||||
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
|
||||
lazy-rules
|
||||
type="textarea"
|
||||
hide-bottom-space
|
||||
label="กรอกสิ่งที่ควรปรับปรุง"
|
||||
:row="5"
|
||||
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
const text2_1 = ref<string>("");
|
||||
const text2_2 = ref<string>("");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
const tab = ref<string>("save1");
|
||||
const changeTab = (tabVal: string) => {
|
||||
tab.value = tabVal
|
||||
}
|
||||
|
||||
const Header = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Header.vue")
|
||||
);
|
||||
const FormSaveResult = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/FormSaveResult.vue")
|
||||
)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Header :change-tab="changeTab" />
|
||||
|
||||
<q-page-container>
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="save1">
|
||||
<FormSaveResult />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="save2">
|
||||
<FormSaveResult />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-page-container>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
const tab = ref<string>("save1");
|
||||
const changeTab = (tabVal: string) => {
|
||||
tab.value = tabVal
|
||||
}
|
||||
const Header = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Header.vue")
|
||||
);
|
||||
const FormEvaluate = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/FormEvaluate.vue")
|
||||
)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Header :change-tab="changeTab" />
|
||||
|
||||
<q-page-container>
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="save1">
|
||||
<FormEvaluate />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="save2">
|
||||
<FormEvaluate />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-page-container>
|
||||
</template>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
const tab = ref<string>("save1");
|
||||
const changeTab = (tabVal: string) => {
|
||||
tab.value = tabVal
|
||||
}
|
||||
|
||||
const Header = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Header.vue")
|
||||
);
|
||||
const FormReport = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/FormReport.vue")
|
||||
)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Header :change-tab="changeTab" />
|
||||
|
||||
<q-page-container>
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="save1">
|
||||
<FormReport />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="save2">
|
||||
<FormReport />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-page-container>
|
||||
</template>
|
||||
|
|
@ -1,3 +1,34 @@
|
|||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
const ProbationFormAssign = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormAssign.vue")
|
||||
);
|
||||
const TabsTemplate1 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Template1.vue")
|
||||
);
|
||||
const TabsTemplate2 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Template2.vue")
|
||||
);
|
||||
const TabsTemplate3 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormEvaluation/Template3.vue")
|
||||
);
|
||||
// const Tabs2 = defineAsyncComponent(
|
||||
// () => import("@/modules/05_placement/components/probation/tabs/tabs2.vue")
|
||||
// );
|
||||
const Tabs3 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/tabs/tabs3.vue")
|
||||
);
|
||||
const Tabs4 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/tabs/tabs4.vue")
|
||||
);
|
||||
|
||||
const router = useRouter();
|
||||
const drawer = ref<boolean>(true);
|
||||
const activeTab = ref<string>("tab1");
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- <div class="toptitle text-dark col-12 row items-center">จัดการบัญชี 2</div> -->
|
||||
<q-card flat bordered class="col-12">
|
||||
|
|
@ -22,7 +53,7 @@
|
|||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
บันทึกผลการทดลองปฏิบัติหน้าที่ราชการของ นายสมคิด ยอดใจ
|
||||
การทดลองปฏิบัติหน้าที่ราชการของ นายสมคิด ยอดใจ
|
||||
</div>
|
||||
</q-toolbar>
|
||||
<q-separator />
|
||||
|
|
@ -50,7 +81,7 @@
|
|||
<q-icon size="18px" name="mdi-file" />
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section> แบบมอบหมายงาน </q-item-section>
|
||||
<q-item-section> แบบมอบหมายงาน</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-item
|
||||
|
|
@ -67,7 +98,7 @@
|
|||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
บันทึกผลการทดลองปฏิบัติหน้าที่ราชการ (2)
|
||||
บันทึกผล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
|
|
@ -85,7 +116,7 @@
|
|||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
ประเมินผลการทดลองปฏิบัติหน้าที่ราชการ (1)
|
||||
ประเมินผล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
||||
|
|
@ -103,7 +134,7 @@
|
|||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
รายงานการประเมินผลการทดลองปฏิบัติหน้าที่ราชการ
|
||||
รายงานการประเมินผล
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
|
@ -121,13 +152,13 @@
|
|||
<ProbationFormAssign />
|
||||
</q-tab-panel>
|
||||
|
||||
<q-tab-panel name="tab2"> <Tabs2 /></q-tab-panel>
|
||||
<q-tab-panel name="tab2"> <TabsTemplate1 /></q-tab-panel>
|
||||
|
||||
<q-tab-panel name="tab3">
|
||||
<Tabs3 />
|
||||
<TabsTemplate2 />
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="tab4">
|
||||
<Tabs4 />
|
||||
<TabsTemplate3 />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
</q-layout>
|
||||
|
|
@ -135,27 +166,7 @@
|
|||
</q-layout>
|
||||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, defineAsyncComponent } from "vue";
|
||||
|
||||
const ProbationFormAssign = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/FormAssign.vue")
|
||||
);
|
||||
const Tabs2 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/tabs/tabs2.vue")
|
||||
);
|
||||
const Tabs3 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/tabs/tabs3.vue")
|
||||
);
|
||||
const Tabs4 = defineAsyncComponent(
|
||||
() => import("@/modules/05_placement/components/probation/tabs/tabs4.vue")
|
||||
);
|
||||
|
||||
const router = useRouter();
|
||||
const drawer = ref<boolean>(true);
|
||||
const activeTab = ref<string>("tab1");
|
||||
</script>
|
||||
<style lang="scss" scope>
|
||||
.btn-absolute {
|
||||
z-index: 50;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue