109 lines
3.1 KiB
Vue
109 lines
3.1 KiB
Vue
<script lang="ts" setup>
|
|
import SelectBranch from 'src/components/shared/select/SelectBranch.vue';
|
|
import SelectCustomer from 'src/components/shared/select/SelectCustomer.vue';
|
|
import DatePicker from 'src/components/shared/DatePicker.vue';
|
|
import DataDisplay from 'src/components/08_request-list/DataDisplay.vue';
|
|
|
|
defineProps<{
|
|
readonly?: boolean;
|
|
noLink?: boolean;
|
|
}>();
|
|
|
|
defineEmits<{
|
|
(e: 'gotoQuotation'): void;
|
|
}>();
|
|
|
|
const registeredBranchId = defineModel<string>('registeredBranchId');
|
|
const customerId = defineModel<string>('customerId');
|
|
const issueDate = defineModel<string>('issueDate');
|
|
|
|
const quotationCode = defineModel<string>('quotationCode');
|
|
const quotationWorkName = defineModel<string>('quotationWorkName');
|
|
const quotationContactName = defineModel<string>('quotationContactName');
|
|
const quotationContactTel = defineModel<string>('quotationContactTel');
|
|
const quotationCreatedBy = defineModel<string>('quotationCreatedBy');
|
|
</script>
|
|
<template>
|
|
<q-expansion-item
|
|
default-opened
|
|
dense
|
|
class="overflow-hidden bordered full-width"
|
|
switch-toggle-side
|
|
style="border-radius: var(--radius-2)"
|
|
expand-icon="mdi-chevron-down-circle"
|
|
header-class="surface-1 q-py-sm text-medium text-body1"
|
|
>
|
|
<template #header>
|
|
<span>
|
|
{{ $t('general.information', { msg: $t('general.document') }) }}
|
|
</span>
|
|
</template>
|
|
|
|
<main class="q-px-md q-py-sm surface-1 row q-col-gutter-sm">
|
|
<SelectBranch
|
|
readonly
|
|
class="col-md-4 col-12"
|
|
:label="`${$t('creditNote.label.quotationRegisteredBranch')}`"
|
|
v-model:value="registeredBranchId"
|
|
/>
|
|
<SelectCustomer
|
|
readonly
|
|
simple
|
|
class="col-md-4 col-12"
|
|
:label="`${$t('creditNote.label.customer')}`"
|
|
v-model:value="customerId"
|
|
/>
|
|
<DatePicker
|
|
:label="$t('general.createdAt')"
|
|
class="col-md-4 col-6"
|
|
:model-value="issueDate || new Date(Date.now())"
|
|
:readonly
|
|
:disabled="!readonly"
|
|
/>
|
|
|
|
<DataDisplay
|
|
:clickable="!noLink"
|
|
class="col-md col-6"
|
|
style="padding-inline: 20px"
|
|
:label="$t('creditNote.label.quotationCode')"
|
|
:value="quotationCode"
|
|
@label-click="$emit('gotoQuotation')"
|
|
/>
|
|
|
|
<q-input
|
|
:readonly
|
|
:label="$t('creditNote.label.quotationWorkName')"
|
|
outlined
|
|
dense
|
|
class="col-md col-6"
|
|
v-model="quotationWorkName"
|
|
/>
|
|
<q-input
|
|
:readonly
|
|
:label="$t('quotation.contactName')"
|
|
outlined
|
|
dense
|
|
class="col-md col-6"
|
|
v-model="quotationContactName"
|
|
/>
|
|
<q-input
|
|
:readonly
|
|
:label="$t('general.telephone')"
|
|
outlined
|
|
dense
|
|
class="col-md col-6"
|
|
v-model="quotationContactTel"
|
|
/>
|
|
<q-input
|
|
:readonly
|
|
:label="$t('creditNote.label.quotationCreatedBy')"
|
|
outlined
|
|
dense
|
|
class="col-md col-6"
|
|
:disable="!readonly"
|
|
:model-value="quotationCreatedBy || '-'"
|
|
/>
|
|
</main>
|
|
</q-expansion-item>
|
|
</template>
|
|
<style scoped></style>
|