114 lines
2.7 KiB
Vue
114 lines
2.7 KiB
Vue
<script setup lang="ts">
|
|
const customerName = defineModel<string>('customerName');
|
|
const customerNameEn = defineModel<string>('customerNameEn');
|
|
const taxNo = defineModel<string | null | undefined>('taxNo');
|
|
|
|
const employerID = defineModel<string>('employerID');
|
|
|
|
// employee
|
|
const customerBranchId = defineModel<string>('customerBranchId');
|
|
const employeeID = defineModel<string>('employeeID');
|
|
const nrcNo = defineModel<string>('nrcNo');
|
|
|
|
defineProps<{
|
|
dense?: boolean;
|
|
outlined?: boolean;
|
|
readonly?: boolean;
|
|
separator?: boolean;
|
|
typeCustomer?: string;
|
|
employee?: boolean;
|
|
}>();
|
|
</script>
|
|
|
|
<template>
|
|
<div class="col-3 app-text-muted">
|
|
• {{ $t(`formDialogTitleInformation`) }}
|
|
</div>
|
|
<div v-if="!employee" class="col-9 row q-col-gutter-md">
|
|
<q-input
|
|
v-if="typeCustomer === 'customerNaturalPerson'"
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="true"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('formDialogEmployerID')"
|
|
v-model="employerID"
|
|
/>
|
|
<q-input
|
|
v-if="typeCustomer === 'customerNaturalPerson'"
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('taxNo')"
|
|
v-model="taxNo"
|
|
/>
|
|
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('corporationThaiName')"
|
|
v-model="customerName"
|
|
/>
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('corporationEnglishName')"
|
|
v-model="customerNameEn"
|
|
/>
|
|
</div>
|
|
|
|
<div v-if="employee" class="col-9 row q-col-gutter-md">
|
|
<q-select
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-3"
|
|
:label="$t('formDialogEmployerID')"
|
|
v-model="customerBranchId"
|
|
/>
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="true"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-3"
|
|
:label="$t('formDialogEmployeeID')"
|
|
v-model="employeeID"
|
|
for="input-employeeID"
|
|
/>
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-6"
|
|
:label="$t('formDialogEmployeeNRCNo')"
|
|
v-model="nrcNo"
|
|
/>
|
|
</div>
|
|
|
|
<q-separator
|
|
v-if="separator"
|
|
class="col-12 q-mt-xl q-mb-md"
|
|
style="padding-block: 0.5px"
|
|
/>
|
|
</template>
|
|
|
|
<style scoped></style>
|