Merge pull request 'feature/photo-view' (!133) from wbuezas/hedera-web-mindshore:feature/photo-view into beta
gitea/hedera-web/pipeline/head This commit looks good Details

Reviewed-on: #133
Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
Javier Segarra 2025-04-02 21:39:52 +00:00
commit 94b405ffc7
1 changed files with 20 additions and 23 deletions

View File

@ -3,11 +3,10 @@ import { useI18n } from 'vue-i18n';
import { ref, onMounted, inject, reactive, computed } from 'vue'; import { ref, onMounted, inject, reactive, computed } from 'vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import VnForm from 'src/components/common/VnForm.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import useNotify from 'src/composables/useNotify.js'; import useNotify from 'src/composables/useNotify.js';
import FormModel from 'src/components/common/FormModel.vue';
const jApi = inject('jApi');
const api = inject('api'); const api = inject('api');
const { t } = useI18n(); const { t } = useI18n();
const { notify } = useNotify(); const { notify } = useNotify();
@ -33,7 +32,7 @@ const statusIcons = {
} }
}; };
const formInitialData = reactive({ const formInitialData = reactive({
schema: 'catalog', collectionFk: 'catalog',
updateMatching: true updateMatching: true
}); });
const imageCollections = ref([]); const imageCollections = ref([]);
@ -45,9 +44,8 @@ const isSubmitable = computed(() =>
const getImageCollections = async () => { const getImageCollections = async () => {
try { try {
imageCollections.value = await jApi.query( const { data } = await api.get('imageCollections');
'SELECT name, `desc` FROM imageCollection ORDER BY `desc`' imageCollections.value = data;
);
} catch (error) { } catch (error) {
console.error('Error getting image collections:', error); console.error('Error getting image collections:', error);
} }
@ -61,38 +59,36 @@ const onSubmit = async data => {
const filteredFiles = addedFiles.value.filter( const filteredFiles = addedFiles.value.filter(
file => file.uploadStatus === 'pending' file => file.uploadStatus === 'pending'
); );
const promises = filteredFiles.map((file, index) => { const promises = filteredFiles.map(async (file, index) => {
const fileIndex = filteredFiles[index].index; const fileIndex = filteredFiles[index].index;
addedFiles.value[fileIndex].uploadStatus = 'uploading'; addedFiles.value[fileIndex].uploadStatus = 'uploading';
const formData = new FormData(); const formData = new FormData();
formData.append('updateMatching', data.updateMatching); const now = new Date();
formData.append('image', file.file); const timestamp = now.getTime();
formData.append('name', file.name); const fileName = `${file.name}_${timestamp}`;
formData.append('schema', data.schema); formData.append('image', file.file, fileName);
formData.append('srv', 'json:image/upload');
return api({ await api.post('images/uploadPhotoAdmin', formData, {
method: 'post', params: {
url: location.origin, name: fileName,
data: formData, collection: data.collectionFk,
updateMatching: data.updateMatching
},
headers: { headers: {
'Content-Type': 'multipart/form-data' 'Content-Type': 'multipart/form-data'
} }
}); });
}); });
const results = await Promise.allSettled(promises); const results = await Promise.allSettled(promises);
results.forEach((result, index) => { results.forEach((result, index) => {
const fileIndex = filteredFiles[index].index; const fileIndex = filteredFiles[index].index;
addedFiles.value[fileIndex].uploadStatus = result.status; addedFiles.value[fileIndex].uploadStatus = result.status;
if (result.status === 'rejected') { if (result.status === 'rejected') {
addedFiles.value[fileIndex].errorMessage = t( addedFiles.value[fileIndex].errorMessage = t(
result.reason?.response?.data?.data?.message result.reason?.response?.data?.data?.message
); );
} }
}); });
const allSuccessful = results.every( const allSuccessful = results.every(
result => result.status === 'fulfilled' result => result.status === 'fulfilled'
); );
@ -139,16 +135,17 @@ onMounted(async () => getImageCollections());
<template> <template>
<QPage class="vn-w-sm"> <QPage class="vn-w-sm">
<VnForm <FormModel
ref="vnFormRef" ref="vnFormRef"
:default-actions="false" :default-actions="false"
:form-initial-data="formInitialData" :form-initial-data="formInitialData"
separation-between-inputs="md" separation-between-inputs="md"
show-bottom-actions show-bottom-actions
:save-fn="onSubmit"
> >
<template #form="{ data }"> <template #form="{ data }">
<VnSelect <VnSelect
v-model="data.schema" v-model="data.collectionFk"
:label="t('collection')" :label="t('collection')"
option-label="desc" option-label="desc"
option-value="name" option-value="name"
@ -269,7 +266,7 @@ onMounted(async () => getImageCollections());
data-cy="photoUploadSubmitBtn" data-cy="photoUploadSubmitBtn"
/> />
</template> </template>
</VnForm> </FormModel>
</QPage> </QPage>
</template> </template>