@extends('layout.default')

@section('content')
    <div class="alert alert-custom alert-white alert-shadow gutter-b" role="alert">
        <div class="alert-text">Silahkan export data user terlebih dahulu untuk mendapatkan format excel yang sesuai.<br><br>
            <ul>
                <li>Jika data email sudah ada pada database maka data akan diupdate jika belum data user akan ditambahkan ke database</li>
                <li>Jika user diassign sebagai <b>Super Admin</b> maka data <b>outlet_code</b> boleh kosong</li>
                <li>Password akan di generate otomatis oleh sistem</li>
            </ul>
        </div>
    </div>
    <div class="card card-custom">
        <div class="card-body">
            @include('layout.notifications')
            <div class="form-group row">
                <label for="example-search-input" class="col-2 col-form-label">Export Data User</label>
                <div class="col-4">
                    <a class="btn btn-warning" href="{{url('user/export')}}"><i class="fa fa-download"></i> Export Excel</a>
                </div>
            </div>
            <form method="post" action="{{url('user/import/save')}}" enctype="multipart/form-data">
                @csrf
                <div class="row">
                    <label class="col-2 col-form-label">Import File User <span class="text-danger">*</span></label>
                    <div class="col-md-4">
                        <div class="form-group">
                            <input type="file" name="import_file" id="import_file" class="form-control d-none" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" required>
                            <div class="input-group">
                                <input type="text" readonly class="form-control" id="import_label">
                                <div class="input-group-append">
                                    <label class="btn btn-secondary input-group-btn" for="import_file">Browse</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-2"></div>
                    <div class="col-md-4">
                        <button class="btn btn-primary"><i class="fa fa-file-import"></i> Import</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        $(document).ready(function() {
            $('#import_file').on('change',function() {
                const filenames = this.value.split('\\');
                $('#import_label').val(filenames[filenames.length-1]);
            });
        });
    </script>
@endsection