<div class="pageFormContent card" layoutH>
    <fieldset>
        <legend><@t.page 'report.user'/></legend>
        <div class="unit">
            <p>
                <a class="button" href="report/user.html" target="navTab" rel="report/user"><i class="icon-refresh"></i> <@t.page 'button.refresh'/></a>
            </p>
        <div>
        <div class="unit clearfix">
            <div id="register" style="width:50%;min-width:400px;float:left;"></div>
            <div id="login" style="width:50%;min-width:400px;float:left;"></div>
            <div id="operate" style="width:50%;min-width:400px;float:left;"></div>
            <div id="userComment" style="width:50%;min-width:400px;float:left;"></div>
         </div>
    </fieldset>
</div>
<script>
document.getElementById('register').style.height=document.getElementById('register').offsetWidth*0.5+'px';
document.getElementById('login').style.height=document.getElementById('login').offsetWidth*0.5+'px';
document.getElementById('operate').style.height=document.getElementById('operate').offsetWidth*0.5+'px';
document.getElementById('userComment').style.height=document.getElementById('userComment').offsetWidth*0.5+'px';
echarts.init(document.getElementById('register')).setOption({
    title: {
        text: '<@t.page 'register'/>',
        subtext: '<@t.page 'total'/>:<@_sysUserList pageSize=0>${page.totalCount}</@_sysUserList>',
        x:'center'
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: [<#list 30..0 as a>'${(.now?long-a*86400000)?number_to_date}'<#sep>,</#list>]
    },
    yAxis: {
        type: 'value'
    },
    series: [
    {
           name:'<@t.page 'register'/>',
           type:'line',
           data:[<#list 30..0 as a><@_sysUserList startRegisteredDate=(.now?long-a*86400000)?number_to_date?string endRegisteredDate=(.now?long-(a-1)*86400000)?number_to_date?string>${page.totalCount}</@_sysUserList><#sep>,</#list>],
           areaStyle: {}
       }]
});
echarts.init(document.getElementById('login')).setOption({
    title: {
        text: '<@t.page 'login'/>',
        x:'center'
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: [<#list 30..0 as a>'${(.now?long-a*86400000)?number_to_date}'<#sep>,</#list>]
    },
    yAxis: {
        type: 'value'
    },
    series: [
    {
        name:'<@t.page 'login'/>',
        type:'line',
        data:[<#list 30..0 as a><@_logLoginList startCreateDate=(.now?long-a*86400000)?number_to_date?string endCreateDate=(.now?long-(a-1)*86400000)?number_to_date?string>${page.totalCount}</@_logLoginList><#sep>,</#list>],
        areaStyle: {}
    }]
});
echarts.init(document.getElementById('operate')).setOption({
    title: {
        text: '<@t.page 'operate'/>',
        x:'center'
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: [<#list 30..0 as a>'${(.now?long-a*86400000)?number_to_date}'<#sep>,</#list>]
    },
    yAxis: {
        type: 'value'
    },
    series: [
    {
        name:'<@t.page 'operate'/>',
        type:'line',
        data:[<#list 30..0 as a><@_logOperateList channel='web_manager' startCreateDate=(.now?long-a*86400000)?number_to_date?string endCreateDate=(.now?long-(a-1)*86400000)?number_to_date?string>${page.totalCount}</@_logOperateList><#sep>,</#list>],
        areaStyle: {}
    }]
});
echarts.init(document.getElementById('userComment')).setOption({
    title: {
        text: '<@t.page 'comment'/>',
        x:'center'
    },
    tooltip : {
        trigger: 'axis'
    },
    toolbox: {
        feature: {
            saveAsImage: {}
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: [<#list 30..0 as a>'${(.now?long-a*86400000)?number_to_date}'<#sep>,</#list>]
    },
    yAxis: {
        type: 'value'
    },
    series: [
    {
        name:'<@t.page 'operate'/>',
        type:'line',
        data:[<#list 30..0 as a><@_logOperateList operate='save.cmsComment' startCreateDate=(.now?long-a*86400000)?number_to_date?string endCreateDate=(.now?long-(a-1)*86400000)?number_to_date?string>${page.totalCount}</@_logOperateList><#sep>,</#list>],
        areaStyle: {}
    }]
});
</script>