@extends('layouts.default1400-page', ['title' => 'کارت به کارت'])

@section('meta')
<link rel="stylesheet" href="/persian-datepicker/persian-datepicker.css">
@stop

@section('content')

<div class="lg:flex">

	<div class="lg:w-1/2 text-sm text-justify p-4 ">
		{!! $setting->payment_card !!}

	</div>

	<div class="lg:w-1/2 border rounded-xl text-sm">

		<form action="{{ route('user.payment.card') }}" method="post" onsubmit="return check()">
			@csrf
			<input type="hidden" name="cid" value="{{ $cid }}" />

			<div class="flex">
				<div class="flex w-full h-12 items-center bg-blue-100 justify-around rounded-t-xl ">
					<div>
						قابل پرداخت : <strong class="text-blue-500">{{ $payable }}</strong> <span>تومان</span>
					</div>

					<div>
						شماره فاکتور :
						<strong class="text-blue-500">{{ $invoice_number }}</strong>
					</div>
				</div>
			</div>

			<div class="flex items-center mt-2">
				<label class="mx-2 w-36">مبلغ واریز شده :</label>
				<input type="number" placeholder="به تومان" id="card_price" name="card_price"
					class="input input-base-content input-bordered" autocomplete="off">
				<span class=" error" id="span_price"></span>
			</div>

			<div class="flex items-center mt-2">
				<label class="mx-2 w-36">شماره کارت / حساب :</label>
				<input type="number" placeholder="شماره کارت / حساب " name="card_number" id="card_number"
					class="input input-base-content input-bordered" autocomplete="off">
				<span class=" error" id="span_cardnumber"></span>
			</div>

			<div class="flex items-center mt-2">
				<label class="mx-2 w-36">شماره پیگیری :</label>
				<input type="number" placeholder="شماره پیگیری " id="card_code" name="card_code"
					class="input input-base-content input-bordered" autocomplete="off">
				<span class=" error" id="span_code"></span>
			</div>

			<div class="flex items-center mt-2">
				<label class="mx-2 w-36">تاریخ:</label>
				<input type="text" id="date" name="date" class="input input-base-content input-bordered"
					autocomplete="off">
				<span class="error" id="span_date"></span>

			</div>

			<div class="flex items-center mt-2">
				<label class="mx-2 w-36">ساعت :</label>
				<input type="time" id="time" name="time" class="input input-base-content input-bordered"
					autocomplete="off">
				<span class=" error" id="span_time"></span>
			</div>

			<span class="flex justify-end m-4">
				<button type="submit" class="btn btn-primary mx-2">
					ثبت اطلاعات پرداخت
				</button>
				<a href="/payment/type/{{ $cid }}" class="btn" title="تغییر روش پرداخت به روش پرداخت آنلاین">پرداخت
					آنلاین</a>


			</span>

		</form>

	</div>

</div>
@stop

@section('scripts')
<script src="/js/payment_card.js?v=0.3" type="text/javascript"></script>
<script src="/persian-datepicker/persian-datepicker.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function() { 
		$('#date').datepicker({ 
				dateFormat: 'yy/mm/dd',
			}
		);
	});

</script>
@stop