tab 2 ผลการประเมินการ ฯ แสดงเหมือนของระบบบริหารจัดการ
This commit is contained in:
parent
3637b9dbdf
commit
3fec8ef37c
4 changed files with 776 additions and 255 deletions
267
src/modules/15_probationReport/components/01_SurveyPage.vue
Normal file
267
src/modules/15_probationReport/components/01_SurveyPage.vue
Normal file
|
|
@ -0,0 +1,267 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { onMounted, ref, watch } from "vue";
|
||||||
|
import { QForm, useQuasar } from "quasar";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
import { useProbationReport } from "@/modules/15_probationReport/store";
|
||||||
|
|
||||||
|
import type { ListDataText } from "@/modules/15_probationReport/interface/Main";
|
||||||
|
|
||||||
|
const store = useProbationReport();
|
||||||
|
const router = useRouter();
|
||||||
|
const optionText = ref<ListDataText[]>([
|
||||||
|
{ value: "1", label: "ต่ำกว่าความคาดหวังมาก (1)" },
|
||||||
|
{ value: "2", label: "ต่ำกว่าความคาดหวังค่อนข้างมาก (2)" },
|
||||||
|
{ value: "3", label: "เป็นไปตามความคาดหวัง (3)" },
|
||||||
|
{ value: "4", label: "สูงว่าความคาดหวังค่อนข้างมาก (4)" },
|
||||||
|
{ value: "5", label: "สูงกว่าความคาดหวังมาก (5)" },
|
||||||
|
]);
|
||||||
|
|
||||||
|
const $q = useQuasar();
|
||||||
|
const myForm = ref<QForm>();
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
|
||||||
|
const { messageError, success, dialogConfirm, showLoader, hideLoader } = mixin;
|
||||||
|
const route = useRoute();
|
||||||
|
|
||||||
|
const assignId = ref<string>("baa3d9f6-9d21-4c58-85f2-114abf8de25c");
|
||||||
|
const status = ref<boolean>(true);
|
||||||
|
|
||||||
|
const answer1 = ref<string>("");
|
||||||
|
const answer2 = ref<string>("");
|
||||||
|
const answer3 = ref<number>(0);
|
||||||
|
|
||||||
|
const classBordered = ref<string>("");
|
||||||
|
|
||||||
|
/** ดึง ข้อมูลแบบสำรวจ */
|
||||||
|
async function getSurveyData() {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.get(config.API.summaryDetail())
|
||||||
|
.then(async (res: any) => {
|
||||||
|
const data = await res.data.result.data;
|
||||||
|
assignId.value = res.data.result.assignId;
|
||||||
|
if (data !== null) {
|
||||||
|
answer1.value = data.answer1;
|
||||||
|
answer2.value = data.answer2;
|
||||||
|
answer3.value = data.answer3;
|
||||||
|
status.value = false;
|
||||||
|
}
|
||||||
|
hideLoader();
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
messageError($q, e);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** save ข้อมูล */
|
||||||
|
async function save() {
|
||||||
|
if (answer3.value !== 0) {
|
||||||
|
const data = {
|
||||||
|
answer1: answer1.value,
|
||||||
|
answer2: answer2.value,
|
||||||
|
answer3: answer3.value,
|
||||||
|
};
|
||||||
|
dialogConfirm($q, async () => {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.post(config.API.summarySurveyDetail(assignId.value), data)
|
||||||
|
.then((res: any) => {
|
||||||
|
success($q, "บันทึกสำเร็จ");
|
||||||
|
getSurveyData();
|
||||||
|
})
|
||||||
|
.catch((e: any) => {
|
||||||
|
messageError($q, e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else if (answer3.value == 0) {
|
||||||
|
classBordered.value = "border_custom";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** ถ้าเป็น 0 ใส่ class */
|
||||||
|
watch(answer3, () => {
|
||||||
|
if (answer3.value == 0) {
|
||||||
|
classBordered.value = "border_custom";
|
||||||
|
} else classBordered.value = "";
|
||||||
|
});
|
||||||
|
|
||||||
|
/** get ค่า เมื่อโหลดหน้า */
|
||||||
|
onMounted(() => {
|
||||||
|
if (store.tabMain === "SURVEY") {
|
||||||
|
getSurveyData();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<q-form greedy @submit.prevent @validation-success="save()">
|
||||||
|
<q-card-section>
|
||||||
|
<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">
|
||||||
|
<q-input
|
||||||
|
:readonly="!status"
|
||||||
|
label="ความคิดเห็น"
|
||||||
|
class="bg-white"
|
||||||
|
dense
|
||||||
|
borderless
|
||||||
|
outlined
|
||||||
|
v-model="answer1"
|
||||||
|
type="textarea"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกความคิดเห็น'}`]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-12 row q-mt-md">
|
||||||
|
<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">
|
||||||
|
<q-input
|
||||||
|
:readonly="!status"
|
||||||
|
label="ความคิดเห็น"
|
||||||
|
class="bg-white"
|
||||||
|
dense
|
||||||
|
borderless
|
||||||
|
outlined
|
||||||
|
v-model="answer2"
|
||||||
|
type="textarea"
|
||||||
|
:rules="[(val: string) => !!val || `${'กรุณากรอกความคิดเห็น'}`]"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div :class="`col-12 row q-mt-md ${classBordered}`">
|
||||||
|
<div class="text-top0 items-center">
|
||||||
|
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
|
||||||
|
ความพึงพอใจกับการทดลองปฏิบัติหน้าที่ราชการของคุณอยู่ในระดับใด
|
||||||
|
</div>
|
||||||
|
<q-space />
|
||||||
|
<q-btn-group outline>
|
||||||
|
<q-btn
|
||||||
|
v-for="(item, index) in 5"
|
||||||
|
:disable="!status"
|
||||||
|
:class="answer3 == item && 'active'"
|
||||||
|
outline
|
||||||
|
color="grey-6"
|
||||||
|
:label="item"
|
||||||
|
@click="answer3 = item"
|
||||||
|
>
|
||||||
|
<q-tooltip>
|
||||||
|
<div class="text-body2">
|
||||||
|
<span>{{ optionText[index].label }}</span>
|
||||||
|
</div>
|
||||||
|
</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-btn-group>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 q-mt-md">
|
||||||
|
<q-separator size="3px" color="grey-2" />
|
||||||
|
</div>
|
||||||
|
<div class="col-12 row q-pb-sm">
|
||||||
|
<div class="col-12 text-top0 items-center q-pa-md">
|
||||||
|
เกณฑ์การประเมินความคาดหวัง
|
||||||
|
</div>
|
||||||
|
<div class="q-gutter-sm row">
|
||||||
|
<div class="col-12 row items-center">
|
||||||
|
<div class="col-2 row justify-center">
|
||||||
|
<q-btn outline color="grey-6" :label="'1'"> </q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="q-pl-md col-3">ต่ำกว่าความคาดหวังมาก</div>
|
||||||
|
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 1</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 row items-center">
|
||||||
|
<div class="col-2 row justify-center">
|
||||||
|
<q-btn outline color="grey-6" :label="'2'"> </q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="q-pl-md col-3">ต่ำกว่าความคาดหวังค่อนข้างมาก</div>
|
||||||
|
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 2</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 row items-center">
|
||||||
|
<div class="col-2 row justify-center">
|
||||||
|
<q-btn outline color="grey-6" :label="'3'"> </q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="q-pl-md col-3">เป็นไปตามความคาดหวัง</div>
|
||||||
|
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 3</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 row items-center">
|
||||||
|
<div class="col-2 row justify-center">
|
||||||
|
<q-btn outline color="grey-6" :label="'4'"> </q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="q-pl-md col-3">สูงว่าความคาดหวังค่อนข้างมาก</div>
|
||||||
|
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 4</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-12 row items-center">
|
||||||
|
<div class="col-2 row justify-center">
|
||||||
|
<q-btn outline color="grey-6" :label="'5'"> </q-btn>
|
||||||
|
</div>
|
||||||
|
<div class="q-pl-md col-3">สูงกว่าความคาดหวังมาก</div>
|
||||||
|
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 5</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</q-card-section>
|
||||||
|
<q-separator v-if="status" />
|
||||||
|
|
||||||
|
<q-card-actions align="right" v-if="status">
|
||||||
|
<q-btn label="บันทึก" color="secondary" type="submit"
|
||||||
|
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||||||
|
>
|
||||||
|
</q-card-actions>
|
||||||
|
</q-form>
|
||||||
|
</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;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border_custom {
|
||||||
|
border: 2px solid #c10015;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: #c10015;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.q-btn-group--outline > .q-btn-item:not(:last-child):before {
|
||||||
|
border-right: 1px solid #c4c4c4;
|
||||||
|
}
|
||||||
|
.q-btn-group--outline > .q-btn-item.active {
|
||||||
|
color: #2196f3 !important;
|
||||||
|
background-color: #cde6fb !important;
|
||||||
|
}
|
||||||
|
.q-btn-group--outline > .q-btn-item + .q-btn-item.active:before {
|
||||||
|
border-left: 1px solid #2196f3 !important;
|
||||||
|
background-color: #cde6fb;
|
||||||
|
}
|
||||||
|
.q-btn-group--outline > .q-btn-item.active:not(:last-child):before {
|
||||||
|
border: 1px solid #2196f3;
|
||||||
|
background-color: #cde6fb;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
475
src/modules/15_probationReport/components/02_ResultPage.vue
Normal file
475
src/modules/15_probationReport/components/02_ResultPage.vue
Normal file
|
|
@ -0,0 +1,475 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, reactive } from "vue";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
import http from "@/plugins/http";
|
||||||
|
import config from "@/app.config";
|
||||||
|
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
|
||||||
|
const { date2Thai, showLoader, hideLoader } = mixin;
|
||||||
|
const route = useRoute();
|
||||||
|
const assignId = ref<string>("baa3d9f6-9d21-4c58-85f2-114abf8de25c");
|
||||||
|
const status = ref<boolean>(false);
|
||||||
|
|
||||||
|
const develop_orientation_score = ref<number>();
|
||||||
|
const develop_self_learning_score = ref<number>();
|
||||||
|
const develop_training_seminar_score = ref<number>();
|
||||||
|
const develop_other_training_score = ref<number>();
|
||||||
|
const develop_total_score = ref<number>();
|
||||||
|
const develop_orientation_percent = ref<number>();
|
||||||
|
const develop_self_learning_percent = ref<number>();
|
||||||
|
const develop_training_seminar_percent = ref<number>();
|
||||||
|
const develop_other_training_percent = ref<number>();
|
||||||
|
const develop_total_percent = ref<number>();
|
||||||
|
const develop_result = ref<number>();
|
||||||
|
const achievement_score = ref<number>();
|
||||||
|
const achievement_score_total = ref<number>();
|
||||||
|
const achievement_percent = ref<number>();
|
||||||
|
const achievement_result = ref<number>();
|
||||||
|
const behavior_score = ref<number>();
|
||||||
|
const behavior_score_total = ref<number>();
|
||||||
|
const behavior_percent = ref<number>();
|
||||||
|
const behavior_result = ref<number>();
|
||||||
|
const sum_score = ref<number>();
|
||||||
|
const sum_percent = ref<number>();
|
||||||
|
const reason = ref<string>();
|
||||||
|
const pass_result = ref<number>();
|
||||||
|
const evaluate_date = ref<Date>();
|
||||||
|
const dev_options = reactive([
|
||||||
|
{ value: 1, label: "พัฒนาครบ 3 ส่วน" },
|
||||||
|
{ value: 2, label: "พัฒนาไม่ครบ 3 ส่วน" },
|
||||||
|
]);
|
||||||
|
const result_option = reactive([
|
||||||
|
{ name: "ไม่ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้รับราชการต่อ", value: 1 },
|
||||||
|
{ name: "ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้ออกจากราชการ", value: 2 },
|
||||||
|
{ name: "เห็นควรให้ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการต่อไปอีก", value: 3 },
|
||||||
|
]);
|
||||||
|
|
||||||
|
/** get คะแนน */
|
||||||
|
async function getReportScore() {
|
||||||
|
showLoader();
|
||||||
|
await http
|
||||||
|
.get(config.API.summaryReportDetail(assignId.value))
|
||||||
|
.then((res) => {
|
||||||
|
const data = res.data.result;
|
||||||
|
develop_orientation_score.value = data.develop_orientation_score;
|
||||||
|
develop_self_learning_score.value = data.develop_self_learning_score;
|
||||||
|
develop_training_seminar_score.value =
|
||||||
|
data.develop_training_seminar_score;
|
||||||
|
develop_other_training_score.value = data.develop_other_training_score;
|
||||||
|
develop_total_score.value = data.develop_total_score;
|
||||||
|
develop_orientation_percent.value = data.develop_orientation_percent;
|
||||||
|
develop_self_learning_percent.value = data.develop_self_learning_percent;
|
||||||
|
develop_training_seminar_percent.value =
|
||||||
|
data.develop_training_seminar_percent;
|
||||||
|
develop_other_training_percent.value =
|
||||||
|
data.develop_other_training_percent;
|
||||||
|
develop_total_percent.value = data.develop_total_percent;
|
||||||
|
develop_result.value = data.develop_result == 0 ? 2 : data.develop_result;
|
||||||
|
|
||||||
|
achievement_score.value = data.achievement_score;
|
||||||
|
achievement_score_total.value = data.achievement_score_total;
|
||||||
|
achievement_percent.value = data.achievement_percent;
|
||||||
|
achievement_result.value = data.achievement_result;
|
||||||
|
|
||||||
|
behavior_score.value = data.behavior_score;
|
||||||
|
behavior_score_total.value = data.behavior_score_total;
|
||||||
|
behavior_percent.value = data.behavior_percent;
|
||||||
|
behavior_result.value = data.behavior_result;
|
||||||
|
|
||||||
|
sum_score.value = data.sum_score;
|
||||||
|
sum_percent.value = data.sum_percent;
|
||||||
|
|
||||||
|
reason.value = data.reason;
|
||||||
|
pass_result.value = data.pass_result;
|
||||||
|
evaluate_date.value = data.evaluate_date;
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
hideLoader();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/** get ค่า เมื่อโหลดหน้า */
|
||||||
|
onMounted(() => {
|
||||||
|
getReportScore();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<template>
|
||||||
|
<div class="row col-12 q-ma-xs">
|
||||||
|
<div class="toptitle text-dark col-12 row items-center q-gutter-md">
|
||||||
|
<div>ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ</div>
|
||||||
|
</div>
|
||||||
|
<div class="row col-12 q-pt-lg q-px-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">1</q-avatar>
|
||||||
|
ผลการประเมิน
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<q-card class="text-top0 col-12">
|
||||||
|
<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. คะแนนผลสัมฤทธิ์การทดลองปฏิบัติหน้าที่ราชการ</q-item-label
|
||||||
|
>
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label style="color: gray">
|
||||||
|
<div class="row text-weight-light">
|
||||||
|
<div class="col">คะแนน</div>
|
||||||
|
<div class="col">ร้อยละ</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
|
||||||
|
<q-item-label caption style="color: #464444">
|
||||||
|
<div class="row text-weight-bold">
|
||||||
|
<div class="col">{{ achievement_score }}</div>
|
||||||
|
<div class="col">{{ achievement_percent }}</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
|
||||||
|
<q-item-section side v-if="achievement_result == 1">
|
||||||
|
ผ่าน (สูงกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section side v-else>
|
||||||
|
ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</q-list>
|
||||||
|
</q-card>
|
||||||
|
<q-card class="text-top0 col-12">
|
||||||
|
<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" />
|
||||||
|
2. คะแนนพฤติกรรมการปฏิบัติราชการ</q-item-label
|
||||||
|
>
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label style="color: gray">
|
||||||
|
<div class="row text-weight-light">
|
||||||
|
<div class="col">คะแนน</div>
|
||||||
|
<div class="col">ร้อยละ</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
<q-item-label caption style="color: #464444">
|
||||||
|
<div class="row text-weight-bold">
|
||||||
|
<div class="col">{{ behavior_score }}</div>
|
||||||
|
<div class="col">{{ behavior_percent }}</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
|
||||||
|
<q-item-section side v-if="behavior_result == 1">
|
||||||
|
ผ่าน (สูงกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section side v-else>
|
||||||
|
ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</q-list>
|
||||||
|
</q-card>
|
||||||
|
|
||||||
|
<q-card class="text-top0 col-12">
|
||||||
|
<q-list dense>
|
||||||
|
<q-item dense tag="label" v-ripple>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label class="text-black"
|
||||||
|
>ผลคะแนนรวมการประเมินการทดลอง</q-item-label
|
||||||
|
>
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section>
|
||||||
|
<q-item-label style="color: gray">
|
||||||
|
<div class="row text-weight-light">
|
||||||
|
<div class="col">คะแนน</div>
|
||||||
|
<div class="col">ร้อยละ</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
<q-item-label caption style="color: #464444">
|
||||||
|
<div class="row text-weight-bold">
|
||||||
|
<div class="col">{{ sum_score }}</div>
|
||||||
|
<div class="col">{{ sum_percent }}</div>
|
||||||
|
</div>
|
||||||
|
</q-item-label>
|
||||||
|
</q-item-section>
|
||||||
|
|
||||||
|
<q-item-section side v-if="pass_result == 1">
|
||||||
|
ผ่าน (สูงกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
<q-item-section side v-else>
|
||||||
|
ไม่ผ่าน (ต่ำกว่าร้อยละ 60)
|
||||||
|
</q-item-section>
|
||||||
|
</q-item>
|
||||||
|
</q-list>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
|
<div class="row col-12 q-pt-lg q-px-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">2</q-avatar>
|
||||||
|
การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ
|
||||||
|
</div>
|
||||||
|
<q-card
|
||||||
|
flat
|
||||||
|
bordered
|
||||||
|
class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
|
||||||
|
>
|
||||||
|
<div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
|
||||||
|
<div class="row q-gutter-md q-pl-md">
|
||||||
|
<div class="col-8 text-weight-medium">หัวข้อ</div>
|
||||||
|
<div class="col">คะแนน</div>
|
||||||
|
<div class="col">ร้อยละ</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<q-separator class="q-my-xs" />
|
||||||
|
<div class="row q-gutter-md align-center q-pl-md">
|
||||||
|
<div class="col-8">1. การปฐมนิเทศ</div>
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_orientation_score"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_orientation_percent"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-separator class="q-my-xs" />
|
||||||
|
<div class="row q-gutter-md align-center q-pl-md">
|
||||||
|
<div class="col-8">2. การเรียนรู้ด้วยตนเอง</div>
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
dense
|
||||||
|
outlined
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_self_learning_score"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_self_learning_percent"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-separator class="q-my-xs" />
|
||||||
|
<div class="row q-gutter-md align-center q-pl-md">
|
||||||
|
<div class="col-8">3. การอบรมสัมนาร่วมกัน</div>
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_training_seminar_score"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_training_seminar_percent"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<q-separator class="q-my-xs" />
|
||||||
|
<div class="row q-gutter-md align-center q-pl-md">
|
||||||
|
<div class="col-8">
|
||||||
|
4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)
|
||||||
|
</div>
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_other_training_score"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col">
|
||||||
|
<q-input
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
type="number"
|
||||||
|
:readonly="!status"
|
||||||
|
v-model="develop_other_training_percent"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<q-separator class="q-my-xs" />
|
||||||
|
<div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
|
||||||
|
<div class="row q-gutter-md q-pl-sm">
|
||||||
|
<div class="col-8 text-weight-medium">
|
||||||
|
<q-item-label
|
||||||
|
>คะแนนผลการพัฒนาข้าราชการที่อยู่ระหว่างการทดลองปฏิบัติหน้าที่ราชการ</q-item-label
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="col q-pl-md">{{ develop_total_score }}</div>
|
||||||
|
<div class="col q-pl-md">{{ develop_total_percent }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row col-12 q-gutter-lg q-mt-md">
|
||||||
|
<div class="col-xs-12 col-sm-6">
|
||||||
|
<div class="col-12 text-top0 items-center">
|
||||||
|
ผลการพัฒนาข้าราชการที่อยู่ระหว่างการทดลองปฏิบัติหน้าที่ราชการ
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-select
|
||||||
|
class="col-12"
|
||||||
|
dense
|
||||||
|
v-model="develop_result"
|
||||||
|
outlined
|
||||||
|
:options="dev_options"
|
||||||
|
option-label="label"
|
||||||
|
option-value="value"
|
||||||
|
map-options
|
||||||
|
emit-value
|
||||||
|
:readonly="!status"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-xs-12 col-sm-11">
|
||||||
|
<div class="col-12 text-top0 row items-center">
|
||||||
|
เหตุผลอื่น ๆ ในการพิจารณา
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
type="textarea"
|
||||||
|
outlined
|
||||||
|
dense
|
||||||
|
class="col-12"
|
||||||
|
v-model="reason"
|
||||||
|
lazy-rules
|
||||||
|
autogrow
|
||||||
|
hide-bottom-space
|
||||||
|
:row="3"
|
||||||
|
:readonly="!status"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-xs-12 col-sm-11">
|
||||||
|
<div class="col-12 row q-col-gutter-md">
|
||||||
|
<div class="col-xs-12 col-sm-6">
|
||||||
|
<div class="col-12 text-top0 items-center">
|
||||||
|
ผลการทดลองปฏิบัติหน้าที่ราชการ
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<q-select
|
||||||
|
class="col-12"
|
||||||
|
dense
|
||||||
|
v-model="pass_result"
|
||||||
|
outlined
|
||||||
|
:options="result_option"
|
||||||
|
option-label="name"
|
||||||
|
option-value="value"
|
||||||
|
map-options
|
||||||
|
emit-value
|
||||||
|
:readonly="!status"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-xs-12 col-sm-6">
|
||||||
|
<div class="col-12 text-top0 items-center">
|
||||||
|
วัน เดือน ปี ที่ประเมิน
|
||||||
|
</div>
|
||||||
|
<div class="col-12">
|
||||||
|
<datepicker
|
||||||
|
menu-class-name="modalfix"
|
||||||
|
v-model="evaluate_date"
|
||||||
|
:locale="'th'"
|
||||||
|
autoApply
|
||||||
|
:readonly="!status"
|
||||||
|
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
|
||||||
|
:readonly="!status"
|
||||||
|
class="full-width datepicker"
|
||||||
|
:model-value="
|
||||||
|
evaluate_date != null ? date2Thai(evaluate_date) : null
|
||||||
|
"
|
||||||
|
:rules="[(val:string) => !!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>
|
||||||
|
</div>
|
||||||
|
</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;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-txt {
|
||||||
|
color: black !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.q-card {
|
||||||
|
box-shadow: 0px 0px 0px 0px !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
8
src/modules/15_probationReport/store.ts
Normal file
8
src/modules/15_probationReport/store.ts
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
import { defineStore } from "pinia";
|
||||||
|
import { ref } from "vue";
|
||||||
|
import type { DataOption } from "@/modules/10_registry/interface/index/Main";
|
||||||
|
|
||||||
|
export const useProbationReport = defineStore("ProbationReportStore", () => {
|
||||||
|
const tabMain = ref<string>("SURVEY");
|
||||||
|
return { tabMain };
|
||||||
|
});
|
||||||
|
|
@ -1,99 +1,13 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onMounted, watch } from "vue";
|
import { useRouter } from "vue-router";
|
||||||
import { QForm, useQuasar } from "quasar";
|
|
||||||
import { useCounterMixin } from "@/stores/mixin";
|
|
||||||
import { useRoute, useRouter } from "vue-router";
|
|
||||||
|
|
||||||
import http from "@/plugins/http";
|
import { useProbationReport } from "@/modules/15_probationReport/store";
|
||||||
import config from "@/app.config";
|
|
||||||
|
|
||||||
import type { ListDataText } from "@/modules/15_probationReport/interface/Main";
|
import SurveyPage from "@/modules/15_probationReport/components/01_SurveyPage.vue";
|
||||||
|
import ResultPage from "@/modules/15_probationReport/components/02_ResultPage.vue";
|
||||||
|
|
||||||
|
const store = useProbationReport();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const optionText = ref<ListDataText[]>([
|
|
||||||
{ value: "1", label: "ต่ำกว่าความคาดหวังมาก (1)" },
|
|
||||||
{ value: "2", label: "ต่ำกว่าความคาดหวังค่อนข้างมาก (2)" },
|
|
||||||
{ value: "3", label: "เป็นไปตามความคาดหวัง (3)" },
|
|
||||||
{ value: "4", label: "สูงว่าความคาดหวังค่อนข้างมาก (4)" },
|
|
||||||
{ value: "5", label: "สูงกว่าความคาดหวังมาก (5)" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const $q = useQuasar();
|
|
||||||
const myForm = ref<QForm>();
|
|
||||||
const mixin = useCounterMixin();
|
|
||||||
|
|
||||||
const { messageError, success, dialogConfirm, showLoader, hideLoader } = mixin;
|
|
||||||
const route = useRoute();
|
|
||||||
|
|
||||||
const assignId = ref<string>("baa3d9f6-9d21-4c58-85f2-114abf8de25c");
|
|
||||||
const status = ref<boolean>(true);
|
|
||||||
|
|
||||||
const answer1 = ref<string>("");
|
|
||||||
const answer2 = ref<string>("");
|
|
||||||
const answer3 = ref<number>(0);
|
|
||||||
|
|
||||||
const classBordered = ref<string>("");
|
|
||||||
|
|
||||||
/** ดึง ข้อมูลแบบสำรวจ */
|
|
||||||
async function getSurveyData() {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.get(config.API.summaryDetail())
|
|
||||||
.then(async (res: any) => {
|
|
||||||
const data = await res.data.result.data;
|
|
||||||
assignId.value = res.data.result.assignId;
|
|
||||||
if (data !== null) {
|
|
||||||
answer1.value = data.answer1;
|
|
||||||
answer2.value = data.answer2;
|
|
||||||
answer3.value = data.answer3;
|
|
||||||
status.value = false;
|
|
||||||
}
|
|
||||||
hideLoader();
|
|
||||||
})
|
|
||||||
.catch((e) => {
|
|
||||||
messageError($q, e);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
/** save ข้อมูล */
|
|
||||||
async function save() {
|
|
||||||
if (answer3.value !== 0) {
|
|
||||||
const data = {
|
|
||||||
answer1: answer1.value,
|
|
||||||
answer2: answer2.value,
|
|
||||||
answer3: answer3.value,
|
|
||||||
};
|
|
||||||
dialogConfirm($q, async () => {
|
|
||||||
showLoader();
|
|
||||||
await http
|
|
||||||
.post(config.API.summarySurveyDetail(assignId.value), data)
|
|
||||||
.then((res: any) => {
|
|
||||||
success($q, "บันทึกสำเร็จ");
|
|
||||||
getSurveyData();
|
|
||||||
})
|
|
||||||
.catch((e: any) => {
|
|
||||||
messageError($q, e);
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
hideLoader();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
} else if (answer3.value == 0) {
|
|
||||||
classBordered.value = "border_custom";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/** ถ้าเป็น 0 ใส่ class */
|
|
||||||
watch(answer3, () => {
|
|
||||||
if (answer3.value == 0) {
|
|
||||||
classBordered.value = "border_custom";
|
|
||||||
} else classBordered.value = "";
|
|
||||||
});
|
|
||||||
|
|
||||||
/** get ค่า เมื่อโหลดหน้า */
|
|
||||||
onMounted(() => {
|
|
||||||
getSurveyData();
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="col-12 row justify-center">
|
<div class="col-12 row justify-center">
|
||||||
|
|
@ -113,175 +27,32 @@ onMounted(() => {
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<q-card bordered>
|
<q-card bordered>
|
||||||
<q-form greedy @submit.prevent @validation-success="save()">
|
<q-tabs
|
||||||
<q-card-section>
|
v-model="store.tabMain"
|
||||||
<div class="col-12 row">
|
inline-label
|
||||||
<div class="col-12 text-top0 items-center">
|
align="left"
|
||||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">1</q-avatar>
|
class="text-grey"
|
||||||
คุณคิดเห็นอย่างไรกับการทดลองปฏิบัติหน้าที่ราชการ?
|
active-color="primary"
|
||||||
</div>
|
indicator-color="primary"
|
||||||
<div class="col-12">
|
>
|
||||||
<q-input
|
<q-tab
|
||||||
:readonly="!status"
|
name="SURVEY"
|
||||||
label="ความคิดเห็น"
|
label="แบบสํารวจความคิดเห็น ด้านในแสดงหน้าปัจจุบัน"
|
||||||
class="bg-white"
|
/>
|
||||||
dense
|
<q-tab name="RESULT" label="ผลการประเมินการ" />
|
||||||
borderless
|
</q-tabs>
|
||||||
outlined
|
|
||||||
v-model="answer1"
|
|
||||||
type="textarea"
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกความคิดเห็น'}`]"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-12 row q-mt-md">
|
<q-separator />
|
||||||
<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">
|
|
||||||
<q-input
|
|
||||||
:readonly="!status"
|
|
||||||
label="ความคิดเห็น"
|
|
||||||
class="bg-white"
|
|
||||||
dense
|
|
||||||
borderless
|
|
||||||
outlined
|
|
||||||
v-model="answer2"
|
|
||||||
type="textarea"
|
|
||||||
:rules="[(val: string) => !!val || `${'กรุณากรอกความคิดเห็น'}`]"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div :class="`col-12 row q-mt-md ${classBordered}`">
|
<q-tab-panels v-model="store.tabMain" animated>
|
||||||
<div class="text-top0 items-center">
|
<q-tab-panel name="SURVEY" class="q-pa-none">
|
||||||
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
|
<SurveyPage
|
||||||
ความพึงพอใจกับการทดลองปฏิบัติหน้าที่ราชการของคุณอยู่ในระดับใด
|
/></q-tab-panel>
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
<q-btn-group outline>
|
|
||||||
<q-btn
|
|
||||||
v-for="(item, index) in 5"
|
|
||||||
:disable="!status"
|
|
||||||
:class="answer3 == item && 'active'"
|
|
||||||
outline
|
|
||||||
color="grey-6"
|
|
||||||
:label="item"
|
|
||||||
@click="answer3 = item"
|
|
||||||
>
|
|
||||||
<q-tooltip>
|
|
||||||
<div class="text-body2">
|
|
||||||
<span>{{ optionText[index].label }}</span>
|
|
||||||
</div>
|
|
||||||
</q-tooltip>
|
|
||||||
</q-btn>
|
|
||||||
</q-btn-group>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 q-mt-md">
|
|
||||||
<q-separator size="3px" color="grey-2" />
|
|
||||||
</div>
|
|
||||||
<div class="col-12 row q-pb-sm">
|
|
||||||
<div class="col-12 text-top0 items-center q-pa-md">
|
|
||||||
เกณฑ์การประเมินความคาดหวัง
|
|
||||||
</div>
|
|
||||||
<div class="q-gutter-sm row">
|
|
||||||
<div class="col-12 row items-center">
|
|
||||||
<div class="col-2 row justify-center">
|
|
||||||
<q-btn outline color="grey-6" :label="'1'"> </q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md col-3">ต่ำกว่าความคาดหวังมาก</div>
|
|
||||||
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 1</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 row items-center">
|
|
||||||
<div class="col-2 row justify-center">
|
|
||||||
<q-btn outline color="grey-6" :label="'2'"> </q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md col-3">
|
|
||||||
ต่ำกว่าความคาดหวังค่อนข้างมาก
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 2</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 row items-center">
|
|
||||||
<div class="col-2 row justify-center">
|
|
||||||
<q-btn outline color="grey-6" :label="'3'"> </q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md col-3">เป็นไปตามความคาดหวัง</div>
|
|
||||||
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 3</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 row items-center">
|
|
||||||
<div class="col-2 row justify-center">
|
|
||||||
<q-btn outline color="grey-6" :label="'4'"> </q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md col-3">
|
|
||||||
สูงว่าความคาดหวังค่อนข้างมาก
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 4</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 row items-center">
|
|
||||||
<div class="col-2 row justify-center">
|
|
||||||
<q-btn outline color="grey-6" :label="'5'"> </q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="q-pl-md col-3">สูงกว่าความคาดหวังมาก</div>
|
|
||||||
<div class="q-pl-md">หมายถึง มีคะแนนเฉลี่ยที่ระดับ 5</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
<q-separator v-if="status" />
|
|
||||||
|
|
||||||
<q-card-actions align="right" v-if="status">
|
<q-tab-panel name="RESULT"> <ResultPage /> </q-tab-panel>
|
||||||
<q-btn label="บันทึก" color="secondary" type="submit"
|
</q-tab-panels>
|
||||||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
|
||||||
>
|
|
||||||
</q-card-actions>
|
|
||||||
</q-form>
|
|
||||||
</q-card>
|
</q-card>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</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;
|
|
||||||
}
|
|
||||||
|
|
||||||
.border_custom {
|
|
||||||
border: 2px solid #c10015;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: #c10015;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
.q-btn-group--outline > .q-btn-item:not(:last-child):before {
|
|
||||||
border-right: 1px solid #c4c4c4;
|
|
||||||
}
|
|
||||||
.q-btn-group--outline > .q-btn-item.active {
|
|
||||||
color: #2196f3 !important;
|
|
||||||
background-color: #cde6fb !important;
|
|
||||||
}
|
|
||||||
.q-btn-group--outline > .q-btn-item + .q-btn-item.active:before {
|
|
||||||
border-left: 1px solid #2196f3 !important;
|
|
||||||
background-color: #cde6fb;
|
|
||||||
}
|
|
||||||
.q-btn-group--outline > .q-btn-item.active:not(:last-child):before {
|
|
||||||
border: 1px solid #2196f3;
|
|
||||||
background-color: #cde6fb;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue