refactor: quotation remark toggle

This commit is contained in:
puriphatt 2024-11-27 15:02:35 +07:00
parent 696b465e7b
commit 91ecf7cf8f

View file

@ -245,7 +245,7 @@ const pageState = reactive({
quotationModal: false,
employeeModal: false,
productServiceModal: false,
remarkWrite: false,
remarkWrite: true,
});
const productList = ref<Partial<Record<ProductGroupId, Product[]>>>({});
@ -1425,12 +1425,6 @@ async function getWorkerFromCriteria(
<div class="surface-1 q-pa-md full-width">
<template v-if="true">
<!-- TODO: -->
<!-- {{ tempPaySplit }}
{{ tempPaySplitCount }}
<br />
{{ quotationFormData.paySplit }}
{{ quotationFormData.paySplitCount }} -->
<QuotationFormInfo
:view="view"
:installment-no="selectedInstallmentNo"
@ -1558,7 +1552,7 @@ async function getWorkerFromCriteria(
:style="`width: ${$q.screen.gt.xs ? '100%' : '63vw'}`"
:toolbar="[
['left', 'center', 'justify'],
['preview', 'write'],
['toggle'],
['clip'],
]"
:toolbar-toggle-color="readonly ? 'disabled' : 'primary'"
@ -1569,29 +1563,51 @@ async function getWorkerFromCriteria(
clip: {
icon: 'mdi-paperclip',
tip: 'Upload',
disable: readonly,
handler: () => console.log('upload'),
},
preview: {
icon: 'mdi-eye-outline',
label: 'Preview',
tip: 'Preview',
highlight: !pageState.remarkWrite,
handler: () => (pageState.remarkWrite = false),
},
write: {
icon: 'mdi-pencil-outline',
label: 'Write',
tip: 'Write',
highlight: pageState.remarkWrite,
handler: () => (pageState.remarkWrite = true),
},
}"
@update:model-value="
(v) => {
quotationFormData.remark = v;
}
"
/>
>
<template v-slot:toggle>
<div class="text-caption row no-wrap">
<MainButton
:disabled="readonly"
:solid="!pageState.remarkWrite"
icon="mdi-eye-outline"
color="0 0% 40%"
@click="pageState.remarkWrite = false"
style="padding: 0 var(--size-2)"
:style="{
color: pageState.remarkWrite
? 'hsl(0 0% 40%)'
: undefined,
}"
>
{{ $t('general.view', { msg: $t('general.example') }) }}
</MainButton>
<MainButton
:disabled="readonly"
:solid="pageState.remarkWrite"
icon="mdi-pencil-outline"
color="0 0% 40%"
@click="pageState.remarkWrite = true"
style="padding: 0 var(--size-2)"
:style="{
color: !pageState.remarkWrite
? 'hsl(0 0% 40%)'
: undefined,
}"
>
{{ $t('general.edit') }}
</MainButton>
</div>
</template>
</q-editor>
</div>
</q-expansion-item>
</template>