@extends('layout.app')
@section('title', 'Create Product')
@push('header_script')
@endpush
@section('content')
    <div class="app-hero-header d-flex align-items-center">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="javascript:void(0);">Create Product</a>
            </li>
        </ol>
        <div class="ms-auto d-lg-flex flex-row">
            <div class="d-flex flex-row gap-1 day-sorting">
                <a href="{{ route('product.index') }}" class="btn btn-sm btn-primary"><i class="ri-arrow-left-circle-fill"></i>
                    Back</a>
            </div>
        </div>
    </div>
    <div class="app-body">
        <div class="card-body">
            <div class="row gx-3">
                <div class="col-sm-12">
                    <div class="card mb-3">
                        <div class="card-body">
                            {!! Form::open([
                                'route' => ['product.store'],
                                'onsubmit' => 'BtnSubmit.disabled = true',
                                'class' => 'row g-3 needs-validation',
                                'method' => 'post',
                                'autocomplete' => 'off',
                            ]) !!}
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="product_category_id">Category<span
                                        class="text-danger">*</span></label>
                                {!! Form::select('product_category_id', ['' => '--Select--'] + $category, old('product_category_id'), [
                                    'class' => 'form-control select2',
                                    'id' => 'product_category_id',
                                    'required',
                                ]) !!}
                                <div class="text-danger">{{ $errors->first('product_category_id') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="product_name">Product Name<span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="product_name" name="product_name" required
                                    value="{{ old('product_name') }}">
                                <div class="text-danger">{{ $errors->first('product_name') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="units">Units<span class="text-danger">*</span></label>
                                {!! Form::select(
                                    'units',
                                    ['' => '--Select--', 'liter' => 'Liter', 'kg' => 'KG', 'piece' => 'Piece', 'other' => 'Other'],
                                    old('units'),
                                    ['class' => 'form-control', 'id' => 'units', 'required'],
                                ) !!}
                                <div class="text-danger">{{ $errors->first('units') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="gst_applicable">GST Applicable<span
                                        class="text-danger">*</span></label>
                                {!! Form::select(
                                    'gst_applicable',
                                    ['' => '--Select--', 'yes' => 'Applicable', 'no' => 'Not-Applicable'],
                                    old('gst_applicable'),
                                    ['class' => 'form-control', 'id' => 'gst_applicable', 'required'],
                                ) !!}
                                <div class="text-danger">{{ $errors->first('gst_applicable') }} </div>
                            </div>
                            <div class="col-md-4 col-12 ApplicableYes" style="display: none">
                                <label class="form-label" for="tax_group_id">Tax Slab<span
                                        class="text-danger">*</span></label>
                                {!! Form::select('tax_group_id', ['' => '--Select--'] + $taxGroup, old('tax_group_id'), [
                                    'class' => 'form-control select2',
                                    'id' => 'tax_group_id',
                                ]) !!}
                                <div class="text-danger">{{ $errors->first('tax_group_id') }} </div>
                            </div>
                            <div class="col-md-4 col-12 ApplicableYes" style="display: none">
                                <label class="form-label" for="hsn_code">HSN Code<span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="hsn_code" name="hsn_code"
                                    {{-- * is using just because we are making it required in jquery --}} value="{{ old('hsn_code') }}">
                                <div class="text-danger">{{ $errors->first('hsn_code') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="opening_stock">Opening Stock<span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control number" id="opening_stock" name="opening_stock"
                                    required value="{{ old('opening_stock') }}">
                                <div class="text-danger">{{ $errors->first('opening_stock') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="stock_alert">Stock Alert<span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control number" id="stock_alert" name="stock_alert"
                                    required value="{{ old('stock_alert') }}">
                                <div class="text-danger">{{ $errors->first('stock_alert') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="rate_per">Rate Per<span class="text-danger">*</span></label>
                                <input type="text" class="form-control floatnumber" id="rate_per" name="rate_per"
                                    required value="{{ old('rate_per') }}">
                                <div class="text-danger">{{ $errors->first('rate_per') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <label class="form-label" for="value">Value<span class="text-danger">*</span></label>
                                <input type="text" class="form-control floatnumber readonly" id="value"
                                    name="value" readonly required value="{{ old('value') }}">
                                <div class="text-danger">{{ $errors->first('value') }} </div>
                            </div>
                            <div class="col-md-4 col-12">
                                <input type="checkbox" class="mt-5" id="application_reverse_charge"
                                    name="application_reverse_charge" value="yes">
                                <label class="form-label" for="application_reverse_charge">Applicable for Reverse
                                    Charge</label>
                                <div class="text-danger">{{ $errors->first('application_reverse_charge') }} </div>
                            </div>
                            <div class="col-md-12 col-12">
                                <label class="form-label" for="remark">Remark</label>
                                <textarea name="remark" id="remark" class="form-control" cols="30" rows="2"></textarea>
                                <div class="text-danger">{{ $errors->first('remark') }} </div>
                            </div>
                            <div class="col-xl-12 col-md-12 col-12">
                                <button class="btn btn-primary mt-1" id="BtnSubmit" type="submit">Submit</button>
                            </div>
                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('footer_script')
    <script>
        $('.number').keyup(function(e) {
            if (/\D/g.test(this.value)) {
                this.value = this.value.replace(/\D/g, '');
            }
        });

        $('.floatnumber').on('input', function() {
            this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
        });


        $('#gst_applicable').on('change', function() {
            let gst_applicable = $(this).val();
            if (gst_applicable == 'yes') {
                $('.ApplicableYes').show();
                $('#tax_group_id').attr('required', true);
                $('#hsn_code').attr('required', true);
            } else {
                $('.ApplicableYes').hide();
                $('#tax_group_id').attr('required', false);
                $('#hsn_code').attr('required', false);
            }
        });

        $('#opening_stock, #rate_per').on('change', function() {
            let opening_stock = $('#opening_stock').val();
            let rate_per = $('#rate_per').val();
            let value = Number(opening_stock) * Number(rate_per);
            $('#value').val(value);
        });
    </script>
@endpush