<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>私塾家</title>
	<link th:href="@{/static/kmt/css/bootstrap.min.css}" rel="stylesheet">
	<link rel="stylesheet" type="text/css" th:href="@{/static/kmt/css/common.css}"/>
	<link rel="stylesheet" type="text/css" th:href="@{/static/kmt/css/header.css}"/>
	<script th:include="sys/common/metaCSS" th:remove="tag"></script>
	<script th:include="sys/common/metaJS" th:remove="tag"></script>
	<script src="sys/js/jquery.validate.min.js" th:src="@{/static/sys/js/jquery.validate.min.js}"></script>
	<script src="sys/js/jquery-validation/messages_zh.js" th:src="@{/static/sys/js/jquery-validation/messages_zh.js}"></script>
	<script src="sys/js/My97DatePicker/WdatePicker.js" th:src="@{/static/sys/js/My97DatePicker/WdatePicker.js}"></script>
    <script src="js/echarts.min.js" th:src="@{/static/js/echarts.min.js}"></script>

	<style>
    	.clearfix:after {
			visibility: hidden;
			display: block;
			font-size: 0;
			content: " ";
			clear: both;
			height: 0;
		}
		.clearfix { display: inline-table; }
		* html .clearfix { height: 1%; }
		.clearfix { display: block; }
		.fl{display:inline;float:left}
		clearfix >control-label-error{display:inline;float:left;marign-left:10px}
		 label.control-label-error {
  				color: Red;
             }
          .lispan {line-height: 34px;}   
          
          .select1{
   		    width:100%;
		    height: 32px;
		    line-height: 32px;
		    border-top: solid 1px #a7b5bc;
		    border-left: solid 1px #a7b5bc;
		    border-right: solid 1px #ced9df;
		    border-bottom: solid 1px #ced9df;
		    opacity:1;
	        margin-bottom: 10px;
    	}
    	
    	textarea{
    	width: 382px;
    	}
    </style>
</head>

<body>
<div class="place">
    <span>位置：</span>
    <ul class="placeul">
		<li><a href="#">用户管理中心</a></li>
		<li><a th:href="@{/sys/usercenter/teacherList.html}">老师列表</a></li>
		<li>老师档案</li>
	</ul>
</div>
<div class="formbody">
	<div class="formtitle"><span>基本资料</span></div>
    <div>
        <form>
            <ul class="forminfo">
                <li class="clearfix">
                    <label>姓名:</label>
                    <input type="text" readonly class="detail" th:value="${teacher.name}"/>
                </li>
                <li class="clearfix">
                    <label>性别:</label>
                    <input type="text" readonly class="detail" th:value="${teacher.sex == 1 ? '男' : '女'}"/>
                </li>
                <li class="clearfix">
                    <label>电话:</label>
                    <input type="number" readonly class="detail" th:value="${teacher.telephone}"/>
                </li>
            </ul>
        </form>
    </div>
    <div th:if="${teacher.type eq 2}">
        <div class="formtitle"><span>学生签到统计</span></div>
        <ul>
            <li>
                <table class="table">
                    <thead>
                    <tr>
                        <th>学生</th>
                        <th>签到次数</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item:${subscribeCountList}">
                        <td th:text="${item.child_name}"></td>
                        <td th:text="${item.num}"></td>
                    </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </div>
    <div th:if="${teacher.type eq 7}">
        <div class="formtitle"><span>学生列表</span></div>
        <ul>
            <li>
                <table class="table">
                    <thead>
                    <tr>
                        <th>名字</th>
                        <th>头像</th>
                        <th>二维码</th>
                        <th>电话</th>
                        <th>学校</th>
                        <th>年级</th>
                        <th>创建时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item:${studentList}" >
                        <td th:text="${item.child_name}" ></td>
                        <td  class="imgtd">
                            <img th:if="${not #lists.isEmpty(item.img_url)}" th:src="${imgUrl}+''+${item.img_url}" style="width: 50px;height: 50px;" />
                        </td>
                        <td  class="imgtd">
                            <img th:if="${not #lists.isEmpty(item.qrcode_url)}" th:src="${imgUrl}+''+${item.qrcode_url}" style="width: 50px;height: 50px;" />
                        </td>
                        <td th:text="${item.phone}" ></td>
                        <td th:text="${item.school}" ></td>
                        <td th:text="${item.grade}" ></td>
                        <td style="width: 141px;" th:text="${#calendars.format(item.create_time,'yyyy-MM-dd HH:mm:ss')}" ></td>
                        <td>
                            <a th:href="@{/sys/usercenter/studentDetail.html(id=${item.id})}" class="tablelink" >详情</a>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </li>
        </ul>
        <div class="formtitle"><span>一对一服务</span></div>
        <ul>
            <li>
                <table class="table">
                    <thead>
                    <tr>
                        <th>日期</th>
                        <th>科目</th>
                        <th>授课年级</th>
                        <th>馆名称</th>
                        <th>课次</th>
                        <th>当前课次</th>
                        <th>课次单价</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item:${oneToOneService}">
                        <td th:text="${item.start_time}+'~'+${item.end_time}"></td>
                        <td th:text="${item.course_name}"></td>
                        <td th:text="${item.grade}"></td>
                        <td th:text="${item.league_name}"></td>
                        <td th:text="${item.course_count}"></td>
                        <td th:text="${item.current_count}"></td>
                        <td th:text="${item.price}"></td>
                    </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </div>
    <div th:if="${teacher.type eq 8}">
        <div class="formtitle"><span>批改统计</span></div>
        <!--作业批改数量统计-->
        <div id="datacount" style="width: 600px;height:400px;display: inline-block;"></div>
        <div id="finishedRate" style="width: 600px;height:400px;display: inline-block;"></div>
    </div>
</div>
</body>
<script type="text/javascript" th:inline="javascript">
    var workCountList = [[${workCountList}]];
    //console.info(workCountList);
    var allCount_0 = 0;
    var allCount_1 = 0;
    var yearCount_0 = 0;
    var yearCount_1 = 0;
    var monthCount_0 = 0;
    var monthCount_1 = 0;
    var weekCount_0 = 0;
    var weekCount_1 = 0;
    if(workCountList && workCountList.length>0){
        for (var i = 0; i < workCountList.length; i++) {
            if (workCountList[i].type == 'finished_all') {
                allCount_1 = workCountList[i].num;
            } else if (workCountList[i].type == 'all') {
                allCount_0 = workCountList[i].num;
            } else if (workCountList[i].type == 'finished_year') {
                yearCount_1 = workCountList[i].num;
            } else if (workCountList[i].type == 'all_year') {
                yearCount_0 = workCountList[i].num;
            } else if (workCountList[i].type == 'finished_month') {
                monthCount_1 = workCountList[i].num;
            } else if (workCountList[i].type == 'all_month') {
                monthCount_0 = workCountList[i].num;
            } else if (workCountList[i].type == 'finished_week') {
                weekCount_1 = workCountList[i].num;
            } else if (workCountList[i].type == 'all_week') {
                weekCount_0 = workCountList[i].num;
            }
        }
    }
    // 基于准备好的dom，初始化echarts实例
    var datacountChart = echarts.init(document.getElementById('datacount'));
    // 指定图表的配置项和数据
    var option1 = {
        title: {
            text: '作业批改数量统计'
        },
        tooltip: {},
        legend: {
            //data:['']
        },
        xAxis: {
            data: ['近一年','近一月','近一周']
        },
        yAxis: {},
        series: [{
            name: '总数量',
            type: 'bar',
            data: [yearCount_0, monthCount_0, weekCount_0]
        },{
            name: '完成数量',
            type: 'bar',
            data: [yearCount_1, monthCount_1, weekCount_1]
        }]
    };
    // 使用刚指定的配置项和数据显示图表。
    datacountChart.setOption(option1);
    var workRateMap = [[${workRateMap}]];
    console.info(workRateMap);
    var finishedRateChart = echarts.init(document.getElementById('finishedRate'));
    option2 = {
        title: {
            text: '作业完成率统计'
        },
        tooltip: {},
        xAxis: {
            type: 'category',
            data: ['近一年','近一月','近一周']
        },
        yAxis: {
            type: 'value'
        },
        series: [{
            name: '完成率',
            data: [workRateMap.year_rate,workRateMap.month_rate,workRateMap.week_rate],
            type: 'line'
        }]
    };
    finishedRateChart.setOption(option2);
</script>
</html>