ปรับ 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

@ -120,32 +120,45 @@ onMounted(async () => {
</script>
<template>
<q-card bordered class="col-12 row caedNone q-pa-md q-col-gutter-md">
<div class="col-xs-12 col-sm-3">
<div class="toptitle">
{{
props.data && props.data?.type == "SPECIAL_EXPERT"
? "ประเมินชำนาญการพิเศษ"
: "ประเมินชำนาญการ"
}}
<q-btn
flat
round
dense
color="primary"
icon="history"
@click="onClickPopupHistory"
>
<q-tooltip>ประวการประเม</q-tooltip>
</q-btn>
<q-card bordered class="col-12 row caedNone q-col-gutter-md">
<div class="col-xs-12 col-sm-3 row">
<div class="col-12 row no-wrap">
<div class="col-12 q-py-md q-px-lg">
<div class="col-12 row items-center no-wrap">
<div class="toptitle2">
{{
props.data && props.data?.type == "SPECIAL_EXPERT"
? "ประเมินชำนาญการพิเศษ"
: "ประเมินชำนาญการ"
}}
</div>
<q-space/>
<div>
<q-btn
flat
round
dense
color="primary"
icon="history"
@click="onClickPopupHistory"
>
<q-tooltip>ประวการประเม</q-tooltip>
</q-btn>
</div>
</div>
<div class="col-12">
<Stepper />
</div>
</div>
<div class="col-12 row">
<q-separator :vertical="!$q.screen.lt.md" />
</div>
</div>
<Stepper />
</div>
<div class="col-xs-12 col-sm-9">
<div class="col-12 row">
<div class="toptitle">
<div class="col-xs-12 col-sm-9 q-pa-md">
<div class="col-12 row q-pt-md">
<div class="toptitle2">
{{ store.step }}.{{ store.titel[store.step - 1] }}
</div>
</div>
@ -162,8 +175,7 @@ onMounted(async () => {
: 'col-xs-12 col-sm-5 row'
"
>
<q-card flat bordered class="col-12 q-pa-md">
<q-card-section>
<q-card flat bordered class="col-12">
<Step1 v-if="store.step === 1" :data="props.data" />
<Step2 v-if="store.step === 2" @update:form="updateformCommand" />
<Step3 v-if="store.step === 3" :step="store.step" />
@ -173,7 +185,6 @@ onMounted(async () => {
<Step7 v-if="store.step === 7" />
<Step8 v-if="store.step === 8" />
<Step9 v-if="store.step === 9" />
</q-card-section>
</q-card>
</div>
<div
@ -200,4 +211,9 @@ onMounted(async () => {
.q-stepper--vertical .q-stepper__step-inner {
padding: 0;
}
.toptitle2 {
font-size: 1rem;
font-weight: bold;
margin-bottom: 1.2%;
}
</style>