mirror of
https://github.com/ngthanhvu/kr-phim.git
synced 2026-08-10 16:07:47 +00:00
Refactor: Remove Supabase authentication and related code
- Removed Supabase authentication logic from xem/[slug].vue and yeu-thich.vue. - Updated favorite and watch later messages to be device-specific. - Removed unused user state and authentication initialization. - Deleted supabase.ts plugin file and related configurations. - Updated nuxt.config.ts to remove Supabase runtime configuration. - Removed Supabase dependencies from package.json and package-lock.json. - Adjusted Dockerfile for development environment. - Added admin layout and pages for managing settings, movies, and users. - Implemented admin dashboard with statistics and recent activities. - Created movie and user management interfaces with search functionality.
This commit is contained in:
ngthanhvu
@@ -0,0 +1,7 @@
|
|||||||
|
FROM node:22-alpine
|
||||||
|
WORKDIR /app
|
||||||
|
COPY package*.json ./
|
||||||
|
RUN npm ci
|
||||||
|
COPY . .
|
||||||
|
EXPOSE 3002
|
||||||
|
CMD ["npm", "run", "dev"]
|
||||||
+10
-3
@@ -1,7 +1,14 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
const route = useRoute()
|
||||||
|
const isAdmin = computed(() => route.path.startsWith('/admin'))
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<NuxtRouteAnnouncer />
|
<NuxtRouteAnnouncer />
|
||||||
<NuxtLoadingIndicator color="#facc15" :height="2" />
|
<NuxtLoadingIndicator color="#facc15" :height="2" />
|
||||||
<NuxtPage />
|
<NuxtLayout>
|
||||||
<AppFooter />
|
<NuxtPage />
|
||||||
<ScrollToTop />
|
</NuxtLayout>
|
||||||
|
<AppFooter v-if="!isAdmin" />
|
||||||
|
<ScrollToTop v-if="!isAdmin" />
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
+10
-303
@@ -1,13 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {
|
import {
|
||||||
Bell,
|
|
||||||
Chrome,
|
|
||||||
Heart,
|
Heart,
|
||||||
History,
|
History,
|
||||||
Loader2,
|
|
||||||
LockKeyhole,
|
|
||||||
LogOut,
|
|
||||||
Mail,
|
|
||||||
Menu,
|
Menu,
|
||||||
Search,
|
Search,
|
||||||
User,
|
User,
|
||||||
@@ -17,28 +11,9 @@ import {
|
|||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const {
|
|
||||||
user,
|
|
||||||
loading: authLoading,
|
|
||||||
initAuth,
|
|
||||||
signInWithPassword,
|
|
||||||
signUpWithPassword,
|
|
||||||
signInWithGoogle,
|
|
||||||
resetPassword,
|
|
||||||
signOut,
|
|
||||||
} = useSupabaseAuth()
|
|
||||||
const keyword = ref(typeof route.query.q === 'string' ? route.query.q : '')
|
const keyword = ref(typeof route.query.q === 'string' ? route.query.q : '')
|
||||||
const mobileMenuOpen = ref(false)
|
const mobileMenuOpen = ref(false)
|
||||||
const loginOpen = ref(false)
|
|
||||||
const memberMenuOpen = ref(false)
|
const memberMenuOpen = ref(false)
|
||||||
const authMode = ref<'login' | 'register'>('login')
|
|
||||||
const email = ref('')
|
|
||||||
const password = ref('')
|
|
||||||
const authMessage = ref('')
|
|
||||||
const authError = ref('')
|
|
||||||
const submittingAuth = ref(false)
|
|
||||||
const submittingProvider = ref(false)
|
|
||||||
const defaultAvatar = 'https://thumbs.dreamstime.com/b/avatar-vietnam-character-your-project-others-avatar-vietnam-character-274539000.jpg'
|
|
||||||
|
|
||||||
const navItems = [
|
const navItems = [
|
||||||
{ label: 'Trang chủ', to: '/' },
|
{ label: 'Trang chủ', to: '/' },
|
||||||
@@ -48,22 +23,7 @@ const navItems = [
|
|||||||
{ label: 'Phim lẻ', to: '/phim?type=single' },
|
{ label: 'Phim lẻ', to: '/phim?type=single' },
|
||||||
]
|
]
|
||||||
|
|
||||||
const memberName = computed(() => {
|
|
||||||
const metadata = user.value?.user_metadata || {}
|
|
||||||
const name = metadata.name || metadata.full_name || metadata.user_name
|
|
||||||
if (typeof name === 'string' && name.trim()) return name.trim()
|
|
||||||
return user.value?.email?.split('@')[0] || 'Thành viên'
|
|
||||||
})
|
|
||||||
|
|
||||||
const memberAvatar = computed(() => {
|
|
||||||
const metadata = user.value?.user_metadata || {}
|
|
||||||
return typeof metadata.avatar_url === 'string' && metadata.avatar_url
|
|
||||||
? metadata.avatar_url
|
|
||||||
: defaultAvatar
|
|
||||||
})
|
|
||||||
|
|
||||||
const memberMenuItems = [
|
const memberMenuItems = [
|
||||||
{ label: 'Trang cá nhân', icon: UserRound, to: '/thanh-vien' },
|
|
||||||
{ label: 'Yêu thích', icon: Heart, to: '/yeu-thich' },
|
{ label: 'Yêu thích', icon: Heart, to: '/yeu-thich' },
|
||||||
{ label: 'Lịch sử', icon: History, to: '/lich-su' },
|
{ label: 'Lịch sử', icon: History, to: '/lich-su' },
|
||||||
]
|
]
|
||||||
@@ -85,96 +45,14 @@ function closeMobileMenu() {
|
|||||||
mobileMenuOpen.value = false
|
mobileMenuOpen.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
function openLogin() {
|
|
||||||
authMessage.value = ''
|
|
||||||
authError.value = ''
|
|
||||||
email.value = user.value?.email || ''
|
|
||||||
password.value = ''
|
|
||||||
authMode.value = 'login'
|
|
||||||
loginOpen.value = true
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleMemberClick() {
|
function handleMemberClick() {
|
||||||
if (!user.value) {
|
|
||||||
openLogin()
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
memberMenuOpen.value = !memberMenuOpen.value
|
memberMenuOpen.value = !memberMenuOpen.value
|
||||||
}
|
}
|
||||||
|
|
||||||
async function submitLogin() {
|
|
||||||
const trimmedEmail = email.value.trim()
|
|
||||||
if (!trimmedEmail || !password.value) return
|
|
||||||
|
|
||||||
submittingAuth.value = true
|
|
||||||
authMessage.value = ''
|
|
||||||
authError.value = ''
|
|
||||||
|
|
||||||
const { error } = authMode.value === 'login'
|
|
||||||
? await signInWithPassword(trimmedEmail, password.value)
|
|
||||||
: await signUpWithPassword(trimmedEmail, password.value)
|
|
||||||
|
|
||||||
submittingAuth.value = false
|
|
||||||
if (error) {
|
|
||||||
authError.value = error.message
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
authMessage.value = authMode.value === 'login'
|
|
||||||
? 'Đăng nhập thành công.'
|
|
||||||
: 'Đăng ký thành công. Nếu Supabase yêu cầu xác nhận, bạn mở email để xác nhận nhé.'
|
|
||||||
|
|
||||||
if (authMode.value === 'login') loginOpen.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleGoogleLogin() {
|
|
||||||
submittingProvider.value = true
|
|
||||||
authError.value = ''
|
|
||||||
const { error } = await signInWithGoogle()
|
|
||||||
submittingProvider.value = false
|
|
||||||
if (error) authError.value = error.message
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleResetPassword() {
|
|
||||||
const trimmedEmail = email.value.trim()
|
|
||||||
if (!trimmedEmail) {
|
|
||||||
authError.value = 'Nhập email trước để lấy lại mật khẩu nhé.'
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
submittingAuth.value = true
|
|
||||||
authMessage.value = ''
|
|
||||||
authError.value = ''
|
|
||||||
const { error } = await resetPassword(trimmedEmail)
|
|
||||||
submittingAuth.value = false
|
|
||||||
|
|
||||||
if (error) {
|
|
||||||
authError.value = error.message
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
authMessage.value = 'Đã gửi email đặt lại mật khẩu.'
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleSignOut() {
|
|
||||||
await signOut()
|
|
||||||
loginOpen.value = false
|
|
||||||
memberMenuOpen.value = false
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
initAuth()
|
|
||||||
})
|
|
||||||
|
|
||||||
watch(() => route.path, () => {
|
watch(() => route.path, () => {
|
||||||
closeMobileMenu()
|
closeMobileMenu()
|
||||||
memberMenuOpen.value = false
|
memberMenuOpen.value = false
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(user, (currentUser) => {
|
|
||||||
if (currentUser) loginOpen.value = false
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -200,39 +78,21 @@ watch(user, (currentUser) => {
|
|||||||
|
|
||||||
<div class="group/member relative hidden shrink-0 items-center gap-2.5 md:flex"
|
<div class="group/member relative hidden shrink-0 items-center gap-2.5 md:flex"
|
||||||
@mouseenter="memberMenuOpen = true" @mouseleave="memberMenuOpen = false">
|
@mouseenter="memberMenuOpen = true" @mouseleave="memberMenuOpen = false">
|
||||||
<button v-if="user" type="button"
|
|
||||||
class="grid size-9 cursor-pointer place-items-center rounded-full bg-white/10 text-white transition hover:bg-white/16"
|
|
||||||
aria-label="Thông báo">
|
|
||||||
<Bell class="size-4 fill-current" />
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button type="button"
|
<button type="button"
|
||||||
class="inline-flex h-9 shrink-0 cursor-pointer items-center gap-1.5 rounded-full bg-white px-2.5 pl-1 text-xs font-black text-slate-950 shadow-xl shadow-black/20 transition hover:bg-yellow-100"
|
class="inline-flex h-9 shrink-0 cursor-pointer items-center gap-1.5 rounded-full bg-white px-2.5 pl-1 text-xs font-black text-slate-950 shadow-xl shadow-black/20 transition hover:bg-yellow-100"
|
||||||
:aria-label="user ? 'Tài khoản thành viên' : 'Đăng nhập thành viên'" @click="handleMemberClick">
|
aria-label="Tài khoản thành viên" @click="handleMemberClick">
|
||||||
<Loader2 v-if="authLoading" class="mx-1 size-4 animate-spin" />
|
<User class="ml-1 size-4 fill-current" />
|
||||||
<template v-else-if="user">
|
<span>Thành viên</span>
|
||||||
<img :src="memberAvatar" :alt="memberName"
|
|
||||||
class="size-7 rounded-full object-cover ring-2 ring-yellow-200/80">
|
|
||||||
</template>
|
|
||||||
<User v-else class="ml-1 size-4 fill-current" />
|
|
||||||
<span class="max-w-24 truncate">{{ user ? memberName : 'Thành viên' }}</span>
|
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<Transition name="member-menu">
|
<Transition name="member-menu">
|
||||||
<div v-if="user && memberMenuOpen"
|
<div v-if="memberMenuOpen"
|
||||||
class="absolute right-0 top-[calc(100%+0.75rem)] w-64 overflow-hidden rounded-lg border border-white/10 bg-[#101116] py-2 text-sm font-semibold text-slate-200 shadow-2xl shadow-black/40">
|
class="absolute right-0 top-[calc(100%+0.75rem)] w-64 overflow-hidden rounded-lg border border-white/10 bg-[#101116] py-2 text-sm font-semibold text-slate-200 shadow-2xl shadow-black/40">
|
||||||
<NuxtLink v-for="item in memberMenuItems" :key="item.label" :to="item.to"
|
<NuxtLink v-for="item in memberMenuItems" :key="item.label" :to="item.to"
|
||||||
class="flex h-12 w-full cursor-pointer items-center gap-3 px-5 text-left transition hover:bg-white/8 hover:text-white">
|
class="flex h-12 w-full cursor-pointer items-center gap-3 px-5 text-left transition hover:bg-white/8 hover:text-white">
|
||||||
<component :is="item.icon" class="size-4 shrink-0" />
|
<component :is="item.icon" class="size-4 shrink-0" />
|
||||||
{{ item.label }}
|
{{ item.label }}
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
<div class="my-2 border-t border-white/10" />
|
|
||||||
<button type="button"
|
|
||||||
class="flex h-12 w-full cursor-pointer items-center gap-3 px-5 text-left font-black text-yellow-300 transition hover:bg-white/8 hover:text-white"
|
|
||||||
@click="handleSignOut">
|
|
||||||
<LogOut class="size-4 shrink-0" />
|
|
||||||
Đăng xuất
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
</Transition>
|
</Transition>
|
||||||
</div>
|
</div>
|
||||||
@@ -265,130 +125,12 @@ watch(user, (currentUser) => {
|
|||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
</nav>
|
</nav>
|
||||||
<div class="border-t border-white/10 p-4">
|
<div class="border-t border-white/10 p-4">
|
||||||
<button type="button"
|
<NuxtLink v-for="item in memberMenuItems" :key="item.label" :to="item.to"
|
||||||
class="inline-flex h-11 w-full cursor-pointer items-center justify-center gap-2 rounded-full bg-white px-4 text-sm font-black text-slate-950 transition hover:bg-yellow-100"
|
class="flex h-11 w-full cursor-pointer items-center gap-3 px-4 text-left text-sm font-semibold text-slate-200 transition hover:bg-white/8 hover:text-white"
|
||||||
@click="handleMemberClick">
|
@click="closeMobileMenu">
|
||||||
<img v-if="user" :src="memberAvatar" :alt="memberName" class="size-7 rounded-full object-cover">
|
<component :is="item.icon" class="size-4 shrink-0" />
|
||||||
<User v-else class="size-4 fill-current" />
|
{{ item.label }}
|
||||||
<span>{{ user ? memberName : 'Đăng nhập thành viên' }}</span>
|
</NuxtLink>
|
||||||
</button>
|
|
||||||
<div v-if="user" class="mt-3 overflow-hidden rounded-lg border border-white/10 bg-white/5">
|
|
||||||
<NuxtLink v-for="item in memberMenuItems" :key="item.label" :to="item.to"
|
|
||||||
class="flex h-11 w-full cursor-pointer items-center gap-3 px-4 text-left text-sm font-semibold text-slate-200 transition hover:bg-white/8 hover:text-white">
|
|
||||||
<component :is="item.icon" class="size-4 shrink-0" />
|
|
||||||
{{ item.label }}
|
|
||||||
</NuxtLink>
|
|
||||||
<div class="border-t border-white/10" />
|
|
||||||
<button type="button"
|
|
||||||
class="flex h-11 w-full cursor-pointer items-center gap-3 px-4 text-left text-sm font-black text-yellow-300 transition hover:bg-white/8 hover:text-white"
|
|
||||||
@click="handleSignOut">
|
|
||||||
<LogOut class="size-4 shrink-0" />
|
|
||||||
Đăng xuất
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Transition>
|
|
||||||
|
|
||||||
<Transition name="auth-modal">
|
|
||||||
<div v-if="loginOpen" class="fixed inset-0 z-70 grid place-items-center px-3 py-6">
|
|
||||||
<div class="absolute inset-0 bg-slate-950/80 backdrop-blur-sm" @click="loginOpen = false" />
|
|
||||||
<div
|
|
||||||
class="relative grid w-full max-w-5xl overflow-hidden rounded-lg border border-white/10 bg-slate-950 text-white shadow-2xl shadow-black/50 md:grid-cols-[1fr_1fr]">
|
|
||||||
<button type="button"
|
|
||||||
class="absolute right-3 top-3 z-10 grid size-9 place-items-center rounded-full text-white transition hover:bg-white/10"
|
|
||||||
aria-label="Đóng đăng nhập" @click="loginOpen = false">
|
|
||||||
<X class="size-5" />
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div class="auth-poster-panel hidden min-h-128 items-end p-8 md:flex">
|
|
||||||
<div>
|
|
||||||
<AppLogo />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="bg-slate-950 px-5 py-10 sm:px-10 md:px-16 md:py-16">
|
|
||||||
<div v-if="user">
|
|
||||||
<p class="text-sm font-bold text-yellow-300">Thành viên</p>
|
|
||||||
<h2 class="mt-2 text-2xl font-black">Tài khoản của bạn</h2>
|
|
||||||
<p class="mt-6 rounded-md bg-white/8 px-4 py-3 text-sm font-semibold text-slate-100">{{ user.email }}
|
|
||||||
</p>
|
|
||||||
<button type="button"
|
|
||||||
class="mt-5 inline-flex h-12 w-full items-center justify-center gap-2 rounded-md bg-yellow-300 text-sm font-black text-slate-950 transition hover:bg-white"
|
|
||||||
@click="handleSignOut">
|
|
||||||
<LogOut class="size-4" />
|
|
||||||
Đăng xuất
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form v-else @submit.prevent="submitLogin">
|
|
||||||
<h2 class="text-2xl font-black">{{ authMode === 'login' ? 'Đăng nhập' : 'Đăng ký' }}</h2>
|
|
||||||
<p class="mt-5 text-sm text-slate-300">
|
|
||||||
<template v-if="authMode === 'login'">
|
|
||||||
Nếu bạn chưa có tài khoản,
|
|
||||||
<button type="button" class="font-black text-yellow-300 hover:text-white"
|
|
||||||
@click="authMode = 'register'; authError = ''; authMessage = ''">
|
|
||||||
đăng ký ngay
|
|
||||||
</button>
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
Nếu bạn đã có tài khoản,
|
|
||||||
<button type="button" class="font-black text-yellow-300 hover:text-white"
|
|
||||||
@click="authMode = 'login'; authError = ''; authMessage = ''">
|
|
||||||
đăng nhập ngay
|
|
||||||
</button>
|
|
||||||
</template>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div class="mt-8 space-y-3">
|
|
||||||
<div class="flex h-12 items-center rounded-md border border-white/10 bg-white/8 px-4">
|
|
||||||
<Mail class="mr-3 size-4 shrink-0 text-slate-400" />
|
|
||||||
<input v-model="email" type="email" required placeholder="Email"
|
|
||||||
class="h-full w-full bg-transparent text-sm text-white outline-none placeholder:text-slate-400">
|
|
||||||
</div>
|
|
||||||
<div class="flex h-12 items-center rounded-md border border-white/10 bg-white/8 px-4">
|
|
||||||
<LockKeyhole class="mr-3 size-4 shrink-0 text-slate-400" />
|
|
||||||
<input v-model="password" type="password" required minlength="6" placeholder="Mật khẩu"
|
|
||||||
class="h-full w-full bg-transparent text-sm text-white outline-none placeholder:text-slate-400">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button type="button"
|
|
||||||
class="mt-5 inline-flex h-12 w-full items-center justify-center gap-2 rounded-md border border-white/12 bg-white/8 text-sm font-black text-white transition hover:bg-white/14 disabled:cursor-not-allowed disabled:opacity-70"
|
|
||||||
:disabled="submittingProvider" @click="handleGoogleLogin">
|
|
||||||
<Loader2 v-if="submittingProvider" class="size-4 animate-spin" />
|
|
||||||
<Chrome v-else class="size-4" />
|
|
||||||
Tiếp tục với Google
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div class="my-5 flex items-center gap-3 text-xs font-semibold text-slate-400">
|
|
||||||
<span class="h-px flex-1 bg-white/10" />
|
|
||||||
hoặc
|
|
||||||
<span class="h-px flex-1 bg-white/10" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button type="submit"
|
|
||||||
class="inline-flex h-12 w-full items-center justify-center gap-2 rounded-md bg-yellow-300 text-sm font-black text-slate-950 transition hover:bg-white disabled:cursor-not-allowed disabled:opacity-70"
|
|
||||||
:disabled="submittingAuth">
|
|
||||||
<Loader2 v-if="submittingAuth" class="size-4 animate-spin" />
|
|
||||||
<User v-else class="size-4 fill-current" />
|
|
||||||
{{ authMode === 'login' ? 'Đăng nhập' : 'Đăng ký' }}
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button v-if="authMode === 'login'" type="button"
|
|
||||||
class="mt-7 block w-full text-center text-sm font-bold text-white hover:text-yellow-300"
|
|
||||||
@click="handleResetPassword">
|
|
||||||
Quên mật khẩu?
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<p v-if="authMessage" class="mt-4 rounded-md bg-yellow-400/12 px-3 py-2 text-sm text-yellow-100">
|
|
||||||
{{ authMessage }}
|
|
||||||
</p>
|
|
||||||
<p v-if="authError" class="mt-4 rounded-md bg-red-500/12 px-3 py-2 text-sm text-red-100">
|
|
||||||
{{ authError }}
|
|
||||||
</p>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -418,16 +160,6 @@ watch(user, (currentUser) => {
|
|||||||
transform: translateX(-100%);
|
transform: translateX(-100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.auth-modal-enter-active,
|
|
||||||
.auth-modal-leave-active {
|
|
||||||
transition: opacity 0.18s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.auth-modal-enter-from,
|
|
||||||
.auth-modal-leave-to {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.member-menu-enter-active,
|
.member-menu-enter-active,
|
||||||
.member-menu-leave-active {
|
.member-menu-leave-active {
|
||||||
transition: opacity 0.16s ease, transform 0.16s ease;
|
transition: opacity 0.16s ease, transform 0.16s ease;
|
||||||
@@ -438,29 +170,4 @@ watch(user, (currentUser) => {
|
|||||||
opacity: 0;
|
opacity: 0;
|
||||||
transform: translateY(-0.35rem);
|
transform: translateY(-0.35rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.auth-poster-panel {
|
|
||||||
background:
|
|
||||||
linear-gradient(180deg, rgba(2, 6, 23, 0.45), rgba(2, 6, 23, 0.92)),
|
|
||||||
linear-gradient(135deg, rgba(234, 179, 8, 0.14) 0 18%, transparent 18% 100%),
|
|
||||||
radial-gradient(circle at 22% 18%, rgba(250, 204, 21, 0.22), transparent 8rem),
|
|
||||||
linear-gradient(120deg, #422006 0%, #0f172a 54%, #020617 100%);
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.auth-poster-panel::before {
|
|
||||||
position: absolute;
|
|
||||||
inset: 0;
|
|
||||||
background-image:
|
|
||||||
linear-gradient(115deg, transparent 0 10%, rgba(234, 179, 8, 0.16) 10% 10.6%, transparent 10.6% 100%),
|
|
||||||
repeating-linear-gradient(105deg, rgba(255, 255, 255, 0.06) 0 7.5rem, transparent 7.5rem 8rem),
|
|
||||||
repeating-linear-gradient(15deg, rgba(250, 204, 21, 0.1) 0 10rem, transparent 10rem 10.6rem);
|
|
||||||
content: "";
|
|
||||||
opacity: 0.75;
|
|
||||||
}
|
|
||||||
|
|
||||||
.auth-poster-panel>div {
|
|
||||||
position: relative;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -56,31 +56,15 @@ function legacyKeyFor(key: string) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function useMovieLibrary() {
|
export function useMovieLibrary() {
|
||||||
const { $supabase } = useNuxtApp()
|
async function loadItems(key: string, limit = 30) {
|
||||||
const { user } = useSupabaseAuth()
|
|
||||||
|
|
||||||
async function loadItems(key: string, table: string, limit = 30) {
|
|
||||||
const localItems = readLocalItems(key, legacyKeyFor(key))
|
const localItems = readLocalItems(key, legacyKeyFor(key))
|
||||||
|
|
||||||
if (user.value) {
|
|
||||||
const { data, error } = await $supabase
|
|
||||||
.from(table)
|
|
||||||
.select('source, slug, name, origin_name, thumb, poster, updated_at')
|
|
||||||
.eq('user_id', user.value.id)
|
|
||||||
.order('updated_at', { ascending: false })
|
|
||||||
.limit(limit)
|
|
||||||
|
|
||||||
if (!error && data) {
|
|
||||||
return data.map(normalizeLibraryItem).filter(Boolean) as LibraryMovieItem[]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return localItems
|
return localItems
|
||||||
.sort((a, b) => (b.updatedAt || 0) - (a.updatedAt || 0))
|
.sort((a, b) => (b.updatedAt || 0) - (a.updatedAt || 0))
|
||||||
.slice(0, limit)
|
.slice(0, limit)
|
||||||
}
|
}
|
||||||
|
|
||||||
async function saveItem(key: string, table: string, item: LibraryMovieItem) {
|
async function saveItem(key: string, item: LibraryMovieItem) {
|
||||||
const normalizedItem = normalizeLibraryItem({
|
const normalizedItem = normalizeLibraryItem({
|
||||||
...item,
|
...item,
|
||||||
updatedAt: Date.now(),
|
updatedAt: Date.now(),
|
||||||
@@ -95,63 +79,25 @@ export function useMovieLibrary() {
|
|||||||
|
|
||||||
writeLocalItems(key, nextItems)
|
writeLocalItems(key, nextItems)
|
||||||
|
|
||||||
if (user.value) {
|
|
||||||
await $supabase
|
|
||||||
.from(table)
|
|
||||||
.upsert({
|
|
||||||
user_id: user.value.id,
|
|
||||||
source: normalizedItem.source,
|
|
||||||
slug: normalizedItem.slug,
|
|
||||||
name: normalizedItem.name,
|
|
||||||
origin_name: normalizedItem.originName || null,
|
|
||||||
thumb: normalizedItem.thumb || null,
|
|
||||||
poster: normalizedItem.poster || null,
|
|
||||||
updated_at: new Date(normalizedItem.updatedAt || Date.now()).toISOString(),
|
|
||||||
}, {
|
|
||||||
onConflict: 'user_id,source,slug',
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
|
|
||||||
async function removeItem(key: string, table: string, item: LibraryMovieItem) {
|
async function removeItem(key: string, item: LibraryMovieItem) {
|
||||||
const nextItems = readLocalItems(key, legacyKeyFor(key))
|
const nextItems = readLocalItems(key, legacyKeyFor(key))
|
||||||
.filter((savedItem) => !(savedItem.slug === item.slug && savedItem.source === item.source))
|
.filter((savedItem) => !(savedItem.slug === item.slug && savedItem.source === item.source))
|
||||||
writeLocalItems(key, nextItems)
|
writeLocalItems(key, nextItems)
|
||||||
|
|
||||||
if (user.value) {
|
|
||||||
await $supabase
|
|
||||||
.from(table)
|
|
||||||
.delete()
|
|
||||||
.eq('user_id', user.value.id)
|
|
||||||
.eq('source', item.source)
|
|
||||||
.eq('slug', item.slug)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function isSaved(key: string, table: string, item: LibraryMovieItem) {
|
async function isSaved(key: string, item: LibraryMovieItem) {
|
||||||
const localSaved = readLocalItems(key, legacyKeyFor(key))
|
return readLocalItems(key, legacyKeyFor(key))
|
||||||
.some((savedItem) => savedItem.slug === item.slug && savedItem.source === item.source)
|
.some((savedItem) => savedItem.slug === item.slug && savedItem.source === item.source)
|
||||||
|
|
||||||
if (!user.value) return localSaved
|
|
||||||
|
|
||||||
const { data, error } = await $supabase
|
|
||||||
.from(table)
|
|
||||||
.select('slug')
|
|
||||||
.eq('user_id', user.value.id)
|
|
||||||
.eq('source', item.source)
|
|
||||||
.eq('slug', item.slug)
|
|
||||||
.maybeSingle()
|
|
||||||
|
|
||||||
return error ? localSaved : Boolean(data)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
loadFavorites: (limit?: number) => loadItems(favoriteKey, 'favorite_movies', limit),
|
loadFavorites: (limit?: number) => loadItems(favoriteKey, limit),
|
||||||
saveFavorite: (item: LibraryMovieItem) => saveItem(favoriteKey, 'favorite_movies', item),
|
saveFavorite: (item: LibraryMovieItem) => saveItem(favoriteKey, item),
|
||||||
removeFavorite: (item: LibraryMovieItem) => removeItem(favoriteKey, 'favorite_movies', item),
|
removeFavorite: (item: LibraryMovieItem) => removeItem(favoriteKey, item),
|
||||||
isFavorite: (item: LibraryMovieItem) => isSaved(favoriteKey, 'favorite_movies', item),
|
isFavorite: (item: LibraryMovieItem) => isSaved(favoriteKey, item),
|
||||||
saveWatchLater: (item: LibraryMovieItem) => saveItem(watchLaterKey, 'watch_later_movies', item),
|
saveWatchLater: (item: LibraryMovieItem) => saveItem(watchLaterKey, item),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,86 +0,0 @@
|
|||||||
import type { User } from '@supabase/supabase-js'
|
|
||||||
|
|
||||||
let authListenerStarted = false
|
|
||||||
|
|
||||||
export function useSupabaseAuth() {
|
|
||||||
const { $supabase } = useNuxtApp()
|
|
||||||
const user = useState<User | null>('supabase-user', () => null)
|
|
||||||
const loading = useState('supabase-auth-loading', () => false)
|
|
||||||
|
|
||||||
async function initAuth() {
|
|
||||||
if (!import.meta.client || authListenerStarted) return
|
|
||||||
|
|
||||||
authListenerStarted = true
|
|
||||||
loading.value = true
|
|
||||||
|
|
||||||
const { data } = await $supabase.auth.getSession()
|
|
||||||
user.value = data.session?.user ?? null
|
|
||||||
loading.value = false
|
|
||||||
|
|
||||||
$supabase.auth.onAuthStateChange((_event, session) => {
|
|
||||||
user.value = session?.user ?? null
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function authRedirectUrl() {
|
|
||||||
const redirectTo = import.meta.client ? window.location.origin : undefined
|
|
||||||
return redirectTo
|
|
||||||
}
|
|
||||||
|
|
||||||
async function signInWithEmail(email: string) {
|
|
||||||
return $supabase.auth.signInWithOtp({
|
|
||||||
email,
|
|
||||||
options: {
|
|
||||||
emailRedirectTo: authRedirectUrl(),
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function signInWithPassword(email: string, password: string) {
|
|
||||||
return $supabase.auth.signInWithPassword({
|
|
||||||
email,
|
|
||||||
password,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function signUpWithPassword(email: string, password: string) {
|
|
||||||
return $supabase.auth.signUp({
|
|
||||||
email,
|
|
||||||
password,
|
|
||||||
options: {
|
|
||||||
emailRedirectTo: authRedirectUrl(),
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function signInWithGoogle() {
|
|
||||||
return $supabase.auth.signInWithOAuth({
|
|
||||||
provider: 'google',
|
|
||||||
options: {
|
|
||||||
redirectTo: authRedirectUrl(),
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function resetPassword(email: string) {
|
|
||||||
return $supabase.auth.resetPasswordForEmail(email, {
|
|
||||||
redirectTo: authRedirectUrl(),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function signOut() {
|
|
||||||
return $supabase.auth.signOut()
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
user,
|
|
||||||
loading,
|
|
||||||
initAuth,
|
|
||||||
signInWithEmail,
|
|
||||||
signInWithPassword,
|
|
||||||
signUpWithPassword,
|
|
||||||
signInWithGoogle,
|
|
||||||
resetPassword,
|
|
||||||
signOut,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -63,49 +63,9 @@ function writeLocalHistory(items: WatchHistoryItem[]) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function useWatchHistory() {
|
export function useWatchHistory() {
|
||||||
const { $supabase } = useNuxtApp()
|
|
||||||
const { user } = useSupabaseAuth()
|
|
||||||
|
|
||||||
async function loadWatchHistory(limit = 12) {
|
async function loadWatchHistory(limit = 12) {
|
||||||
const localItems = readLocalHistory()
|
const localItems = readLocalHistory()
|
||||||
|
|
||||||
if (user.value) {
|
|
||||||
if (localItems.length) {
|
|
||||||
await $supabase
|
|
||||||
.from('watch_history')
|
|
||||||
.upsert(localItems.slice(0, 20).map((item) => ({
|
|
||||||
user_id: user.value?.id,
|
|
||||||
source: item.source,
|
|
||||||
slug: item.slug,
|
|
||||||
name: item.name,
|
|
||||||
origin_name: item.originName || null,
|
|
||||||
thumb: item.thumb || null,
|
|
||||||
poster: item.poster || null,
|
|
||||||
episode_name: item.episodeName || null,
|
|
||||||
episode_index: item.episodeIndex || 0,
|
|
||||||
server_index: item.serverIndex || 0,
|
|
||||||
progress_seconds: Math.floor(item.progressSeconds || 0),
|
|
||||||
duration_seconds: Math.floor(item.durationSeconds || 0),
|
|
||||||
updated_at: new Date(item.updatedAt || Date.now()).toISOString(),
|
|
||||||
})), {
|
|
||||||
onConflict: 'user_id,source,slug',
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const { data, error } = await $supabase
|
|
||||||
.from('watch_history')
|
|
||||||
.select('source, slug, name, origin_name, thumb, poster, episode_name, episode_index, server_index, progress_seconds, duration_seconds, updated_at')
|
|
||||||
.eq('user_id', user.value.id)
|
|
||||||
.order('updated_at', { ascending: false })
|
|
||||||
.limit(limit)
|
|
||||||
|
|
||||||
if (!error && data) {
|
|
||||||
return data
|
|
||||||
.map(normalizeHistoryItem)
|
|
||||||
.filter(Boolean) as WatchHistoryItem[]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return localItems
|
return localItems
|
||||||
.sort((a, b) => (b.updatedAt || 0) - (a.updatedAt || 0))
|
.sort((a, b) => (b.updatedAt || 0) - (a.updatedAt || 0))
|
||||||
.slice(0, limit)
|
.slice(0, limit)
|
||||||
@@ -125,28 +85,6 @@ export function useWatchHistory() {
|
|||||||
].slice(0, 20)
|
].slice(0, 20)
|
||||||
|
|
||||||
writeLocalHistory(localItems)
|
writeLocalHistory(localItems)
|
||||||
|
|
||||||
if (!user.value) return
|
|
||||||
|
|
||||||
await $supabase
|
|
||||||
.from('watch_history')
|
|
||||||
.upsert({
|
|
||||||
user_id: user.value.id,
|
|
||||||
source: normalizedItem.source,
|
|
||||||
slug: normalizedItem.slug,
|
|
||||||
name: normalizedItem.name,
|
|
||||||
origin_name: normalizedItem.originName || null,
|
|
||||||
thumb: normalizedItem.thumb || null,
|
|
||||||
poster: normalizedItem.poster || null,
|
|
||||||
episode_name: normalizedItem.episodeName || null,
|
|
||||||
episode_index: normalizedItem.episodeIndex || 0,
|
|
||||||
server_index: normalizedItem.serverIndex || 0,
|
|
||||||
progress_seconds: Math.floor(normalizedItem.progressSeconds || 0),
|
|
||||||
duration_seconds: Math.floor(normalizedItem.durationSeconds || 0),
|
|
||||||
updated_at: new Date(normalizedItem.updatedAt || Date.now()).toISOString(),
|
|
||||||
}, {
|
|
||||||
onConflict: 'user_id,source,slug',
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async function clearWatchHistory() {
|
async function clearWatchHistory() {
|
||||||
@@ -154,13 +92,6 @@ export function useWatchHistory() {
|
|||||||
window.localStorage.removeItem(watchHistoryKey)
|
window.localStorage.removeItem(watchHistoryKey)
|
||||||
window.localStorage.removeItem(legacyWatchHistoryKey)
|
window.localStorage.removeItem(legacyWatchHistoryKey)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (user.value) {
|
|
||||||
await $supabase
|
|
||||||
.from('watch_history')
|
|
||||||
.delete()
|
|
||||||
.eq('user_id', user.value.id)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -0,0 +1,114 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import {
|
||||||
|
BarChart3,
|
||||||
|
Film,
|
||||||
|
Home,
|
||||||
|
LogOut,
|
||||||
|
Menu,
|
||||||
|
Settings,
|
||||||
|
Users,
|
||||||
|
X,
|
||||||
|
} from 'lucide-vue-next'
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
const sidebarOpen = ref(false)
|
||||||
|
|
||||||
|
const navItems = [
|
||||||
|
{ label: 'Dashboard', icon: Home, to: '/admin' },
|
||||||
|
{ label: 'Phim', icon: Film, to: '/admin/phim' },
|
||||||
|
{ label: 'Thành viên', icon: Users, to: '/admin/thanh-vien' },
|
||||||
|
{ label: 'Cài đặt', icon: Settings, to: '/admin/cai-dat' },
|
||||||
|
]
|
||||||
|
|
||||||
|
function isActive(to: string) {
|
||||||
|
if (to === '/admin') return route.path === '/admin'
|
||||||
|
return route.path.startsWith(to)
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeSidebar() {
|
||||||
|
sidebarOpen.value = false
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="min-h-screen bg-slate-950">
|
||||||
|
<aside
|
||||||
|
class="fixed inset-y-0 left-0 z-40 w-64 transform border-r border-white/10 bg-slate-900 transition-transform lg:translate-x-0"
|
||||||
|
:class="sidebarOpen ? 'translate-x-0' : '-translate-x-full'">
|
||||||
|
<div class="flex h-16 items-center justify-between border-b border-white/10 px-4">
|
||||||
|
<NuxtLink to="/admin" class="flex items-center gap-2">
|
||||||
|
<div class="grid size-8 place-items-center rounded-lg bg-yellow-400">
|
||||||
|
<Film class="size-4 text-slate-950" />
|
||||||
|
</div>
|
||||||
|
<span class="text-lg font-black text-white">CineK Admin</span>
|
||||||
|
</NuxtLink>
|
||||||
|
<button type="button" class="grid size-8 place-items-center rounded-lg text-white hover:bg-white/10 lg:hidden"
|
||||||
|
@click="closeSidebar">
|
||||||
|
<X class="size-5" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<nav class="flex flex-col gap-1 p-4">
|
||||||
|
<NuxtLink v-for="item in navItems" :key="item.to" :to="item.to"
|
||||||
|
class="flex items-center gap-3 rounded-lg px-4 py-3 text-sm font-semibold transition"
|
||||||
|
:class="isActive(item.to)
|
||||||
|
? 'bg-yellow-400/10 text-yellow-400'
|
||||||
|
: 'text-slate-300 hover:bg-white/5 hover:text-white'">
|
||||||
|
<component :is="item.icon" class="size-5" />
|
||||||
|
{{ item.label }}
|
||||||
|
</NuxtLink>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<div class="absolute inset-x-0 bottom-0 border-t border-white/10 p-4">
|
||||||
|
<NuxtLink to="/"
|
||||||
|
class="flex items-center gap-3 rounded-lg px-4 py-3 text-sm font-semibold text-slate-300 transition hover:bg-white/5 hover:text-white">
|
||||||
|
<Home class="size-5" />
|
||||||
|
Về trang chủ
|
||||||
|
</NuxtLink>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
<div class="lg:pl-64">
|
||||||
|
<header
|
||||||
|
class="sticky top-0 z-30 flex h-16 items-center gap-4 border-b border-white/10 bg-slate-950/80 px-4 backdrop-blur-xl lg:px-6">
|
||||||
|
<button type="button" class="grid size-10 place-items-center rounded-lg text-white hover:bg-white/10 lg:hidden"
|
||||||
|
@click="sidebarOpen = true">
|
||||||
|
<Menu class="size-5" />
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="ml-auto flex items-center gap-3">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<div class="grid size-9 place-items-center rounded-full bg-yellow-400/10">
|
||||||
|
<span class="text-sm font-black text-yellow-400">A</span>
|
||||||
|
</div>
|
||||||
|
<div class="hidden sm:block">
|
||||||
|
<p class="text-sm font-semibold text-white">Admin</p>
|
||||||
|
<p class="text-xs text-slate-400">Administrator</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main class="p-4 lg:p-6">
|
||||||
|
<slot />
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Transition name="sidebar-fade">
|
||||||
|
<div v-if="sidebarOpen" class="fixed inset-0 z-30 bg-black/60 backdrop-blur-sm lg:hidden"
|
||||||
|
@click="closeSidebar" />
|
||||||
|
</Transition>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.sidebar-fade-enter-active,
|
||||||
|
.sidebar-fade-leave-active {
|
||||||
|
transition: opacity 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-fade-enter-from,
|
||||||
|
.sidebar-fade-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { Save, Settings as SettingsIcon } from 'lucide-vue-next'
|
||||||
|
|
||||||
|
definePageMeta({
|
||||||
|
layout: 'admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
useHead({
|
||||||
|
title: 'Cài đặt - CineK Admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
const siteName = ref('CineK')
|
||||||
|
const siteDescription = ref('Xem phim Hàn Quốc online với phụ đề Vietsub')
|
||||||
|
const maintenanceMode = ref(false)
|
||||||
|
const allowRegistration = ref(true)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="mb-6">
|
||||||
|
<h1 class="text-2xl font-black text-white">Cài đặt</h1>
|
||||||
|
<p class="mt-1 text-sm text-slate-400">Quản lý cài đặt hệ thống CineK</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="space-y-6">
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50 p-5">
|
||||||
|
<div class="mb-5 flex items-center gap-3">
|
||||||
|
<div class="grid size-10 place-items-center rounded-lg bg-yellow-400/10">
|
||||||
|
<SettingsIcon class="size-4 text-yellow-400" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 class="text-lg font-black text-white">Cài đặt chung</h2>
|
||||||
|
<p class="text-sm text-slate-400">Thông tin cơ bản về website</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div>
|
||||||
|
<label class="mb-2 block text-sm font-semibold text-white">Tên website</label>
|
||||||
|
<input v-model="siteName" type="text"
|
||||||
|
class="h-10 w-full rounded-lg border border-white/10 bg-white/5 px-4 text-sm text-white outline-none focus:border-yellow-400/50">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label class="mb-2 block text-sm font-semibold text-white">Mô tả website</label>
|
||||||
|
<textarea v-model="siteDescription" rows="3"
|
||||||
|
class="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-2.5 text-sm text-white outline-none focus:border-yellow-400/50"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50 p-5">
|
||||||
|
<h2 class="mb-5 text-lg font-black text-white">Tùy chọn hệ thống</h2>
|
||||||
|
|
||||||
|
<div class="space-y-4">
|
||||||
|
<label class="flex cursor-pointer items-center justify-between rounded-lg border border-white/5 bg-white/5 p-4 transition hover:border-white/10">
|
||||||
|
<div>
|
||||||
|
<p class="text-sm font-semibold text-white">Chế độ bảo trì</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">Tạm thời tắt website để bảo trì</p>
|
||||||
|
</div>
|
||||||
|
<input v-model="maintenanceMode" type="checkbox"
|
||||||
|
class="h-5 w-5 cursor-pointer rounded border-white/20 bg-white/5 text-yellow-400 focus:ring-yellow-400/50">
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<label class="flex cursor-pointer items-center justify-between rounded-lg border border-white/5 bg-white/5 p-4 transition hover:border-white/10">
|
||||||
|
<div>
|
||||||
|
<p class="text-sm font-semibold text-white">Cho phép đăng ký</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">Cho phép người dùng mới đăng ký tài khoản</p>
|
||||||
|
</div>
|
||||||
|
<input v-model="allowRegistration" type="checkbox"
|
||||||
|
class="h-5 w-5 cursor-pointer rounded border-white/20 bg-white/5 text-yellow-400 focus:ring-yellow-400/50">
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex justify-end">
|
||||||
|
<button type="button"
|
||||||
|
class="inline-flex h-10 items-center gap-2 rounded-lg bg-yellow-400 px-5 text-sm font-black text-slate-950 transition hover:bg-yellow-300">
|
||||||
|
<Save class="size-4" />
|
||||||
|
Lưu thay đổi
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,167 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { BarChart3, Film, TrendingUp, Users } from 'lucide-vue-next'
|
||||||
|
|
||||||
|
definePageMeta({
|
||||||
|
layout: 'admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
useHead({
|
||||||
|
title: 'Dashboard - CineK Admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
const stats = [
|
||||||
|
{
|
||||||
|
label: 'Tổng phim',
|
||||||
|
value: '1,234',
|
||||||
|
change: '+12%',
|
||||||
|
icon: Film,
|
||||||
|
color: 'yellow',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Thành viên',
|
||||||
|
value: '5,678',
|
||||||
|
change: '+8%',
|
||||||
|
icon: Users,
|
||||||
|
color: 'blue',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Lượt xem hôm nay',
|
||||||
|
value: '45,678',
|
||||||
|
change: '+23%',
|
||||||
|
icon: TrendingUp,
|
||||||
|
color: 'green',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Doanh thu tháng',
|
||||||
|
value: '12.5M',
|
||||||
|
change: '+15%',
|
||||||
|
icon: BarChart3,
|
||||||
|
color: 'purple',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const recentMovies = [
|
||||||
|
{ name: 'Phim Hàn Quốc 1', views: 1234, status: 'active' },
|
||||||
|
{ name: 'Phim Hàn Quốc 2', views: 890, status: 'active' },
|
||||||
|
{ name: 'Phim Hàn Quốc 3', views: 2345, status: 'active' },
|
||||||
|
{ name: 'Phim Hàn Quốc 4', views: 567, status: 'draft' },
|
||||||
|
{ name: 'Phim Hàn Quốc 5', views: 1890, status: 'active' },
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="mb-6">
|
||||||
|
<h1 class="text-2xl font-black text-white">Dashboard</h1>
|
||||||
|
<p class="mt-1 text-sm text-slate-400">Tổng quan hệ thống CineK</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mb-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
|
||||||
|
<div v-for="stat in stats" :key="stat.label"
|
||||||
|
class="rounded-xl border border-white/10 bg-slate-900/50 p-5 transition hover:border-white/20">
|
||||||
|
<div class="flex items-start justify-between">
|
||||||
|
<div>
|
||||||
|
<p class="text-sm font-semibold text-slate-400">{{ stat.label }}</p>
|
||||||
|
<p class="mt-2 text-3xl font-black text-white">{{ stat.value }}</p>
|
||||||
|
<p class="mt-2 text-sm font-semibold text-green-400">{{ stat.change }} tháng này</p>
|
||||||
|
</div>
|
||||||
|
<div class="grid size-11 place-items-center rounded-xl"
|
||||||
|
:class="{
|
||||||
|
'bg-yellow-400/10 text-yellow-400': stat.color === 'yellow',
|
||||||
|
'bg-blue-400/10 text-blue-400': stat.color === 'blue',
|
||||||
|
'bg-green-400/10 text-green-400': stat.color === 'green',
|
||||||
|
'bg-purple-400/10 text-purple-400': stat.color === 'purple',
|
||||||
|
}">
|
||||||
|
<component :is="stat.icon" class="size-5" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid gap-6 lg:grid-cols-2">
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50 p-5">
|
||||||
|
<div class="mb-4 flex items-center justify-between">
|
||||||
|
<h2 class="text-lg font-black text-white">Phim gần đây</h2>
|
||||||
|
<NuxtLink to="/admin/phim" class="text-sm font-semibold text-yellow-400 hover:text-yellow-300">
|
||||||
|
Xem tất cả
|
||||||
|
</NuxtLink>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="space-y-3">
|
||||||
|
<div v-for="movie in recentMovies" :key="movie.name"
|
||||||
|
class="flex items-center justify-between rounded-lg border border-white/5 bg-white/5 p-3 transition hover:border-white/10">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<div class="grid size-10 place-items-center rounded-lg bg-yellow-400/10">
|
||||||
|
<Film class="size-4 text-yellow-400" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="text-sm font-semibold text-white">{{ movie.name }}</p>
|
||||||
|
<p class="text-xs text-slate-400">{{ movie.views.toLocaleString() }} lượt xem</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span class="rounded-full px-2.5 py-1 text-xs font-semibold"
|
||||||
|
:class="movie.status === 'active' ? 'bg-green-400/10 text-green-400' : 'bg-slate-400/10 text-slate-400'">
|
||||||
|
{{ movie.status === 'active' ? 'Hoạt động' : 'Nháp' }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50 p-5">
|
||||||
|
<div class="mb-4 flex items-center justify-between">
|
||||||
|
<h2 class="text-lg font-black text-white">Hoạt động gần đây</h2>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div class="flex gap-3">
|
||||||
|
<div class="grid size-8 shrink-0 place-items-center rounded-full bg-green-400/10">
|
||||||
|
<Film class="size-3.5 text-green-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0 flex-1">
|
||||||
|
<p class="text-sm text-white">
|
||||||
|
<span class="font-semibold">Phim mới</span> đã được thêm
|
||||||
|
</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">2 phút trước</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex gap-3">
|
||||||
|
<div class="grid size-8 shrink-0 place-items-center rounded-full bg-blue-400/10">
|
||||||
|
<Users class="size-3.5 text-blue-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0 flex-1">
|
||||||
|
<p class="text-sm text-white">
|
||||||
|
<span class="font-semibold">15 thành viên</span> mới đăng ký
|
||||||
|
</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">1 giờ trước</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex gap-3">
|
||||||
|
<div class="grid size-8 shrink-0 place-items-center rounded-full bg-yellow-400/10">
|
||||||
|
<TrendingUp class="size-3.5 text-yellow-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0 flex-1">
|
||||||
|
<p class="text-sm text-white">
|
||||||
|
Lượt xem tăng <span class="font-semibold">23%</span> so với hôm qua
|
||||||
|
</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">3 giờ trước</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex gap-3">
|
||||||
|
<div class="grid size-8 shrink-0 place-items-center rounded-full bg-purple-400/10">
|
||||||
|
<BarChart3 class="size-3.5 text-purple-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0 flex-1">
|
||||||
|
<p class="text-sm text-white">
|
||||||
|
Doanh thu tháng đạt <span class="font-semibold">12.5M</span>
|
||||||
|
</p>
|
||||||
|
<p class="mt-1 text-xs text-slate-400">5 giờ trước</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,126 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { Edit, Eye, Film, MoreVertical, Plus, Search, Trash2 } from 'lucide-vue-next'
|
||||||
|
|
||||||
|
definePageMeta({
|
||||||
|
layout: 'admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
useHead({
|
||||||
|
title: 'Quản lý phim - CineK Admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
const searchQuery = ref('')
|
||||||
|
|
||||||
|
const movies = [
|
||||||
|
{ id: 1, name: 'Phim Hàn Quốc 1', originName: 'Korean Drama 1', views: 1234, status: 'active', updatedAt: '2024-01-15' },
|
||||||
|
{ id: 2, name: 'Phim Hàn Quốc 2', originName: 'Korean Drama 2', views: 890, status: 'active', updatedAt: '2024-01-14' },
|
||||||
|
{ id: 3, name: 'Phim Hàn Quốc 3', originName: 'Korean Movie 1', views: 2345, status: 'active', updatedAt: '2024-01-13' },
|
||||||
|
{ id: 4, name: 'Phim Hàn Quốc 4', originName: 'Korean Drama 3', views: 567, status: 'draft', updatedAt: '2024-01-12' },
|
||||||
|
{ id: 5, name: 'Phim Hàn Quốc 5', originName: 'Korean Movie 2', views: 1890, status: 'active', updatedAt: '2024-01-11' },
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
|
||||||
|
<div>
|
||||||
|
<h1 class="text-2xl font-black text-white">Quản lý phim</h1>
|
||||||
|
<p class="mt-1 text-sm text-slate-400">Quản lý tất cả phim trên CineK</p>
|
||||||
|
</div>
|
||||||
|
<button type="button"
|
||||||
|
class="inline-flex h-10 items-center gap-2 rounded-lg bg-yellow-400 px-4 text-sm font-black text-slate-950 transition hover:bg-yellow-300">
|
||||||
|
<Plus class="size-4" />
|
||||||
|
Thêm phim mới
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50">
|
||||||
|
<div class="flex items-center gap-3 border-b border-white/10 p-4">
|
||||||
|
<div class="relative flex-1">
|
||||||
|
<Search class="absolute left-3 top-1/2 size-4 -translate-y-1/2 text-slate-400" />
|
||||||
|
<input v-model="searchQuery" type="search" placeholder="Tìm kiếm phim..."
|
||||||
|
class="h-10 w-full rounded-lg border border-white/10 bg-white/5 pl-10 pr-4 text-sm text-white placeholder:text-slate-400 outline-none focus:border-yellow-400/50">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="overflow-x-auto">
|
||||||
|
<table class="w-full">
|
||||||
|
<thead>
|
||||||
|
<tr class="border-b border-white/10 text-left text-xs font-semibold uppercase text-slate-400">
|
||||||
|
<th class="px-4 py-3">Phim</th>
|
||||||
|
<th class="px-4 py-3">Lượt xem</th>
|
||||||
|
<th class="px-4 py-3">Trạng thái</th>
|
||||||
|
<th class="px-4 py-3">Cập nhật</th>
|
||||||
|
<th class="px-4 py-3 text-right">Thao tác</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="divide-y divide-white/5">
|
||||||
|
<tr v-for="movie in movies" :key="movie.id" class="transition hover:bg-white/5">
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<div class="grid size-10 shrink-0 place-items-center rounded-lg bg-yellow-400/10">
|
||||||
|
<Film class="size-4 text-yellow-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0">
|
||||||
|
<p class="truncate text-sm font-semibold text-white">{{ movie.name }}</p>
|
||||||
|
<p class="truncate text-xs text-slate-400">{{ movie.originName }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="px-4 py-3 text-sm text-slate-300">{{ movie.views.toLocaleString() }}</td>
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<span class="rounded-full px-2.5 py-1 text-xs font-semibold"
|
||||||
|
:class="movie.status === 'active' ? 'bg-green-400/10 text-green-400' : 'bg-slate-400/10 text-slate-400'">
|
||||||
|
{{ movie.status === 'active' ? 'Hoạt động' : 'Nháp' }}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td class="px-4 py-3 text-sm text-slate-400">{{ movie.updatedAt }}</td>
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<div class="flex items-center justify-end gap-1">
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
<Eye class="size-4" />
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
<Edit class="size-4" />
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg text-red-400 transition hover:bg-red-400/10">
|
||||||
|
<Trash2 class="size-4" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-center justify-between border-t border-white/10 p-4">
|
||||||
|
<p class="text-sm text-slate-400">Hiển thị 1-5 / 1,234 phim</p>
|
||||||
|
<div class="flex items-center gap-2">
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
‹
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg bg-yellow-400/10 text-sm font-semibold text-yellow-400">
|
||||||
|
1
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-sm font-semibold text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
2
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-sm font-semibold text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
3
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
›
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -0,0 +1,127 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { Edit, Mail, Search, Trash2, UserRound } from 'lucide-vue-next'
|
||||||
|
|
||||||
|
definePageMeta({
|
||||||
|
layout: 'admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
useHead({
|
||||||
|
title: 'Quản lý thành viên - CineK Admin',
|
||||||
|
})
|
||||||
|
|
||||||
|
const searchQuery = ref('')
|
||||||
|
|
||||||
|
const users = [
|
||||||
|
{ id: 1, name: 'Nguyễn Văn A', email: 'nguyenvana@example.com', role: 'admin', joined: '2024-01-01', status: 'active' },
|
||||||
|
{ id: 2, name: 'Trần Thị B', email: 'tranthib@example.com', role: 'user', joined: '2024-01-05', status: 'active' },
|
||||||
|
{ id: 3, name: 'Lê Văn C', email: 'levanc@example.com', role: 'user', joined: '2024-01-10', status: 'active' },
|
||||||
|
{ id: 4, name: 'Phạm Thị D', email: 'phamthid@example.com', role: 'user', joined: '2024-01-12', status: 'inactive' },
|
||||||
|
{ id: 5, name: 'Hoàng Văn E', email: 'hoangvane@example.com', role: 'moderator', joined: '2024-01-15', status: 'active' },
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="mb-6">
|
||||||
|
<h1 class="text-2xl font-black text-white">Quản lý thành viên</h1>
|
||||||
|
<p class="mt-1 text-sm text-slate-400">Quản lý tài khoản thành viên CineK</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-xl border border-white/10 bg-slate-900/50">
|
||||||
|
<div class="flex items-center gap-3 border-b border-white/10 p-4">
|
||||||
|
<div class="relative flex-1">
|
||||||
|
<Search class="absolute left-3 top-1/2 size-4 -translate-y-1/2 text-slate-400" />
|
||||||
|
<input v-model="searchQuery" type="search" placeholder="Tìm kiếm thành viên..."
|
||||||
|
class="h-10 w-full rounded-lg border border-white/10 bg-white/5 pl-10 pr-4 text-sm text-white placeholder:text-slate-400 outline-none focus:border-yellow-400/50">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="overflow-x-auto">
|
||||||
|
<table class="w-full">
|
||||||
|
<thead>
|
||||||
|
<tr class="border-b border-white/10 text-left text-xs font-semibold uppercase text-slate-400">
|
||||||
|
<th class="px-4 py-3">Thành viên</th>
|
||||||
|
<th class="px-4 py-3">Vai trò</th>
|
||||||
|
<th class="px-4 py-3">Trạng thái</th>
|
||||||
|
<th class="px-4 py-3">Tham gia</th>
|
||||||
|
<th class="px-4 py-3 text-right">Thao tác</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="divide-y divide-white/5">
|
||||||
|
<tr v-for="user in users" :key="user.id" class="transition hover:bg-white/5">
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<div class="flex items-center gap-3">
|
||||||
|
<div class="grid size-10 shrink-0 place-items-center rounded-full bg-yellow-400/10">
|
||||||
|
<UserRound class="size-4 text-yellow-400" />
|
||||||
|
</div>
|
||||||
|
<div class="min-w-0">
|
||||||
|
<p class="truncate text-sm font-semibold text-white">{{ user.name }}</p>
|
||||||
|
<p class="flex items-center gap-1.5 truncate text-xs text-slate-400">
|
||||||
|
<Mail class="size-3" />
|
||||||
|
{{ user.email }}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<span class="rounded-full px-2.5 py-1 text-xs font-semibold"
|
||||||
|
:class="{
|
||||||
|
'bg-red-400/10 text-red-400': user.role === 'admin',
|
||||||
|
'bg-blue-400/10 text-blue-400': user.role === 'moderator',
|
||||||
|
'bg-slate-400/10 text-slate-400': user.role === 'user',
|
||||||
|
}">
|
||||||
|
{{ user.role === 'admin' ? 'Admin' : user.role === 'moderator' ? 'Moderator' : 'User' }}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<span class="rounded-full px-2.5 py-1 text-xs font-semibold"
|
||||||
|
:class="user.status === 'active' ? 'bg-green-400/10 text-green-400' : 'bg-slate-400/10 text-slate-400'">
|
||||||
|
{{ user.status === 'active' ? 'Hoạt động' : 'Khóa' }}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td class="px-4 py-3 text-sm text-slate-400">{{ user.joined }}</td>
|
||||||
|
<td class="px-4 py-3">
|
||||||
|
<div class="flex items-center justify-end gap-1">
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
<Edit class="size-4" />
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg text-red-400 transition hover:bg-red-400/10">
|
||||||
|
<Trash2 class="size-4" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-center justify-between border-t border-white/10 p-4">
|
||||||
|
<p class="text-sm text-slate-400">Hiển thị 1-5 / 5,678 thành viên</p>
|
||||||
|
<div class="flex items-center gap-2">
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
‹
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg bg-yellow-400/10 text-sm font-semibold text-yellow-400">
|
||||||
|
1
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-sm font-semibold text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
2
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-sm font-semibold text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
3
|
||||||
|
</button>
|
||||||
|
<button type="button"
|
||||||
|
class="grid size-8 place-items-center rounded-lg border border-white/10 text-slate-400 transition hover:bg-white/10 hover:text-white">
|
||||||
|
›
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
@@ -33,7 +33,6 @@ const hero = computed(() => heroSlides.value[heroIndex.value] ?? movies.value[0]
|
|||||||
const heroDetail = ref<any>(null)
|
const heroDetail = ref<any>(null)
|
||||||
const sourceStatus = computed(() => data.value?.sources ?? [])
|
const sourceStatus = computed(() => data.value?.sources ?? [])
|
||||||
const watchHistory = ref<WatchHistoryItem[]>([])
|
const watchHistory = ref<WatchHistoryItem[]>([])
|
||||||
const { user, initAuth } = useSupabaseAuth()
|
|
||||||
const {
|
const {
|
||||||
loadWatchHistory: fetchWatchHistory,
|
loadWatchHistory: fetchWatchHistory,
|
||||||
clearWatchHistory: removeWatchHistory,
|
clearWatchHistory: removeWatchHistory,
|
||||||
@@ -252,12 +251,7 @@ watch(hero, async (currentHero) => {
|
|||||||
}
|
}
|
||||||
}, { immediate: true })
|
}, { immediate: true })
|
||||||
|
|
||||||
watch(user, () => {
|
|
||||||
loadWatchHistory()
|
|
||||||
})
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
initAuth()
|
|
||||||
heroTimer = setInterval(nextHero, 6500)
|
heroTimer = setInterval(nextHero, 6500)
|
||||||
loadWatchHistory()
|
loadWatchHistory()
|
||||||
window.addEventListener('storage', loadWatchHistory)
|
window.addEventListener('storage', loadWatchHistory)
|
||||||
|
|||||||
@@ -2,7 +2,6 @@
|
|||||||
import { Clock3, Trash2 } from 'lucide-vue-next'
|
import { Clock3, Trash2 } from 'lucide-vue-next'
|
||||||
import type { WatchHistoryItem } from '~/composables/useWatchHistory'
|
import type { WatchHistoryItem } from '~/composables/useWatchHistory'
|
||||||
|
|
||||||
const { initAuth } = useSupabaseAuth()
|
|
||||||
const { loadWatchHistory, clearWatchHistory } = useWatchHistory()
|
const { loadWatchHistory, clearWatchHistory } = useWatchHistory()
|
||||||
const historyItems = ref<WatchHistoryItem[]>([])
|
const historyItems = ref<WatchHistoryItem[]>([])
|
||||||
const loading = ref(true)
|
const loading = ref(true)
|
||||||
@@ -60,7 +59,6 @@ async function removeHistory() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await initAuth()
|
|
||||||
await refreshHistory()
|
await refreshHistory()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@@ -10,7 +10,6 @@ const activeTab = ref<'episodes' | 'actors'>('episodes')
|
|||||||
const isFavoriteMovie = ref(false)
|
const isFavoriteMovie = ref(false)
|
||||||
const actionMessage = ref('')
|
const actionMessage = ref('')
|
||||||
const actionBusy = ref(false)
|
const actionBusy = ref(false)
|
||||||
const { user, initAuth } = useSupabaseAuth()
|
|
||||||
const {
|
const {
|
||||||
isFavorite,
|
isFavorite,
|
||||||
saveFavorite,
|
saveFavorite,
|
||||||
@@ -126,7 +125,7 @@ async function toggleFavorite() {
|
|||||||
} else {
|
} else {
|
||||||
await saveFavorite(libraryItem.value)
|
await saveFavorite(libraryItem.value)
|
||||||
isFavoriteMovie.value = true
|
isFavoriteMovie.value = true
|
||||||
flashActionMessage(user.value ? 'Đã lưu vào yêu thích.' : 'Đã lưu yêu thích trên thiết bị này.')
|
flashActionMessage('Đã lưu vào yêu thích.')
|
||||||
}
|
}
|
||||||
actionBusy.value = false
|
actionBusy.value = false
|
||||||
}
|
}
|
||||||
@@ -137,7 +136,7 @@ async function addToWatchLater() {
|
|||||||
actionBusy.value = true
|
actionBusy.value = true
|
||||||
await saveWatchLater(libraryItem.value)
|
await saveWatchLater(libraryItem.value)
|
||||||
actionBusy.value = false
|
actionBusy.value = false
|
||||||
flashActionMessage(user.value ? 'Đã thêm vào danh sách xem sau.' : 'Đã thêm vào danh sách xem sau trên thiết bị này.')
|
flashActionMessage('Đã thêm vào danh sách xem sau.')
|
||||||
}
|
}
|
||||||
|
|
||||||
async function shareMovie() {
|
async function shareMovie() {
|
||||||
@@ -164,7 +163,6 @@ async function shareMovie() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await initAuth()
|
|
||||||
await refreshFavoriteState()
|
await refreshFavoriteState()
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -176,7 +174,7 @@ watch(requestedSources, () => {
|
|||||||
selectedServer.value = 0
|
selectedServer.value = 0
|
||||||
})
|
})
|
||||||
|
|
||||||
watch([libraryItem, user], () => {
|
watch(libraryItem, () => {
|
||||||
refreshFavoriteState()
|
refreshFavoriteState()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
+26
-76
@@ -1,31 +1,12 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Clock3, Heart, Mail, UserRound } from 'lucide-vue-next'
|
import { Clock3, Heart } from 'lucide-vue-next'
|
||||||
|
|
||||||
const { user, loading, initAuth } = useSupabaseAuth()
|
|
||||||
|
|
||||||
const defaultAvatar = 'https://thumbs.dreamstime.com/b/avatar-vietnam-character-your-project-others-avatar-vietnam-character-274539000.jpg'
|
|
||||||
const memberName = computed(() => {
|
|
||||||
const metadata = user.value?.user_metadata || {}
|
|
||||||
const name = metadata.name || metadata.full_name || metadata.user_name
|
|
||||||
if (typeof name === 'string' && name.trim()) return name.trim()
|
|
||||||
return user.value?.email?.split('@')[0] || 'Thành viên'
|
|
||||||
})
|
|
||||||
|
|
||||||
const memberAvatar = computed(() => {
|
|
||||||
const metadata = user.value?.user_metadata || {}
|
|
||||||
return typeof metadata.avatar_url === 'string' && metadata.avatar_url ? metadata.avatar_url : defaultAvatar
|
|
||||||
})
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
initAuth()
|
|
||||||
})
|
|
||||||
|
|
||||||
useHead({
|
useHead({
|
||||||
title: 'Trang cá nhân - CineK',
|
title: 'Thư viện - CineK',
|
||||||
meta: [
|
meta: [
|
||||||
{
|
{
|
||||||
name: 'description',
|
name: 'description',
|
||||||
content: 'Quản lý tài khoản CineK, đồng bộ lịch sử xem, danh sách yêu thích và các phim muốn xem sau.',
|
content: 'Quản lý lịch sử xem, danh sách yêu thích và các phim muốn xem sau trên CineK.',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
})
|
})
|
||||||
@@ -37,62 +18,31 @@ useHead({
|
|||||||
|
|
||||||
<section class="mx-auto max-w-390 px-4 pb-16 pt-28 sm:px-6 lg:px-8 lg:pt-32 xl:px-10">
|
<section class="mx-auto max-w-390 px-4 pb-16 pt-28 sm:px-6 lg:px-8 lg:pt-32 xl:px-10">
|
||||||
<div class="mb-6">
|
<div class="mb-6">
|
||||||
<p class="text-sm font-black uppercase text-yellow-300">Thành viên</p>
|
<p class="text-sm font-black uppercase text-yellow-300">Thư viện</p>
|
||||||
<h1 class="mt-2 text-3xl font-black sm:text-4xl">Trang cá nhân</h1>
|
<h1 class="mt-2 text-3xl font-black sm:text-4xl">Của bạn</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="loading" class="rounded-lg border border-white/10 bg-white/6 p-5">
|
<div class="grid gap-3 sm:grid-cols-2 lg:grid-cols-1">
|
||||||
<div class="h-24 animate-pulse rounded-md bg-white/10" />
|
<NuxtLink to="/lich-su"
|
||||||
</div>
|
class="flex items-center gap-3 rounded-lg border border-white/10 bg-white/6 p-4 transition hover:bg-white/10">
|
||||||
|
<span class="grid size-10 place-items-center rounded-md bg-yellow-300 text-slate-950">
|
||||||
<div v-else-if="user" class="grid gap-5 lg:grid-cols-[minmax(0,1fr)_22rem]">
|
<Clock3 class="size-5" />
|
||||||
<section class="rounded-lg border border-white/10 bg-white/6 p-5 sm:p-6">
|
</span>
|
||||||
<div class="flex flex-col gap-5 sm:flex-row sm:items-center">
|
<span>
|
||||||
<img :src="memberAvatar" :alt="memberName"
|
<span class="block font-black">Lịch sử xem</span>
|
||||||
class="size-24 shrink-0 rounded-full object-cover ring-4 ring-yellow-300/30">
|
<span class="text-sm text-slate-400">Xem tiếp phim đang dở</span>
|
||||||
<div class="min-w-0">
|
</span>
|
||||||
<h2 class="truncate text-2xl font-black">{{ memberName }}</h2>
|
</NuxtLink>
|
||||||
<p class="mt-2 inline-flex items-center gap-2 text-sm font-semibold text-slate-300">
|
<NuxtLink to="/yeu-thich"
|
||||||
<Mail class="size-4 text-yellow-300" />
|
class="flex items-center gap-3 rounded-lg border border-white/10 bg-white/6 p-4 transition hover:bg-white/10">
|
||||||
{{ user.email }}
|
<span class="grid size-10 place-items-center rounded-md bg-white/10 text-yellow-300">
|
||||||
</p>
|
<Heart class="size-5 fill-current" />
|
||||||
<p class="mt-4 max-w-2xl text-sm leading-6 text-slate-400">
|
</span>
|
||||||
Tài khoản này dùng để đồng bộ lịch sử xem và các dữ liệu cá nhân của bạn trên CineK.
|
<span>
|
||||||
</p>
|
<span class="block font-black">Yêu thích</span>
|
||||||
</div>
|
<span class="text-sm text-slate-400">Phim bạn đã lưu</span>
|
||||||
</div>
|
</span>
|
||||||
</section>
|
</NuxtLink>
|
||||||
|
|
||||||
<aside class="grid gap-3 sm:grid-cols-2 lg:grid-cols-1">
|
|
||||||
<NuxtLink to="/lich-su"
|
|
||||||
class="flex items-center gap-3 rounded-lg border border-white/10 bg-white/6 p-4 transition hover:bg-white/10">
|
|
||||||
<span class="grid size-10 place-items-center rounded-md bg-yellow-300 text-slate-950">
|
|
||||||
<Clock3 class="size-5" />
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
<span class="block font-black">Lịch sử xem</span>
|
|
||||||
<span class="text-sm text-slate-400">Xem tiếp phim đang dở</span>
|
|
||||||
</span>
|
|
||||||
</NuxtLink>
|
|
||||||
<NuxtLink to="/yeu-thich"
|
|
||||||
class="flex items-center gap-3 rounded-lg border border-white/10 bg-white/6 p-4 transition hover:bg-white/10">
|
|
||||||
<span class="grid size-10 place-items-center rounded-md bg-white/10 text-yellow-300">
|
|
||||||
<Heart class="size-5 fill-current" />
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
<span class="block font-black">Yêu thích</span>
|
|
||||||
<span class="text-sm text-slate-400">Phim bạn đã lưu</span>
|
|
||||||
</span>
|
|
||||||
</NuxtLink>
|
|
||||||
</aside>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div v-else class="rounded-lg border border-white/10 bg-white/6 p-6">
|
|
||||||
<UserRound class="size-10 text-yellow-300" />
|
|
||||||
<h2 class="mt-4 text-xl font-black">Bạn chưa đăng nhập</h2>
|
|
||||||
<p class="mt-2 text-sm leading-6 text-slate-300">
|
|
||||||
Bấm nút Thành viên trên header để đăng nhập hoặc đăng ký tài khoản.
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
@@ -70,7 +70,6 @@ const {
|
|||||||
loadWatchHistory: fetchWatchHistory,
|
loadWatchHistory: fetchWatchHistory,
|
||||||
saveWatchHistory: persistWatchHistory,
|
saveWatchHistory: persistWatchHistory,
|
||||||
} = useWatchHistory()
|
} = useWatchHistory()
|
||||||
const { user, initAuth } = useSupabaseAuth()
|
|
||||||
const {
|
const {
|
||||||
isFavorite,
|
isFavorite,
|
||||||
saveFavorite,
|
saveFavorite,
|
||||||
@@ -886,7 +885,7 @@ async function toggleFavorite() {
|
|||||||
} else {
|
} else {
|
||||||
await saveFavorite(libraryItem.value)
|
await saveFavorite(libraryItem.value)
|
||||||
isFavoriteMovie.value = true
|
isFavoriteMovie.value = true
|
||||||
flashActionMessage(user.value ? 'Đã lưu vào yêu thích.' : 'Đã lưu yêu thích trên thiết bị này.')
|
flashActionMessage('Đã lưu vào yêu thích.')
|
||||||
}
|
}
|
||||||
actionBusy.value = false
|
actionBusy.value = false
|
||||||
}
|
}
|
||||||
@@ -897,7 +896,7 @@ async function addToWatchLater() {
|
|||||||
actionBusy.value = true
|
actionBusy.value = true
|
||||||
await saveWatchLater(libraryItem.value)
|
await saveWatchLater(libraryItem.value)
|
||||||
actionBusy.value = false
|
actionBusy.value = false
|
||||||
flashActionMessage(user.value ? 'Đã thêm vào danh sách xem sau.' : 'Đã thêm vào danh sách xem sau trên thiết bị này.')
|
flashActionMessage('Đã thêm vào danh sách xem sau.')
|
||||||
}
|
}
|
||||||
|
|
||||||
async function shareMovie() {
|
async function shareMovie() {
|
||||||
@@ -921,7 +920,6 @@ async function shareMovie() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await initAuth()
|
|
||||||
await refreshFavoriteState()
|
await refreshFavoriteState()
|
||||||
document.addEventListener('visibilitychange', handleVisibilityChange)
|
document.addEventListener('visibilitychange', handleVisibilityChange)
|
||||||
document.addEventListener('keydown', handleKeyboardShortcut)
|
document.addEventListener('keydown', handleKeyboardShortcut)
|
||||||
@@ -972,7 +970,7 @@ watch([canUseEmbed, canUseHls], () => {
|
|||||||
immediate: true,
|
immediate: true,
|
||||||
})
|
})
|
||||||
|
|
||||||
watch([libraryItem, user], () => {
|
watch(libraryItem, () => {
|
||||||
refreshFavoriteState()
|
refreshFavoriteState()
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
+3
-17
@@ -1,8 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Heart, UserRound } from 'lucide-vue-next'
|
import { Heart } from 'lucide-vue-next'
|
||||||
import type { LibraryMovieItem } from '~/composables/useMovieLibrary'
|
import type { LibraryMovieItem } from '~/composables/useMovieLibrary'
|
||||||
|
|
||||||
const { user, loading: authLoading, initAuth } = useSupabaseAuth()
|
|
||||||
const { loadFavorites } = useMovieLibrary()
|
const { loadFavorites } = useMovieLibrary()
|
||||||
const favoriteItems = ref<LibraryMovieItem[]>([])
|
const favoriteItems = ref<LibraryMovieItem[]>([])
|
||||||
const loading = ref(true)
|
const loading = ref(true)
|
||||||
@@ -23,14 +22,9 @@ function movieLink(item: LibraryMovieItem) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await initAuth()
|
|
||||||
await refreshFavorites()
|
await refreshFavorites()
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(user, () => {
|
|
||||||
refreshFavorites()
|
|
||||||
})
|
|
||||||
|
|
||||||
useHead({
|
useHead({
|
||||||
title: 'Yêu thích - CineK',
|
title: 'Yêu thích - CineK',
|
||||||
meta: [
|
meta: [
|
||||||
@@ -52,7 +46,7 @@ useHead({
|
|||||||
<h1 class="mt-2 text-3xl font-black sm:text-4xl">Yêu thích</h1>
|
<h1 class="mt-2 text-3xl font-black sm:text-4xl">Yêu thích</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="loading || authLoading" class="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-6">
|
<div v-if="loading" class="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-6">
|
||||||
<div v-for="item in 12" :key="item" class="aspect-2/3 animate-pulse rounded-md bg-white/10" />
|
<div v-for="item in 12" :key="item" class="aspect-2/3 animate-pulse rounded-md bg-white/10" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -75,7 +69,7 @@ useHead({
|
|||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else-if="user"
|
<div v-else
|
||||||
class="flex min-h-80 flex-col items-center justify-center rounded-lg border border-white/10 bg-white/6 p-6 text-center">
|
class="flex min-h-80 flex-col items-center justify-center rounded-lg border border-white/10 bg-white/6 p-6 text-center">
|
||||||
<Heart class="size-12 text-yellow-300" />
|
<Heart class="size-12 text-yellow-300" />
|
||||||
<h2 class="mt-4 text-xl font-black">Chưa có phim yêu thích</h2>
|
<h2 class="mt-4 text-xl font-black">Chưa có phim yêu thích</h2>
|
||||||
@@ -87,14 +81,6 @@ useHead({
|
|||||||
Duyệt phim
|
Duyệt phim
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else class="rounded-lg border border-white/10 bg-white/6 p-6">
|
|
||||||
<UserRound class="size-10 text-yellow-300" />
|
|
||||||
<h2 class="mt-4 text-xl font-black">Bạn chưa đăng nhập</h2>
|
|
||||||
<p class="mt-2 text-sm leading-6 text-slate-300">
|
|
||||||
Đăng nhập để đồng bộ danh sách yêu thích, hoặc vẫn có thể lưu tạm trên thiết bị này.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,18 +0,0 @@
|
|||||||
import { createClient } from '@supabase/supabase-js'
|
|
||||||
|
|
||||||
export default defineNuxtPlugin(() => {
|
|
||||||
const config = useRuntimeConfig()
|
|
||||||
const supabase = createClient(config.public.supabaseUrl, config.public.supabaseKey, {
|
|
||||||
auth: {
|
|
||||||
persistSession: import.meta.client,
|
|
||||||
autoRefreshToken: import.meta.client,
|
|
||||||
detectSessionInUrl: import.meta.client,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
return {
|
|
||||||
provide: {
|
|
||||||
supabase,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
})
|
|
||||||
+4
-4
@@ -2,14 +2,14 @@ services:
|
|||||||
cinek:
|
cinek:
|
||||||
build:
|
build:
|
||||||
context: .
|
context: .
|
||||||
dockerfile: Dockerfile
|
dockerfile: Dockerfile.dev
|
||||||
container_name: cinek
|
container_name: cinek
|
||||||
restart: unless-stopped
|
restart: unless-stopped
|
||||||
environment:
|
environment:
|
||||||
NODE_ENV: production
|
|
||||||
HOST: 0.0.0.0
|
HOST: 0.0.0.0
|
||||||
PORT: 3002
|
PORT: 3002
|
||||||
NITRO_HOST: 0.0.0.0
|
|
||||||
NITRO_PORT: 3002
|
|
||||||
ports:
|
ports:
|
||||||
- "3002:3002"
|
- "3002:3002"
|
||||||
|
volumes:
|
||||||
|
- .:/app
|
||||||
|
- /app/node_modules
|
||||||
|
|||||||
@@ -25,12 +25,6 @@ export default defineNuxtConfig({
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
runtimeConfig: {
|
|
||||||
public: {
|
|
||||||
supabaseUrl: process.env.SUPABASE_URL,
|
|
||||||
supabaseKey: process.env.SUPABASE_KEY,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
devServer: {
|
devServer: {
|
||||||
host: '0.0.0.0',
|
host: '0.0.0.0',
|
||||||
port: 3002,
|
port: 3002,
|
||||||
|
|||||||
Generated
+2
-95
@@ -7,7 +7,6 @@
|
|||||||
"name": "cinek",
|
"name": "cinek",
|
||||||
"hasInstallScript": true,
|
"hasInstallScript": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@supabase/supabase-js": "^2.106.0",
|
|
||||||
"@tailwindcss/vite": "^4.3.0",
|
"@tailwindcss/vite": "^4.3.0",
|
||||||
"hls.js": "^1.6.16",
|
"hls.js": "^1.6.16",
|
||||||
"lucide-vue-next": "^1.0.0",
|
"lucide-vue-next": "^1.0.0",
|
||||||
@@ -3394,90 +3393,6 @@
|
|||||||
"integrity": "sha512-BMq1K3DsElxDWawkX6eLg9+CKJrTVGCBAWVuHXVUV2u0s2711qiChLSId6ikYPfxhdYocLNt3wWwSvDiTvFabw==",
|
"integrity": "sha512-BMq1K3DsElxDWawkX6eLg9+CKJrTVGCBAWVuHXVUV2u0s2711qiChLSId6ikYPfxhdYocLNt3wWwSvDiTvFabw==",
|
||||||
"license": "CC0-1.0"
|
"license": "CC0-1.0"
|
||||||
},
|
},
|
||||||
"node_modules/@supabase/auth-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-JY7602OvjK2l3BjsQkpePpxR+6P0iG37gCrZNWAMhAuNh1iFnhGRwj/y5EshUG0INMPGFrj0UA9MErQ/kOEKFg==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": "2.8.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/functions-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-ADIkJYH5w7HbnGVAAlCbyKoLF5QdfyezBLfYXpUqhxZOacK6YepOvnP/8p4p+50bhTPWp6VhDxu19KO7e/qU2g==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": "2.8.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/phoenix": {
|
|
||||||
"version": "0.4.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/phoenix/-/phoenix-0.4.2.tgz",
|
|
||||||
"integrity": "sha512-YSAGnmDAfuleFCVt3CeurQZAhxRfXWeZIIkwp7NhYzQ1UwW6ePSnzsFAiUm/mbCkfoCf70QQHKW/K6RKh52a4A==",
|
|
||||||
"license": "MIT"
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/postgrest-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-vNKFAXQrtmUn7J3LbN+uMlt0jciAwRIBpdy6Do4DKrpf1xj0kJhbqXTX4y8ziewWUEEx8G5GPnDmprXXaO9f3w==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": "2.8.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/realtime-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-mYZoaYpkyjlecixbvxCu0h3jw12uHfEcUqNdaRATNI8zQVI5arels+VJzAGcHwNiD+/Juv0OXIuk+M7SHsdI4A==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"@supabase/phoenix": "^0.4.2",
|
|
||||||
"tslib": "2.8.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/storage-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-BHc3nIjD3zfdDxBenphXrLJSoQ+qwo24VD96cVzmjBFbQVk5krvwRNUXrA5ozPplA3Vhlst2d/hy9R9ViqH2lg==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"iceberg-js": "^0.8.1",
|
|
||||||
"tslib": "2.8.1"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@supabase/supabase-js": {
|
|
||||||
"version": "2.106.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.106.0.tgz",
|
|
||||||
"integrity": "sha512-OOoo3sLj9iVXNp6b+fkyOfFeQrvvNy7nQbaONNf72dOaictUeS39hFDS9argIRTag6M3ZxIypNWcrDAwLgUihQ==",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
|
||||||
"@supabase/auth-js": "2.106.0",
|
|
||||||
"@supabase/functions-js": "2.106.0",
|
|
||||||
"@supabase/postgrest-js": "2.106.0",
|
|
||||||
"@supabase/realtime-js": "2.106.0",
|
|
||||||
"@supabase/storage-js": "2.106.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@tailwindcss/node": {
|
"node_modules/@tailwindcss/node": {
|
||||||
"version": "4.3.0",
|
"version": "4.3.0",
|
||||||
"resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.3.0.tgz",
|
"resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.3.0.tgz",
|
||||||
@@ -6055,15 +5970,6 @@
|
|||||||
"node": ">=16.17.0"
|
"node": ">=16.17.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/iceberg-js": {
|
|
||||||
"version": "0.8.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/iceberg-js/-/iceberg-js-0.8.1.tgz",
|
|
||||||
"integrity": "sha512-1dhVQZXhcHje7798IVM+xoo/1ZdVfzOMIc8/rgVSijRK38EDqOJoGula9N/8ZI5RD8QTxNQtK/Gozpr+qUqRRA==",
|
|
||||||
"license": "MIT",
|
|
||||||
"engines": {
|
|
||||||
"node": ">=20.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/ieee754": {
|
"node_modules/ieee754": {
|
||||||
"version": "1.2.1",
|
"version": "1.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
|
||||||
@@ -9299,7 +9205,8 @@
|
|||||||
"version": "2.8.1",
|
"version": "2.8.1",
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
|
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
|
||||||
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
|
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
|
||||||
"license": "0BSD"
|
"license": "0BSD",
|
||||||
|
"optional": true
|
||||||
},
|
},
|
||||||
"node_modules/type-fest": {
|
"node_modules/type-fest": {
|
||||||
"version": "5.6.0",
|
"version": "5.6.0",
|
||||||
|
|||||||
@@ -11,7 +11,6 @@
|
|||||||
"postinstall": "nuxt prepare"
|
"postinstall": "nuxt prepare"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@supabase/supabase-js": "^2.106.0",
|
|
||||||
"@tailwindcss/vite": "^4.3.0",
|
"@tailwindcss/vite": "^4.3.0",
|
||||||
"hls.js": "^1.6.16",
|
"hls.js": "^1.6.16",
|
||||||
"lucide-vue-next": "^1.0.0",
|
"lucide-vue-next": "^1.0.0",
|
||||||
|
|||||||
Reference in New Issue
Block a user