@extends('layouts.main')

@section('stylesheets')
<link rel="stylesheet" href="{{asset('css/general-inner.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/index.css')}}"/>
    <link rel="stylesheet" href="{{asset('css/issue-categories.css')}}"/>
@endsection

@section('content')
    <div blade="{{ $viewName ?? 'unknown' }}">
    <div class="main-wrapper">
        <div class="row justify-content-between Header mb-5">
            <div class="col-md-8 d-flex flex-column justify-content-center justify-content-md-start Header-breadcrumbs">
                <h2 class="page-title">Edit Issue Category {{$category->name}}</h2>
            </div>
            <div class="col-md-4 d-flex justify-content-center justify-content-md-end Header-buttons">

            </div>
        </div>
        <div class="row Content">
            @if ($errors->any())
                <div class="alert alert-danger">
                    <strong>Whoops!</strong> There were some problems with your input.<br><br>
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
            <form action="{{ route('issue.categories.update',['issueCategory' => $category]) }}" method="POST">
                @csrf
                @method('PUT')

                <div class="form-inner-container">
                    @csrf
                    <div class="form-group">
                        <label>Name:</label>
                        <input type="text" name="name" value="{{ $category->name }}" class="form-control name"
                               placeholder="Name">
                    </div>
                    <div class="btn-container">
                        <button type="submit" class="btn">Submit</button>
                    </div>
                </div>
            </form>
            <div class="card-body">
                <div class="d-flex justify-content-end Header-buttons">
                    <a href="#"
                       class="Header-buttons--button me-3" data-bs-toggle="modal"
                       data-bs-target="#addIssueSubCategory" title="add subCategory">
                        <p class="Header-buttons--button--text">Make a New Sub Category</p>
                        <img src="{{asset('images/plus.svg')}}" class="homeHeader-buttons--button--img">
                    </a>
                </div>
                @include('superadmin.modals.add-issue_sub_category',['category' => $category])
                <div class="main-info-container user-units">
                    <div class="row main-info-container--header-row">
                        <p class="role-name">Agent</p>
                        <p class="view-name">Microservices</p>
                        <p class="action">Actions</p>
                    </div>
                    @foreach ($category->children as $child)
                        <div class=" row main-info-container--row">
                            <p class="number"><span>{{$child->value}}</span></p>
                            <p class="view-name">{{$child->name}}</p>
                            <a href="#" class="btn main-info-container--btn remove" data-bs-toggle="modal"
                               data-bs-target="#editIssueSubCategory-{{$child->value}}" title="edit subCategory">
                                <span>Edit</span>
                            </a>
                            @include('superadmin.modals.edit-issue_sub_category',['category' => $category, 'subCategory' => $child])
                            <form class="action"
                                  action="{{route('issue.categories.remove.child' , ['subCategory' => $child])}}"
                                  method="POST">
                                @csrf
                                @method('DELETE')
                                <button
                                    onclick="return confirm('{{ __('Are you sure you want to remove?') }}')"
                                    type="submit" class="btn main-info-container--btn remove"><span>Remove On SubCategory</span><img
                                        src="{{asset('images/remove.svg')}}" class="tab-img"></button>
                            </form>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    </div>
@endsection