54 lines
1.6 KiB
Vue
54 lines
1.6 KiB
Vue
|
<script lang="ts" setup>
|
||
|
|
import icon from "~/components/icon.vue";
|
||
|
|
import { bp, subscriptions } from "~/lib/client/listActions";
|
||
|
|
import { IUser } from "~/models/user";
|
||
|
|
|
||
|
|
const { data: authors } = (await useApiFetch<any[]>("/authors")) as {
|
||
|
|
data: Ref<any[]>;
|
||
|
|
};
|
||
|
|
|
||
|
|
const { data: rd }: { data: any } = useAuth();
|
||
|
|
const data = rd as { user: IUser };
|
||
|
|
// console.log("d_u", data?.user?.subscriptions)
|
||
|
|
const hider = subscriptions;
|
||
|
|
if (authors.value == null) authors.value = [];
|
||
|
|
</script>
|
||
|
|
<template>
|
||
|
|
<a-list v-model:data-source="authors" :grid="bp">
|
||
|
|
<template #renderItem="{ item }">
|
||
|
|
<a-list-item>
|
||
|
|
<a-row :gutter="[5, 5]">
|
||
|
|
<a-col>
|
||
|
|
<nuxt-link :to="`/user/${item._id}`">
|
||
|
|
{{ item.username }}
|
||
|
|
</nuxt-link>
|
||
|
|
</a-col>
|
||
|
|
<!-- subscribe... -->
|
||
|
|
<a-col>
|
||
|
|
<span>({{ item.numStories }})</span>
|
||
|
|
</a-col>
|
||
|
|
<a-col v-if="data?.user && data?.user._id" style="margin-left: auto">
|
||
|
|
<a
|
||
|
|
v-if="!data?.user.subscriptions.authors.includes(item._id)"
|
||
|
|
@click="(e) => hider(authors, item._id, 'subscribe', 'authors')"
|
||
|
|
>
|
||
|
|
<icon :istyle="'regular'" name="paper-plane" :size="12" />
|
||
|
|
</a>
|
||
|
|
<a
|
||
|
|
v-else
|
||
|
|
@click="(e) => hider(authors, item._id, 'unsubscribe', 'authors')"
|
||
|
|
>
|
||
|
|
<icon :istyle="'regular'" name="x" :size="12" />
|
||
|
|
</a>
|
||
|
|
</a-col>
|
||
|
|
<a-col v-if="data?.user._id">
|
||
|
|
<a @click="(e) => hider(authors, item._id, 'hide', 'authors')">
|
||
|
|
<icon :istyle="'regular'" name="eye-slash" :size="12" />
|
||
|
|
</a>
|
||
|
|
</a-col>
|
||
|
|
</a-row>
|
||
|
|
</a-list-item>
|
||
|
|
</template>
|
||
|
|
</a-list>
|
||
|
|
</template>
|