81 lines
3.3 KiB
Vue
Executable File
81 lines
3.3 KiB
Vue
Executable File
<template>
|
|
<div class="feed-header flex items-center justify-between" @click.stop="">
|
|
<div v-if="entity.is_ads" class="flex items-center gap-3">
|
|
<user-avatar :user="user" size="small"
|
|
class="w-10 h-10 md:w-14 md:h-14 text-lg"
|
|
/>
|
|
<div class="flex flex-col">
|
|
<span class="text-sm md:text-base block font-medium text-white">{{ user.name }}</span>
|
|
</div>
|
|
</div>
|
|
<div v-else class="flex items-center">
|
|
<inertia-link :href="route('profile.user', user.username)" class="flex-shrink-0 block mr-2 md:mr-4">
|
|
<user-avatar :user="user" size="small"
|
|
class="w-10 h-10 md:w-14 md:h-14 text-lg"
|
|
/>
|
|
</inertia-link>
|
|
<inertia-link :href="route('profile.user', user.username)" class="flex flex-col">
|
|
<span class="hover:underline text-sm md:text-base block font-medium text-white">{{ user.name }}</span>
|
|
<span class="hover:underline text-xs text-gray-light">{{ created_at }}</span>
|
|
</inertia-link>
|
|
</div>
|
|
<div v-if="entity.is_ads == false" class="flex-shrink-0 text-white">
|
|
<dropdown-menu-point>
|
|
<MenuItems class="origin-top-right absolute right-0 mt-2 w-64 bg-indigo-300 shadow-lg max-h-60 rounded-md text-base ring-1 ring-indigo-200 overflow-auto focus:outline-none">
|
|
<MenuItem v-if="user.id === $page.props.auth.user.id">
|
|
<inertia-link :href="route(`${entity.type}.edit`, entity.slug)" class="w-full group flex items-center px-4 py-2 text-base hover:bg-indigo-100 text-gray-light">
|
|
<PencilAltIcon class="mr-3 h-5 w-5 text-gray-400 group-hover:text-orange" aria-hidden="true" />
|
|
Редактировать
|
|
</inertia-link>
|
|
</MenuItem>
|
|
|
|
<MenuItem v-if="user.id === $page.props.auth.user.id">
|
|
<button class="w-full group flex items-center px-4 py-2 text-base hover:bg-indigo-100 text-gray-light" @click="onRemoveFeed()">
|
|
<MinusCircleIcon class="mr-3 h-5 w-5 text-gray-400 group-hover:text-orange" aria-hidden="true" />
|
|
Удалить
|
|
</button>
|
|
</MenuItem>
|
|
<MenuItem v-if="user.id !== $page.props.auth.user.id">
|
|
<inertia-link :href="route('complaint.reason', feed_id)" class="group flex items-center px-4 py-2 text-base hover:bg-indigo-100 text-gray-light">
|
|
<ExclamationIcon class="mr-3 h-5 w-5 text-gray-400 group-hover:text-orange" aria-hidden="true" />
|
|
Пожаловаться
|
|
</inertia-link>
|
|
</MenuItem>
|
|
</MenuItems>
|
|
</dropdown-menu-point>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { MenuItem, MenuItems } from '@headlessui/vue'
|
|
import { MinusCircleIcon, ExclamationIcon, PencilAltIcon } from '@heroicons/vue/solid'
|
|
|
|
import UserAvatar from '@/Shared/Misc/UserAvatar.vue'
|
|
import DropdownMenuPoint from '@/Shared/Form/DropdownMenuPoint.vue'
|
|
|
|
export default {
|
|
components: {
|
|
UserAvatar,
|
|
DropdownMenuPoint,
|
|
MinusCircleIcon,
|
|
ExclamationIcon,
|
|
PencilAltIcon,
|
|
MenuItem,
|
|
MenuItems,
|
|
},
|
|
props: {
|
|
user: Object,
|
|
created_at: String,
|
|
feed_id: Number,
|
|
entity: Object,
|
|
},
|
|
emits: ['onRemoveFeed'],
|
|
methods: {
|
|
onRemoveFeed() {
|
|
this.$emit('onRemoveFeed')
|
|
},
|
|
},
|
|
}
|
|
</script>
|