chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: 03 Customer => improve responsive design across multiple components

Browse source
This commit is contained in:
puriphatt 2025-01-27 13:47:33 +07:00
parent b8eec6f494
commit d012bb4d70
7 changed files with 106 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/pages/03_customer-management/components/employer/EmployerFormAbout.vue
View file

@ -167,7 +167,7 @@ watch(
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-5"
class="col-12 col-md-5"
:label="$t('customer.form.employerName')"
for="input-legal-person-no"
:model-value="customerName"
@ -224,7 +224,7 @@ watch(
<div class="col-12 row q-col-gutter-sm">
<DatePicker
v-model="registerDate"
class="col-6 col-md-2"
class="col-12 col-md-2"
:id="`${prefixId}-input-register-date`"
:label="$t('customer.form.registerDate')"
:readonly="readonly"
@ -264,7 +264,7 @@ watch(
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
class="col-12 col-md-3"
:label="$t('customer.form.headQuarters.telephoneNo')"
for="input-telephone-no"
:model-value="readonly ? telephoneNo || '-' : telephoneNo"
@ -285,7 +285,7 @@ watch(
</template>
<template v-if="customerType === 'PERS'">
<div class="col-7 row q-col-gutter-sm">
<div class="col-md-7 col-12 row q-col-gutter-sm">
<q-input
dense
outlined
@ -320,7 +320,7 @@ watch(
/>
</div>
<div class="col-9 row q-col-gutter-sm">
<div class="col-md-9 col-12 row q-col-gutter-sm">
<q-select
outlined
use-input
@ -360,7 +360,7 @@ watch(
outlined
:readonly="readonly"
hide-bottom-space
class="col"
class="col-md col-12"
:label="$t('personnel.form.firstName')"
:model-value="firstName"
@update:model-value="
@ -384,7 +384,7 @@ watch(
/>
</div>
<div class="col-9 row q-col-gutter-sm">
<div class="col-md-9 col-12 row q-col-gutter-sm">
<q-input
:for="`${prefixId}-input-prefix-name`"
dense
@ -411,7 +411,7 @@ watch(
outlined
:readonly="readonly"
hide-bottom-space
class="col"
class="col-md col-12"
label="Name"
:model-value="firstNameEN"
@update:model-value="
@ -443,13 +443,13 @@ watch(
/>
</div>
<div class="row col-9 q-col-gutter-sm">
<div class="row col-md-9 col-12 q-col-gutter-sm">
<q-input
:for="`${prefixId}-input-telephone`"
dense
outlined
:readonly="readonly"
class="col-md col-6"
class="col-md col-12"
:label="$t('form.telephone')"
:mask="readonly ? '' : '##########'"
:model-value="readonly ? telephoneNo || '-' : telephoneNo"

2
src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
View file

@ -96,7 +96,7 @@ const telephoneNo = defineModel<string>('telephoneNo', { default: '' });
</div>
<div class="col-12 row q-col-gutter-sm">
<div class="col-12 row q-col-gutter-sm">
<div class="col-md-5 col-12">
<SelectBranch
:for="`${prefixId}-input-source-registered-branch`"
class="col-md-6"

3
src/pages/03_customer-management/components/employer/EmployerFormBranch.vue
View file

@ -25,8 +25,6 @@ import {
} from 'components/button';
import { UploadFileGroup } from 'src/components/upload-file/';
import { uploadFileListCustomer, columnsAttachment } from '../../constant';
import { symOutlinedResume } from '@quasar/extras/material-symbols-outlined';
import { group } from 'console';
const ocrStore = useOcrStore();
const customerStore = useCustomerStore();
@ -114,6 +112,7 @@ withDefaults(
class="bordered-b"
active-color="primary"
no-caps
mobile-arrows
style="color: hsl(var(--text-mute))"
>
<q-tab name="main" :label="$t('customerBranch.tab.main')" />