@extends('layouts.main')
@section('title', 'Mobile Fields Master')
@section('container')

    <style>
        .new-card-header {
            padding: 7px 10pxpx !important;
        }

        .card-header.align-items-center.d-flex {
            padding: 8px 10px;
        }

        .dashboard_bar {
            color: #fff !important;
        }

        .col-xxl-12.col-md-12 {
            margin-top: 5px;
        }

        .col-xl-3.col-lg-3 {
            margin-top: 12px;
        }

        form#addCompany {
            margin-bottom: 0;
        }
    </style>
    <div class="row">

        <div class="col-md-12">
            {{-- ********* Role card *********** --}}
            <div class="card" style="height: max-content;">
                <div class="card-header new-card-header" style="background:var(--secondary) ; padding:7px 10px!important;">

                    <h4 class="card-title" data-heading-tag="H4">Mobile Field Master</h4>

                    <a class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#basicModal"><i class="fa fa-plus"></i> Add New Template</a>
                </div>
                <div class="card-body">
                    <div class="table-responsive active-projects">
                        <table id="projects-tbl" class="table">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>Action</th>
                                    <th>Status</th>
                                    <th>Name</th>
                                    <th>Total Question</th>
                                    <th>Date</th>
                                </tr>
                            </thead>

                            <tbody>
                                @php
                                    $i = 0;
                                @endphp
                                @foreach ($templete as $row)
                                    <tr>
                                        <td>{{ ++$i }}</td>
                                        <td>
                                            @if($row->status == 2)
                                            <a href="{{ route('addmobiletempletemaster') }}?id={{ $row->id }}"
                                                class="badge badge-primary badge-rounded"><i class="fa fa-pencil"></i></a>
                                            @else
                                                <a href="{{ route('editmobiletempletemaster') }}?id={{ $row->id }}"
                                                    class="badge badge-primary badge-rounded"><i class="fa fa-pencil"></i></a>

                                            @endif
                                          </td>
                                        <td>
                                            @if ($row->status == 1)
                                                <div class="bootstrap-badge">
                                                    <a href="javascript:void(0)"
                                                        class="badge badge-rounded badge-success" onclick="deactive({{ $row->id }})">Active</a>
                                                </div>
                                            @elseif ($row->status == 2)
                                                <div class="bootstrap-badge">
                                                    <a href="javascript:void(0)" class="badge badge-rounded badge-info">Save as
                                                        Darft</a>
                                                </div>
                                            @else
                                                <div class="bootstrap-badge">
                                                    <a href="javascript:void(0)"
                                                        class="badge badge-rounded badge-danger" onclick="active({{ $row->id }})">Deactive</a>
                                                </div>
                                            @endif
                                        </td>
                                        <td>{{ $row->name }}</td>
                                        <td>
                                            @php
                                                $totalqu = App\Models\Mobile_question::where("templete_id", $row->id)->count();
                                            @endphp
                                            {{ $totalqu }}
                                        </td>
                                        <td style="text-align:left !important;">{{ date("d-M-y", strtotime($row->created_at)) }}
                                        </td>

                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            {{-- ********* Role card *********** --}}
        </div>

    </div>




    <!-- ************ Qu . Add modal *******  -->
    <div class="modal fade" id="basicModal">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header" style="background:var(--secondary) ; padding:7px 10px!important;">
                    <h5 class="modal-title">Add New Template</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal">
                    </button>
                </div>
                <div class="modal-body">
                    <form id="AddTempleteForm">
                        @csrf
                        <div class="mb-3">
                            <label>Title</label>
                            <input type="text" name="title" class="form-control" required>
                        </div>
                        <button type="submit" id="savename" class="btn btn-primary d-none mt-3">Save Question</button>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button btn-save" id="save" class="btn btn-primary">Submit</button>
                </div>
            </div>
        </div>
    </div>
    <!-- ************ Qu . Add modal *******  -->



    <script nonce="{{ $cspNonce }}" src="{{ asset('public/js/jquery-3.6.0.min.js') }}"></script>
    <script nonce="{{ $cspNonce }}" src="{{ asset('js/addmobilequ.js') }}"></script>
@endsection