สมรรถนะ: เพิ่มเกณฑ์การประเมิน+validation
This commit is contained in:
oat_dev
parent
7ca03dcdb0
commit
d97203c718
2 changed files with 155 additions and 153 deletions
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { ref, reactive } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
|
|
@ -21,8 +21,16 @@ const {
|
|||
success,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
const L1Editor = ref<string>("");
|
||||
const competencyName = ref<string>("");
|
||||
|
||||
const formData = reactive({
|
||||
competencyType: "",
|
||||
competencyName: "",
|
||||
definition: "",
|
||||
level1: "",
|
||||
level2: "",
|
||||
level3: "",
|
||||
evaluation: "",
|
||||
});
|
||||
async function onSubmit() {
|
||||
dialogConfirm($q, async () => {});
|
||||
}
|
||||
|
|
@ -32,12 +40,19 @@ async function onSubmit() {
|
|||
<div class="full-width">
|
||||
<q-form @submit.prevent greedy @validation-success="onSubmit()">
|
||||
<div class="col-12">
|
||||
<q-input outlined v-model="competencyName" dense label="ชื่อสมรรถนะ" />
|
||||
<q-input
|
||||
outlined
|
||||
v-model="formData.competencyName"
|
||||
dense
|
||||
label="ชื่อสมรรถนะ"
|
||||
hide-bottom-space
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`]"
|
||||
/>
|
||||
</div>
|
||||
<q-card-section class="col-12 q-px-none">
|
||||
<div>
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
v-model="formData.definition"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="7rem"
|
||||
placeholder="คำจำกัดความ"
|
||||
|
|
@ -83,34 +98,25 @@ async function onSubmit() {
|
|||
</span>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none col-6">
|
||||
<div class="q-py-md q-mr-md">
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
<div class="q-mr-md">
|
||||
<q-field
|
||||
ref="fieldRef"
|
||||
v-model="formData.level1"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอก L1 ระดับ หัวหน้าฝ่ายในสังกัด',
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
v-model="formData.level1"
|
||||
min-height="5rem"
|
||||
class="full-width"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</div>
|
||||
|
|
@ -121,34 +127,26 @@ async function onSubmit() {
|
|||
</span>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none col-6">
|
||||
<div class="q-py-md q-mr-md">
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
<div class="q-mr-md">
|
||||
<q-field
|
||||
ref="fieldRef"
|
||||
v-model="formData.level2"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || 'กรุณากรอก L2 ระดับ ผู้ช่วยผู้อำนวยการเขต',
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
v-model="formData.level2"
|
||||
min-height="5rem"
|
||||
class="full-width"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</div>
|
||||
|
|
@ -159,52 +157,51 @@ async function onSubmit() {
|
|||
</span>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none col-6">
|
||||
<div class="q-py-md q-mr-md">
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
<div class="q-mr-md">
|
||||
<q-field
|
||||
ref="fieldRef"
|
||||
v-model="formData.level3"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอก L3 ระดับ ผู้อำนวยการเขต',
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
v-model="formData.level3"
|
||||
min-height="5rem"
|
||||
class="full-width"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</div>
|
||||
</q-card>
|
||||
<div class="col-12 q-mt-md">
|
||||
<q-input
|
||||
v-model="formData.evaluation"
|
||||
label="กำหนดเกณฑ์การประเมิน"
|
||||
dense
|
||||
type="textarea"
|
||||
outlined
|
||||
/>
|
||||
</div>
|
||||
<q-separator color="grey-4" />
|
||||
<q-toolbar class="fit row wrap justify-end items-start content-start">
|
||||
<div class="col-12 row justify-end q-mt-md">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
type="submit"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { ref, reactive } from "vue";
|
||||
import type { QTableProps } from "quasar";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useQuasar } from "quasar";
|
||||
|
|
@ -21,8 +21,16 @@ const {
|
|||
success,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
const L1Editor = ref<string>("");
|
||||
const competencyName = ref<string>("");
|
||||
|
||||
const formData = reactive({
|
||||
competencyType: "",
|
||||
competencyName: "",
|
||||
definition: "",
|
||||
level1: "",
|
||||
level2: "",
|
||||
evaluation: "",
|
||||
});
|
||||
|
||||
async function onSubmit() {
|
||||
dialogConfirm($q, async () => {});
|
||||
}
|
||||
|
|
@ -32,12 +40,19 @@ async function onSubmit() {
|
|||
<div class="full-width">
|
||||
<q-form @submit.prevent greedy @validation-success="onSubmit()">
|
||||
<div class="col-12">
|
||||
<q-input outlined v-model="competencyName" dense label="ชื่อสมรรถนะ" />
|
||||
<q-input
|
||||
outlined
|
||||
v-model="formData.competencyName"
|
||||
dense
|
||||
hide-bottom-space
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกชื่อสมรรถนะ'}`]"
|
||||
label="ชื่อสมรรถนะ"
|
||||
/>
|
||||
</div>
|
||||
<q-card-section class="col-12 q-px-none">
|
||||
<div>
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
v-model="formData.definition"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="7rem"
|
||||
placeholder="คำจำกัดความ"
|
||||
|
|
@ -83,34 +98,25 @@ async function onSubmit() {
|
|||
</span>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none col-6">
|
||||
<div class="q-py-md q-mr-md">
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
<div class="q-mr-md">
|
||||
<q-field
|
||||
ref="fieldRef"
|
||||
v-model="formData.level1"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอก L1 ประเภทอำนวยการ ระดับสูง',
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
v-model="formData.level1"
|
||||
min-height="5rem"
|
||||
class="full-width"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</div>
|
||||
|
|
@ -121,52 +127,51 @@ async function onSubmit() {
|
|||
</span>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-none col-6">
|
||||
<div class="q-py-md q-mr-md">
|
||||
<q-editor
|
||||
v-model="L1Editor"
|
||||
:dense="$q.screen.lt.md"
|
||||
min-height="5rem"
|
||||
:toolbar="[
|
||||
[
|
||||
'bold',
|
||||
'italic',
|
||||
'strike',
|
||||
'underline',
|
||||
'subscript',
|
||||
'superscript',
|
||||
],
|
||||
|
||||
['unordered', 'ordered'],
|
||||
<div class="q-mr-md">
|
||||
<q-field
|
||||
ref="fieldRef"
|
||||
v-model="formData.level2"
|
||||
label-slot
|
||||
borderless
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอก L2 ประเภทบริหาร ระดับสูง',
|
||||
]"
|
||||
:fonts="{
|
||||
arial: 'Arial',
|
||||
arial_black: 'Arial Black',
|
||||
comic_sans: 'Comic Sans MS',
|
||||
courier_new: 'Courier New',
|
||||
impact: 'Impact',
|
||||
lucida_grande: 'Lucida Grande',
|
||||
times_new_roman: 'Times New Roman',
|
||||
verdana: 'Verdana',
|
||||
}"
|
||||
/>
|
||||
hide-bottom-space
|
||||
>
|
||||
<template #control>
|
||||
<q-editor
|
||||
v-model="formData.level2"
|
||||
min-height="5rem"
|
||||
class="full-width"
|
||||
/>
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</div>
|
||||
</q-card>
|
||||
<div class="col-12 q-mt-md">
|
||||
<q-input
|
||||
v-model="formData.evaluation"
|
||||
outlined
|
||||
label="กำหนดเกณฑ์การประเมิน"
|
||||
type="textarea"
|
||||
dense
|
||||
/>
|
||||
</div>
|
||||
<q-separator color="grey-4" />
|
||||
<q-toolbar class="fit row wrap justify-end items-start content-start">
|
||||
<div class="col-12 row justify-end q-mt-md">
|
||||
<q-btn
|
||||
dense
|
||||
unelevated
|
||||
label="บันทึก"
|
||||
id="onSubmit"
|
||||
type="submit"
|
||||
color="public"
|
||||
class="q-px-md"
|
||||
type="submit"
|
||||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</q-toolbar>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue