@extends('layouts.app')

@section('title', 'Edit Brand')
@section('breadcrumb', 'Manage Brand')
@section('sub-breadcrumb')
    {{-- <span class="kt-subheader__breadcrumbs-separator"></span> --}}
    <a class="kt-subheader__breadcrumbs-link">
        Edit Brand
    </a>
@endsection
@section('brand', 'kt-menu__item--open kt-menu__item--here')
@section('list-brand', 'kt-menu__item--active')
@section('content')
<div class="kt-portlet">
    <div class="kt-portlet__body">
        @include('layouts.notification')
        <div class="col-md-5">
            <form action="{{route('brand.update')}}" method="POST" enctype="multipart/form-data">
                @csrf
                <input type="hidden" name="id" value="{{$brand['id']}}">
                <div class="form-group">
                    <label>Name Brand <span style="color:red;">*</span> :</label>
                    <div class="input-group">
                        <div class="input-group-prepend"><span class="input-group-text"><i class="flaticon-medal"></i></span></div>
                        <input type="text" id="name" name="name" class="form-control m-input" placeholder="E.g: Janji Jiwa" data-col-index="0"
                        value="{{$brand['name']}}">
                    </div>
                </div>
                <div class="form-group">
                    <label>Brand Logo <span style="color:red;">*</span> :</label> <br/>
                    <img src="{{env('AWS_URL').$brand['logo'] }}" alt="current image" style="height:150px" />
                    &nbsp;&nbsp;&nbsp;&nbsp; <i class="flaticon2-right-arrow"></i>&nbsp;&nbsp;&nbsp;&nbsp;
                    <img id="blah" src="#" alt="new image" style="height:150px" />
                    <div class="input-group">
                        <input type="file" id="imgInp" name="logo" class="form-control m-input" placeholder="E.g: Janji Jiwa" data-col-index="0">
                    </div>
                </div>
                <div class="form-group">
                    <label>Owner Brand <span style="color:red;">*</span> :</label>
                    <div class="input-group">
                        <select name="owner" id="owner" class="form-control">
                            <option value="">-- Select Owner --</option>
                            @foreach ($owner as $item => $value)
                                <option value="{{$value['id']}}" {{($brand['id_owner'] == $value['id']) ? 'selected' : ''}}>{{$value['name']}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label>Brand Slug <span style="color:red;">*</span> :</label>
                    <div class="input-group">
                        <div class="input-group-prepend"><span class="input-group-text"><i class="flaticon-earth-globe"></i></span></div>
                    <input type="text" id="slug" name="slug" class="form-control m-input" placeholder="E.g: JJ, JT" data-col-index="0" value="{{$brand['slug']}}">
                    </div>
                </div>


                <div class="form-group">
                    <label>Moka :</label> <br/>
                    <div class="input-group">
                        <select name="id_moka[]" id="moka" class="form-control" multiple="multiple">
                            @foreach ($moka as $item => $value)
                                <option value="{{$value['id']}}" @foreach ($brand['brand_moka'] as $key => $moka) {{ ($moka['id_moka'] == $value['id'] ? "selected" : "") }} @endforeach>{{$value['name']}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="form-group">
                    <label>Accurate<span style="color:red;">*</span> :</label>
                    <div class="input-group">
                        <select name="id_accurate" id="accurate" class="form-control">
                            <option value="">-- Select Accurate --</option>
                            @foreach ($accurate as $item => $value)
                                <option value="{{$value['id']}}" {{($brand['id_accurate'] == $value['id']) ? 'selected' : ''}}>{{$value['name']}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="form-group pull-right">
                    <button type="reset" class="btn btn-secondary">Reset</button>
                    <button type="submit" class="btn btn-primary">Save</button>
                </div>
            </form>
        </div>
    <div class="kt-separator kt-separator--dashed"></div>
    </div>
</div>
@endsection

@section('custom-script')
    <script>
        $(document).ready(function(){
            $('#moka').select2({
                placeholder: " Eg: Janji Jiwa Dummy"
            });
        })
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                reader.onload = function(e) {
                    $('#blah').attr('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }

        $("#imgInp").change(function() {
            readURL(this);
        });
    </script>
@endsection