@extends('layouts.admin')

@section('title', '新增問題')

@push('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('issues.index') }}">問題追蹤板</a></li>
    <li class="breadcrumb-item active" aria-current="page">新增問題</li>
@endpush

@push('styles')
<link rel="stylesheet" href="{{ asset('css/pages/issues/create.css') }}">
@endpush

@section('content')
<!-- Header -->
<div class="create-header">
    <div class="row align-items-center">
        <div class="col-md-6">
            <h1><i class="bi bi-plus-circle me-3"></i>新增問題</h1>
        </div>
        <div class="col-md-6 text-md-right">
            <a href="{{ route('issues.index') }}" class="btn btn-outline-light">
                <i class="bi bi-arrow-left me-2"></i>返回列表
            </a>
        </div>
    </div>
</div>

<form action="{{ route('issues.store') }}" method="POST">
    @csrf

    <div class="form-card">
        <div class="card-header">
            <i class="bi bi-card-text me-2"></i>問題資訊
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-12 mb-3">
                    <label class="form-label">
                        <i class="bi bi-tag"></i>問題分類
                        <span class="text-danger">*</span>
                    </label>
                    <select name="category" class="form-select form-select-lg" required>
                        <option value="">請選擇分類</option>
                        <option value="工人問題" {{ old('category') == '工人問題' ? 'selected' : '' }}>工人問題</option>
                        <option value="宿舍問題" {{ old('category') == '宿舍問題' ? 'selected' : '' }}>宿舍問題</option>
                        <option value="公司問題" {{ old('category') == '公司問題' ? 'selected' : '' }}>公司問題</option>
                        <option value="店鋪問題" {{ old('category') == '店鋪問題' ? 'selected' : '' }}>店鋪問題</option>
                        <option value="其他問題" {{ old('category') == '其他問題' ? 'selected' : '' }}>其他問題</option>
                    </select>
                </div>

                <div class="col-md-12 mb-3">
                    <label class="form-label">
                        <i class="bi bi-chat-left-text"></i>問題簡介
                        <span class="text-danger">*</span>
                    </label>
                    <input type="text" 
                           name="title" 
                           class="form-control form-control-lg" 
                           value="{{ old('title') }}" 
                           placeholder="簡短描述問題主題"
                           required>
                </div>

                <div class="col-md-12 mb-3">
                    <label class="form-label">
                        <i class="bi bi-file-text"></i>問題內容
                        <span class="text-danger">*</span>
                    </label>
                    <textarea name="content" 
                              class="form-control" 
                              rows="6" 
                              placeholder="詳細描述問題內容..."
                              required>{{ old('content') }}</textarea>
                </div>

                <div class="col-md-6 mb-3">
                    <label class="form-label">
                        <i class="bi bi-flag"></i>優先級
                        <span class="text-danger">*</span>
                    </label>
                    <select name="priority" class="form-select form-select-lg" required>
                        <option value="low" {{ old('priority') == 'low' ? 'selected' : '' }}>低</option>
                        <option value="medium" {{ old('priority') == 'medium' ? 'selected' : '' }}>中</option>
                        <option value="high" {{ old('priority') == 'high' ? 'selected' : '' }}>高</option>
                        <option value="urgent" {{ old('priority') == 'urgent' ? 'selected' : '' }}>緊急</option>
                    </select>
                </div>

                <div class="col-md-6 mb-3">
                    <label class="form-label">
                        <i class="bi bi-calendar-event"></i>處理期限
                    </label>
                    <input type="datetime-local" 
                           name="due_date" 
                           class="form-control form-control-lg"
                           value="{{ old('due_date') }}">
                </div>

                <div class="col-md-12 mb-3">
                    <label class="form-label">
                        <i class="bi bi-person-badge"></i>指派跟進人
                    </label>
                    <select name="assigned_to" class="form-select form-select-lg">
                        <option value="">-- 尚未指派 --</option>
                        @foreach($users as $user)
                            <option value="{{ $user->id }}" {{ old('assigned_to') == $user->id ? 'selected' : '' }}>
                                {{ $user->name }} {{ $user->isAdmin() ? '(管理員)' : '' }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
    </div>

    <!-- Submit Section -->
    <div class="submit-section">
        <div class="d-flex justify-content-center gap-3">
            <a href="{{ route('issues.index') }}" class="btn btn-cancel">
                <i class="bi bi-x-circle me-2"></i>取消
            </a>
            <button type="submit" class="btn btn-submit">
                <i class="bi bi-check-circle me-2"></i>建立問題
            </button>
        </div>
    </div>
</form>
@endsection