@extends('layouts.contentLayoutMaster')
{{-- title --}}
@section('title','Dial History List')

{{-- vendor style --}}
@section('vendor-styles')
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/tables/datatable/datatables.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/charts/apexcharts.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/pickers/daterange/daterangepicker.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/pickers/pickadate/pickadate.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/forms/select/select2.min.css')}}">
@endsection
@section('content')
<section id="multiple-column-form">
  <div class="row match-height">
    <div class="col-12">
      <div class="card">
        <div class="card-header">
          <h4 class="card-title">選擇條件</h4>
        </div>
        <div class="card-content">
          <div class="card-body">
            <form class="form" method="GET">
              <div class="form-body">
                <div class="row">
                  <div class="col-md-3 col-12">
                    <div class="form-label-group">
					  <span>日期</span>
					  <fieldset class="form-group position-relative has-icon-left">
						<input type="text" id="select_daterange" class="form-control openRight" name="date">
						<div class="form-control-position">
							<i class='bx bx-calendar-check'></i>
						</div>
					  </fieldset>
                    </div>
                  </div>
				  <div class="col-md-2 col-12">
					<div class="form-group">
					  <span>總代理</span>
					  <select class="select2 form-control" id="generalagent" name="generalagent">
					    <option value="">請選擇</option>
						@foreach($gaObj as $ga)
						<option value="{{ $ga->agentId }}">{{ $ga->account }}</option>
						@endforeach
					  </select>
					</div>
				  </div>
				  <div class="col-md-2 col-12">
					<div class="form-group">
					  <span>代理</span>
					  <select class="select2 form-control" id="agent" name="agent">
					    <option value="">請選擇</option>
						@foreach($aObj as $a)
						<option value="{{ $a->generalAgentId }}">{{ $a->account }}</option>
						@endforeach
					  </select>
					</div>
				  </div>
				  <div class="col-md-2 col-12">
					<div class="form-group">
					  <span>會員</span>
					  <select class="select2 form-control" id="member" name="member">
					    <option value="">請選擇</option>
						@foreach($mObj as $m)
						<option value="{{ $m->memberId }}">{{ $m->account }}</option>
						@endforeach
					  </select>
					</div>
				  </div>
                  <div class="col-3 d-flex justify-content-end">
                    <button id="btnSubmit" type="button" class="btn btn-primary mr-1 mb-1">查詢</button>
                  </div>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
<section id="table-chechbox">
  <div class="card">
    <div class="table-responsive">
      <table id="History-List" class="table table-transparent">
      </table>
    </div>
  </div>
</section>
@endsection

{{-- vendor scripts --}}
@section('vendor-scripts')
<script src="{{asset('vendors/js/tables/datatable/datatables.min.js')}}"></script>
<script src="{{asset('vendors/js/tables/datatable/datatables.checkboxes.min.js')}}"></script>
<script src="{{asset('vendors/js/charts/apexcharts.min.js')}}"></script>
<script src="{{asset('vendors/js/pickers/daterange/moment.min.js')}}"></script>
<script src="{{asset('vendors/js/pickers/daterange/daterangepicker.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/picker.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/picker.date.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/picker.time.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/legacy.js')}}"></script>
<script src="{{asset('vendors/js/forms/select/select2.full.min.js')}}"></script>
@endsection

{{-- page scripts --}}
@section('page-scripts')
{{-- <script src="{{asset('js/scripts/pages/table-extended.js')}}"></script> --}}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9.8.2/dist/sweetalert2.all.min.js"></script>
<script src="{{asset('js/scripts/pickers/dateTime/pick-a-datetime.js')}}"></script>  
<script src="{{asset('js/scripts/forms/select/form-select2.js')}}"></script>
<script>
$( document ).ready(function() {
	$("#btnSubmit").click(function(){
        search();
    });
	search();
	
});
	function search(){
		$.ajax({
		  method: "GET",
		  url:"{{ route('ajax.dhList')}}",
		  dataType:"json",
		  data:{
			  generalagentId:$('#generalagent').val(),
			  agentId:$('#agent').val(),
			  mId:$('#member').val(),
			  startDate:$('#select_daterange').val().split("-")[0],
			  endDate:$('#select_daterange').val().split("-")[1]
		  }
		})
		.done(function( msg ) {
			search_data=msg.result;
			console.log(search_data);
			DataTableNet();
		});
	}
	function DataTableNet(){
		console.log(search_data);
	$('#History-List').DataTable({
		data: search_data,
		"searching": false,
		"lengthChange": false,
		"paging": false,
		"bInfo": false,
		destroy:true,
		columns: [
				{
					title: "交易編號",
					data: "rowid"
				},
				{
					title: "交易額度",
					data: "changeQuota"
				},
				{
					title: "轉出至總代理",
					data: "fromGeneralAgentId"
				},
				{
					title: "轉出至代理",
					data: "fromAgentId"
				},
				{
					title: "轉出至會員",
					data: "fromMemberId"
				},
				{
					title: "轉至總代理",
					data: "toGeneralAgentId"
				},
				{
					title: "轉至代理",
					data: "toAgentId"
				},
				{
					title: "轉至成員",
					data: "toMemberId"
				},
				{
					title: "交易時間",
					data: "created_at"
				}
			],
			"order": [[ 0, "desc" ]]
		});
		var table = $('#History-List').DataTable();
		$('#History-List tbody').on( 'click', 'a.history-delete', function () {
			Swal.fire({
			  title: "確認要刪除?",
			  text: "您將無法復原!",
			  icon: 'warning',
			  showCancelButton: true,
			  confirmButtonColor: '#3085d6',
			  cancelButtonColor: '#d33',
			  cancelButtonText: "取消",
			  confirmButtonText: "刪除!"
			}).then((result) => {
			  if (result.value) {
				var customer_data = table.row( $(this).parents('tr') ).data();
				console.log(customer_data);
				$.ajax({
					method: 'GET',
					url: "{{ route('ajax.hDel')}}",
					dataType: 'json',
					data: {
						id: customer_data['id']
					}
				}).done(function(msg){
					console.log(msg)
					table.ajax.reload();
				});
				Swal.fire({
				  title: "刪除!",
				  text: "確認刪除此筆資料.",
				  confirmButtonText: "完成",
				  type: "success"
				})
			  }
			});
		});
	}
</script>
@endsection