@extends('layouts.main')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-12">
            <div class="card card-primary">
                <div class="card-header">
                    <h3 class="card-title">Add New Customer</h3>
                </div>
                <form class="" role="form" method="post" action="{{url('save-new-customer')}}">
                    {!! csrf_field() !!}
                    <div class="card-body">
                        <div class="form-group">
                            <label>Country Code</label>
                            <select class="selectpicker form-control" name="country_code" data-live-search="true">
                                @foreach($country_code as $code)
                                <option value="{{$code->country_code}}" @if($code->country_code=='880') selected
                                    @endif>{{$code->country_name}}
                                    ({{$code->country_code}})</option>
                                @endforeach
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Phone Number</label>
                            <input type="text" class="form-control" required name="number" value="{{old('number')}}">
                        </div>

                        <div class="form-group">
                            <label>Gender</label>
                            <select name="gender" class="form-control">
                                <option value="">Select a Gender</option>
                                <option value="Mr">Mr</option>
                                <option value="Mrs">Mrs</option>
                                <option value="Ms">Ms</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Name</label>
                            <input type="text" class="form-control" name="first_name" value="{{old('first_name')}}">
                        </div>

                        <div class="form-group" style="display:none">
                            <label>Last Name</label>
                            <input type="text" class="form-control" name="last_name" value="{{old('last_name')}}">
                        </div>


                        <div class="form-group">
                            <label>Email</label>
                            <input type="email" class="form-control" name="email" value="{{old('email')}}">
                        </div>


                        <div class="form-group">
                            <label>Club Account</label>
                            <input type="text" class="form-control" name="username" value="{{old('username')}}">
                        </div>

                        <div class="form-group">
                            <label>Categories</label>
                            <select name="customer_group[]" class="select2bs4" multiple="multiple"
                                data-placeholder="Select a Category" style="width: 100%;" required>
                                @foreach($customerGroup as $v)
                                <option value="{{$v->id}}">{{$v->name}}</option>
                                @endforeach
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Broadcast</label>
                            <select name="broadcast_group" class="select2bs4" data-placeholder="Select a Broadcast"
                                style="width: 100%;">
                                <option value="">Select Broadcast</option>
                                @foreach($broadCastGroup as $v)
                                <option value="{{$v->id}}">{{$v->broadcast_name}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group">
                            <label>Whatsapp availability</label>
                            <select name="wp" class="form-control">
                                <option value="1">yes</option>
                                <option value="0">no</option>
                            </select>
                        </div>
                    </div>
                    <div class="card-footer">
                        <button type="submit" class="btn btn-primary"><i class="fa fa-plus"></i>
                            Add
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <div class="col-lg-6 col-md-6 col-sm-12">
            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Import Customers By File</h3>
                    </div>
                    <div class="card-body">

                        <div class="form-group">
                            <div class="form-group">
                                <a title="Customer Sample File" download href="{{asset('public/phq/sample-customers.xlsx')}}" class="btn btn-default"><i
                                        class="fa fa-download"></i> Download Sample File</a>
                            </div>
                        </div>

                        <div id="send-sms-file-wrapper">
                            <form id="" class="" role="form" method="post" action="{{url('save-import-customers')}}"
                                enctype="multipart/form-data">

                                <div class="form-group">
                                    <label></label>
                                    <div class="form-group input-group input-group-file">
                                        <span class="input-group-btn">
                                            <span class="btn btn-primary btn-file">
                                                Browse <input type="file" class="form-control" id="the-csv-file"
                                                    name="import_numbers" @change="handleImportNumbers">
                                            </span>
                                        </span>
                                        <input type="text" class="form-control" id="the-csv-file-name" readonly=""
                                            name="file">
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label>Categories</label>
                                    <select name="customer_group" class="select2bs4" 
                                        data-placeholder="Select a Category" style="width: 100%;" required>
                                        <option value="">Select Broadcast</option>
                                        @foreach($customerGroup as $v)
                                        <option value="{{$v->id}}">{{$v->name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label>Broadcast</label>
                                    <select name="broadcast_group" class="select2bs4"
                                        data-placeholder="Select a Broadcast" style="width: 100%;">
                                        <option value="">Select Broadcast</option>
                                        @foreach($broadCastGroup as $v)
                                        <option value="{{$v->id}}">{{$v->broadcast_name}}</option>
                                        @endforeach
                                    </select>
                                </div>

                                <input type="hidden" name="_token" value="{{ csrf_token() }}">
                                <button type="submit" id="submitContact" class="btn btn-success btn-sm pull-right"><i
                                        class="fa fa-plus"></i> Add </button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>


            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Add New Group</h3>
                    </div>
                    <div class="card-body">
                        <form class="" role="form" method="post"
                            action="{{url('customers-groups/create-group-add-customer')}}">

                            <div class="form-group">
                                <label>Group Name</label>
                                <input type="text" class="form-control" name="group_name" required
                                    value="{{old('group_name')}}">
                            </div>

                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                            <button type="submit" class="btn btn-success btn-sm pull-right"><i class="fa fa-plus"></i>
                                Add
                            </button>
                        </form>
                    </div>
                </div>
            </div>

            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Add New Broadcast</h3>
                    </div>
                    <div class="card-body">
                        <form class="" role="form" method="post"
                            action="{{url('customers-groups/create-broadcast-add-customer')}}">

                            <div class="form-group">
                                <label>Broadcast Name</label>
                                <input type="text" class="form-control" name="broadcast_name" required
                                    value="{{old('broadcast_name')}}">
                            </div>
                            
                            <div class="form-group">
                                <label>Broadcast ID</label>
                                <input type="text" class="form-control" name="broadcast_id" required
                                    value="{{old('broadcast_id')}}">
                            </div>


                            <div class="form-group">
                            <label>Categories</label>
                            <select name="customer_group" class="select2bs4" data-placeholder="Select a Category"
                                style="width: 100%;">
                                <option value="">Select Broadcast</option>
                                @foreach($customerGroup as $v)
                                        <option value="{{$v->id}}">{{$v->name}}</option>
                                        @endforeach
                            </select>
                        </div>



                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                            <button type="submit" class="btn btn-success btn-sm pull-right"><i class="fa fa-plus"></i>
                                Add
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
@endsection

{{--External Style Section--}}
@section('script')
<script>
    $(document).ready(function () {
        $('.select2bs4').select2({
            theme: 'bootstrap4'
        });

        $("#the-csv-file").on('change', function () {
            $("#the-csv-file-name").val($(this).val())
        })
    });
</script>
@endsection