ปรับ ui ประเมิน step 1-5

This commit is contained in:
Tanyalak 2024-01-18 11:02:23 +07:00
parent 915df2cc92
commit 814c25d81a
13 changed files with 631 additions and 576 deletions

View file

@ -58,120 +58,128 @@ onMounted(async () => {
</script>
<template>
<div class="row q-col-gutter-md">
<!-- ผลงาน -->
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">ผลงาน</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
readonly
dense
class="col-xs-12 col-sm-6"
outlined
label="ชื่อผลงาน"
v-model="subject"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
lazy-rules
/>
<q-input
readonly
class="col-xs-12 col-sm-6"
dense
outlined
v-model="author"
label="เจ้าของผลงาน"
:rules="[(val) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
lazy-rules
/>
<div class="q-pa-sm col-12">
<div class="row q-col-gutter-sm">
<!-- ผลงาน -->
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">ผลงาน</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-sm col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="row col-12 q-col-gutter-sm">
<q-input
readonly
dense
class="col-xs-12 col-sm-6"
outlined
label="ชื่อผลงาน"
v-model="subject"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
lazy-rules
hide-bottom-space
/>
<q-input
readonly
class="col-xs-12 col-sm-6"
dense
outlined
v-model="author"
label="เจ้าของผลงาน"
:rules="[(val) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</div>
</div>
</div>
</div>
</div>
</q-card>
</div>
</q-card>
</div>
<!-- เลอกผเซนเอกสาร -->
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
เลอกผเซนเอกสาร
</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="text-weight-medium q-py-sm">
งคบบญชาชนต
</div>
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
readonly
ref="elementaryFullNameRef"
dense
class="col-xs-12 col-sm-6"
outlined
label="ชื่อ-นามสกุล"
v-model="formCommand.elementaryFullName"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
lazy-rules
/>
<q-input
readonly
ref="elementaryPositonRef"
class="col-xs-12 col-sm-6"
dense
outlined
v-model="formCommand.elementaryPosition"
label="ตำแหน่ง"
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
lazy-rules
/>
<!-- เลอกผเซนเอกสาร -->
<div class="col-12">
<q-card bordered style="border: 1px solid #d6dee1">
<div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
เลอกผเซนเอกสาร
</div>
<div class="col-12"><q-separator /></div>
<div class="row">
<div class="col-12 q-pa-sm">
<div class="row q-col-gutter-sm col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="text-weight-medium q-pt-xs q-pl-sm">
งคบบญชาชนต
</div>
<div class="row col-12 q-col-gutter-sm q-pa-sm">
<q-input
readonly
ref="elementaryFullNameRef"
dense
class="col-xs-12 col-sm-6"
outlined
label="ชื่อ-นามสกุล"
v-model="formCommand.elementaryFullName"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
lazy-rules
hide-bottom-space
/>
<q-input
readonly
ref="elementaryPositonRef"
class="col-xs-12 col-sm-6"
dense
outlined
v-model="formCommand.elementaryPosition"
label="ตำแหน่ง"
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</div>
</div>
</div>
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="text-weight-medium q-py-sm">
งคบบญชาเหนอขนไป 1 ระด
</div>
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
readonly
ref="abovelevelFullnameRef"
dense
class="col-xs-12 col-sm-6"
outlined
v-model="formCommand.abovelevelFullname"
label="ชื่อ-นามสกุล"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
lazy-rules
/>
<q-input
ref="abovelevelPositionRef"
class="col-xs-12 col-sm-6"
dense
readonly
outlined
v-model="formCommand.abovelevelPosition"
label="ตำแหน่ง"
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
lazy-rules
/>
<div class="row q-col-gutter-sm col-12">
<div class="col-xs-12 col-sm-12 row">
<div class="text-weight-medium q-pl-sm q-pt-sm">
งคบบญชาเหนอขนไป 1 ระด
</div>
<div class="row col-12 q-col-gutter-md q-pa-sm">
<q-input
readonly
ref="abovelevelFullnameRef"
dense
class="col-xs-12 col-sm-6"
outlined
v-model="formCommand.abovelevelFullname"
label="ชื่อ-นามสกุล"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
lazy-rules
hide-bottom-space
/>
<q-input
ref="abovelevelPositionRef"
class="col-xs-12 col-sm-6"
dense
readonly
outlined
v-model="formCommand.abovelevelPosition"
label="ตำแหน่ง"
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
lazy-rules
hide-bottom-space
/>
</div>
</div>
</div>
</div>
</div>
</div>
</q-card>
</q-card>
</div>
</div>
</div>
</template>