@extends('admin.layouts.app')
@section('content')

@if(isset($project))
<div class="nk-block-head nk-block-head-sm">
    <div class="nk-block-between">
        <div class="nk-block-head-content">
            <h3 class="nk-block-title page-title">Edit Project</h3>
            <div class="nk-block-des text-soft">

            </div>
        </div><!-- .nk-block-head-content -->
        <div class="nk-block-head-content">
            <div class="toggle-wrap nk-block-tools-toggle">
                <a href="#" class="btn btn-icon btn-trigger toggle-expand mr-n1" data-target="pageMenu"><em class="icon ni ni-menu-alt-r"></em></a>
                <div class="toggle-expand-content" data-content="pageMenu">
                    <ul class="nk-block-tools g-3">
                        <li class="nk-block-tools-opt">

                        </li>
                    </ul>
                </div>
            </div><!-- .toggle-wrap -->
        </div><!-- .nk-block-head-content -->
    </div><!-- .nk-block-between -->
</div><!-- .nk-block-head -->



<div class="components-preview">
    <div class="nk-block nk-block-lg">
        <div class="card card-bordered">
            <div class="card-inner">
                <form action="{{ route('admin.project.update', $project->slug) }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forTitle" class="form-label">Title</label>
                            <input type="text" class="form-control" name="title" value="{{ $project->title }}" id="forTitle">
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forImage" class="form-label">Image</label>
                            <input type="file" name="image" class="form-control" id="image">
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forDesc" class="form-label">Project Description</label>
                            <textarea type="text" class="form-control" name="desc" value="" id="forDesc">{{ $project->desc }}</textarea>
                        </div>
                        
                         <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forClient" class="form-label">Client</label>
                            <select class="form-select" name="procurement_id" aria-label="Default select example">
                                <option selected disabled>Select Client</option>
                                @foreach($procurements as $procurement)
                                <option value="{{ $procurement->id }}" {{ $project->procurement_id === $procurement->id ? 'selected' : '' }}>{{ $procurement->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forSector" class="form-label">Sector</label>
                            <select class="form-select" name="department_id" aria-label="Default select example">
                                <option selected disabled>Select Sector</option>
                                @foreach($departments as $department)
                                <option value="{{ $department->id }}" {{ $project->department_id === $department->id ? 'selected' : '' }}>{{ $department->department_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label class="form-label" for="type">Project Type</label>
                            <select class="form-select required" data-msg="Required" id="type" name="type" required>
                                <option value="" selected disabled>Select Type</option>
                                @foreach($types as $type)
                                <option value="{{ $type->name }}" {{ $project->type === $type->name ? 'selected' : '' }}>{{ $type->name }}</option>
                                @endforeach
                            </select>
                        </div>
                                                    
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forExp" class="form-label">Level of Experience</label>
                            <select class="form-select" name="experience_id" aria-label="Default select example">
                                <option selected disabled>Select Experience</option>
                                @foreach($experiences as $experience)
                                <option value="{{ $experience->id }}" {{ $project->experience_id === $experience->id ? 'selected' : '' }}>{{ $experience->level }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forService" class="form-label">Project Role</label>
                            <select class="form-select" name="occupation_id" aria-label="Default select example">
                                <option selected disabled>Select Role</option>
                                @foreach($roles as $role)
                                <option value="{{ $role->id }}"  {{ $project->occupation_id === $role->id ? 'selected' : '' }}>{{ $role->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label class="form-label" for="scope">Project Scope</label>
                            <select class="form-control required" data-msg="Required" id="scope" name="scope" required>
                                <option value="" selected disabled>Select Scopes</option>
                                @foreach($scopes as $scope)
                                <option value="{{ $scope->name }}" {{ $project->scope === $scope->name ? 'selected' : '' }}>{{ $scope->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <div class="form-group xyz">
                                <div class="d-flex justify-content-between">
                                    <label class="form-label" for="fw-password">Budget</label>
                                    <div class="pr">
                                        <ul class="d-flex flex-wrap g-2 pos">
                                            @foreach($enumValues as $rate)
                                            <li>
                                                <div class="custom-control custom-radio">
                                                    <input type="radio" data-msg="Required"
                                                        class="custom-control-input required" 
                                                        name="rate" id="{{ $rate }}"  value="{{ $rate }}" required {{ $project->rate === $rate ? 'selected' : '' }}>
                                                    <label class="custom-control-label"
                                                        for="{{ $rate }}">{{ $rate }}</label>
                                                </div>
                                            </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                </div>

                                <div class="form-control-wrap">
                                    <input type="number" value="{{ $project->budget }}" placeholder="$"
                                        class="form-control required" id="budget"
                                        name="budget" required>
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forState" class="form-label">States</label>
                            <select class="form-select" name="state_id" aria-label="Default select example">
                                <option selected disabled>Select State</option>
                                @foreach($states as $state)
                                <option value="{{ $state->id }}" {{ $project->state_id === $state->id ? 'selected' : '' }}>{{ $state->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <button type="submit" class="btn btn-primary">Update</button>
                </form>
            </div>
        </div>
    </div><!-- .nk-block -->
</div><!-- .components-preview -->

@else

<div class="nk-block-head nk-block-head-sm">
    <div class="nk-block-between">
        <div class="nk-block-head-content">
            <h3 class="nk-block-title page-title">Add Project</h3>
            <div class="nk-block-des text-soft">

            </div>
        </div><!-- .nk-block-head-content -->
        <div class="nk-block-head-content">
            <div class="toggle-wrap nk-block-tools-toggle">
                <a href="#" class="btn btn-icon btn-trigger toggle-expand mr-n1" data-target="pageMenu"><em class="icon ni ni-menu-alt-r"></em></a>
                <div class="toggle-expand-content" data-content="pageMenu">
                    <ul class="nk-block-tools g-3">
                        <li class="nk-block-tools-opt">

                        </li>
                    </ul>
                </div>
            </div><!-- .toggle-wrap -->
        </div><!-- .nk-block-head-content -->
    </div><!-- .nk-block-between -->
</div><!-- .nk-block-head -->



<div class="components-preview">
    <div class="nk-block nk-block-lg">
        <div class="card card-bordered">
            <div class="card-inner">
                <form action="{{ route('admin.project.store') }}" method="post" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forTitle" class="form-label">Title</label>
                            <input type="text" class="form-control required" required name="title" id="forTitle">
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forImage" class="form-label">Image</label>
                            <input type="file" name="image" class="form-control required" required id="image">
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forDesc" class="form-label">Description</label>
                            <textarea type="text" class="form-control required" required name="desc" value="" id="forDesc"></textarea>
                        </div>
                        
                         <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forClient" class="form-label">Client</label>
                            <select class="form-select required" required name="procurement_id" aria-label="Default select example">
                                <option selected disabled>Select Client</option>
                                @foreach($procurements as $client)
                                <option value="{{ $client->id }}">{{ $client->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forSector" class="form-label">Sector</label>
                            <select class="form-select required" required name="department_id" aria-label="Default select example">
                                <option selected disabled>Select Sector</option>
                                @foreach($departments as $department)
                                <option value="{{ $department->id }}">{{ $department->department_name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label class="form-label" for="type">Project Type</label>
                            <select class="form-select required" required data-msg="Required" id="type" name="type">
                                <option selected disabled>Select Type</option>
                                @foreach($types as $type)
                                <option value="{{ $type->name }}">{{ $type->name }}</option>
                                @endforeach
                            </select>
                        </div>
                                                    
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forExp" class="form-label">Level of Experience</label>
                            <select class="form-select required" required name="experience_id" aria-label="Default select example">
                                <option selected disabled>Select Experience</option>
                                @foreach($experiences as $experience)
                                <option value="{{ $experience->id }}">{{ $experience->level }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forService" class="form-label">Project Role</label>
                            <select class="form-select required" required name="occupation_id" aria-label="Default select example">
                                <option selected disabled>Select Role</option>
                                @foreach($roles as $role)
                                <option value="{{ $role->id }}">{{ $role->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label class="form-label" for="scope">Project Scope</label>
                            <select class="form-control required" required data-msg="Required" id="scope" name="scope">
                                <option value="" selected disabled>Select Scopes</option>
                                @foreach($scopes as $scope)
                                <option value="{{ $scope->name }}">{{ $scope->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <div class="form-group xyz">
                                <div class="d-flex justify-content-between">
                                    <label class="form-label" for="fw-password">Budget</label>
                                    <div class="pr">
                                        <ul class="d-flex flex-wrap g-2 pos">
                                            @foreach($enumValues as $rate)
                                            <li>
                                                <div class="custom-control custom-radio">
                                                    <input type="radio" data-msg="Required"
                                                        class="custom-control-input required" 
                                                        name="rate" id="{{ $rate }}"  value="{{ $rate }}" required>
                                                    <label class="custom-control-label" for="{{ $rate }}">{{ $rate }}</label>
                                                </div>
                                            </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                </div>

                                <div class="form-control-wrap">
                                    <input type="number" value="" placeholder="$"
                                        class="form-control required" id="budget"
                                        name="budget" required>
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-lg-6 col-md-6 mb-3">
                            <label for="forState" class="form-label">States</label>
                            <select class="form-select required" required name="state_id" aria-label="Default select example">
                                <option selected disabled>Select State</option>
                                @foreach($states as $state)
                                <option value="{{ $state->id }}">{{ $state->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        
                    </div>
                    <button type="submit" class="btn btn-primary">Submit</button>
                </form>
            </div>
        </div>
    </div><!-- .nk-block -->
</div><!-- .components-preview -->


@endif

@section('scripts')

    <script>
        $(".category_name").keyup(function() {
        var Text = $(this).val();
        Text = Text.toLowerCase();
        Text = Text.replace(/[^a-zA-Z0-9]+/g,'-');
        $(".category_slug").val(Text);  
        });

    </script>

    <script>
        $(function(){
            $('#form').on("submit",function(e){
                e.preventDefault();
                var action = $(this).attr('action');
                var method = $(this).attr('method');
                var form_data = new FormData($(this)[0]);
                var form = $(this);
                $.ajax({
                    url:action,
                    dataType: 'json',
                    cache: false,
                    contentType: false,
                    processData: false,
                    data: form_data,
                    type: method,
                    success:function(response){
                       if(response.status){
                            form.trigger("reset");
                            NioApp.Toast(response.msg,'success',{
                                position:'top-right'
                            });
                       }
                    },
                    error:function(response){//handle the error
                        $(".alert-danger").remove();
                        try{
                        var erroJson = JSON.parse(response.responseText);
                        for (var err in erroJson){
                            for (var errstr of erroJson[err])
                                $("[name='" + err + "']").after("<p class='alert alert-danger'>" + errstr + "</div>");
                        }
                        if(options.error) {
                            options.error(response);
                        }
                        } catch (err) {
                            console.log(err);
                        }
                    },
                })
            });
        });

    </script>

@endsection


@endsection