@extends('layouts.admin')

@section('content')
<div class="container">
    <div class="content">
        <div class="card">
            <div class="card-header">
                <h6 class="card-title">@lang('keyword.add-new')ផលិតផល</h6>
            </div>
            <div class="card-body">
                    @if(\Illuminate\Support\Facades\Session::has('success'))
                        <div class="alert alert-success">
                            <span class="text-success">{{ Session::get('success') }}</span>
                        </div>
                    @endisset

                <form class="" action="{{ route('admin.product.store') }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="form-group row">
                        <label class="col-form-label col-lg-2">@lang('keyword.name')</label>
                        <div class="col-lg-10 pb-2">
                            <input type="text" required name="title" class="form-control" value="" placeholder="@lang('keyword.name')">
                        </div>
                        <label class="col-form-label col-lg-2">កូដផលិតផល</label>
                        <div class="col-lg-10 pb-2">
                            <input type="text" required name="code" class="form-control" value="" placeholder="កូដផលិតផល">
                        </div>
                        <label class="col-form-label col-lg-2">@lang('keyword.price')($)</label>
                        <div class="col-lg-10 pb-2">
                            <input type="number" required name="price" class="form-control" value="0" step=any placeholder="@lang('keyword.price')">
                        </div>
                        <label class="col-form-label col-lg-2">រូបភាព</label>
                        <div class="col-lg-10 pb-2">
                            <input type="file" accept="image/*" required name="photo" class="form-control" value="" placeholder="រូបភាព">
                        </div>
                        <label class="col-form-label col-lg-2">ប្រភេទផលិតផល</label>
                        <div class="col-lg-10 pb-2">
                            <select name="catId" required class="form-control" id="catId">
                                <option value="">--ជ្រើសរើសប្រភេទផលិតផល--</option>
                                @if(count($cats))
                                    @foreach($cats as $cat)
                                        <option value="{{ $cat->id }}">{{ $cat->title }}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                        <label class="col-form-label col-lg-2">ក្រុមផលិតផល</label>
                        <div class="col-lg-10 pb-2">
                            <select name="groupId" required class="form-control" id="groupId">
                                <option value="">--ជ្រើសរើសប្រភេទផលិតផល--</option>
                            </select>
                        </div>
                        <label class="col-form-label col-lg-2">ស្ថានភាព</label>
                        <div class="col-lg-10 pb-2">
                            <select name="status" required class="form-control">
                                <option value="1">បើកដំណើរការ</option>
                                <option value="0">បិទដំណើរការ</option>
                            </select>
                        </div>
                    </div>
                    <div class="">
                        <input type="submit" name="" class="btn btn-primary" value="@lang('keyword.create')">
                    </div>
            </div>

            </form>
        </div>

    </div>
</div>
</div>
<script type="text/javascript">
    $(document).ready(function(){
        $('#catId').on('change',function(){
            if($(this).val()) {
                $.ajax({
                    url: '{{ route('products.getGroups') }}',
                    method: 'get',
                    data: {id:$(this).val()},
                    success: function(data){
                        $('#groupId').html('').append($('<option>', {
                            value: '',
                            text : '--ជ្រើសរើសប្រភេទផលិតផល--'
                        }));
                        $.each(data, function (i, item) {
                            if(item.active === 1){
                                $('#groupId').append($('<option>', {
                                    value: item.id,
                                    text : item.title
                                }));
                            }
                            else{

                            }
                        })
                    },
                    error: function(){
                        alert('Server Error!');
                    }
                })
            } else {
                $('#groupId').html('').append($('<option>', {
                    value: '',
                    text : '--ជ្រើសរើសប្រភេទផលិតផល--'
                }));
            }
        });
    });
</script>
@endsection