@extends('backend.layouts.app')

@section('content')

    <h2 class="title">タスク一覧</h2>
    @include('backend.layouts.flash-message')
    
    {{ $tasks->links('vendor.pagination.admin-pagination') }}
    <div class="hscroll-sp">
        <table class="normal type3">
            <thead>
            <tr>
                <th>操作</th>
                <th>登録日時</th>
                <th>登録者</th>
                <th>担当者</th>
                <th>タスク</th>
                <th>重要度</th>
                <th>期日</th>
            </tr>
            </thead>
            <tbody>
                @if ($tasks->count() > 0)
                    @foreach ($tasks as $task)
                    @php                                             
                        $limit_date = Carbon::parse($task->limit_date);
                        $remain_time = (Carbon::now())->diff($limit_date)->format('%R%a');                                           
                        if($task->task_status == config('const.task_status_code.completed')){
                            $class_name = "";
                        } else if($remain_time < -2)
                        {
                            $class_name = "bg-red";
                        } else if(Carbon::now() >= $limit_date){
                            $class_name = "bg-yellow";
                        } else {
                            $class_name = "";
                        }
                    @endphp
                    <tr class="{{ $class_name }}">
                        <td class="control-td">
                            <div class="control">
                                @if ($task->task_status == config('const.task_status_code.incomplete'))
                                    <p><a href="{{ route("backend.{$department}.task.edit", ['task'=>$task->id]) }}">変更</a></p>
                                @else
                                    <p><a href="{{ route("backend.{$department}.task.detail", ['task'=>$task->id]) }}">詳細</a></p>
                                @endif
                                <p><a href="#" cidx="{{ $task->id }}" class="delete_task">削除</a></p>
                                <form id="frm_delete_{{ $task->id }}" action="{{ route("backend.{$department}.task.destroy", ['id'=>$task->id]) }}" method="POST" style="display: none;">
                                    @csrf
                                    @method('delete')
                                </form>
                                @if ($task->task_status == config('const.task_status_code.incomplete'))
                                    <p><a href="#" cidx="{{ $task->id }}" class="complete_task">完了</a></p>
                                    <form id="frm_complete_{{ $task->id }}" action="{{ route("backend.{$department}.task.complete", ['id'=>$task->id]) }}" method="POST" style="display: none;">
                                        @csrf
                                    </form>
                                @endif
                            </div>
                        </td>
                        <td>{{ Carbon::parse($task->registered_date)->format('Y.m.d')." ".sprintf('%02d:%02d',$task->registered_hour,$task->registered_minute) }}</td>
                        <td>{{ $task->register_user->name_kanji }}</td>
                        <td>{{ $task->charge_user->name_kanji }}</td>
                        <td style="text-align: left"></td>
                        <td>{{ config('const.task_importance.'.$task->importance) }}</td>
                        <td>{{ Carbon::parse($task->limit_date)->format('Y.m.d') }}</td>
                    </tr>
                    @endforeach
                @else
                    <tr>
                        <td colspan="7">タスクデータが存在しません。</td>
                    </tr>
                @endif
            </tbody>
        </table>
    </div>
    {{ $tasks->links('vendor.pagination.admin-pagination') }}
    <div id="dialog-confirm" title="test" style="display:none">
        <p>
            <span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>
            <span id="confirm_text">These items will be permanently deleted and cannot be recovered. Are you sure?</span>
        </p>
    </div>

@endsection

@section('page_css')
    <link href="{{ asset('vendor/jquery-ui/jquery-ui.min.css') }}" rel="stylesheet">
@endsection

@section('page_js')
    <script src="{{ asset('assets/backend/js/helper.js') }}"></script>
    <script src="{{ asset('vendor/jquery-ui/jquery-ui.min.js') }}"></script>
    <script>
        var task_id = "";
        $(document).ready(function () {
            $(".delete_task").click(function(e){
                e.preventDefault();
                task_id = $(this).attr('cidx');
                helper_confirm("dialog-confirm", "削除", "タスクを削除します。<br />よろしいですか？", 300, "確認", "閉じる", function(){
                    var frm_id = "#frm_delete_" + task_id;
                    $(frm_id).submit();
                });
            });
            $(".complete_task").click(function(e){
                e.preventDefault();
                task_id = $(this).attr('cidx');
                helper_confirm("dialog-confirm", "完了", "タスクを完了します。<br />よろしいですか？", 300, "確認", "閉じる", function(){
                    var frm_id = "#frm_complete_" + task_id;
                    $(frm_id).submit();
                });
            });

        } );
    </script>
@endsection