@extends('layouts.template.main')
@section('title', 'Thêm mới trạng thái')
@section('content')
    <main>
        <header class="page-header page-header-compact page-header-light border-bottom bg-white mb-4">
            <div class="container-xl px-4">
                <div class="page-header-content">
                    <div class="row align-items-center justify-content-between pt-3">
                        <div class="col-auto mb-3">
                            <h1 class="page-header-title">
                                <div class="page-header-icon">
                                    <i data-feather="user"></i>
                                </div>
                                Tạo trạng thái
                            </h1>
                        </div>
                        <div class="col-auto mb-3">
                            <h1 class="page-header-title">
                                <a class="btn btn-sm btn-outline-secondary" href="{{ route('status.index') }}">
                                    Quay lại
                                </a>
                            </h1>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <!-- Main page content-->
        <div class="container-xl px-4 mt-4">
            <div class="row">
                <div class="col-xl-12">
                    <!-- Account details card-->
                    <div class="card mb-4">
                        <div class="card-header">Tạo trạng thái</div>
                        <div class="card-body">

                            {{-- @if ($errors->any())
                                <div class="alert alert-danger">
                                    <ul>
                                        @foreach ($errors->all() as $error)
                                            <li>{{ $error }}</li>
                                        @endforeach
                                    </ul>
                                </div>
                                <br>
                            @endif --}}
                            @if (session('error'))
                                <div class="alert alert-danger">
                                    {{ session('error') }}
                                </div>
                                <br>
                            @endif

                            @if (session('success'))
                                <div class="alert alert-success">
                                    {{ session('success') }}
                                </div>
                                <br>
                            @endif
                            <form method="post" action="{{ route('status.store') }}" enctype="multipart/form-data">
                                {{ csrf_field() }}
                                <!-- --------------------------------- Name & Email --------------------------------- -->
                                <div class="row gx-3 mb-3">
                                    <!-- Form Group (first name)-->
                                    <div class="col-md-6">
                                        <label class="small mb-1" for="inputFirstName">Name</label>
                                        <input class="form-control @error('name') is-invalid @enderror" id="inputFirstName"
                                            type="text" placeholder="name" value="" name="name" required />
                                        @error('name')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <!-- Form Group (last name)-->

                                    <div class="col-md-2">
                                        <label class="small mb-1" for="background">Background: </label>
                                        <br>
                                        <input class=" @error('background') is-invalid @enderror" id="background"
                                            type="color" placeholder="background" value="#000000" name="background"
                                            required />
                                        @error('background')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                    <div class="col-md-2">
                                        <label class="small mb-1" for="mau">Color: </label>
                                        <br>
                                        <input class=" @error('color') is-invalid @enderror" id="mau" type="color"
                                            placeholder="color" value="#000000" name="color" required />
                                        @error('color')
                                            <div class="invalid-feedback">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <!-- --------------------------------- Name & Email --------------------------------- -->
                                <button class="btn btn-primary" type="submit">
                                    Lưu
                                </button>


                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection