ปรับ ui form

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2023-11-07 16:35:39 +07:00
parent 8ea5ad36da
commit 68ef892d62
8 changed files with 230 additions and 246 deletions

View file

@ -39,7 +39,7 @@ function updateClock() {
setInterval(updateClock, 1000);
//location
const location = ref<string>("สำนักงาน ก.ก");
const location = ref<string>("");
const coordinates = ref<string>("13° 43 45” N 100° 31 26” E");
const workplace = ref<string>("in-place");
const useLocation = ref<string | null>("");
@ -252,25 +252,6 @@ const getClass = (val: boolean) => {
<div class="col-xs-12 col-md-11 row q-col-gutter-md">
<div class="col-12 col-sm-8">
<MapCheck />
<!-- <q-card
bordered
flat
class="col-12 bg-grey-2 shadow-0"
:style="$q.screen.gt.xs ? 'height: 350px;' : 'height: 220px;'"
>
<MapCheck />
<q-img
src="@/assets/map1.png"
:style="
$q.screen.gt.xs ? 'height: 300px;' : 'height: 168px;'
"
></q-img>
<div class="q-pa-md text-weight-medium text-grey-8">
นทใกลเคยง
<span class="q-px-sm">:</span>
{{ location }}
</div>
</q-card> -->
</div>
<div class="col-12 col-sm-4">
<q-card
@ -373,7 +354,7 @@ const getClass = (val: boolean) => {
</div>
<div
class="col-xs-12 col-sm-6 col-md-4"
v-if="model == 'อื่นๆ'"
v-if="model == 'อื่นๆ' && workplace === 'off-site'"
>
<q-input
ref="useLocationRef"
@ -387,28 +368,39 @@ const getClass = (val: boolean) => {
/>
</div>
</q-card>
<div class="col-12 text-right">
<q-separator />
<div class="col-12 q-pa-md">
<p
:class="
$q.screen.gt.xs
? 'text-red text-caption '
: 'text-red text-caption text-center'
"
>
*หมายเหต คลกลงเวลาเขางานแลวระบบจะลงเวลาทนท
</p>
<q-btn
:label="
stetusCheckin == true ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'
"
:color="
stetusCheckin == true && img == null
? 'grey-6'
: 'primary'
"
push
size="14px"
:class="$q.screen.gt.xs ? 'q-px-md' : 'full-width'"
:disable="camera && img ? false : true"
@click="validateForm"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 text-right" v-if="camera && img">
<div class="col-12">
<q-separator />
</div>
<div class="col-12 q-pa-md">
<p class="text-red text-caption">
*หมายเหต คลกลงเวลาเขางานแลวระบบจะลงเวลาทนท
</p>
<q-btn
:label="stetusCheckin == true ? 'ลงเวลาเข้างาน' : 'ลงเวลาออกงาน'"
:color="stetusCheckin == true ? 'primary' : 'red-9'"
push
size="14px"
:class="$q.screen.gt.xs ? 'q-px-md' : 'full-width'"
@click="validateForm"
/>
</div>
</div>
</q-card>
</div>
</div>
@ -424,7 +416,7 @@ const getClass = (val: boolean) => {
<q-card-section class="row col-12 justify-center">
<div class="bg-grey-2 rounded-borders q-pa-md col-11">
<div class="col-12 text-subtitle1 text-center text-weight-medium">
{{ Thai }}
{{ date2Thai(Thai) }}
</div>
<div class="row col-12 justify-center q-pt-sm">
<div class="text-h3 text-weight-bold">