ปรับ responesive
This commit is contained in:
parent
78bd5c0f7b
commit
ff10fb0ee1
5 changed files with 56 additions and 34 deletions
|
|
@ -596,7 +596,7 @@ onMounted(async () => {
|
|||
<div class="col-12">
|
||||
<q-card bordered class="col-12 row caedNone">
|
||||
<div class="col-xs-12 col-sm-3 row">
|
||||
<div class="col-12 row no-wrap">
|
||||
<div class="col-12 row ">
|
||||
<div class="col-12 q-py-md q-px-lg">
|
||||
<div class="col-12 row items-center no-wrap">
|
||||
<div class="toptitle2">
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ const props = defineProps({
|
|||
|
||||
<template>
|
||||
<div class="q-pa-sm row col-12">
|
||||
<q-table
|
||||
<d-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
|
|
@ -23,9 +23,9 @@ const props = defineProps({
|
|||
:rows-per-page-options="[10, 25, 50, 100]"
|
||||
virtual-scroll
|
||||
class="row col-12"
|
||||
:style="$q.screen.lt.sm ? 'width: 70vw' : 'width: 50vw;'"
|
||||
:style="$q.screen.lt.sm ? 'width: 80vw' : 'width: 50vw;'"
|
||||
>
|
||||
</q-table>
|
||||
</d-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
div
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, defineProps, watch } from "vue";
|
||||
import { useAppealComplainStore } from "@/modules/07_appealComplain/store";
|
||||
|
|
@ -206,7 +205,7 @@ function onSubmit(data: any) {
|
|||
</div>
|
||||
</q-banner>
|
||||
</div>
|
||||
<div class="row q-gutter-x-sm">
|
||||
<div class="row q-col-gutter-sm ">
|
||||
<div class="col-xs-12 col-md-3">
|
||||
<q-select
|
||||
:class="inputEdit(isReadOnly)"
|
||||
|
|
|
|||
|
|
@ -379,7 +379,7 @@ onMounted(async () => {
|
|||
class="col-xs-12 col-sm-3 col-md-2"
|
||||
/>
|
||||
</div>
|
||||
<q-table
|
||||
<d-table
|
||||
flat
|
||||
bordered
|
||||
dense
|
||||
|
|
@ -436,7 +436,30 @@ onMounted(async () => {
|
|||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
|
||||
<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="editPage(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 v-if="col.name === 'no'">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</q-item-label>
|
||||
|
||||
<q-item-label v-else>{{ col.value }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-card>
|
||||
</div>
|
||||
</template>
|
||||
</d-table>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -394,7 +394,7 @@ onMounted(async () => {
|
|||
>*น้ำหนัก(ร้อยละ) ผลสัมฤทธิ์ของงานไม่ถูกต้อง</span
|
||||
>
|
||||
<br v-if="!$q.screen.gt.xs" />
|
||||
|
||||
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
|
|
@ -502,51 +502,51 @@ onMounted(async () => {
|
|||
$q.screen.gt.xs ? 'padding-left: 12%' : 'padding-left:5%'
|
||||
"
|
||||
>
|
||||
<div class="row no-wrap">
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ตำแหน่งในสายงาน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">ตำแหน่งในสายงาน</span>
|
||||
<span class="text-weight-medium text-dark col">{{
|
||||
store.dataEvaluation.position
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ประเภทตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">ประเภทตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark col">{{
|
||||
store.dataEvaluation.posTypeName
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ระดับตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">ระดับตำแหน่ง</span>
|
||||
<span class="text-weight-medium text-dark col">{{
|
||||
store.dataEvaluation.posLevelName
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">สถานะการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">สถานะการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark col">{{
|
||||
formProfile.status
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">ผลการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark">{{
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">ผลการประเมิน</span>
|
||||
<span class="text-weight-medium text-dark col">{{
|
||||
formProfile.result
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="column">
|
||||
<span class="text-grey-6">คะแนนประเมิน</span>
|
||||
<span class="text-weight-medium text-primary">
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<div :class="$q.screen.gt.sm ? 'column' : 'row'">
|
||||
<span class="text-grey-6 col">คะแนนประเมิน</span>
|
||||
<span class="text-weight-medium text-primary col">
|
||||
{{
|
||||
store.dataEvaluation.posExecutiveName == null
|
||||
? (
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue