@extends('layouts.web')

@section('css')
<link href="{{ asset('css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/bootstrap-timepicker.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/sweetalert2.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/bootstrap-datepicker.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/icheck-bootstrap.min.css') }}" rel="stylesheet" />
<link href="{{ asset('css/bootstrap-select.min.css') }}" rel="stylesheet" />
@endsection

@section('content')
<div class="container-fluid pt-3">
    @can('isSuperadminOrAdmin')
    <div class="row">
        <div class="col-12">
            <a href="#withdrawModal" data-toggle="modal" data-target="#withdrawModal" class="btn btn-success rounded"><i class="fas fa-plus-circle"></i> เพิ่มรายการเบิกเงิน</a>
            <!-- Modal -->
            <div class="modal fade" id="withdrawModal" tabindex="-1" aria-labelledby="withdrawModalLabel" aria-hidden="true" data-backdrop="static" >
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title-card" id="withdrawModalLabel">เพิ่มรายการเบิกเงิน</h5>
                        </div>
                        <form action="{{ route('withdraw.withdraw') }}"
                            id="withdrawFrm"
                            novalidate class="{{ ($errors->any()) ? 'was-validated' : 'needs-validation' }}"
                            method="post">
                            @csrf
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-12">
                                    <div class="form-group">
                                        <label for="branch">สาขาที่ทำรายการ <span class="text-red">*</span></label>
                                        <select id="branch" name="branch" class="selectpicker show-menu-arrow form-control" title="--เลือก--" required>
                                            @foreach ($branchs as $indexKey => $branch)
                                            <option value="{{ $branch->id }}" @if(auth()->user()->branch_id == $branch->id) selected @endif>{{ $branch->name }}</option>
                                            @endforeach
                                        </select>
                                        @error('branch')
                                        <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-12">
                                    <div class="form-group">
                                        <label for="wtype">รายการเบิก <span class="text-red">*</span></label>
                                        <select id="wtype" name="wtype" class="selectpicker show-menu-arrow form-control" title="--เลือก--" required>
                                            <option value="ค่าสอน">ค่าสอน</option>
                                            <option value="ค่าน้ำมัน">ค่าน้ำมัน</option>
                                            <option value="อื่นๆ">อื่นๆ</option>
                                        </select>
                                        @error('wtype')
                                        <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-2" id="other" style="display: none;">
                                <!-- เบิกอื่นๆ -->
                                <div class="col-12" id="wnameDiv" style="display: none;">
                                    <div class="form-group">
                                        <label for="wname" class="modal-label-card float-left mb-2">รายละเอียด <span class="text-red">*</span></label>
                                        <input type="text" class="form-control" id="wname" name="wname" placeholder="รายการเบิก" required>
                                        @error('wname')
                                    <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <!-- เบิกค่าสอน -->
                                <div class="col-12" id="teachDateDiv" style="display: none;">
                                    <div class="row">
                                        <div class="col-5">
                                            <div class="form-group">
                                                <label for="teachDate">เดือนที่สอน <span class="text-red">*</span></label>
                                                <div class="input-group mb-3">
                                                    <input type="text" class="form-control" id="teachDate" name="teachDate" placeholder="เดือนที่สอน" autocomplete="off"  required>
                                                    <div class="input-group-append">
                                                        <span class="input-group-text"><i class="far fa-calendar-alt"></i></span>
                                                    </div>
                                                </div>
                                                @error('teachDate')
                                                <div class="text-danger">{{  $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-7">
                                            <div class="form-group">
                                                <label for="teacher" class="modal-label-card float-left mb-2">ผู้สอน <span class="text-red">*</span></label>
                                                <select id="teacher" name="teacher" class="selectpicker show-menu-arrow form-control" title="--เลือก--" required>
                                                </select>
                                                @error('teacher')
                                                <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- เบิกค่าน้ำมัน -->
                                <div class="col-12" id="oilDiv" style="display: none;">
                                    <div class="row">
                                        <div class="col-12">
                                            <div class="form-group">
                                                <label for="teacherOil" class="modal-label-card float-left mb-2">ผู้เบิก <span class="text-red">*</span></label>
                                                <select id="teacherOil" name="teacherOil" class="selectpicker show-menu-arrow form-control" title="--เลือก--" required>
                                                    @foreach ($teachers as $indexKey => $teacher)
                                                    <option value="{{ $teacher->id }}">{{ $teacher->title.$teacher->firstname. " " .$teacher->lastname }}</option>
                                                    @endforeach
                                                </select>
                                                @error('teacher')
                                                <div class="text-danger">{{ $message }}</div>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-2">
                                <div class="col-6">
                                    <div class="form-group">
                                        <label>รูปแบบการจ่ายเงิน <span class="text-red">*</span></label>
                                        <div>
                                            <div class="icheck-nephritis icheck-inline">
                                                <input class="purpose" type="radio" id="cash" name="method" value="เงินสด" required>
                                                <label for="cash">เงินสด</label>
                                            </div>
                                            <div class="icheck-nephritis icheck-inline">
                                                <input class="purpose" type="radio" id="transfer" name="method" value="โอน">
                                                <label for="transfer">โอนผ่านบัญชี</label>
                                            </div>
                                        </div>
                                        @error('method')
                                        <div class="text-danger">{{ $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group">
                                        <label for="amount" class="modal-label-card float-left mb-2">จำนวนเงิน <span class="text-red">*</span></label>
                                        <input type="text" class="form-control" id="amount" name="amount" placeholder="จำนวนเงิน (บาท)" required>
                                        @error('amount')
                                    <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row mt-2">
                                <div class="col-6">
                                    <div class="form-group">
                                        <label for="payDate">วันที่เบิก <span class="text-red">*</span></label>
                                        <div class="input-group mb-3">
                                            <input type="text" class="form-control" id="payDate" name="payDate" placeholder="วันที่เบิก" autocomplete="off"  required>
                                            <div class="input-group-append">
                                                <span class="input-group-text"><i class="far fa-calendar-alt"></i></span>
                                            </div>
                                        </div>
                                        @error('payDate')
                                        <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group">
                                        <label for="payTime" class="modal-label-card float-left mb-2">เวลาที่เบิก <span class="text-red">*</span></label>
                                        <div class="input-group mb-3">
                                            <input type="text" class="form-control" id="payTime" name="payTime" placeholder="เวลาที่เบิก" autocomplete="off" required>
                                            <div class="input-group-append">
                                                <span class="input-group-text"><i class="far fa-clock"></i></span>
                                            </div>
                                        </div>
                                        @error('payTime')
                                        <div class="text-danger">{{  $message }}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer mt-2">
                            <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">ปิด</button>
                            <button type="submit" id="payBtn" class="btn btn-success">ตกลง</button>
                        </div>
                        </form>
                    </div>
                </div>
            </div>
            <!-- End modal -->
        </div>
    </div>
    <div class="row mt-3">
        <div class="col-4">
            <form action="{{ route('withdraw.submit') }}"
            novalidate class="{{ ($errors->any()) ? 'was-validated' : 'needs-validation' }}"
            method="post"
            >
            @csrf
                <div class="form-group">
                    <label for="date">รายการเบิก ประจำเดือน <span class="text-red">*</span></label>
                    <div class="input-group mb-3">
                        <input type="text" class="form-control datepiacker" id="date" name="date" placeholder="เดือน/ปี" autocomplete="off" value="{{$date}}" required>
                        <div class="input-group-append">
                            <span class="input-group-text"><i class="far fa-calendar-alt"></i></span>
                        </div>
                        <button type="submit" class="btn btn-outline-success show-outline-btn ml-2" value="search">แสดง</button>
                    </div>
                    @error('date')
                    <div class="text-danger">{{ $message }}</div>
                    @enderror
                </div>
            </form>
        </div>
    </div>
    @endcan
    <div class="row mt-2">
        <div class="col">
            <div class="card card-outline card-success">
                <div class="card-body">
                    <table class="table" id="teacher-table">
                        <thead>
                          <tr>
                            <th scope="col" width="5%">ลำดับ</th>
                            <th scope="col" width="12%">วัน เวลา</th>
                            <th scope="col" width="25%">รายการ</th>
                            <th scope="col" width="20%">ผู้เบิก</th>
                            <th scope="col" width="8%">จำนวน</th>
                            <th scope="col" width="10%">ช่องทาง</th>
                            <th scope="col" width="10%">สาขาที่เบิก</th>
                            @can('isSuperadminOrAdmin')
                            <th width="10%"></th>
                            @endcan
                          </tr>
                        </thead>
                        <tbody>
                            @foreach ($withdraws as $indexKey => $withdraw)
                            <tr class="hand-hover">
                                <td>{{ $indexKey+1 }}</td>
                                <td>{{ $withdraw->date . " ". $withdraw->time }}</td>
                                <td>{{ $withdraw->wtitle }}</td>
                                <td>{{ $withdraw->ttitle ." ". $withdraw->firstname . " " .$withdraw->lastname }}</td>
                                <td>{{ $withdraw->amount }}</td>
                                <td>{{ $withdraw->method }}</td>
                                <td>{{ $withdraw->name }}</td>
                                @can('isSuperadminOrAdmin')
                                <td class="align-middle text-center">
                                    <form id="del-frm{{ $indexKey }}" class="d-inline"
                                        method="POST"
                                        action="{{ route('withdraw.destroy', $withdraw->id ) }}"
                                        onsubmit="confirmalert(event, {{ $indexKey }}, 'รายการเบิก')"
                                    >
                                    @csrf
                                    @method('DELETE')
                                        <button type="submit" class="btn del-btn btn-sm ml-2" data-toggle="tooltip" data-placement="top" title="ลบข้อมูล">
                                            <i class="far fa-trash-alt"></i>
                                        </button>
                                    </form>
                                </td>
                                @endcan
                            </tr>
                            @endforeach
                        </tbody>
                      </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('footerscript')
<script src="{{ asset('js/sweetalert2.min.js') }}"></script>
<script src="{{ asset('js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-datepicker.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-datepicker.th.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-select.min.js') }}"></script>
<script src="{{ asset('js/bootstrap-timepicker.min.js') }}"></script>
<script src="{{ asset('js/custom.js') }}"></script>
<script src="{{ asset('js/withdraw.js') }}"></script>
@if (session('feedback'))
<script>
    Swal.fire({
                text: '{{ session('feedback') }}',
                icon: 'success',
                confirmButtonText: 'ตกลง',
                confirmButtonColor: '#62966C'
    })
</script>
@endif
@endsection

