73 lines
1.8 KiB
Vue
73 lines
1.8 KiB
Vue
<script lang="ts" setup>
|
|
import { IBand } from "@models/band";
|
|
import icon from "~/components/icon.vue";
|
|
import { subscriptions, bp } from "@client/listActions";
|
|
import { IUser } from "@models/user";
|
|
|
|
const { data: bands } = (await useApiFetch<NonNullable<IBand[]>>("/band/all")) as unknown as { data: Ref<IBand[]> };
|
|
|
|
const { data: rd }: { data: any } = useAuth();
|
|
const refresh = async () => {
|
|
await useAuth().getSession({ force: true });
|
|
rd.value = useAuth().data.value;
|
|
};
|
|
|
|
const hider = subscriptions;
|
|
if (bands.value == null) bands.value = [];
|
|
useHead({
|
|
title: "Bands",
|
|
});
|
|
</script>
|
|
<template>
|
|
<a-list v-model:data-source="bands" :grid="bp">
|
|
<template #renderItem="{ item }">
|
|
<a-list-item>
|
|
<a-row :gutter="[5, 5]">
|
|
<a-col>
|
|
<nuxt-link :to="`/band/${item._id}`">
|
|
{{ item.name }}
|
|
</nuxt-link>
|
|
</a-col>
|
|
<!-- subscribe... -->
|
|
<a-col v-if="rd && rd.user?._id" style="margin-left: auto">
|
|
<a
|
|
v-if="!rd?.user.subscriptions.bands.includes(item._id)"
|
|
@click="
|
|
async (e) => {
|
|
hider(bands, item._id, 'subscribe', 'bands');
|
|
await refresh();
|
|
}
|
|
"
|
|
>
|
|
<icon :istyle="'regular'" name="paper-plane" :size="12" />
|
|
</a>
|
|
<a
|
|
v-else
|
|
@click="
|
|
async (e) => {
|
|
hider(bands, item._id, 'unsubscribe', 'bands');
|
|
await refresh();
|
|
}
|
|
"
|
|
>
|
|
<icon :istyle="'regular'" name="x" :size="12" />
|
|
</a>
|
|
</a-col>
|
|
<a-col v-if="rd?.user._id">
|
|
<a
|
|
@click="
|
|
async (e) => {
|
|
hider(bands, item._id, 'hide', 'bands');
|
|
await refresh();
|
|
}
|
|
"
|
|
>
|
|
<icon :istyle="'regular'" name="eye-slash" :size="12" />
|
|
</a>
|
|
</a-col>
|
|
</a-row>
|
|
</a-list-item>
|
|
</template>
|
|
</a-list>
|
|
</template>
|