refactor: edit ui

This commit is contained in:
Thanaphon Frappet 2024-12-17 13:20:19 +07:00
parent 88f8d99baa
commit 2debf3b6e9

View file

@ -2,7 +2,6 @@
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { storeToRefs } from 'pinia'; import { storeToRefs } from 'pinia';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { QFile } from 'quasar';
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue'; import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue';
import { import {
dialogCheckData, dialogCheckData,
@ -169,8 +168,7 @@ const selectedWorker = ref<
})[] })[]
>([]); >([]);
const workerList = ref<Employee[]>([]); const workerList = ref<Employee[]>([]);
const fileAcceptance = ref<File | null>();
const refQFileAcceptance = ref<InstanceType<typeof QFile>>();
const selectedProductGroup = ref(''); const selectedProductGroup = ref('');
const selectedInstallmentNo = ref<number[]>([]); const selectedInstallmentNo = ref<number[]>([]);
const installmentAmount = ref<number>(0); const installmentAmount = ref<number>(0);
@ -910,8 +908,6 @@ async function getAttachment() {
}); });
if (attachment && attachment.length > 0) { if (attachment && attachment.length > 0) {
await checkFileAcceptance(attachment);
attachmentData.value = attachmentData.value.filter((item) => attachmentData.value = attachmentData.value.filter((item) =>
attachment.includes(item.name), attachment.includes(item.name),
); );
@ -1193,22 +1189,6 @@ async function getWorkerFromCriteria(
return true; return true;
} }
async function checkFileAcceptance(attachment: string[]) {
const nameFile = `acceptance-${quotationFormData.value.id}`;
const isFound = attachment.findIndex((v) => v.includes(nameFile));
if (isFound !== -1) {
const blob = new Blob([''], { type: 'application/pdf' }); // blob
fileAcceptance.value = new File([blob], nameFile, {
type: 'application/pdf',
});
} else fileAcceptance.value = undefined;
}
function viewAttachment(url: string) {
window.open(url, '_blank');
}
</script> </script>
<template> <template>
@ -1676,48 +1656,31 @@ function viewAttachment(url: string) {
</template> </template>
<div class="surface-1 q-pa-md flex" style="gap: var(--size-2)"> <div class="surface-1 q-pa-md flex" style="gap: var(--size-2)">
<q-file <SelectInput
style="width: 200px" style="max-width: 250px"
dense class=""
outlined incremental
ref="refQFileAcceptance" v-model="templateForm"
:model-value="fileAcceptance" id="quotation-branch"
@update:model-value=" :option="templateFormOption"
(file) => { :label="$t('quotation.templateForm')"
fileAcceptance = file; :option-label="locale === 'eng' ? 'labelEN' : 'label'"
console.log(file);
}
"
/> />
<MainButton <MainButton
outlined outlined
icon="mdi-play-box-outline" icon="mdi-play-box-outline"
color="207 96% 32%" color="207 96% 32%"
@click=" @click="() => {}"
async () => {
if (fileAcceptance === undefined) return;
const result = await api.get<string>(
`quotation/${quotationFormData.id || ''}/attachment/${fileAcceptance?.name}`,
);
viewAttachment(result.data);
}
"
> >
{{ $t('general.view', { msg: $t('general.example') }) }} {{ $t('general.view', { msg: $t('general.example') }) }}
</MainButton> </MainButton>
<MainButton <MainButton
solid solid
icon="mdi-file-upload" icon="mdi-pencil-outline"
color="207 96% 32%" color="207 96% 32%"
@click=" @click="() => {}"
() => {
if (!refQFileAcceptance) return;
refQFileAcceptance.pickFiles();
}
"
> >
{{ $t('general.upload') }} {{ $t('general.designForm') }}
</MainButton> </MainButton>
</div> </div>
</q-expansion-item> </q-expansion-item>