@extends('layouts.app_operasi')


@section('content')
@include('modal.historytebus')
@include('modal.wakil')
@include('modal.agh')


<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12 col-lg-12">

            <nav aria-label="breadcrumb">
                <ol class="breadcrumb pb-3">
                  <li class="breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
                  <li class="breadcrumb-item"><a href="{{ route('admin.pelanggan') }}">Pengenalan Diri</a></li>
                  <li class="breadcrumb-item active" aria-current="page">Pelanggan</li>
                </ol>
            </nav>
            <div class="card">
                <div class="card-body">
                    <form id="kemaskiniform">
                        <div class='row form-group'>
                            <div class='col-md-6'>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        Nama
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='nama' id='nama' value="{{ $customer_info['nama'] }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        No KP
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='icno' id='icno' value="{{ $customer_info['kpbaru'] != null ? $customer_info['kpbaru'] : $customer_info['kplama'] }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        No Pelanggan
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='nopelanggan' id='nopelanggan' value="{{ $customer_info['nopelanggan'] }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        No Telefon 1
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='' id='telefon' value="{{ $customer_info['telefon'] }}" class='form-control'>
                                        <span id="errortelefon" style="color:red;"></span>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        No Telefon 2
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='telefon2' id='telefon2' value="{{ $customer_info['telefon2'] }}" class='form-control'>
                                        <span id="errortelefon2" style="color:red;"></span>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        Bank
                                    </div>
                                    <div class='col-md-7'>
                                        @php
                                            $bank = Http::withOptions(['verify' => config('app.api_verify')])->get($api_url . '/api/bank')->json();
                                        @endphp
                                        <select class="form-control" name="kodbank" data-placeholder="Pilih Bank" id="kodbank" disabled="true">
                                            <option value="-" selected disabled>-</option>
                                            @foreach($bank as $banks)
                                                <option value="{{ $banks['abbreviation'] }}" {{ $banks['abbreviation'] == $customer_info['kodbank'] ? 'selected' : ''}}>{{ $banks['name'] }}</option>
                                            @endforeach
                                        </select>
                                        <span id="errorkodbank" style="color:red;"></span>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-5'>
                                        No Akaun
                                    </div>
                                    <div class='col-md-7'>
                                        <input type="text" readonly name='noakaun' id='noakaun' value="{{ $customer_info['noakaun'] }}" class='form-control'>
                                        <span id="errornoakaun" style="color:red;"></span>
                                    </div>
                                </div>
                            </div>
                            <div class='col-md-6'>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-4'>
                                        Alamat
                                    </div>
                                    <div class='col-md-8'>
                                        <textarea style="resize:none" name="alamat" id="alamat" cols="30" rows="3" readonly class='form-control'>{{ $customer_info['alamat1'] }}</textarea>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-4'>
                                        Poskod
                                    </div>
                                    <div class='col-md-8'>
                                        <input type="text" readonly name='poskod' id='poskod' value="{{ $customer_info['poskod'] }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-4'>
                                        Daerah
                                    </div>
                                    <div class='col-md-8'>
                                        @php
                                            $poskod = Http::withOptions(['verify' => config('app.api_verify')])->get($api_url . '/api/poskod/'. $customer_info['poskod'])->json();
                                            if(empty($poskod)){
                                                $poskod = array('koddaerah'=>'NIL','kodnegeri' => 'NIL');
                                            }
                                            $daerah = Http::withOptions(['verify' => config('app.api_verify')])->get($api_url . '/api/daerah/' . $poskod['koddaerah'])->json();
                                        @endphp
                                        <input type="text" readonly name='koddaerah' id='koddaerah' value="{{ $daerah ? $daerah['namadaerah'] : 'NIL' }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-4'>
                                        Negeri
                                    </div>
                                    <div class='col-md-8'>
                                        @php
                                            $negeri = Http::withOptions(['verify' => config('app.api_verify')])->get($api_url . '/api/negeri/' . $poskod['kodnegeri'])->json();
                                        @endphp
                                        <input type="text" readonly name='kodnegeri' id='kodnegeri' value="{{ $negeri ? $negeri['negeri'] : 'NIL' }}" class='form-control'>
                                    </div>
                                </div>
                                <div class='form-group row col-md-12'>
                                    <div class='col-md-4'>
                                        Nota
                                    </div>
                                    <div class='col-md-8'>
                                        <textarea style="resize:none" name="nota" id="nota" cols="30" rows="3" readonly class='form-control'>{{ $customer_info['nota'] }}</textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{-- <div class="mr-5 form-group float-right">
                            <button type="button" class="btn btn-primary" onclick="kemaskinifunc()" id="btnkemaskini">Kemaskini</button>
                            <button type="button" class="btn btn-primary" onclick="kemaskinipelanggan()" id="btnsave">Save</button>
                        </div> --}}
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    var api_url = "<?php echo $api_url ?>";
    var ppc = "{{ Auth::user()->name }}";
    var ic_asal = "{{ $customer_info['kpbaru'] != null ? $customer_info['kpbaru'] : $customer_info['kplama'] }}"

    const formatter = new Intl.NumberFormat('en-US', {
        minimumFractionDigits: 2
    });


    $(document).ready( function () {

    });

    $('#poskod').change(function(){
        var poskod = this.value;
        console.log(poskod);
        $.ajax({
            method:'GET',
            url:api_url+'/api/poskod/'+poskod,
            success:function(poskod_detail){
                var koddaerah = poskod_detail['koddaerah'];
                var kodnegeri = poskod_detail['kodnegeri'];
                $.ajax({
                    url:api_url+'/api/negeri/'+kodnegeri,
                    method:'GET',
                    success:function(negeri){
                        console.log(negeri);
                        $('#kodnegeri').val(negeri['negeri']);
                    }
                });
                $.ajax({
                    url:api_url+'/api/daerah/'+koddaerah,
                    method:'GET',
                    success:function(daerah){
                        $('#koddaerah').val(daerah['namadaerah']);
                    }
                });
            }
        });
    });

    function kemaskinifunc()
    {
        $('#btnkemaskini').addClass('btn-danger');
        $('#btnkemaskini').removeClass('btn-primary');
        $('#btnkemaskini').text('Cancel');
        $('#btnkemaskini').attr('onclick','cancelbutton()');
        $('#btnsave').show();
        $('#btnotp').css('display','none');
        //attribute nak readonly false
        $('#telefon').attr('readonly', false);
        $('#telefon2').attr('readonly', false);
        $('#kodbank').attr('disabled', false);
        $('#noakaun').attr('readonly', false);
        $('#nota').attr('readonly', false);
        $('#nama').attr('readonly', false);
        $('#alamat').attr('readonly', false);
        $('#poskod').attr('readonly', false);
        $('#icno').attr('readonly', false);
    }

    function cancelbutton(){
        $('#btnkemaskini').removeClass('btn-danger');
        $('#btnkemaskini').addClass('btn-primary');
        $('#btnkemaskini').text('Kemaskini');
        $('#btnkemaskini').attr('onclick','kemaskinifunc()');
        $('#btnsave').css('display','none');
        $('#btnotp').show();

        document.getElementById("kemaskiniform").reset();

        //attribute nak readonly false
        $('#telefon').attr('readonly', true);
        $('#telefon2').attr('readonly', true);
        $('#kodbank').attr('disabled', true);
        $('#noakaun').attr('readonly', true);
        $('#nota').attr('readonly', true);
        $('#nama').attr('readonly', true);
        $('#alamat').attr('readonly', true);
        $('#poskod').attr('readonly', true);
        $('#icno').attr('readonly', true);

        /* Error Telefon */
        $('#errortelefon').hide();
        $('#errortelefon').text("");
        $('#telefon').removeClass('is-invalid');

        $('#errortelefon2').hide();
        $('#errortelefon2').text("");
        $('#telefon2').removeClass('is-invalid');
    }

    $("#kemaskiniform").submit(function(event) {
        event.preventDefault();

        var nokp = $('#icno').val();
        var telefon1 = $('#telefon').val();
        var telefon2 = $('#telefon2').val();
        var kodbank = $('#kodbank').val();
        var noakaun = $('#noakaun').val();
        var nota = $('#nota').val();
        var nama = $('#nama').val();
        var alamat = $('#alamat').val();
        var poskod = $('#poskod').val();
        var icno = $('#icno').val();

        $.ajax({
            method:"put",
            url: api_url + "/api/customers/information/update/admin",
            data:{
                "icno":icno,
                "ic_asal":ic_asal,
                "telefon1": telefon1,
                "telefon2": telefon2,
                "kodbank":kodbank,
                "noakaun":noakaun,
                'nota':nota,
                'nama':nama,
                'alamat':alamat,
                'poskod':poskod
            },
            success: function(success){
                $('#btnsave').css('display','none');
                // console.log(success);
                if(success != 'existing'){
                    Swal.fire({
                        icon: 'success',
                        title: 'Berjaya',
                        text: 'Berjaya mengemaskini maklumat pelanggan'
                    });
                }else{
                    $('#icno').val(ic_asal);
                    Swal.fire({
                        icon: 'warning',
                        title: 'Tidak Berjaya',
                        text: 'Data pelanggan tidak berjaya dikemaskini'
                    });
                }

            },
            error: function (request, status, error) {
                alert(request.responseText);
            }

        });
    });

    function kemaskinipelanggan(){

        var errortelefon1 = 0;
        var errortelefon2 = 0;

        if(!($('#telefon').val().length >= 9 && $('#telefon').val().length < 12)){
            $('#errortelefon').show();
            $('#errortelefon').text("*lebih kecil dari 10 dan lebih besar dari 12");
            $('#telefon').addClass('is-invalid');
            errortelefon1++;
        }else{
            $('#errortelefon').hide();
            $('#telefon').removeClass('is-invalid');
            errortelefon1--;
        }

        if($('#telefon2').val() != ''){
            if(!($('#telefon2').val().length >= 9 && $('#telefon2').val().length < 12)){
                $('#errortelefon2').show();
                $('#errortelefon2').text("*lebih kecil dari 10 dan lebih besar dari 12");
                $('#telefon2').addClass('is-invalid');
                errortelefon2++;
            }else{
                $('#errortelefon2').hide();
                $('#telefon2').removeClass('is-invalid');
                errortelefon2--;
            }
        }else{
            $('#errortelefon2').hide();
            $('#telefon2').removeClass('is-invalid');
            errortelefon2--;
        }

        if(errortelefon1 <= 0 && errortelefon2 <= 0){
            $('#btnkemaskini').removeClass('btn-danger');
            $('#btnkemaskini').addClass('btn-primary');
            $('#btnkemaskini').text('Kemaskini');
            $('#btnkemaskini').attr('onclick','kemaskinifunc()');
            $('#btnotp').text('Daftar Akuan Online');
            $('#btnotp').attr('onclick','#');

            //attribute nak readonly false
            $('#telefon').attr('readonly', true);
            $('#telefon2').attr('readonly', true);
            $('#noakaun').attr('readonly', true);
            $('#kodbank').attr('disabled', true);
            $('#nota').attr('readonly', true);
            $('#nama').attr('readonly', true);
            $('#alamat').attr('readonly', true);
            $('#poskod').attr('readonly', true);
            $('#icno').attr('readonly', true);

            $('#kemaskiniform').trigger('submit');
        }
    }
</script>
@endsection