hrms-bangkok/hrms-user
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ปรับ responesive

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-05-24 16:57:35 +07:00
parent 8628be8fcf
commit 72ca700702
8 changed files with 342 additions and 282 deletions
Download patch file Download diff file Expand all files Collapse all files

73
src/modules/08_KPI/views/main.vue
View file

@ -383,7 +383,23 @@ onMounted(() => {
<template>
<div class="col-12 row justify-center">
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle text-white col-12 row items-center">
<q-toolbar style="padding: 0px">
<q-btn
icon="mdi-arrow-left"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="router.push(`/`)"
/>
<q-toolbar-title class="toptitle text-white items-center">
รายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล</q-toolbar-title
>
</q-toolbar>
<!-- <div class="toptitle text-white col-12 row items-center">
<q-btn
icon="mdi-arrow-left"
unelevated
@ -395,11 +411,11 @@ onMounted(() => {
@click="router.push(`/`)"
/>
รายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล
</div>
</div> -->
<div class="col-12">
<q-card bordered class="q-pa-md">
<q-toolbar style="padding: 0">
<div class="row q-gutter-sm">
<div class="row col-12 q-col-gutter-sm q-mb-sm">
<div class="col-xs-12 col-md-3">
<datepicker
menu-class-name="modalfix"
v-model="year"
@ -418,7 +434,6 @@ onMounted(() => {
dense
lazy-rules
outlined
class="inputgreen"
hide-bottom-space
:model-value="!!year ? year + 543 : null"
:label="`${'ปีงบประมาณ'}`"
@ -434,6 +449,9 @@ onMounted(() => {
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-10 col-md-3">
<q-select
v-model="round"
outlined
@ -442,11 +460,13 @@ onMounted(() => {
option-label="name"
option-value="id"
:options="roundMainOp"
style="min-width: 200px"
emit-value
map-options
@update:model-value="changRound"
/>
</div>
<div class="col-xs-2 col-md-2">
<q-btn
flat
round
@ -459,13 +479,7 @@ onMounted(() => {
</div>
<q-space />
<div class="row q-gutter-sm">
<!-- <q-input
outlined
dense
v-model="filterKeyword"
label="ค้นหา"
></q-input> -->
<div class="col-xs-12 col-md-2">
<q-select
v-model="visibleColumns"
multiple
@ -481,10 +495,10 @@ onMounted(() => {
style="min-width: 150px"
/>
</div>
</q-toolbar>
</div>
<div class="col-12">
<q-table
<d-table
ref="table"
:columns="columns"
:rows="rows"
@ -494,7 +508,6 @@ onMounted(() => {
bordered
:paging="true"
dense
class="custom-table2"
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="visibleColumns"
v-model:pagination="pagination"
@ -524,6 +537,26 @@ onMounted(() => {
</q-td>
</q-tr>
</template>
<template #item="props">
<div class="q-pa-xs col-xs-12 col-sm-6 col-md-4 col-lg-3">
<q-card bordered flat>
<q-list @click="redirectViewDetail(props.row.id)">
<q-item
v-for="col in props.cols.filter((col:any) => col.name !== 'desc')"
:key="col.name"
>
<q-item-section>
<q-item-label caption>{{ col.label }}</q-item-label>
<q-item-label>
{{ col.value ? col.value : "-" }}</q-item-label
>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</template>
<template v-slot:pagination="scope">
ทั้งหมด {{ total }} รายการ
<q-pagination
@ -538,7 +571,7 @@ onMounted(() => {
@update:model-value="fetchList"
></q-pagination>
</template>
</q-table>
</d-table>
</div>
</q-card>
</div>
@ -546,7 +579,10 @@ onMounted(() => {
</div>
<q-dialog v-model="modalDialog" persistent>
<q-card class="col-12" style="width: 25vw">
<q-card
class="col-12"
:style="$q.screen.gt.xs ? 'width: 25vw' : 'width: 100vw'"
>
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader :tittle="'สร้างแบบประเมินผลฯ'" :close="onCloseDialog" />
<q-separator />
@ -571,7 +607,6 @@ onMounted(() => {
dense
lazy-rules
outlined
class="inputgreen"
hide-bottom-space
:model-value="!!yearDialog ? yearDialog + 543 : null"
:label="`${'ปีงบประมาณ'}`"