<div class="container containerProfitCenter" >

    <x-contact-add-popup></x-contact-add-popup>
    <x-address-add-popup></x-address-add-popup>

<form class="profitCenterForm needs-validation" enctype="multipart/form-data">
    @csrf
    <div class="form-group row">
        <label for="profitCenterName" class="col-sm-2 col-form-label">Név:</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="profitCenterName" placeholder="Írja be a nevét" name="name">
        </div>
    </div>
    <div class="form-group row">
        <label for="profitCenterHooreycaId" class="col-sm-2 col-form-label">Hooreyca ID:</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" id="profitCenterHooreycaId" placeholder="ID" name="hooreycaId" maxlength="6">
        </div>
        <label for="profitCenterNameId" class="col-sm-1 col-form-label">betűkód:</label>
        <div class="col-sm-5">
            <input type="text" class="form-control" id="profitCenterNameId" placeholder="Írja be a betűkódot" name="nameId" maxlength="6">
        </div>
    </div>


    <div class="form-group row">
        <label for="profitCenterContacts" class="col-sm-2 col-form-label">Kapcsolattartók:</label>
        <div class="col-sm-10">
            <div class="form-group row">
                <div class="col-sm-10">
                    <button type="button" class="btn btn-primary buttonNewContact"  >Új kapcsolattartó hozzáadása</button>
                </div>
            </div>
            <div class="form-group row">
                <div class="col">
                    <table class="table table-striped table-hover table-sm contactTable">
                        <thead>
                        <tr>
                            <th scope="col">#</th>
                            <th scope="col">Név</th>
                            <th scope="col">Email</th>
                            <th scope="col">Telefon</th>
                            <th scope="col">Akció</th>
                        </tr>
                        </thead>
                        <tbody>

                        <template data-name="profitCenterContactTableRow">
                        <tr>
                            <th scope="row">[[rowNum]]
                            <input type="text" name="contactId" value="[[id]]" style="width: 2em;display: none"/>
                            </th>
                            <td>[[name]]</td>
                            <td>[[email]]</td>
                            <td>[[phone]]</td>
                            <td>
                                <button type="button" class="btn btn-danger buttonDelete"  data-toggle="tooltip" data-placement="bottom" title="Törlés">
                                    <span class="fas fa-trash"></span>
                                </button>
                                <button type="button" class="btn btn-info buttonEdit" data-toggle="tooltip" data-placement="bottom" title="Szerkeszt">
                                    <span class="fas fa-pencil-alt"></span>
                                </button>
                            </td>
                        </tr>
                        </template>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>


    <div class="form-group row">
        <label for="profitCenterOrderEmail" class="col-sm-2 col-form-label">E-mail:</label>
        <div class="col-sm-10">
            <input name="email" type="text"
                   class="form-control" id="profitCenterOrderEmail"
                   placeholder="Írja be az e-mail címet"
                   data-inputmask="'alias': 'email'"
                   data-required="true"
            >
        </div>
    </div>
    <div class="form-group row">
        <label for="profitCenterPostCode" class="col-sm-2 col-form-label">Irányitószám:</label>
        <div class="col-sm-2">
            <input type="text" class="form-control" id="profitCenterPostCode" placeholder="Irsz" name="postCode" maxlength="6">
        </div>
        <label for="profitCenterCity" class="col-sm-1 col-form-label">Város:</label>
        <div class="col-sm-7">
            <input type="text" class="form-control" id="profitCenterCity" placeholder="Írja be a város nevét" name="city" maxlength="99">
        </div>
    </div>
    <div class="form-group row">
        <label for="profitCenterAddress" class="col-sm-2 col-form-label">Cím:</label>
        <div class="col-sm-10">
            <input name="street" type="text"
                   class="form-control" id="profitCenterAddress"
                   placeholder="Írja be a profitcenter címét"
            >
        </div>
    </div>
    <div class="form-group row">
        <label for="profitCenterPhone" class="col-sm-2 col-form-label">Telefonszám:</label>
        <div class="col-sm-10">
            <input name="phone" type="text"
                   class="form-control" id="profitCenterPhone"
                   placeholder="Írja be a telefonszámot"
                   data-inputmask="'alias': 'phoneNumber'"
            >
        </div>
    </div>

    <div class="form-group row">
        <label for="profitCenterFax" class="col-sm-2 col-form-label">Mobil:</label>
        <div class="col-sm-10">
            <input name="mobil" type="text"
                   class="form-control" id="profitCenterFax"
                   placeholder="Írja be a faxszámot"
                   data-inputmask="'alias': 'phoneNumber'"
            >
        </div>
    </div>





    <div class="form-group row">
        <label for="note" class="col-sm-2 col-form-label">Szállítási cím azonos:</label>
        <div class="col-sm-10">
            <div class="input-group">
                <div  class="btn-group customRadioBtnGroup">
                    <a class="btn btn-primary btn-sm active" data-toggle="addressEqual" data-title="1">Igen</a>
                    <a class="btn btn-primary btn-sm notActive" data-toggle="addressEqual" data-title="0">Nem</a>
                </div>
                <input type="hidden" name="addressEqual" value="" >
            </div>

        </div>
    </div>

    <div class="form-group row containerMultiAddressSwitch d-none">
        <label for="note" class="col-sm-2 col-form-label">Több szállítási cím:</label>
        <div class="col-sm-10">
            <div class="input-group">
                <div  class="btn-group customRadioBtnGroup">
                    <a class="btn btn-primary btn-sm notActive" data-toggle="multiAddress" data-title="1">Igen</a>
                    <a class="btn btn-primary btn-sm active" data-toggle="multiAddress" data-title="0">Nem</a>
                </div>
                <input type="hidden" name="multiAddress" value="" >
            </div>

        </div>
    </div>

    <div class="form-group row d-none containerMultiAddress">
        <label for="profitCenterAddresses" class="col-sm-2 col-form-label">Szállítási cím(ek):</label>
        <div class="col-sm-10">
            <div class="form-group row">
                <div class="col-sm-10">
                    <button type="button" class="btn btn-primary buttonNewAddress"  >Új cím hozzáadása</button>
                </div>
            </div>
            <div class="form-group row">
                <div class="col">
                    <table class="table table-striped table-hover table-sm addressTable">
                        <thead>
                        <tr>
                            <th scope="col">#</th>
                            <th scope="col">Név</th>
                            <th scope="col">Irsz</th>
                            <th scope="col">Település</th>
                            <th scope="col">Cím</th>
                            <th scope="col">Akció</th>
                        </tr>
                        </thead>
                        <tbody>

                        <template data-name="profitCenterAddressTableRow">
                            <tr>
                                <th scope="row">[[rowNum]]
                                    <input type="text" name="addressId[]" value="[[id]]" style="width: 2em;"/>
                                </th>
                                <td>[[name]]</td>
                                <td>[[postCode]]</td>
                                <td>[[city]]</td>
                                <td>[[street]]</td>
                                <td>
                                    <button type="button" class="btn btn-danger buttonDelete"  data-toggle="tooltip" data-placement="bottom" title="Törlés">
                                        <span class="fas fa-trash"></span>
                                    </button>
                                    <button type="button" class="btn btn-info buttonEdit" data-toggle="tooltip" data-placement="bottom" title="Szerkeszt">
                                        <span class="fas fa-pencil-alt"></span>
                                    </button>
                                </td>
                            </tr>
                        </template>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="form-group row">
        <label for="profitCenterUserName" class="col-sm-2 col-form-label">Belépési név:</label>
        <div class="col-sm-10">
            <input name="user[id]" type="hidden" style="width: 3em;" value="{{$itemData['userId'] ??''}}">
            <input name="user[name]" type="text"
                   class="form-control" id="profitCenterUserName"
                   placeholder="Írja be a felhasználó nevet"
                   value="{{$itemData['userName']??''}}"
            >
        </div>
    </div>


    <div class="form-group row">
        <label for="profitCenterUserPassword" class="col-sm-2 col-form-label">Jelszó:</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" id="profitCenterUserPassword"
                   placeholder="jelszó" name="user[password]" minlength="8">
        </div>
        <label for="profitCenterUserRePassword" class="col-sm-1 col-form-label text-right">újra:</label>
        <div class="col-sm-5">
            <input type="text" class="form-control" id="profitCenterUserRePassword" placeholder="jelszó újra"
                   name="user[repassword]" minlength="8">
        </div>
    </div>


    <div class="form-group row">
        <label for="note" class="col-sm-2 col-form-label">Megjegyzés:</label>
        <div class="col-sm-10">
            <textarea class="form-control" rows="3" placeholder="Ha kiván itt tud megjegyzést írni" name="note"></textarea>
        </div>
    </div>

    <div class="form-group row">
        <label for="note" class="col-sm-2 col-form-label">Aktív:</label>
        <div class="col-sm-10">
            <div class="input-group">
                <div  class="btn-group customRadioBtnGroup">
                    <a class="btn btn-primary btn-sm active" data-toggle="canSee" data-title="1">Igen</a>
                    <a class="btn btn-primary btn-sm notActive" data-toggle="canSee" data-title="0">Nem</a>
                </div>
                <input type="hidden" name="canSee" >
            </div>

        </div>
    </div>
    <div class="form-group row">
     <label for="hooreycaDataActive" class="col-sm-2 col-form-label">Hooreyca adatátadás:</label>
     <div class="col-sm-10">
         <div class="input-group">
             <div  class="btn-group customRadioBtnGroup">
                 <a class="btn btn-primary btn-sm active" data-toggle="hooreycaDataActive" data-title="1">Igen</a>
                 <a class="btn btn-primary btn-sm notActive" data-toggle="hooreycaDataActive" data-title="0">Nem</a>
             </div>
             <input type="hidden" name="hooreycaDataActive" >
         </div>

     </div>
 </div>

    <div class="form-group row">
        <label for="profitCenterName" class="col-sm-2 col-form-label">Profitcenterek:</label>
        <div class="col-sm-10">
            <div class="container">
                <div class="row">
                    @foreach(array_chunk($supplier, 2) as $items)
                        @foreach($items as $ItemData)
                            <div class="col"><input class="profitCenterSelectCheckbox" type="checkbox" name="supplier" value="{{$ItemData['name']}}">{{$ItemData['name']}}</div>
                        @endforeach
                        <div class="w-100"></div>
                    @endforeach
                </div>
            </div>
        </div>

    </div>

    <div class="form-group row">
        <div class="col-sm-10">
            <button type="button" class="btn btn-success FormSaveButton">Mentés</button>
        </div>
    </div>
</form>
</div>

<style>
    .contactTable .btn{
        padding: 1px 6px;
    }


</style>
<script>

    @isset($itemData)
    console.log('most kell feldolgozn az adatokat, es beallitani az app-ban ');
    console.log({!! json_encode($itemData) !!});
    APP.ProfitCenter=new DataModelProfitCenter({!! json_encode($itemData) !!});
    APP.ProfitCenterAdmin.ProfitCenter=APP.ProfitCenter;
    $(document).ready(function() {
        //$(".containerSupplier .supplierForm .productCategorySelect").val(['Tojás', 'Zöldség_gyümölcs']);
        APP.ProfitCenterAdmin.setDetailsViewData();
    });
    @endisset




</script>
