lesion/cosette
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

fix serving images

Browse source
This commit is contained in:
lesion 2022-08-25 18:57:12 +02:00
parent fc1d145698
commit f49fdd247a
5 changed files with 12 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
TODO.md
View file

@ -4,10 +4,12 @@
- [x] carousel in detail (o un modo per avere piu' immagini per un oggetto) - [x] carousel in detail (o un modo per avere piu' immagini per un oggetto)
- [x] stringo la pagina dei dettagli - [x] stringo la pagina dei dettagli
- [x] next / prev in page - [x] next / prev in page
- [ ] i tag da trimmare ed eliminare se son vuoti - [x] i tag da trimmare ed eliminare se son vuoti
- [ ] un load per next / prev
- [ ] favicon (solo perche' senza ci mette un sacco a fare il load)
- [x] form validation - [x] form validation
- [ ] ci vuole un modo per segnare che un oggetto e' stato preso! - [x] servire immagini anche x il deploy
- [ ] api rate (mi sa di no perche' tutti usciremo con lo stesso ip) - [ ] un loading per next / prev
- [ ] immagine del banner da scaricare in locale
- [ ] favicon (solo perche' senza ci mette un sacco a fare il load)
- [ ] ci vuole un modo per segnare che un oggetto e' stato preso? forse no se facciamo un'asta live
- [ ] deploy
- [ ] mail in lista - [ ] mail in lista

4
components/carousel.vue
View file

@ -6,8 +6,8 @@ const { images } = defineProps(['images'])
</script> </script>
<template> <template>
<div class='carousel max-h-100 bg-neutral'> <div class='carousel max-h-100 bg-neutral'>
<div v-for='image in images' class='carousel-item' :key='image'> <div v-for='image in images' class='carousel-item w-full' :key='image'>
<img class='carousel-center object-contain' :src="`/${image}`"> <img class='carousel-center object-contain' :src="`/api/image/${image}`">
</div> </div>
</div> </div>
</template> </template>

2
components/cosetta.vue
View file

@ -8,7 +8,7 @@ const { cosetta } = defineProps({
</script> </script>
<template> <template>
<div class="rounded overflow-hidden shadow-lg flex flex-col justify-between"> <div class="rounded overflow-hidden shadow-lg flex flex-col justify-between">
<img class="object-cover w-full h-48" :src="`/${cosetta.images[0]}`" alt="Mountain"> <img class="object-cover w-full h-48" :src="`/api/image/${cosetta.images[0]}`" alt="Mountain">
<div class="px-6 py-4 grow"> <div class="px-6 py-4 grow">
<nuxt-link :to="`/c/${cosetta.uuid}`"> <nuxt-link :to="`/c/${cosetta.uuid}`">
<h2 class="text-pink-500 card-title hover:underline uppercase mb-2 line-clamp-2" v-text='cosetta.name' /> <h2 class="text-pink-500 card-title hover:underline uppercase mb-2 line-clamp-2" v-text='cosetta.name' />

2
pages/index.vue
View file

@ -1,6 +1,6 @@
<script setup> <script setup>
const page = ref(0) const page = ref(0)
let { data, refresh } = await useFetch(() => `/api/cosette?page=${page.value}`) let { data, pending, refresh } = await useFetch(() => `/api/cosette?page=${page.value}`)
function next() { function next() {
page.value++ page.value++

2
server/services/upload-service.ts
View file

@ -5,7 +5,7 @@ import { v4 } from 'uuid'
import path from 'path' import path from 'path'
export const uploadService = () => { export const uploadService = () => {
let folderPath = './public/' let folderPath = './server/public/images/'
if (!fs.existsSync(folderPath)) { if (!fs.existsSync(folderPath)) {
fs.mkdirSync(folderPath, { recursive: true }) fs.mkdirSync(folderPath, { recursive: true })
} }