@extends("layouts.admin.app")

@section("page-title")
{{__("Dashboard")}}
@endSection

@section("page-nav-title")
<div class="app-title">
    <div>
        <h1><i class="fa fa-dashboard"></i>{{__("items")}}</h1>
        <p>{{__("all-items")}}</p>
    </div>
    <ul class="app-breadcrumb breadcrumb">
        <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
        <li class="breadcrumb-item"><a href="#">{{__("Dashboard")}}</a></li>
        <li class="breadcrumb-item"><a href="{{route("admin.items.index")}}">{{__("items")}}</a></li>
        <li class="breadcrumb-item"><a href="#">{{__("create")}}</a></li>
    </ul>
</div>
@endsection

@section("content")
<div class="row">
    <div class="col-lg-10 m-auto">
        <div class="tile">
            <h3 class="tile-title">{{__("create-item")}}</h3>
            <div class="tile-body">
                <form method="post" id="createItemForm" action="{{route('admin.items.store')}}" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="form-group row">
                                <label for="staticEmail" class="col-sm-4 col-form-label">{{__("main-classification")}}</label>
                                <div class="col-sm-8">
                                    <select name="main_classification_id" id="main-classification" class="form-control @if($errors->has('main_classification_id')) is-invalid @endif">
                                        <option value="">{{__("select-main-classification")}}</option>
                                        @foreach($classifications as $classification)
                                        <option {{selected("main_classification_id", $classification->id)}} value="{{$classification->id}}">{{$classification->name}}</option>
                                        @endforeach
                                    </select>
                                    @error("main_classification_id")
                                    <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="form-group row">
                                <label for="staticEmail" class="col-sm-4 col-form-label">{{__("item-code")}}</label>
                                <div class="col-sm-8">
                                    <input class="form-control @if($errors->has('item_code')) is-invalid @endif" type="text" name="item_code" id="item-code" placeholder="{{__("enter-item-code")}}" value="{{inputValue("item_code")}}">
                                    @error("item_code")
                                    <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                    @enderror
                                </div>
                            </div>
                        </div>
                    </div>

                    <div id="item-data">
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("en-name")}}</label>
                                    <div class="col-sm-8">
                                        <input class="form-control @if($errors->has('name')) is-invalid @endif" type="text" name="name" placeholder="{{__("enter-en-name")}}" value="{{inputValue("name")}}">
                                        @error("name")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("ar-name")}}</label>
                                    <div class="col-sm-8">
                                        <input class="form-control @if($errors->has('name_ar')) is-invalid @endif" type="text" name="name_ar" placeholder="{{__("enter-ar-name")}}" value="{{inputValue("name_ar")}}">
                                        @error("name_ar")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("main-unit")}}</label>
                                    <div class="col-sm-8">
                                        <select name="unit_id" id="unit_id" class="form-control @if($errors->has('unit_id')) is-invalid @endif">
                                            <option value="">{{__("select-unit")}}</option>
                                            @foreach($units as $unit)
                                            <option {{selected("unit_id", $unit->id)}} value="{{$unit->id}}">{{$unit->unit_name}}</option>
                                            @endforeach
                                        </select>
                                        @error("unit_id")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("item-type")}}</label>
                                    <div class="col-sm-8">
                                        <select name="item_type_id" id="item_type_id" class="form-control @if($errors->has('item_type_id')) is-invalid @endif">
                                            <option value="">{{__("select-item-type")}}</option>
                                            @foreach($types as $type)
                                            <option {{selected("item_type_id", $type->id)}} value="{{$type->id}}">{{$type->type}}</option>
                                            @endforeach
                                        </select>
                                        @error("item_type_id")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("unit-code")}}</label>
                                    <div class="col-sm-8">
                                        <input class="form-control @if($errors->has('unit_code')) is-invalid @endif" type="text" name="unit_code" placeholder="{{__("enter-unit-code")}}" value="{{inputValue("unit_code")}}">
                                        @error("unit_code")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("notes")}}</label>
                                    <div class="col-sm-8">
                                        <input class="form-control @if($errors->has('notes')) is-invalid @endif" type="text" name="notes" placeholder="{{__("enter-notes")}}" value="{{inputValue("notes")}}">
                                        @error("notes")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <label class="col-sm-4 col-form-label">{{__("production-line")}}</label>
                                    <div class="col-sm-8">
                                        <select name="production_line" id="production_line_id" class="form-control @if($errors->has('production_line')) is-invalid @endif">
                                            <option value="">{{__("select-production-line")}}</option>
                                            @foreach($ProductionLines as $ProductionLine)
                                            <option {{selected("production_line", $ProductionLine->id)}} value="{{$ProductionLine->id}}">{{$ProductionLine->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group row">
                                    <div class="checkbox" style="padding-top: 10px">
                                        <label style="@if(app()->getLocale() == 'en') margin-left:20px @else margin-right:20px @endif"><input type="checkbox" checked id="warranty" name="warranty" style="@if(app()->getLocale() == 'en') margin-right:20px @else margin-left:20px @endif">{{__("warranty")}}</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-6" id="warrantyPeriod">
                                <div class="form-group row">
                                    <label for="staticEmail" class="col-sm-4 col-form-label">{{__("warranty-period")}}</label>
                                    <div class="col">
                                        <input class="form-control @if($errors->has('warranty_number')) is-invalid @endif" type="number" name="warranty_number" placeholder="{{__("enter-number")}}" value="{{inputValue("warranty_number")}}">
                                        @error("warranty_number")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col">
                                        <select name="warranty_interval" class="form-control @if($errors->has('warranty_interval')) is-invalid @endif">
                                            <option value="">{{__("select-interval")}}</option>
                                            <option value="d" selected>{{__("day")}}</option>
                                            <option value="m">{{__("month")}}</option>
                                            <option value="y">{{__("year")}}</option>
                                        </select>
                                        @error("warranty_interval")
                                        <div class="input-error" style="padding-top: 10px">{{$message}}</div>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("item-image")}}</label>
                                    <div>
                                        <button class="btn btn-primary form-control button-upload-file">
                                            <input class="input-file show-uploaded" data-upload-type="single" data-imgs-container-class="uploaded-images" type="file" name="image">
                                            <span class="upload-file-content">
                                                <i class="fas fa-upload fa-lg upload-file-content-icon left"></i>
                                                <span class="upload-file-content-text">{{__("upload-image")}}</span>
                                            </span>
                                        </button>
                                    </div>
                                </div>
                                @error("image")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-5 col-sm-6">
                            <div class="uploaded-images"></div>
                        </div>

                    </div>
                    <div class="tile-footer">
                        <button class="btn btn-primary" type="submit"><i class="fa fa-fw fa-lg fa-check-circle"></i> {{__("save")}}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section("scripts")
<script type="text/javascript">
    var url = window.location.origin;

    if ($('input[name=warranty]').is(':checked')) {
        document.getElementById("warrantyPeriod").style.display = "block";
    } else {
        document.getElementById("warrantyPeriod").style.display = "none";
    }

    $('input[name=warranty]').change(function() {
        document.getElementById("warrantyPeriod").style.display = "block";
        if ($(this).is(':checked')) {
            document.getElementById("warrantyPeriod").style.display = "block";
        } else {
            document.getElementById("warrantyPeriod").style.display = "none";
        }
    });

    if ($("#main-classification").val() == "") {
        document.getElementById("item-data").style.display = "none";
    }

    $("#main-classification").on("change", function() {
        document.getElementById("item-data").style.display = "block";
        if ($("#main-classification").val() !== "") {
            $.ajax({
                type: "get",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                url: url + "/en/ajax/items/get-item-code/" + $("#main-classification").val(),
                success: function(response) {
                    let data = response;
                    $("#item-data").show();
                    $("#item-code").val(data);
                },
                error: function(response) {}
            });
        } else {
            $("#item-data").hide();
        }
    });
</script>
<script type="text/javascript">
    $("#main-classification").select2({
        placeholder: "{{__('select-main-classification')}}",
        width: "100%",
    });
    $("#unit_id").select2({
        placeholder: "{{__('select-unit')}}",
        width: "100%",
    });
    $("#item_type_id").select2({
        placeholder: "{{__('select-type')}}",
        width: "100%",
    });
    $("#production_line_id").select2({
        placeholder: "{{__('select-production-line')}}",
        width: "100%",
    });
</script>
@endsection