@extends('layouts.app')
<!-- BEGIN CONTENT -->
@section('content')
    <div class="page-content-wrapper">
        <!-- BEGIN CONTENT BODY -->
        <div class="top_bar page-content">
            <div class="top_status_bar">
                <div id="top_progress_bar" class="progress_bar">
                </div>
            </div>
            <div class="breadcrumbs">
                <ul>
                    <li><a href="{{ url('admin/settings') }}">Settings</a></li>
                    <li><a href="#">Branch</a></li>
                </ul>
                <button class="btn btn-large pull-right help theme_btn help_btn">?</button>
            </div>
        </div>
        <div class="page-content">
            <div class="portlet">
                <!-- BEGIN PAGE HEADER-->
                <div class="portlet-title page_heading">
                    <div class="row">
                        <div class="col-md-9">
                            <div class="caption">
                                <h2 style="font-weight: 600; margin-top: 0;">Branch</h2>
                                <span class="subtitle">Create your branch details.</span>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- BEGIN PAGE BAR -->
                <div class="row">
                    <div class="col-md-12">
                        <!--THIS IS CONTENT DIV START-->
                        <div class="portlet-body flip-scroll">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="col-sm-4 trash ui-droppable" style=" width: 45.333333%">
                                        <div class="new_product_left">
                                            <h4>BUSINESS NAME & TRADING ADDRESS</h4>
                                            <p>Where do you run your business from day-to-day?</p>
                                            <p>Changes will be reflected across all linked Salesoft <br> applications.</p>
                                        </div>
                                        <div style="height: 845px;"></div>
                                    </div>
                                    <form action="" id="branch_form">
                                        <div class="col-sm-8 new_product_form" style="width: 52.666667%">
                                            <div class="row">
                                                {{-- Branch Name --}}
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_name">Branch Name*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control validate"
                                                                id="product_name" name="branch_name"
                                                                placeholder="Enter your branch name" autocomplete="off">
                                                            <p class="text-danger branch_name validation_error hidden"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Address line 1 -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_name">Address line 1*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control validate"
                                                                id="product_name" name="address_line_1"
                                                                placeholder="Enter your address" value=""
                                                                autocomplete="off">
                                                            <p class="text-danger address_line_1 validation_error hidden">
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Address line 2 -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_name">Address line 2</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control" id="product_name"
                                                                name="address_line_2" placeholder="Enter your address"
                                                                value="" autocomplete="off">
                                                            <p class="text-danger address_line_2 validation_error hidden">
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Business Country -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">Country*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <select
                                                                class="form-control select2 add_newbrand select2-hidden-accessible validate"
                                                                id="country" name="country" tabindex="-1"
                                                                aria-hidden="true">
                                                                <option></option>
                                                                @foreach ($countries as $country)
                                                                    <option value="{{ $country->id }}">
                                                                        {{ $country->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            <p class="text-danger country hidden validation_error"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- State / Province -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">State / Province*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <select
                                                                class="form-control select2 add_newbrand select2-hidden-accessible validate"
                                                                id="state" name="state" tabindex="-1" aria-hidden="true">

                                                            </select>
                                                            <p class="text-danger state hidden validation_error"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- City / Area -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">City / Area*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <select
                                                                class="form-control select2 add_newbrand select2-hidden-accessible validate"
                                                                id="city" name="city" tabindex="-1" aria-hidden="true">

                                                            </select>
                                                            <p class="text-danger business_city hidden validation_error">
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                                {{-- Country prefix --}}
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_name">Country prefix</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control" id="product_name"
                                                                name="country_prefix"
                                                                placeholder="Enter Your Country Prefix" value=""
                                                                autocomplete="off">
                                                            <p class="text-danger country_prefix hidden"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                {{-- Zipcode --}}
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_name">Zipcode</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left" style="width: 12% !important">
                                                        <div class="form-group">
                                                            <input type="text" class="form-control" id="product_name"
                                                                name="zipcode" placeholder="Enter Your Zipcode" value=""
                                                                autocomplete="off">
                                                            <p class="text-danger zipcode hidden"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Timezone -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">Timezone*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <select
                                                                class="form-control select2 add_newbrand select2-hidden-accessible validate"
                                                                id="product_brand_name" name="product_brand" tabindex="-1"
                                                                aria-hidden="true">
                                                                <option></option>
                                                                <!--<option value="new_brand">Add New</option>-->
                                                                <option selected="&quot;true&quot;" value="14">
                                                                    (GMT+4:00)Gulf Standard Time(Asia/Dubai)</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Base Currency -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">Base Currency*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <select
                                                                class="form-control select2 add_newbrand select2-hidden-accessible validate"
                                                                id="product_brand_name" name="product_brand" tabindex="-1"
                                                                aria-hidden="true">
                                                                <option></option>
                                                                <!--<option value="new_brand">Add New</option>-->
                                                                <option selected="&quot;true&quot;" value="14">United Arab
                                                                    Emirates Dirham(AED)</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Base Currency -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">User Name*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input id="username" name="username" class="form-control"
                                                                type="text" autocomplete="off" value="">
                                                            <p class="text-danger zipcode hidden"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- Base Currency -->
                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label for="product_brand_name">Password*</label>
                                                    </div>
                                                    <div class="col-md-8 no-padding-left">
                                                        <div class="form-group">
                                                            <input id="password" name="password" class="form-control"
                                                                type="password" autocomplete="off" value="">
                                                            <p class="text-danger zipcode hidden"></p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!--Branch list-->

                                                <div class="col-sm-12">
                                                    <div class="col-md-2 no-padding-left">
                                                        <label>Clone Data From</label>
                                                    </div>

                                                    <div class="row" id="branches">

                                                        <div class="col-md-12">
                                                            <label class="radio_container">None
                                                                <input type="radio" name="clone_from" value="none" checked>
                                                                <span class="checkmark"></span>
                                                            </label>
                                                        </div>


                                                        @foreach ($branches as $branch)
                                                            <div class="col-md-12"><label
                                                                    class="radio_container">{{ $branch->name }}<input
                                                                        type="radio" name="clone_from"
                                                                        value="{{ $branch->id }}"><span
                                                                        class="checkmark"></span></label></div>
                                                        @endforeach

                                                    </div>

                                                </div>

                                                <!--Select product to be cloned-->


                                                <div class="row" id="product_cloning">

                                                </div>

                                                <!--- Product Kitchen Selected List -->
                                                <div class="row">
                                                    <div class="col-sm-12">

                                                        <div class="save_button">
                                                            <a href="{{ url('admin/settings') }}"
                                                                class="btn theme_btn_round cancel float_btn">Cancel</a>
                                                            <button class="btn theme_btn_round save_branch" type="button">
                                                                Save
                                                            </button>

                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>

                        <!--THIS IS CONTENT DIV END-->
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection
@section('admin_css')
    <link href="{{ asset('assets/global/plugins/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/global/plugins/select2/css/select2-bootstrap.min.css') }}" rel="stylesheet"
        type="text/css" />
    <!-- DATE PICKER -->
    <link href="{{ asset('assets/global/plugins/bootstrap-datepicker/css/bootstrap-datepicker3.min.css') }}"
        rel="stylesheet" type="text/css" />
    <style>
        .save_button {
            float: right;
            margin-right: 60px;
        }

        .select2-container--bootstrap .select2-selection__clear {
            display: none;
        }

        .select2-container--bootstrap .select2-selection--single .select2-selection__arrow {
            padding: 0 16px;
            border: 1px solid #c6c8cc;
            right: 0;
            border-radius: 0 4px 4px 0;
            background: #ececec;
        }

        .select2-container--bootstrap .select2-selection--single .select2-selection__arrow b {
            left: 18px;
            border-color: black transparent transparent transparent !important;
        }

        .select2-container--bootstrap.select2-container--open .select2-selection__arrow b {
            border-color: transparent transparent black !important;
        }

    </style>


@stop
@section('admin_js')
    <script src="{{ asset('assets/global/plugins/select2/js/select2.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js') }}"
        type="text/javascript"></script>


    <script src="{{ asset('js/general.js') }}"></script>
    @include('admin.js.branch')
@stop