@extends('admin.layout.master')
@section('title', 'Add Customer')
@section('content')
    <style>
        label {
            font-size: 13px
        }

        .table th,
        .table td {
            padding: 0rem;
            padding-right: 0.35rem;
            padding-left: 0.35rem;
        }

        .nav-tabs .nav-link.active,
        .nav-tabs .nav-item.show .nav-link {
            border-top: 1px solid #2c7f6f;
            border-bottom: 1px solid #e2e2e2;
            border-left: 1px solid #2c7f6f;
            border-right: 1px solid #2c7f6f;
            background: none !important;
            color: #2c7f6f;
        }

        .nav-link:hover {
            border-bottom: #2c7f6f !important;
        }

        a.nav-link.active:hover {
            border-bottom: #e2e2e2 !important;
        }

        a.nav-link {
            color: #9e9e9e;
        }

        .nav-tabs {
            border-bottom: 1px solid #2c7f6f;
        }

        .gj-datepicker-bootstrap [role=right-icon] button .gj-icon,
        .gj-datepicker-bootstrap [role=right-icon] button .material-icons {
            top: 4px;
        }

    </style>
    {{-- <div class="page-wrapper">
    <div class="content container-fluid">
      <div class="card-box">
          <div class="card-block"> --}}
    <div class="card sina-card">
        <div class="card-header card-header-s">
            <h4>{{ ucfirst($routeGroup) }} Info</h4>
        </div>
        @if ($errors->any())
            @foreach ($errors->all() as $error)
                <div style="color:red">{{ $error }}</div>
            @endforeach
        @endif
        <form action="{{ route('customer.store') }}" method="post">
            @csrf
            <div class="card-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="row mt-3 mb-3">
                            <div class="col-6">
                                <h5 class="text-bold card-title"></h5>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="row">
                                    <div class="col-md-4">
                                        <label>Group Name</label>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <select class="custom-select" id="group_id" name="group_id">
                                                    <option selected value="">Choose...</option>
                                                    @foreach ($groups as $group)
                                                        <option value="{{ $group->id }}">{{ $group->name_eng }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                                <a href="{{ route('group.index', ['idx' => 2]) }}"
                                                    class="btn btn-success btn-sm"><i class="fas fa-plus"></i></a>
                                                {{-- <a data-toggle="modal" data-target="#addGroup" class="btn btn-success btn-sm"><i class="fas fa-plus"></i></a> --}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="row">
                                    <div class="col-md-4">
                                        <label>Code *</label>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group">
                                            <input type="text" class="form-control" id="code" name="code"
                                                value="{{ $code }}" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="row">
                                    <div class="col-md-4">
                                        <label>Name *</label>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group">
                                            <input type="text" value="{{ old('name_eng') }}" class="form-control"
                                                id="name" name="name_eng" />
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="row">
                                    <div class="col-md-4">
                                        <label>Local Name</label>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group">
                                            <input type="text" class="form-control" value="{{ old('name_local') }}"
                                                id="localname" name="name_local" />
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="row d-flex">
                                    <div class="col-md-2 pr-0">
                                        <label> Party Type</label>
                                    </div>
                                    <div class="col-md-5 px-0" style="margin-top: -6px">
                                        <div class="row">
                                            <div class="form-group col-md-3">
                                                <div class="row">
                                                    <input style="max-width: 15px;" type="radio" checked
                                                        class="form-control" name="party_type" id="default" value="2" />
                                                    <label style="padding-top: 10px; padding-left: 5px;"
                                                        for="default">Default</label>
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3">
                                                <div class="row">
                                                    <input style="max-width: 15px;" type="radio" class="form-control"
                                                        name="party_type" id="wv" value="3" />
                                                    <label style="padding-top: 10px; padding-left: 5px;" for="wv">With
                                                        Vendor</label>
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3">
                                                <div class="row">
                                                    <input style="max-width: 15px;" id="sr_box" onclick="shopEnable(this)"
                                                        type="radio" class="form-control" name="party_type" value="4" />
                                                    <label style="padding-top: 10px; padding-left: 5px;"
                                                        for="sr_box">S/R</label>
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3" id="shop_field" style="display: none">
                                                <div class="row">
                                                    <select style="width:100%" class="custom-select" id="shop"
                                                        name="shop[]" multiple>
                                                        @foreach ($shops as $shop)
                                                            <option value="{{ $shop->id }}">
                                                                {{ $shop->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            {{-- <div class="form-group col-md-3">
                                                <div class="row">
                                                    <input style="max-width: 25px;" type="radio" class="form-control" name="party_type" value="5"/>
                                                    <label style="padding-top: 10px; padding-left: 5px;" for="">SHOP</label>
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3">
                                                <div class="row">
                                                    <input style="max-width: 25px;" type="radio" class="form-control" name="party_type" value="6"/>
                                                    <label style="padding-top: 10px; padding-left: 5px;" for="">DEALER</label>
                                                </div>
                                            </div> --}}
                                        </div>

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

                            <div class="col-md-12">
                                <ul class="nav nav-tabs" id="myTab" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab"
                                            aria-controls="home" aria-selected="true">Master Details</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile"
                                            role="tab" aria-controls="profile" aria-selected="false">Other Data</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact"
                                            role="tab" aria-controls="contact" aria-selected="false">Cash In Bank</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" id="contact-tab" data-toggle="tab" href="#credentials"
                                            role="tab" aria-controls="contact" aria-selected="false">Credentials</a>
                                    </li>
                                </ul>
                                <div class="tab-content pt-3" id="myTabContent">
                                    <div class="tab-pane fade show active" id="home" role="tabpanel"
                                        aria-labelledby="home-tab">
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Cost Center</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <select class="custom-select" id="cost_center"
                                                                name="cost_center">
                                                                <option selected value="0">Choose...</option>
                                                                @foreach ($cost_centers as $cost_center)
                                                                    <option value="{{ $cost_center->id }}">
                                                                        {{ $cost_center->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            <a href="{{ route('costcenter.index') }}" id="basic-addon2"
                                                                class='btn btn-danger ml-2 btn-sm'> <i
                                                                    class="fas fa-plus"></i></a>
                                                        </div>

                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Type</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <select class="custom-select" id="type" name="type">
                                                                <option selected value="0">Choose...</option>
                                                                @foreach ($types as $type)
                                                                    <option value="{{ $type->id }}">
                                                                        {{ $type->name_eng }}
                                                                    </option>
                                                                @endforeach
                                                            </select>
                                                            <a href="{{ route('type.create') }}" id="basic-addon2"
                                                                class='btn btn-danger ml-2 btn-sm'> <i
                                                                    class="fas fa-plus"></i></a>
                                                        </div>
                                                    </div>

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

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Commission(%)</label>
                                                    <input type='checkbox' onchange="CheckCommission(this)">
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <input type="number" id="Commission" step="0.01" style="display: none"
                                                                class="form-control input-sm" name="commission" />
                                                        </div>
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Commission Type</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <select class="custom-select" id="commissionType"
                                                                name="commission_type">
                                                                <option value="1">Fixed</option>
                                                                <option value="2">Customized</option>
                                                            </select>
                                                        </div>
                                                    </div>

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

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Limit Apply</label>
                                                    <input type='checkbox' id="limitapply" name="limit_apply"
                                                        onchange="CheckLimitApply(this)">
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <input type="number" id="creditLimitAmount"
                                                                style="display: none" class="form-control input-sm"
                                                                name="credit_limit_amount" />
                                                            <label id="creditLimitAmountlabel" style="display: none"> &nbsp
                                                                Credit limit(Amount)</label>
                                                        </div>
                                                    </div>

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

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Credit limit(Day)</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <input type="number" value="{{ old('credit_limit_day') }}"
                                                                id="creditLimitDay" class="form-control input-sm"
                                                                name="credit_limit_day" />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {{-- starting newly added --}}
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Other Commission Name</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <input type="text"
                                                                value="{{ old('other_commission_title') }}"
                                                                id="otherCommissionTitle" class="form-control input-sm"
                                                                name="other_commission_title" />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Other Commission</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <input type="number" value="0" step=".001"
                                                                id="otherCommission" class="form-control input-sm"
                                                                name="other_commission" />
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Commission Calculation Type</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <select type="number" value="{{ old('com_calc_type') }}"
                                                                id="comCalcType" class="custom-select"
                                                                name="com_calc_type">
                                                                <option value="1">+</option>
                                                                <option value="0">-</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Private Depot</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <div class="input-group">
                                                            <select name="depot_id" class="select_2 vendor_live form-control">
                                                            </select>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Block Free</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-check form-check-inline">

                                                        <label>
                                                            Yes
                                                            <input class="form-check-input" name="block_free"
                                                                id="block_free_yes" type="radio" value="1">
                                                        </label>
                                                    </div>
                                                    <div class="form-check form-check-inline">

                                                        <label>
                                                            No
                                                            <input class="form-check-input" checked name="block_free" id="block_free_no"
                                                                type="radio" value="0">
                                                        </label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        {{-- starting newly added --}}

                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Store</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-check form-check-inline">

                                                        <label>
                                                            Current Store
                                                            <input class="form-check-input" checked name="stores"
                                                                id="cstore" type="radio" value="1">
                                                        </label>
                                                    </div>
                                                    <div class="form-check form-check-inline">

                                                        <label>
                                                            All Store
                                                            <input class="form-check-input" name="stores" id="allstore"
                                                                type="radio" value="2">
                                                        </label>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>



                                    </div>
                                    <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Mobile</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="number" value="{{ old('mobile') }}"
                                                            class="form-control" id="mobile" name="mobile" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Email *</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="email" value="{{ old('email') }}"
                                                            class="form-control" id="email" name="email" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Address</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="text" value="{{ old('address') }}"
                                                            class="form-control" id="address" name="address" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Bank Name</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="text" value="{{ old('bank_name') }}"
                                                            class="form-control" id="bank_name" name="bank_name" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Swift Code</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="number" value="{{ old('swift_code') }}"
                                                            class="form-control" id="swift_code" name="swift_code" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Account Name</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="text" value="{{ old('acc_name') }}"
                                                            class="form-control" id="acc_name" name="acc_name" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Account Number</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="number" value="{{ old('acc_number') }}"
                                                            class="form-control" id="acc_number" name="acc_number" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="credentials" role="tabpanel"
                                        aria-labelledby="credentials-tab">
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>User Name *</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="text" value="{{ old('user_name') }}"
                                                            class="form-control" id="user_name" name="user_name" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>Password *</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="password" value="{{ old('password') }}"
                                                            class="form-control" id="password" name="password" />
                                                    </div>

                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <label>SHOWROOM</label>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="form-group">
                                                        <input type="text" value="{{ old('showroom_name') }}"
                                                            class="form-control" id="showroom_name"
                                                            name="showroom_name" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <button type="submit" class="btn btn-primary btn-sm mt-3 ml-3">Submit</button>
                        <a href="{{ route('customer.index') }}" type="button" class="btn btn-danger btn-sm mt-3 ml-3">Go
                            Back</a>
                    </div>
                </div>
            </div>
        </form>
    </div>
    {{-- @include('inventory.modal.add_group') --}}
    <script src="{{ asset('inventory/blade_js/common.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('.custom-select').select2();
            partySearch('vendor_live', 2);
        });
        const CheckCommission = (v) => {
            if ($(v).prop("checked")) {
                // checked
                $('#Commission').show();

            } else {
                $('#Commission').val(0);
                $('#Commission').hide();

            }
        }
        const shopEnable = (v) => {
            if ($(v).prop("checked")) {
                $('#shop_field').show();
            } else {
                $('#shop_field').hide();
            }
        }
        const CheckLimitApply = (v) => {
            if ($(v).prop("checked")) {
                // checked
                $('#creditLimitAmount').show();
                $('#creditLimitAmountlabel').show();
                $('#limitapply').val(1);
            } else {
                $('#creditLimitAmount').hide();
                $('#creditLimitAmountlabel').hide();
                $('#limitapply').val(2);
                $('#creditLimitAmount').val(0);

            }
        }
        // for type
        const types = (v) => {
            if ($(v).prop("checked")) {
                // checked
                $('#PartyType').val(3);
            } else {
                $('#PartyType').val(2);
            }
        }
    </script>

@endsection