verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 63 Releases Wiki Activity

Make input file clip icon work

This commit is contained in:
William Buezas 2024-01-31 10:49:29 -03:00
parent b9dcbc18ca
commit 0e32138714
1 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/EditPictureForm.vue
View File

@ -74,7 +74,7 @@ const viewportTypes = [
const uploadMethodSelected = ref('computer'); const uploadMethodSelected = ref('computer');
const viewPortTypeSelected = ref(viewportTypes[0]); const viewPortTypeSelected = ref(viewportTypes[0]);
const inputFileRef = ref(null);
const allowedContentTypes = ref(''); const allowedContentTypes = ref('');
const photoContainerRef = ref(null); const photoContainerRef = ref(null);
const editor = ref(null); const editor = ref(null);
@ -86,6 +86,10 @@ const newPhoto = reactive({
blob: null, blob: null,
}); });
const openInputFile = () => {
inputFileRef.value.pickFiles();
};
const displayEditor = () => { const displayEditor = () => {
const viewportType = viewPortTypeSelected.value; const viewportType = viewPortTypeSelected.value;
const viewport = viewportType.viewport; const viewport = viewportType.viewport;
@ -253,21 +257,26 @@ const makeRequest = async () => {
<div class="col"> <div class="col">
<QFile <QFile
v-if="uploadMethodSelected === 'computer'" v-if="uploadMethodSelected === 'computer'"
ref="inputFileRef"
:label="t('File')" :label="t('File')"
:multiple="false" :multiple="false"
v-model="newPhoto.files" v-model="newPhoto.files"
@update:model-value="updatePhotoPreview($event)" @update:model-value="updatePhotoPreview($event)"
:accept="allowedContentTypes" :accept="allowedContentTypes"
class="required" class="required cursor-pointer"
> >
<template #append> <template #append>
<QIcon <QIcon
name="vn:attach" name="vn:attach"
class="cursor-pointer q-mr-sm" class="cursor-pointer q-mr-sm non-selectable"
@click="openInputFile()"
> >
<QTooltip>{{ t('Select a file') }}</QTooltip> <QTooltip>{{ t('Select a file') }}</QTooltip>
</QIcon> </QIcon>
<QIcon name="info" class="cursor-pointer"> <QIcon
name="info"
class="cursor-pointer non-selectable"
>
<QTooltip>{{ <QTooltip>{{
t( t(
'components.editPictureForm.allowedFilesText', 'components.editPictureForm.allowedFilesText',