next/pages/bands.vue

36 lines
968 B
Vue

<script lang="ts" setup>
import { IBand } from '~/models/band';
import icon from '~/components/icon.vue';
const {data} = await useApiFetch("/bands/all")
const bands = data as Ref<IBand[]>
const hider = (id: number) => (e) => {
bands.value.splice(bands.value.findIndex(a => a._id == id), 1)
useApiFetch("/user/hide", {
body: {
authors: [],
bands: [id]
},
method: "post"
})
}
</script>
<template>
<a-list :grid="{ gutter: 5, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: 7 }" v-model:data-source="bands">
<template #renderItem="{ item } ">
<a-list-item>
<a-row :gutter="[10, 10]">
<a-col>
<NuxtLink :to="`/band/${item._id}`">
{{ item.name }}
</NuxtLink>
</a-col>
<a-col>
<a @click="hider(item._id)">
<icon :istyle="'regular'" name="eye-slash" :size="12"/>
</a>
</a-col>
</a-row>
</a-list-item>
</template>
</a-list>
</template>