@extends('layout.layout')
@section('title','Statuses')
@section('status','active')
@section('content')
    <section class="content-header">
        <div class="container-fluid">
            <h5>Status</h5>

            <div class="card card-cyan mt-3">
                <div class="card-header">
                    <i class="fa fa-info  mr-1"></i> Ticket Status
                    <span class="btn btn-sm btn-primary float-right" onclick="callModal(0)"
                          style="margin:-5px">
                        <i class="fas fa-plus mr-1"></i>Add Status
                    </span>
                </div>
                <div class="card-body">
                    <table id="datatable" class="table" style="width: 100%">
                        <thead>
                        <tr>
                            <th>Description</th>
                            <th>Status</th>
                            <th></th>
                        </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
            </div>
        </div>
    </section>
    <section class="content">
        <div class="container-fluid">

        </div>
    </section>
@endsection


{{-- this is the modal section where you can configure the content(modal-body and the modal-header) --}}
{{-- the submit button is inside the layout --}}
@section('modal-title')
    <h6 id="modal-title" class="modal-title" style="font-weight: normal"></h6>
@endsection

@section('modal-content')
    <form id="form">
        @csrf
        <div class="form-group row">
            <label for="" class="col-sm-2 col-form-label">Description</label>
            <div class="col-sm-10">
                <input type="" class="form-control" name="description" id="description" required>
            </div>
        </div>
        <input type="" class="form-control" name="id" id="id" hidden >
    </form>
@endsection

@section('scripts')
    @include('status.script')
    <style>
        #delete{
            display: none
        }
    </style>
@endsection