@extends('theme::layouts.app')


@section('content')
	
	<h2 class="dashboard-title">{{ __("Client Subscription Record") }}</h2>
	<form class="search-fields flex" action="#" id="searchFrm">
		<div class="search-field d-flex align-items-center">
			<label class="label-field mr-2" style="white-space: nowrap;">
				{{ __("Company") }} 
			</label>
			<input type="text" class="w-100" id="search_company_name">
		</div>
		<div class="search-field d-flex align-items-center">
			<label class="label-field mr-2">
				{{ __("Service") }}
			</label>
			<select class="w-100" id="search_service_type">
				<option value="" selected>{{ __("All") }}</option>
				<option value="bookkeeping">{{ __("Bookkeeping") }}</option>
				<option value="company_secretary">{{ __("Company Secretary") }}</option>
				<option value="incorporation">{{ __("Incorporation") }}</option>
			</select>
		</div>
		<div class="search-field d-flex align-items-center">
			<label class="label-field mr-2">
				{{ __("Package") }}
			</label>
			<select class="w-100" id="search_subscription_id">
				<option value="" selected>{{ __("All") }}</option>
			</select>
		</div>
		<div class="search-field">
			<button type="submit" class="btn primary-button">{{ __("Search") }}</button>
		</div>
	</form>

	<div class="tabs-navigation blue-tabs">
		<ul>
			<li class="active"><a href="#" class="js-tab-navigate" data-id="#in-queue"><img class="dashboard-detail-image max-25" src="{{ asset('themes/tailwind/images/receipt-check-black.svg') }}"> {{ __("Active Subscription") }} <span class="tab-number" id="totalActive" style="display: none;"></span></a></li>
			<li><a href="#" class="js-tab-navigate" data-id="#completed"><img class="dashboard-detail-image max-25" src="{{ asset('themes/tailwind/images/receipt-cross-black.svg') }}"> {{ __("Expiring Subscription") }} <span class="tab-number" id="totalExpired" style="display: none;"></span></a></li>
		</ul>
	</div>

	<div class="tabs-content">
		<div class="tabs-content-item white-bg no-padd no-box-shadow" id="in-queue">
			<table id="activeSubscriptionTable" class="" data-ajax-url="{{ route("cms.subscriptions.table", ['status' => 'active']) }}" data-empty-text="{{ __("No data available in table") }}">
				<thead>
					<tr>
						<td>{{ __("Company") }}</td>
						<td>{{ __("Date") }}</td>
						<td>{{ __("Service") }}</td>
						<td>{{ __("Subscruption Period") }}</td>
						<td>{{ __("Package") }}</td>
						<td>{{ __("Status") }}</td>
						<td>{{ __("Invoice") }}</td>
					</tr>
				</thead>
				{{-- <tbody>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="success item-list-note">Active</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="success item-list-note">Active</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="success item-list-note">Active</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="success item-list-note">Active</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
				</tbody> --}}
			</table>

			<div class="text-center">
				<div class="flex button-group">
					<a href="{{ route('cms.subscriptions.management') }}" class="btn primary-button btn-normal">{{ __("Subscription Management") }}</a>
				</div>
			</div>
		</div>
		<div class="tabs-content-item white-bg no-padd no-box-shadow" id="completed" style="display: none;">
			<table id="expiredSubscriptionTable" class="" data-ajax-url="{{ route("cms.subscriptions.table", ['status' => 'expired']) }}" data-empty-text="{{ __("No data available in table") }}">
				<thead>
					<tr>
						<td>{{ __("Company") }}</td>
						<td>{{ __("Date") }}</td>
						<td>{{ __("Service") }}</td>
						<td>{{ __("Subscruption Period") }}</td>
						<td>{{ __("Package") }}</td>
						<td>{{ __("Status") }}</td>
						<td>{{ __("Invoice") }}</td>
					</tr>
				</thead>
				{{-- <tbody>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="failed item-list-note">Expired</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="failed item-list-note">Expired</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="failed item-list-note">Expired</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
					<tr>
						<td>Green Company Ltd.</td>
						<td>20221208</td>
						<td>Company Secretary</td>
						<td>2022.12.08-2023.01.08</td>
						<td>Company Secretary service - Monthly</td>
						<td><span class="failed item-list-note">Expired</span></td>
						<td><a href=""><img class="max-25" src="{{ asset('themes/tailwind/images/download.svg') }}"></a></td>
					</tr>
				</tbody> --}}
			</table>

			<div class="text-center">
				<div class="flex button-group">
					<a href="{{ route('cms.subscriptions.management') }}" class="btn primary-button btn-normal">{{ __("Subscription Management") }}</a>
				</div>
			</div>
		</div>
	</div>

@endsection

@section('script')
	<script type="text/javascript" src="{{ asset('themes/' . $theme->folder . '/js/cms/subscriptions/index.js') }}"></script>
@endsection