fix: clean for remove warning console

This commit is contained in:
puriphatt 2024-07-01 08:40:37 +00:00
parent d1e6239a1f
commit 20e12b407a
6 changed files with 346 additions and 347 deletions

View file

@ -16,74 +16,76 @@ defineProps<{
}>();
</script>
<template>
<div class="col-3 app-text-muted"> {{ $t(`${title}`) }}</div>
<div class="col-9 row q-col-gutter-md">
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
:label="
typeBranch === 'headOffice'
? $t('formDialogInputEmailHq')
: $t('formDialogInputEmailSubBranch')
"
v-model="email"
for="input-email"
/>
<div class="row col-12">
<div class="col-3 app-text-muted"> {{ $t(`${title}`) }}</div>
<div class="col-9 row q-col-gutter-md">
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
:label="
typeBranch === 'headOffice'
? $t('formDialogInputEmailHq')
: $t('formDialogInputEmailSubBranch')
"
v-model="email"
for="input-email"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-7"
:label="
typeBranch === 'headOffice'
? $t('formDialogInputTelephoneHq')
: $t('formDialogInputTelephoneSubBranch')
"
v-model="telephoneNo"
for="input-telephone-no"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-7"
:label="
typeBranch === 'headOffice'
? $t('formDialogInputTelephoneHq')
: $t('formDialogInputTelephoneSubBranch')
"
v-model="telephoneNo"
for="input-telephone-no"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
:label="$t('formDialogInputContactName')"
v-model="contactName"
for="input-contact-name"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
:label="$t('formDialogInputContactName')"
v-model="contactName"
for="input-contact-name"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-7"
:label="$t('formDialogInputTelephoneContact')"
v-model="contact"
for="input-contact"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-7"
:label="$t('formDialogInputTelephoneContact')"
v-model="contact"
for="input-contact"
/>
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
label="Line ID"
v-model="lineId"
for="input-line-id"
<q-input
:dense="dense"
outlined
:readonly="readonly"
hide-bottom-space
class="col-5"
label="Line ID"
v-model="lineId"
for="input-line-id"
/>
</div>
<q-separator
v-if="separator"
class="col-12 q-mt-xl q-mb-md"
style="padding-block: 0.5px"
/>
</div>
<q-separator
v-if="separator"
class="col-12 q-mt-xl q-mb-md"
style="padding-block: 0.5px"
/>
</template>

View file

@ -63,265 +63,267 @@ function deleteFile(name: string) {
}
</script>
<template>
<div v-if="userType" class="col-3 app-text-muted">
{{ $t('formDialogTitleByType') }}
</div>
<div class="col-9 row q-col-gutter-md">
<div
v-if="userType === 'USER' || userType === 'MESSENGER'"
class="row col-12 q-col-gutter-md"
style="margin-left: 0px; padding-left: 0px"
>
<q-input
for="input-regis-no"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputRegisNo')"
class="col-12"
v-model="registrationNo"
/>
<VueDatePicker
utc
autoApply
:dark="$q.dark.isActive"
v-model="startDate"
:teleport="true"
:locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-6"
>
<template #year="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #year-overlay-value="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #trigger>
<q-input
for="input-start-date"
:label="$t('formDialogInputStartDate')"
:dense="dense"
outlined
:readonly="readonly"
:model-value="startDate ? dateFormat(startDate) : ''"
>
<template v-slot:prepend>
<q-icon
size="xs"
name="mdi-calendar-blank-outline"
class="cursor-pointer"
color="primary"
/>
</template>
<template v-slot:append>
<q-icon
v-if="startDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="startDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
<VueDatePicker
utc
autoApply
v-model="retireDate"
:dark="$q.dark.isActive"
:teleport="true"
:locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-6"
>
<template #year="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #year-overlay-value="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #trigger>
<q-input
for="input-retire-date"
:label="$t('formDialogInputRetireDate')"
:dense="dense"
outlined
:readonly="readonly"
:model-value="retireDate ? dateFormat(retireDate) : ''"
>
<template v-slot:prepend>
<q-icon
size="xs"
name="mdi-calendar-blank-outline"
class="cursor-pointer"
color="primary"
/>
</template>
<template v-slot:append>
<q-icon
v-if="retireDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="retireDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
<q-select
id="input-responsible-area"
v-if="userType === 'MESSENGER'"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputResponsibleArea')"
class="col-12"
option-label="label"
option-value="label"
v-model="responsibleArea"
:options="userStore.userOption.responsibleAreaOpts"
/>
<div class="row col-12">
<div v-if="userType" class="col-3 app-text-muted">
{{ $t('formDialogTitleByType') }}
</div>
<div
v-if="userType === 'DELEGATE'"
class="row col-12"
style="row-gap: 16px"
>
<q-input
for="input-discount-condition"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputDiscount')"
class="col-12"
v-model="discountCondition"
type="textarea"
/>
</div>
<div
v-if="userType === 'AGENCY'"
class="row col-12 q-col-gutter-md"
style="margin-left: 0px; padding-left: 0px"
>
<q-select
id="input-source-nationality"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputSourceNationality')"
class="col-3"
option-label="label"
option-value="label"
v-model="sourceNationality"
:options="userStore.userOption.nationalityOpts"
/>
<q-select
id="input-import-nationality"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputImportNationality')"
class="col-3"
option-label="label"
option-value="label"
v-model="importNationality"
:options="userStore.userOption.nationalityOpts"
/>
<q-select
id="select-trainig-place"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputTrainingPlace')"
class="col-6"
option-label="label"
option-value="label"
v-model="trainingPlace"
:options="userStore.userOption.trainingPlaceOpts"
/>
<q-input
for="input-checkpoint"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputCheckpoint')"
class="col-6"
v-model="checkpoint"
/>
<q-input
for="input-checkpoint-en"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputCheckpoint') + ' ENG'"
class="col-6"
v-model="checkpointEN"
/>
<q-file
for="input-attchment"
:dense="dense"
outlined
:readonly="readonly"
multiple
append
:label="$t('formDialogAttachment')"
class="col-12"
v-model="agencyFile"
/>
<div v-if="agencyFileList && agencyFileList?.length > 0" class="col-12">
<q-list bordered separator class="rounded" style="padding: 0">
<q-item
id="attachment-file"
v-for="item in agencyFileList"
clickable
:key="item.url"
class="items-center row"
@click="() => openNewTab(item.url)"
>
<q-item-section>
<div class="row items-center justify-between">
<div class="col">
{{ item.name }}
</div>
<q-btn
id="delete-file"
v-if="!readonly && userId"
rounded
flat
dense
unelevated
size="md"
icon="mdi-trash-can-outline"
class="app-text-negative"
@click.stop="deleteFile(item.name)"
<div class="col-9 row q-col-gutter-md">
<div
v-if="userType === 'USER' || userType === 'MESSENGER'"
class="row col-12 q-col-gutter-md"
style="margin-left: 0px; padding-left: 0px"
>
<q-input
for="input-regis-no"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputRegisNo')"
class="col-12"
v-model="registrationNo"
/>
<VueDatePicker
utc
autoApply
:dark="$q.dark.isActive"
v-model="startDate"
:teleport="true"
:locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-6"
>
<template #year="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #year-overlay-value="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #trigger>
<q-input
for="input-start-date"
:label="$t('formDialogInputStartDate')"
:dense="dense"
outlined
:readonly="readonly"
:model-value="startDate ? dateFormat(startDate) : ''"
>
<template v-slot:prepend>
<q-icon
size="xs"
name="mdi-calendar-blank-outline"
class="cursor-pointer"
color="primary"
/>
</div>
</q-item-section>
</q-item>
</q-list>
</template>
<template v-slot:append>
<q-icon
v-if="startDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="startDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
<VueDatePicker
utc
autoApply
v-model="retireDate"
:dark="$q.dark.isActive"
:teleport="true"
:locale="$i18n.locale === 'th-th' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-6"
>
<template #year="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #year-overlay-value="{ value }">
{{ $i18n.locale === 'th-th' ? value + 543 : value }}
</template>
<template #trigger>
<q-input
for="input-retire-date"
:label="$t('formDialogInputRetireDate')"
:dense="dense"
outlined
:readonly="readonly"
:model-value="retireDate ? dateFormat(retireDate) : ''"
>
<template v-slot:prepend>
<q-icon
size="xs"
name="mdi-calendar-blank-outline"
class="cursor-pointer"
color="primary"
/>
</template>
<template v-slot:append>
<q-icon
v-if="retireDate && !readonly"
name="mdi-close"
class="cursor-pointer"
size="xs"
@click="retireDate = undefined"
/>
</template>
</q-input>
</template>
</VueDatePicker>
<q-select
id="input-responsible-area"
v-if="userType === 'MESSENGER'"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputResponsibleArea')"
class="col-12"
option-label="label"
option-value="label"
v-model="responsibleArea"
:options="userStore.userOption.responsibleAreaOpts"
/>
</div>
<div
v-if="userType === 'DELEGATE'"
class="row col-12"
style="row-gap: 16px"
>
<q-input
for="input-discount-condition"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputDiscount')"
class="col-12"
v-model="discountCondition"
type="textarea"
/>
</div>
<div
v-if="userType === 'AGENCY'"
class="row col-12 q-col-gutter-md"
style="margin-left: 0px; padding-left: 0px"
>
<q-select
id="input-source-nationality"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputSourceNationality')"
class="col-3"
option-label="label"
option-value="label"
v-model="sourceNationality"
:options="userStore.userOption.nationalityOpts"
/>
<q-select
id="input-import-nationality"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputImportNationality')"
class="col-3"
option-label="label"
option-value="label"
v-model="importNationality"
:options="userStore.userOption.nationalityOpts"
/>
<q-select
id="select-trainig-place"
:dense="dense"
outlined
:readonly="readonly"
:hide-dropdown-icon="readonly"
emit-value
map-options
options-dense
:label="$t('formDialogInputTrainingPlace')"
class="col-6"
option-label="label"
option-value="label"
v-model="trainingPlace"
:options="userStore.userOption.trainingPlaceOpts"
/>
<q-input
for="input-checkpoint"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputCheckpoint')"
class="col-6"
v-model="checkpoint"
/>
<q-input
for="input-checkpoint-en"
:dense="dense"
outlined
:readonly="readonly"
:label="$t('formDialogInputCheckpoint') + ' ENG'"
class="col-6"
v-model="checkpointEN"
/>
<q-file
for="input-attchment"
:dense="dense"
outlined
:readonly="readonly"
multiple
append
:label="$t('formDialogAttachment')"
class="col-12"
v-model="agencyFile"
/>
<div v-if="agencyFileList && agencyFileList?.length > 0" class="col-12">
<q-list bordered separator class="rounded" style="padding: 0">
<q-item
id="attachment-file"
v-for="item in agencyFileList"
clickable
:key="item.url"
class="items-center row"
@click="() => openNewTab(item.url)"
>
<q-item-section>
<div class="row items-center justify-between">
<div class="col">
{{ item.name }}
</div>
<q-btn
id="delete-file"
v-if="!readonly && userId"
rounded
flat
dense
unelevated
size="md"
icon="mdi-trash-can-outline"
class="app-text-negative"
@click.stop="deleteFile(item.name)"
/>
</div>
</q-item-section>
</q-item>
</q-list>
</div>
</div>
</div>
</div>

View file

@ -63,7 +63,7 @@ function reset() {
@submit.prevent
@validation-success="submit"
>
<AppBox
<div
class="column justify-between full-height"
style="padding: 0; border-radius: var(--radius-2)"
>
@ -194,7 +194,7 @@ function reset() {
@click="close"
/>
</div>
</AppBox>
</div>
</q-form>
</q-drawer>
</template>

View file

@ -274,8 +274,6 @@ async function triggerEdit(
openDialog();
}
if (openFormType === 'drawer') {
console.log(code);
formType.value = 'view';
openDrawer();
}

View file

@ -128,7 +128,17 @@ const formDataEmployeeSameAddr = ref(true);
const formDataEmployeeTab = ref('personalInfo');
const infoDrawerEmployee = ref(false);
const infoDrawerEmployeeEdit = ref(false);
const infoEmployeePersonCard = ref();
const infoEmployeePersonCard = ref<
{
id: string;
img: string;
name: string;
male: boolean;
female: boolean;
badge: string;
disabled: boolean;
}[]
>();
const statsEmployee = ref(0);
const statsEmployeeGender = ref<{ male: number; female: number }>();
const formDataEmployeeOwner = ref<{
@ -272,8 +282,8 @@ const inputFile = (() => {
if (infoDrawerEdit.value && currentCustomer.value)
currentCustomer.value.imageUrl = profileUrl.value as string;
if (infoDrawerEmployeeEdit.value)
infoEmployeePersonCard.value[0].img = profileUrl.value;
if (infoDrawerEmployeeEdit.value && infoEmployeePersonCard.value)
infoEmployeePersonCard.value[0].img = profileUrl.value as string;
});
element.addEventListener('change', () => {
@ -1855,7 +1865,6 @@ watch([inputSearch, currentStatus], async () => {
"
dense
outlined
bordered
separator
/>
</template>
@ -1998,7 +2007,6 @@ watch([inputSearch, currentStatus], async () => {
v-if="formDataEmployeeTab === 'personalInfo'"
dense
outlined
employee
separator
v-model:passport-type="formDataEmployee.passportType"
v-model:passport-number="formDataEmployee.passportNumber"
@ -2020,7 +2028,6 @@ watch([inputSearch, currentStatus], async () => {
v-if="formDataEmployeeTab === 'personalInfo'"
dense
outlined
employee
v-model:visa-type="formDataEmployee.visaType"
v-model:visa-number="formDataEmployee.visaNumber"
v-model:visa-issue-date="formDataEmployee.visaIssueDate"
@ -2131,7 +2138,6 @@ watch([inputSearch, currentStatus], async () => {
"
dense
outlined
bordered
separator
/>
</template>
@ -2263,7 +2269,6 @@ watch([inputSearch, currentStatus], async () => {
"
dense
outlined
bordered
separator
/>
</template>
@ -2465,7 +2470,6 @@ watch([inputSearch, currentStatus], async () => {
"
dense
outlined
bordered
separator
:readonly="!infoDrawerEdit"
/>
@ -2677,7 +2681,6 @@ watch([inputSearch, currentStatus], async () => {
"
dense
outlined
bordered
separator
:readonly="!infoDrawerEdit"
/>
@ -2771,7 +2774,7 @@ watch([inputSearch, currentStatus], async () => {
no-action
no-detail
no-bg
:list="infoEmployeePersonCard"
:list="infoEmployeePersonCard ? infoEmployeePersonCard : []"
:gridColumns="1"
@edit-profile="
() => {
@ -2860,7 +2863,6 @@ watch([inputSearch, currentStatus], async () => {
v-if="formDataEmployeeTab === 'personalInfo'"
dense
outlined
employee
separator
:readonly="!infoDrawerEmployeeEdit"
v-model:passport-type="formDataEmployee.passportType"
@ -2883,7 +2885,6 @@ watch([inputSearch, currentStatus], async () => {
v-if="formDataEmployeeTab === 'personalInfo'"
dense
outlined
employee
:readonly="!infoDrawerEmployeeEdit"
v-model:visa-type="formDataEmployee.visaType"
v-model:visa-number="formDataEmployee.visaNumber"

View file

@ -2018,21 +2018,17 @@ watch(inputSearchProductAndService, async () => {
/>
</template>
<div v-if="currentServiceTab === 'serviceInformation'" class="col-10">
<div
v-if="currentServiceTab === 'serviceInformation'"
class="col-md-10 col-sm-12"
>
<div class="surface-1 rounded bordered q-pa-lg full-width row">
<BasicInformation
dense
service
@service-properties="
() => {
tempValueProperties = formDataProductService.attributes;
openPropertiesDialog('service');
}
"
v-model:service-code="formDataProductService.code"
v-model:service-description="formDataProductService.detail"
v-model:service-name-th="formDataProductService.name"
@input-file="inputFile.click()"
/>
</div>
<div class="surface-1 rounded bordered q-mt-md q-pa-lg row">
@ -2050,7 +2046,7 @@ watch(inputSearchProductAndService, async () => {
<div
v-if="currentServiceTab === 'workInformation'"
class="surface-1 rounded bordered col-10 q-pa-lg"
class="surface-1 rounded bordered col-md-10 col-sm-12 q-pa-lg"
>
<FormServiceWork
v-model:work-items="workItems"