<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>私塾家</title>
    <script th:include="sys/common/metaCSS" th:remove="tag"></script>
    <script th:include="sys/common/metaJS" th:remove="tag"></script>
</head>
<style>
    .tablelink {
        margin-right: 10px;
    }
</style>
<body>
<div class="rightinfo">
    <form id="seachform" th:action="@{/sys/usercenter/onlineTeacherList.html}" method="post">
        <ul class="seachform">
            <li>
                <label>老师</label>
                <input name="name" type="text" class="scinput" th:value="${search.get('name')}"/>
                <input type="hidden" id="id" name="id" th:value="${search.get('id')}"/>
            </li>
            <li>
                <label>&nbsp;</label>
                <input type="button" class="scbtn" value="查询"/>
            </li>
            <li>
                <ul class="toolbar">
                    <li class="click"><span><img style="width: 24px;height: 24px"
                                                 th:src="@{/static/sys/images/select.png}"/></span>选择
                    </li>
                </ul>
            </li>
        </ul>
    </form>
    <table class="tablelist">
        <thead>
        <tr>
            <th style="width: 50px;"><input name="checkboxlist" type="checkbox"/></th>
            <th>老师</th>
            <th>头像</th>
            <th>电话</th>
            <th>已解答题目数量</th>
            <th>未解答题目数量</th>
            <th>创建时间</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="item:${list}">
            <td><input name="selectlist" type="checkbox" th:data-id="${item.user_id}"/></td>
            <td th:text="${item.name}"></td>
            <td class="imgtd">
                <img th:if="${item.t_photo}!=null" th:src="${imgUrl}+''+${item.t_photo}+'?x-oss-process=image/resize,m_lfit,h_100,w_100'" style="width: 50px;height: 50px;" />
            </td>
            <td th:text="${item.telephone}"></td>
            <td th:text="${item.feedback_num}"></td>
            <td th:text="${item.nofeedback_num}"></td>
            <td th:text="${#calendars.format(item.create_time,'yyyy-MM-dd HH:mm:ss')}"></td>
        </tr>
        </tbody>
    </table>
    <!-- 分页 -->
    <div class="pagin">
        <div class="message">共<i class="blue">[[${page.rowCnt}]]</i>条记录，当前显示第&nbsp;<i class="blue">[[${page.pageNo }]]&nbsp;</i>页
        </div>
        <div th:utext='${listNavigatHtml}' th:remove="tag"></div>
    </div>
</div>
</body>
<script type="text/javascript">

    $(function () {
        checkNode();
        $('[name=checkboxlist]').click(function () {
            checkAll();
        });
    })

    function checkAll() {
        $.each($('[name=selectlist]'), function () {
            if ($(this).prop('checked')) {
                $(this).prop('checked', false);
            } else {
                $(this).prop('checked', true);
            }
        });

    }

    $('ul.toolbar li.click').click(function () {
        var selectIds = [];
        $.each($('[name=selectlist]'), function () {
            if ($(this).prop('checked')) {
                var id = $(this).attr('data-id');
                selectIds.push(id);
            }
        });
        if(selectIds.length > 1){
            alert('只能选择一个老师！');
            return;
        }
        if(selectIds.length == 0){
            alert('请选择老师！');
            return;
        }
        if (selectIds.length == 0) {
            selectIds.push('');
        }
        var url = "[[${sysUrl}]]/sys/usercenter/saveOnlineTeacher";
        var params = {
            id: $("#id").val(),
            teacherIds: selectIds
        };
        $.post(url, params, function (data) {
            if (data.meta.success) {
                alert('分配老师成功，请刷新显示！');
                window.close();
            }else{
                alert('分配老师失败！');
            }
        });

    });


    function checkNode() {
        var url = '[[${sysUrl}]]/sys/usercenter/getHomeworkOnlineTeacher';
        var params = {'id': $('#id').val()};
        $.post(url, params, function (teacherId) {
            $.each($('[name=selectlist]'), function () {
                var id = $(this).attr('data-id');
                if (id == teacherId) {
                    $(this).prop('checked', true);
                }
            });
        });
    }
</script>
</html>