เพิ่ม ui form probation
This commit is contained in:
AnandaTon
parent
d3f119ae89
commit
eaead1fade
2 changed files with 660 additions and 0 deletions
648
src/modules/05_placement/components/probation/form.vue
Normal file
648
src/modules/05_placement/components/probation/form.vue
Normal file
|
|
@ -0,0 +1,648 @@
|
||||||
|
<!-- card ข้อมูลส่วนตัว -->
|
||||||
|
<template>
|
||||||
|
<q-toolbar class="q-pa-sm text-center">
|
||||||
|
<q-toolbar-title class="text-dark">
|
||||||
|
{{ "ฟอร์มแบบประเมินสำหรับผู้ดูแล" }}
|
||||||
|
</q-toolbar-title>
|
||||||
|
</q-toolbar>
|
||||||
|
{{
|
||||||
|
"วันเริ่มทดลองปฎิบัติหน้าที่ราชการ ตั้งแต่วันที่ " +
|
||||||
|
date2Thai(dateToday) +
|
||||||
|
" ถึงวันที่ " +
|
||||||
|
date2Thai(dateEnd)
|
||||||
|
}}
|
||||||
|
<q-space />
|
||||||
|
{{ "ครั้งที่" + period }}
|
||||||
|
{{
|
||||||
|
"ระหว่างวันที่ " +
|
||||||
|
date2Thai(dateToday) +
|
||||||
|
" ถึงวันที่ " +
|
||||||
|
date2Thai(dateEnd)
|
||||||
|
}}
|
||||||
|
<q-form @submit="onSubmit" @reset="onReset" class="q-gutter-md">
|
||||||
|
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md text-dark">
|
||||||
|
<div>
|
||||||
|
{{ "1. ผลสัมฤทธิ์ของการทดลองปฏิบัติบัติหน้าที่ราชการ" }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ "1.1 ความสำเร็จของงานที่ได้รับมอบหมาย" }}
|
||||||
|
</div>
|
||||||
|
<div class="q-gutter-y-md column" style="max-width: 650px">
|
||||||
|
<div>
|
||||||
|
{{ "1.1.1.ผลผลิตของงานที่คาดหวัง" }}
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text1_1"
|
||||||
|
label="ผลผลิตของงานที่คาดหวัง"
|
||||||
|
lazy-rules
|
||||||
|
autogrow
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>{{ "ระดับการประเมินพฤติกรรม" }}</div>
|
||||||
|
|
||||||
|
<q-rating
|
||||||
|
v-model="model"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ระดับการประเมินพฤติกรรม"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "1.1.2.ผลผลิตของงานที่เกิดขึ้น" }}
|
||||||
|
</div>
|
||||||
|
<div class="q-gutter-y-md column" style="max-width: 650px">
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text1_2"
|
||||||
|
label="ผลผลิตของงานที่เกิดขึ้น"
|
||||||
|
lazy-rules
|
||||||
|
autogrow
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>{{ "ระดับการประเมินพฤติกรรม" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ระดับการประเมินพฤติกรรม"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "1.2 ความรู้ความสามารถ" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1_2"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ความรู้ความสามารถ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "1. 3 ทักษะ" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1_3"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ทักษะ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "1.4 สมรรถนะ" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1_4"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="สมรรถนะ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "1.5 ความสามารถในการเรียนรู้งาน" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1_5"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ความสามารถในการเรียนรู้งาน"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "1.6 ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model1_6"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
<q-radio
|
||||||
|
checked-icon="task_alt"
|
||||||
|
unchecked-icon="panorama_fish_eye"
|
||||||
|
v-model="etc"
|
||||||
|
val="1"
|
||||||
|
label="1.7 อื่นๆ"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="q-gutter-y-md column" style="max-width: 650px">
|
||||||
|
<div>
|
||||||
|
{{ "จุดเด่น (ไม่เกิน 5 บรรทัด)" }}
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text2_1"
|
||||||
|
label="จุดเด่น (ไม่เกิน 5 บรรทัด)"
|
||||||
|
lazy-rules
|
||||||
|
autogrow
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)" }}
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text2_2"
|
||||||
|
autogrow
|
||||||
|
label="สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md text-dark">
|
||||||
|
<div>
|
||||||
|
{{ "2. พฤติกรรมของผู้ทดลองปฏิบัติบัติหน้าที่ราชการ" }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ "1.ความประพฤติ " }}
|
||||||
|
</div>
|
||||||
|
<div>{{ "ให้บริการประชาชนหรือผู้รับบริการด้วยอัธยาศัยดี" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model7"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ความสามารถในการปรับใช้ความรู้กับงานในหน้าที่"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>{{ "มีความรับผิดชอบในการปฏิบัติบัติงาน" }}</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model8"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="มีความรับผิดชอบในการปฏิบัติบัติงาน"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{
|
||||||
|
"ให้บริการประชาชนหรือผู้รับบริการด้วยความรวดเร็ว เอาใจใส่เป็นมาตรฐานเดียวกัน"
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model9"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ให้บริการประชาชนหรือผู้รับบริการด้วยความรวดเร็ว เอาใจใส่เป็นมาตรฐานเดียวกัน"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "ตั้งใจปฏิบัติบัติหน้าที่ราชการด้วยความอุตสาหะ ขยันยัหมั่นเพียร" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model10"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ตั้งใจปฏิบัติบัติหน้าที่ราชการด้วยความอุตสาหะ ขยันยัหมั่นเพียร"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "2.ความมีคุณธรรมจริยธรรม " }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ "อุทิศตนและเสียสละเวลาในการปฏิบัติบัติงานอย่างเต็มกำลังความสามารถ" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model11"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="อุทิศตนและเสียสละเวลาในการปฏิบัติบัติงานอย่างเต็มกำลังความสามารถ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "มีจิตสำนึกที่ดี ปฏิบัติบัติงานด้วยความซื่อสัตย์ สุจริต" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model12"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="มีจิตสำนึกที่ดี ปฏิบัติบัติงานด้วยความซื่อสัตย์ สุจริต"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{
|
||||||
|
"ยึดมั่นในสถาบันบัพระมหากษัตริย์ และไม่กระทำการใด ๆ อันจะก่อให้เกิดความเสียหายต่อประเทศชาติ"
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model13"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ยึดมั่นในสถาบันบัพระมหากษัตริย์ และไม่กระทำการใด ๆ อันจะก่อให้เกิดความเสียหายต่อประเทศชาติ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "3.การรักษาวินัย " }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ "มีความรับรัผิดชอบในการรักษาเวลาทำงาน" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model14"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="มีความรับรัผิดชอบในการรักษาเวลาทำงาน"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "แต่งกายในการปฏิบัติบัติงานได้อย่างเหมาะสมกับการเป็นข้าราชการ" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model15"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="แต่งกายในการปฏิบัติบัติงานได้อย่างเหมาะสมกับการเป็นข้าราชการ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{
|
||||||
|
"ไม่กระทำการใด ๆ อันอาจก่อให้เกิดความเสียหายแก่ชื่อเสียงของหน่วยงาน"
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model16"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ไม่กระทำการใด ๆ อันอาจก่อให้เกิดความเสียหายแก่ชื่อเสียงของหน่วยงาน"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{
|
||||||
|
"ไม่กระทำการใด ๆ อันเป็นการเสื่อมเกียรติและศักดิ์ศรีของความเป็นข้าราชการ"
|
||||||
|
}}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model17"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ไม่กระทำการใด ๆ อันเป็นการเสื่อมเกียรติและศักดิ์ศรีของความเป็นข้าราชการ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "ปฏิบัติบัติหน้าที่อย่างตรงไปตรงมาโดยยึกหลักจรรยาบรรณวิชาชีพ" }}
|
||||||
|
</div>
|
||||||
|
<q-rating
|
||||||
|
v-model="model18"
|
||||||
|
max="5"
|
||||||
|
size="3.5em"
|
||||||
|
label="ปฏิบัติบัติหน้าที่อย่างตรงไปตรงมาโดยยึกหลักจรรยาบรรณวิชาชีพ"
|
||||||
|
color="yellow"
|
||||||
|
icon="star_border"
|
||||||
|
icon-selected="star"
|
||||||
|
icon-half="star_half"
|
||||||
|
no-dimming
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
<q-radio
|
||||||
|
checked-icon="task_alt"
|
||||||
|
unchecked-icon="panorama_fish_eye"
|
||||||
|
v-model="etc_4"
|
||||||
|
val="0"
|
||||||
|
label="4. อื่นๆ"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<q-separator
|
||||||
|
vertical
|
||||||
|
color="grey-4"
|
||||||
|
size="2px"
|
||||||
|
class="q-mx-md"
|
||||||
|
v-if="etc == '1'"
|
||||||
|
/>
|
||||||
|
<div class="col-xs-6 col-sm-2 col-md-2" v-if="etc_4 == '1'">
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text_etc"
|
||||||
|
label="สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="q-gutter-y-md column" style="max-width: 650px">
|
||||||
|
<div>
|
||||||
|
{{ "จุดเด่น (ไม่เกิน 5 บรรทัด)" }}
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text3_1"
|
||||||
|
autogrow
|
||||||
|
label="จุดเด่น (ไม่เกิน 5 บรรทัด)"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
<div>
|
||||||
|
{{ "สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)" }}
|
||||||
|
</div>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
v-model="text3_2"
|
||||||
|
autogrow
|
||||||
|
label="สิ่งที่ควรปรับปรุง (ไม่เกิน 5 บรรทัด)"
|
||||||
|
lazy-rules
|
||||||
|
:rules="[(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md text-dark">
|
||||||
|
<div>
|
||||||
|
{{ "การพัฒนาผู้ทดลองปฏิบัติบัติหน้าที่ราชการ" }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ "1. การปฐมนิเทศ" }}
|
||||||
|
</div>
|
||||||
|
<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>
|
||||||
|
{{ "2. การเรียนรู้ด้วยตนเอง" }}
|
||||||
|
</div>
|
||||||
|
<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>
|
||||||
|
{{ "3. การอบรมสัมนาร่วมกัน" }}
|
||||||
|
</div>
|
||||||
|
<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>
|
||||||
|
{{ "4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด (ถ้ามี)" }}
|
||||||
|
</div>
|
||||||
|
<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=" ยังไม่ได้ดำเนินการ"
|
||||||
|
/>
|
||||||
|
</q-card>
|
||||||
|
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md text-dark">
|
||||||
|
<div>
|
||||||
|
{{ "เลือกผู้บังคับคับัญชา" }}
|
||||||
|
</div>
|
||||||
|
<q-select
|
||||||
|
filled
|
||||||
|
v-model="Autherise"
|
||||||
|
:options="option"
|
||||||
|
label="ผู้บังคับบัญชา"
|
||||||
|
style="width: 250px"
|
||||||
|
/>
|
||||||
|
<div class="col-xs-12 col-md-6">
|
||||||
|
<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"
|
||||||
|
: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>
|
||||||
|
</q-card>
|
||||||
|
<div>
|
||||||
|
<q-btn label="ส่งแบบประเมิน" type="submit" color="primary" />
|
||||||
|
<q-btn label="ยกเลิก" type="reset" color="primary" flat class="q-ml-sm" />
|
||||||
|
</div>
|
||||||
|
<q-space />
|
||||||
|
</q-form>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, watch } from "vue";
|
||||||
|
import { useCounterMixin } from "@/stores/mixin";
|
||||||
|
import { useDataStore } from "@/stores/data";
|
||||||
|
import { useRoute } from "vue-router";
|
||||||
|
import { useQuasar } from "quasar";
|
||||||
|
|
||||||
|
const $q = useQuasar();
|
||||||
|
const text1_1 = ref<any>(null);
|
||||||
|
const text1_2 = ref<any>(null);
|
||||||
|
const text2_1 = ref<any>(null);
|
||||||
|
const text2_2 = ref<any>(null);
|
||||||
|
|
||||||
|
const text3_1 = ref<any>(null);
|
||||||
|
const text3_2 = ref<any>(null);
|
||||||
|
const mixin = useCounterMixin();
|
||||||
|
const { date2Thai } = mixin;
|
||||||
|
const dataStore = useDataStore();
|
||||||
|
const route = useRoute();
|
||||||
|
const edit = ref<boolean>(true);
|
||||||
|
const dateToday = ref<Date>(new Date("10-10-2023"));
|
||||||
|
const dateEnd = ref<Date>(new Date("12-10-2023"));
|
||||||
|
const period = ref<number>(1);
|
||||||
|
const myform = ref<any>({});
|
||||||
|
const Autherise = ref<any>(null);
|
||||||
|
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 model7 = ref<any>(0);
|
||||||
|
const model8 = ref<any>(0);
|
||||||
|
const model9 = ref<any>(0);
|
||||||
|
const model10 = ref<any>(0);
|
||||||
|
const model11 = ref<any>(0);
|
||||||
|
const model12 = ref<any>(0);
|
||||||
|
const model13 = ref<any>(0);
|
||||||
|
const model14 = ref<any>(0);
|
||||||
|
const model15 = ref<any>(0);
|
||||||
|
const model16 = ref<any>(0);
|
||||||
|
const model17 = ref<any>(0);
|
||||||
|
const model18 = ref<any>(0);
|
||||||
|
const dateAutherise = ref<any>(new Date());
|
||||||
|
const etc = ref<any>(null);
|
||||||
|
const etc_4 = ref<any>(null);
|
||||||
|
const radio_1 = ref<any>(null);
|
||||||
|
const radio_2 = ref<any>(null);
|
||||||
|
const radio_3 = ref<any>(null);
|
||||||
|
const radio_4 = ref<any>(null);
|
||||||
|
const option = ref<any>(["นาย ภูริณัฐ บุญขาว", "นาย พงศกร วรารักษ์"]);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.modalfix {
|
||||||
|
position: fixed !important;
|
||||||
|
}
|
||||||
|
.containerimage {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.q-img {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
max-height: 170px;
|
||||||
|
padding: 1%;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: solid 2px rgba(168, 168, 168, 0.055) !important;
|
||||||
|
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.048), 0 3px 6px 0 rgba(0, 0, 0, 0.097);
|
||||||
|
}
|
||||||
|
|
||||||
|
.overlay {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgb(0, 0, 0);
|
||||||
|
background: rgba(0, 0, 0, 0.7);
|
||||||
|
color: #f1f1f1;
|
||||||
|
transition: 0.5s ease;
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
opacity: 0;
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 5% 0 5% 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.containerimage:hover .overlay {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.q-field__bottom {
|
||||||
|
padding: 5px 10px 0px 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="file"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.custom-file-upload {
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 6px 12px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -25,6 +25,8 @@ const mainProbation = () =>
|
||||||
|
|
||||||
const probationDetail = () =>
|
const probationDetail = () =>
|
||||||
import("@/modules/05_placement/components/probation/ProbationDetail.vue");
|
import("@/modules/05_placement/components/probation/ProbationDetail.vue");
|
||||||
|
const probationForm = () =>
|
||||||
|
import("@/modules/05_placement/components/probation/form.vue");
|
||||||
export default [
|
export default [
|
||||||
{
|
{
|
||||||
path: "/placement",
|
path: "/placement",
|
||||||
|
|
@ -106,4 +108,14 @@ export default [
|
||||||
Role: "placement",
|
Role: "placement",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/probation/form",
|
||||||
|
name: "probationForm",
|
||||||
|
component: probationForm,
|
||||||
|
meta: {
|
||||||
|
Auth: true,
|
||||||
|
Key: [6.3],
|
||||||
|
Role: "placement",
|
||||||
|
},
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue