chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: add Spinners

Browse source
This commit is contained in:
Net 2024-08-27 19:36:13 +07:00 • committed by Methapon Metanipat
parent 5fdfa232e7
commit 51fd9e0c84
1 changed files with 24 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

39
src/components/upload-file/UploadFile.vue
View file

@ -16,6 +16,7 @@ const file = defineModel<
}); });
const currentFile = computed(() => file.value.at(currentIndex.value)); const currentFile = computed(() => file.value.at(currentIndex.value));
const statusOcr = defineModel<boolean>('statusOcr', { default: false });
const currentIndex = ref(0); const currentIndex = ref(0);
const scale = ref(1); const scale = ref(1);
@ -25,7 +26,7 @@ const currentIndexDropdownList = ref(0);
const props = withDefaults( const props = withDefaults(
defineProps<{ defineProps<{
treeFile: { lable: string; file: { lable: string }[] }[]; treeFile: { label: string; file: { label: string }[] }[];
dropdownList?: { label: string; value: string }[]; dropdownList?: { label: string; value: string }[];
hideAction?: boolean; hideAction?: boolean;
}>(), }>(),
@ -70,6 +71,8 @@ function change(e: Event) {
}); });
} }
statusOcr.value = true;
emit( emit(
'sendOcr', 'sendOcr',
props.dropdownList?.[currentIndexDropdownList.value].value || '', props.dropdownList?.[currentIndexDropdownList.value].value || '',
@ -121,8 +124,8 @@ const { pdf, pages } = usePDF(computed(() => currentFile.value?.url));
<div class="full-height bordered-l bordered-b q-pa-sm"> <div class="full-height bordered-l bordered-b q-pa-sm">
<q-tree <q-tree
:nodes="treeFile || []" :nodes="treeFile || []"
node-key="lable" node-key="label"
label-key="lable" label-key="label"
children-key="file" children-key="file"
selected-color="primary" selected-color="primary"
v-model:selected="currentFileSelected" v-model:selected="currentFileSelected"
@ -185,22 +188,28 @@ const { pdf, pages } = usePDF(computed(() => currentFile.value?.url));
<div <div
class="flex flex-center surface-2 bordered-l bordered-r bordered-b full-height scroll" class="flex flex-center surface-2 bordered-l bordered-r bordered-b full-height scroll"
> >
<VuePDF <template v-if="statusOcr">
v-if=" <q-spinner color="primary" size="3em" :thickness="2" />
currentFile?.url?.split('?').at(0)?.endsWith('.pdf') || </template>
currentFile?.file?.type === 'application/pdf'
"
class="q-py-md"
:pdf="pdf"
:page="page"
:scale="scale"
/>
<q-img v-else class="q-py-md full-width" :src="currentFile?.url" /> <template v-else>
<VuePDF
v-if="
currentFile?.url?.split('?').at(0)?.endsWith('.pdf') ||
currentFile?.file?.type === 'application/pdf'
"
class="q-py-md"
:pdf="pdf"
:page="page"
:scale="scale"
/>
<q-img v-else class="q-py-md full-width" :src="currentFile?.url" />
</template>
</div> </div>
</div> </div>
<div class="col-4"> <div class="col-5">
<div <div
class="bordered row items-center justify-between q-pa-sm" class="bordered row items-center justify-between q-pa-sm"
style="height: 50px" style="height: 50px"