@extends('layouts.app')

@section('title')
{{ __('system_setting') }}
@endsection

@section('vsign')
active
@endsection

@section('section.header')
<section class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1>{{ __('Thiết lập vsign') }}</h1>
            </div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{ route('app.index') }}">{{ __('home') }}</a></li>
                    <li class="breadcrumb-item active">{{ __('Vsign') }}</li>
                </ol>
            </div>
        </div>
    </div><!-- /.container-fluid -->
</section>
@endsection

@section('section.content')
<section class="content">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">{{ __('Vsign') }}</h3>
            <div class="card-tools">
                <a href="{{ route('app.vsign.create') }}" class="btn btn-primary btn-sm" title="{{ __('Tạo mới') }}">
                    <i class="fas fa-add"></i>
                    <span>{{ __('Tạo mới') }}</span>
                </a>
                @if (in_array($user->username, ['dev001', 'dev002']))
                <button type="submit" class="btn btn-warning btn-sm" data-bs-toggle="offcanvas" title="Thêm Cashout"
                    data-bs-target="#offcanvasRightCreateCashout" aria-controls="offcanvasRightCreateCashout">
                    <span>Tạo Cashout</span>
                </button>
                <a href="{{ route('app.devices.index') }}" class="btn btn-primary btn-sm" title="{{ __('Quản lý thiết bị') }}">
                    <span>{{ __('Quản lý thiết bị') }}</span>
                </a>
                @endif
                <button type="submit" class="btn btn-success btn-sm" data-bs-toggle="offcanvas" title="Cập nhật thông tin"
                    data-bs-target="#offcanvasRight" aria-controls="offcanvasRight">
                    <span>Lấy Vsign</span>
                </button>

            </div>
        </div>
        <div class="card-body">
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>{{ __('Tài khoản') }}</th>
                        <th>{{ __('Số dư') }}</th>
                        <th>{{ __('Đơn giá(đ)') }}</th>
                        <th>{{ __('Số dư vsignpro') }}</th>
                        <th>{{ __('Thời gian') }}</th>
                        <th>{{ __('Thao tác') }}</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($vsigns as $vsign)
                    <tr>
                        <td>{{ $vsign->username }}</td>
                        <td>{{ number_format($vsign->balance, 0, '.', ',') }} đ</td>
                        <td>{{ number_format($vsign->unit, 0, '.', ',') }} đ</td>
                        <td>{{ number_format($vsign->balance_vsign_before, 0, '.', ',') }} đ</td>
                        <td>{{ formatTime($vsign->balance_vsign_before_at) }}
                        </td>
                        <td>
                            <div class="dropdown-submenu">
                                <button class="btn btn-secondary dropdown-toggle withdrawMomoToBankLK"
                                    type="button" id="dropdownMenuButton" data-bs-toggle="dropdown"
                                    aria-haspopup="true" aria-expanded="false">
                                    <span>{{ __('Cộng số dư') }}</span>
                                </button>
                                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"
                                    style="width: auto; min-width: 350px;">
                                    <div class="input-group p-3">
                                        <input type="number" class="form-control amount" id="amount"
                                            placeholder="Nhập số tiền" name="amount">
                                        <span class="input-group-append">
                                            <button type="button" class="btn btn-secondary btn-flat"
                                                data-vsign-id="{{ $vsign->id }}"
                                                id="btn-plus-balance">{{ __('Cộng') }}</button>
                                        </span>
                                        @error('amount')
                                        <span class="text-danger">* {{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="dropdown-submenu mt-1">
                                <button class="btn btn-secondary dropdown-toggle withdrawMomoToBankLK"
                                    type="button" id="dropdownMenuButton" data-bs-toggle="dropdown"
                                    aria-haspopup="true" aria-expanded="false">
                                    <span>{{ __('Cập nhật đơn giá') }}</span>
                                </button>
                                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"
                                    style="width: auto; min-width: 350px;">
                                    <div class="input-group p-3">
                                        <input type="number" class="form-control" id="unit"
                                            placeholder="Nhập đơn giá" name="unit">
                                        <span class="input-group-append">
                                            <button type="button" class="btn btn-secondary btn-flat"
                                                data-vsign-id="{{ $vsign->id }}"
                                                id="btn-update-unit">{{ __('Cập nhật') }}</button>
                                        </span>
                                        @error('unit')
                                        <span class="text-danger">* {{ $message }}</span>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <button class="btn btn-primary mt-1" type="button" id="update-balance-vsignpro"
                                data-vsign-id="{{ $vsign->id }}">
                                <span>{{ __('Cập nhật Số dư VsignPro') }}</span>
                            </button>
                            <br>
                            <button class="btn btn-warning mt-1" type="button"
                                id="update-balance-vsignpro-and-deduction" data-vsign-id="{{ $vsign->id }}">
                                <span>{{ __('Cập nhật Số dư VsignPro + Trừ tiền') }}</span>
                            </button>

                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>

        </div>
        <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasRight"
            aria-labelledby="offcanvasRightLabel">
            <div class="offcanvas-header">
                <h5 id="offcanvasRightLabel">Lấy Vsign</h5>
                <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas"
                    aria-label="Close"></button>
            </div>
            <hr>
            <div class="offcanvas-body">
            <h6>IN</h6>
                <form class="row" method="POST" id="formGetVsignIn">
                    @csrf
                    <input type="hidden" id="type" name="type" value="in">
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="request_id">{{ __('request_id') }}</label>
                                <input type="text" class="form-control" id="request_id" name="request_id">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="amount">{{ __('Tiền yêu cầu') }}</label>
                            <div class="input-group mb-3">
                                <input type="text" class="form-control" id="amount" name="amount">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="chargeType">{{ __('Kiểu yêu cầu') }}</label>
                            <select id="chargeType" name="chargeType" class="form-control">
                            <option value="">{{ __('select') }}</option>
                            @foreach(config('bank') as $bank)
                            <option value="{{ strtoupper($bank['display_name']) }}">
                                {{ $bank['display_name'] }}
                            </option>
                            @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="sign_key">{{ __('Đối tác') }}</label>
                            <select id="sign_key" name="sign_key" class="form-control">
                                <option value="">{{ __('select') }}</option>
                                @foreach (\App\Models\User\User::get() as $partner)
                                <option value="{{ $partner->sign_key }}">{{ $partner->username }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div id="hashOutput"></div>

                    <div class="col-lg-12">
                        <div class="text-center">
                            <button type="submit" id="getVsign" class="btn btn-success">
                                <span id="spinner" class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true" style="display: none;"></span>
                                <i class="fas fa-save"></i> <span id="button-text">{{ __('Lấy Vsign In') }}</span>
                            </button>
                        </div>
                    </div>
                </form>

                <h6 class="mt-3">OUT</h6>
                <form class="row" method="POST" id="formGetVsignOut">
                    @csrf
                    <input type="hidden" id="type" name="type" value="out">
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="bank_code">{{ __('Mã ngân hàng') }}</label>
                                <input type="text" class="form-control" id="bank_code" name="bank_code">
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="bank_account">{{ __('bank_account') }}</label>
                                <input type="text" class="form-control" id="bank_account" name="bank_account">
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="request_id">{{ __('request_id') }}</label>
                                <input type="text" class="form-control" id="request_id" name="request_id">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="amount">{{ __('Tiền yêu cầu') }}</label>
                            <div class="input-group mb-3">
                                <input type="text" class="form-control" id="amount" name="amount">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="sign_key">{{ __('Đối tác') }}</label>
                            <select id="sign_key" name="sign_key" class="form-control">
                                <option value="">{{ __('select') }}</option>
                                @foreach (\App\Models\User\User::get() as $partner)
                                <option value="{{ $partner->sign_key }}">{{ $partner->username }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div id="hashOutputOut"></div>

                    <div class="col-lg-12">
                        <div class="text-center">
                            <button type="submit" id="getVsignOut" class="btn btn-success">
                                <span id="spinner-out" class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true" style="display: none;"></span>
                                <i class="fas fa-save"></i> <span id="button-text-out">{{ __('Lấy Vsign Out') }}</span>
                            </button>
                        </div>
                    </div>
                </form>

            </div>
        </div>
        <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasRightCreateCashout"
            aria-labelledby="offcanvasRightLabel">
            <div class="offcanvas-header">
                <h5 id="offcanvasRightLabel">Tạo CashOut</h5>
                <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas"
                    aria-label="Close"></button>
            </div>
            <hr>
            <div class="offcanvas-body">
                <form class="row" method="POST" id="formCreateCashout">
                    @csrf
                    <input type="hidden" id="type" name="type" value="in">
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="cash_out_id">{{ __('Cashout Id') }}</label>
                                <input type="text" class="form-control" id="cash_out_id" name="cash_out_id">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="request_id">{{ __('Request Id') }}</label>
                                <input type="text" class="form-control" id="request_id" name="request_id">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="bank_code">{{ __('Bank Code') }}</label>
                                <input type="text" class="form-control" id="bank_code" name="bank_code">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="bank_account">{{ __('Bank Account') }}</label>
                                <input type="text" class="form-control" id="bank_account" name="bank_account">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="row">
                            <div class="form-group">
                                <label for="customer_name">{{ __('Customer Name') }}</label>
                                <input type="text" class="form-control" id="customer_name" name="customer_name">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="amount">{{ __('Số tiền') }}</label>
                            <div class="input-group mb-3">
                                <input type="text" class="form-control" id="amount" name="amount">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="content">{{ __('Nội dung') }}</label>
                            <div class="input-group mb-3">
                                <input type="text" class="form-control" id="content" name="content">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="url_callback">{{ __('Url callback') }}</label>
                            <div class="input-group mb-3">
                                <input type="text" class="form-control" id="url_callback" name="url_callback">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="form-group">
                            <label for="user_id">{{ __('Đối tác') }}</label>
                            <select id="user_id" name="user_id" class="form-control">
                                <option value="">{{ __('select') }}</option>
                                @foreach (\App\Models\User\User::getPartners() as $partner)
                                <option value="{{ $partner->id }}">{{ $partner->username }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div id="hashOutput"></div>

                    <div class="col-lg-12">
                        <div class="text-center">
                            <button type="submit" id="createCashout" class="btn btn-success">
                                <span id="spinner-create-cashout" class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true" style="display: none;"></span>
                                <i class="fas fa-save"></i> <span id="button-text-create-cashout">{{ __('Tạo Cashout') }}</span>
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>
@endsection

@section('scripts')
<!-- DataTables  & Plugins -->
<script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-responsive/js/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-buttons/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('plugins/select2/js/select2.min.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script>
    $(document).on('click', '#btn-plus-balance', function(e) {
        e.preventDefault();
        var vsignId = $(this).data('vsign-id');
        var amount = $('#amount').val();
        $.ajax({
            url: "/vsign/" + vsignId,
            type: "PUT",
            data: {
                _token: "{{ csrf_token() }}",
                amount: amount
            },
            dataType: 'JSON',
            success: function(response) {
                if (response.code == 1) {
                    toastr.success(response.msg);
                    location.reload();
                } else {
                    toastr.error(response.msg);
                }
            },
            error: function() {
                toastr.error('Có lỗi xảy ra, vui lòng thử lại.', 'Thất bại');
            },
        });
    });

    $(document).on('click', '#getVsign', function(e) {
        e.preventDefault();

        $('#spinner').show();
        $('#button-text').text('Đang tải...');

        var request_id = $('#request_id').val();
        var amount = $('#amount').val();
        var chargeType = $('#chargeType').val();
        var sign_key = $('#sign_key').val();

        $.ajax({
            url: '/generate-hash',
            type: 'POST',
            data: $('#formGetVsignIn').serialize(),
            success: function(response) {
                var hashInput = `
                <input type="text" class="form-control mb-2" value="${response.hash}" readonly>
            `;
                $('#hashOutput').html(hashInput);

                $('#spinner').hide();
                $('#button-text').text('Lấy Vsign In');
                toastr.success("Lấy vsign thành công");
            },
            error: function(xhr, status, error) {
                console.error('Có lỗi xảy ra:', error);
                $('#spinner').hide();
                $('#button-text').text('Lấy Vsign In');
                toastr.error('Có lỗi xảy ra');
            }
        });
    });
    $(document).on('click', '#createCashout', function(e) {
        e.preventDefault();

        $('#spinner-create-cashout').show();
        $('#button-text-create-cashout').text('Đang tạo...');

        $.ajax({
            url: '/create-cashout-manual',
            type: 'POST',
            data: $('#formCreateCashout').serialize(),
            success: function(response) {
                if(response.success == true) {
                    $('#spinner-create-cashout').hide();
                    $('#button-text-create-cashout').text('Tạo CashOut');
                    toastr.success(response.message);
                }
                else {
                    $('#spinner-create-cashout').hide();
                    $('#button-text-create-cashout').text('Tạo CashOut');
                    toastr.error(response.message);
                }
            },
            error: function(xhr, status, error) {
                console.error('Có lỗi xảy ra:', error);
                $('#spinner-create-cashout').hide();
                $('#button-text').text('Tạo cashout');
                toastr.error('Có lỗi xảy ra');
            }
        });
    });
    $(document).on('click', '#getVsignOut', function(e) {
        e.preventDefault();

        $('#spinner-out').show();
        $('#button-text-out').text('Đang tải...');

        var request_id = $('#request_id').val();
        var amount = $('#amount').val();
        var chargeType = $('#chargeType').val();
        var sign_key = $('#sign_key').val();

        $.ajax({
            url: '/generate-hash',
            type: 'POST',
            data: $('#formGetVsignOut').serialize(),
            success: function(response) {
                var hashInput = `
                <input type="text" class="form-control mb-2" value="${response.hash}" readonly>
            `;
                $('#hashOutputOut').html(hashInput);

                $('#spinner-out').hide();
                $('#button-text-out').text('Lấy Vsign Out');
                toastr.success("Lấy vsign thành công");
            },
            error: function(xhr, status, error) {
                console.error('Có lỗi xảy ra:', error);
                $('#spinner-out').hide();
                $('#button-text-out').text('Lấy Vsign Out');
                toastr.error('Có lỗi xảy ra');
            }
        });
    });


    $(document).on('click', '#btn-update-unit', function(e) {
        e.preventDefault();
        var vsignId = $(this).data('vsign-id');
        var unit = $('#unit').val();
        $.ajax({
            url: "/update-unit-vsign/" + vsignId,
            type: "PUT",
            data: {
                _token: "{{ csrf_token() }}",
                unit: unit
            },
            dataType: 'JSON',
            success: function(response) {
                if (response.code == 1) {
                    toastr.success(response.msg);
                    location.reload();
                } else {
                    toastr.error(response.msg);
                }
            },
            error: function() {
                toastr.error('Có lỗi xảy ra, vui lòng thử lại.', 'Thất bại');
            },
        });
    });

    $(document).on('click', '#update-balance-vsignpro', function(e) {
        e.preventDefault();
        var vsignId = $(this).data('vsign-id');
        $.ajax({
            url: "/update-balance-vsignpro/" + vsignId,
            type: "PUT",
            data: {
                _token: "{{ csrf_token() }}",
            },
            dataType: 'JSON',
            success: function(response) {
                if (response.code == 1) {
                    toastr.success(response.msg);
                    location.reload();
                } else {
                    toastr.error(response.msg);
                }
            },
            error: function() {
                toastr.error('Có lỗi xảy ra, vui lòng thử lại.', 'Thất bại');
            },
        });
    });

    $(document).on('click', '#update-balance-vsignpro-and-deduction', function(e) {
        e.preventDefault();
        var vsignId = $(this).data('vsign-id');
        $.ajax({
            url: "/update-balance-vsignpro-and-deduction/" + vsignId,
            type: "PUT",
            data: {
                _token: "{{ csrf_token() }}",
            },
            dataType: 'JSON',
            success: function(response) {
                if (response.code == 1) {
                    toastr.success(response.msg);
                    location.reload();
                } else {
                    toastr.error(response.msg);
                }
            },
            error: function() {
                toastr.error('Có lỗi xảy ra, vui lòng thử lại.', 'Thất bại');
            },
        });
    });
</script>
@endsection

@section('styles')
<link rel="stylesheet" href="{{ asset('dist/css/input.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
<link rel="stylesheet" href="{{ asset('dist/css/cashin/cashin.css') }}">

<style>
    .dropdown-submenu {
        position: relative;
    }

    .dropdown-submenu .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -1px;
    }
</style>
@endsection