@extends('app')
@section('content')
    <div class="w-full mt-[90px] justify-center container flex ">
        <div class="bg-white w-[350px] p-6 rounded-xl  ">
            <h1 class="w-full bg-cyan-500 rounded-t-xl text-center p-1.5 font-bold text-slate-50">ایجاد وظیفه جدید</h1>
            <form action="{{Route('create_api')}}" method="POST" class="grid grid-cols-2 gap-4 items-center">
                @csrf
                <!-- نام Issue (الزامی) -->
                <label for="name" class="font-medium text-sm">نام:</label>
                <input class="rounded-lg border border-gray-300 p-2 w-full" type="text" id="name" name="name" required>

                <!-- توضیحات HTML -->
                <label for="description_html" class="font-medium text-sm">توضیحات:</label>
                <textarea id="description_html" name="description_html"
                          class="rounded-lg border border-gray-300 p-2 w-full"></textarea>

                <!-- اولویت -->
                <label for="priority" class="font-medium text-sm">اولویت:</label>
                <select id="priority" name="priority"
                        class="rounded-lg border border-gray-300 p-2 w-full">
                    <option value="none">ندارد</option>
                    <option value="urgent">فوری</option>
                    <option value="high">بالا</option>
                    <option value="medium">عادی</option>
                    <option value="low">پایین</option>
                </select>

                <!-- تاریخ شروع -->
                <label for="start_date" class="font-medium text-sm">تاریخ شروع:</label>
                <input class="rounded-lg border border-gray-300 p-2 w-full" type="date" id="start_date"
                       name="start_date">

                <!-- تاریخ هدف -->
                <label for="target_date" class="font-medium text-sm">تاریخ هدف:</label>
                <input class="rounded-lg border border-gray-300 p-2 w-full" type="date" id="target_date"
                       name="target_date">

                <!-- وضعیت -->
                <label for="state" class="font-medium text-sm">وضعیت:</label>
                <select id="state" name="state"
                        class="rounded-lg border border-gray-300 p-2 w-full">
                    <option value="c73c2044-ea14-42cb-b08d-cecf3d1fdfb5">درحال انجام</option>
                    <option value="a9ce312f-cfca-491e-8e3d-1975aa6ebc10">در انتظار</option>
                    <option value="dea1fb57-a281-4fe7-8f3e-ee5567637e35">دارای خطا</option>
                    <option value="770fbe42-99f6-41db-9b9e-773d9cced1a5">در صف انجام</option>
                    <option value="b0e464e1-34eb-41ea-b2f7-3ef7483bc9f0">انجام‌شده</option>
                    <option value="d61d14a3-72f7-4f44-894b-efe8b2a75be1">لغوشده</option>
                </select>

                <!-- کاربران مسئول -->
{{--                <label for="assignees" class="font-medium text-sm">انتصاب کاربران:</label>--}}
                <label class="font-medium text-sm">انتصاب کاربران:</label>
                <div class="rounded-lg border border-gray-300 p-2 w-full max-h-32 overflow-y-auto space-y-2">
                    @foreach($users as $user)
                        <label class="flex items-center space-x-2">
                            <input type="checkbox" name="assignees[]" value="{{ $user->plain_id }}" class="rounded text-cyan-600 focus:ring-cyan-500">
                            <span>{{ $user->name }}</span>
                        </label>
                    @endforeach
                </div>

                <!-- برچسب‌ها -->
                <label for="labels" class="font-medium text-sm">برچسب‌ها:</label>
                <input class="rounded-lg border border-gray-300 p-2 w-full"
                       type="text" id="labels" name="labels[]" placeholder="UUID1, UUID2">

                <!-- Issue والد -->
                <label for="parent" class="font-medium text-sm">پروژه والد:</label>
                <select id="parent" name="parent" class="rounded-lg border border-gray-300 p-2 w-full">
                    @foreach($tasks as $task)
                        <option value="{{$task->task_id}}">{{$task->name}}</option>
                    @endforeach
                </select>

                <!-- امتیاز تخمین -->
                <label for="estimate_point" class="font-medium text-sm">Estimate Point (0-7):</label>
                <input class="rounded-lg border border-gray-300 p-2 w-full" type="number" id="estimate_point"
                       name="estimate_point" min="0" max="7">

                <!-- دکمه -->
                <div></div>
                <button type="submit"
                        class="bg-cyan-600 text-white py-2 px-4 rounded-lg hover:bg-cyan-700 transition">
                    ایجاد وظیفه
                </button>
            </form>

        </div>
    </div>

@endsection