Последняя версия с сервера прошлого разработчика

resources/js/Shared/FeedList/FeedHeader.vue

@@ -0,0 +1,80 @@
+<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>