@extends('temp.admin')
@php
use NN\Module\DB;
use NN\Module\View;
@endphp
@section("content")

<div class="content-header row">
    <div class="content-header-left col-md-6 col-12 mb-2 breadcrumb-new">
        <h3 class="content-header-title mb-0 d-inline-block">Import Data</h3>
        <div class="row breadcrumbs-top d-inline-block">
            <div class="breadcrumb-wrapper col-12">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item active" id="importdata">anggota</li>
                </ol>
            </div>
        </div>
    </div>
    <div class="content-header-right col-md-6 col-12">
        <div class="btn-group float-md-right">
            
        </div>
    </div>
</div>
<div class="content-body">
    <section id="dasbor">
        <div class="row mb-4">
            
            <div class="col-sm-12">
                <div class="card">
                    <div class="card-content">
                        <div class="card-body">
                            @include('file.linemenu')
                        </div>
                        <div class="card-body sales-growth-chart">
                            <p style="padding: 5px 10px;border-radius:10px; border: 1px solid #ddddff;"><i class="la la-info-circle"></i> 
                            Import data melalui excel akan mereset data anggota. jika ada transaksi terkait kode anggota maka akan mempengaruhi laporan.
                            sebelum import silahkan download template excel <a href="{{ASSET}}/excel/anggota.xlsx">disini</a>
                        </p>
                            <div style="display:grid;grid-template-columns: auto 150px; grid-gap:5px;">
                                <input type="file" class="form-control" id="demo" accept=".xls,.xlsx">
                                <button class="btn btn-primary btn-sm" onclick="window._uploadData()">Update Data Anggota</button>
                            </div>
                        </div>
                        <div class="card-body sales-growth-chart" id="table-x">
                            <div onclick="_id('demo').click()" style="padding: 20px; border: 1px solid #ddd; border-radius: 10px; cursor: pointer; text-align :center;"> Upload file excel </div>
                        </div>
                    </div>
                </div>

            </div>
           
        </div>
    </section>
</div>


@endsection

@section('css')
<style>
    td{
        white-space:nowrap;
    }
</style>
@endsection
@section('script')
<script>
    setTimeout(() => {
        document.querySelector('.modern-nav-toggle').click();
    }, 1000);
    const xTable = _id('table-x');
    document.getElementById("demo").onchange = evt => {
    var _ld = cssLoader();
    var reader = new FileReader();
        reader.addEventListener("loadend", evt => {
            var workbook = XLSX.read(evt.target.result, {type: "binary"}),
                worksheet = workbook.Sheets[workbook.SheetNames[0]],
                range = XLSX.utils.decode_range(worksheet["!ref"]);
        
                var data = [];
                for (let row=range.s.r; row<=range.e.r; row++) {
                let i = data.length;
                data.push([]);
                for (let col=range.s.c; col<=range.e.c; col++) {
                    let cell = worksheet[XLSX.utils.encode_cell({r:row, c:col})];
                    if(cell != undefined){
                        data[i].push(cell.v);
                    }else{
                        data[i].push('-');
                    }
                }
            }
            if(data[0] != undefined){
                var nod = [];
                data[0].forEach(function(s, i){
                    if(s != '-'){
                        nod.push({
                            id: i,
                            val: s
                        });
                    }
                });
                var snod = data;
                snod.shift();
                var sObject = snod.map(function(df, i){
                    var f ={};
                    nod.forEach(function(o){
                        if(o.val == 'tgllahir'){
                            if(typeof df[o.id] === 'number'){
                                f[o.val] = tanggal(ExcelDateToJSDate(df[o.id])).normal;
                            }else{
                                f[o.val] = df[o.id].fixMonth();
                            }
                        }else if(o.val == 'masuk'){
                            var q = df[o.id].toString().replaceMonth().split(' ');
                            if(q.length > 1){
                                f[o.val] = q[1]+'-'+q[0]+'-01';
                            }else{
                                f[o.val] = q[0]+'-01-01';
                            }
                        }else{
                            f[o.val] = df[o.id];
                        }
                    });
                    return f;
                });
                var sArray = snod.map(function(df, i){
                    var f =[];
                    nod.forEach(function(o){
                        if(o.val == 'tgllahir'){
                            if(typeof df[o.id] === 'number'){
                                f.push(tanggal(ExcelDateToJSDate(df[o.id])).normal);
                            }else{
                                if(df[o.id] == '-'){
                                    f.push('0000-00-00');
                                }else{
                                    f.push(df[o.id].fixMonth());
                                }
                            };
                        }else if(o.val == 'masuk'){
                            var q = df[o.id].toString().replaceMonth().split(' ');
                            if(q.length > 1){
                                f.push(q[1]+'-'+q[0]+'-01');
                            }else{
                                f.push(q[0]+'-01-01');
                            }
                        }else{
                            f.push(df[o.id]);
                        }
                    });
                    return f;
                });
                var nId = 'table-'+Date.now();
                xTable.innerHTML = ``;
                xTable.innerHTML = `
                    <table id="${nId}" style="width:100%;" class="table table-bordered">
                        <thead class="bg-primary text-white">
                            <tr>
                                ${nod.map(function(o){
                                    return `<th>${o.val}</th>`;
                                }).join('')}
                            </tr>
                        </thead>
                    </table>
                `;
                setTimeout(() => {
                    var op = {
                        dom: 'Bfrtip',
                        scrollY: '250px',
                        scrollX: true,
                        scrollCollapse: true,
                        paging: true,
                        "lengthChange": true,
                        "lengthMenu": [[25, 50, 100, 500, 1000], [25, 50, 100, 500, "Max"]],
                        "pageLength": 50
                    };
                    var tbx = $('#'+nId).DataTable(op);
                    console.log(nod);
                    console.log(sObject);
                    window.sArray = sArray;
                    window.sObject = sObject;
                    window.proccess = [
                        {
                            table: 'anggota',
                            data: sObject.ToInsert('anggota')
                        }
                        ,{
                            table: 'munitkerja',
                            data: sArray.getItemArrayNum(7).removeDuplicate().makeMaster('kode', 'lokasi').ToInsert('munitkerja')
                        }
                        ,{
                            table: 'mrekapgol',
                            data: sArray.getItemArrayNum(9).removeDuplicate().makeMaster('kode', 'nama').ToInsert('mrekapgol')
                        }
                    ];
                    sArray.forEach(function(d){
                        tbx.row.add(d);
                    });
                    tbx.draw(true);
                    _ld.remove();
                }, 10);
            };
        });
        reader.readAsArrayBuffer(evt.target.files[0]);
    };
    window._uploadData = function(){
        var _ld = cssLoader();
        upload('{{PATH}}/upload/data/anggota', '', 'req.data', btoa(JSON.stringify(window.proccess)), (a) => { }, (b) => {
            console.log(b);
            _ld.remove();
            Swal('Info', 'Data update', 'success')
        });
    };
</script>
@endsection