q792602257/lubo_comment_query
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

样式

Browse Source
This commit is contained in:
Jerry Yan
2025-12-09 11:40:16 +08:00
parent d47e369948
commit da23824678
13 changed files with 1794 additions and 3936 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4522
composer.lock generated
View File

File diff suppressed because it is too large Load Diff

0
public/favicon.ico
View File

158
resources/views/common/footer.blade.php
View File

@@ -1,72 +1,92 @@
<footer class="mt-4 bg-gray-100 dark:bg-gray-800 pb-8 xl:pt-8">
<div class="max-w-screen-lg px-4 mx-auto text-gray-400 xl:max-w-screen-xl sm:px-6 md:px-8 dark:text-gray-300">
<ul class="flex flex-wrap justify-center pb-8 text-lg font-light">
<li class="w-1/2 md:w-1/4">
<div class="text-center">
<h2 class="text-gray-500 dark:text-gray-200 text-md my-4">
永恒de草薙
</h2>
<ul>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://space.bilibili.com/328013928" target="_blank">B站主页</a>
</li>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://live.bilibili.com/24048885" target="_blank">直播间</a>
</li>
</ul>
</div>
</li>
<li class="w-1/2 md:w-1/4">
<div class="text-center">
<h2 class="text-gray-500 dark:text-gray-200 text-md my-4">
课代表们
</h2>
<ul>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://space.bilibili.com/4847925" target="_blank">开心鄢的B站主页</a>
</li>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://space.bilibili.com/176444156" target="_blank">神鬼传奇的B站主页</a>
</li>
</ul>
</div>
</li>
<li class="w-1/2 md:w-1/4">
<div class="text-center">
<h2 class="text-gray-500 dark:text-gray-200 text-md my-4">
录播文件
</h2>
<ul>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://www.aliyundrive.com/s/2moBpEUqDTG" target="_blank">2022年的录播文件</a>
</li>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://www.aliyundrive.com/s/AAAMXjagZ79" target="_blank">2021年的录播文件</a>
</li>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://www.aliyundrive.com/s/hpYfF518yH7" target="_blank">2020年的录播文件</a>
</li>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://www.aliyundrive.com/s/GuyUChZ27Fy" target="_blank">2019年的录播文件</a>
</li>
</ul>
</div>
</li>
<li class="w-1/2 md:w-1/4">
<div class="text-center">
<h2 class="text-gray-500 dark:text-gray-200 text-md my-4">
杂项
</h2>
<ul>
<li class="mb-2 md:mb-4 text-base transition-colors duration-200 hover:text-gray-800 dark:hover:text-white">
<a href="https://afdian.net/a/q792602257" target="_blank">赞助我~</a>
</li>
</ul>
</div>
</li>
</ul>
<div class="border-t border-gray-200 text-center pt-10 sm:pt-12 font-light flex items-center justify-center">
<a class="text-blue-600 underline" href="http://beian.miit.gov.cn" target="_blank">赣ICP备18004555号-4</a>
<footer class="mt-auto bg-white dark:bg-gray-800 border-t border-gray-200 dark:border-gray-700">
<div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-2 md:grid-cols-4 gap-8">
<div class="text-center md:text-left">
<h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase mb-4">
永恒de草薙
</h3>
<ul class="space-y-3">
<li>
<a href="https://space.bilibili.com/328013928" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
B站主页
</a>
</li>
<li>
<a href="https://live.bilibili.com/24048885" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
直播间
</a>
</li>
</ul>
</div>
<div class="text-center md:text-left">
<h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase mb-4">
课代表们
</h3>
<ul class="space-y-3">
<li>
<a href="https://space.bilibili.com/4847925" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
开心鄢
</a>
</li>
<li>
<a href="https://space.bilibili.com/176444156" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
神鬼传奇
</a>
</li>
</ul>
</div>
<div class="text-center md:text-left">
<h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase mb-4">
录播文件
</h3>
<ul class="space-y-3">
<li>
<a href="https://www.aliyundrive.com/s/2moBpEUqDTG" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
2022年录播
</a>
</li>
<li>
<a href="https://www.aliyundrive.com/s/AAAMXjagZ79" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
2021年录播
</a>
</li>
<li>
<a href="https://www.aliyundrive.com/s/hpYfF518yH7" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
2020年录播
</a>
</li>
<li>
<a href="https://www.aliyundrive.com/s/GuyUChZ27Fy" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
2019年录播
</a>
</li>
</ul>
</div>
<div class="text-center md:text-left">
<h3 class="text-sm font-semibold text-gray-400 tracking-wider uppercase mb-4">
关于
</h3>
<ul class="space-y-3">
<li>
<a href="https://afdian.net/a/q792602257" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
赞助我~
</a>
</li>
<li>
<a href="http://beian.miit.gov.cn" target="_blank" class="text-base text-gray-500 dark:text-gray-400 hover:text-indigo-600 dark:hover:text-white transition-colors">
赣ICP备18004555号-4
</a>
</li>
</ul>
</div>
</div>
<div class="mt-8 border-t border-gray-200 dark:border-gray-700 pt-8 md:flex md:items-center md:justify-between">
<p class="mt-8 text-base text-gray-400 md:mt-0 md:order-1 text-center w-full">
&copy; {{ date('Y') }} 永恒の录播查询站. All rights reserved.
</p>
</div>
</div>
</footer>

71
resources/views/common/header.blade.php
View File

@@ -1,56 +1,71 @@
<nav class="bg-white shadow-sm w-full" aria-label="功能导航">
<div class="mx-auto px-2 sm:px-6 lg:px-8">
<nav class="bg-white dark:bg-gray-800 shadow-md sticky top-0 z-50 transition-colors duration-200">
<div class="max-w-7xl mx-auto px-2 sm:px-6 lg:px-8">
<div class="relative flex h-16 items-center justify-between">
<div class="absolute inset-y-0 left-0 flex items-center md:hidden" onclick="document.getElementById('_mobile_menu').style.display = document.getElementById('_mobile_menu').style.display ? '' : 'none'">
<button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
<div class="absolute inset-y-0 left-0 flex items-center md:hidden">
<!-- Mobile menu button-->
<button type="button" onclick="document.getElementById('_mobile_menu').classList.toggle('hidden')" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 hover:text-gray-500 dark:hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500" aria-controls="mobile-menu" aria-expanded="false">
<span class="sr-only">Open main menu</span>
<svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
</svg>
<svg class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<div class="flex flex-1 items-center justify-center md:items-stretch md:justify-start">
<div class="flex flex-shrink-0 items-center border border-black rounded-full px-4 font-bold">
永恒の录播查询站
<div class="flex flex-shrink-0 items-center">
<a href="/" class="flex items-center space-x-2 text-gray-900 dark:text-white font-bold text-xl tracking-tight">
<span class="bg-indigo-600 text-white p-1 rounded-lg">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
</span>
<span>永恒の录播</span>
</a>
</div>
<div class="hidden sm:ml-6 md:block">
<div class="flex space-x-4">
<a class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium" href="/comments">节目单查询</a>
<a class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium" href="/danmakus">稿件查询</a>
<a class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium" href="/programs" title="数据不全，待补充">节目查询</a>
<div class="hidden md:ml-6 md:block">
<div class="flex space-x-2">
<!-- Navigation Links -->
<a href="/comments" class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">节目单查询</a>
<a href="/danmakus" class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">稿件查询</a>
<a href="/programs" class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">节目查询</a>
@auth("web")
<a class="{{ (request()->is('construct/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium" href="/construct/programs">节目建设</a>
<a href="/construct/programs" class="{{ (request()->is('construct/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} px-3 py-2 rounded-md text-sm font-medium transition-colors">建设</a>
@endauth
</div>
</div>
</div>
<div class="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
<div class="relative ml-3">
@auth("web")
<div class="bg-gray-100 cursor-pointer hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" onclick="document.getElementById('_user_menu').style.display = document.getElementById('_user_menu').style.display ? '' : 'none'">
{{ Auth::user()->name }}
</div>
<div id="_user_menu" class="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button" tabindex="-1" style="display: none">
<a href="{{ route("logout") }}" class="block px-4 py-2 text-sm text-gray-700" role="menuitem" tabindex="-1" id="user-menu-item-2">退出登录</a>
@auth("web")
<button type="button" onclick="document.getElementById('_user_menu').classList.toggle('hidden')" class="flex rounded-full bg-white dark:bg-gray-800 text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
<span class="sr-only">Open user menu</span>
<span class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-indigo-600 text-white font-semibold">
{{ substr(Auth::user()->name, 0, 1) }}
</span>
</button>
<div id="_user_menu" class="hidden absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-gray-800 py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button" tabindex="-1">
<div class="px-4 py-2 text-xs text-gray-500 dark:text-gray-400 border-b dark:border-gray-700">
{{ Auth::user()->name }}
</div>
<a href="{{ route("logout") }}" class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" role="menuitem" tabindex="-1">退出登录</a>
</div>
@endauth
@guest
<a class="hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" href="{{ route("login") }}">登录</a>
<a href="{{ route("login") }}" class="text-gray-700 dark:text-gray-300 hover:text-indigo-600 dark:hover:text-white font-medium text-sm">登录</a>
@endguest
</div>
</div>
</div>
</div>
<div class="md:hidden" id="_mobile_menu" style="display: none">
<div class="space-y-1 px-2 pt-2 pb-3">
<a class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium" href="/comments">节目单查询</a>
<a class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium" href="/danmakus">稿件查询</a>
<a class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium" href="/programs" title="数据不全，待补充">节目查询</a>
<!-- Mobile menu -->
<div class="hidden md:hidden" id="_mobile_menu">
<div class="space-y-1 px-2 pt-2 pb-3 bg-gray-50 dark:bg-gray-800 border-t dark:border-gray-700">
<a href="/comments" class="{{ (request()->is('comments', '/', 'video/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目单查询</a>
<a href="/danmakus" class="{{ (request()->is('danmakus', 'danmakus/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">稿件查询</a>
<a href="/programs" class="{{ (request()->is('programs', 'programs/*/video')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目查询</a>
@auth("web")
<a class="{{ (request()->is('construct/*')) ? 'bg-gray-900 text-white' : 'text-gray-700 hover:bg-gray-700 hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium" href="/construct/programs">节目建设</a>
<a href="/construct/programs" class="{{ (request()->is('construct/*')) ? 'bg-indigo-50 dark:bg-gray-700 text-indigo-700 dark:text-indigo-400' : 'text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700 hover:text-indigo-600 dark:hover:text-white' }} block px-3 py-2 rounded-md text-base font-medium">节目建设</a>
@endauth
</div>
</div>

133
resources/views/danmaku/index.blade.php
View File

@@ -5,61 +5,96 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<form class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto form py-2" action="">
<label for="keyword">查找视频标题，空格隔开查找多个关键词</label>
<input class="border border-black" type="text" name="keyword" id="keyword" value="{{$keyword}}">
<input class="border border-black" type="submit">
</form>
@foreach($video_list as $video)
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto px-2 md:px-4 py-4 bg-white border border-gray-200 rounded-lg shadow-md my-4 dark:bg-gray-800">
<div>
<a href="/video/{{$video->id}}" class="text-2xl font-bold text-gray-700 dark:text-white hover:text-gray-600 dark:hover:text-gray-200 hover:underline" tabindex="0" role="link">{{$video->title}}</a>
<div class="px-2 md:px-4 lg:px-8 mt-2 flex items-center justify-between">
<span class="text-sm font-light text-gray-600 dark:text-gray-400 hidden md:block">投稿时间：{{$video->created_at}}</span>
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="max-w-5xl mx-auto">
<form class="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-sm mb-8 transition-colors duration-200" action="">
<label for="keyword" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">查找视频标题</label>
<div class="relative flex items-center">
<input type="text" name="keyword" id="keyword" value="{{$keyword}}"
class="block w-full rounded-l-lg border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm py-3"
placeholder="输入关键词，空格隔开...">
<button type="submit" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-r-lg shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors duration-200">
搜索
</button>
</div>
<p class="px-2 md:px-4 lg:px-8 mt-2 text-gray-600 dark:text-gray-300">视频时长：{{$video->total_duration}}</p>
@if($video->danmakus_count > 0)
<p class="px-2 md:px-4 lg:px-8 mt-2 text-gray-600 dark:text-gray-300">
弹幕数量：{{$video->danmakus_count}}
@if($video->bilibili_danmakus_count > 0)
<img class="w-4 h-4 inline-block" src="https://cdn.jerryyan.net/luboimg/bilibili.ico" alt="B站" title="包含B站直播弹幕">
@endif
@if($video->ixigua_danmakus_count > 0)
<img class="w-4 h-4 inline-block" src="https://cdn.jerryyan.net/luboimg/ixigua.ico" alt="西瓜视频" title="包含西瓜视频直播弹幕">
@endif
@if($video->douyin_danmakus_count > 0)
<img class="w-4 h-4 inline-block" src="https://cdn.jerryyan.net/luboimg/douyin.ico" alt="抖音" title="包含抖音直播弹幕">
@endif
</p>
@endif
@if($video->programs_count > 0)
<p class="px-2 md:px-4 lg:px-8 mt-2 text-gray-600 dark:text-gray-300">节目数量：{{$video->programs_count}}</p>
@endif
<p class="mt-2 text-xs text-gray-500 dark:text-gray-400">支持多个关键词组合搜索</p>
</form>
<div class="space-y-6">
@foreach($video_list as $video)
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-100 dark:border-gray-700 hover:shadow-md transition-shadow duration-200 overflow-hidden">
<div class="p-6">
<div class="flex justify-between items-start mb-3">
<a href="/video/{{$video->id}}" class="text-xl font-bold text-gray-900 dark:text-white hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors line-clamp-1">
{{$video->title}}
</a>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm text-gray-600 dark:text-gray-400 mb-4 bg-gray-50 dark:bg-gray-700/30 p-4 rounded-lg">
<div class="flex items-center">
<span class="font-medium mr-2">投稿时间:</span>
{{$video->created_at}}
</div>
<div class="flex items-center">
<span class="font-medium mr-2">视频时长:</span>
{{$video->total_duration}}
</div>
@if($video->danmakus_count > 0)
<div class="flex items-center">
<span class="font-medium mr-2">弹幕数量:</span>
{{$video->danmakus_count}}
<div class="flex space-x-2 ml-2">
@if($video->bilibili_danmakus_count > 0)
<img class="w-4 h-4" src="https://cdn.jerryyan.net/luboimg/bilibili.ico" alt="B站" title="包含B站直播弹幕">
@endif
@if($video->ixigua_danmakus_count > 0)
<img class="w-4 h-4" src="https://cdn.jerryyan.net/luboimg/ixigua.ico" alt="西瓜视频" title="包含西瓜视频直播弹幕">
@endif
@if($video->douyin_danmakus_count > 0)
<img class="w-4 h-4" src="https://cdn.jerryyan.net/luboimg/douyin.ico" alt="抖音" title="包含抖音直播弹幕">
@endif
</div>
</div>
@endif
@if($video->programs_count > 0)
<div class="flex items-center">
<span class="font-medium mr-2">节目数量:</span>
{{$video->programs_count}}
</div>
@endif
</div>
<div class="flex flex-wrap items-center gap-4 text-sm border-t dark:border-gray-700 pt-4">
<a href="https://www.bilibili.com/video/{{$video->bvid}}" target="_blank" class="inline-flex items-center text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300 font-medium transition-colors">
去B站浏览
<svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path></svg>
</a>
@if($video->danmakus_count > 0)
<a href="/danmakus/{{$video->bvid}}" class="inline-flex items-center text-gray-700 dark:text-gray-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"></path></svg>
直播弹幕明细
</a>
@endif
@if($video->programs_count > 0)
<a href="/video/{{$video->id}}" class="inline-flex items-center text-gray-700 dark:text-gray-300 hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h16M4 18h16"></path></svg>
节目列表
</a>
@endif
</div>
</div>
</div>
@endforeach
</div>
<div class="flex items-center gap-4 mt-4">
<a href="https://www.bilibili.com/video/{{$video->bvid}}" target="_blank" class="inline-flex text-blue-600 dark:text-blue-400 hover:underline" tabindex="0" role="link">
去B站浏览
<svg class="w-5 h-5 ml-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path><path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path></svg>
</a>
@if($video->danmakus_count > 0)
<a href="/danmakus/{{$video->bvid}}" class="inline-flex text-blue-600 dark:text-blue-400 hover:underline" tabindex="0" role="link">
直播弹幕明细
</a>
@endif
@if($video->programs_count > 0)
<a href="/video/{{$video->id}}" class="inline-flex text-blue-600 dark:text-blue-400 hover:underline" tabindex="0" role="link">
节目列表
</a>
@endif
<div class="mt-8">
{{$video_list->onEachSide(1)->links()}}
</div>
</div>
@endforeach
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto sticky bottom-0">
{{$video_list->links()}}
</div>
</main>
@include("common.footer")
</body>
</html>

111
resources/views/danmaku/search_index.blade.php
View File

@@ -1,44 +1,87 @@
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>录播弹幕查询</title>
<title>录播弹幕查询 - {{$video->title}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<div>
<h3 class="text-2xl font-bold">{{$video->title}}</h3>
<h4 class="text-lg">弹幕数：{{$video->danmakus_count}}</h4>
</div>
<form action="">
<label for="keyword">查找弹幕关键词，支持搜索用户名，空格隔开查找多个关键词</label>
<input class="border border-black" type="text" name="keyword" id="keyword" value="{{$keyword}}">
<input class="border border-black" type="submit">
</form>
<table class="table-auto border-collapse w-full lg:border lg:border-black">
<thead>
<tr class="border border-black sticky bg-white lg:static top-0 left-0 right-0">
<th class="border border-black">发送人</th>
<th class="border border-black">弹幕内容</th>
<th class="border border-black">发送时间</th>
</tr>
</thead>
<tbody>
@foreach($danmakus as $danmaku)
<tr>
<td class="border">
<x-links.user_link :name="$danmaku->from" :plt-id="$danmaku->platform_id" :mid="$danmaku->from_mid"></x-links.user_link>
</td>
<td class="border">{{$danmaku->content}}</td>
<td class="border text-sm">{{$danmaku->created_at}}</td>
</tr>
@endforeach
</tbody>
</table>
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto sticky bottom-0">
{{$danmakus->links()}}
</div>
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="max-w-7xl mx-auto">
<div class="mb-8">
<h1 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">{{$video->title}}</h1>
<div class="flex items-center text-sm text-gray-500 dark:text-gray-400">
<span class="mr-4">弹幕总数：{{$video->danmakus_count}}</span>
<a class="inline-flex items-center text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300 font-medium transition-colors" href="https://www.bilibili.com/video/{{$video->bvid}}" target="_blank">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path></svg>
前往B站
</a>
</div>
</div>
<form class="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-sm mb-8 transition-colors duration-200" action="">
<label for="keyword" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">查找弹幕关键词 / 用户名</label>
<div class="relative flex items-center">
<input type="text" name="keyword" id="keyword" value="{{$keyword}}"
class="block w-full rounded-l-lg border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm py-3"
placeholder="输入内容或用户名...">
<button type="submit" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-r-lg shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors duration-200">
搜索
</button>
</div>
</form>
<!-- Desktop Table -->
<div class="hidden md:block bg-white dark:bg-gray-800 shadow overflow-hidden rounded-lg">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-gray-700">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/5">发送人</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-3/5">弹幕内容</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/5">发送时间</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
@foreach($danmakus as $danmaku)
<tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
<x-links.user_link :name="$danmaku->from" :plt-id="$danmaku->platform_id" :mid="$danmaku->from_mid"></x-links.user_link>
</td>
<td class="px-6 py-4 text-sm text-gray-900 dark:text-gray-100">
{{$danmaku->content}}
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400">
{{$danmaku->created_at}}
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<!-- Mobile List -->
<div class="md:hidden space-y-4">
@foreach($danmakus as $danmaku)
<div class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow-sm border border-gray-100 dark:border-gray-700">
<div class="flex justify-between items-start mb-2">
<div class="text-sm font-bold">
<x-links.user_link :name="$danmaku->from" :plt-id="$danmaku->platform_id" :mid="$danmaku->from_mid"></x-links.user_link>
</div>
<div class="text-xs text-gray-400">{{$danmaku->created_at}}</div>
</div>
<p class="text-gray-900 dark:text-gray-100 text-base">{{$danmaku->content}}</p>
</div>
@endforeach
</div>
<div class="mt-8">
{{$danmakus->onEachSide(1)->links()}}
</div>
</div>
</main>
@include("common.footer")
</body>
</html>

48
resources/views/file/upload.blade.php
View File

@@ -2,12 +2,48 @@
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>文件上传</title>
<title>文件上传 - 录播查询</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<form action="" enctype="multipart/form-data" method="post">
<input type="file" name="file">
<input type="submit">
</form>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-16">
<div class="max-w-md mx-auto bg-white dark:bg-gray-800 rounded-xl shadow-md overflow-hidden md:max-w-lg">
<div class="p-8">
<h2 class="text-2xl font-bold mb-6 text-center">文件上传</h2>
<form action="" enctype="multipart/form-data" method="post" class="space-y-6">
@csrf
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
选择文件
</label>
<div class="mt-1 flex justify-center px-6 pt-5 pb-6 border-2 border-gray-300 dark:border-gray-600 border-dashed rounded-md hover:border-indigo-500 transition-colors">
<div class="space-y-1 text-center">
<svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 48 48" aria-hidden="true">
<path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<div class="flex text-sm text-gray-600 dark:text-gray-400">
<label for="file-upload" class="relative cursor-pointer bg-white dark:bg-gray-800 rounded-md font-medium text-indigo-600 dark:text-indigo-400 hover:text-indigo-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500">
<span>上传文件</span>
<input id="file-upload" name="file" type="file" class="sr-only" onchange="document.getElementById('file-name').innerText = this.files[0].name">
</label>
<p class="pl-1">或拖拽文件到这里</p>
</div>
<p class="text-xs text-gray-500 dark:text-gray-500" id="file-name">支持常见格式</p>
</div>
</div>
</div>
<button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors">
提交上传
</button>
</form>
</div>
</div>
</main>
@include("common.footer")
</body>
</html>

90
resources/views/index.blade.php
View File

@@ -5,41 +5,73 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<form class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto form py-2" action="">
<label for="keyword">查找节目单关键词，空格隔开查找多个关键词</label>
<input class="border border-black" type="text" name="keyword" id="keyword" value="{{$keyword}}">
<input class="border border-black" type="submit">
</form>
@foreach($comments as $comment)
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto px-2 md:px-4 py-4 bg-white border border-gray-200 rounded-lg shadow-md my-4 dark:bg-gray-800">
<div>
<a href="/video/{{$comment->video->id}}" class="text-2xl font-bold text-gray-700 dark:text-white hover:text-gray-600 dark:hover:text-gray-200 hover:underline" tabindex="0" role="link">{{$comment->video->title}}</a>
<div class="px-2 md:px-4 lg:px-8 mt-2 flex items-center justify-between">
<span class="text-sm font-light text-gray-600 dark:text-gray-400 hidden md:block">稿件时间：{{$comment->video->created_at}}</span>
<span class="text-sm font-light text-gray-600 dark:text-gray-400">评论时间：{{$comment->created_at}}</span>
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="max-w-5xl mx-auto">
<form class="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-sm mb-8 transition-colors duration-200" action="">
<label for="keyword" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">查找节目单关键词</label>
<div class="relative flex items-center">
<input type="text" name="keyword" id="keyword" value="{{$keyword}}"
class="block w-full rounded-l-lg border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm py-3"
placeholder="输入关键词，空格隔开...">
<button type="submit" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-r-lg shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors duration-200">
搜索
</button>
</div>
<p class="px-2 md:px-4 lg:px-8 mt-2 text-gray-600 dark:text-gray-300 whitespace-pre-wrap">{{$comment->content}}</p>
<p class="mt-2 text-xs text-gray-500 dark:text-gray-400">支持多个关键词组合搜索</p>
</form>
<div class="space-y-6">
@foreach($comments as $comment)
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-100 dark:border-gray-700 hover:shadow-md transition-shadow duration-200 overflow-hidden">
<div class="p-6">
<div class="flex justify-between items-start mb-3">
<a href="/video/{{$comment->video->id}}" class="text-xl font-bold text-gray-900 dark:text-white hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors line-clamp-1">
{{$comment->video->title}}
</a>
</div>
<div class="bg-gray-50 dark:bg-gray-700/50 rounded-lg p-4 mb-4">
<p class="text-gray-700 dark:text-gray-300 text-base leading-relaxed whitespace-pre-wrap font-sans">{{$comment->content}}</p>
</div>
<div class="flex flex-wrap items-center justify-between text-sm text-gray-500 dark:text-gray-400 border-t dark:border-gray-700 pt-4 gap-4">
<div class="flex items-center space-x-6">
<span class="flex items-center" title="评论时间">
<svg class="w-4 h-4 mr-1.5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
{{$comment->created_at}}
</span>
<span class="hidden sm:flex items-center" title="稿件时间">
<svg class="w-4 h-4 mr-1.5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><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"></path></svg>
投稿: {{$comment->video->created_at}}
</span>
</div>
<div class="flex items-center space-x-4">
<a href="https://space.bilibili.com/{{$comment->mid}}" target="_blank" class="flex items-center hover:text-indigo-600 dark:hover:text-indigo-400 transition-colors" title="课代表: {{$comment->uname}}">
<svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path></svg>
{{$comment->uname}}
</a>
<span class="text-gray-300 dark:text-gray-600">|</span>
<a href="https://www.bilibili.com/video/{{$comment->video->bvid}}" target="_blank" class="text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300 flex items-center transition-colors font-medium">
B站浏览
<svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path></svg>
</a>
</div>
</div>
</div>
</div>
@endforeach
</div>
<div class="flex items-center justify-between mt-4">
<a href="https://www.bilibili.com/video/{{$comment->video->bvid}}" target="_blank" class="inline-flex text-blue-600 dark:text-blue-400 hover:underline" tabindex="0" role="link">
去B站浏览
<svg class="w-5 h-5 ml-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path><path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path></svg>
</a>
<div class="flex items-center">
<span class="text-gray-500">课代表：</span>
<a href="https://space.bilibili.com/{{$comment->mid}}" target="_blank" class="font-bold text-gray-700 cursor-pointer dark:text-gray-200 hover:underline" tabindex="0" role="link">{{$comment->uname}}</a>
</div>
<div class="mt-8">
{{$comments->onEachSide(1)->links()}}
</div>
</div>
@endforeach
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto sticky bottom-0">
{{$comments->links()}}
</div>
</main>
@include("common.footer")
</body>
</html>

2
resources/views/program/construct/index.blade.php
View File

@@ -70,7 +70,7 @@
</tbody>
</table>
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto sticky bottom-0">
{{$programs->links()}}
{{$programs->onEachSide(1)->links()}}
</div>
@include("common.footer")
</body>

252
resources/views/program/index.blade.php
View File

@@ -5,92 +5,182 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<div class="w-full text-white bg-red-500" id="_notice">
<div class="container flex items-center justify-between px-2 sm:px-6 lg:px-8 py-4 mx-auto">
<div class="flex">
<svg viewBox="0 0 40 40" class="w-6 h-6 fill-current">
<path d="M20 3.33331C10.8 3.33331 3.33337 10.8 3.33337 20C3.33337 29.2 10.8 36.6666 20 36.6666C29.2 36.6666 36.6667 29.2 36.6667 20C36.6667 10.8 29.2 3.33331 20 3.33331ZM21.6667 28.3333H18.3334V25H21.6667V28.3333ZM21.6667 21.6666H18.3334V11.6666H21.6667V21.6666Z">
</path>
</svg>
<p class="mx-3 font-medium">数据待补充完整，需要查较为久远的节目，请先点击上方节目单查询</p>
</div>
<button class="p-1 transition-colors duration-300 transform rounded-md hover:bg-opacity-25 hover:bg-gray-600 focus:outline-none" type="button" onclick="document.getElementById('_notice').remove()">
<span class="sr-only">关闭</span>
<svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6 18L18 6M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
</svg>
<div class="bg-red-500 text-white" id="_notice">
<div class="container mx-auto px-4 py-3 flex items-center justify-between">
<div class="flex items-center">
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"></path></svg>
<span class="text-sm font-medium">数据待补充完整，需要查较为久远的节目，请先点击上方节目单查询</span>
</div>
<button type="button" class="text-white hover:text-red-100 focus:outline-none" onclick="document.getElementById('_notice').remove()">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
</button>
</div>
</div>
<form class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto form py-2" action="">
<label for="keyword">查找节目关键词，空格隔开查找多个关键词，支持通过点播老板或追加内容搜索</label>
<input class="border border-black" type="text" name="keyword" id="keyword" value="{{$keyword}}">
<input class="border border-black" type="submit">
</form>
<table class="table-auto border-collapse w-full lg:border lg:border-black">
<thead>
<tr class="border border-black sticky bg-white lg:static top-0 left-0 right-0">
<th class="border border-black">节目名称</th>
<th class="border border-black">点播及追加</th>
<th class="border border-black hidden lg:table-cell">节目开始</th>
<th class="border border-black hidden lg:table-cell">节目结束</th>
</tr>
</thead>
<tbody>
@foreach($programs as $program)
<tr>
<td class="border align-top w-1/2 lg:w-1/4">
@if(sizeof($program->video_pivots) > 0)
<div class="block lg:hidden">{{$program->created_at}}</div>
@endif
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$program->id])}}">编辑</a>
@endauth
<a class="text-blue-600 lg:text-current underline lg:no-underline" href="/programs/{{ $program->id }}/video">
<span title="节目">{{$program->name}}</span>
<span title="难度">{{$program->difficulty}}</span>
<span title="要求">{{$program->desc}}</span>
</a>
</td>
<td class="border align-top w-1/2 lg:w-1/4">
@foreach($program->appends as $append)
<x-append :append="$append"></x-append>
@endforeach
</td>
<td class="border align-top hidden lg:table-cell lg:w-1/4">
@foreach($program->video_pivots as $video_pivot)
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div>{{$video_pivot->created_at}} P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" width="300" src="{{$video_pivot->start_image}}" alt="开始时的画面">
@else
节目开始位置
@endif
</x-links.video_link>
@endforeach
</td>
<td class="border align-top hidden lg:table-cell lg:w-1/4">
@foreach($program->video_pivots as $video_pivot)
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div>P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" width="300" src="{{$video_pivot->stop_image}}" alt="结束时的画面">
@else
节目结束位置
@endif
</x-links.video_link>
@endforeach
</td>
</tr>
@endforeach
</tbody>
</table>
<div class="max-w xl:max-w-5xl lg:max-w-2xl md:max-w-lg mx-2 md:mx-auto sticky bottom-0">
{{$programs->links()}}
</div>
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="max-w-7xl mx-auto">
<!-- Search Form -->
<form class="bg-white dark:bg-gray-800 p-6 rounded-xl shadow-sm mb-8 transition-colors duration-200" action="">
<label for="keyword" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">查找节目关键词</label>
<div class="relative flex items-center">
<input type="text" name="keyword" id="keyword" value="{{$keyword}}"
class="block w-full rounded-l-lg border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm py-3"
placeholder="支持通过点播老板或追加内容搜索...">
<button type="submit" class="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-r-lg shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors duration-200">
搜索
</button>
</div>
</form>
<!-- Desktop Table -->
<div class="hidden lg:block bg-white dark:bg-gray-800 shadow overflow-hidden rounded-lg">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-gray-700">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目名称</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">点播及追加</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目开始</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目结束</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
@foreach($programs as $program)
<tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
<td class="px-6 py-4 align-top">
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$program->id])}}" class="text-indigo-600 hover:text-indigo-900 text-xs mb-1 block">编辑</a>
@endauth
<a href="/programs/{{ $program->id }}/video" class="block group">
<div class="text-sm font-medium text-gray-900 dark:text-white group-hover:text-indigo-600 transition-colors">{{$program->name}}</div>
@if($program->difficulty)
<div class="text-xs text-gray-500 mt-1">难度: {{$program->difficulty}}</div>
@endif
@if($program->desc)
<div class="text-xs text-gray-500 mt-1">{{$program->desc}}</div>
@endif
</a>
</td>
<td class="px-6 py-4 align-top text-sm text-gray-500 dark:text-gray-400">
@foreach($program->appends as $append)
<div class="mb-2">
<x-append :append="$append"></x-append>
</div>
@endforeach
</td>
<td class="px-6 py-4 align-top text-sm">
@foreach($program->video_pivots as $video_pivot)
<div class="mb-4">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div class="text-xs text-gray-500 mb-1">{{$video_pivot->created_at}}</div>
<div class="text-indigo-600 hover:text-indigo-800">P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded border border-gray-200 w-32" src="{{$video_pivot->start_image}}" alt="开始画面">
@else
<span class="text-xs text-gray-400">无预览</span>
@endif
</x-links.video_link>
</div>
@endforeach
</td>
<td class="px-6 py-4 align-top text-sm">
@foreach($program->video_pivots as $video_pivot)
<div class="mb-4">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div class="text-indigo-600 hover:text-indigo-800">P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded border border-gray-200 w-32" src="{{$video_pivot->stop_image}}" alt="结束画面">
@else
<span class="text-xs text-gray-400">无预览</span>
@endif
</x-links.video_link>
</div>
@endforeach
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<!-- Mobile Cards -->
<div class="space-y-6 lg:hidden">
@foreach($programs as $program)
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
<div class="p-4 border-b dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
<div class="flex justify-between items-start">
<div>
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$program->id])}}" class="text-xs text-indigo-600 mb-1 inline-block">编辑</a>
@endauth
<h3 class="text-lg font-bold text-gray-900 dark:text-white">{{$program->name}}</h3>
<div class="text-sm text-gray-500 mt-1">
<span class="mr-2">{{$program->difficulty}}</span>
<span>{{$program->desc}}</span>
</div>
</div>
@if(sizeof($program->video_pivots) > 0)
<span class="text-xs text-gray-400">{{$program->created_at}}</span>
@endif
</div>
</div>
@if(count($program->appends) > 0)
<div class="p-4 border-b dark:border-gray-700">
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">点播及追加</h4>
<div class="space-y-2">
@foreach($program->appends as $append)
<x-append :append="$append"></x-append>
@endforeach
</div>
</div>
@endif
<div class="p-4 grid grid-cols-2 gap-4">
<div>
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">开始</h4>
@foreach($program->video_pivots as $video_pivot)
<div class="mb-3">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div class="text-sm text-indigo-600">P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded w-full" src="{{$video_pivot->start_image}}" alt="Start">
@endif
</x-links.video_link>
</div>
@endforeach
</div>
<div>
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">结束</h4>
@foreach($program->video_pivots as $video_pivot)
<div class="mb-3">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div class="text-sm text-indigo-600">P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded w-full" src="{{$video_pivot->stop_image}}" alt="End">
@endif
</x-links.video_link>
</div>
@endforeach
</div>
</div>
<div class="px-4 py-3 bg-gray-50 dark:bg-gray-700/30 border-t dark:border-gray-700 text-center">
<a href="/programs/{{ $program->id }}/video" class="text-sm text-indigo-600 font-medium hover:text-indigo-800">
查看详情 &rarr;
</a>
</div>
</div>
@endforeach
</div>
<div class="mt-8">
{{$programs->onEachSide(1)->links()}}
</div>
</div>
</main>
@include("common.footer")
</body>
</html>

2
resources/views/vendor/.gitignore vendored
View File

@@ -1,2 +0,0 @@
!.gitignore
**/*

106
resources/views/vendor/pagination/tailwind.blade.php vendored Normal file
View File

@@ -0,0 +1,106 @@
@if ($paginator->hasPages())
<nav role="navigation" aria-label="{{ __('Pagination Navigation') }}" class="flex items-center justify-between my-4">
{{-- Mobile View: Simple Previous/Next (Visible below md breakpoint) --}}
<div class="flex justify-between flex-1 md:hidden">
@if ($paginator->onFirstPage())
<span class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400">
{!! __('pagination.previous') !!}
</span>
@else
<a href="{{ $paginator->previousPageUrl() }}" class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300 dark:hover:text-white">
{!! __('pagination.previous') !!}
</a>
@endif
@if ($paginator->hasMorePages())
<a href="{{ $paginator->nextPageUrl() }}" class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300 dark:hover:text-white">
{!! __('pagination.next') !!}
</a>
@else
<span class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400">
{!! __('pagination.next') !!}
</span>
@endif
</div>
{{-- Tablet/Desktop View (Visible on md and above) --}}
<div class="hidden md:flex-1 md:flex md:items-center md:justify-between">
{{-- Summary Text: Visible only on Large screens (lg) --}}
<div class="hidden lg:block">
<p class="text-sm text-gray-700 dark:text-gray-400">
{!! __('Showing') !!}
<span class="font-medium">{{ $paginator->firstItem() }}</span>
{!! __('to') !!}
<span class="font-medium">{{ $paginator->lastItem() }}</span>
{!! __('of') !!}
<span class="font-medium">{{ $paginator->total() }}</span>
{!! __('results') !!}
</p>
</div>
{{-- Pagination Links: Centered on Tablet (md), Right aligned on Desktop (lg) --}}
<div class="flex-1 flex justify-center lg:justify-end">
<span class="relative z-0 inline-flex shadow-sm rounded-md">
{{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
<span aria-disabled="true" aria-label="{{ __('pagination.previous') }}">
<span class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-l-md leading-5 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" clip-rule="evenodd" />
</svg>
</span>
</span>
@else
<a href="{{ $paginator->previousPageUrl() }}" rel="prev" class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-l-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300 dark:hover:text-white" aria-label="{{ __('pagination.previous') }}">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" clip-rule="evenodd" />
</svg>
</a>
@endif
{{-- Pagination Elements --}}
@foreach ($elements as $element)
{{-- "Three Dots" Separator --}}
@if (is_string($element))
<span aria-disabled="true">
<span class="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium text-gray-700 bg-white border border-gray-300 cursor-default leading-5 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300">{{ $element }}</span>
</span>
@endif
{{-- Array Of Links --}}
@if (is_array($element))
@foreach ($element as $page => $url)
@if ($page == $paginator->currentPage())
<span aria-current="page">
<span class="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium text-white bg-indigo-600 border border-indigo-600 cursor-default leading-5 dark:border-indigo-500">{{ $page }}</span>
</span>
@else
<a href="{{ $url }}" class="relative inline-flex items-center px-4 py-2 -ml-px text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 hover:text-gray-500 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300 dark:hover:text-white dark:hover:bg-gray-700" aria-label="{{ __('Go to page :page', ['page' => $page]) }}">
{{ $page }}
</a>
@endif
@endforeach
@endif
@endforeach
{{-- Next Page Link --}}
@if ($paginator->hasMorePages())
<a href="{{ $paginator->nextPageUrl() }}" rel="next" class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-r-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-300 dark:hover:text-white" aria-label="{{ __('pagination.next') }}">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</a>
@else
<span aria-disabled="true" aria-label="{{ __('pagination.next') }}">
<span class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-r-md leading-5 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
</svg>
</span>
</span>
@endif
</span>
</div>
</div>
</nav>
@endif

219
resources/views/video/index.blade.php
View File

@@ -1,77 +1,164 @@
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>录播节目查询</title>
<title>{{$video->title}} - 录播节目查询</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="{{ mix('/css/app.css') }}" rel="stylesheet"/>
</head>
<body>
<body class="bg-gray-50 dark:bg-gray-900 min-h-screen flex flex-col text-gray-900 dark:text-gray-100">
@include("common.header")
<div>
<h3 class="text-2xl font-bold">
<a class="text-blue-600" href="https://www.bilibili.com/video/{{$video->bvid}}">{{$video->title}}</a>
</h3>
</div>
<table class="table-auto border-collapse w-full lg:border lg:border-black">
<thead>
<tr class="border border-black sticky bg-white lg:static top-0 left-0 right-0">
<th class="border border-black">节目名称</th>
<th class="border border-black">点播及追加</th>
<th class="border border-black hidden lg:table-cell">节目开始</th>
<th class="border border-black hidden lg:table-cell">节目结束</th>
</tr>
</thead>
<tbody>
@foreach($video_pivots as $video_pivot)
<tr>
<td class="border align-top w-1/2 lg:w-1/4">
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$video_pivot->program->id])}}">编辑</a>
@endauth
<div class="block lg:hidden">{{$video_pivot->created_at}}</div>
<a class="text-blue-600 lg:text-current underline lg:no-underline" href="/programs/{{ $video_pivot->program->id }}/video">
<span title="节目">{{$video_pivot->program->name}}</span>
<span title="难度">{{$video_pivot->program->difficulty}}</span>
<span title="要求">{{$video_pivot->program->desc}}</span>
</a>
</td>
<td class="border align-top w-1/2 lg:w-1/4">
@foreach($video_pivot->program->appends as $append)
<x-append :append="$append"></x-append>
@endforeach
</td>
<td class="border align-top hidden lg:table-cell lg:w-1/4">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div>{{$video_pivot->created_at}} P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" width="300" src="{{$video_pivot->start_image}}" alt="开始时的画面">
@else
节目开始位置
<main class="flex-grow container mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="max-w-7xl mx-auto">
<div class="mb-8">
<h1 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">{{$video->title}}</h1>
<a class="inline-flex items-center text-indigo-600 dark:text-indigo-400 hover:text-indigo-800 dark:hover:text-indigo-300 font-medium transition-colors" href="https://www.bilibili.com/video/{{$video->bvid}}" target="_blank">
<svg class="w-5 h-5 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path></svg>
前往 B站 观看
</a>
</div>
<!-- Desktop Table -->
<div class="hidden lg:block bg-white dark:bg-gray-800 shadow overflow-hidden rounded-lg mb-8">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-gray-700">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目名称</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">点播及追加</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目开始</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider w-1/4">节目结束</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
@foreach($video_pivots as $video_pivot)
<tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
<td class="px-6 py-4 align-top">
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$video_pivot->program->id])}}" class="text-indigo-600 hover:text-indigo-900 text-xs mb-1 block">编辑</a>
@endauth
<a href="/programs/{{ $video_pivot->program->id }}/video" class="block group">
<div class="text-sm font-medium text-gray-900 dark:text-white group-hover:text-indigo-600 transition-colors">{{$video_pivot->program->name}}</div>
@if($video_pivot->program->difficulty)
<div class="text-xs text-gray-500 mt-1">难度: {{$video_pivot->program->difficulty}}</div>
@endif
@if($video_pivot->program->desc)
<div class="text-xs text-gray-500 mt-1">{{$video_pivot->program->desc}}</div>
@endif
</a>
</td>
<td class="px-6 py-4 align-top text-sm text-gray-500 dark:text-gray-400">
@foreach($video_pivot->program->appends as $append)
<div class="mb-2">
<x-append :append="$append"></x-append>
</div>
@endforeach
</td>
<td class="px-6 py-4 align-top text-sm">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div class="text-xs text-gray-500 mb-1">{{$video_pivot->created_at}}</div>
<div class="text-indigo-600 hover:text-indigo-800">P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded border border-gray-200 w-32" src="{{$video_pivot->start_image}}" alt="开始画面">
@else
<span class="text-xs text-gray-400">无预览</span>
@endif
</x-links.video_link>
</td>
<td class="px-6 py-4 align-top text-sm">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div class="text-indigo-600 hover:text-indigo-800">P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded border border-gray-200 w-32" src="{{$video_pivot->stop_image}}" alt="结束画面">
@else
<span class="text-xs text-gray-400">无预览</span>
@endif
</x-links.video_link>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<!-- Mobile Cards -->
<div class="space-y-6 lg:hidden mb-8">
@foreach($video_pivots as $video_pivot)
<div class="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
<div class="p-4 border-b dark:border-gray-700 bg-gray-50 dark:bg-gray-700/50">
<div class="flex justify-between items-start">
<div>
@auth("web")
<a href="{{route("program.construct.edit", ["program"=>$video_pivot->program->id])}}" class="text-xs text-indigo-600 mb-1 inline-block">编辑</a>
@endauth
<h3 class="text-lg font-bold text-gray-900 dark:text-white">{{$video_pivot->program->name}}</h3>
<div class="text-sm text-gray-500 mt-1">
<span class="mr-2">{{$video_pivot->program->difficulty}}</span>
<span>{{$video_pivot->program->desc}}</span>
</div>
</div>
<span class="text-xs text-gray-400">{{$video_pivot->created_at}}</span>
</div>
</div>
@if(count($video_pivot->program->appends) > 0)
<div class="p-4 border-b dark:border-gray-700">
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">点播及追加</h4>
<div class="space-y-2">
@foreach($video_pivot->program->appends as $append)
<x-append :append="$append"></x-append>
@endforeach
</div>
</div>
@endif
</x-links.video_link>
</td>
<td class="border align-top hidden lg:table-cell lg:w-1/4">
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div>P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" width="300" src="{{$video_pivot->stop_image}}" alt="结束时的画面">
@else
节目结束位置
@endif
</x-links.video_link>
</td>
</tr>
@endforeach
</tbody>
</table>
@auth("web")
@if(sizeof($video_pivots) === 0 && $comment)
<a href="{{ url(route("program.construct.from_comment", ["comment"=>$comment->id])) }}" class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white">一键导入评论中的节目单</a>
@endif
@if($video->danmakus->count() === 0)
<a href="{{ url(route("danmaku.construct.batch_import", ["video_bvid"=>$video->bvid])) }}" class="px-6 py-2 inline-block rounded-full bg-cyan-600 text-white">导入直播弹幕</a>
@endif
@endauth
<div class="p-4 grid grid-cols-2 gap-4">
<div>
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">开始</h4>
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->start_part" :time="$video_pivot->start_time">
<div class="text-sm text-indigo-600">P{{$video_pivot->start_part}}#{{$video_pivot->start_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded w-full" src="{{$video_pivot->start_image}}" alt="Start">
@endif
</x-links.video_link>
</div>
<div>
<h4 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">结束</h4>
<x-links.video_link :bvid="$video_pivot->video_bvid" :part="$video_pivot->stop_part" :time="$video_pivot->stop_time">
<div class="text-sm text-indigo-600">P{{$video_pivot->stop_part}}#{{$video_pivot->stop_time}}</div>
@if($video_pivot->start_image)
<img loading="lazy" class="mt-1 rounded w-full" src="{{$video_pivot->stop_image}}" alt="End">
@endif
</x-links.video_link>
</div>
</div>
<div class="px-4 py-3 bg-gray-50 dark:bg-gray-700/30 border-t dark:border-gray-700 text-center">
<a href="/programs/{{ $video_pivot->program->id }}/video" class="text-sm text-indigo-600 font-medium hover:text-indigo-800">
查看详情 &rarr;
</a>
</div>
</div>
@endforeach
</div>
@auth("web")
<div class="flex flex-wrap gap-4 mt-8">
@if(sizeof($video_pivots) === 0 && $comment)
<a href="{{ url(route("program.construct.from_comment", ["comment"=>$comment->id])) }}" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-cyan-600 hover:bg-cyan-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500">
一键导入评论中的节目单
</a>
@endif
@if($video->danmakus->count() === 0)
<a href="{{ url(route("danmaku.construct.batch_import", ["video_bvid"=>$video->bvid])) }}" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
导入直播弹幕
</a>
@endif
</div>
@endauth
</div>
</main>
@include("common.footer")
</body>
</html>