@extends('adminlte::page')
@section('css')
<style>
    .dropbtn {
        background-color: #4CAF50;
        color: white;
        padding: 5px 20px;
        font-size: 14px;
        border: none;
        cursor: pointer;
    }

    .dropdown {
        position: relative;
        display: inline-block;
    }

    .dropdown-content {
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        z-index: 1;
    }

    .dropdown-content a {
        color: black;
        padding: 10px 16px;
        text-decoration: none;
        display: block;
    }

    .dropdown-content a:hover {
        background-color: #f1f1f1
    }

    .dropdown:hover .dropdown-content {
        display: block;
        z-index: 99999;
    }

    .dropdown:hover .dropbtn {
        background-color: #3e8e41;
    }
</style>
@stop
@section('content')
@include('administrator.deposit.form-cancel')
@include('administrator.deposit.form-add-deposit')
@include('administrator.external.deposit.form-aprov-to-contact')
@include('administrator.deposit.form-delete-deposit')
@include('administrator.deposit.form-edit-deposit')
@include('administrator.deposit.form-delete-approve-deposit')
@include('administrator.deposit.form-reject-edit-deposit')
@include('administrator.deposit.form-reject-delete-deposit')
@include('administrator.deposit.form-approve-cancel-deposit')
@include('administrator.deposit.form-reject-cancel-deposit')
@include('administrator.deposit.form-approve-add-deposit')
@include('administrator.deposit.form-reject-add-deposit')
<?php Fun::lang() ?>
<div class="title-page">
    <div class="page-bar">
        <ul class="page-breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Dashboard</a></li>
            <li><a href="#">Manage Project Owner</a></li>
            <li><a href="#">Deposit</a></li>
        </ul>
    </div>
</div>
<div class="page">
    <div class="top-content">
        <div class="row">
            <div class="col-sm-12 col-xs-12">
                <div class="title-page">
                    <div class="pull-left">
                        <h3>Deposit</h3>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12 col-xs-12">
            <div class="box-body table-responsive">
                <table id="datatable_item_deposit" class="table table-striped table-bordered table-hover nowrap">
                    <thead>
                        <tr>

                            <th>No</th>
                            <th>Sale Date</th>
                            <th>Name</th>
                            <th>Phone</th>
                            <th>Project Name</th>
                            <th>Category</th>
                            <th>Item Code</th>
                            <th>Contract Date</th>
                            <th>Sale Price</th>
                            <th>Deposit</th>
                            <th>Total Item</th>
                            <th>Agent</th>
                            <th>Team</th>
                            <th>Action</th>
                            <th>Invoice</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection
@section('js')

<script type="text/javascript">
    $(document).ready(function() {
        $('.main-spinner').show();
        $('#datatable_item_deposit').DataTable({
            "serverSide": true,
            ajax: "{{ route('datatable.get_external_deposit') }}",
            columns: [{
                    data: 'DT_RowIndex'
                },
                {
                    data: 'sale_date'
                },
                {
                    data: 'client_fullname'
                },
                {
                    data: 'client_phone1'
                },
                {
                    data: 'project_name'
                },
                {
                    data: 'category_name',
                    width: '5px'
                },
                {
                    data: 'item_name'
                },
                {
                    data: 'contract_date'
                },
                {
                    data: 'sale_price'
                },
                {
                    data: 'sale_receive'
                },
                {
                    data: 'total_item'
                },
                {
                    data: 'agency_name'
                },
                {
                    data: 'team_name'
                },
                {
                    data: 'action',
                    width: '5px'
                },
                {
                    data: 'invoice'
                },
            ],

            "initComplete": function(settings, json) {
                $('.main-spinner').hide();
            }
        });
    });

    function cancel_deposit(obj) {
        var id = obj;
        $("#ps_id").val(id);
    }

    function delete_deposit(obj) {
        var id = obj;
        $("#s_id").val(id);
    }

    function approvedPOS(obj) {
        var id = obj;
        $("#sa_id").val(id);
    }

    function approvedCanPOS(obj) {
        var id = obj;
        $("#sid_can").val(id);
        var route = "{{route('request-cancel-deposit',':id')}}";
        route = route.replace(':id',id);
        $.ajax({
            type:"GET",
            url:route,
            data:{
                '_token':"{{csrf_token()}}"
            },
            success:function(response){
                var data = response.data;
                $('#app_des').val('').val(data.deposit_remark);
            }
        });
    }

    function rejectCanPOS(obj) {
        var id = obj;
        $("#sid_rej").val(id);
        var route = "{{route('request-cancel-deposit',':id')}}";
        route = route.replace(':id',id);
        $.ajax({
            type:"GET",
            url:route,
            data:{
                '_token':"{{csrf_token()}}"
            },
            success:function(response){
                var data = response.data;
                $('#reject_des').val('').val(data.deposit_remark);
            }
        });
    }

    function rejectPOS(obj) {
        var id = obj;
        $("#sale1_id").val(id);
    }

    function approvedDelPOS(id) {
        
        $("#sal_id").val(id);
    }

    function rejectDelPOS(id) {
        $("#saledel_id").val(id);
    }

    function approved(obj) {
        $("#app_id").val(obj);
    }

    function deposit(obj) {
        var id = obj;
        $.ajax({
            url: "/realty/get-deposit/" + id,
            type: "get",
            success: function(data) {
                var d = $.parseJSON(data);
                $("#sale_id").val(d.id);
                $("#deposit_amount").val(d.sale_receive);

            }
        });
    }

    function approvedAddDe(obj) {
        var id = obj;
        $.ajax({
            url: "/realty/approve-deposit/" + id,
            type: "get",
            success: function(data) {
                var d = $.parseJSON(data);
                $("#sale_id-app").val(d.id);
                $("#deposit_amount-app").val(d.sale_receive);
                $("#payamount-app").val(d.app_payamount);
                $("#date_contract-app").val(d.app_date_contract);

            }
        });
    }

    function rejectAddDe(id) {
        $("#saleadd_id").val(id);
    }

    function save_deposit(obj) {
        $(obj).attr("disabled", "disabled");
        var sale_id = $('#sale_id').val();
        var date = $('#date').val();
        var date_contract = $('#date_contract').val();
        var deposit_amount = $('#deposit_amount').val();
        var payamount = $('#payamount').val();

        if (!payamount) {
            $("#_msg_paymentPopup").html('Deposit amount is empty, Please enter your deposit amount!');
            $("#_div_paymentPopup").attr("style", "display:block");
        } else {
            $.ajax({
                type: 'POST',
                url: "{{ route('submit_deposit_data') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    "sale_id": sale_id,
                    "date": date,
                    "date_contract": date_contract,
                    "deposit_amount": deposit_amount,
                    "payamount": payamount

                },
                success: function(data) {
                    var d = $.parseJSON(data);
                    if (d.message == "success") {
                        window.location.reload();
                        $('#done').show();
                    }
                }
            });
        }
    }

    function edit_deposit(id) {
        alert(id);
    }

    function save_approve_deposit(obj) {
        $(obj).attr("disabled", "disabled");
        var sale_id         = $('#sale_id-app').val();
        var date            = $('#date').val();
        var date_contract   = $('#date_contract-app').val();
        var deposit_amount  = $('#deposit_amount-app').val();
        var payamount       = $('#payamount-app').val();

        if (!payamount) {
            $("#_msg_paymentPopup").html('Deposit amount is empty, Please enter your deposit amount!');
            $("#_div_paymentPopup").attr("style", "display:block");
        } else {
            $.ajax({
                type: 'POST',
                url: "{{ route('approve_submit_deposit_data') }}",
                data: {
                    "_token": "{{ csrf_token() }}",
                    "sale_id": sale_id,
                    "date": date,
                    "date_contract": date_contract,
                    "deposit_amount": deposit_amount,
                    "payamount": payamount
                },
                success: function(data) {
                    var d = $.parseJSON(data);
                    if (d.message == "success") {
                        window.location.reload();
                        $('#done').show();
                    }
                }
            });
        }
    }
</script>

@endsection