@extends('dashboard::layouts.master')

@section('title', 'Add Client')

@section('content')
    @if (session('status'))
    <div class="form-group mb-8">
        <div class="alert alert-custom alert-default" role="alert">
            <div class="alert-icon"><i class="flaticon2-check-mark text-primary"></i></div>
            <div class="alert-text">
                {{ session('status') }}
            </div>
        </div>
    </div>
    @endif
<div class="row">
    <div class="col-md-8">
        <div class="card card-custom">
            <div class="card-header">
                <h3 class="card-title">
                    Add New Client
                </h3>
                <div class="card-toolbar">
                    <div class="example-tools justify-content-center">
                        <span class="example-toggle" data-toggle="tooltip" title="View code"></span>
                        <span class="example-copy" data-toggle="tooltip" title="Copy code"></span>
                    </div>
                </div>
            </div>
            <!--begin::Form-->
            <form action="{{ route('clients.store') }}" enctype="multipart/form-data" method="POST">
                @csrf
                <div class="card-body">
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Image</label>
                        <div class="col-lg-9">
                            <div class="image-input image-input-outline" id="kt_image_1">
                                <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="client_image" accept=".svg, .png, .jpg, .jpeg"/>
                                    <input type="hidden" name="profile_avatar_remove"/>
                                </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>
                            </div>
                            @error('client_image')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>                  
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">File</label>
                        <div class="col-lg-9">
                            <input type="file" name="client_fileupload" class="form-control @error('client_fileupload') is-invalid @enderror" placeholder="Enter client file upload" />
                            @error('client_fileupload')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>                  
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Product Name</label>
                        <div class="col-lg-9">
                            <input type="text" name="client_product_name" class="form-control @error('client_product_name') is-invalid @enderror" placeholder="Enter client product name" />
                            @error('client_product_name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>                  
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Client</label>
                        <div class="col-lg-9">
                            <input type="text" name="client_name" class="form-control @error('client_name') is-invalid @enderror" placeholder="Enter client name" />
                            @error('client_name')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>                  
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Description</label>
                        <div class="col-lg-9">
                            <input type="text" name="client_desc" class="form-control" placeholder="Enter description "/>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Platform</label>
                        <div class="col-lg-9">
                            <input type="text" name="client_platform" class="form-control" placeholder="Enter platform "/>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Feature</label>
                        <div class="col-lg-9">
                            <textarea class="form-control" name="client_feature" rows="2" placeholder="Enter feature "></textarea>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Content</label>
                        <div class="col-lg-9">
                            <textarea class="form-control" name="client_content" rows="4" placeholder="Enter Content "></textarea>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Visibility</label>
                        <div class="col-lg-9 col-md-9 col-sm-12">
                            <input data-switch="true" name="client_visible" type="checkbox" checked="checked" data-on-text="Visible" data-handle-width="70" data-off-text="Hidden" data-on-color="primary"/>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-lg-3 col-form-label">Order</label>
                        <div class="col-lg-9 col-md-9 col-sm-12">
                            <input type="number" name="client_order" class="form-control" placeholder="Enter number" value="0" min="0" max="100"/>
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <button type="submit" class="btn btn-primary mr-2">Add</button>
                    <button type="reset" class="btn btn-secondary">Cancel</button>
                </div>
            </form>
            <!--end::Form-->
        </div>
    </div>
</div>
@endsection
@push('scripts')
<script>
    jQuery(document).ready(function() {
        $('[data-switch=true]').bootstrapSwitch();
        var avatar1 = new KTImageInput('kt_image_1');
        console.log(avatar1);
    });
</script>
{{-- <script src="assets/js/pages/crud/forms/widgets/bootstrap-switch.js?v=7.0.6"></script> --}}

@endpush