@extends('layouts.main')
@section('content')
<!--begin::Card-->
<div class="card card-custom">
    <div class="card-header">
        <div class="card-title">
            <span class="card-icon">
                <i class="flaticon2-group text-primary"></i>
            </span>
            <h3 class="card-label">Update Incentive</h3>
        </div>
        
    </div>
    <form class="form" enctype="multipart/form-data" id="kt_form_1" action="{{route('incentives.update.submit',[$incentive->incentive_id])}}" method="post" autocomplete="off">
        {{ csrf_field() }}
        <div class="card-body"> 
            <div class="row">
                <div class="col-lg-4 col-md-4 col-sm-12">
                    <div class="row">
                        <div class="form-group col-lg-12 col-md-12 col-sm-12">
                            <label>Description<span class="text-danger">*</span></label>                   
                            <textarea class="form-control" id="incentive_description" name="incentive_description" rows="6">{{$incentive->incentive_description}}</textarea>
                        </div>  
                    </div>
                </div>
                <div class="col-lg-8 col-md-8 col-sm-12">
                    <div class="row">
                        <div class="form-group col-lg-6 col-md-6 col-sm-12">
                            <label>Title<span class="text-danger">*</span></label>
                            <input type="text" name="incentive_title" id="incentive_title" class="form-control" required placeholder="Enter Title" value="{{$incentive->incentive_title}}">
                        </div>

                        <div class="form-group col-lg-6 col-md-6 col-sm-12">
                            <label>Badges to Redeem<span class="text-danger">*</span></label>
                            <input type="text" name="incentive_badge" id="incentive_badge" class="form-control" required placeholder="Badges to Redeem" value="{{$incentive->incentive_badge}}">
                        </div>
                        <div class="form-group col-lg-6 col-md-6 col-sm-12">
                            @php 
                                //$img = $incentive->secure_url!='' ?  $incentive->secure_url : (($incentive->cloudinarySecureUrl!='') ? $incentive->cloudinarySecureUrl: '');
                                $img = ($incentive->cloudinarySecureUrl!='') ? $incentive->cloudinarySecureUrl: '';
                                $isPdf = strpos($img, '.pdf');
                                if($isPdf!==false){
                                    $img ="";
                                }
                            @endphp
                            <label>Upload Image</label><br>
                            <div class="image-input image-input-empty image-input-outline " id="kt_image_5" style="background-image: url({{($img == '') ? $common->getTheamUrl('assets/media/no-image.jpg') : $img}})">
                                 <div class="image-input-wrapper"></div>

                                 <label class="btn btn-xs btn-icon btn-circle btn-white btn-hover-text-primary btn-shadow" data-action="change" data-toggle="tooltip" title="" data-original-title="Change Image">
                                  <i class="fa fa-pen icon-sm text-muted"></i>
                                  <input type="file" name="imageUpload" id="imageUpload" accept=".png, .jpg, .jpeg"/>                  
                                 </label>

                                 <span class="btn btn-xs btn-icon btn-circle btn-white btn-hover-text-primary btn-shadow" data-action="cancel" data-toggle="tooltip" title="Cancel Image">
                                  <i class="ki ki-bold-close icon-xs text-muted"></i>
                                 </span>

                                 <span class="btn btn-xs btn-icon btn-circle btn-white btn-hover-text-primary btn-shadow" data-action="remove" data-toggle="tooltip" title="Remove Image">
                                  <i class="ki ki-bold-close icon-xs text-muted"></i>
                                 </span>
                            </div> 
                        </div>
                        <div class="form-group col-lg-6 col-md-6 col-sm-12">
                            <div class="row">
                                <label class="col-form-label col-lg-3 col-md-3 col-sm-12">Status</label>
                                <div class="col-lg-9 col-md-9 col-sm-12">
                                     <input id="incentive_status" name="incentive_status" data-switch="true" type="checkbox" data-on-text="Active" data-handle-width="80" data-off-text="Inactive" data-on-color="primary" {{$incentive->incentive_status == '1' ? 'checked' :''}} />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
        <input type="hidden" name="incentive_id" value="{{$incentive->incentive_id}}">
        <div class="card-footer">
            <div class="row">
                <div class="col-lg-9 ml-lg-auto">
                    <button type="submit" class="btn btn-primary font-weight-bold mr-2">Save</button>
                    <button type="reset" class="btn btn-light-primary font-weight-bold">Cancel</button>
                </div>
            </div>
        </div>
    </form>
</div>
<!--end::Card-->
@endsection
@section('sub_header')
@section('sub_header')
<div class="subheader py-2 py-lg-6 subheader-transparent" id="kt_subheader">
    <div class="container d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
        <!--begin::Info-->
        <div class="d-flex align-items-center flex-wrap mr-1">
            <!--begin::Page Heading-->
            <div class="d-flex align-items-baseline flex-wrap mr-5">
                <!--begin::Page Title-->
                <h5 class="text-dark font-weight-bold my-1 mr-5">Update Incentive</h5>
                <!--end::Page Title-->
                <!--begin::Breadcrumb-->
                <ul class="breadcrumb breadcrumb-transparent breadcrumb-dot font-weight-bold p-0 my-2 font-size-sm">
                    <li class="breadcrumb-item text-muted">
                        <a href="{{route('incentives.list')}}" class="text-muted">Incentives</a>
                    </li>
                    <li class="breadcrumb-item text-muted">
                        <a href="#" class="text-muted">Update </a>
                    </li>
                </ul>
                <!--end::Breadcrumb-->
            </div>
            <!--end::Page Heading-->
        </div>
        
    </div>
</div>
@endsection
@section('theam_css')
<link href="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css" />

@endsection

@section('js_file')
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
@endsection

@section('page_js')
    <script>
        $(document).ready(function(){ 
            @if(Session::has('success'))
                toastr.success("{{Session::get('success')}}");
            @endif 
            @if(Session::has('error'))
                toastr.error("{{Session::get('error')}}");
            @endif
            var avatar5 = new KTImageInput('kt_image_5'); 
            $('[data-switch=true]').bootstrapSwitch(); 
            const form = document.getElementById('kt_form_1');
            const fv = FormValidation.formValidation(
                form,
                {
                    fields: {                        
                        incentive_title: {
                            validators: {
                                notEmpty: {
                                    message: 'Incentive Title is required'
                                },
                            }
                        },
                        incentive_description: {
                            validators: {
                                notEmpty: {
                                    message: 'Description is required'
                                },
                            }
                        },
                        incentive_badge: {
                            validators: {
                                notEmpty: {
                                    message: 'Badges to Redeem is required'
                                },
                                digits: {
                                    message: 'Enter Valid a Digits'
                                }
                            }
                        },
                    },

                    plugins: { //Learn more: https://formvalidation.io/guide/plugins
                        trigger: new FormValidation.plugins.Trigger(),
                        // Bootstrap Framework Integration
                        bootstrap: new FormValidation.plugins.Bootstrap(),
                        // Validate fields when clicking the Submit button
                        submitButton: new FormValidation.plugins.SubmitButton(),
                        // Submit the form when all fields are valid
                        defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
                    }
                }
            );

        });
    </script>
@endsection