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, quotationModal: false,
employeeModal: false, employeeModal: false,
productServiceModal: false, productServiceModal: false,
remarkWrite: false, remarkWrite: true,
}); });
const productList = ref<Partial<Record<ProductGroupId, Product[]>>>({}); const productList = ref<Partial<Record<ProductGroupId, Product[]>>>({});
@ -1425,12 +1425,6 @@ async function getWorkerFromCriteria(
<div class="surface-1 q-pa-md full-width"> <div class="surface-1 q-pa-md full-width">
<template v-if="true"> <template v-if="true">
<!-- TODO: -->
<!-- {{ tempPaySplit }}
{{ tempPaySplitCount }}
<br />
{{ quotationFormData.paySplit }}
{{ quotationFormData.paySplitCount }} -->
<QuotationFormInfo <QuotationFormInfo
:view="view" :view="view"
:installment-no="selectedInstallmentNo" :installment-no="selectedInstallmentNo"
@ -1558,7 +1552,7 @@ async function getWorkerFromCriteria(
:style="`width: ${$q.screen.gt.xs ? '100%' : '63vw'}`" :style="`width: ${$q.screen.gt.xs ? '100%' : '63vw'}`"
:toolbar="[ :toolbar="[
['left', 'center', 'justify'], ['left', 'center', 'justify'],
['preview', 'write'], ['toggle'],
['clip'], ['clip'],
]" ]"
:toolbar-toggle-color="readonly ? 'disabled' : 'primary'" :toolbar-toggle-color="readonly ? 'disabled' : 'primary'"
@ -1569,29 +1563,51 @@ async function getWorkerFromCriteria(
clip: { clip: {
icon: 'mdi-paperclip', icon: 'mdi-paperclip',
tip: 'Upload', tip: 'Upload',
disable: readonly,
handler: () => console.log('upload'), 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=" @update:model-value="
(v) => { (v) => {
quotationFormData.remark = 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> </div>
</q-expansion-item> </q-expansion-item>
</template> </template>