@extends('admin.layouts.sub')

@section('content')
<div class="container-fluid p-4">
    @include('admin.messages')

    <div class="row mb-2">
        <div class="col align-self-center">
            <label>전체 : {{ $userGroupData->total }} / {{ $userGroupData->rows }}</label>
        </div>
    </div>

    <form name="f_admin_list" id="fAdminList" method="post">
        @csrf
        <div class="table-responsive">
            <table class="table table-hover table-bordered">
                <thead>
                    <tr>
                        <th><input type="checkbox" name="chk_all" id="chkAll" class="form-check-input" value="1"/></th>
                        <th>번호</th>
                        <th>이미지</th>
                        <th>한글명 / 영문명 / 설명</th>
                        <th>회원 수</th>
                        <th>회원 점유율</th>
                    </tr>
                </thead>
                <tbody>
                    @if($userGroupData->rows)
                        @foreach($userGroupData->list as $row)
                        <tr>
                            <td>
                                <input type="checkbox" name="chk[]" id="chk_{{ $row->id }}" class="form-check-input list-check-box" value="{{ $row->id }}"
                                    data-key="{{ $row->user_group_id }}"
                                    data-name="{{ $row->strName }}"/>
                            </td>
                            <td>{{ $row->user_group_id }}</td>
                            <td>
                                @if($row->image)
                                    <img src="{{ $row->image }}" alt="{{ $row->kor_name }}" width="90%" />
                                @else
                                    -
                                @endif
                            </td>
                            <td>{{ $row->strName }}</td>
                            <td>{{ $row->userGroupCount }}</td>
                            <td>{{ $row->strShare }}</td>
                        </tr>
                        @endforeach
                    @else
                        <tr>
                            <td colspan="6">
                                No data.
                            </td>
                        </tr>
                    @endif
                </tbody>
            </table>
        </div>

        <div class="text-center">
            <button type="submit" class="btn btn-success">적용</button>
            <button type="button" class="btn btn-light btn-popup-cancel">닫기</button>
        </div>
        <br/>
    </form>
</div>

<script>
$("#fAdminList").validate({
    onkeyup: false,
    onclick: false,
    onfocusout: false,
    showErrors: function (errorMap, errorList) {
        if (this.numberOfInvalids()) {
            alert(errorList[0].message);
        }
    },
    submitHandler: function() {
        let userGroups = $("input.list-check-box:checked").map(function() {
            return [
                {"key": this.value, "name": this.dataset.name}
            ];
        }).get();

        window.opener.setUserGroup(userGroups);
        window.close();
        return false;
    },
    rules: {
        "chk[]": {required: true}
    },
    messages: {
        "chk[]": {required: "적용할 회원그룹을 선택해 주세요."}
    }
});
</script>
@endsection
