app/Enums/OrderedSongStatus.php

@@ -1,28 +0,0 @@
-<?php
-
-namespace App\Enums;
-
-use App\Enums\Traits\HasLabels;
-
-
-enum OrderedSongStatus: string
-{
-    case NotPlayed       = 'NotPlayed';
-    case Playing         = 'Playing';
-    case Played          = 'Played';
-    case NoFile          = 'NoFile';
-    case Skipped         = 'Skipped';
-    case InsertPlayback  = 'InsertPlayback';
-
-    public function labels(): string
-    {
-        return match($this) {
-            self::NotPlayed     => __('enums.NotPlayed'),
-            self::Playing       => __('enums.Playing'),
-            self::Played        => __('enums.Played'),
-            self::NoFile        => __('enums.NoFile'),
-            self::Skipped       => __('enums.Skipped'),
-            self::InsertPlayback => __('enums.InsertPlayback'),
-        };
-    }
-}

app/Livewire/Layout/Navigation.php

@@ -16,7 +16,9 @@ class Navigation extends Component
     private array $roomMenus = [
         ['name' => '已點歌曲', 'route' => 'clicked-song'],
         ['name' => '聲音控制', 'route' => 'sound-control'],
+        ['name' => '社群媒體', 'route' => 'social-media'],
         ['name' => '真情告白', 'route' => 'love-message'],
+        ['name' => '心情貼圖', 'route' => 'mood-stickers'],
     ];
     public array $menus = [];
 

app/Livewire/Modals/StickerModal.php

@@ -1,44 +0,0 @@
-<?php
-
-namespace App\Livewire\Modals;
-
-use Livewire\Component;
-
-class StickerModal extends Component
-{
-    protected $listeners = [
-        'openModal','closeModal'
-    ];
-    public bool $showModal = false;
-    public $selectedSticker = null;
-    public $stickers = [];
-
-    public function mount()
-    {
-        $this->stickers = collect(glob(storage_path('app/public/superstar-pic/*.png')))
-            //->map(fn($path) => 'superstar-pic/' . basename($path))
-            ->map(fn($path) => basename($path))
-            ->toArray();
-    }
-
-    public function openModal()
-    {
-        $this->showModal = true;
-    }
-    public function closeModal()
-    {
-        $this->showModal = false;
-    }
-
-    public function select($sticker)
-    {
-        $this->dispatch('stickerSelected', $sticker);
-        $this->selectedSticker =$sticker;
-        $this->showModal = false;
-    }
-
-    public function render()
-    {
-        return view('livewire.modals.sticker-modal');
-    }
-}

app/Livewire/Pages/Home.php

@@ -11,7 +11,7 @@ class Home extends Component
     public function mount()
     {
         // 先從 URL 取得 room_code，再存進 session
-        //session()->forget('room_code');
+        session()->forget('room_code');
         $this->roomCode = request()->query('room_code', session('room_code', null));
         if ($this->roomCode) {
             session(['room_code' => $this->roomCode]);

app/Livewire/Pages/LoveMessage.php

@@ -1,38 +0,0 @@
-<?php
-
-namespace App\Livewire\Pages;
-
-use Livewire\Component;
-
-class LoveMessage extends Component
-{
-    protected $listeners = ['stickerSelected' => 'handleSticker'];
-    public $message = '';
-    public $selectedSticker=null;
-    
-    public function handleSticker($sticker)
-    {
-        $this->selectedSticker = $sticker;
-    }
-    public function submitMessage()
-    {
-        // 實際存留言時，可同時存貼圖
-        $data = [
-            'message' => $this->message,
-            'sticker' => $this->selectedSticker,
-            'user' => auth()->user()?->name ?? '訪客',
-        ];
-        // 存到資料庫或送到 API
-        // ...
-        session()->flash('success', '留言已送出！');
-
-        // 重置
-        $this->message = '';
-        $this->selectedSticker = null;
-    }
-
-    public function render()
-    {
-        return view('livewire.pages.love-message');
-    }
-}

app/Livewire/Pages/OrderedSongList.php

@@ -1,58 +0,0 @@
-<?php
-
-namespace App\Livewire\Pages;
-
-use Livewire\Component;
-use Illuminate\Database\Eloquent\Collection as EloquentCollection;
-use App\Models\RoomSession;
-use App\Models\OrderedSong;
-
-class OrderedSongList extends Component
-{
-    public ?string $roomSessionId = null;
-
-    public EloquentCollection $playing ;
-    public EloquentCollection $notPlayed ;
-    public EloquentCollection $finished ;
-    
-
-    public function mount()
-    {
-        $this->playing = new EloquentCollection();
-        $this->nextSong = new EloquentCollection();
-        $this->finished = new EloquentCollection();
-        $roomSession = $this->getRoomSession(session('room_code'))?->id ;
-        if ($roomSession) {
-            $this->roomSessionId = $roomSession->id;
-            $this->loadSongs($this->roomSessionId);
-        }
-    }
-    private function getRoomSession($api_token): ?RoomSession
-    {
-        if (!$apiToken) return null;
-        return RoomSession::where('api_token', $api_token)
-            ->whereIn('status', ['active', 'maintain'])
-            ->first();
-    }
-    
-    public function refreshSongs()
-    {
-        if ($this->roomSessionId) {
-            $this->loadSongs($this->roomSessionId);
-        }
-    }
-    protected function loadSongs(string $roomSessionId)
-    {
-        $this->playing   = OrderedSong::forSession($roomSessionId)->playing()->get();
-        $this->nextSong = OrderedSong::forSession($roomSessionId)->nextSong()->get();
-        $this->finished  = OrderedSong::forSession($roomSessionId)->finished()->get();
-    }
-    public function render()
-    {   
-        return view('livewire.pages.ordered-song-list', [
-            'playing' => $this->playing,
-            'nextSong' => $this->nextSong,
-            'finished' => $this->finished,
-        ]);
-    }
-}

app/Livewire/Pages/SoundControl.php

@@ -1,42 +0,0 @@
-<?php
-
-namespace App\Livewire\Pages;
-
-use Livewire\Component;
-
-class SoundControl extends Component
-{
-    public $buttons = [
-        ['img'=>'音控-01.jpg', 'action'=>'pause'],
-        ['img'=>'音控-02.jpg', 'action'=>'volume_up'],
-        ['img'=>'音控-04.jpg', 'action'=>'mic_up'],
-        ['img'=>'音控-06.jpg', 'action'=>'mute'],
-        ['img'=>'音控-03.jpg', 'action'=>'volume_down'],
-        ['img'=>'音控-05.jpg', 'action'=>'mic_down'],
-        ['img'=>'音控-07.jpg', 'action'=>'original_song'],
-        ['img'=>'音控-08.jpg', 'action'=>'service'],
-        ['img'=>'音控-09.jpg', 'action'=>'replay'],
-        ['img'=>'音控-11.jpg', 'action'=>'male_key'],
-        ['img'=>'音控-12.jpg', 'action'=>'female_key'],
-        ['img'=>'音控-10.jpg', 'action'=>'cut'],
-        ['img'=>'音控-15.jpg', 'action'=>'lower_key'],
-        ['img'=>'音控-14.jpg', 'action'=>'standard_key'],
-        ['img'=>'音控-13.jpg', 'action'=>'raise_key'],
-    ];
-
-    public function sendVolumeControl(string $action)
-    {
-        // 這裡可以加你的 API 或邏輯
-        // 範例：發送到後台控制音量
-        info("Sound control action: ".$action);
-
-        $this->dispatchBrowserEvent('notify', [
-            'message' => "已執行操作: {$action}"
-        ]);
-    }
-
-    public function render()
-    {
-        return view('livewire.pages.sound-control');
-    }
-}

app/Models/OrderedSong.php

@@ -1,83 +0,0 @@
-<?php
-
-namespace App\Models;
-
-use Illuminate\Database\Eloquent\Factories\HasFactory;
-use Illuminate\Database\Eloquent\Model;
-use App\Enums\OrderedSongStatus;
-
-class OrderedSong extends Model
-{
-    use HasFactory;
-
-    public $timestamps = false;
-
-    protected $fillable = [
-        'room_session_id',
-        'from_by',
-        'order_number',
-        'song_id',
-        'song_name',
-        'artist_name',
-        'status',
-        'ordered_at',
-        'started_at',
-        'finished_at',
-        
-    ];
-
-    protected $casts = [
-        'ordered_at' => 'datetime',
-        'started_at' => 'datetime',
-        'finished_at' => 'datetime',
-        'status' => \App\Enums\OrderedSongStatus::class,
-    ];
-    
-
-    public function session()
-    {
-        return $this->belongsTo(RoomSession::class, 'room_session_id');
-    }
-
-    public function song()
-    {
-        return $this->belongsTo(Song::class);
-    }
-    public function scopeWithPartialSong($query)
-    {
-        return $query->with([
-            'song' => function ($q) {
-                $q->select('id', 'name','filename','db_change','vocal','situation'); // 精簡版
-            }
-        ]);
-    }
-    public function scopeForSession($query, $roomSessionId)
-    {
-        return $query->where('room_session_id', $roomSessionId);
-    }
-
-    public function scopePlaying($query)
-    {
-        return $query->where('status', OrderedSongStatus::Playing);
-    }
-
-    public function scopeNextSong($query)
-    {
-        return $query->whereIn('status', [OrderedSongStatus::InsertPlayback, OrderedSongStatus::NotPlayed])
-            ->orderByRaw("FIELD(status, ?, ?)", [
-                OrderedSongStatus::InsertPlayback->value,
-                OrderedSongStatus::NotPlayed->value,
-            ])
-            ->orderByRaw("CASE WHEN status=? THEN ordered_at END DESC", [OrderedSongStatus::InsertPlayback->value])
-            ->orderByRaw("CASE WHEN status=? THEN ordered_at END ASC", [OrderedSongStatus::NotPlayed->value]);
-    }
-
-    public function scopeFinished($query)
-    {
-        return $query->whereIn('status', [
-            OrderedSongStatus::Played,
-            OrderedSongStatus::Skipped,
-            OrderedSongStatus::NoFile,
-        ])->orderByDesc('finished_at');
-    }
-}

app/Models/RoomSession.php

@@ -1,42 +0,0 @@
-<?php
-
-namespace App\Models;
-
-use Illuminate\Database\Eloquent\Factories\HasFactory;
-use Illuminate\Database\Eloquent\Model;
-
-class RoomSession extends Model
-{
-    use HasFactory;
-
-    protected $fillable = [
-        'room_id',
-        'started_at',
-        'ended_at',
-        'status',
-        'mode',
-        'close_reason',
-        'api_token',
-    ];
-
-    protected $casts = [
-        'started_at' => 'datetime',
-        'ended_at'   => 'datetime',
-    ];
-
-    // 狀態常數
-    public const STATUS_ACTIVE       = 'active';
-    public const STATUS_CLOSED     = 'closed';
-    public const STATUS_FORCE_CLOSED = 'force_closed';
-    public const STATUS_FIRE_CLOSED  = 'fire_closed';
-
-    // 模式常數
-    public const MODE_NORMAL = 'normal';
-    public const MODE_VIP    = 'vip';
-    public const MODE_TEST   = 'test';
-
-    public function room()
-    {
-        return $this->belongsTo(Room::class);
-    }
-}

resources/views/clicked-song.blade.php

@@ -1,10 +0,0 @@
-<x-app-layout>
-    <x-slot name="header">
-        <div class="header">超級巨星 自助式KTV</div>
-        <div class="banner">
-            <img src="{{ asset('手機點歌/BANNER-07.png') }}" alt="超級巨星 Banner">
-        </div>
-    </x-slot>
-
-    <livewire:pages.ordered-song-list />
-</x-app-layout>

resources/views/components/button/flat-card.blade.php

@@ -3,17 +3,12 @@
     'href' => null,
 ])
 
-@php
-// 使用 Tailwind aspect-auto 保持圖片原始比例
-$classes = 'relative w-full rounded-lg overflow-hidden shadow-md hover:scale-105 transition-transform cursor-pointer';
-@endphp
-
 @if($href)
-    <a href="{{ $href }}" {{ $attributes->merge(['class' => $classes]) }}>
-        <img src="{{ $image }}" alt="" class="w-full h-auto object-contain">
+    <a href="{{ $href }}" {{ $attributes->merge(['class' => 'relative w-full h-48 rounded-lg overflow-hidden shadow-md hover:scale-105 transition-transform cursor-pointer']) }}>
+        <img src="{{ $image }}" alt="" class="w-full h-full object-cover">
     </a>
 @else
-    <div {{ $attributes->merge(['class' => $classes]) }}>
-        <img src="{{ $image }}" alt="" class="w-full h-auto object-contain">
+    <div {{ $attributes->merge(['class' => 'relative w-full h-48 rounded-lg overflow-hidden shadow-md hover:scale-105 transition-transform cursor-pointer']) }}>
+        <img src="{{ $image }}" alt="" class="w-full h-full object-cover">
     </div>
 @endif

resources/views/livewire/modals/sticker-modal.blade.php

@@ -1,27 +0,0 @@
-
-<x-modal id="sticker-modal"  wire:model.defer="showModal" persistent>
-    <x-card class="border border-gray-200">
-        <x-slot name="action">
-            <button class="cursor-pointer p-1 rounded-full focus:outline-none focus:outline-hidden focus:ring-2 focus:ring-secondary-200 text-secondary-300"
-                wire:click="closeModal"
-                tabindex="-1"
-            >
-                <x-dynamic-component :component="WireUi::component('icon')" name="x-mark" class="w-5 h-5" />
-            </button>
-        </x-slot>
-        <x-slot name="title">
-            選擇貼圖
-        </x-slot>
-    
-        <div class="flex flex-wrap gap-2 max-h-64 overflow-y-auto">
-            @foreach($stickers as $sticker)
-                <img 
-                    src="{{ asset('superstar-pic/'.$sticker) }}" 
-                    wire:click="select('{{ $sticker }}')" 
-                    class="w-16 h-16 object-contain bg-white border-2 rounded cursor-pointer 
-                        {{ $selectedSticker === $sticker ? 'border-pink-500' : 'border-transparent' }}"
-                >
-            @endforeach
-        </div>
-    </x-card>
-</x-modal>

resources/views/livewire/pages/love-message.blade.php

@@ -1,50 +0,0 @@
-<div class="max-w-lg mx-auto py-12 px-4 sm:px-6 lg:px-8">
-    <div class="bg-white shadow rounded-lg p-6 space-y-4">
-        <h2 class="text-2xl font-semibold text-center">真情告白</h2>
-
-        <div class="space-y-2">
-            <input 
-                type="text" 
-                maxlength="64"
-                placeholder="請輸入您的留言"
-                wire:model.lazy="message"
-                class="w-full border rounded-lg p-3 focus:ring-2 focus:ring-pink-400 focus:outline-none"
-            />
-            <div class="text-gray-500 text-sm text-right">
-                字串長度：{{ strlen($message) }} 個單位
-            </div>
-        </div>
-        <x-button
-            wire:click="submitMessage"
-            pink
-            label="確認送出"
-            class="w-full mt-4 text-xl font-semibold py-2 px-4 rounded-lg transition"
-        />
-
-        {{-- 打開貼圖 Modal --}}
-        <x-card 
-            class="mt-2 w-full cursor-pointer hover:bg-gray-50 transition"
-            wire:click="$dispatchTo('modals.sticker-modal','openModal')"
-        >
-            <div class="flex flex-col items-center text-gray-400">
-                <span class="text-gray-600 mb-2">已選貼圖：</span>
-                @if($selectedSticker)
-                    <img src="{{ asset('superstar-pic/'.$selectedSticker) }}" class="w-16 h-16 object-contain bg-white border-2 rounded cursor-pointer ">
-                @else
-                    <span class="w-16 h-16 flex items-center justify-center text-gray-400 text-sm text-center">選擇貼圖</span>
-                @endif
-                <span class="text-sm">點擊此處選擇</span>
-            </div>
-        </x-card>
-    </div>
-
-    <div class="mt-6 bg-yellow-50 border-l-4 border-yellow-400 p-4 text-sm text-yellow-700 rounded-lg space-y-1">
-        <ul class="list-disc pl-5 space-y-1">
-            <li>注意：不要使用特殊符號，可能無法正常顯示！</li>
-            <li>播歌畫面可顯示的字串長度為64（會員名稱 + 訊息內容）！</li>
-            <li>如果非要給這愛加個期限，我希望是一萬年…真情告白，等您留言！（每則留言輪播三次）</li>
-        </ul>
-    </div>
-    <livewire:modals.sticker-modal />
-</div>
-

resources/views/livewire/pages/ordered-song-list.blade.php

@@ -1,88 +0,0 @@
-<div wire:poll.5s="refreshSongs" class="space-y-6 p-4">
-
-    <x-table bordered striped size="sm" class="w-full">
-        <x-slot name="header">
-            <tr>
-                <th class="px-4 py-2 w-16 text-center">編號</th>
-                <th class="px-4 py-2">歌曲</th>
-                <th class="px-4 py-2 w-24 text-center">狀態</th>
-            </tr>
-        </x-slot>
-
-        {{-- 正在播放 --}}
-        <tr>
-            <td class="px-4 py-2 text-center text-blue-600 font-semibold" colspan="3">
-                🎵 正在播放
-            </td>
-        </tr>
-        @forelse($playing as $song)
-            <tr class="hover:bg-gray-50 cursor-pointer">
-                <td class="px-4 py-2 text-center">{{ $song->song_id }}</td>
-                <td class="px-4 py-2">
-                    <div class="flex flex-col">
-                        <span class="text-lg font-semibold">{{ $song->song_name }}</span>
-                        <span class="text-xs text-gray-500 self-end">{{ $song->artist_name }}</span>
-                    </div>
-                </td>
-                <td class="px-4 py-2 text-blue-500 text-center">{{ $song->status->labels() }}</td>
-            </tr>
-        @empty
-            <tr>
-                <td class="px-4 py-4 text-center text-gray-400" colspan="3">
-                    目前沒有正在播放的歌曲
-                </td>
-            </tr>
-        @endforelse
-
-        {{-- 待播 / 插播 --}}
-        <tr>
-            <td class="px-4 py-2 text-center text-yellow-600 font-semibold" colspan="3">
-                ⏳ 待播 / 插播
-            </td>
-        </tr>
-        @forelse($nextSong as $song)
-            <tr class="hover:bg-gray-50 cursor-pointer">
-                <td class="px-4 py-2 text-center">{{ $song->song_id }}</td>
-                <td class="px-4 py-2">
-                    <div class="flex flex-col">
-                        <span class="text-lg font-semibold">{{ $song->song_name }}</span>
-                        <span class="text-xs text-gray-500 self-end">{{ $song->artist_name }}</span>
-                    </div>
-                </td>
-                <td class="px-4 py-2 text-yellow-500 text-center">{{ $song->status->labels() }}</td>
-            </tr>
-        @empty
-            <tr>
-                <td class="px-4 py-4 text-center text-gray-400" colspan="3">
-                    目前沒有待播歌曲
-                </td>
-            </tr>
-        @endforelse
-
-        {{-- 已結束播放 --}}
-        <tr>
-            <td class="px-4 py-2 text-center text-gray-600 font-semibold" colspan="3">
-                ✅ 已結束播放
-            </td>
-        </tr>
-        @forelse($finished as $song)
-            <tr class="hover:bg-gray-50 cursor-pointer">
-                <td class="px-4 py-2 text-center">{{ $song->song_id }}</td>
-                <td class="px-4 py-2">
-                    <div class="flex flex-col">
-                        <span class="text-lg font-semibold">{{ $song->song_name }}</span>
-                        <span class="text-xs text-gray-500 self-end">{{ $song->artist_name }}</span>
-                    </div>
-                </td>
-                <td class="px-4 py-2 text-gray-500 text-center">{{ $song->status->labels() }}</td>
-            </tr>
-        @empty
-            <tr>
-                <td class="px-4 py-4 text-center text-gray-400" colspan="3">
-                    尚無結束播放的歌曲
-                </td>
-            </tr>
-        @endforelse
-
-    </x-table>
-</div>

resources/views/livewire/pages/sound-control.blade.php

@@ -1,10 +0,0 @@
-<div class="py-12 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-    <div class="grid grid-cols-3 gap-6">
-        @foreach($buttons as $btn)
-            <x-button.flat-card 
-                image="{{ asset('手機點歌/'.$btn['img']) }}" 
-                wire:click="sendVolumeControl('{{ $btn['action'] }}')"
-            />
-        @endforeach
-    </div>
-</div>

resources/views/love-message.blade.php

@@ -1,10 +0,0 @@
-<x-app-layout>
-    <x-slot name="header">
-        <div class="header">超級巨星 自助式KTV</div>
-        <div class="banner">
-            <img src="{{ asset('手機點歌/BANNER-12.png') }}" alt="超級巨星 Banner">
-        </div>
-    </x-slot>
-
-    <livewire:pages.love-message />
-</x-app-layout>

resources/views/sound-control.blade.php

@@ -1,10 +0,0 @@
-<x-app-layout>
-    <x-slot name="header">
-        <div class="header">超級巨星 自助式KTV</div>
-        <div class="banner">
-            <img src="{{ asset('手機點歌/BANNER-09.png') }}" alt="超級巨星 Banner">
-        </div>
-    </x-slot>
-
-    <livewire:pages.sound-control />
-</x-app-layout>

routes/web.php

@@ -7,9 +7,6 @@ Route::view('/welcome', 'welcome')->name('welcome');
 Route::view('/new-songs', 'new-songs')->name('new-songs');
 Route::view('/top-ranking', 'top-ranking')->name('top-ranking');
 Route::view('/search-song', 'search-song')->name('search-song');
-Route::view('/clicked-song', 'clicked-song')->name('clicked-song');
-Route::view('/sound-control', 'sound-control')->name('sound-control');
-Route::view('/love-message', 'love-message')->name('love-message');
 
 Route::view('dashboard', 'dashboard')
     ->middleware(['auth', 'verified'])

開發手冊.ini

@@ -1,5 +1,2 @@
 npm install && npm run build
 
-https://ktvremote.test/?room_code=abc123
-
-php artisan storage:link