2019-05-27 01:24:17 +00:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
<head>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
<title>ok-admin v2.0 | 很赞的后台模版</title>
|
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
|
|
|
|
<meta name="keywords" content="ok-admin v2.0,ok-admin网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
|
|
|
|
|
|
<meta name="description" content="ok-admin v2.0,顾名思义,很赞的后台模版,它是一款基于Layui框架的轻量级扁平化且完全免费开源的网站后台管理系统模板,适合中小型CMS后台系统。">
|
|
|
|
|
|
<meta name="renderer" content="webkit">
|
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
|
|
|
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
|
|
|
<meta name="format-detection" content="telephone=no">
|
|
|
|
|
|
<script type="text/javascript" src="../lib/echarts/echarts.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="../lib/echarts/echarts.themez.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="../lib/echarts/world/js/china.js"></script>
|
|
|
|
|
|
<!--<link rel="stylesheet" href="../css/console.css" media="all"/>-->
|
|
|
|
|
|
<link rel="stylesheet" href="../css/oksub.css" media="all"/>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
.home .layui-card {
|
|
|
|
|
|
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08);
|
|
|
|
|
|
box-shadow: 0 0 20px rgba(0, 0, 0, .08);
|
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .stat-text {
|
|
|
|
|
|
color: #455a64;
|
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
|
padding-bottom: 5px
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .stat-heading {
|
|
|
|
|
|
color: #99abb4
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .img-box {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
|
padding-right: 20px
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .img-box img {
|
|
|
|
|
|
width: 60px
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .cart-r {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle
|
|
|
|
|
|
}
|
|
|
|
|
|
.map-body {
|
|
|
|
|
|
height: 360px
|
|
|
|
|
|
}
|
|
|
|
|
|
.map-china {
|
|
|
|
|
|
height: 360px
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box {
|
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
display: flex
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box .por-title {
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
color: #868e96;
|
|
|
|
|
|
padding-bottom: 5px
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box .por-txt {
|
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
|
padding-bottom: 5px
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box .pro-head {
|
|
|
|
|
|
width: 50px;
|
|
|
|
|
|
height: 50px;
|
|
|
|
|
|
line-height: 50px;
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
|
float: left;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
padding-right: 20px
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box .pro-head img {
|
|
|
|
|
|
background: #bea8ab;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 100%
|
|
|
|
|
|
}
|
|
|
|
|
|
.progress-box .pro-data {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
|
flex: 1
|
|
|
|
|
|
}
|
|
|
|
|
|
.data-body .w-img img {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .stat-text {
|
|
|
|
|
|
color: #455a64;
|
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
|
padding-bottom: 5px
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .stat-heading {
|
|
|
|
|
|
color: #99abb4
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .img-box {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .img-box img {
|
|
|
|
|
|
width: 60px
|
|
|
|
|
|
}
|
|
|
|
|
|
.cart-data .cart-r {
|
|
|
|
|
|
display: inline-block;
|
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
|
padding-left: 20px
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.ok-card-body {
|
|
|
|
|
|
padding: 20px;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
box-sizing: border-box
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</head>
|
2019-08-26 11:28:05 +00:00
|
|
|
|
<body class="ok-body home ok-body-scroll">
|
2019-05-27 01:24:17 +00:00
|
|
|
|
<div class="layui-row layui-col-space15">
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="layui-col-xs6 layui-col-md3">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix cart-data">
|
|
|
|
|
|
<div class="img-box" ok-pc-in-show>
|
|
|
|
|
|
<img src="../images/home-01.png" alt="none"/>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="cart-r">
|
|
|
|
|
|
<div class="stat-text incomes-num">0</div>
|
|
|
|
|
|
<div class="stat-heading">收入</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="layui-col-xs6 layui-col-md3">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix cart-data">
|
|
|
|
|
|
<div class="img-box" ok-pc-in-show>
|
|
|
|
|
|
<img src="../images/home-02.png" alt="none"/>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="cart-r">
|
|
|
|
|
|
<div class="stat-text goods-num">0</div>
|
|
|
|
|
|
<div class="stat-heading">商品</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="layui-col-xs6 layui-col-md3">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix cart-data">
|
|
|
|
|
|
<div class="img-box" ok-pc-in-show>
|
|
|
|
|
|
<img src="../images/home-03.png" alt="none"/>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="cart-r">
|
|
|
|
|
|
<div class="stat-text blogs-num">0</div>
|
|
|
|
|
|
<div class="stat-heading">博客</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="layui-col-xs6 layui-col-md3">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix cart-data">
|
|
|
|
|
|
<div class="img-box" ok-pc-in-show>
|
|
|
|
|
|
<img src="../images/home-04.png" alt="none"/>
|
2019-08-26 09:08:33 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="cart-r">
|
|
|
|
|
|
<div class="stat-text fans-num">0</div>
|
|
|
|
|
|
<div class="stat-heading">用户</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="layui-row layui-col-space15">
|
2019-08-27 07:10:13 +00:00
|
|
|
|
<div class="layui-col-md8">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body map-body">
|
|
|
|
|
|
<div style="height: 100%;" id="userSourceMap"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="layui-col-md4">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="layui-card-header">
|
|
|
|
|
|
<div class="ok-card-title">用户排行榜</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="ok-card-body map-body" style="height: 320px">
|
|
|
|
|
|
<div class="progress-box clearfix">
|
|
|
|
|
|
<div class="pro-head">
|
|
|
|
|
|
<img src="../images/face.jpg" alt="none"/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pro-data">
|
|
|
|
|
|
<h4 class="por-title">Visits</h4>
|
|
|
|
|
|
<div class="por-txt pro-a">用户比例</div>
|
|
|
|
|
|
<div class="layui-progress" lay-filter="pro-a">
|
|
|
|
|
|
<div class="layui-progress-bar per-bg-a" lay-percent="35%"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="progress-box clearfix">
|
|
|
|
|
|
<div class="pro-head">
|
|
|
|
|
|
<img src="../images/face.jpg" alt="none"/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pro-data">
|
|
|
|
|
|
<h4 class="por-title">Visits</h4>
|
|
|
|
|
|
<div class="por-txt pro-a">用户比例</div>
|
|
|
|
|
|
<div class="layui-progress" lay-filter="pro-b">
|
|
|
|
|
|
<div class="layui-progress-bar per-bg-b" lay-percent="15%"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="progress-box clearfix">
|
|
|
|
|
|
<div class="pro-head">
|
|
|
|
|
|
<img src="../images/face.jpg" alt="none"/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pro-data">
|
|
|
|
|
|
<h4 class="por-title">Visits</h4>
|
|
|
|
|
|
<div class="por-txt pro-c">用户比例</div>
|
|
|
|
|
|
<div class="layui-progress" lay-filter="pro-c">
|
|
|
|
|
|
<div class="layui-progress-bar per-bg-c" lay-percent="20%"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
|
|
|
|
|
|
<div class="progress-box clearfix">
|
|
|
|
|
|
<div class="pro-head">
|
|
|
|
|
|
<img src="../images/face.jpg" alt="none"/>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pro-data">
|
|
|
|
|
|
<h4 class="por-title">Visits</h4>
|
|
|
|
|
|
<div class="por-txt pro-d">用户比例</div>
|
|
|
|
|
|
<div class="layui-progress" lay-filter="pro-d">
|
|
|
|
|
|
<div class="layui-progress-bar per-bg-d" lay-percent="30%"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
2019-08-27 07:10:13 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="layui-row layui-col-space15">
|
|
|
|
|
|
<div class="layui-col-md6">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix">
|
|
|
|
|
|
<table id="userData" lay-filter="userdata"></table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="layui-col-md6">
|
|
|
|
|
|
<div class="layui-card">
|
|
|
|
|
|
<div class="ok-card-body clearfix">
|
|
|
|
|
|
<div class="map-china" id="userLocationMap"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
</div>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
|
|
|
|
|
<script type="text/javascript" src="../lib/layui/layui.js"></script>
|
2019-08-24 14:09:42 +00:00
|
|
|
|
<script type="text/javascript" src="../js/console.js"></script>
|
2019-05-27 01:24:17 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|