sembra bene
This commit is contained in:
parent
c1290ce317
commit
9642cdc906
10 changed files with 65 additions and 32 deletions
3
app/router.options.js
Normal file
3
app/router.options.js
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
export default {
|
||||
scrollBehavior: () => ({ left: 0, top: 0, behavior: 'smooth' })
|
||||
}
|
||||
6
components.d.ts
vendored
6
components.d.ts
vendored
|
|
@ -8,6 +8,12 @@ export {}
|
|||
declare module '@vue/runtime-core' {
|
||||
export interface GlobalComponents {
|
||||
'IconIc:baselineAdd': typeof import('~icons/ic/baseline-add')['default']
|
||||
'IconIc:baselineArrow': typeof import('~icons/ic/baseline-arrow')['default']
|
||||
'IconIc:baselineArrowLeft': typeof import('~icons/ic/baseline-arrow-left')['default']
|
||||
'IconIc:baselineChevronLeft': typeof import('~icons/ic/baseline-chevron-left')['default']
|
||||
'IconIc:baselineChevronPrev': typeof import('~icons/ic/baseline-chevron-prev')['default']
|
||||
'IconIc:baselineChevronRight': typeof import('~icons/ic/baseline-chevron-right')['default']
|
||||
'IconIc:baselineNext': typeof import('~icons/ic/baseline-next')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
RouterView: typeof import('vue-router')['RouterView']
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,12 +8,12 @@ const { cosetta } = defineProps({
|
|||
</script>
|
||||
<template>
|
||||
<div class="rounded overflow-hidden shadow-lg">
|
||||
<img class="object-cover w-full max-h-48" :src="`src/public/${cosetta.images[0]}`" alt="Mountain">
|
||||
<img class="object-cover w-full h-48" :src="`src/public/${cosetta.images[0]}`" alt="Mountain">
|
||||
<div class="px-6 py-4">
|
||||
<nuxt-link :to="`/c/${cosetta.uuid}`">
|
||||
<h2 class="text-indigo-500 card-title hover:underline uppercase mb-2" v-text='cosetta.name' />
|
||||
<h2 class="text-pink-500 card-title hover:underline uppercase mb-2" v-text='cosetta.name' />
|
||||
</nuxt-link>
|
||||
<p class="text-gray-700 text-base" v-text='cosetta.description' />
|
||||
<p class="text-gray-700 text-base line-clamp-2" v-text='cosetta.description' />
|
||||
</div>
|
||||
<div class="px-6 pt-4 pb-2">
|
||||
<span v-for='tag in cosetta.tags' :key='tag' class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2" v-text='tag'/>
|
||||
|
|
|
|||
|
|
@ -2,9 +2,7 @@
|
|||
<section class="w-full mx-auto bg-nordic-gray-light flex pt-12 md:pt-0 md:items-center bg-cover bg-right" style="max-width:1600px; height: 32rem; background-image: url('https://picsum.photos/id/1072/3872/2592?grayscale')">
|
||||
<div class="container mx-auto">
|
||||
<div class="flex flex-col w-full lg:w-1/2 justify-center items-start px-6 tracking-wide">
|
||||
<a class="text-xl inline-block no-underline border-b border-gray-600 leading-relaxed hover:text-black hover:border-black" href="#">cerco</a>
|
||||
<a class="text-xl inline-block no-underline border-b border-gray-600 leading-relaxed hover:text-black hover:border-black" href="#">offro</a>
|
||||
<h1 class="text-black text-2xl my-4">Cosette</h1>
|
||||
<h1 class="text-white font-extrabold text-4xl my-4">Cosette</h1>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@
|
|||
"unplugin-vue-components": "^0.22.4"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tailwindcss/line-clamp": "^0.4.0",
|
||||
"better-sqlite3": "^7.6.2",
|
||||
"multer": "^1.4.5-lts.1",
|
||||
"uuid": "^8.3.2"
|
||||
|
|
|
|||
|
|
@ -1,31 +1,38 @@
|
|||
<script setup>
|
||||
const cosette = await $fetch('/api/cosette')
|
||||
const page = ref(0)
|
||||
let { data, refresh } = await useFetch(() => `/api/cosette?page=${page.value}`)
|
||||
|
||||
function next () {
|
||||
page.value++
|
||||
refresh()
|
||||
}
|
||||
|
||||
function prev () {
|
||||
page.value--
|
||||
refresh()
|
||||
}
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<section class="bg-white py-8">
|
||||
|
||||
<Upload />
|
||||
<Hero/>
|
||||
|
||||
<Hero />
|
||||
<div class="container mx-auto flex items-center flex-wrap pt-4 pb-12 px-2">
|
||||
<nav id="store" class="w-full z-30 top-0 px-6 py-1">
|
||||
<div class="w-full container mx-auto flex flex-wrap items-center justify-between mt-0 px-2 py-3">
|
||||
<a class="uppercase tracking-wide no-underline hover:no-underline font-bold text-yellow text-xl" href="https://it.hackmeeting.org">Hackmeeting 0x19</a>
|
||||
<div class="flex items-center" id="store-nav-content">
|
||||
<a class="pl-3 inline-block no-underline hover:text-black modal-button" href="#my-modal">
|
||||
<Icon-ic:baseline-add/>
|
||||
</a>
|
||||
<a class="pl-3 inline-block no-underline hover:text-black" href="#">
|
||||
<svg class="fill-current hover:text-black" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
|
||||
<path d="M10,18c1.846,0,3.543-0.635,4.897-1.688l4.396,4.396l1.414-1.414l-4.396-4.396C17.365,13.543,18,11.846,18,10 c0-4.411-3.589-8-8-8s-8,3.589-8,8S5.589,18,10,18z M10,4c3.309,0,6,2.691,6,6s-2.691,6-6,6s-6-2.691-6-6S6.691,4,10,4z" />
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p>Ci sono <strong>{{data.details.count}}</strong> cosette in tutto, sei a pagina {{data.details.page+1}} di {{data.details.n_page}}. Se vuoi puoi</p>
|
||||
<a class="text-orange-700 hover:underline flex" href="#my-modal"><Icon-ic:baseline-add/> aggiungere una cosetta</a>
|
||||
</div>
|
||||
<div class='container mx-auto'>
|
||||
<nav>
|
||||
<button v-if='data.details.prev' @click='prev'>
|
||||
<Icon-ic:baseline-chevron-left style='font-size: 40px'/>
|
||||
</button>
|
||||
<button v-if='data.details.next' @click='next'>
|
||||
<Icon-ic:baseline-chevron-right style='font-size: 40px'/>
|
||||
</button>
|
||||
</nav>
|
||||
<div class="p-10 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 gap-5">
|
||||
<Cosetta v-for='cosetta in cosette' :key='cosetta.id' :cosetta='cosetta' />
|
||||
|
||||
<div class="md:p-5 p-1 grid grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-3 gap-5">
|
||||
<Cosetta v-for='cosetta in data.cosette' :key='cosetta.id' :cosetta='cosetta' />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
import { getAll } from '../controller'
|
||||
import { useQuery } from 'h3'
|
||||
|
||||
export default defineEventHandler(event => {
|
||||
return getAll()
|
||||
const params = useQuery(event)
|
||||
return getAll(params)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ const db = new Database('./cosette.db')
|
|||
function load () {
|
||||
db.pragma('journal_mode = WAL')
|
||||
db.exec('CREATE TABLE IF NOT EXISTS cosette (uuid TEXT PRIMARY KEY, name TEXT NOT NULL, description TEXT, tags TEXT, images TEXT, updatedAt DATETIME DEFAULT CURRENT_TIMESTAMP)')
|
||||
db.exec('CREATE INDEX cosette_updated_at_index ON cosette (updatedAt)')
|
||||
db.exec('CREATE TABLE IF NOT EXISTS chan (uuid TEXT PRIMARY KEY, cosetta_uuid REFERENCES cosette(uuid), message TEXT, updatedAt DATETIME DEFAULT CURRENT_TIMESTAMP)')
|
||||
}
|
||||
// TODO: da gestire in qualche modo all'avvio
|
||||
|
|
@ -31,14 +32,21 @@ export function get (uuid) {
|
|||
return { cosetta, comments }
|
||||
}
|
||||
|
||||
export function getAll (limit=0, offset=0, tags=[], search='') {
|
||||
const q = db.prepare('SELECT * FROM cosette')
|
||||
const ret = q.all()
|
||||
return ret.map(r => {
|
||||
export function getAll ({ page }) {
|
||||
page = Number(page || 0)
|
||||
const perPage = 3
|
||||
let query = 'SELECT * FROM cosette ORDER BY updatedAt DESC LIMIT ? OFFSET ?'
|
||||
const q = db.prepare(query)
|
||||
const ret = q.all(perPage, perPage * page)
|
||||
const cosette = ret.map(r => {
|
||||
r.tags = r.tags ? JSON.parse(r.tags) : []
|
||||
r.images = r.images ? JSON.parse(r.images) : []
|
||||
return r
|
||||
})
|
||||
|
||||
const count = db.prepare('SELECT COUNT(*) count from cosette').get().count
|
||||
|
||||
return { cosette, details: { page, count, prev: page !== 0, next: count > perPage*(page+1), n_page: Math.ceil(count / perPage) } }
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -4,5 +4,8 @@ module.exports = {
|
|||
theme: {
|
||||
extend: {},
|
||||
},
|
||||
plugins: [require('daisyui')],
|
||||
plugins: [
|
||||
require('daisyui'),
|
||||
require('@tailwindcss/line-clamp'),
|
||||
],
|
||||
}
|
||||
|
|
|
|||
|
|
@ -685,6 +685,11 @@
|
|||
estree-walker "^2.0.1"
|
||||
picomatch "^2.2.2"
|
||||
|
||||
"@tailwindcss/line-clamp@^0.4.0":
|
||||
version "0.4.0"
|
||||
resolved "https://registry.yarnpkg.com/@tailwindcss/line-clamp/-/line-clamp-0.4.0.tgz#03353e31e77636b785f2336e8c978502cec1de81"
|
||||
integrity sha512-HQZo6gfx1D0+DU3nWlNLD5iA6Ef4JAXh0LeD8lOGrJwEDBwwJNKQza6WoXhhY1uQrxOuU8ROxV7CqiQV4CoiLw==
|
||||
|
||||
"@trysound/sax@0.2.0":
|
||||
version "0.2.0"
|
||||
resolved "https://registry.yarnpkg.com/@trysound/sax/-/sax-0.2.0.tgz#cccaab758af56761eb7bf37af6f03f326dd798ad"
|
||||
|
|
|
|||
Loading…
Reference in a new issue