84 lines
2.6 KiB
Vue
84 lines
2.6 KiB
Vue
<script setup>
|
|
import { Button } from '@/components/ui/button/index.js'
|
|
import { CirclePlus, Pencil, Trash, MapPin } from 'lucide-vue-next'
|
|
import { useAdminPostsStore } from '@/stores/adminPosts.js'
|
|
import { onMounted } from 'vue'
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCaption,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow
|
|
} from '@/components/ui/table/index.js'
|
|
|
|
const adminPostsStore = useAdminPostsStore()
|
|
|
|
onMounted(() => {
|
|
adminPostsStore.fetchPosts()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="grid grid-cols-3 grid-rows-1 mt-28 sm:mt-20 w-full justify-center items-center gap-4">
|
|
<div class="col-span-3 col-start-1 lg:col-span-1 lg:col-start-2 mx-5 lg:mx-0">
|
|
<h1 class="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl mb-6">Admin</h1>
|
|
<h2
|
|
class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0"
|
|
>
|
|
Localisation
|
|
</h2>
|
|
<RouterLink to="/admin/send-location">
|
|
<Button class="my-4">
|
|
<MapPin class="mr-2" />
|
|
Envoyer localisation
|
|
</Button>
|
|
</RouterLink>
|
|
<h2
|
|
class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors first:mt-0"
|
|
>
|
|
Posts
|
|
</h2>
|
|
<RouterLink to="/admin/post/create">
|
|
<Button class="my-4">
|
|
<CirclePlus class="mr-2" />
|
|
Créer
|
|
</Button>
|
|
</RouterLink>
|
|
<Table>
|
|
<TableCaption>List of posts</TableCaption>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>ID</TableHead>
|
|
<TableHead>Date</TableHead>
|
|
<TableHead>City</TableHead>
|
|
<TableHead>Country</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
<TableRow v-for="post in adminPostsStore.posts" :key="post.id">
|
|
<TableCell>{{ post.id }}</TableCell>
|
|
<TableCell>{{ post.date }}</TableCell>
|
|
<TableCell>{{ post.city }}</TableCell>
|
|
<TableCell>{{ post.country }}</TableCell>
|
|
<TableCell>
|
|
<div class="flex gap-2">
|
|
<RouterLink :to="{ name: 'admin_edit_post', params: { id: post.id } }">
|
|
<Button>
|
|
<Pencil size="16" />
|
|
</Button>
|
|
</RouterLink>
|
|
<Button @click="adminPostsStore.deletePost(post.id)">
|
|
<Trash size="16" />
|
|
</Button>
|
|
</div>
|
|
</TableCell>
|
|
</TableRow>
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|