@extends('core::layouts.master')
@section('breadcrumb','Kho ứng dụng')
@section('head-action')
    {{--{{ Form::bsNavBtnSubmit('Lưu thay đổi','setting-form') }}--}}
@endsection
@section('scripts')
    @parent
    <script>
        var submit_continue = false;
        function pushDataToVcall (form) {
            var api_key = '{{$configs_advanced["vht_vcall"]["api_key"]}}';
            var api_secret = '{{$configs_advanced["vht_vcall"]["api_secret"]}}';
            var text_tranform = {
                error_email_invalid : "Email không hợp lệ",
                error_email_existed : "Email đã tồn tại",
                error_full_name_required : "Họ tên bắt buộc",
                error_company_existed : "Tên công ty đã tồn tại",
                error_company_exists : "Tên công ty đã tồn tại",
                error_password_required : "Mật khẩu bắt buộc",
                error_password_is_short : "Mật khẩu ngắn (0-7 ký tự)",
                error_phone_required : "Số điện thoại bắt buộc",
                error_phone_existed : "Số điện thoại đã tồn tại",
                error_status_invaild : "Trạng thái không hợp lệ"
            };
            $.ajax({
                url: '{{$configs_advanced["vht_vcall"]["api"]["create_account"]["url"]}}',
                type: '{{$configs_advanced["vht_vcall"]["api"]["create_account"]["method"]}}',
                headers: {
                    "Authorization": "Basic " + btoa(api_key + ":" + api_secret)
                },
                dataType: 'json',
                data: {
                    phone: form.vcall_phone,
                    password: '1qaz@WSX',
                    full_name: form.vcall_full_name,
                    email: form.vcall_email,
                    company: form.vcall_company,
                },
                success: function (response) {
                    $('#addon_vht_vcall .text-muted').text(`Vui lòng kiểm tra email "${form.vcall_email}" để nhận tài khoản và hướng dẫn truy cập ứng dụng VCall`);
                    submitAjaxAddon('vht_vcall', 1);
                    initializeSwitch('input[name=vht_vcall]', 1);
                },
                statusCode: {
                    422: function(xhr) {
                        var response = JSON.parse(xhr.responseText);
                        if(response.error.length) {
                            var text = 'Có vẻ như địa chỉ email, số điện thoại hoặc tên công ty của bạn đã được sử dụng để đăng ký VCall trước đây rồi. Vui lòng kiểm tra lại hoặc nhập thông tin khác.';
                            $('#addon_vht_vcall .text-muted').text(text);
                            submitAjaxAddon('vht_vcall', 1);
                            initializeSwitch('input[name=vht_vcall]', 1);
                            return true;
                        }
                    },
                    201: function(xhr) {
                        return true;
                    }
                }
            });
            return false;
        }

         $.fn.serializeFormJSON = function () {
            var o = {};
            var a = this.serializeArray();
            $.each(a, function () {
                if (o[this.name]) {
                    if (!o[this.name].push) {
                        o[this.name] = [o[this.name]];
                    }
                    o[this.name].push(this.value || '');
                } else {
                    o[this.name] = this.value || '';
                }
            });
            return o;
        };

        $('#setting-form').on('submit', function (e) {
            e.preventDefault();
            var form = $(this).serializeFormJSON();
            if(form.hasOwnProperty('vcall_email')) {
                pushDataToVcall(form);
            }
            return false;
        });

        $('#addon_vht_vcall input').keypress(function() {
            $('#addon_vht_vcall .text-muted').empty();
        });

        function initializeSwitch(selector, state = null) {
            $(selector).bootstrapSwitch('destroy', true);
            $(selector).bootstrapSwitch({
                'state': state
            });
            /*$(selector).on('switchChange.bootstrapSwitch', function(event, state) {
                console.log('change event' + (new Date()).getTime());
            });*/
        }

        function submitAjaxAddon(key, value) {
            var data = {_token: _token};
            data[key] = value;
            $.ajax({
                url: '{{route('admin.addon.store')}}',
                type: 'POST',
                dataType: 'json',
                data: data,
                success: function (response) {
                    if(key == 'vht_vcall' && value != 1) {
                        $('#addon_vht_vcall .text-muted').empty();
                    }
                    successNotice(response.message);
                },
                error: function () {
                    swal.close();
                }
            });
        }

        $(document).on('switchChange.bootstrapSwitch', '.addon', function (event, state) {
            var value = state ? 1 : 0;
            if($(this).attr('name') == 'vht_vcall' && value == 1) {
                initializeSwitch('input[name=vht_vcall]', 0);
                $('#addon_vht_vcall .data-expand').toggle();
                return false;
            }else{
                submitAjaxAddon($(this).attr('name'), value);
            }
        });
    </script>
@endsection
@section('content')
<style type="text/css">
    .addon_list tr:first-child td{border-top:0px}
</style>
    <div class="col-sm-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <div class="table-responsive">
                    {!! Form::open([
                            'method' => 'POST',
                            'url'  => route('admin.addon.store'),
                            'files'  => true,
                            'id' => 'setting-form'
                        ]) !!}
                    <table class="table addon_list">
                        <tbody>
                            @foreach($addons as $key=>$config)
                                @isset($addon_all[$key])
                                <tr id="addon_{{$key}}">
                                    <td>
                                    @isset($addon_all[$key]['link'])
                                    <a href="{{$addon_all[$key]['link']}}" target="_blank">
                                    @endisset
                                        <div class="media-left"> <i class="{!! $addon_all[$key]['icon'] !!} fa-2x"></i></div>
                                        <div class="media-body">
                                            <h6 class="media-heading">{{$addon_all[$key]['label']}}</h6>
                                            <span class="text-muted">{{@$addon_all[$key]['package_name']}}
                                                {{$key=='vht_vcall' && !empty(@$addons[$key])?'Vui lòng kiểm tra email để nhận tài khoản và hướng dẫn truy cập ứng dụng VCall':''}}
                                            </span>
                                        </div>
                                    @isset($addon_all[$key]['link'])
                                    </a>
                                    @if($key == 'vht_vcall')
                                    @php($admin = Auth::guard('admin')->user())
                                    <div class="data-expand row" style="display: none;">
                                        <div class="form-group col-md-6">
                                            <label>Họ và tên</label>
                                            <input class="form-control" type="text" name="vcall_full_name" value="{{$admin->name}}" required />
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label>Email</label>
                                            <input class="form-control" type="email" name="vcall_email" value="{{$admin->email}}" required />
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label>Số ĐT</label>
                                            <input class="form-control" type="text" name="vcall_phone" required />
                                        </div>
                                        <div class="form-group col-md-6">
                                            <label>Tên công ty</label>
                                            <input class="form-control" type="text" name="vcall_company" required />
                                        </div>
                                        <div class="form-group col-md-12 text-center">
                                            <button type="submit" class="btn btn-info btn-submit-vcall">Gửi đăng ký VCall</button>
                                        </div>
                                    </div>
                                    @endif
                                    @endisset
                                    </td>
                                    <td style="vertical-align: top;">{{ Form::checkbox($key, 1, @$addons[$key],['class'=>'addon','bs-type'=>'switch','data-on-text'=>'Đang bật','data-off-text'=>'Đang tắt']) }}</td>
                                </tr>
                                @endisset
                            @endforeach
                        </tbody>
                    </table>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
@endsection