SW/geovisio-website
2
0
Fork 0
forked from Ivasoft/geovisio-website
Code Pull Requests Packages Releases Activity

some fix

Browse Source
This commit is contained in:
Andreani Jean
2023-06-28 14:45:36 +02:00
parent f5a936fad6
commit d1207e656b
5 changed files with 100 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Button.vue
View File

@@ -86,14 +86,6 @@ defineProps({
.text {
margin-left: 1rem;
}
&.disabled {
color: var(--grey-pale);
border-color: var(--grey-pale);
cursor: not-allowed;
.icon {
color: var(--grey-pale);
}
}
}
.no-text {
height: 3rem;
@@ -149,7 +141,7 @@ defineProps({
position: absolute;
bottom: -100%;
visibility: hidden;
width: 15rem;
width: 18rem;
right: 0;
@include text(xss-regular);
}
@@ -157,4 +149,12 @@ defineProps({
.default:hover .tooltip-button {
visibility: visible;
}
.disabled {
color: var(--grey-pale);
border-color: var(--grey-pale);
cursor: not-allowed;
.icon {
color: var(--grey-pale);
}
}
</style>

1
src/components/InputCheckbox.vue
View File

@@ -79,5 +79,6 @@ function updateValue(value: boolean): void {
.label {
cursor: pointer;
margin-left: 0.5rem;
@include text(s-regular);
}
</style>

2
src/locales/fr.json
View File

@@ -35,7 +35,7 @@
"hide_sequence_tooltip": "Masque la séquence sur la carte",
"delete_sequence_tooltip": "Supprime définitivement la séquence",
"hide_photo_tooltip": "Masque les photos sur la carte",
"delete_photo_tooltip": "Supprime définitivement la photo",
"delete_photo_tooltip": "Supprime définitivement les photo",
"created": "Versement :",
"taken": "Prise de vue :",
"duration": "Durée :",

41
src/utils/sequence.ts Normal file
View File

@@ -0,0 +1,41 @@
import axios from 'axios'
import type {
ResponseUserPhotoInterface,
ResponseUserSequenceInterface
} from '../views/interfaces/MySequenceView'
function deleteACollectionItem(
collectionId: string | string[],
itemId: string
): Promise<unknown> {
return axios.delete(`api/collections/${collectionId}/items/${itemId}`)
}
function patchACollectionItem(
isVisible: string,
collectionId: string | string[],
itemId: string
): Promise<unknown> {
return axios.patch(`api/collections/${collectionId}/items/${itemId}`, {
visible: isVisible
})
}
async function fetchCollectionItems(collectionId: string | string[]): Promise<{
data: { features: [ResponseUserPhotoInterface] }
}> {
return await axios.get(`api/collections/${collectionId}/items`)
}
async function fetchCollection(collectionId: string | string[]): Promise<{
data: ResponseUserSequenceInterface
}> {
return await axios.get(`api/collections/${collectionId}`)
}
export {
deleteACollectionItem,
patchACollectionItem,
fetchCollectionItems,
fetchCollection
}

111
src/views/MySequenceView.vue
View File

@@ -81,21 +81,25 @@
/>
</div>
<div class="action-buttons">
<div v-if="false" class="button-delete">
<Button look="button--red" icon="bi bi-trash" />
</div>
<Button
look="button--red"
icon="bi bi-trash"
:tooltip="$t('pages.sequence.delete_photo_tooltip')"
:disabled="!imagesToDelete.length"
@trigger="patchOrDeleteCollectionItems('DELETE')"
/>
<div class="button-hidde">
<Button
look="button--white"
:icon="
imagesToDeleteStatus === 'hidden' ||
imagesToDeleteHaveDifferentStatus
imagesSelectedHaveDifferentStatus
? 'bi bi-eye'
: 'bi bi-eye-slash'
"
:tooltip="$t('pages.sequence.hide_photo_tooltip')"
:disabled="!imagesToDelete.length"
@trigger="patchCollectionItems"
@trigger="patchOrDeleteCollectionItems('PATCH')"
/>
</div>
</div>
@@ -136,14 +140,18 @@ import InputCheckbox from '@/components/InputCheckbox.vue'
import Loader from '@/components/Loader.vue'
import ImageItem from '@/components/ImageItem.vue'
import { formatDate, durationCalc } from '@/utils/dates'
import {
deleteACollectionItem,
patchACollectionItem,
fetchCollectionItems,
fetchCollection
} from '@/utils/sequence'
import { fetchMapAndViewer } from '@/utils/mapAndViewer'
import type {
ResponseUserPhotoInterface,
ResponseUserSequenceInterface,
CheckboxInterface,
UserSequenceInterface
} from './interfaces/MySequenceView'
import axios from 'axios'
import { fetchMapAndViewer } from '@/utils/mapAndViewer'
const { t } = useI18n()
const route = useRoute()
@@ -179,15 +187,12 @@ const imagesToDeleteStatus = computed((): string => {
}
return 'hidden'
})
const imagesToDeleteHaveDifferentStatus = computed((): boolean => {
console.log('DELETE IMAGES', fullImagesToDelete())
const imagesSelectedHaveDifferentStatus = computed((): boolean => {
function filterByStatus(status: string): ResponseUserPhotoInterface[] {
return fullImagesToDelete().filter((el) => {
return el.properties['geovisio:status'] === status
})
}
return (
filterByStatus('hidden').length > 0 && filterByStatus('ready').length > 0
)
@@ -208,8 +213,8 @@ const selectedText = computed((): string =>
onMounted(async () => {
try {
const fetchAllCollectionInfo = await Promise.all([
fetchCollection(),
fetchCollectionItems()
fetchCollection(route.params.id),
fetchCollectionItems(route.params.id)
])
const collection = fetchAllCollectionInfo[0].data
const collectionItems = fetchAllCollectionInfo[1].data.features
@@ -312,12 +317,6 @@ async function selectImageAndMove(
}
}
async function fetchCollection(): Promise<{
data: ResponseUserSequenceInterface
}> {
return await axios.get(`api/collections/${route.params.id}`)
}
function spliceIntoChunks(arr: string[], chunkSize: number) {
const res = []
arr = ([] as string[]).concat(...arr)
@@ -328,56 +327,52 @@ function spliceIntoChunks(arr: string[], chunkSize: number) {
return res
}
function patchCollection(isVisible: string, id: string): any {
const itemPatched = axios.patch(
`api/collections/${route.params.id}/items/${id}`,
{
visible: isVisible
}
)
return itemPatched
}
async function patchCollectionItems(): Promise<void> {
async function patchOrDeleteCollectionItems(
requestType: string
): Promise<void> {
patchOrDeleteIsLoading.value = true
toastText.value = ''
const chunksToDelete = spliceIntoChunks(imagesToDelete.value, 4)
console.log(imagesToDeleteHaveDifferentStatus.value)
const chunksItems = spliceIntoChunks(imagesToDelete.value, 4)
try {
let itemsPatch: any = []
if (imagesToDeleteHaveDifferentStatus.value) {
for (let el of chunksToDelete) {
itemsPatch = [
...itemsPatch,
let items: unknown[] = []
if (imagesSelectedHaveDifferentStatus.value) {
for (let el of chunksItems) {
items = [
...items,
...(await Promise.all(
el.map((ele) => {
return patchCollection('true', ele)
if (requestType === 'PATCH') {
return patchACollectionItem('true', route.params.id, ele)
}
return deleteACollectionItem(route.params.id, ele)
})
))
]
console.log('DIIIFFF', itemsPatch)
}
} else {
for (let el of chunksToDelete) {
itemsPatch = [
...itemsPatch,
for (let el of chunksItems) {
items = [
...items,
...(await Promise.all(
el.map((ele) => {
const imageToDelete = userPhotos.value.find(
(elem) => elem.id === ele
)
const isVisible =
imageToDelete?.properties['geovisio:status'] === 'ready'
? 'false'
: 'true'
return patchCollection(isVisible, ele)
if (requestType === 'PATCH') {
const imageToDelete = userPhotos.value.find(
(elem) => elem.id === ele
)
const isVisible =
imageToDelete?.properties['geovisio:status'] === 'ready'
? 'false'
: 'true'
return patchACollectionItem(isVisible, route.params.id, ele)
}
return deleteACollectionItem(route.params.id, ele)
})
))
]
console.log('NOOOO', itemsPatch)
}
}
console.log('EEEENNNNDD', itemsPatch)
itemsPatch.map((el: any) => {
items.map((el: any) => {
console.log(el)
const userPhotosIndex = userPhotos.value.findIndex(
(ele): boolean => ele.id === el.data.id
)
@@ -396,12 +391,6 @@ async function patchCollectionItems(): Promise<void> {
}
}
async function fetchCollectionItems(): Promise<{
data: { features: [ResponseUserPhotoInterface] }
}> {
return await axios.get(`api/collections/${route.params.id}/items`)
}
function formatSequenceDuration(temporal: Date[]): string {
let timer = ''
if (durationCalc(temporal[1], temporal[0], 'hours') > 0) {
@@ -527,10 +516,6 @@ function formatSequenceDuration(temporal: Date[]): string {
display: flex;
align-items: center;
}
.button-delete {
margin-right: 1rem;
margin-left: 1rem;
}
.button-hidde {
margin-right: 1rem;
margin-left: 1rem;