ปรับ css หน้าจัดการเพิ่มเติม

This commit is contained in:
Tanyalak 2023-07-27 13:36:02 +07:00
parent 1b4465bf36
commit 1fb7bfd1e6
3 changed files with 84 additions and 50 deletions

View file

@ -34,13 +34,12 @@
<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-pa-md 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="text-grey-7 q-pb-sm row text-weight-medium col-12 items-center">
<!-- สรปจำนวนผสมครคดเลอก -->
<datepicker
class="q-pl-sm"
v-model="dateFilter"
:locale="'th'"
autoApply
@ -76,22 +75,22 @@
</template>
</datepicker>
<q-btn
size="md"
icon="mdi-download"
round
flat
color="primary"
@click="downloadFileDashboard"
class="q-ml-sm"
>
<q-tooltip>ดาวนโหลดสรปขอมลสมครสอบ</q-tooltip>
</q-btn>
<q-btn
dense
size="12px"
flat
round
color="green"
class="q-ml-sm"
@click.stop.prevent="clickCandidateList()"
icon="mdi-clipboard-arrow-down"
>
@ -100,40 +99,42 @@
<q-btn
dense
size="12px"
flat
round
color="indigo"
class="q-ml-sm"
@click.stop.prevent="clickPassExam()"
icon="mdi-clipboard-arrow-down"
>
<q-tooltip>ดาวนโหลดรายชอผสอบแขงขนได</q-tooltip>
</q-btn>
</div>
<div class="row col-12 q-col-gutter-md fit q-pa-md">
<div
style="width: 25%"
v-for="(num, index) in dataNum"
:key="index"
>
<q-card bordered flat class="row fit cardNum items-center">
<div class="col-12 row items-center q-pa-sm">
<div
:class="
'col-12 text-h5 text-weight-bold text-' + `${num.color}`
"
>
{{
num.count != null
? num.count.toLocaleString("en-US")
: ""
}}
<div class="col-12">
<div class="row col-12 q-col-gutter-sm fit">
<div
style="width: 25%"
v-for="(num, index) in dataNum"
:key="index"
>
<q-card bordered flat class="row fit cardNum items-center">
<div class="col-12 row items-center q-pa-sm">
<div
:class="
'col-12 text-h5 text-weight-bold text-' + `${num.color}`
"
>
{{
num.count != null
? num.count.toLocaleString("en-US")
: ""
}}
</div>
<div class="col-12 text-dark ellipsis">
{{ num.name }}
</div>
</div>
<div class="col-12 text-dark ellipsis">
{{ num.name }}
</div>
</div>
</q-card>
</q-card>
</div>
</div>
</div>
</div>