เพิ่มแบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ
This commit is contained in:
Tanyalak
parent
d3f119ae89
commit
10395775e8
4 changed files with 283 additions and 9 deletions
259
src/modules/05_placement/components/probation/AddWork.vue
Normal file
259
src/modules/05_placement/components/probation/AddWork.vue
Normal file
|
|
@ -0,0 +1,259 @@
|
|||
<template>
|
||||
<div class="toptitle text-dark col-12 row items-center">
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
unelevated
|
||||
round
|
||||
dense
|
||||
flat
|
||||
color="primary"
|
||||
class="q-mr-sm"
|
||||
@click="router.go(-1)"
|
||||
/>
|
||||
แบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<q-card bordered class="row text-dark q-pa-lg">
|
||||
<div class="row col-12 q-gutter-lg">
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ผู้ทดลองปฏิบัติหน้าที่ราชการ
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input dense outlined v-model="name" label="ชื่อ-สกุล" />
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input dense outlined v-model="position" label="ตำแหน่ง" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ผู้ดูแลการทดลองปฏิบัติหน้าที่ราชการ (อาจมีได้มากกว่า 1 คน)
|
||||
<q-btn round color="primary" dense icon="mdi-plus" flat class="q-ml-sm" />
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select :options="OPcaretaker1" class="col-xs-12 col-sm-6" dense outlined v-model="caretaker" label="ผู้ดูแลคนที่ 1" />
|
||||
<q-select :options="OPcaretaker2" class="col-xs-12 col-sm-6" dense outlined v-model="caretaker2" label="ผู้ดูแลคนที่ 2" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-separator />
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-Hd">ผลการปฏิบัติงาน</div>
|
||||
<div class="col-12 text-top2 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ชื่องาน / ภารกิจงานที่มอบหมาย (ควรมีมากกว่า 1 ภารกิจงาน)
|
||||
<q-btn round color="primary" dense icon="mdi-plus" flat class="q-ml-sm" />
|
||||
</div>
|
||||
<div class="col-12 row q-gutter-md">
|
||||
<q-card flat bordered class="col-12 q-pa-sm bg-grey-1">
|
||||
<div class="col-12 row q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input class="bg-white" type="textarea" dense outlined v-model="activity1" label="กิจกรรมของงาน/ขั้นตอนการปฏิบัติงาน(ไม่เกิน10บรรทัด )" />
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input class="bg-white" type="textarea" dense outlined v-model="goal1" label="เป้าหมายในการปฏิบัติงาน(ไม่เกิน10บรรทัด )" />
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
<q-card flat bordered class="col-12 q-pa-sm bg-grey-1">
|
||||
<div class="col-12 row q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input class="bg-white" type="textarea" dense outlined v-model="activity2" label="กิจกรรมของงาน/ขั้นตอนการปฏิบัติงาน(ไม่เกิน10บรรทัด )" />
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input class="bg-white" type="textarea" dense outlined v-model="goal2" label="เป้าหมายในการปฏิบัติงาน(ไม่เกิน10บรรทัด )" />
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ความรู้ความสามารถและทักษะ(ตามที่ก.ก.กําหนด)
|
||||
<q-btn round color="primary" dense icon="mdi-plus" flat class="q-ml-sm" />
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select :options="OPknowledge" class="col-12" dense outlined v-model="knowledge" label="ความรู้ความสามารถในการปฏิบัติงาน 1" />
|
||||
<q-select :options="OPknowledge" class="col-12" dense outlined v-model="knowledge2" label="ความรู้ความสามารถในการปฏิบัติงาน 2" />
|
||||
<q-select :options="OPknowledge" class="col-12" dense outlined v-model="knowledge3" label="ความรู้ความสามารถในการปฏิบัติงาน 2" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 row items-center">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ความรู้เรื่องกฎหมายและกฎระเบียบ (ไม่เกิน 20 หัวข้อ)
|
||||
<q-btn round color="primary" dense icon="mdi-plus" flat class="q-ml-sm" />
|
||||
</div>
|
||||
<q-card flat bordered class="col-12 q-pa-md" style="max-height: 500px; overflow-y: scroll">
|
||||
<div class="col-12 row q-pb-sm" v-for="(lawl, index) in listlaw" :key="index" >
|
||||
<q-checkbox :val="lawl.id" dense v-model="law" :label="lawl.label" />
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
กฎหมายอื่น ๆ ที่เกี่ยวข้องกับการปฏิบัติงาน
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="col-12">
|
||||
<q-input dense outlined v-model="OtherLaw" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ทักษะ
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select :options="OPskill" class="col-xs-12 col-sm-6" dense outlined v-model="skill" label="ด้านที่ 1" />
|
||||
<q-select :options="OPskill" class="col-xs-12 col-sm-6" dense outlined v-model="skill2" label="ด้านที่ 2" />
|
||||
<q-select :options="OPskill" class="col-xs-12 col-sm-6" dense outlined v-model="skill3" label="ด้านที่ 3" />
|
||||
<q-select :options="OPskill" class="col-xs-12 col-sm-6" dense outlined v-model="skill4" label="ด้านที่ 4" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 ">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
สมรรถนะหลัก
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select :options="OPmain" class="col-xs-12 col-sm-6" dense outlined v-model="main" label="ตัวที่ 1" />
|
||||
<q-select :options="OPmain" class="col-xs-12 col-sm-6" dense outlined v-model="main2" label="ตัวที่ 2" />
|
||||
<q-select :options="OPmain" class="col-xs-12 col-sm-6" dense outlined v-model="main3" label="ตัวที่ 3" />
|
||||
<q-select :options="OPmain" class="col-xs-12 col-sm-6" dense outlined v-model="main4" label="ตัวที่ 4" />
|
||||
<q-select :options="OPmain" class="col-xs-12 col-sm-6" dense outlined v-model="main5" label="ตัวที่ 4" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 ">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
สมรรถนะประจํากลุ่มงาน
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<q-select :options="OPgroup" class="col-xs-12 col-sm-6" dense outlined v-model="group" label="ตัวที่ 1" />
|
||||
<q-select :options="OPgroup" class="col-xs-12 col-sm-6" dense outlined v-model="group2" label="ตัวที่ 2" />
|
||||
<q-select :options="OPgroup" class="col-xs-12 col-sm-6" dense outlined v-model="group3" label="ตัวที่ 3" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2">พฤติกรรมที่จําเป็นสําหรับการปฏิบัติงาน</div>
|
||||
(ได้แก่ ความประพฤติ ความมีคุณธรรมจริยธรรม การรักษาวินัย )
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 ">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ความประพฤติ ได้แก่
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="col-12 column q-ml-lg">
|
||||
<li>ให้บริการประชาชนหรือผู้รับบริการด้วยอธัยาศัยดี</li>
|
||||
<li>มีความรับผิดชอบในการปฏิบัติงาน</li>
|
||||
<li>ให้บริการประชาชนหรือผู้รับบริการด้วยความรวดเร็ว เอาใจใส่เป็นมาตรฐานเดียวกัน</li>
|
||||
<li>ตั้งใจปฏิบัติหน้าที่ราชการด้วยความอุตสาหะ ขยันหมั่นเพียร</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 ">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
ความมีคุณธรรมจริยธรรม ได้แก่
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="col-12 column q-ml-lg">
|
||||
<li>อุทิศตนและเสียสละเวลาในการปฏิบัติงานอย่างเต็มกำลังความสามารถ</li>
|
||||
<li>มีจิตสำนึกที่ดี ปฏิบัติงานด้วยความซื่อสัตย์ สุจริต</li>
|
||||
<li>ยึดมั่นในสถาบันพระมหากษัตริย์ และไม่กระทำการใด ๆ อันจะก่อให้เกิดความเสียหายต่อประเทศชาติ ศาสนา และพระมหากษัตริย์</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-12 text-top2 ">
|
||||
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
|
||||
การรักษาวินัย ได้แก่
|
||||
</div>
|
||||
<div class="col-12 row q-col-gutter-md">
|
||||
<div class="col-12 column q-ml-lg">
|
||||
<li>มีความรับผิดชอบในการรักษาเวลาทำงาน</li>
|
||||
<li>แต่งกายในการปฏิบัติงานได้อย่างเหมาะสมกับการเป็นข้าราชการ</li>
|
||||
<li>ไม่กระทำการใด ๆ อันเป็นการเสื่อมเกียรติและศักดิ์ศรีของความเป็นข้าราชการ</li>
|
||||
<li>ไม่กระทำการใด ๆ อันอาจก่อให้เกิดความเสียหายแก่ชื่อเสียงของหน่วยงาน</li>
|
||||
<li>ปฏิบัติหน้าที่อย่างตรงไปตรงมาโดยยึกหลักจรรยาบรรณวิชาชีพ</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router";
|
||||
const router = useRouter();
|
||||
import { ref } from "vue";
|
||||
import type OtherVue from "@/modules/04_registry/components/Other.vue";
|
||||
|
||||
const name = ref<string>('นายสมคิด ยอดใจ');
|
||||
const position = ref<string>('นักจัดการงานทั่วไป');
|
||||
|
||||
const caretaker = ref<string>('นางสาวรัชภรณ์ ภักดี');
|
||||
const caretaker2 = ref<string>('');
|
||||
const OPcaretaker1 = ['นางสาวรัชภรณ์ ภักดี','นางสาวทวิดา กมลเวชชี'];
|
||||
const OPcaretaker2 = ['นางสาวรัชภรณ์ ภักดี','นางสาวทวิดา กมลเวชชี'];
|
||||
|
||||
const activity1 = ref<string>('');
|
||||
const goal1 = ref<string>('');
|
||||
const activity2 = ref<string>('');
|
||||
const goal2 = ref<string>('');
|
||||
|
||||
const knowledge = ref<string>('');
|
||||
const knowledge2 = ref<string>('');
|
||||
const knowledge3 = ref<string>('');
|
||||
const OPknowledge = ['',''];
|
||||
|
||||
const law = ref([]);
|
||||
const listlaw = [
|
||||
{ id: 1, label: 'ความรู้เรื่องกฎหมายและกฎระเบียบ 1' },
|
||||
{ id: 2, label: 'ความรู้เรื่องกฎหมายและกฎระเบียบ 2' },
|
||||
{ id: 3, label: 'ความรู้เรื่องกฎหมายและกฎระเบียบ 3' },
|
||||
{ id: 4, label: 'ความรู้เรื่องกฎหมายและกฎระเบียบ 4' },
|
||||
{ id: 5, label: 'ความรู้เรื่องกฎหมายและกฎระเบียบ 5' }
|
||||
];
|
||||
const OtherLaw = ref<string>('');
|
||||
|
||||
const skill = ref<string>('ความรู้ความสามารถด้าน 1');
|
||||
const skill2 = ref<string>('ความรู้ความสามารถด้าน 2');
|
||||
const skill3 = ref<string>('ความรู้ความสามารถด้าน 3');
|
||||
const skill4 = ref<string>('ความรู้ความสามารถด้าน 4');
|
||||
const OPskill = [''];
|
||||
|
||||
const main = ref<string>('คุณธรรมจริยธรรม')
|
||||
const main2 = ref<string>('การให้บริการที่ดี')
|
||||
const main3 = ref<string>('การมุ่งผลสัมฤทธิ์')
|
||||
const main4 = ref<string>('ทํางานเป็นทีม')
|
||||
const main5 = ref<string>('การส่ังสมความเชี่ยวชาญในอาชีพ')
|
||||
const OPmain = [''];
|
||||
|
||||
const group = ref<string>('')
|
||||
const group2 = ref<string>('')
|
||||
const group3 = ref<string>('')
|
||||
const OPgroup = [''];
|
||||
</script>
|
||||
<style lang="scss" scope>
|
||||
.text-top2{
|
||||
font-weight: 600;
|
||||
padding-bottom: 8px;
|
||||
color: rgb(70, 68, 68);
|
||||
}
|
||||
.text-Hd{
|
||||
font-weight: 600;
|
||||
font-size: 1rem;
|
||||
padding-bottom: 5px;
|
||||
color: #02A998;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
<div v-if="col.name == 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'status'">
|
||||
<!-- <div v-else-if="col.name == 'status'">
|
||||
<q-icon size="20px" v-if="props.row.status == 'อยู่ระหว่างการทดลองงาน'" name="mdi-timer-sand" color="deep-orange">
|
||||
<q-tooltip>อยู่ระหว่างการทดลองงาน</q-tooltip>
|
||||
</q-icon>
|
||||
|
|
@ -91,7 +91,7 @@
|
|||
<q-icon size="20px" v-else name="mdi-check" color="teal">
|
||||
<q-tooltip>ผ่านการทดลองงาน</q-tooltip>
|
||||
</q-icon>
|
||||
</div>
|
||||
</div> -->
|
||||
<div v-else>
|
||||
{{ col.value }}
|
||||
</div>
|
||||
|
|
@ -308,7 +308,7 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
{
|
||||
name: "status",
|
||||
align: "center",
|
||||
align: "left",
|
||||
label: "สถานะทดลองงาน",
|
||||
sortable: true,
|
||||
field: "status",
|
||||
|
|
|
|||
|
|
@ -61,16 +61,11 @@
|
|||
<div class="row q-col-gutter-sm">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div>
|
||||
<q-btn @click="clickAdd()" size="12px" flat round color="add" icon="mdi-plus">
|
||||
<q-btn @click="router.push(`/probation/work/add`)" size="12px" flat round color="add" icon="mdi-plus">
|
||||
<q-tooltip>เพิ่มงานที่ได้รับมอบหมาย</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<q-space />
|
||||
<div>
|
||||
<q-btn flat round color="blue" icon="mdi-file-download-outline">
|
||||
<q-tooltip> ดาวน์โหลด .Docx</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<q-input
|
||||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
standout
|
||||
|
|
@ -130,6 +125,7 @@
|
|||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th auto-width />
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
|
|
@ -146,6 +142,11 @@
|
|||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
<q-td auto-width>
|
||||
<q-btn flat dense size="12px" round color="blue" icon="mdi-file-download-outline">
|
||||
<q-tooltip> ดาวน์โหลด .Docx</q-tooltip>
|
||||
</q-btn>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:pagination="scope">
|
||||
|
|
|
|||
|
|
@ -25,6 +25,10 @@ const mainProbation = () =>
|
|||
|
||||
const probationDetail = () =>
|
||||
import("@/modules/05_placement/components/probation/ProbationDetail.vue");
|
||||
|
||||
const probationWorkAdd = () =>
|
||||
import("@/modules/05_placement/components/probation/AddWork.vue");
|
||||
|
||||
export default [
|
||||
{
|
||||
path: "/placement",
|
||||
|
|
@ -106,4 +110,14 @@ export default [
|
|||
Role: "placement",
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/probation/work/add",
|
||||
name: "probationWorkAdd",
|
||||
component: probationWorkAdd,
|
||||
meta: {
|
||||
Auth: true,
|
||||
Key: [6.3],
|
||||
Role: "placement",
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue