@extends('backend.master')

@section('title')
    {{ ___('common.Dashboard 1') }}
@endsection
@section('content')
    <div class="page-content">
        <!-- dashboard 1 html -->
        <div class="dashboard-heading row align-items-center pb-24">
            <div class="col-12 col-md-6 col-xl-6 col-lg-6">
                <h3 class="title">Good Morning, Robert! 👋</h3>
            </div>
        </div>
        <div class="row g-4">
            <div class="col-12">
                <div class="row g-4">
                    <!-- Dashboard Summery Card Start -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-1">
                                    <img src="{{ asset('backend/assets/images/icons/trend-up-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Company</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}" alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-2">
                                    <img src="{{ asset('backend/assets/images/icons/people-group-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total User</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}" alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-3">
                                    <img src="{{ asset('backend/assets/images/icons/invoices-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Invoice</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}" alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-4">
                                    <img src="{{ asset('backend/assets/images/icons/play-circle-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Subscriber</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-4">
                                    <img src="{{ asset('backend/assets/images/icons/play-circle-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Subscriber</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-3">
                                    <img src="{{ asset('backend/assets/images/icons/invoices-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Invoice</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-2">
                                    <img src="{{ asset('backend/assets/images/icons/people-group-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total User</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->

                    <!-- Single Dashboard Summery Card Start -->
                    <div class="col-12 col-md-6 col-xl-3 ">
                        <div class="card summery-card h-100 ot-card">
                            <div class="card-heading d-flex align-items-center">
                                <div class="card-icon icon-circle-1">
                                    <img src="{{ asset('backend/assets/images/icons/trend-up-color.svg') }}"
                                        alt="" />
                                </div>
                                <div class="card-content">
                                    <h4>Total Company</h4>
                                    <h1>28k+</h1>
                                </div>
                            </div>
                            <div class="card-bottom mt-20">
                                <div class="card-states">
                                    <div class="card-badge up">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Active</span>
                                    </div>

                                    <div class="card-badge down">
                                        <img src="{{ asset('backend/assets/images/icons/arrow-donw.svg') }}"
                                            alt="" />

                                        <span class="count">28k+</span>
                                        <span class="status">Inactive</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single Dashboard Summery Card End -->
                </div>
            </div>

            <div class="col-12">
                <!-- Dashboard Statistic start  -->

                <div class="row ot-charts g-4">
                    <div class="col-12 col-md-12 col-xxl-4">
                        <div class="card ot-card ot-visit-chart h-100">
                            <div class="card-header">
                                <div class="card-title">
                                    <h1>Visit Customer</h1>
                                </div>
                                <div class="dropdown card-button">
                                    <button class="btn btn-secondary ot-dropdown-btn dropdown-toggle" type="button"
                                        id="revenueBtn3" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span>Last 07 Days</span>
                                        <i class="fa fa-chevron-down"></i>
                                    </button>
                                    <ul class="dropdown-menu" aria-labelledby="revenueBtn3">
                                        <li>
                                            <a class="dropdown-item" href="#">Last 07 Days</a>
                                        </li>
                                        <li><a class="dropdown-item" href="#">Last Month</a></li>
                                        <li><a class="dropdown-item" href="#">Last Year</a></li>
                                    </ul>
                                </div>
                            </div>
                            <p class="mt-2">
                                <span class="ot-badge primary card-badge up"><img
                                        src="{{ asset('backend/assets/images/icons/arrow-up.svg') }}"
                                        alt="" />36.8%</span>
                                vs. Sep 8, 2021 visitor increased
                            </p>
                            <div class="card-body">
                                <div id="visited_customer_chart"></div>
                            </div>
                        </div>
                    </div>

                    <div class="col-12 col-md-12 col-xxl-8">
                        <div class="card statistic-card ot-card">

                            <div
                                class="card-header d-flex flex-row justify-content-between align-items-baseline flex-wrap">
                                <div class="card-title">
                                    <h1>Revenue</h1>
                                </div>
                                <div class="dropdown card-button">
                                    <button class="btn btn-secondary ot-dropdown-btn dropdown-toggle" type="button"
                                        id="revenueBtn1" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span>Last 07 Days</span>
                                        <i class="fa fa-chevron-down"></i>
                                    </button>
                                    <ul class="dropdown-menu" aria-labelledby="revenueBtn1">
                                        <li>
                                            <a class="dropdown-item" href="#">Last 07 Days</a>
                                        </li>
                                        <li><a class="dropdown-item" href="#">Last Month</a></li>
                                        <li><a class="dropdown-item" href="#">Last Year</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="card-body">
                                <div id="revenueChart"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Dashboard Statistic end  -->
            </div>

            <!--  table content start -->
            <div class="col-12 table-content table-basic">
                <div class="card">
                    <div class="card-header">Basic Datatable</div>
                    <div class="card-body">
                        <!-- toolbar table start -->
                        <div
                            class="table-toolbar d-flex flex-wrap gap-2 flex-column flex-xl-row justify-content-center justify-content-xxl-between align-content-center pb-3">
                            <div class="align-self-center">
                                <div
                                    class="d-flex flex-wrap gap-2 flex-column flex-lg-row justify-content-center align-content-center">
                                    <!-- show per page -->
                                    <div class="align-self-center">
                                        <label>
                                            <span class="mr-8">Show</span>
                                            <select class="form-select d-inline-block">
                                                <option value="10">10</option>
                                                <option value="25">25</option>
                                                <option value="50">50</option>
                                                <option value="100">100</option>
                                            </select>
                                            <span class="ml-8">Entries</span>
                                        </label>
                                    </div>

                                    <div class="align-self-center d-flex gap-2">
                                        <!-- add btn -->
                                        <div class="align-self-center">
                                            <a href="#" role="button" class="btn-add" data-bs-toggle="tooltip"
                                                data-bs-placement="right" data-bs-title="Add">
                                                <span><i class="fa-solid fa-plus"></i> </span>
                                                <span class="d-none d-xl-inline">{{ ___('common.add') }}</span>
                                            </a>
                                        </div>
                                        <!-- daterange -->
                                        <div class="align-self-center">
                                            <button type="button" class="btn-daterange" id="daterange"
                                                data-bs-toggle="tooltip" data-bs-placement="right"
                                                data-bs-title="Date Range">
                                                <span class="icon"><i class="fa-solid fa-calendar-days"></i>
                                                </span>
                                                <span class="d-none d-xl-inline">Date Range</span>
                                            </button>
                                        </div>
                                        <!-- Designation -->
                                        <div class="align-self-center">
                                            <div class="dropdown dropdown-designation" data-bs-toggle="tooltip"
                                                data-bs-placement="right" data-bs-title="Designation">
                                                <button type="button" class="btn-designation" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <span class="icon"><i class="fa-solid fa-user-shield"></i></span>

                                                    <span class="d-none d-xl-inline">Designation</span>
                                                </button>

                                                <div class="dropdown-menu">
                                                    <div class="search-content">
                                                        <div class="search-box d-flex">
                                                            <input class="form-control ot-input" placeholder="{{ ___('common.search') }}"
                                                                name="search" />
                                                            <span class="icon"><i
                                                                    class="fa-solid fa-magnifying-glass"></i></span>
                                                        </div>
                                                    </div>

                                                    <div class="dropdown-divider"></div>

                                                    <ul class="list">
                                                        <li class="list-item">
                                                            <a class="dropdown-item" href="#">Main Department</a>
                                                        </li>

                                                        <li class="list-item">
                                                            <a class="dropdown-item" href="#">Admin & HRM</a>
                                                        </li>

                                                        <li class="list-item">
                                                            <a class="dropdown-item" href="#">Accounts</a>
                                                        </li>

                                                        <li class="list-item">
                                                            <a class="dropdown-item" href="#">Development</a>
                                                        </li>

                                                        <li class="list-item">
                                                            <a class="dropdown-item" href="#">Software</a>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- search -->
                                    <div class="align-self-center">
                                        <div class="search-box d-flex">
                                            <input class="form-control" placeholder="{{ ___('common.search') }}" name="search" />
                                            <span class="icon"><i class="fa-solid fa-magnifying-glass"></i></span>
                                        </div>
                                    </div>

                                    <!-- dropdown action -->
                                    <div class="align-self-center">
                                        <div class="dropdown dropdown-action" data-bs-toggle="tooltip"
                                            data-bs-placement="right" data-bs-title="Action">
                                            <button type="button" class="btn-dropdown" data-bs-toggle="dropdown"
                                                aria-expanded="false">
                                                <i class="fa-solid fa-ellipsis"></i>
                                            </button>
                                            <ul class="dropdown-menu dropdown-menu-end">
                                                <li>
                                                    <a class="dropdown-item" href="#"><span class="icon mr-10"><i
                                                                class="fa-solid fa-eye"></i></span>
                                                        Make Publish</a>
                                                </li>
                                                <li>
                                                    <a class="dropdown-item" href="#" aria-current="true"><span
                                                            class="icon mr-8"><i class="fa-solid fa-eye-slash"></i></span>
                                                        Make Unpublish</a>
                                                </li>
                                                <li>
                                                    <a class="dropdown-item" href="#">
                                                        <span class="icon mr-16"><i
                                                                class="fa-solid fa-trash-can"></i></span>Delete
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- export -->
                            <div class="align-self-center">
                                <div class="d-flex justify-content-center justify-content-xl-end align-content-center">
                                    <div class="dropdown dropdown-export" data-bs-toggle="tooltip"
                                        data-bs-placement="right" data-bs-title="Export">
                                        <button type="button" class="btn-export" data-bs-toggle="dropdown"
                                            aria-expanded="false">
                                            <span class="icon"><i
                                                    class="fa-solid fa-arrow-up-right-from-square"></i></span>

                                            <span class="d-none d-xl-inline">Export</span>
                                        </button>

                                        <ul class="dropdown-menu dropdown-menu-end">
                                            <li>
                                                <a class="dropdown-item" href="#"><span class="icon mr-8"><i
                                                            class="fa-solid fa-copy"></i></span>
                                                    Copy</a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item" href="#" aria-current="true"><span
                                                        class="icon mr-10"><i class="fa-solid fa-file-excel"></i></span>
                                                    Exel File</a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item" href="#">
                                                    <span class="icon mr-14"><i
                                                            class="fa-solid fa-file-csv"></i></span>Csv
                                                    File
                                                </a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item" href="#">
                                                    <span class="icon mr-14"><i
                                                            class="fa-solid fa-file-pdf"></i></span>Pdf
                                                    File
                                                </a>
                                            </li>
                                            <li>
                                                <a class="dropdown-item" href="#">
                                                    <span class="icon mr-10"><i
                                                            class="fa-solid fa-table-columns"></i></span>Column Header
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- toolbar table end -->

                        <!--  table start -->
                        <div class="table-responsive">
                            <table class="table table-bordered">
                                <thead class="thead">
                                    <tr>
                                        <th class="sorting_asc">
                                            <div class="check-box">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" />
                                                </div>
                                            </div>
                                        </th>
                                        <th class="sorting_desc">SR No.</th>
                                        <th class="sorting_desc">Purchase ID</th>
                                        <th class="sorting_desc">Title</th>
                                        <th class="sorting_desc">User</th>
                                        <th class="sorting_desc">Assigned To</th>
                                        <th class="sorting_desc">Created By</th>
                                        <th class="sorting_desc">Create Date</th>
                                        <th class="sorting_desc">Status</th>
                                        <th class="sorting_desc">Priority</th>
                                        <th class="sorting_desc">Action</th>
                                    </tr>
                                </thead>
                                <tbody class="tbody">
                                    <tr>
                                        <td>
                                            <div class="check-box">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" />
                                                </div>
                                            </div>
                                        </td>
                                        <td>01</td>
                                        <td>IDL-963</td>
                                        <td>Add Dynamic Contact List</td>
                                        <td>Robert Downey</td>
                                        <td>Peter Parker</td>
                                        <td>Robert Downey</td>
                                        <td>Jan 14, 2022</td>
                                        <td>
                                            <span class="badge-light-success">{{ ___('common.re_open') }}</span>
                                        </td>
                                        <td>
                                            <span class="badge-success">{{ ___('common.high') }}</span>
                                        </td>
                                        <td>
                                            <div class="dropdown dropdown-action">
                                                <button type="button" class="btn-dropdown" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <i class="fa-solid fa-ellipsis"></i>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-end">
                                                    <li>
                                                        <a class="dropdown-item" href="#"><span
                                                                class="icon mr-12"><i
                                                                    class="fa-solid fa-pen-to-square"></i></span>
                                                            Edit</a>
                                                    </li>
                                                    <li>
                                                        <a class="dropdown-item" href="#">
                                                            <span class="icon mr-16"><i
                                                                    class="fa-solid fa-trash-can"></i></span>Delete
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="check-box">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" />
                                                </div>
                                            </div>
                                        </td>
                                        <td>01</td>
                                        <td>IDL-963</td>
                                        <td>Add Dynamic Contact List</td>
                                        <td>Robert Downey</td>
                                        <td>Peter Parker</td>
                                        <td>Robert Downey</td>
                                        <td>Jan 14, 2022</td>
                                        <td>
                                            <span class="badge-light-danger">{{ ___('common.re_open') }}</span>
                                        </td>
                                        <td>
                                            <span class="badge-danger">{{ ___('common.high') }}</span>
                                        </td>
                                        <td>
                                            <div class="dropdown dropdown-action">
                                                <button type="button" class="btn-dropdown" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <i class="fa-solid fa-ellipsis"></i>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-end">
                                                    <li>
                                                        <a class="dropdown-item" href="#"><span
                                                                class="icon mr-12"><i
                                                                    class="fa-solid fa-pen-to-square"></i></span>
                                                            Edit</a>
                                                    </li>
                                                    <li>
                                                        <a class="dropdown-item" href="#">
                                                            <span class="icon mr-16"><i
                                                                    class="fa-solid fa-trash-can"></i></span>Delete
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="check-box">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" />
                                                </div>
                                            </div>
                                        </td>
                                        <td>01</td>
                                        <td>IDL-963</td>
                                        <td>Add Dynamic Contact List</td>
                                        <td>Robert Downey</td>
                                        <td>Peter Parker</td>
                                        <td>Robert Downey</td>
                                        <td>Jan 14, 2022</td>
                                        <td>
                                            <span class="badge-light-warning">{{ ___('common.re_open') }}</span>
                                        </td>
                                        <td>
                                            <span class="badge-warning">{{ ___('common.high') }}</span>
                                        </td>
                                        <td>
                                            <div class="dropdown dropdown-action">
                                                <button type="button" class="btn-dropdown" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <i class="fa-solid fa-ellipsis"></i>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-end">
                                                    <li>
                                                        <a class="dropdown-item" href="#"><span
                                                                class="icon mr-12"><i
                                                                    class="fa-solid fa-pen-to-square"></i></span>
                                                            Edit</a>
                                                    </li>
                                                    <li>
                                                        <a class="dropdown-item" href="#">
                                                            <span class="icon mr-16"><i
                                                                    class="fa-solid fa-trash-can"></i></span>Delete
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="check-box">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" />
                                                </div>
                                            </div>
                                        </td>
                                        <td>01</td>
                                        <td>IDL-963</td>
                                        <td>Add Dynamic Contact List</td>
                                        <td>Robert Downey</td>
                                        <td>Peter Parker</td>
                                        <td>Robert Downey</td>
                                        <td>Jan 14, 2022</td>
                                        <td>
                                            <span class="badge-light-primary">{{ ___('common.re_open') }}</span>
                                        </td>
                                        <td>
                                            <span class="badge-primary">{{ ___('common.high') }}</span>
                                        </td>
                                        <td>
                                            <div class="dropdown dropdown-action">
                                                <button type="button" class="btn-dropdown" data-bs-toggle="dropdown"
                                                    aria-expanded="false">
                                                    <i class="fa-solid fa-ellipsis"></i>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-end">
                                                    <li>
                                                        <a class="dropdown-item" href="#"><span
                                                                class="icon mr-12"><i
                                                                    class="fa-solid fa-pen-to-square"></i></span>
                                                            Edit</a>
                                                    </li>
                                                    <li>
                                                        <a class="dropdown-item" href="#">
                                                            <span class="icon mr-16"><i
                                                                    class="fa-solid fa-trash-can"></i></span>Delete
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <!--  table end -->
                        <!--  pagination start -->
                        <div class="ot-pagination d-flex justify-content-end align-content-center">
                            <nav aria-label="Page navigation example">
                                <ul class="pagination">
                                    <li class="page-item">
                                        <a class="page-link" href="#" aria-label="Previous">
                                            <span aria-hidden="true"><i class="fa fa-angle-left"></i></span>
                                        </a>
                                    </li>
                                    <li class="page-item">
                                        <a class="page-link active" href="#">1</a>
                                    </li>
                                    <li class="page-item">
                                        <a class="page-link" href="#">2</a>
                                    </li>
                                    <li class="page-item">
                                        <a class="page-link" href="#">3</a>
                                    </li>
                                    <li class="page-item">
                                        <a class="page-link" href="#" aria-label="Next">
                                            <span aria-hidden="true"><i class="fa fa-angle-right"></i></span>
                                        </a>
                                    </li>
                                </ul>
                            </nav>
                        </div>

                        <!--  pagination end -->
                    </div>
                </div>
            </div>
            <!--  table content end -->
        </div>


        <!-- Dashboard Summery Card End -->




    </div>
@endsection