@extends('app')

@section('page_title')
    Address Book - Bulk Upload
@endsection


@push('styles')
<link rel="stylesheet" href="//cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.0.3/css/buttons.dataTables.min.css">
@endpush

@section('page_content')
    <div class="page-content container-fluid">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <div class="panel" id="exampleWizardForm">
                    <div class="panel-heading">
                        <div class="panel-title">
                            <h3>Address Book - Contact Upload</h3>
                        </div>
                    </div>
                    <p style="text-align: center">The excel file should contain the following columns <b>in order</b>:<br/>
                        <em style="text-decoration: underline">Phone Number</em> |
                        <em style="text-decoration: underline">Contact Name <small>(optional)</small></em> |
                        <em style="text-decoration: underline">Email <small>(optional)</small></em>
                        <br/>
                    </p>
                    <div class="panel-body">
                        <form class="form-horizontal" method="POST" enctype="multipart/form-data">
                            @if(count($errors)>0)
                                <div class="alert alert-danger">
                                    <ul>
                                        @foreach($errors->all() as $error)
                                            <li>{{$error}}</li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif
                            @if (\Session::has('success'))
                                <div class="alert alert-success">
                                    <ul>
                                        <li>{!! \Session::get('success') !!}</li>
                                    </ul>
                                </div>
                            @endif
                            @csrf

                            <div class="form-group">
                                <label for="group_name" class="col-sm-3 control-label form-label">Group<span
                                            style="color: red;">*</span> </label>
                                <div class="col-sm-8">
                                    <input type="text" class="form-control" name="name" id="group_name" readonly="readonly" placeholder="Enter Name" value="{{$group->name}}">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="file_upload" class="col-sm-3 control-label form-label">Excel File<span style="color: red;">*</span> </label>
                                <div class="col-sm-8">
                                    <input type="file" class="form-control" name="file_upload" accept=".xls,.xlsx,.csv,.xml,.ods"
                                           id="file_upload" placeholder="Select file"/>
                                </div>
                            </div>
                            <div class="col-md-offset-5">
                                <button type="submit" id="saveBtn" class="btn btn-primary">Save</button>
                                <a id="cancelBtn" href="{{route('addressbook.contacts', ['group_id'=>$group->id])}}" class="btn btn-default">Cancel</a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection