Последняя версия с сервера прошлого разработчика
This commit is contained in:
19
resources/js/Shared/LayoutParts/HeaderAuth.vue
Executable file
19
resources/js/Shared/LayoutParts/HeaderAuth.vue
Executable file
@@ -0,0 +1,19 @@
|
||||
<template>
|
||||
<div class="header-simple relative z-10 flex items-center justify-center p-3 bg-orange shadow-md">
|
||||
<inertia-link class="block" href="/">
|
||||
<img class="block h-12" :src="setLogo()"
|
||||
alt=""
|
||||
>
|
||||
</inertia-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
methods: {
|
||||
setLogo() {
|
||||
return '/image/logotype.svg'
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
250
resources/js/Shared/LayoutParts/HeaderBar.vue
Executable file
250
resources/js/Shared/LayoutParts/HeaderBar.vue
Executable file
@@ -0,0 +1,250 @@
|
||||
<template>
|
||||
<header class="main-header-wrp w-full sticky top-0 z-[100]">
|
||||
<div class="relative z-10 bg-orange shadow-xl">
|
||||
<!-- contain-content -->
|
||||
<div
|
||||
class="
|
||||
|
||||
grid grid-cols-12
|
||||
items-center
|
||||
pt-2.5
|
||||
pb-2.5
|
||||
px-4
|
||||
sm:px-6
|
||||
md:space-x-5
|
||||
lg:space-x-10
|
||||
"
|
||||
>
|
||||
<inertia-link :href="route('dashboard')" class="col-span-1 block flex-shrink-0">
|
||||
<div class="block md:hidden font-bold text-indigo-300 text-2xl">
|
||||
T
|
||||
</div>
|
||||
<img class="hidden md:block" :src="setLogo()"
|
||||
alt=""
|
||||
/>
|
||||
</inertia-link>
|
||||
|
||||
<audio-player />
|
||||
<search-header ref="searchHeader" />
|
||||
|
||||
<div
|
||||
class="
|
||||
col-span-4
|
||||
md:col-span-2
|
||||
lg:col-span-4
|
||||
flex
|
||||
items-center
|
||||
justify-end
|
||||
space-x-2
|
||||
sm:ml-6
|
||||
sm:space-x-6
|
||||
"
|
||||
>
|
||||
<inertia-link :href="route('setting.money')" class="hidden lg:block default text-sm text-white">
|
||||
Баланс: {{ $page.props.balance }}
|
||||
</inertia-link>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="
|
||||
flex
|
||||
md:hidden
|
||||
p-1
|
||||
rounded-full
|
||||
items-center
|
||||
justify-center
|
||||
text-white
|
||||
focus:outline-none
|
||||
"
|
||||
@click="showSearch"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 md:h-6 md:w-6"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="11" cy="11"
|
||||
r="8"
|
||||
></circle>
|
||||
<line x1="21" y1="21"
|
||||
x2="16.65" y2="16.65"
|
||||
></line>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div class="relative">
|
||||
<div
|
||||
v-if="$page.props.is_notify"
|
||||
class="
|
||||
animate-ping
|
||||
absolute
|
||||
top-0
|
||||
right-1
|
||||
w-2
|
||||
h-2
|
||||
md:w-3
|
||||
md:h-3
|
||||
bg-pink
|
||||
rounded-full
|
||||
"
|
||||
></div>
|
||||
<inertia-link
|
||||
:href="route('setting.notify')"
|
||||
class="
|
||||
flex
|
||||
p-1
|
||||
rounded-full
|
||||
items-center
|
||||
justify-center
|
||||
text-white
|
||||
focus:outline-none
|
||||
"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 md:h-6 md:w-6"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
|
||||
<path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
|
||||
</svg>
|
||||
</inertia-link>
|
||||
</div>
|
||||
|
||||
<dropdown class="flex md:hidden user-menu h-12 w-12 rounded-full items-center justify-center focus:outline-none" placement="bottom-start">
|
||||
<svg class="h-6 w-6 text-white" aria-hidden="true"
|
||||
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
|
||||
fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
> <line x1="3" y1="12"
|
||||
x2="21" y2="12"
|
||||
></line> <line x1="3" y1="6"
|
||||
x2="21" y2="6"
|
||||
></line> <line x1="3" y1="18"
|
||||
x2="21" y2="18"
|
||||
></line> </svg>
|
||||
<template #dropdown>
|
||||
<div class="mobile-user-menu z-50 bg-orange-dark rounded-b-lg">
|
||||
<div
|
||||
class="absolute z-50 right-0 top-[-16px] mr-[20px] sm:mr-[20px]"
|
||||
>
|
||||
</div>
|
||||
<ul class="p-6 text-white space-y-6">
|
||||
<li>
|
||||
<inertia-link :href="route('setting.money')">
|
||||
Баланс: {{ $page.props.balance }}
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('profile.user', $page.props.auth.user.username)">
|
||||
Профиль
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('feeds.layoutsidebar')">
|
||||
Новости
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('messenger.index')">
|
||||
<!-- <span class="text-xs rounded-full mr-1"></span> -->
|
||||
Сообщения
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('images.index')">
|
||||
Изображения
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('videos.index')">
|
||||
Видео
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('musics.index')">
|
||||
Музыка
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('users.index')">
|
||||
Пользователи
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link :href="route('setting.index')">
|
||||
Настройки
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li>
|
||||
<inertia-link as="button" :href="route('logout')"
|
||||
method="delete"
|
||||
>
|
||||
Выйти
|
||||
</inertia-link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
</dropdown>
|
||||
|
||||
|
||||
<div class="hidden md:block relative flex-shrink-0">
|
||||
<inertia-link
|
||||
:href="route('profile.user', $page.props.auth.user.username)"
|
||||
class="
|
||||
bg-white
|
||||
rounded-full
|
||||
flex
|
||||
text-sm
|
||||
focus:outline-none
|
||||
focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500
|
||||
"
|
||||
>
|
||||
<user-avatar :user="$page.props.auth.user" size="small"
|
||||
class="w-9 h-9 md:h-12 md:w-12 text-base"
|
||||
/>
|
||||
</inertia-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Dropdown from '@/Shared/Form/Dropdown.vue'
|
||||
import UserAvatar from '@/Shared/Misc/UserAvatar.vue'
|
||||
import AudioPlayer from '@/Shared/AudioPlayer.vue'
|
||||
import SearchHeader from '@/Shared/Search/SearchHeader.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AudioPlayer,
|
||||
UserAvatar,
|
||||
Dropdown,
|
||||
SearchHeader,
|
||||
},
|
||||
|
||||
methods: {
|
||||
showSearch(){
|
||||
this.$refs.searchHeader.openModal()
|
||||
},
|
||||
setLogo() {
|
||||
return '/image/logotype.svg'
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
107
resources/js/Shared/LayoutParts/SettingsMenu.vue
Executable file
107
resources/js/Shared/LayoutParts/SettingsMenu.vue
Executable file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<div class="md:py-7 col-span-2 lg:col-span-1 border-r border-indigo-300">
|
||||
<ul class="flex md:block text-base lg:text-xl xl:text-2xl text-gray-light overflow-x-auto">
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsProfile' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.index')">
|
||||
Профиль
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.url.startsWith('/settings/purchases') ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.purchases')">
|
||||
Покупки
|
||||
</inertia-link>
|
||||
</li>
|
||||
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsLikes' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.likes')">
|
||||
Понравилось
|
||||
</inertia-link>
|
||||
</li>
|
||||
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsMoney' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.money')">
|
||||
Доход
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsTarif' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.tarif')">
|
||||
Тарифы
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsNotify' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.notify')">
|
||||
Оповещения
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsPayouts' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.payouts')">
|
||||
Выплаты
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsPacket' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.packet')">
|
||||
Платные подписки
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsVerification' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.verification')">
|
||||
Верификация
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsDocuments' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.documents')">
|
||||
Документы
|
||||
</inertia-link>
|
||||
</li>
|
||||
<li
|
||||
:class="[$page.component === 'Settings/SettingsWriteToUs' ?
|
||||
'md:border-l-4 md:border-b-0 border-b-2 border-pink text-white' :
|
||||
'hover:text-white' ,'px-6 py-4']"
|
||||
>
|
||||
<inertia-link :href="route('setting.write-to-us')">
|
||||
Написать нам
|
||||
</inertia-link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
148
resources/js/Shared/LayoutParts/Sidebar.vue
Executable file
148
resources/js/Shared/LayoutParts/Sidebar.vue
Executable file
@@ -0,0 +1,148 @@
|
||||
<template>
|
||||
<div class="main-sidebar-wrp hidden w-28 bg-indigo-200 overflow-y-auto md:block">
|
||||
<div class="w-full py-6 flex flex-col items-center">
|
||||
<div class="flex-1 w-full px-2 space-y-1">
|
||||
<inertia-link :class="$page.url.startsWith('/profile') ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('profile.user', $page.props.auth.user.username)">
|
||||
<svg :class="$page.url.startsWith('/profile') ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Профиль</span>
|
||||
</inertia-link>
|
||||
|
||||
|
||||
|
||||
<inertia-link :href="route('setting.money')"
|
||||
class="lg:hidden text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs"
|
||||
>
|
||||
<svg class="text-green group-hover:text-white h-6 w-6" xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 440 440" fill="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
><path d="M232.522 242.428c63.913 0 115.91-54.382 115.91-121.227C348.432 54.37 296.435 0 232.522 0H120.568v282.428h-29v30h29V440h30V312.428h101.955v-30H150.568v-40h81.954zM150.568 30h81.955c47.371 0 85.91 40.912 85.91 91.201 0 50.303-38.539 91.227-85.91 91.227h-81.955V30z" /></svg>
|
||||
|
||||
<span class="mt-2">{{ $page.props.balance }}</span>
|
||||
</inertia-link>
|
||||
|
||||
<inertia-link class="relative" :class="$page.component === 'Messenger/Index' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' "
|
||||
:href="route('messenger.index')"
|
||||
>
|
||||
<div v-if="$page.props.message_reading_count" class="absolute top-1 right-1 w-2 h-2 md:w-5 md:h-5 bg-pink rounded-full text-xs flex justify-center items-center text-white">
|
||||
{{ $page.props.message_reading_count }}
|
||||
</div>
|
||||
<svg :class="$page.component === 'Messenger/Index' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>
|
||||
<span class="mt-2">Сообщения</span>
|
||||
</inertia-link>
|
||||
|
||||
|
||||
<inertia-link :class="$page.component === 'Feed/Index' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('feeds.layoutsidebar')">
|
||||
<svg :class="$page.component === 'Feed/Index' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Новости</span>
|
||||
</inertia-link>
|
||||
|
||||
|
||||
<inertia-link :class="$page.component === 'Image/Index' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('images.index')">
|
||||
<svg :class="$page.component === 'Image/Index' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Изображения</span>
|
||||
</inertia-link>
|
||||
|
||||
|
||||
<inertia-link :class="$page.component === 'Video/Feed' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('videos.index')">
|
||||
<svg :class="$page.component === 'Video/Feed' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2" d="M15 10l4.553-2.276A1 1 0 0121 8.618v6.764a1 1 0 01-1.447.894L15 14M5 18h8a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Видео</span>
|
||||
</inertia-link>
|
||||
|
||||
<inertia-link :class="$page.component === 'Music/Feed' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('musics.index')">
|
||||
<svg :class="$page.component === 'Music/Feed' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2" d="M9 19V6l12-3v13M9 19c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zm12-3c0 1.105-1.343 2-3 2s-3-.895-3-2 1.343-2 3-2 3 .895 3 2zM9 10l12-3"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Музыка</span>
|
||||
</inertia-link>
|
||||
|
||||
|
||||
<inertia-link :class="$page.component === 'User/Index' ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('users.index')">
|
||||
<svg :class="$page.component === 'User/Index' ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Пользователи</span>
|
||||
</inertia-link>
|
||||
|
||||
<inertia-link :class="$page.component.startsWith('Settings') ? 'text-white group w-full p-3 rounded-md flex flex-col items-center text-xs font-medium' : 'text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs' " :href="route('setting.index')">
|
||||
<svg :class="$page.component.startsWith('Settings') ? 'text-white h-6 w-6' : 'text-indigo-300 group-hover:text-white h-6 w-6' " xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none" viewBox="0 0 24 24"
|
||||
stroke="currentColor" aria-hidden="true"
|
||||
>
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"
|
||||
/><path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
|
||||
/>
|
||||
</svg>
|
||||
<span class="mt-2">Настройки</span>
|
||||
</inertia-link>
|
||||
|
||||
<inertia-link
|
||||
as="button"
|
||||
:href="route('logout')" method="delete"
|
||||
class="relative text-gray-light hover:bg-orange hover:text-white group w-full p-3 rounded-md flex flex-col items-center text-xs"
|
||||
>
|
||||
<svg class="text-indigo-300 group-hover:text-white h-6 w-6" xmlns="http://www.w3.org/2000/svg"
|
||||
width="24" height="24"
|
||||
viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round" stroke-linejoin="round"
|
||||
><path stroke-linecap="round" stroke-linejoin="round"
|
||||
stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
|
||||
/></svg>
|
||||
<span class="mt-2">Выйти</span>
|
||||
</inertia-link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
45
resources/js/Shared/LayoutParts/SidebarSecondary.vue
Executable file
45
resources/js/Shared/LayoutParts/SidebarSecondary.vue
Executable file
@@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div class="bg-indigo-200 shadow-classic rounded-md p-5">
|
||||
<span class="block text-white font-medium">Лидеры</span>
|
||||
<div v-if="leaderUsers.length" class="mt-5 space-y-5">
|
||||
<div v-for="leaderUser in leaderUsers" :key="leaderUser.id"
|
||||
class="flex items-center"
|
||||
>
|
||||
<div class="flex-shrink-0 mr-2 md:mr-4">
|
||||
<inertia-link :href="route('profile.user', leaderUser.username)" class="flex-shrink-0 block mr-2 md:mr-4">
|
||||
<user-avatar :user="leaderUser" size="small"
|
||||
class="w-10 h-10 md:w-14 md:h-14 text-lg"
|
||||
/>
|
||||
</inertia-link>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<inertia-link :href="route('profile.user', leaderUser.username)" class="hover:underline text-sm md:text-base block text-white">
|
||||
{{ leaderUser.name }}
|
||||
</inertia-link>
|
||||
<span class="text-xs text-gray-light">Кол. голосов: {{ leaderUser.countVote }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="text-center mt-3 text-lg text-gray-light">
|
||||
Лидер не определен
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { usePage } from '@inertiajs/inertia-vue3'
|
||||
import UserAvatar from '@/Shared/Misc/UserAvatar.vue'
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
UserAvatar,
|
||||
},
|
||||
|
||||
computed: {
|
||||
leaderUsers() {
|
||||
return usePage().props.value.leaders
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user