@extends('layouts.general')

@section('layouts.header')
    @include('layouts.header')
@stop

@section('optionalCss')
    <link href="{!! asset('css/feedback/feedback_index.css?20181107-2200') !!}" rel="stylesheet">
@stop

@section('content')
<div class="container">

    {{--Validator Error From Server--}}
    @if($errors->any())
        <div class="flash-message">
            <div class="alert alert-danger">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{$error}}</li>
                    @endforeach
                </ul>
            </div>
        </div>
    @endif
    {{--End Validator Error From Server--}}

    {{--Begin flash message--}}
    <div class="flash-message custom_error_message">

        @foreach (['danger', 'warning', 'success', 'info'] as $msg)
            @if(Session::has('alert-' . $msg))
                <p class="alert alert-{{ $msg }}">
                    {{ Session::get('alert-' . $msg) }}
                    <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                </p>
            @endif
        @endforeach

    </div>
    {{--End flash message--}}

    {{--Begin validate message--}}
    <div id="validate_form_error_msg">
        <div v-cloak v-if="form.errors.any()" class="flash-message">
            <div class="alert alert-danger">
                <ul>
                    <li v-for="(value, key, index) in form.errors.errors">@{{form.errors.get(key)}}</li>
                </ul>
            </div>
        </div>
    </div>
    {{--End validate message--}}

    <div class="col-xs-12">

        <div class="col-xs-12">
            <h4><strong>フィードバックシート出力</strong></h4>
        </div>

        <div class="col-xs-10">
            <label>フィードバックシートを生成したい評価期間及び職員を選択し、「印刷プレビュー」を押して下さい。</label>
            <label>また、「フィードバック面談記録」より個人別の記録を閲覧・編集することができます。</label>
        </div>

        <div @can('accessIfRoleAdmin', App\User::class) class="col-xs-2  text-right" style="padding:0px;">
            <input id="printBtn" name="Action" type="submit" class="btn btn-primary" value="印刷"
                   style="WIDTH: 105px !important;margin-top:20px;" @endcan>
        </div>

        <div class="col-xs-12" style="display:inline-flex; margin-bottom:15px;">

            <h5 style="margin-right:5px; width:70px;">評価期間</h5>
            <select
                    style="width:220px; margin:0"
                    class="form-control evaluations">

                <option
                        data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => -1,
                                            'group_id' => -1,
                                            'team_id' => -1
                                        ])}}">入力してください
                </option>

                @foreach($evaluations as $evaluation)

                    <option
                            data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => $evaluation->id,
                                            'group_id' => -1,
                                            'team_id' => -1
                                        ])}}"
                            {{$evaluation->id == request()->evaluation_date_id ? 'selected' : ''}}
                            value="{{$evaluation->id}}">
                        {{sprintf('%s～%s', $evaluation->start_date, $evaluation->end_date)}}
                    </option>

                @endforeach

            </select>

            <h5 style="margin-right:15px; width:70px; margin-left:15px">チーム分類</h5>
            <select
                    style="width:160px; margin:0"
                    class="form-control team_group_list">

                <option
                        data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => request()->evaluation_date_id,
                                            'group_id' => -1,
                                            'team_id' => -1
                                        ])}}">入力してください
                </option>

                @foreach($groups as $group)

                    <option
                            data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => request()->evaluation_date_id,
                                            'group_id' => $group->id,
                                            'team_id' => -1
                                        ])}}"
                            {{$group->id == request()->group_id ? 'selected' : ''}}
                            value="{{$group->id}}">
                        {{$group->name}}
                    </option>

                @endforeach

            </select>

            <h5 style="margin-right:5px; width:70px;margin-left:15px">チーム名</h5>
            <select
                    style="width:160px; margin:0"
                    class="form-control team_list">

                <option
                        data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => request()->evaluation_date_id,
                                            'group_id' => request()->group_id,
                                            'team_id' => -1
                                        ])}}">入力してください
                </option>

                @if ($teams)
                    @foreach ($teams as $team)
                        <option
                                data-url="{{route('getFeedbackIndex', [
                                            'evaluation_date_id' => request()->evaluation_date_id,
                                            'group_id' => request()->group_id,
                                            'team_id' => $team->id
                                        ])}}"
                                {{$team->id == request()->team_id ? 'selected' : ''}}
                                value="{{$team->id}}">
                            {{$team->name}}
                        </option>
                    @endforeach
                @endif

            </select>

        </div>

        <form
                action=""
                method="post"
                name="fm"
                id="fm">
            {{Form::hidden('fixedUrl', null, ['id' => 'fixedUrl'])}}
            {{Form::hidden('fixedMember', null, ['id' => 'fixedMember'])}}

            <table cellpadding="3" class="table table-striped maintable" id="jidou">

                <thead>
                <tr>
                    <th>
                        <button for="primary" style="padding: 2px 6px;" id="selectedall"
                                class="btn btn-primary {{$team_result_members ? '' : 'disabled'}}">全て選択<input
                                    action="Action" type="checkbox" class="badgebox btn btn-primary hidden">
                        </button>
                    </th>
                    <th>職員分類</th>
                    <th>氏名</th>
                    <th>主な所属チーム</th>
                    <th>職能区分</th>
                    <th>シートの確定</th>
                    <th>フィードバックシートプレビュー</th>
                    <th>フィードバック面談記録</th>
                </tr>
                </thead>

                <tbody>

                @if($team_result_members)

                @foreach ($team_result_members as $key => $items)

                    <tr class="feedback_list_row">
                        @php
                            $url = route('getFeedbackModifyMember', [
                               'group_id'              => tn_optional(tn_optional($items)->trz_team)->trz_team_group_id,
                               'team_id'                => tn_optional($items)->trz_team_id ,
                               'member_id'              => tn_optional(tn_optional($items)->trz_member)->id,
                               'evaluation_date_id'     => tn_optional($items)->trz_evaluation_date_id,
                                ]);
                        @endphp
                        <td>
                            <center>
                                <input style="margin-top:8px;" class="checkitem" name="ids[]"
                                       type="checkbox" id="ids-{{$items->id}}" value="{{$items->id}}">
                            </center>
                        </td>
                        <td>
                            {{$items->group_name}}
                        </td>
                        <td>
                            {{$items->last_name}} {{$items->first_name}}
                        </td>

                        <td>
                            {{$items->team_name}}
                        </td>

                        <td>
                            {{$items->mst_skill_class_name}}
                        </td>
                        <td @can('accessIfRoleAdmin', App\User::class)
                            data-url="{{route('get.feedback.updateSheetFixed', [
                                        'memberId' => $items->trz_member_id,
                                        'evaluationDateId' => request()->evaluation_date_id
                                    ])}}"
                            class="text-center update_sheet_fixed"
                            data-member="{{$items->trz_member_id}}"
                            id="update_sheet_fixed_{{$items->trz_member_id}}"
                                @endcan>

                            @if(1 === $items->sheet_fixed)
                                <span class="glyphicon glyphicon-lock fixed_btn_width"></span>
                            @elseif(0 === $items->sheet_fixed)
                            <a
                                href="#"
                                class="btn btn-primary update_sheet_fixed_btn fixed_btn_width">
                                シートの確定
                            </a>
                            <span class="glyphicon glyphicon-lock fixed_btn_width hidden"></span>
                            @endif

                        </td>
                        <td class="text-center searchhover">

                            <a href='#'
                               class='pencilhover'>
                                <span class='glyphicon glyphicon-search pdf_report_btn_width'></span>
                            </a>

                            <a
                                    href='{{route('reportFeedbackPdf', [
                                            'member_id'             => tn_optional($items)->trz_member_id,
                                            'team_id'            => tn_optional($items)->trz_team_id,
                                            'evaluation_date'    => tn_optional($items)->trz_evaluation_date_id,
                                            'inline' => 1
                                        ])}}' target='_blank' 
                                    class='btn btn-primary pdfReportBtn pdf_report_btn_width'
                                    style='margin-top:-7px;display: none;'>
                                フィードバックシートプレビュー
                            </a>

                        </td>


                        <td class="text-center commenthover"
                            @can('accessIfRoleAdmin', App\User::class) @else onclick="$('.noAuthority').modal('show'); return false;" @endcan>

                            <a href='#' class='pencilhover'>
                                <span class='glyphicon glyphicon-comment pencil_btn_width'></span>
                            </a>

                            <a href='{{$url}}' class='btn btn-primary pencil_btn_width'
                               style='margin-top:-7px;display: none;'>
                                フィードバック面談記録
                            </a>

                        </td>


                    </tr>

                @endforeach

                @endif

                </tbody>

            </table>
        </form>
    </div>

</div><!-- /.container -->

    <div class="modal fade in printModal" data-backdrop="static" data-keyboard="true" tabindex="-1" role="dialog">

        <div class="modal-dialog modal-sm">

            <div class="modal-content">

                <div class="modal-header">
                    <h4 id="modalTitle" class="modal-title">印刷する</h4>
                </div>

                <div class="modal-body">
                    <label for="cdate">これらのレコードを印刷しますか？</label><br>
                </div>

                <div class="modal-footer">

                    <button class="btn btn-primary btnOk" type="button">はい</button>

                    <a
                            href="#"
                            class="btn btn-default"
                            data-dismiss="modal">
                        <i class="fa fa-close"></i>
                        いいえ
                    </a>

                </div>

            </div>

        </div>

    </div>

    <div class="modal fade in noAuthority" data-backdrop="static" data-keyboard="true" tabindex="-1" role="dialog">

        <div class="modal-dialog modal-sm">

            <div class="modal-content">

                <div class="modal-body">
                    <label for="cdate">この機能は利用できません。</label><br>
                </div>

                <div class="modal-footer">

                    <button class="btn btn-primary btnOk" data-dismiss="modal" type="button">はい</button>

                </div>

            </div>

        </div>

    </div>
    <div class="modal fade in sheet_fixed_confirm_step1" data-backdrop="static" data-keyboard="true" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-body">
                    <label for="cdate">確定してよろしいですか。</label><br>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary btnOK">
                        はい
                    </button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-close"></i>
                        いいえ
                    </button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade in sheet_fixed_confirm_step2" data-backdrop="static" data-keyboard="true" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-body">
                    <label for="cdate">
                        確定すると評価の修正ができません。本当に確定してよろしいですか？
                    </label><br>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary btnOK">
                        はい
                    </button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">
                        <i class="fa fa-close"></i>
                        いいえ
                    </button>
                </div>
            </div>
        </div>
    </div>
@stop

@section('modal')
    @include('layouts.modal')
@stop

@section('layouts.footer')
    @include ('layouts.footer')
@stop

@section('optionalJs')
<script type="text/javascript">

    $(document).ready(function () {

        $('#selectedall')
            .off('click.select_all')
            .on('click.select_all', function (e) {
                e.preventDefault();
                var that = this;

                $(that)
                    .closest('.maintable')
                    .find('.checkitem')
                    .each(function (index, el) {
                        this.checked = !this.checked;
                    });
            });

        $('.commenthover')
            .off('mouseenter.show')
            .on('mouseenter.show', function (e) {

                e.stopImmediatePropagation();

                var that = this;

                $('a:nth(0)', that).hide();
                $('a:nth(1)', that).show();
            })
            .off('mouseleave.hide')
            .on('mouseleave.hide', function (e) {

                e.stopImmediatePropagation();

                var that = this;

                $('a:nth(0)', that).show();
                $('a:nth(1)', that).hide();
            });

        $('.searchhover')
            .off('mouseenter.show')
            .on('mouseenter.show', function (e) {

                e.stopImmediatePropagation();

                var that = this;

                $('a:nth(0)', that).hide();
                $('a:nth(1)', that).show();
            })
            .off('mouseleave.hide')
            .on('mouseleave.hide', function (e) {

                e.stopImmediatePropagation();

                var that = this;

                $('a:nth(0)', that).show();
                $('a:nth(1)', that).hide();
            });

        $('.update_sheet_fixed_btn').on('click', function(event) {
            event.preventDefault();
            const fixedUrl = $(this).parent().data('url'),
                memberId = $(this).parent().data('member');
            $('#fixedUrl').val(fixedUrl);
            $('#fixedMember').val(memberId);
            $('.sheet_fixed_confirm_step1').modal('show');
            return false;
        });

        $('.sheet_fixed_confirm_step1 .btnOK').on('click', function(e){
            e.preventDefault();
            $('.sheet_fixed_confirm_step1').modal('hide');
            $('.sheet_fixed_confirm_step2').modal('show');
        });

        $('.sheet_fixed_confirm_step2 .btnOK').on('click', function(e){
            e.preventDefault();
            const fixedUrl = $('#fixedUrl').val(),
                memberId = $('#fixedMember').val();
            let container = $('#update_sheet_fixed_' + memberId);
            $.get(fixedUrl, function (data) {
                if (data.status) {
                    $(container)
                        .find('.glyphicon-lock')
                        .removeClass('hidden')
                        .end()
                        .find('.update_sheet_fixed_btn ')
                        .addClass('hidden');
                } else {
                    $('.custom_error_message')
                        .append('<p class="alert-danger">' + data.message + '</p>');
                }
                $('.sheet_fixed_confirm_step2').modal('hide');
            });
        });
        $('.feedback_list_row')
            .off('click.pdfReport', '.pdfReportBtn')
            .on('click.pdfReport', '.pdfReportBtn', function (e) {

                e.preventDefault();

                var that = this;

                window.open($(that).attr('href'), '_blank');
            });

        $('#printBtn')
            .off('click.showModal')
            .on('click.showModal', function () {

                var that = this;

                $('.printModal')
                    .modal('show')
                    .off('click.print', '.btnOk')
                    .on('click.print', '.btnOk', function () {

                        var that = this,
                            feedbackContainer = $('.maintable'),
                            feedbackBtnChecked = $('.feedback_list_row :checkbox:checked', feedbackContainer);

                        if (feedbackBtnChecked.length) {
                            feedbackBtnChecked.each(function (index, el) {
                                var that = this,
                                    feedback_list_row_checked = $(that).closest('.feedback_list_row'),
                                    reportPDFBtn = $('.pdfReportBtn', feedback_list_row_checked);

                                $(reportPDFBtn).trigger('click.pdfReport');
                            });
                        }
                    });
            });

        $('.evaluations')
            .off('change.list_group')
            .on('change.list_group', function (e) {

                var that = this,
                    optionSelected = $('option:selected', that);

                if (typeof undefined != typeof $(optionSelected).data('url')) {
                    window.location = $('option:selected', that).data('url');
                }
            });

        $('.team_group_list')
            .off('change.list_team')
            .on('change.list_team', function (e) {

                var that = this,
                    optionSelected = $('option:selected', that);

                if (typeof undefined != typeof $(optionSelected).data('url')) {
                    window.location = $('option:selected', that).data('url');
                }
            });

        $('.team_list')
            .off('change.list_member')
            .on('change.list_member', function (e) {

                var that = this,
                    optionSelected = $('option:selected', that);

                if (typeof undefined != typeof $(optionSelected).data('url')) {
                    window.location = $('option:selected', that).data('url');
                }

            });
        if ($('.checkitem').val() == null || $('.checkitem').val() == '') {
            $('#printBtn').prop('disabled', true);
            $('#selectedall').prop('disabled', true);
            $('#confirmBtn').prop('disabled', true);
        }

    });
</script>
@append