<?php if ( ! defined( 'ABSPATH' ) ) {
exit;} ?>
<!doctype html>

<html lang="en">

<body>
	<div class="elex-multi-vendor-for-woocommerce-wrap elex-multi-vendor-for-woocommerce-wrap-front overflow-hidden d-flex flex-fill">

		<!-- ======================main content============ -->
		<div class="elex-multi-vendor-for-woocommerce-main ps-2 ">
		<div class="d-flex gap-4 my-2 align-items-center elex-multi-vendor-for-woocommerce-side-panel-open-div d-md-none">
				<!-- side panel open button -->
				<button class=" btn  p-1 shadow-none fs-5   bg-white text-primary position-relative " id="elex-multi-vendor-for-woocommerce-side-panel-open-btn"><svg height="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"/></svg></button>
				<div class="fs-5 fw-semi-bold m-0 ">Payment</div>
			</div>
			<div class=" h-100 ">
				<div class="d-flex flex-wrap gap-3 bg-info bg-opacity-10  justify-content-between align-items-center pe-4">
					<ul class="elex-multi-vendor-for-woocommerce-shipping-link d-flex gap-3 nav order-sm-1 order-2">
						<li class="nav-item ">
							<a href="?menu_tab=account_data" class="nav-link ">Accounts & Data</a>
						</li>
						<li class="nav-item">
							<a href="?menu_tab=settlement_history" class="elex-multi-vendor-for-woocommerce-vendor-settlement_history nav-link active">Settlement History</a>
						</li>
					</ul>
					<button class="ms-auto order-sm-2 order-1 btn py- btn-outline-primary bg-white text-primary elex-multi-vendor-for-woocommerce-add-export-open-btn">Export</button>

				</div>

				<!-- ======================main content============ -->
				<div class="elex-multi-vendor-for-woocommerce-main-settlement-history  " style="height:100vh">


					<div class="table-responsive elex-multi-vendor-for-woocommerce-vendor-settlement-data pe-4">

						<table id="elex-multi-vendor-for-woocommerce-vendor-settlement-history-table" data-attr-id ="<?php echo esc_attr( $store_id ); ?>" class="table table-borderless align-middle text-dark elex-multi-vendor-for-woocommerce-table">
							<thead class="table-light rounded-2 ">
								<tr class="">
									<th scope="col">Settlement Date</th>
									<th scope="col">Settlement Mode</th>
									<th scope="col">Transaction Id</th>
									<th scope="col">Settlement Amount(USD)</th>
									<th scope="col">Note</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>




		<!-- ===================popup========== -->
		<!-- Change Status -->
		<div class="bg-dark bg-opacity-25 elex-multi-vendor-for-woocommerce-popup row justify-content-end w-100" id="elex-multi-vendor-for-woocommerce-add-export">
			<div class="col-lg-6 col-md-9 bg-white h-100 ms-auto overflow-auto">
				<div class="py-2 px-4 mt-4 text-center position-relative">
					<div class="fs-5 mb-1 fw-semi-bold">Export</div>
					<button class="btn rounded-circle position-absolute top-0 end-0 elex-multi-vendor-for-woocommerce-add-export-close-btn">
						<i class="fa-solid fa-xmark"></i>
					</button>
				</div>
				<div class="px-md-5 px-2 py-3">
				<form id="elex-multi-vendor-for-woocommerce-vendor-payment-export-form" action="<?php echo esc_url( admin_url( 'admin-ajax.php' ) ); ?>" method="post">
				<input type="hidden" name="action" value="elex_mv_vendor_payment_export"></input>
				<input type="hidden" name="vendor_id" class="elex_mv_payment_vendor_id" value="<?php echo esc_attr( $store_id ); ?>"></input>
				<?php wp_nonce_field( 'elex_mv_vendor_payment_export', 'elex_mv_vendor_payment_export_nonce' ); ?>
					<div class="form-group mb-3">
						<label>Settlement Mode</label>
						<select name="settlement_mode" class="form-select">
							<option value="all">ALL</option>
							<option value="PayPal">PayPal</option>
							<option value="Manual">Manual</option>
						</select>
					</div>

					<div class="form-group mb-3">
						<label>File Format</label>
						<select name="file_format" id="" class="form-select">
							<option value="csv">CSV</option>
						</select>
					</div>
					<div class="d-flex gap-3 mb-3">
						<div class="flex-fill">
							<div class="form-group mb-3">
								<label>From</label>
								<input type="date" name="from_date" class="form-control">
							</div>
						</div>
						<div class="flex-fill">
							<div class="form-group mb-3">
								<label>To</label>
								<input type="date" name="to_date" class="form-control">
							</div>
						</div>
					</div>
					<button class="btn btn-primary elex-vendor-payment-export-btn w-100">Export</button>
				</form>
				</div>
			</div>
		</div>
	</div>
</body>
</html>
