ปรับ css เพิ่มเติม
This commit is contained in:
Tanyalak
parent
3a8ecb9d82
commit
72d5720c0a
5 changed files with 112 additions and 112 deletions
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="q-px-md q-pb-md">
|
||||
<div class="col-12 row q-py-sm items-center">
|
||||
<div class="col-12 row q-py-sm q-gutter-sm items-center">
|
||||
<span class="text-subtitle1">{{ titleText }}</span>
|
||||
<q-select
|
||||
dense
|
||||
|
|
@ -23,7 +23,6 @@
|
|||
use-chips
|
||||
multiple
|
||||
v-if="statusPayment"
|
||||
class="q-pl-sm"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" color="blue" />
|
||||
|
|
|
|||
|
|
@ -21,18 +21,19 @@
|
|||
<q-card flat bordered class="col-12 q-my-sm q-pt-sm">
|
||||
<q-form ref="myForm">
|
||||
<q-card-section class="q-pa-md">
|
||||
<div class="col-xs-12 col-sm-8 items-top q-pb-md">
|
||||
<div class="col-xs-12 col-sm-8 items-top q-pb-md" v-if="!edit">
|
||||
<q-toggle
|
||||
v-model="announcementExam"
|
||||
:false-value="true"
|
||||
:true-value="false"
|
||||
color="primary"
|
||||
dense
|
||||
class="text-weight-medium text-dark"
|
||||
label="ประกาศข่าวทั่วไป"
|
||||
v-if="!edit"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-12 row items-top q-col-gutter-x-sm">
|
||||
<div class="col-xs-12 col-sm-6 col-sm-5">
|
||||
<div class="col-xs-12 col-sm-6 col-sm-8">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="name"
|
||||
|
|
@ -69,7 +70,7 @@
|
|||
]"
|
||||
></q-input>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-4 col-md-1" v-if="announcementExam">
|
||||
<div class="col-xs-12 col-sm-4 col-md-2" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="yearly"
|
||||
|
|
@ -104,45 +105,7 @@
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateExam"
|
||||
: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 q-mb-md"
|
||||
:model-value="dateExam != null ? date2Thai(dateExam) : null"
|
||||
:label="`${'วันที่สอบ'}`"
|
||||
clearable
|
||||
@clear="clearDateExam"
|
||||
>
|
||||
<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 class="col-xs-12 col-sm-3 col-md-3">
|
||||
<div class="col-xs-12 col-sm-3 col-md-4">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateAnnouncement"
|
||||
|
|
@ -163,7 +126,7 @@
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker "
|
||||
:model-value="dateThaiRange(dateAnnouncement)"
|
||||
:label="`${'วันที่ประกาศ'}`"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่ประกาศ'}`]"
|
||||
|
|
@ -180,7 +143,7 @@
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<div class="col-xs-12 col-sm-3 col-md-4" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateRegister"
|
||||
|
|
@ -202,7 +165,7 @@
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker "
|
||||
:model-value="dateThaiRange(dateRegister)"
|
||||
:label="`${'วันที่สมัคร'}`"
|
||||
clearable
|
||||
|
|
@ -220,7 +183,7 @@
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<div class="col-xs-12 col-sm-3 col-md-4" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="datePayment"
|
||||
|
|
@ -241,7 +204,7 @@
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker "
|
||||
:model-value="dateThaiRange(datePayment)"
|
||||
:label="`${'วันที่ชำระเงิน'}`"
|
||||
clearable
|
||||
|
|
@ -259,7 +222,7 @@
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateAnnounce"
|
||||
|
|
@ -279,7 +242,7 @@
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker "
|
||||
:model-value="
|
||||
dateAnnounce != null ? date2Thai(dateAnnounce) : null
|
||||
"
|
||||
|
|
@ -299,7 +262,45 @@
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="announcementExam">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="dateExam"
|
||||
: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="dateExam != null ? date2Thai(dateExam) : null"
|
||||
:label="`${'วันที่สอบ'}`"
|
||||
clearable
|
||||
@clear="clearDateExam"
|
||||
>
|
||||
<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 class="col-xs-12 col-sm-6 col-md-6">
|
||||
<selector
|
||||
outlined
|
||||
v-model="category"
|
||||
|
|
@ -315,43 +316,41 @@
|
|||
:rules="[(val:any) => !!val || `${'กรุณาเลือกสังกัด'}`]"
|
||||
></selector>
|
||||
</div>
|
||||
<div class="col-12" v-if="announcementExam">
|
||||
<div class="row q-col-gutter-x-sm">
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<selector
|
||||
outlined
|
||||
v-model="organizationShortName"
|
||||
:options="governmentCodeOption"
|
||||
label="รหัสส่วนราชการ"
|
||||
clearable
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
dense
|
||||
lazy-rules
|
||||
:rules="[(val:any) => !!val || `${'กรุณาเลือกรหัสส่วนราชการ'}`]"
|
||||
@update:model-value="(value:any) => selectGovernmentCode(value)"
|
||||
></selector>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<selector
|
||||
outlined
|
||||
v-model="organizationName"
|
||||
:options="organizationNameOptions"
|
||||
label="หน่วยงาน"
|
||||
clearable
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
dense
|
||||
lazy-rules
|
||||
:rules="[(val:any) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]"
|
||||
@update:model-value="(value:any) => selectOrganization(value)"
|
||||
></selector>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 q-mb-sm">
|
||||
<q-separator size="5px" color="grey-2" />
|
||||
</div>
|
||||
<q-form ref="myFormPosition">
|
||||
<div class="col-xs-12 col-sm-4 col-md-2" v-if="announcementExam">
|
||||
<selector
|
||||
outlined
|
||||
v-model="organizationShortName"
|
||||
:options="governmentCodeOption"
|
||||
label="รหัสส่วนราชการ"
|
||||
clearable
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
dense
|
||||
lazy-rules
|
||||
:rules="[(val:any) => !!val || `${'กรุณาเลือกรหัสส่วนราชการ'}`]"
|
||||
@update:model-value="(value:any) => selectGovernmentCode(value)"
|
||||
></selector>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 col-md-6" v-if="announcementExam">
|
||||
<selector
|
||||
outlined
|
||||
v-model="organizationName"
|
||||
:options="organizationNameOptions"
|
||||
label="หน่วยงาน"
|
||||
clearable
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
dense
|
||||
lazy-rules
|
||||
:rules="[(val:any) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]"
|
||||
@update:model-value="(value:any) => selectOrganization(value)"
|
||||
></selector>
|
||||
</div>
|
||||
<div class="col-12 q-mb-sm">
|
||||
<q-separator size="5px" color="grey-2" />
|
||||
</div>
|
||||
<div class="col-12 row" v-if="announcementExam">
|
||||
<q-form ref="myFormPosition" class="col-12">
|
||||
<ProfileTable
|
||||
:rows="rowsPosition"
|
||||
:columns="columnsPosition"
|
||||
|
|
@ -473,7 +472,7 @@
|
|||
<div class="text-bold text-subtitle2 q-pb-md">
|
||||
เลือกวีธีการชำระเงิน
|
||||
</div>
|
||||
<div class="row col-12 q-gutter-y-md q-mb-md">
|
||||
<div class="row col-12 q-gutter-y-md ">
|
||||
<q-list dense bordered class="col-12 rounded-borders">
|
||||
<q-item tag="label" v-ripple class="q-pa-md">
|
||||
<q-radio
|
||||
|
|
|
|||
|
|
@ -34,13 +34,13 @@
|
|||
<q-slide-transition>
|
||||
<q-card class="row col-12 q-mb-sm" v-show="visible">
|
||||
<div class="col-12 row">
|
||||
<div class="q-py-md row col-12 no-wrap">
|
||||
<div class="q-pb-md q-pt-sm row col-12 no-wrap">
|
||||
<!-- การ์ดแสดงจำนวนข้อมูล -->
|
||||
<div class="col-12 row">
|
||||
<div class="text-grey-7 row text-weight-medium col-12 q-pl-md">
|
||||
สรุปจำนวนผู้สมัครคัดเลือก
|
||||
<div class="col-12 row q-px-md ">
|
||||
<div class="row items-center col-12 q-gutter-sm q-pb-sm">
|
||||
<div class="text-weight-medium">สรุปจำนวนผู้สมัครคัดเลือก</div>
|
||||
<datepicker
|
||||
class="q-pl-sm"
|
||||
class="col-xs-12 col-sm-5 col-md-4"
|
||||
v-model="dateFilter"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
|
|
@ -58,9 +58,9 @@
|
|||
<q-input
|
||||
class="full-width inputgreen cursor-pointer"
|
||||
hide-bottom-space
|
||||
outlined
|
||||
dense
|
||||
label="วันที่"
|
||||
prefix="วันที่"
|
||||
borderless
|
||||
lazy-rules
|
||||
:model-value="dateThaiRange(dateFilter)"
|
||||
>
|
||||
|
|
@ -75,8 +75,10 @@
|
|||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
<q-space />
|
||||
<q-btn
|
||||
size="md"
|
||||
dense
|
||||
icon="mdi-download"
|
||||
round
|
||||
flat
|
||||
|
|
@ -110,7 +112,7 @@
|
|||
<q-tooltip>ดาวน์โหลดรายชื่อผู้สอบแข่งขันได้</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div class="row col-12 q-col-gutter-md fit q-pa-md">
|
||||
<div class="row col-12 q-col-gutter-md">
|
||||
<div
|
||||
style="width: 25%"
|
||||
v-for="(num, index) in dataNum"
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="col-12 row">
|
||||
<div class="row col-12" style="padding-top: 80px">
|
||||
<div id="information" name="1" class="row col-12 information">
|
||||
<div id="information" name="1" class="row col-12 information q-mt-sm">
|
||||
<!-- <Informationvue
|
||||
v-model:statusEdit="statusEdit"
|
||||
:profileType="profileType"
|
||||
|
|
@ -11,16 +11,16 @@
|
|||
:fetchDataProfile="fetchData"
|
||||
/>
|
||||
</div>
|
||||
<div id="government" name="16" class="row col-12 q-mt-md">
|
||||
<div id="government" name="16" class="row col-12">
|
||||
<Government v-model:statusEdit="statusEdit" />
|
||||
</div>
|
||||
<div id="address" name="17" class="row col-12 q-mt-md">
|
||||
<div id="address" name="17" class="row col-12">
|
||||
<Address v-model:statusEdit="statusEdit" />
|
||||
</div>
|
||||
<div id="family" name="18" class="row col-12 q-mt-md">
|
||||
<div id="family" name="18" class="row col-12">
|
||||
<Family v-model:statusEdit="statusEdit" />
|
||||
</div>
|
||||
<div id="certicate" name="15" class="row col-12 q-mt-md">
|
||||
<div id="certicate" name="15" class="row col-12">
|
||||
<Certicate v-model:statusEdit="statusEdit" :profileType="profileType" />
|
||||
</div>
|
||||
<div id="education" name="2" class="row col-12 q-mt-md">
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
เลขที่ประจำตัวประชาชน
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
วัน/เดือน/ปีเกิด
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -68,7 +68,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
{{ props.getdetail.profileID }}
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
{{ props.getdetail.dateOfBirth }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -76,7 +76,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
ชื่อ-นามสกุล
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
เพศ
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -84,7 +84,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
{{ props.getdetail.fullName }}
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
{{ props.getdetail.gender }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -116,7 +116,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
สถานศึกษา
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
สาขาวิชาเอก
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -124,7 +124,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
{{ props.getdetail.university }}
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
{{ props.getdetail.major }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -132,7 +132,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
วุฒิการศึกษา
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
อื่นๆ
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -140,7 +140,7 @@ const clickSave = async () => {
|
|||
<div class="q-pb-md">
|
||||
{{ props.getdetail.degree ? props.getdetail.degree : '-' }}
|
||||
</div>
|
||||
<div class="q-pb-md">
|
||||
<div>
|
||||
{{ props.getdetail.remark ? props.getdetail.remark : '-' }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue