@extends('back.layout')

@section('title')
{{ __('d16') }} - {{ __('n1') }}
@endsection

@section('css')
    <style>
        .pagination li {
            display: inline-block;
            margin: 0 2px;
            padding: 5px;
            border-radius: 2px;
            background: #0d6efd;
        }

        .pagination li a {
            text-decoration: none;
            font-weight: bold;
            color: #fff;
        }
    </style>
@endsection

@section('content')
    @if (auth()->user()->id == 1)
        <div class="content-wrapper content-wrapper--with-bg">
            <div class="d-flex justify-content-between" style="flex-direction: row-reverse;">
                <div>
                    <h1 class="page-title fw-bold dir">{{ __('d17') }}</h1>
                </div>

                <div>
                    <a href="" data-bs-toggle="modal" data-bs-target="#newTask" class="btn btn-primary fw-bold fs-6">
                        <i class="fa-solid fa-plus"></i>
                        {{ __('d18') }}
                    </a>
                </div>
            </div>

            <div class="page-content dir" style="overflow-x: scroll;">

                {{-- All Tasks --}}
                @if (count($tasks) > 0)
                    <div id="tasks" style="width: 150vh;">
                        <input class="search form-control text-center fw-bold mb-2 shadow-none" placeholder="{{ __('d19') }}" />
                        <table class="table w-100">
                            <thead>
                                <tr>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="id">#</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="title">{{ __('d20') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="price">{{ __('d21') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="users">{{ __('d22') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="type">{{ __('d23') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="acc">{{ __('d24') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="count">{{ __('d25') }}</th>
                                    <th class="fs-6 fw-bold text-center sort" data-sort="status">{{ __('d26') }}</th>
                                    <th class="fs-6 fw-bold text-center"></th>
                                </tr>
                            </thead>
                            <tbody class="list">
                                @foreach ($tasks as $task)
                                    <tr>
                                        <td class="fs-6 fw-bold text-center id">{{ $task->id }}</td>
                                        <td class="fs-6 fw-bold text-center title">{{ $task->title }}</td>
                                        <td class="fs-6 fw-bold text-center price">{{ $task->price }} TRX</td>
                                        <td class="fs-6 fw-bold text-center users">{{ $task->users }} /
                                            {{ count(\App\Models\Submit::where('task_id', '=', $task->id)->get()) }}</td>
                                        <td class="fs-6 fw-bold text-center type">
                                            @if ($task->type == 1)
                                            {{ __('d27') }}
                                            @elseif ($task->type == 2)
                                            {{ __('d28') }}
                                            @else
                                            {{ __('d29') }}
                                            @endif
                                        </td>
                                        <td class="text-center acc">
                                            @if (count(\App\Models\Submit::where('task_id', '=', $task->id)->where('status', '=', 'Complete')->get()) > 0)
                                                
                                                    {{ count(\App\Models\Submit::where('task_id', '=', $task->id)->where('status', '=', 'Complete')->get()) }}
                                                
                                            @else
                                                {{ count(\App\Models\Submit::where('task_id', '=', $task->id)->where('status', '=', 'Complete')->get()) }}
                                            @endif
                                        </td>
                                        <td class="text-center count">
                                            @if(count(\App\Models\Submit::where('status', '=', 'Pending')->where('task_id', '=', $task->id)->get()) == 0)
                                                <span class="fw-bold">
                                                {{ __('d30s') }}
                                                </span>
                                            @else
                                            <a href="{{ route('taskShow', $task->id) }}">
                                                {{ count(\App\Models\Submit::where('status', '=', 'Pending')->where('task_id', '=', $task->id)->get()) }}
                                            </a>
                                            @endif
                                        </td>
                                        <td class="fs-6 fw-bold text-center status">
                                            @if ($task->status == 1)
                                            {{ __('d30') }}
                                            @else
                                            {{ __('d31') }}
                                            @endif
                                        </td>
                                        <td class="text-center">
                                            <a href="{{ route('taskShow', $task->id) }}" class="btn btn-success fs-6">
                                                <i class="fa-solid fa-eye"></i>
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                        <ul class="pagination"></ul>
                    </div>
                @else
                    <p class="fw-bold text-center text-dark fs-4">
                    {{ __('d32') }}
                    </p>
                @endif

            </div>
        </div>

        {{-- Modals --}}

        {{-- New Task --}}
        <div class="modal fade" id="newTask" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
            aria-labelledby="staticBackdropLabel" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <div class="modal-header" style="flex-direction: row-reverse;">
                        <h5 class="modal-title fw-bold fs-6" id="staticBackdropLabel">{{ __('d33') }}</h5>
                        <button type="button" class="btn-close shadow-none" data-bs-dismiss="modal"
                            aria-label="Close"></button>
                    </div>
                    <div class="modal-body">

                        <form action="{{ route('storeTask') }}" method="POST" enctype="multipart/form-data">

                            @csrf
                            @method('POST')

                            <div class="mb-3 dir">
                                <label for="link" class="mb-1 fw-bold text-dark">{{ __('d34') }} <span
                                        class="text-danger">*</span></label>
                                <input type="url" name="link" id="link"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="title" class="mb-1 fw-bold text-dark">{{ __('d35') }} <span
                                        class="text-danger">*</span></label>
                                <input type="text" name="title" id="title"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="description" class="mb-1 fw-bold text-dark">{{ __('d36') }}</label>
                                <textarea name="description" id="description" class="form-control shadow-none fw-bold text-dark"></textarea>
                            </div>

                            <div class="mb-3 dir">
                                <label for="price" class="mb-1 fw-bold text-dark">{{ __('d37') }} <span
                                        class="text-danger">*</span></label>
                                <input type="number" name="price" min="1" id="price"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="users" class="mb-1 fw-bold text-dark">{{ __('d38') }} <span
                                        class="text-danger">*</span></label>
                                <input type="number" name="users" min="1" id="users"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="duration" class="mb-1 fw-bold text-dark">{{ __('d39') }}<span
                                        class="text-danger">*</span></label>
                                <input type="number" name="duration" min="1" id="duration" value="24"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="users_per_duration" class="mb-1 fw-bold text-dark">
                                {{ __('d40') }} <span class="text-danger">*</span></label>
                                <input type="number" name="users_per_duration" min="1" id="users_per_duration"
                                    class="form-control shadow-none fw-bold text-dark" required>
                            </div>

                            <div class="mb-3 dir">
                                <label for="type" class="mb-1 fw-bold text-dark">{{ __('d41') }} <span
                                        class="text-danger">*</span></label>
                                <select class="form-select fw-bold fs-6" name="type" id="type" required>
                                    <option value="1" class="fw-bold fs-6">{{ __('d42') }}</option>
                                    <option value="2" class="fw-bold fs-6">{{ __('d43') }}</option>
                                    <option value="3" class="fw-bold fs-6">{{ __('d44') }}
                                    </option>
                                </select>
                            </div>

                            <div class="mb-3 dir uploadImages">
                                <label for="images" class="mb-1 fw-bold text-dark">{{ __('d45') }}<span class="text-danger">*</span></label>
                                <input class="form-control" type="file" name="images[]" id="images" multiple accept="images/*">
                            </div>

                            <div class="mb-3 dir comment_type">
                                <label for="comment_type" class="mb-1 fw-bold text-dark">{{ __('d46') }}<span
                                        class="text-danger">*</span></label>
                                <input type="file" class="form-control" name="excel" />
                                <br>
                                
                                <label for="comment_type" class="mb-1 fw-bold text-dark">{{ __('d47') }} <span
                                        class="text-danger">*</span></label>
                                <select class="form-select fw-bold fs-6" name="comment_type" id="comment_type" required>
                                    <option value="0" selected disabled class="fw-bold fs-6">{{ __('d48') }}</option>
                                    <option value="1" class="fw-bold fs-6">{{ __('d49') }}</option>
                                    <option value="2" class="fw-bold fs-6">{{ __('d50') }}</option>
                                </select>
                            </div>

                            <div class="mb-3 dir additionalComment">
                                <label for="additionalComment" class="mb-1 fw-bold text-dark">{{ __('e1') }}</label>
                                <textarea name="comment" id="additionalComment" class="form-control shadow-none fw-bold text-dark"></textarea>
                            </div>

                            <button type="button" class="btn btn-secondary shadow-none fw-bold fs-6"
                                data-bs-dismiss="modal">{{ __('e2') }}</button>
                            <button class="btn btn-primary fw-bold fs-6 shadow-none submitForm" type="submit">{{ __('e3') }}</button>

                        </form>

                    </div>
                </div>
            </div>
        </div>
    @else
        <div class="content-wrapper content-wrapper--with-bg">
            <div class="d-flex justify-content-between" style="flex-direction: row-reverse;">
                <div>
                    <h1 class="page-title fw-bold dir">{{ __('e4') }}</h1>
                </div>

                {{-- <div>
                    <a href="{{ route('work') }}" class="btn btn-primary fw-bold fs-6">
                        <i class="fa-solid fa-plus"></i>
                        {{ __('e5') }}
                    </a>
                </div> --}}
            </div>

            <div class="page-content dir">

                @if (auth()->user()->id == 1)
                    {{-- All Tasks --}}
                    @if (count($tasks) > 0)
                        <div id="tasks">
                            <table class="table w-100">
                                <thead>
                                    <tr>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="id">#</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="title">{{ __('e6') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="price">{{ __('e7') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="users">{{ __('e8') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="type">{{ __('e19') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="status">{{ __('e10') }}</th>
                                        <th class="fs-6 fw-bold text-center"></th>
                                    </tr>
                                </thead>
                                <tbody class="list">
                                    @foreach ($tasks as $task)
                                        <tr>
                                            <td class="fs-6 fw-bold text-center id">{{ $task->id }}</td>
                                            <td class="fs-6 fw-bold text-center title">{{ $task->title }}</td>
                                            <td class="fs-6 fw-bold text-center price">{{ $task->price }} TRX</td>
                                            <td class="fs-6 fw-bold text-center users">{{ $task->users }}</td>
                                            <td class="fs-6 fw-bold text-center type">
                                                @if ($task->type == 1)
                                                {{ __('e11') }}
                                                @elseif ($task->type == 2)
                                                {{ __('e12') }}
                                                @else
                                                {{ __('e13') }}
                                                @endif
                                            </td>
                                            <td class="fs-6 fw-bold text-center status">
                                                @if ($task->status == 1)
                                                {{ __('e14') }}
                                                @else
                                                {{ __('e15') }}
                                                @endif
                                            </td>
                                            <td class="text-center">
                                                <a href="{{ route('taskShow', $task->id) }}"
                                                    class="btn btn-success fs-6">
                                                    <i class="fa-solid fa-eye"></i>
                                                </a>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                            <ul class="pagination"></ul>
                        </div>
                    @else
                        <p class="fw-bold text-center text-dark fs-4">
                        {{ __('e16') }}
                        </p>
                    @endif
                @else
                    @if (count($userTasks) > 0)
                        <div id="tasks">
                            <table class="table w-100">
                                <thead>
                                    <tr>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="id">#</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="title">{{ __('e17') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="price">{{ __('e18') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="type">{{ __('e19') }}</th>
                                        <th class="fs-6 fw-bold text-center sort" data-sort="status">{{ __('e20') }}</th>
                                        <th class="fs-6 fw-bold text-center"></th>
                                    </tr>
                                </thead>
                                <tbody class="list">
                                    @foreach ($userTasks as $task)
                                        <tr>
                                            <td class="fs-6 fw-bold text-center id">{{ $task->id }}</td>
                                            <td class="fs-6 fw-bold text-center title">
                                                {{ \App\Models\Task::find($task->task_id)->title }}</td>
                                            <td class="fs-6 fw-bold text-center price">
                                                {{ \App\Models\Task::find($task->task_id)->price }} TRX</td>
                                            <td class="fs-6 fw-bold text-center type">
                                                @if (\App\Models\Task::find($task->task_id)->type == 1)
                                                {{ __('e21') }}
                                                @elseif (\App\Models\Task::find($task->task_id)->type == 2)
                                                {{ __('e22') }}
                                                @elseif (\App\Models\Task::find($task->task_id)->type == 3)
                                                {{ __('e23') }}
                                                @endif
                                            </td>
                                            <td class="fs-6 fw-bold text-center status">
                                                @if ($task->status == 'Pending')
                                                {{ __('e24') }}
                                                @else
                                                {{ __('e25') }}
                                                @endif
                                            </td>
                                            <td class="text-center">
                                                <a href="{{ route('taskShow', $task->task_id) }}"
                                                    class="btn btn-success fs-6">
                                                    <i class="fa-solid fa-eye"></i>
                                                </a>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                            <ul class="pagination"></ul>
                        </div>
                    @else
                        <p class="fw-bold text-center text-dark fs-4">
                        {{ __('e26') }}
                        </p>
                    @endif
                @endif

            </div>
        </div>
    @endif
@endsection

@section('jss')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/list.js/1.0.2/list.min.js"
        integrity="sha512-MT5YyrGWqMGkIbwkVUZEWGrRDjlNx8loukEdFyzLo4s8INKVxnDQy2eFcpmnWGrFwJ+X8mRTQOJpWCayXz7+Og=="
        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/list.pagination.js/0.1.1/list.pagination.min.js"></script>
    <script>
        var options = {
            valueNames: ['id', 'title', 'price', 'users', 'type', 'status', 'count', 'acc'],
            page: 50,
            pagination: true,
            plugins: [
                ListPagination({})
            ],
        };

        var userList = new List('tasks', options);

        $('.uploadImages').hide();
        $('.additionalComment').hide();
        $('.comment_type').hide();
        // Show Images Box
        $('#type').change(function () {
            if ($(this).val() == '3') {
                $('.uploadImages').slideDown();
                $('.additionalComment').slideDown();
                $('.comment_type').slideDown();
            } else {
                $('.uploadImages').slideUp();
                $('.additionalComment').slideUp();
                $('.comment_type').slideUp();
            }

            if ($(this).val() == '2' || $(this).val() == '3') {
                $('.additionalComment').slideDown();
                $('.comment_type').slideDown();
            } else {
                $('.additionalComment').slideUp();
                $('.comment_type').slideUp();
            }
        });
    </script>
@endsection