121 lines
3 KiB
Vue
121 lines
3 KiB
Vue
<script setup lang="ts">
|
|
const code = defineModel<string>('code');
|
|
const codeSubBranch = defineModel<string>('codeSubBranch');
|
|
const taxNo = defineModel<string>('taxNo');
|
|
const name = defineModel<string>('name');
|
|
const nameEN = defineModel<string>('nameEN');
|
|
const typeBranch = defineModel<string>('typeBranch');
|
|
|
|
defineProps<{
|
|
title?: string;
|
|
dense?: boolean;
|
|
outlined?: boolean;
|
|
readonly?: boolean;
|
|
separator?: boolean;
|
|
view?: boolean;
|
|
}>();
|
|
</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"
|
|
:borderless="readonly"
|
|
readonly
|
|
hide-bottom-space
|
|
:class="{
|
|
'col-6': typeBranch == 'headOffice',
|
|
'col-4': typeBranch != 'headOffice',
|
|
}"
|
|
:label="$t('formDialogInputCode')"
|
|
v-model="code"
|
|
for="input-code"
|
|
/>
|
|
|
|
<q-input
|
|
v-if="typeBranch !== 'headOffice'"
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:borderless="readonly"
|
|
readonly
|
|
hide-bottom-space
|
|
:class="{
|
|
'col-6': typeBranch == 'headOffice',
|
|
'col-4': typeBranch != 'headOffice',
|
|
}"
|
|
:label="$t('branchLabelCode')"
|
|
v-model="codeSubBranch"
|
|
for="input-code-sub-branch"
|
|
/>
|
|
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
:class="{
|
|
'col-6': typeBranch === 'headOffice',
|
|
'col-4': typeBranch !== 'headOffice',
|
|
}"
|
|
:label="$t('formDialogInputTaxNo')"
|
|
v-model="taxNo"
|
|
lazy-rules
|
|
:rules="[
|
|
(val) => (val && val.length > 0) || $t('formDialogInputTaxNoValidate'),
|
|
]"
|
|
for="input-tax-no"
|
|
/>
|
|
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-12"
|
|
:label="
|
|
typeBranch === 'headOffice'
|
|
? $t('formDialogInputNameHq')
|
|
: $t('formDialogInputNameSubBranch')
|
|
"
|
|
v-model="name"
|
|
lazy-rules
|
|
:rules="[(val) => val && val.length > 0]"
|
|
:error-message="
|
|
typeBranch === 'headOffice'
|
|
? $t('formDialogInputNameHqValidate')
|
|
: $t('formDialogInputNameSubBranchValidate')
|
|
"
|
|
for="input-name"
|
|
/>
|
|
|
|
<q-input
|
|
:dense="dense"
|
|
:outlined="!readonly"
|
|
:readonly="readonly"
|
|
:borderless="readonly"
|
|
hide-bottom-space
|
|
class="col-12"
|
|
v-model="nameEN"
|
|
:label="
|
|
typeBranch === 'headOffice'
|
|
? $t('formDialogInputNameHqEn')
|
|
: $t('formDialogInputNameSubBranchEn')
|
|
"
|
|
:rules="[(val) => val && val.length > 0]"
|
|
:error-message="
|
|
typeBranch === 'headOffice'
|
|
? $t('formDialogInputNameHqEnValidate')
|
|
: $t('formDialogInputNameSubBranchEnValidate')
|
|
"
|
|
for="input-name-en"
|
|
/>
|
|
</div>
|
|
<q-separator
|
|
v-if="separator"
|
|
class="col-12 q-mt-xl q-mb-md"
|
|
style="padding-block: 0.5px"
|
|
/>
|
|
</template>
|