@extends ('backend.layouts.app')

@section ('title', __('pointcollector::labels.backend.pointcollector.management') . ' | ' . __('pointcollector::labels.backend.pointcollector.create'))

@section('breadcrumb-links')
    @include('pointcollector::includes.breadcrumb-links')
@endsection

@push('after-styles')
    {{ style('assets/plugins/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css') }}
@endpush

@section('content')
{{ html()->form('POST', route('admin.pointcollector.store'))->class('form-horizontal')->open() }}
    <div class="card">
        <div class="card-body">
            <div class="row">
                <div class="col-sm-5">
                    <h4 class="card-title mb-0">
                        {{ __('pointcollector::labels.backend.pointcollector.management') }}
                        <small class="text-muted">{{ __('pointcollector::labels.backend.pointcollector.create') }}</small>
                    </h4>
                </div><!--col-->
            </div><!--row-->

            <hr />

            <div class="row mt-4 mb-4">
                <div class="col">

                    <div class="form-group row">
                    {{ html()->label(__('pointcollector::labels.backend.pointcollector.table.type').' <span class="text-danger">*</span>')->class('col-md-2 form-control-label')->for('type') }}

                        <div class="col-md-10">
                            <select name="type" id="type" class="form-control" >
                                @foreach($types as $key=>$value)
                                    <option value="{{$value}}" id="{{$value}}" name="type" {{ $value == old('type') ? ' selected' : ''}}>{{$value}}</option>    
                                @endforeach
                            </select>
                        </div><!--col-->
                    </div><!--form-group-->

                    <div class="form-group row">
                    {{ html()->label(__('pointcollector::labels.backend.pointcollector.table.no').' <span class="text-danger">*</span>')->class('col-md-2 form-control-label')->for('no') }}

                        <div class="col-md-10">
                            {{ html()->text('no')
                                ->class('form-control')
                                ->placeholder(__('pointcollector::labels.backend.pointcollector.table.no'))
                                ->required() }}
                        </div><!--col-->
                    </div><!--form-group-->

                    <div class="form-group row secret_code">
                    {{ html()->label(__('pointcollector::labels.backend.pointcollector.table.secret_code').' <span class="text-danger">*</span>')->class('col-md-2 form-control-label')->for('secret_code') }}

                        <div class="col-md-10">
                            {{ html()->text('secret_code')
                                ->class('form-control')
                                ->placeholder(__('pointcollector::labels.backend.pointcollector.table.secret_code')) }}
                        </div><!--col-->
                    </div><!--form-group-->

                    <div class="form-group row">
                        {{ html()->label(__('pointcollector::labels.backend.pointcollector.table.expiry'))->class('col-md-2 form-control-label')->for('expiry') }}

                        <div class="col-md-10">
                            {{ html()->text('expiry')
                                ->class('form-control expiry')
                                ->placeholder(__('pointcollector::labels.backend.pointcollector.table.expiry'))
                                ->attribute('maxlength', 191)
                                ->readonly() }}
                        </div><!--col-->
                    </div><!--form-group-->


                </div><!--col-->
            </div><!--row-->
        </div><!--card-body-->

        <div class="card-footer">
            <div class="row">
                <div class="col">
                    {{ form_cancel(route('admin.pointcollector.index'), __('buttons.general.cancel')) }}
                </div><!--col-->

                <div class="col text-right">
                    {{ form_submit(__('buttons.general.crud.create')) }}
                </div><!--row-->
            </div><!--row-->
        </div><!--card-footer-->
    </div><!--card-->
{{ html()->closeModelForm() }}
@endsection

@push('after-scripts')
{{ script('assets/plugins/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js')}}
<script>
    $(document).ready(function() {
        var date = new Date();
        date.setDate(date.getDate());
        var d = new Date();
        d.setHours(23,59);
        $('.expiry').datetimepicker({
            autoclose: true,
            todayHighlight: true,
            startDate: date,
            endDate: d,

            datesDisabled: '+1d',
        });

        if($('#type').val() == '{{Modules\PointCollector\Enum\PointCollectorType::NAME_CARD}}'){
            $('.secret_code').show();
        } else {
            $('.secret_code').hide();
        }

        $("#type").change(function () {
            console.log(this.value);
            if (this.value == '{{Modules\PointCollector\Enum\PointCollectorType::NAME_CARD}}' ) {
                $('.secret_code').show();
            }else {
                $('.secret_code').hide();
            }
        });


    });


</script>
@endpush