63 lines
2.6 KiB
Vue
63 lines
2.6 KiB
Vue
<template>
|
|
<div @click.stop="" class="feed-header flex items-center justify-between">
|
|
<div 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 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">
|
|
<button @click="onRemoveFeed()" class="w-full group flex items-center px-4 py-2 text-base hover:bg-indigo-100 text-gray-light">
|
|
<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('video.create')" 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 UserAvatar from '@/Shared/Misc/UserAvatar'
|
|
import DropdownMenuPoint from '@/Shared/Form/DropdownMenuPoint'
|
|
import { MenuItem, MenuItems } from '@headlessui/vue'
|
|
import {
|
|
MinusCircleIcon,
|
|
ExclamationIcon,
|
|
} from '@heroicons/vue/solid'
|
|
|
|
export default {
|
|
components: {
|
|
UserAvatar,
|
|
DropdownMenuPoint,
|
|
MinusCircleIcon,
|
|
ExclamationIcon,
|
|
MenuItem,
|
|
MenuItems,
|
|
},
|
|
emits: ['onRemoveFeed'],
|
|
props: {
|
|
user: Object,
|
|
created_at: String,
|
|
},
|
|
methods:{
|
|
onRemoveFeed(){
|
|
this.$emit('onRemoveFeed');
|
|
},
|
|
}
|
|
};
|
|
</script>
|