@extends('front.user-dash.layout.app')

@section('content')
<style>
input.subBTN {

    color: #fff;
    border-color: #011452;
    background: #011452;
    padding: 1rem 1.125rem;
    font-size: 1rem;
    margin-top: 15px;
    line-height: 1.25rem;
    border-radius: 4px;
    text-align: center;
    width: 100%;
    margin-bottom: -35px;
}

.nk-content {
    margin-top: 140px;
}
</style>
        <!-- content @s -->
        <div class="nk-content ">
            <div class="container-fluid">
                <div class="nk-content-inner">
                    <div class="nk-content-body">
                        <div class="components-preview wide-md mx-auto">
                            <!-- .nk-block-head -->
                            <div class="nk-block nk-block-lg">
                                @if(isset($project))
                                <div class="nk-block-head">
                                    <div class="nk-block-head-content">
                                        <h4 class="title nk-block-title">Edit Project</h4>
                                        <div class="nk-block-des">
                                            <p class="text-center">Lorem Ipsum is simply dummy text of the printing and typesetting
                                                industry. Lorem Ipsum has been the industry's</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="card card-bordered">
                                    <div class="card-inner">
                                        
                                        <form action="{{ route('project.update', $project->id) }}" method="POST" enctype="multipart/form-data" class="nk-wizard nk-wizard-simple is-alter">
                                            @csrf
                                            <div class="nk-wizard-head">
                                                <h5>Step 1</h5>
                                            </div>
                                            <div class="nk-wizard-content">
                                                <div class="row gy-3">
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label"
                                                                for="department_id">Sector</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="department_id"
                                                                        name="department_id" required>
                                                                        <option value="" selected disabled>Select Sector</option>
                                                                        @if($departments)
                                                                        @foreach($departments as $depart)
                                                                        <option value="{{ $depart->id }}" {{ $project->department_id === $depart->id ? 'selected' : '' }}>{{ $depart->department_name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="type">Project
                                                                Type</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="type"
                                                                        name="type" required>
                                                                        <option value="" selected disabled>Select Type</option>
                                                                        @if($types)
                                                                        @foreach($types as $type)
                                                                        <option value="{{ $type->name }}" {{ $project->type === $type->name ? 'selected' : '' }}>{{ $type->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="occupation_id">Role
                                                                Type</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="occupation_id"
                                                                        name="occupation_id" required>
                                                                        <option value="" selected disabled>Select Role</option>
                                                                        @if($roles)
                                                                        @foreach($roles as $role)
                                                                        <option value="{{ $role->id }}" {{ $project->occupation_id === $role->id ? 'selected' : '' }}>{{ $role->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="scope">Project
                                                                Scope</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="scope"
                                                                        name="scope" required>
                                                                        <option value="" selected disabled>Select Scopes</option>
                                                                        @if($scopes)
                                                                        @foreach($scopes as $scope)
                                                                        <option value="{{ $scope->name }}" {{ $project->scope === $scope->name ? 'selected' : '' }}>{{ $scope->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="experience_id">Level of
                                                                Experience</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="experience_id"
                                                                        name="experience_id" required>
                                                                        <option value="" selected disabled>Select Experience</option>
                                                                        @if($experiences)
                                                                        @foreach($experiences as $experience)
                                                                        <option value="{{ $experience->id }}" {{ $project->experience_id === $experience->id ? 'selected' : '' }} >{{ $experience->level }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <!-- .col -->
                                                </div>
                                            </div>
                                            <div class="nk-wizard-head">
                                                <h5>Step 2</h5>
                                            </div>
                                            <div class="nk-wizard-content">
                                                <div class="row gy-3">
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="title">Project
                                                                Title</label>
                                                            <div class="form-control-wrap">
                                                                <input type="text" value="{{ $project->title }}" data-msg="Required"
                                                                    class="form-control required" id="title"
                                                                    name="title" required>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    
                                                    <div class="col-md-6">
                                                        <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>
                                                <div class="row gy-3">
                                                    <div class="col-md-4">
                                                        <div class="form-group">
                                                            <label class="form-label" for="image">Project
                                                            Image</label>
                                                            <div class="form-control-wrap">
                                                                <img class="card-link" width="150" src="{{ asset($project->image) }}" class="img-fluid">
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="form-group">
                                                            <label class="form-label" for="title">Update Project Image</label>
                                                            <input type="file" name="image" id="image" class="form-control">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row gy-3">
                                                    <div class="col-md-12">
                                                        <div class="form-group">
                                                            <label class="form-label" for="desc">Project Description</label>
                                                            <div class="form-control-wrap">
                                                                <textarea class="form-control" name="desc" id="desc" cols="30" rows="10" required>{{ $project->desc }}</textarea>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <input type="submit" class="subBTN"/>
                                            </div>
                                            
                                        </form>
                                        
                                    </div>
                                </div>
                                
                                @else
                                <div class="nk-block-head">
                                    <div class="nk-block-head-content">
                                        <h4 class="title nk-block-title">Add Project</h4>
                                        <div class="nk-block-des">
                                            <p class="text-center">Lorem Ipsum is simply dummy text of the printing and typesetting
                                                industry. Lorem Ipsum has been the industry's</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="card card-bordered">
                                    <div class="card-inner">
                                        
                                       <form action="{{ route('project.store') }}" method="POST" enctype="multipart/form-data" class="nk-wizard nk-wizard-simple is-alter">
                                            @csrf
                                            <div class="nk-wizard-head">
                                                <h5>Step 1</h5>
                                            </div>
                                            <div class="nk-wizard-content">
                                                <div class="row gy-3">
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label"
                                                                for="department_id">Sector</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="department_id"
                                                                        name="department_id" required>
                                                                        <option value="" selected disabled>Select Sector</option>
                                                                        @if($departments)
                                                                        @foreach($departments as $depart)
                                                                        <option value="{{ $depart->id }}">{{ $depart->department_name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="type">Project
                                                                Type</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="type"
                                                                        name="type" required>
                                                                        <option value="" selected disabled>Select Type</option>
                                                                        @if($types)
                                                                        @foreach($types as $type)
                                                                        <option value="{{ $type->name }}">{{ $type->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="occupation_id">Role
                                                                Type</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="occupation_id"
                                                                        name="occupation_id" required>
                                                                        <option value="" selected disabled>Select Role</option>
                                                                        @if($roles)
                                                                        @foreach($roles as $role)
                                                                        <option value="{{ $role->id }}">{{ $role->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="scope">Project
                                                                Scope</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="scope"
                                                                        name="scope" required>
                                                                        <option value="" selected disabled>Select Scopes</option>
                                                                        @if($scopes)
                                                                        @foreach($scopes as $scope)
                                                                        <option value="{{ $scope->name }}">{{ $scope->name }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="experience_id">Level of
                                                                Experience</label>
                                                            <div class="form-control-wrap ">
                                                                <div class="form-control-select">
                                                                    <select class="form-control required"
                                                                        data-msg="Required" id="experience_id"
                                                                        name="experience_id" required>
                                                                        <option value="" selected disabled>Select Experience</option>
                                                                        @if($experiences)
                                                                        @foreach($experiences as $experience)
                                                                        <option value="{{ $experience->id }}">{{ $experience->level }}</option>
                                                                        @endforeach
                                                                        @endif
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <!-- .col -->
                                                </div>
                                            </div>
                                            <div class="nk-wizard-head">
                                                <h5>Step 2</h5>
                                            </div>
                                            <div class="nk-wizard-content">
                                                <div class="row gy-3">
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="title">Project
                                                                Title</label>
                                                            <div class="form-control-wrap">
                                                                <input type="text" data-msg="Required"
                                                                    class="form-control required" id="title"
                                                                    name="title" required>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <div class="form-group">
                                                            <label class="form-label" for="title">Project Image</label>
                                                            <input type="file" name="image" id="image" class="form-control required" required>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-6">
                                                        <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" data-msg="Required" placeholder="$"
                                                                    class="form-control required" id="budget"
                                                                    name="budget" required>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row gy-3">
                                                    <div class="col-md-12">
                                                        <div class="form-group">
                                                            <label class="form-label" for="desc">Project Description</label>
                                                            <div class="form-control-wrap">
                                                                <textarea data-msg="Required" class="form-control" name="desc" id="desc" cols="30" rows="10" required></textarea>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <input type="submit" class="subBTN"/>
                                            </div>
                                            
                                        </form>
                                        
                                    </div>
                                </div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

@endsection

@section('script')
    
    <script>
    
        
    </script>
    
@endsection