123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- <!DOCTYPE html>
- <html style="height: 100%;">
- <head>
- <meta charset="utf-8">
- <title>首页</title>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
- <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
- <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
- <style>
- .topPart{
- display: flex;
- justify-content: space-between;
- flex-direction: row;
- flex-wrap: wrap;
- padding: 0 20px;
- background: #ffffff;
- }
- .dayAmount{
- width: 31%;
- margin: 10px 0;
- padding: 20px 0 20px 10px;
- background: #ff6600;
- }
- .monthAmount{
- width: 31%;
- margin: 10px 0;
- padding: 20px 0 20px 10px;
- background: #1abc9b;
- }
- .yearAmount{
- width: 31%;
- padding: 20px 0 20px 10px;
- margin: 10px 0;
- background: #1e9eb3;
- }
- .dayCount{
- width: 31%;
- padding: 20px 0 20px 10px;
- margin: 10px 0;
- background: #ee7c5c;
- }
- .monthCount{
- width: 31%;
- padding: 20px 0 20px 10px;
- margin: 10px 0;
- background: #ff9900;
- }
- .yearCount{
- width: 31%;
- padding: 20px 0 20px 10px;
- margin: 10px 0;
- background: #2ec7c9;
- }
- h4{
- margin-top: 5px;
- color: #ffffff;
- }
- cite{
- color: #ffffff;
- font-size: 30px;
- }
- .layui-card-header{
- padding-left: 20px;
- color: #000;
- font-size: 18px;
- }
- </style>
- </head>
- <body>
- <div class="layui-fluid">
- <div class="layui-row layui-col-space15">
- <div class="layui-col-md12">
- <div class="layui-row layui-col-space15">
- <!-- 统计数据 -->
- <div class="layui-col-md12">
- <div class="layui-card">
- <div class="layui-card-header">数据概览</div>
- <ul class="layui-col-md12 topPart">
- <li class="dayAmount">
- <p><cite id="today_report">10</cite></p>
- <h4>今日新增报备</h4>
- </li>
- <li class="monthAmount">
- <p><cite id="mouth_report">10</cite></p>
- <h4>本月新增报备</h4>
- </li>
- <li class="yearAmount">
- <p><cite id="general_report">10</cite></p>
- <h4>总报备</h4>
- </li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <script src="../../layuiadmin/layui/layui.js?t=1"></script>
- <script>
- layui.config({
- base: '../../layuiadmin/' //静态资源所在路径
- }).extend({
- index: 'lib/index', //主入口模块
- }).use(['index', 'home'], function() {
- var $ = layui.$
- ,admin = layui.admin
- ,xData = [];
- admin.req({
- url: '/account/statistics/'
- ,type: 'get'
- , done: function (res) {
- $('#today_report').html(res.data.today_report);
- $('#mouth_report').html(res.data.mouth_report);
- $('#general_report').html(res.data.general_report);
- }
- });
- })
- </script>
- </body>
- </html>
|