@extends('restaurant.layout.index')
@section('title','Muftaax | Staff Detail')
@section('custom-style')
    <style>

    </style>
@endsection
@section('content')

         <!-- Start::app-content -->
        <div class="main-content app-content">
            <div class="container-fluid">

                <!-- Page Header -->
                <div class="my-4 page-header-breadcrumb d-flex align-items-center justify-content-between flex-wrap gap-2">
                    <div>
                        <h1 class="page-title fw-medium fs-18 mb-2">Staff Detail</h1>
                        <div class="">
                            <nav>
                                <ol class="breadcrumb mb-0">
                                    <li class="breadcrumb-item"><a href="javascript:void(0);">Dashboard</a></li>
                                    <li class="breadcrumb-item active" aria-current="page">Staff Detail</li>
                                </ol>
                            </nav>
                        </div>
                    </div>

                </div>
                <!-- Page Header Close -->

                <!-- Start:: row-1 -->
                <div class="row">
                    <div class="col-xl-12">
                        <div class="card custom-card">
                            <div class="card-body">
                                <div class="row align-items-top gap-5 p-2 border-bottom-0">
                                    <div class="col-sm-6">
                                        <div class="d-flex align-items-center gap-2 mb-4">
                                            <div class="lh-1">
                                                <span class="avatar avatar-xxl avatar-rounded online me-3">
                                                    <img src="{{asset('assets/images/faces/9.jpg')}}" alt="">
                                                </span>
                                            </div>
                                            <div class="flex-fill main-profile-info">
                                                <div class="d-flex align-items-center justify-content-between mb-1">
                                                    <h6 class="fw-medium mb-1">Toni Stark</h6>
                                                </div>

                                                <p class="fs-12 mb-0 op-5">
                                                    <span class="me-3"><i class="ri-building-line me-1 align-middle"></i>Georgia</span>
                                                    <span><i class="ri-map-pin-line me-1 align-middle"></i>Washington D.C</span>
                                                </p>
                                            </div>
                                        </div>
                                        <div class="d-sm-flex justify-content-center mb-0">
                                            <div class="me-sm-3 mb-2 border p-3 border-dashed rounded">
                                                <p class="fw-bold fs-20 text-shadow mb-0">113</p>
                                                <p class="mb-0 fs-11 op-5">Total Redeemed Offers</p>
                                            </div>
                                            <div class="me-sm-3 mb-2 border p-3 border-dashed rounded">
                                                <p class="fw-bold fs-20 text-shadow mb-0">12.2k</p>
                                                <p class="mb-0 fs-11 op-5">Total QR Scanned</p>
                                            </div>

                                        </div>
                                    </div>
                                    <div class="col-sm-6 professional-bio">
                                        <div>
											<p class="fs-15 mb-3 me-4 fw-medium">Contact Information :</p>
											<div class="text-muted">
												<p class="mb-4">
													<span class="avatar avatar-sm avatar-rounded me-2 bg-light border text-muted">
														<i class="ri-mail-line align-middle fs-14"></i>
													</span>
													tonistark2531@gmail.com
												</p>
												<p class="mb-4">
													<span class="avatar avatar-sm avatar-rounded me-2 bg-light border text-muted">
														<i class="ri-phone-line align-middle fs-14"></i>
													</span>
													+(555) 555-1234
												</p>
												<p class="mb-0">
													<span class="avatar avatar-sm avatar-rounded me-2 bg-light border text-muted">
														<i class="ri-map-pin-line align-middle fs-14"></i>
													</span>
													MIG-1-11, Monroe Street, Georgetown, USA,20071
												</p>
											</div>
										</div>
                                    </div>


                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- End:: row-1 -->

                <!-- Start::row-2 -->
                <div class="row">

                    <div class="col-xxl-12 col-xl-12">
                        <div class="row">
                            <div class="col-xl-12">
                                <div class="card custom-card">
                                    <div class="card-body p-0">
                                        <div class="p-3 border-bottom border-block-end-dashed d-flex align-items-center justify-content-between">
                                            <div>
                                                <ul class="nav nav-tabs mb-0 tab-style-6 justify-content-start" id="myTab" role="tablist">
                                                    <li class="nav-item" role="presentation">
                                                        <button class="nav-link active" id="activity-tab" data-bs-toggle="tab"
                                                            data-bs-target="#activity-tab-pane" type="button" role="tab"
                                                            aria-controls="activity-tab-pane" aria-selected="false"><i
                                                                class="ri-gift-line me-1 align-middle d-inline-block"></i>QR Scanned</button>
                                                    </li>

                                                </ul>
                                            </div>
                                            <div>
                                                <p class="fw-medium mb-2">Completed Offers </p>
                                                <div class="progress progress-xs progress-animate">
                                                    <div class="progress-bar bg-primary" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="p-3">
                                            <div class="tab-content" id="myTabContent">
                                                <div class="tab-pane active show p-0 border-0" id="activity-tab-pane"
                                                    role="tabpanel" aria-labelledby="activity-tab" tabindex="0">

													<table class="table text-nowrap">
														<thead>
															<tr>

																<th scope="col">Restaurant</th>
																<th scope="col">Offer</th>
																<th scope="col">Details</th>
																<th scope="col">Redeemed</th>
																<th scope="col">Status</th>
																<th scope="col">Active</th>
															</tr>
														</thead>
														<tbody>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-success-transparent">Paid</span>
																</td>

																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-warning-transparent">Pending</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-danger-transparent">Rejected</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-success-transparent">Paid</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-primary-transparent">Rejected</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-success-transparent">Paid</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-success-transparent">Paid</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-warning-transparent">Pending</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
															<tr class="invoice-list">

																<td>
																	Fine & Dine
																</td>
																<td>
																	Handam BBQ
																</td>
																<td>
																	30% Off On All-You-Can-Eat
																</td>
																<td>
																	07/25/2024   10:00 am
																</td>
																<td>
																	<span class="badge bg-success-transparent">Paid</span>
																</td>
																<td>

																	<button id="alert-confirm" class="btn btn-danger-light btn-icon ms-1 btn-sm invoice-btn"><i class="ri-delete-bin-5-line"></i></button>
																</td>
															</tr>
														</tbody>
													</table>

													<div class="card-footer border-top-0">
														<nav aria-label="Page navigation">
															<ul class="pagination float-end">
																<li class="page-item disabled">
																	<a class="page-link">Previous</a>
																</li>
																<li class="page-item"><a class="page-link" href="javascript:void(0);">1</a></li>
																<li class="page-item active" aria-current="page">
																	<a class="page-link" href="javascript:void(0);">2</a>
																</li>
																<li class="page-item"><a class="page-link" href="javascript:void(0);">3</a></li>
																<li class="page-item">
																	<a class="page-link" href="javascript:void(0);">Next</a>
																</li>
															</ul>
														</nav>
													</div>
                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--End::row-2 -->

            </div>
        </div>
        <!-- End::app-content -->

@endsection
@section('custom-script')

<script>
	document.getElementsByTagName('alert-confirm').onclick = function () {
		Swal.fire({
			title: 'Are you sure?',
			text: "You won't be able to revert this!",
			icon: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Yes, delete it!'
		}).then((result) => {
			if (result.isConfirmed) {
				Swal.fire(
					'Deleted!',
					'Your file has been deleted.',
					'success'
				)
			}
		})
	}
</script>

@endsection