updated layout registry
This commit is contained in:
parent
08f0507abe
commit
4164b560eb
10 changed files with 320 additions and 310 deletions
|
|
@ -11,17 +11,16 @@ import ResultsPerformance from "@/modules/04_registryNew/components/detail/Achie
|
|||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div class="text-dark row items-center" style="font-size: 22px">
|
||||
<q-icon name="mdi-medal" class="q-mr-md" />
|
||||
<span>ข้อมูลผลงานและเครื่องราชฯ</span>
|
||||
<div class="row items-center q-mb-md">
|
||||
<div class="text-dark row items-center text-weight-bold">
|
||||
<q-icon name="mdi-medal" class="q-mr-md" size="sm" />
|
||||
<h3 class="resigtry-tab-title">ข้อมูลผลงานและเครื่องราชฯ</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="text-grey"
|
||||
active-color="blue"
|
||||
indicator-color="white"
|
||||
|
|
|
|||
|
|
@ -10,17 +10,16 @@ import PerformSpecialWork from "@/modules/04_registryNew/components/detail/Gover
|
|||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div class="text-dark row items-center text-weight-bold" style="font-size: 20px">
|
||||
<q-icon name="mdi-account-tie" class="q-mr-md" />
|
||||
<span>ข้อมูลราชการ</span>
|
||||
<div class="row items-center q-mb-md">
|
||||
<div class="text-dark row items-center text-weight-bold">
|
||||
<q-icon name="mdi-account-tie" class="q-mr-md" size="sm" />
|
||||
<h3 class="resigtry-tab-title">ข้อมูลราชการ</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="text-grey"
|
||||
active-color="blue"
|
||||
indicator-color="white"
|
||||
|
|
|
|||
|
|
@ -8,17 +8,16 @@ import Documentipline from "@/modules/04_registryNew/components/detail/Other/02_
|
|||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div class="text-dark row items-center text-weight-bold" style="font-size: 20px">
|
||||
<q-icon name="mdi-bookmark" class="q-mr-md" />
|
||||
<span>เอกสารหลักฐานและอื่นๆ</span>
|
||||
<div class="row items-center q-mb-md">
|
||||
<div class="text-dark row items-center text-weight-bold">
|
||||
<q-icon name="mdi-bookmark" class="q-mr-md" size="sm" />
|
||||
<h3 class="resigtry-tab-title">เอกสารหลักฐานและอื่นๆ</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="text-grey"
|
||||
active-color="blue"
|
||||
indicator-color="white"
|
||||
|
|
|
|||
|
|
@ -12,20 +12,16 @@ import SpecialSkill from "@/modules/04_registryNew/components/detail/PersonalInf
|
|||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div
|
||||
class="text-dark row items-center text-weight-bold"
|
||||
style="font-size: 20px"
|
||||
>
|
||||
<q-icon name="mdi-account" class="q-mr-md" />
|
||||
<span>ข้อมูลส่วนตัว</span>
|
||||
<div class="row items-center q-mb-md">
|
||||
<div class="text-dark row items-center text-weight-bold">
|
||||
<q-icon name="mdi-account" class="q-mr-md" size="sm" />
|
||||
<h3 class="resigtry-tab-title">ข้อมูลส่วนตัว</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="text-grey"
|
||||
active-color="blue"
|
||||
indicator-color="white"
|
||||
|
|
@ -33,7 +29,7 @@ const tab = ref<string>("1");
|
|||
narrow-indicator
|
||||
bordered
|
||||
>
|
||||
<q-tab name="1" label="ข้อมูลส่วนตัว" />
|
||||
<q-tab name="1" label="ประวัติส่วนตัว" />
|
||||
<q-tab name="2" label="ประวัติการเปลี่ยนชื่อ-นามสกุล" />
|
||||
<q-tab name="3" label="ข้อมูลที่อยู่" />
|
||||
<q-tab name="4" label="ข้อมูลครอบครัว" />
|
||||
|
|
|
|||
|
|
@ -327,11 +327,11 @@ function ocClikcHistory() {
|
|||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-gutter-sm">
|
||||
<!-- <div class="row items-center q-gutter-sm">
|
||||
<div class="toptitle text-dark row items-center q-py-xs">
|
||||
ตำแหน่งเงินเดือน
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<q-toolbar style="padding: 0px" class="text-primary">
|
||||
<q-btn flat round dense icon="add" @click="onClickOpenDialog()">
|
||||
|
|
@ -475,290 +475,285 @@ function ocClikcHistory() {
|
|||
:close="onClickCloseDialog"
|
||||
/>
|
||||
<q-separator />
|
||||
<q-card-section class="q-pa-sm bg-grey-1">
|
||||
<q-card-section class="q-pa-md bg-grey-1">
|
||||
<div class="row col-12 q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
<q-card flat bordered class="fit q-pa-sm">
|
||||
<div class="row col-12 q-col-gutter-xs">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
v-model="formDataSalary.date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
ref="dateRef"
|
||||
outlined
|
||||
dense
|
||||
borderless
|
||||
:model-value="date2Thai(formDataSalary.date)"
|
||||
:rules="[
|
||||
<q-card flat bordered class="row fit q-pa-sm q-col-gutter-sm">
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<datepicker
|
||||
v-model="formDataSalary.date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
ref="dateRef"
|
||||
outlined
|
||||
dense
|
||||
borderless
|
||||
:model-value="date2Thai(formDataSalary.date)"
|
||||
:rules="[
|
||||
(val: string) =>
|
||||
!!val ||
|
||||
`${'กรุณาเลือก วัน/เดือน/ปี'}`,
|
||||
]"
|
||||
:label="`${'วัน/เดือน/ปี'}`"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
ref="posNoRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.posNo"
|
||||
:label="`${'วัน/เดือน/ปี'}`"
|
||||
hide-bottom-space
|
||||
:label="`${'เลขที่ตำแหน่ง'}`"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="event" class="cursor-pointer"> </q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</div>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12 q-mt-lg">
|
||||
<q-select
|
||||
ref="templatePosRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.templatePos"
|
||||
:label="`${'ต้นแบบ (template) ตำแหน่ง'}`"
|
||||
option-label="name"
|
||||
:options="posNoOptions"
|
||||
option-value="name"
|
||||
hide-bottom-space
|
||||
emit-value
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@update:modelValue="updatePos"
|
||||
@filter="(inputValue: any,
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
ref="posNoRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.posNo"
|
||||
hide-bottom-space
|
||||
:label="`${'เลขที่ตำแหน่ง'}`"
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-select
|
||||
ref="templatePosRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.templatePos"
|
||||
:label="`${'ต้นแบบ (template) ตำแหน่ง'}`"
|
||||
option-label="name"
|
||||
:options="posNoOptions"
|
||||
option-value="name"
|
||||
hide-bottom-space
|
||||
emit-value
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@update:modelValue="updatePos"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'pos'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
ref="positionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.position"
|
||||
:label="`${'ตำแหน่ง'}`"
|
||||
type="textarea"
|
||||
hide-bottom-space
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
ref="positionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.position"
|
||||
:label="`${'ตำแหน่ง'}`"
|
||||
type="textarea"
|
||||
hide-bottom-space
|
||||
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.positionLineName"
|
||||
:label="`${'สายงาน'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="positionLineOptions"
|
||||
option-value="id"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue: any,
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.positionLineName"
|
||||
:label="`${'สายงาน'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="positionLineOptions"
|
||||
option-value="id"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'positionLineName'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-select
|
||||
ref="typePositionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.typePosition"
|
||||
:label="`${'ตำแหน่งประเภท'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="posTypeOptions"
|
||||
option-value="id"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งประเภท'}`]"
|
||||
@filter="(inputValue: any,
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="formDataSalary.positionPathSideName"
|
||||
hide-bottom-space
|
||||
:label="`${'ด้าน/สาขา'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.positionExecutiveName"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่งทางการบริหาร'}`"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-select
|
||||
ref="typePositionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.typePosition"
|
||||
:label="`${'ตำแหน่งประเภท'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="posTypeOptions"
|
||||
option-value="id"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งประเภท'}`]"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'posType'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-3">
|
||||
<q-select
|
||||
ref="levelPositionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.levelPosition"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับ'}`]"
|
||||
:label="`${'ระดับ'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="posLevelOption"
|
||||
option-value="name"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue: any,
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-select
|
||||
ref="levelPositionRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.levelPosition"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]"
|
||||
:label="`${'ระดับตำแหน่ง'}`"
|
||||
emit-value
|
||||
map-options
|
||||
option-label="name"
|
||||
:options="posLevelOption"
|
||||
option-value="name"
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'posLevel'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
/>
|
||||
</div>
|
||||
<div class="col-md-4"></div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="salaryRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salary"
|
||||
label="เงินเดือน"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-3">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="formDataSalary.positionPathSideName"
|
||||
hide-bottom-space
|
||||
:label="`${'ด้าน/สาขา'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.positionExecutiveName"
|
||||
hide-bottom-space
|
||||
:label="`${'ตำแหน่งทางการบริหาร'}`"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="amountRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salaryPos"
|
||||
label="เงินประจำตำแหน่ง"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="amountRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salaryCompensation"
|
||||
label="เงินค่าตอบแทนรายเดือน"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="salaryRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salary"
|
||||
label="เงินเดือน"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-12">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.refCommandNo"
|
||||
hide-bottom-space
|
||||
:label="`${'เลขที่คำสั่ง'}`"
|
||||
mask="#####################"
|
||||
>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]" -->
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="amountRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salaryPos"
|
||||
label="เงินประจำตำแหน่ง"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-4">
|
||||
<q-input
|
||||
ref="amountRef"
|
||||
dense
|
||||
outlined
|
||||
v-model="formDataSalary.salaryCompensation"
|
||||
label="เงินค่าตอบแทนรายเดือน"
|
||||
mask="###,###,###,###"
|
||||
reverse-fill-mask
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-6 col-md-12">
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.refCommandNo"
|
||||
hide-bottom-space
|
||||
:label="`${'เลขที่คำสั่ง'}`"
|
||||
mask="#####################"
|
||||
>
|
||||
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]" -->
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-select
|
||||
ref="templateDocRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.templateDoc"
|
||||
:label="`${'ต้นแบบ (template) เอกสารอ้างอิง'}`"
|
||||
option-label="name"
|
||||
:options="docOption"
|
||||
option-value="name"
|
||||
emit-value
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@update:modelValue="updateDoc"
|
||||
@filter="(inputValue: any,
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-select
|
||||
ref="templateDocRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.templateDoc"
|
||||
:label="`${'ต้นแบบ (template) เอกสารอ้างอิง'}`"
|
||||
option-label="name"
|
||||
:options="docOption"
|
||||
option-value="name"
|
||||
emit-value
|
||||
hide-bottom-space
|
||||
use-input
|
||||
input-debounce="0"
|
||||
@update:modelValue="updateDoc"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'doc'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
ref="docRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.doc"
|
||||
:label="`${'เอกสารอ้างอิง'}`"
|
||||
type="textarea"
|
||||
hide-bottom-space
|
||||
:rules="[(val: number) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<q-input
|
||||
ref="docRef"
|
||||
outlined
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formDataSalary.doc"
|
||||
:label="`${'เอกสารอ้างอิง'}`"
|
||||
type="textarea"
|
||||
hide-bottom-space
|
||||
:rules="[(val: number) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`]"
|
||||
/>
|
||||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
|
|
|
|||
|
|
@ -183,11 +183,11 @@ function ocClikcHistory() {
|
|||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-gutter-sm">
|
||||
<!-- <div class="row items-center q-gutter-sm">
|
||||
<div class="toptitle text-dark row items-center q-py-xs">
|
||||
บันทึกวันที่ไม่ได้รับเงินเดือนฯ
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<q-toolbar style="padding: 0px" class="text-primary">
|
||||
<q-btn flat round dense icon="add" @click="onClickOpenDialog()">
|
||||
<q-tooltip>เพิ่ม</q-tooltip>
|
||||
|
|
@ -225,7 +225,7 @@ function ocClikcHistory() {
|
|||
<q-btn-toggle
|
||||
v-model="modelView"
|
||||
toggle-color="grey-4"
|
||||
class="no-shadow"
|
||||
class="no-shadow toggle-borderd"
|
||||
:options="[
|
||||
{ value: 'table', slot: 'table' },
|
||||
{ value: 'card', slot: 'card' },
|
||||
|
|
@ -234,7 +234,7 @@ function ocClikcHistory() {
|
|||
<template v-slot:table>
|
||||
<q-icon
|
||||
name="format_list_bulleted"
|
||||
size="24px"
|
||||
size="sm"
|
||||
:style="{
|
||||
color: modelView === 'table' ? '#787B7C' : '#C9D3DB',
|
||||
}"
|
||||
|
|
@ -243,7 +243,7 @@ function ocClikcHistory() {
|
|||
<template v-slot:card>
|
||||
<q-icon
|
||||
name="mdi-view-grid-outline"
|
||||
size="24px"
|
||||
size="sm"
|
||||
:style="{
|
||||
color: modelView === 'card' ? '#787B7C' : '#C9D3DB',
|
||||
}"
|
||||
|
|
|
|||
|
|
@ -8,20 +8,16 @@ import NotReceiveSalary from "@/modules/04_registryNew/components/detail/Salary/
|
|||
const tab = ref<string>("1");
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div
|
||||
class="text-dark row items-center text-weight-bold"
|
||||
style="font-size: 20px"
|
||||
>
|
||||
<q-icon name="mdi-cash" class="q-mr-md" />
|
||||
<span>ข้อมูลเงินเดือน/ค่าจ้าง</span>
|
||||
<div class="row items-center q-mb-md">
|
||||
<div class="text-dark row items-center text-weight-bold">
|
||||
<q-icon name="mdi-cash" class="q-mr-md" size="sm" />
|
||||
<h3 class="resigtry-tab-title">ข้อมูลเงินเดือน/ค่าจ้าง</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-separator />
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="text-grey"
|
||||
active-color="blue"
|
||||
indicator-color="white"
|
||||
|
|
|
|||
|
|
@ -41,6 +41,7 @@ const itemsTab = ref<any>([
|
|||
|
||||
const splitterModel = ref<number>(12);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-splitter v-model="splitterModel" disable>
|
||||
<template v-slot:before>
|
||||
|
|
@ -64,7 +65,7 @@ const splitterModel = ref<number>(12);
|
|||
vertical
|
||||
transition-prev="jump-up"
|
||||
transition-next="jump-up"
|
||||
class="q-pa-md"
|
||||
class="q-px-md"
|
||||
>
|
||||
<q-tab-panel
|
||||
v-for="(tab, index) in itemsTab"
|
||||
|
|
|
|||
|
|
@ -67,7 +67,7 @@ onMounted(() => {
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<div class="row items-center q-gutter-sm">
|
||||
<div class="row items-center q-gutter-sm q-mb-xs">
|
||||
<div class="toptitle text-dark row items-center q-py-xs">
|
||||
<q-btn
|
||||
icon="mdi-arrow-left"
|
||||
|
|
@ -83,7 +83,7 @@ onMounted(() => {
|
|||
</div>
|
||||
<q-space />
|
||||
<q-btn-dropdown
|
||||
size="16px"
|
||||
size="md"
|
||||
rounded
|
||||
unelevated
|
||||
color="grey-4"
|
||||
|
|
@ -104,6 +104,7 @@ onMounted(() => {
|
|||
color="grey-4"
|
||||
text-color="primary"
|
||||
icon="mdi-file-eye-outline"
|
||||
size="md"
|
||||
>
|
||||
<q-tooltip>ดาวน์ไฟล์</q-tooltip>
|
||||
<q-menu>
|
||||
|
|
@ -120,17 +121,19 @@ onMounted(() => {
|
|||
</div>
|
||||
|
||||
<q-card>
|
||||
<div class="column" style="height: 170px">
|
||||
<div class="column" style="height: 160px">
|
||||
<div class="col row items-center">
|
||||
<div class="row col-12">
|
||||
<div class="col-sm-3 col-md-2"></div>
|
||||
<div class="col">
|
||||
<div class="col-12 text-primary" style="font-size: 20px">
|
||||
{{
|
||||
`${formDetail?.prefix}${formDetail?.firstName} ${formDetail?.lastName}`
|
||||
}}
|
||||
<div class="col-12 text-primary">
|
||||
<h2 class="title q-ma-none q-pa-none">
|
||||
{{
|
||||
`${formDetail?.prefix}${formDetail?.firstName} ${formDetail?.lastName}`
|
||||
}}
|
||||
</h2>
|
||||
</div>
|
||||
<div class="col-12">{{ formDetail?.position }}</div>
|
||||
<div class="col-12 subtitle">{{ formDetail?.position }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -153,20 +156,20 @@ onMounted(() => {
|
|||
<div class="col-sm-3 col-md-2"></div>
|
||||
<div class="col-2">
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<div class="col text-grey-5">ตำแหน่งในสายงาน</div>
|
||||
<div class="col text-grey-6">ตำแหน่งในสายงาน</div>
|
||||
<div class="col">หัวหน้าสำนักงาน</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<div class="col text-grey-5">ประเภทตำแหน่ง</div>
|
||||
<div class="col text-grey-6">ประเภทตำแหน่ง</div>
|
||||
<div class="col">บริหาร</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-sm-3 col-md-3">
|
||||
<div class="col text-grey-5">ระดับตำแหน่งง</div>
|
||||
<div class="col">สำนาญการพิเศษ</div>
|
||||
<div class="col text-grey-6">ระดับตำแหน่งง</div>
|
||||
<div class="col">ชำนาญการพิเศษ</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -174,15 +177,27 @@ onMounted(() => {
|
|||
</div>
|
||||
</q-card>
|
||||
|
||||
<q-card class="q-mt-md">
|
||||
<q-card class="q-mt-md rounded">
|
||||
<TabMain />
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
h2.title {
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.6rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
.subtitle {
|
||||
font-size: 1rem;
|
||||
color: #34373c;
|
||||
}
|
||||
.absolute-center-left {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.rounded {
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -145,3 +145,13 @@ $muti-tab: #87d4cc
|
|||
|
||||
.input-alert i.text-primary
|
||||
color: #f00 !important
|
||||
|
||||
/* registry common style */
|
||||
.toggle-borderd
|
||||
border: 1px solid #ecebeb
|
||||
|
||||
h3.resigtry-tab-title
|
||||
font-size: 1.2rem
|
||||
font-weight: 600
|
||||
margin: 0 0
|
||||
padding: 0 0
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue