@php
    $mst_base_skills = TnHelper::getDataOfDotArray($trz_member, 'mst_class_skill.mst_base_skills');
    $mst_base_skill_details = TnHelper::getDataOfDotArray($trz_member, 'mst_class_skill.mst_base_skills.mst_base_skill_details');
    $registerEnabled = isset($mst_base_skills) && count($mst_base_skills) > 0;
@endphp

@extends('layouts.general')

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

@section('link')
    <link href="{!! asset('css/feedback/boss_index.css') !!}" rel="stylesheet">
    <link href="{!! asset('css/common/common.css') !!}" rel="stylesheet">
    <script src="{!! asset('js/feedback/evaluation/self.js') !!}" type="text/javascript"></script>
@stop

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

        <div class="flash-message" id="editionMsg">
            @if(Session::has('alert-danger'))
                <p class="alert alert-danger">{{ Session::get('alert-danger') }}
                    <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                </p>
            @endif
        </div>
        <form
                class="ajaxValidateFrm"
                action="{{route('post.feedback.evaluation.self.update', [
                     'memberId' => $trz_member['id'],
                ])}}"
                method="post" id="evaluation-self-form">
            {{csrf_field()}}

            <div class="row">

                <div class="col-md-3">

                    <div class="form-group">

                        <label for="sel_member"><b>評価対象者</b></label>

                        @if(3 == Auth::user()->auth && isset($trz_member))

                            <label>{{sprintf('%s %s', $trz_member['last_name'], $trz_member['first_name'])}}</label>

                        @else
                            <select class="form-control" id="sel_member">
                                <option disabled="disabled">---</option>
                                @foreach($trz_members as $each_member)
                                    <option
                                            {{$trz_member['id'] == $each_member->id ? 'selected="selected"' : ''}}
                                            value="{{$each_member->id}}"
                                            data-route="{{route('get.feedback.evaluation.self.index', [
                                            'memberId' => isset($each_member) ? $each_member->id : null
                                        ])}}">{{sprintf('%s %s', $each_member->last_name, $each_member->first_name)}}</option>
                                @endforeach
                            </select>
                        @endif

                        <input id="TrzMemberName" type="hidden" name="TrzMemberName"
                               value="{{sprintf('%s %s', $trz_member['last_name'], $trz_member['first_name'])}}"/>

                    </div>

                </div>

            </div>

            @include('feedback.evaluation.self_item')
        </form>
    </div>
@stop

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

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

@section('optionalJs')

    <script src="{!! asset('js/lib/validateFrm.js') !!}" type="text/javascript"></script>

    <script>
        $(document).ready(function () {
            var selfEvaluationModule = (function () {

                var calculateSkillEvaluation = function () {
                        $('input[type="radio"]')
                            .off('click.calculateSkillEvaluation uncheckedAll.calculateSkillEvaluation')
                            .on('click.calculateSkillEvaluation uncheckedAll.calculateSkillEvaluation', function (e) {

                                var that = this,
                                    base_skill_evaluation_container = $(that).closest('.base_skill_evaluation_container'),
                                    base_skill_detail_evaluation_container = $('.base_skill_detail_evaluation_container', base_skill_evaluation_container),
                                    num_base_skill_detail_evaluation_container = $(base_skill_detail_evaluation_container).length,
                                    base_skill_evaluation = 0;

                                $(':radio:checked', base_skill_evaluation_container)
                                    .each(function (index, el) {
                                        base_skill_evaluation = base_skill_evaluation + convertCharToEvaluation($(el).val());
                                    });

                                $('.base_skill_evaluation', base_skill_evaluation_container).val((Math.round(base_skill_evaluation / num_base_skill_detail_evaluation_container)));

                            });
                    },
                    chooseMember = function () {

                        $('#sel_member')
                            .off('change.chooseMember')
                            .on('change.chooseMember', function () {
                                var that = this,
                                    optionSelected = $('option:selected', that);
                                if ($(optionSelected).data('route')) {
                                    window.location.href = $(optionSelected).data('route');
                                }
                            });
                    },
                    uncheckAllRadio = function () {

                        $('#uncheck-all-radio')
                            .off('click.uncheckAllRadio')
                            .on('click.uncheckAllRadio', function (e) {

                                var that = this;
                                $(that)
                                    .closest('.container')
                                    .find('input[type="radio"]')
                                    .prop('checked', false)
                                    .trigger('uncheckedAll.calculateSkillEvaluation');
                            });
                    };

                return {
                    calculateSkillEvaluation: calculateSkillEvaluation,
                    chooseMember: chooseMember,
                    uncheckAllRadio: uncheckAllRadio
                };
            })();

            selfEvaluationModule.calculateSkillEvaluation();
            selfEvaluationModule.chooseMember();
            selfEvaluationModule.uncheckAllRadio();
        });

        function convertCharToEvaluation(char) {
            var temp = {'A': 1, 'B': 2, 'C': 3, 'D': 4};
            return temp[char];
        }

    </script>

@append