parent
bc72f0cf42
commit
0eb7710ecd
@ -1,2 +1,24 @@ |
|||||||
# admin前端页面 |
# admin前端页面 |
||||||
|
|
||||||
|
做到前后端分离。 |
||||||
|
|
||||||
|
--- |
||||||
|
当然也可以不分离,直接把前端页面放入到server中。这样做的好处是启动服务器即可访问页面。 |
||||||
|
|
||||||
|
步骤如下: |
||||||
|
|
||||||
|
- cd到sop-admin-front目录,执行命令`mvn clean install` |
||||||
|
- sop-admin-server工程添加maven依赖 |
||||||
|
|
||||||
|
``` |
||||||
|
<dependency> |
||||||
|
<groupId>com.gitee.sop</groupId> |
||||||
|
<artifactId>sop-admin-front</artifactId> |
||||||
|
<version>1.0.0-SNAPSHOT</version> |
||||||
|
</dependency> |
||||||
|
``` |
||||||
|
|
||||||
|
启动服务端,访问:http://localhost:8082 |
||||||
|
|
||||||
|
原理就是springboot访问webjars资源,建议在开发的时候前后端分离,开发完成后再打包成webjars。 |
||||||
|
|
||||||
|
@ -1,147 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>登录名 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="username" name="username" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="phone" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>手机 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="phone" name="phone" required="" lay-verify="phone" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_email" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>邮箱 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_email" name="email" required="" lay-verify="email" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label class="layui-form-label"><span class="x-red">*</span>角色</label> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<input type="checkbox" name="like1[write]" lay-skin="primary" title="超级管理员" checked=""> |
|
||||||
<input type="checkbox" name="like1[read]" lay-skin="primary" title="编辑人员"> |
|
||||||
<input type="checkbox" name="like1[write]" lay-skin="primary" title="宣传人员" checked=""> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_pass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_pass" name="pass" required="" lay-verify="pass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
6到16个字符 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>确认密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="add" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
// 可以对父窗口进行刷新 |
|
||||||
x_admin_father_reload(); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,145 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>登录名 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="username" name="username" required="" lay-verify="required" |
|
||||||
autocomplete="off" value="admin" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="phone" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>手机 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" value="18925139194" id="phone" name="phone" required="" lay-verify="phone" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_email" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>邮箱 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" value="113664000@qq.com" id="L_email" name="email" required="" lay-verify="email" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label class="layui-form-label"><span class="x-red">*</span>角色</label> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<input type="checkbox" name="like1[write]" lay-skin="primary" title="超级管理员" checked=""> |
|
||||||
<input type="checkbox" name="like1[read]" lay-skin="primary" title="编辑人员"> |
|
||||||
<input type="checkbox" name="like1[write]" lay-skin="primary" title="宣传人员" > |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_pass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_pass" name="pass" required="" lay-verify="pass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
6到16个字符 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>确认密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="add" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,87 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-nav"> |
|
||||||
<span class="layui-breadcrumb"> |
|
||||||
<a href="">首页</a> |
|
||||||
<a href="">演示</a> |
|
||||||
<a> |
|
||||||
<cite>导航元素</cite></a> |
|
||||||
</span> |
|
||||||
<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新"> |
|
||||||
<i class="layui-icon" style="line-height:30px">ဂ</i></a> |
|
||||||
</div> |
|
||||||
<div class="x-body"> |
|
||||||
<div class="layui-row"> |
|
||||||
<form class="layui-form layui-col-md12 layui-form-pane"> |
|
||||||
<div class="layui-form-item" id="x-city"> |
|
||||||
<label class="layui-form-label">城市联动</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<select name="province" lay-filter="province"> |
|
||||||
<option value="">请选择省</option> |
|
||||||
</select> |
|
||||||
</div> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<select name="city" lay-filter="city"> |
|
||||||
<option value="">请选择市</option> |
|
||||||
</select> |
|
||||||
</div> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<select name="area" lay-filter="area"> |
|
||||||
<option value="">请选择县/区</option> |
|
||||||
</select> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<blockquote class="layui-elem-quote"> </blockquote> |
|
||||||
<pre class="layui-code" lay-title="JavaScript" lay-skin="notepad"> |
|
||||||
//xcity城市插件 基于于jquery与layui form 模块,使用之前先确认这两者是否引入 |
|
||||||
//插件文件为 xcity.js,引入 |
|
||||||
select lay-filter 属性值 为必须 "province/city/area" |
|
||||||
//初始化 |
|
||||||
$('#x-city').xcity(); |
|
||||||
//传默认值 |
|
||||||
$('#x-city').xcity('广东','广州市','东山区'); |
|
||||||
</pre> |
|
||||||
</div> |
|
||||||
<script type="text/javascript" src="../assets/js/xcity.js"></script> |
|
||||||
<script> |
|
||||||
layui.use(['form','code'], function(){ |
|
||||||
form = layui.form; |
|
||||||
|
|
||||||
layui.code(); |
|
||||||
|
|
||||||
$('#x-city').xcity('广东','广州市','东山区'); |
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,108 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用,详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
var option = { |
|
||||||
title: { |
|
||||||
text: '折线图堆叠' |
|
||||||
}, |
|
||||||
tooltip: { |
|
||||||
trigger: 'axis' |
|
||||||
}, |
|
||||||
legend: { |
|
||||||
data:['邮件营销','联盟广告','视频广告','直接访问','搜索引擎'] |
|
||||||
}, |
|
||||||
grid: { |
|
||||||
left: '3%', |
|
||||||
right: '4%', |
|
||||||
bottom: '3%', |
|
||||||
containLabel: true |
|
||||||
}, |
|
||||||
toolbox: { |
|
||||||
feature: { |
|
||||||
saveAsImage: {} |
|
||||||
} |
|
||||||
}, |
|
||||||
xAxis: { |
|
||||||
type: 'category', |
|
||||||
boundaryGap: false, |
|
||||||
data: ['周一','周二','周三','周四','周五','周六','周日'] |
|
||||||
}, |
|
||||||
yAxis: { |
|
||||||
type: 'value' |
|
||||||
}, |
|
||||||
series: [ |
|
||||||
{ |
|
||||||
name:'邮件营销', |
|
||||||
type:'line', |
|
||||||
stack: '总量', |
|
||||||
data:[120, 132, 101, 134, 90, 230, 210] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name:'联盟广告', |
|
||||||
type:'line', |
|
||||||
stack: '总量', |
|
||||||
data:[220, 182, 191, 234, 290, 330, 310] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name:'视频广告', |
|
||||||
type:'line', |
|
||||||
stack: '总量', |
|
||||||
data:[150, 232, 201, 154, 190, 330, 410] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name:'直接访问', |
|
||||||
type:'line', |
|
||||||
stack: '总量', |
|
||||||
data:[320, 332, 301, 334, 390, 330, 320] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name:'搜索引擎', |
|
||||||
type:'line', |
|
||||||
stack: '总量', |
|
||||||
data:[820, 932, 901, 934, 1290, 1330, 1320] |
|
||||||
} |
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,106 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
var labelRight = { |
|
||||||
normal: { |
|
||||||
position: 'right' |
|
||||||
} |
|
||||||
}; |
|
||||||
option = { |
|
||||||
title: { |
|
||||||
text: '交错正负轴标签', |
|
||||||
subtext: 'From ExcelHome', |
|
||||||
sublink: 'http://e.weibo.com/1341556070/AjwF2AgQm' |
|
||||||
}, |
|
||||||
tooltip : { |
|
||||||
trigger: 'axis', |
|
||||||
axisPointer : { // 坐标轴指示器,坐标轴触发有效 |
|
||||||
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow' |
|
||||||
} |
|
||||||
}, |
|
||||||
grid: { |
|
||||||
top: 80, |
|
||||||
bottom: 30 |
|
||||||
}, |
|
||||||
xAxis: { |
|
||||||
type : 'value', |
|
||||||
position: 'top', |
|
||||||
splitLine: {lineStyle:{type:'dashed'}}, |
|
||||||
}, |
|
||||||
yAxis: { |
|
||||||
type : 'category', |
|
||||||
axisLine: {show: false}, |
|
||||||
axisLabel: {show: false}, |
|
||||||
axisTick: {show: false}, |
|
||||||
splitLine: {show: false}, |
|
||||||
data : ['ten', 'nine', 'eight', 'seven', 'six', 'five', 'four', 'three', 'two', 'one'] |
|
||||||
}, |
|
||||||
series : [ |
|
||||||
{ |
|
||||||
name:'生活费', |
|
||||||
type:'bar', |
|
||||||
stack: '总量', |
|
||||||
label: { |
|
||||||
normal: { |
|
||||||
show: true, |
|
||||||
formatter: '{b}' |
|
||||||
} |
|
||||||
}, |
|
||||||
data:[ |
|
||||||
{value: -0.07, label: labelRight}, |
|
||||||
{value: -0.09, label: labelRight}, |
|
||||||
0.2, 0.44, |
|
||||||
{value: -0.23, label: labelRight}, |
|
||||||
0.08, |
|
||||||
{value: -0.17, label: labelRight}, |
|
||||||
0.47, |
|
||||||
{value: -0.36, label: labelRight}, |
|
||||||
0.18 |
|
||||||
] |
|
||||||
} |
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,349 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/extension/bmap.min.js" type="text/javascript"></script> |
|
||||||
<script src="http://echarts.baidu.com/asset/map/js/china.js"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
myChart.setOption({ |
|
||||||
series: [{ |
|
||||||
type: 'map', |
|
||||||
map: 'china' |
|
||||||
}] |
|
||||||
}); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
var geoCoordMap = { |
|
||||||
'上海': [121.4648,31.2891], |
|
||||||
'东莞': [113.8953,22.901], |
|
||||||
'东营': [118.7073,37.5513], |
|
||||||
'中山': [113.4229,22.478], |
|
||||||
'临汾': [111.4783,36.1615], |
|
||||||
'临沂': [118.3118,35.2936], |
|
||||||
'丹东': [124.541,40.4242], |
|
||||||
'丽水': [119.5642,28.1854], |
|
||||||
'乌鲁木齐': [87.9236,43.5883], |
|
||||||
'佛山': [112.8955,23.1097], |
|
||||||
'保定': [115.0488,39.0948], |
|
||||||
'兰州': [103.5901,36.3043], |
|
||||||
'包头': [110.3467,41.4899], |
|
||||||
'北京': [116.4551,40.2539], |
|
||||||
'北海': [109.314,21.6211], |
|
||||||
'南京': [118.8062,31.9208], |
|
||||||
'南宁': [108.479,23.1152], |
|
||||||
'南昌': [116.0046,28.6633], |
|
||||||
'南通': [121.1023,32.1625], |
|
||||||
'厦门': [118.1689,24.6478], |
|
||||||
'台州': [121.1353,28.6688], |
|
||||||
'合肥': [117.29,32.0581], |
|
||||||
'呼和浩特': [111.4124,40.4901], |
|
||||||
'咸阳': [108.4131,34.8706], |
|
||||||
'哈尔滨': [127.9688,45.368], |
|
||||||
'唐山': [118.4766,39.6826], |
|
||||||
'嘉兴': [120.9155,30.6354], |
|
||||||
'大同': [113.7854,39.8035], |
|
||||||
'大连': [122.2229,39.4409], |
|
||||||
'天津': [117.4219,39.4189], |
|
||||||
'太原': [112.3352,37.9413], |
|
||||||
'威海': [121.9482,37.1393], |
|
||||||
'宁波': [121.5967,29.6466], |
|
||||||
'宝鸡': [107.1826,34.3433], |
|
||||||
'宿迁': [118.5535,33.7775], |
|
||||||
'常州': [119.4543,31.5582], |
|
||||||
'广州': [113.5107,23.2196], |
|
||||||
'廊坊': [116.521,39.0509], |
|
||||||
'延安': [109.1052,36.4252], |
|
||||||
'张家口': [115.1477,40.8527], |
|
||||||
'徐州': [117.5208,34.3268], |
|
||||||
'德州': [116.6858,37.2107], |
|
||||||
'惠州': [114.6204,23.1647], |
|
||||||
'成都': [103.9526,30.7617], |
|
||||||
'扬州': [119.4653,32.8162], |
|
||||||
'承德': [117.5757,41.4075], |
|
||||||
'拉萨': [91.1865,30.1465], |
|
||||||
'无锡': [120.3442,31.5527], |
|
||||||
'日照': [119.2786,35.5023], |
|
||||||
'昆明': [102.9199,25.4663], |
|
||||||
'杭州': [119.5313,29.8773], |
|
||||||
'枣庄': [117.323,34.8926], |
|
||||||
'柳州': [109.3799,24.9774], |
|
||||||
'株洲': [113.5327,27.0319], |
|
||||||
'武汉': [114.3896,30.6628], |
|
||||||
'汕头': [117.1692,23.3405], |
|
||||||
'江门': [112.6318,22.1484], |
|
||||||
'沈阳': [123.1238,42.1216], |
|
||||||
'沧州': [116.8286,38.2104], |
|
||||||
'河源': [114.917,23.9722], |
|
||||||
'泉州': [118.3228,25.1147], |
|
||||||
'泰安': [117.0264,36.0516], |
|
||||||
'泰州': [120.0586,32.5525], |
|
||||||
'济南': [117.1582,36.8701], |
|
||||||
'济宁': [116.8286,35.3375], |
|
||||||
'海口': [110.3893,19.8516], |
|
||||||
'淄博': [118.0371,36.6064], |
|
||||||
'淮安': [118.927,33.4039], |
|
||||||
'深圳': [114.5435,22.5439], |
|
||||||
'清远': [112.9175,24.3292], |
|
||||||
'温州': [120.498,27.8119], |
|
||||||
'渭南': [109.7864,35.0299], |
|
||||||
'湖州': [119.8608,30.7782], |
|
||||||
'湘潭': [112.5439,27.7075], |
|
||||||
'滨州': [117.8174,37.4963], |
|
||||||
'潍坊': [119.0918,36.524], |
|
||||||
'烟台': [120.7397,37.5128], |
|
||||||
'玉溪': [101.9312,23.8898], |
|
||||||
'珠海': [113.7305,22.1155], |
|
||||||
'盐城': [120.2234,33.5577], |
|
||||||
'盘锦': [121.9482,41.0449], |
|
||||||
'石家庄': [114.4995,38.1006], |
|
||||||
'福州': [119.4543,25.9222], |
|
||||||
'秦皇岛': [119.2126,40.0232], |
|
||||||
'绍兴': [120.564,29.7565], |
|
||||||
'聊城': [115.9167,36.4032], |
|
||||||
'肇庆': [112.1265,23.5822], |
|
||||||
'舟山': [122.2559,30.2234], |
|
||||||
'苏州': [120.6519,31.3989], |
|
||||||
'莱芜': [117.6526,36.2714], |
|
||||||
'菏泽': [115.6201,35.2057], |
|
||||||
'营口': [122.4316,40.4297], |
|
||||||
'葫芦岛': [120.1575,40.578], |
|
||||||
'衡水': [115.8838,37.7161], |
|
||||||
'衢州': [118.6853,28.8666], |
|
||||||
'西宁': [101.4038,36.8207], |
|
||||||
'西安': [109.1162,34.2004], |
|
||||||
'贵阳': [106.6992,26.7682], |
|
||||||
'连云港': [119.1248,34.552], |
|
||||||
'邢台': [114.8071,37.2821], |
|
||||||
'邯郸': [114.4775,36.535], |
|
||||||
'郑州': [113.4668,34.6234], |
|
||||||
'鄂尔多斯': [108.9734,39.2487], |
|
||||||
'重庆': [107.7539,30.1904], |
|
||||||
'金华': [120.0037,29.1028], |
|
||||||
'铜川': [109.0393,35.1947], |
|
||||||
'银川': [106.3586,38.1775], |
|
||||||
'镇江': [119.4763,31.9702], |
|
||||||
'长春': [125.8154,44.2584], |
|
||||||
'长沙': [113.0823,28.2568], |
|
||||||
'长治': [112.8625,36.4746], |
|
||||||
'阳泉': [113.4778,38.0951], |
|
||||||
'青岛': [120.4651,36.3373], |
|
||||||
'韶关': [113.7964,24.7028] |
|
||||||
}; |
|
||||||
|
|
||||||
var BJData = [ |
|
||||||
[{name:'北京'}, {name:'上海',value:95}], |
|
||||||
[{name:'北京'}, {name:'广州',value:90}], |
|
||||||
[{name:'北京'}, {name:'大连',value:80}], |
|
||||||
[{name:'北京'}, {name:'南宁',value:70}], |
|
||||||
[{name:'北京'}, {name:'南昌',value:60}], |
|
||||||
[{name:'北京'}, {name:'拉萨',value:50}], |
|
||||||
[{name:'北京'}, {name:'长春',value:40}], |
|
||||||
[{name:'北京'}, {name:'包头',value:30}], |
|
||||||
[{name:'北京'}, {name:'重庆',value:20}], |
|
||||||
[{name:'北京'}, {name:'常州',value:10}] |
|
||||||
]; |
|
||||||
|
|
||||||
var SHData = [ |
|
||||||
[{name:'上海'},{name:'包头',value:95}], |
|
||||||
[{name:'上海'},{name:'昆明',value:90}], |
|
||||||
[{name:'上海'},{name:'广州',value:80}], |
|
||||||
[{name:'上海'},{name:'郑州',value:70}], |
|
||||||
[{name:'上海'},{name:'长春',value:60}], |
|
||||||
[{name:'上海'},{name:'重庆',value:50}], |
|
||||||
[{name:'上海'},{name:'长沙',value:40}], |
|
||||||
[{name:'上海'},{name:'北京',value:30}], |
|
||||||
[{name:'上海'},{name:'丹东',value:20}], |
|
||||||
[{name:'上海'},{name:'大连',value:10}] |
|
||||||
]; |
|
||||||
|
|
||||||
var GZData = [ |
|
||||||
[{name:'广州'},{name:'福州',value:95}], |
|
||||||
[{name:'广州'},{name:'太原',value:90}], |
|
||||||
[{name:'广州'},{name:'长春',value:80}], |
|
||||||
[{name:'广州'},{name:'重庆',value:70}], |
|
||||||
[{name:'广州'},{name:'西安',value:60}], |
|
||||||
[{name:'广州'},{name:'成都',value:50}], |
|
||||||
[{name:'广州'},{name:'常州',value:40}], |
|
||||||
[{name:'广州'},{name:'北京',value:30}], |
|
||||||
[{name:'广州'},{name:'北海',value:20}], |
|
||||||
[{name:'广州'},{name:'海口',value:10}] |
|
||||||
]; |
|
||||||
|
|
||||||
var planePath = 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z'; |
|
||||||
|
|
||||||
var convertData = function (data) { |
|
||||||
var res = []; |
|
||||||
for (var i = 0; i < data.length; i++) { |
|
||||||
var dataItem = data[i]; |
|
||||||
var fromCoord = geoCoordMap[dataItem[0].name]; |
|
||||||
var toCoord = geoCoordMap[dataItem[1].name]; |
|
||||||
if (fromCoord && toCoord) { |
|
||||||
res.push({ |
|
||||||
fromName: dataItem[0].name, |
|
||||||
toName: dataItem[1].name, |
|
||||||
coords: [fromCoord, toCoord] |
|
||||||
}); |
|
||||||
} |
|
||||||
} |
|
||||||
return res; |
|
||||||
}; |
|
||||||
|
|
||||||
var color = ['#a6c84c', '#ffa022', '#46bee9']; |
|
||||||
var series = []; |
|
||||||
[['北京', BJData], ['上海', SHData], ['广州', GZData]].forEach(function (item, i) { |
|
||||||
series.push({ |
|
||||||
name: item[0] + ' Top10', |
|
||||||
type: 'lines', |
|
||||||
zlevel: 1, |
|
||||||
effect: { |
|
||||||
show: true, |
|
||||||
period: 6, |
|
||||||
trailLength: 0.7, |
|
||||||
color: '#fff', |
|
||||||
symbolSize: 3 |
|
||||||
}, |
|
||||||
lineStyle: { |
|
||||||
normal: { |
|
||||||
color: color[i], |
|
||||||
width: 0, |
|
||||||
curveness: 0.2 |
|
||||||
} |
|
||||||
}, |
|
||||||
data: convertData(item[1]) |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: item[0] + ' Top10', |
|
||||||
type: 'lines', |
|
||||||
zlevel: 2, |
|
||||||
effect: { |
|
||||||
show: true, |
|
||||||
period: 6, |
|
||||||
trailLength: 0, |
|
||||||
symbol: planePath, |
|
||||||
symbolSize: 15 |
|
||||||
}, |
|
||||||
lineStyle: { |
|
||||||
normal: { |
|
||||||
color: color[i], |
|
||||||
width: 1, |
|
||||||
opacity: 0.4, |
|
||||||
curveness: 0.2 |
|
||||||
} |
|
||||||
}, |
|
||||||
data: convertData(item[1]) |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: item[0] + ' Top10', |
|
||||||
type: 'effectScatter', |
|
||||||
coordinateSystem: 'geo', |
|
||||||
zlevel: 2, |
|
||||||
rippleEffect: { |
|
||||||
brushType: 'stroke' |
|
||||||
}, |
|
||||||
label: { |
|
||||||
normal: { |
|
||||||
show: true, |
|
||||||
position: 'right', |
|
||||||
formatter: '{b}' |
|
||||||
} |
|
||||||
}, |
|
||||||
symbolSize: function (val) { |
|
||||||
return val[2] / 8; |
|
||||||
}, |
|
||||||
itemStyle: { |
|
||||||
normal: { |
|
||||||
color: color[i] |
|
||||||
} |
|
||||||
}, |
|
||||||
data: item[1].map(function (dataItem) { |
|
||||||
return { |
|
||||||
name: dataItem[1].name, |
|
||||||
value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value]) |
|
||||||
}; |
|
||||||
}) |
|
||||||
}); |
|
||||||
}); |
|
||||||
|
|
||||||
option = { |
|
||||||
backgroundColor: '#404a59', |
|
||||||
title : { |
|
||||||
text: '模拟迁徙', |
|
||||||
subtext: '数据纯属虚构', |
|
||||||
left: 'center', |
|
||||||
textStyle : { |
|
||||||
color: '#fff' |
|
||||||
} |
|
||||||
}, |
|
||||||
tooltip : { |
|
||||||
trigger: 'item' |
|
||||||
}, |
|
||||||
legend: { |
|
||||||
orient: 'vertical', |
|
||||||
top: 'bottom', |
|
||||||
left: 'right', |
|
||||||
data:['北京 Top10', '上海 Top10', '广州 Top10'], |
|
||||||
textStyle: { |
|
||||||
color: '#fff' |
|
||||||
}, |
|
||||||
selectedMode: 'single' |
|
||||||
}, |
|
||||||
geo: { |
|
||||||
map: 'china', |
|
||||||
label: { |
|
||||||
emphasis: { |
|
||||||
show: false |
|
||||||
} |
|
||||||
}, |
|
||||||
roam: true, |
|
||||||
itemStyle: { |
|
||||||
normal: { |
|
||||||
areaColor: '#323c48', |
|
||||||
borderColor: '#404a59' |
|
||||||
}, |
|
||||||
emphasis: { |
|
||||||
areaColor: '#2a333d' |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
series: series |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,114 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/extension/bmap.min.js" type="text/javascript"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
option = { |
|
||||||
backgroundColor: '#2c343c', |
|
||||||
|
|
||||||
title: { |
|
||||||
text: 'Customized Pie', |
|
||||||
left: 'center', |
|
||||||
top: 20, |
|
||||||
textStyle: { |
|
||||||
color: '#ccc' |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
tooltip : { |
|
||||||
trigger: 'item', |
|
||||||
formatter: "{a} <br/>{b} : {c} ({d}%)" |
|
||||||
}, |
|
||||||
|
|
||||||
visualMap: { |
|
||||||
show: false, |
|
||||||
min: 80, |
|
||||||
max: 600, |
|
||||||
inRange: { |
|
||||||
colorLightness: [0, 1] |
|
||||||
} |
|
||||||
}, |
|
||||||
series : [ |
|
||||||
{ |
|
||||||
name:'访问来源', |
|
||||||
type:'pie', |
|
||||||
radius : '55%', |
|
||||||
center: ['50%', '50%'], |
|
||||||
data:[ |
|
||||||
{value:335, name:'直接访问'}, |
|
||||||
{value:310, name:'邮件营销'}, |
|
||||||
{value:274, name:'联盟广告'}, |
|
||||||
{value:235, name:'视频广告'}, |
|
||||||
{value:400, name:'搜索引擎'} |
|
||||||
].sort(function (a, b) { return a.value - b.value}), |
|
||||||
roseType: 'angle', |
|
||||||
label: { |
|
||||||
normal: { |
|
||||||
textStyle: { |
|
||||||
color: 'rgba(255, 255, 255, 0.3)' |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
labelLine: { |
|
||||||
normal: { |
|
||||||
lineStyle: { |
|
||||||
color: 'rgba(255, 255, 255, 0.3)' |
|
||||||
}, |
|
||||||
smooth: 0.2, |
|
||||||
length: 10, |
|
||||||
length2: 20 |
|
||||||
} |
|
||||||
}, |
|
||||||
itemStyle: { |
|
||||||
normal: { |
|
||||||
color: '#c23531', |
|
||||||
shadowBlur: 200, |
|
||||||
shadowColor: 'rgba(0, 0, 0, 0.5)' |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,80 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用,详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
var option = { |
|
||||||
title: { |
|
||||||
text: '基础雷达图' |
|
||||||
}, |
|
||||||
tooltip: {}, |
|
||||||
legend: { |
|
||||||
data: ['预算分配(Allocated Budget)', '实际开销(Actual Spending)'] |
|
||||||
}, |
|
||||||
radar: { |
|
||||||
// shape: 'circle', |
|
||||||
indicator: [ |
|
||||||
{ name: '销售(sales)', max: 6500}, |
|
||||||
{ name: '管理(Administration)', max: 16000}, |
|
||||||
{ name: '信息技术(Information Techology)', max: 30000}, |
|
||||||
{ name: '客服(Customer Support)', max: 38000}, |
|
||||||
{ name: '研发(Development)', max: 52000}, |
|
||||||
{ name: '市场(Marketing)', max: 25000} |
|
||||||
] |
|
||||||
}, |
|
||||||
series: [{ |
|
||||||
name: '预算 vs 开销(Budget vs spending)', |
|
||||||
type: 'radar', |
|
||||||
// areaStyle: {normal: {}}, |
|
||||||
data : [ |
|
||||||
{ |
|
||||||
value : [4300, 10000, 28000, 35000, 50000, 19000], |
|
||||||
name : '预算分配(Allocated Budget)' |
|
||||||
}, |
|
||||||
{ |
|
||||||
value : [5000, 14000, 28000, 31000, 42000, 21000], |
|
||||||
name : '实际开销(Actual Spending)' |
|
||||||
} |
|
||||||
] |
|
||||||
}] |
|
||||||
}; |
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,343 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用,详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
// 数据意义:开盘(open),收盘(close),最低(lowest),最高(highest) |
|
||||||
var data0 = splitData([ |
|
||||||
['2013/1/24', 2320.26,2320.26,2287.3,2362.94], |
|
||||||
['2013/1/25', 2300,2291.3,2288.26,2308.38], |
|
||||||
['2013/1/28', 2295.35,2346.5,2295.35,2346.92], |
|
||||||
['2013/1/29', 2347.22,2358.98,2337.35,2363.8], |
|
||||||
['2013/1/30', 2360.75,2382.48,2347.89,2383.76], |
|
||||||
['2013/1/31', 2383.43,2385.42,2371.23,2391.82], |
|
||||||
['2013/2/1', 2377.41,2419.02,2369.57,2421.15], |
|
||||||
['2013/2/4', 2425.92,2428.15,2417.58,2440.38], |
|
||||||
['2013/2/5', 2411,2433.13,2403.3,2437.42], |
|
||||||
['2013/2/6', 2432.68,2434.48,2427.7,2441.73], |
|
||||||
['2013/2/7', 2430.69,2418.53,2394.22,2433.89], |
|
||||||
['2013/2/8', 2416.62,2432.4,2414.4,2443.03], |
|
||||||
['2013/2/18', 2441.91,2421.56,2415.43,2444.8], |
|
||||||
['2013/2/19', 2420.26,2382.91,2373.53,2427.07], |
|
||||||
['2013/2/20', 2383.49,2397.18,2370.61,2397.94], |
|
||||||
['2013/2/21', 2378.82,2325.95,2309.17,2378.82], |
|
||||||
['2013/2/22', 2322.94,2314.16,2308.76,2330.88], |
|
||||||
['2013/2/25', 2320.62,2325.82,2315.01,2338.78], |
|
||||||
['2013/2/26', 2313.74,2293.34,2289.89,2340.71], |
|
||||||
['2013/2/27', 2297.77,2313.22,2292.03,2324.63], |
|
||||||
['2013/2/28', 2322.32,2365.59,2308.92,2366.16], |
|
||||||
['2013/3/1', 2364.54,2359.51,2330.86,2369.65], |
|
||||||
['2013/3/4', 2332.08,2273.4,2259.25,2333.54], |
|
||||||
['2013/3/5', 2274.81,2326.31,2270.1,2328.14], |
|
||||||
['2013/3/6', 2333.61,2347.18,2321.6,2351.44], |
|
||||||
['2013/3/7', 2340.44,2324.29,2304.27,2352.02], |
|
||||||
['2013/3/8', 2326.42,2318.61,2314.59,2333.67], |
|
||||||
['2013/3/11', 2314.68,2310.59,2296.58,2320.96], |
|
||||||
['2013/3/12', 2309.16,2286.6,2264.83,2333.29], |
|
||||||
['2013/3/13', 2282.17,2263.97,2253.25,2286.33], |
|
||||||
['2013/3/14', 2255.77,2270.28,2253.31,2276.22], |
|
||||||
['2013/3/15', 2269.31,2278.4,2250,2312.08], |
|
||||||
['2013/3/18', 2267.29,2240.02,2239.21,2276.05], |
|
||||||
['2013/3/19', 2244.26,2257.43,2232.02,2261.31], |
|
||||||
['2013/3/20', 2257.74,2317.37,2257.42,2317.86], |
|
||||||
['2013/3/21', 2318.21,2324.24,2311.6,2330.81], |
|
||||||
['2013/3/22', 2321.4,2328.28,2314.97,2332], |
|
||||||
['2013/3/25', 2334.74,2326.72,2319.91,2344.89], |
|
||||||
['2013/3/26', 2318.58,2297.67,2281.12,2319.99], |
|
||||||
['2013/3/27', 2299.38,2301.26,2289,2323.48], |
|
||||||
['2013/3/28', 2273.55,2236.3,2232.91,2273.55], |
|
||||||
['2013/3/29', 2238.49,2236.62,2228.81,2246.87], |
|
||||||
['2013/4/1', 2229.46,2234.4,2227.31,2243.95], |
|
||||||
['2013/4/2', 2234.9,2227.74,2220.44,2253.42], |
|
||||||
['2013/4/3', 2232.69,2225.29,2217.25,2241.34], |
|
||||||
['2013/4/8', 2196.24,2211.59,2180.67,2212.59], |
|
||||||
['2013/4/9', 2215.47,2225.77,2215.47,2234.73], |
|
||||||
['2013/4/10', 2224.93,2226.13,2212.56,2233.04], |
|
||||||
['2013/4/11', 2236.98,2219.55,2217.26,2242.48], |
|
||||||
['2013/4/12', 2218.09,2206.78,2204.44,2226.26], |
|
||||||
['2013/4/15', 2199.91,2181.94,2177.39,2204.99], |
|
||||||
['2013/4/16', 2169.63,2194.85,2165.78,2196.43], |
|
||||||
['2013/4/17', 2195.03,2193.8,2178.47,2197.51], |
|
||||||
['2013/4/18', 2181.82,2197.6,2175.44,2206.03], |
|
||||||
['2013/4/19', 2201.12,2244.64,2200.58,2250.11], |
|
||||||
['2013/4/22', 2236.4,2242.17,2232.26,2245.12], |
|
||||||
['2013/4/23', 2242.62,2184.54,2182.81,2242.62], |
|
||||||
['2013/4/24', 2187.35,2218.32,2184.11,2226.12], |
|
||||||
['2013/4/25', 2213.19,2199.31,2191.85,2224.63], |
|
||||||
['2013/4/26', 2203.89,2177.91,2173.86,2210.58], |
|
||||||
['2013/5/2', 2170.78,2174.12,2161.14,2179.65], |
|
||||||
['2013/5/3', 2179.05,2205.5,2179.05,2222.81], |
|
||||||
['2013/5/6', 2212.5,2231.17,2212.5,2236.07], |
|
||||||
['2013/5/7', 2227.86,2235.57,2219.44,2240.26], |
|
||||||
['2013/5/8', 2242.39,2246.3,2235.42,2255.21], |
|
||||||
['2013/5/9', 2246.96,2232.97,2221.38,2247.86], |
|
||||||
['2013/5/10', 2228.82,2246.83,2225.81,2247.67], |
|
||||||
['2013/5/13', 2247.68,2241.92,2231.36,2250.85], |
|
||||||
['2013/5/14', 2238.9,2217.01,2205.87,2239.93], |
|
||||||
['2013/5/15', 2217.09,2224.8,2213.58,2225.19], |
|
||||||
['2013/5/16', 2221.34,2251.81,2210.77,2252.87], |
|
||||||
['2013/5/17', 2249.81,2282.87,2248.41,2288.09], |
|
||||||
['2013/5/20', 2286.33,2299.99,2281.9,2309.39], |
|
||||||
['2013/5/21', 2297.11,2305.11,2290.12,2305.3], |
|
||||||
['2013/5/22', 2303.75,2302.4,2292.43,2314.18], |
|
||||||
['2013/5/23', 2293.81,2275.67,2274.1,2304.95], |
|
||||||
['2013/5/24', 2281.45,2288.53,2270.25,2292.59], |
|
||||||
['2013/5/27', 2286.66,2293.08,2283.94,2301.7], |
|
||||||
['2013/5/28', 2293.4,2321.32,2281.47,2322.1], |
|
||||||
['2013/5/29', 2323.54,2324.02,2321.17,2334.33], |
|
||||||
['2013/5/30', 2316.25,2317.75,2310.49,2325.72], |
|
||||||
['2013/5/31', 2320.74,2300.59,2299.37,2325.53], |
|
||||||
['2013/6/3', 2300.21,2299.25,2294.11,2313.43], |
|
||||||
['2013/6/4', 2297.1,2272.42,2264.76,2297.1], |
|
||||||
['2013/6/5', 2270.71,2270.93,2260.87,2276.86], |
|
||||||
['2013/6/6', 2264.43,2242.11,2240.07,2266.69], |
|
||||||
['2013/6/7', 2242.26,2210.9,2205.07,2250.63], |
|
||||||
['2013/6/13', 2190.1,2148.35,2126.22,2190.1] |
|
||||||
]); |
|
||||||
|
|
||||||
|
|
||||||
function splitData(rawData) { |
|
||||||
var categoryData = []; |
|
||||||
var values = [] |
|
||||||
for (var i = 0; i < rawData.length; i++) { |
|
||||||
categoryData.push(rawData[i].splice(0, 1)[0]); |
|
||||||
values.push(rawData[i]) |
|
||||||
} |
|
||||||
return { |
|
||||||
categoryData: categoryData, |
|
||||||
values: values |
|
||||||
}; |
|
||||||
} |
|
||||||
|
|
||||||
function calculateMA(dayCount) { |
|
||||||
var result = []; |
|
||||||
for (var i = 0, len = data0.values.length; i < len; i++) { |
|
||||||
if (i < dayCount) { |
|
||||||
result.push('-'); |
|
||||||
continue; |
|
||||||
} |
|
||||||
var sum = 0; |
|
||||||
for (var j = 0; j < dayCount; j++) { |
|
||||||
sum += data0.values[i - j][1]; |
|
||||||
} |
|
||||||
result.push(sum / dayCount); |
|
||||||
} |
|
||||||
return result; |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
option = { |
|
||||||
title: { |
|
||||||
text: '上证指数', |
|
||||||
left: 0 |
|
||||||
}, |
|
||||||
tooltip: { |
|
||||||
trigger: 'axis', |
|
||||||
axisPointer: { |
|
||||||
type: 'line' |
|
||||||
} |
|
||||||
}, |
|
||||||
legend: { |
|
||||||
data: ['日K', 'MA5', 'MA10', 'MA20', 'MA30'] |
|
||||||
}, |
|
||||||
grid: { |
|
||||||
left: '10%', |
|
||||||
right: '10%', |
|
||||||
bottom: '15%' |
|
||||||
}, |
|
||||||
xAxis: { |
|
||||||
type: 'category', |
|
||||||
data: data0.categoryData, |
|
||||||
scale: true, |
|
||||||
boundaryGap : false, |
|
||||||
axisLine: {onZero: false}, |
|
||||||
splitLine: {show: false}, |
|
||||||
splitNumber: 20, |
|
||||||
min: 'dataMin', |
|
||||||
max: 'dataMax' |
|
||||||
}, |
|
||||||
yAxis: { |
|
||||||
scale: true, |
|
||||||
splitArea: { |
|
||||||
show: true |
|
||||||
} |
|
||||||
}, |
|
||||||
dataZoom: [ |
|
||||||
{ |
|
||||||
type: 'inside', |
|
||||||
start: 50, |
|
||||||
end: 100 |
|
||||||
}, |
|
||||||
{ |
|
||||||
show: true, |
|
||||||
type: 'slider', |
|
||||||
y: '90%', |
|
||||||
start: 50, |
|
||||||
end: 100 |
|
||||||
} |
|
||||||
], |
|
||||||
series: [ |
|
||||||
{ |
|
||||||
name: '日K', |
|
||||||
type: 'candlestick', |
|
||||||
data: data0.values, |
|
||||||
markPoint: { |
|
||||||
label: { |
|
||||||
normal: { |
|
||||||
formatter: function (param) { |
|
||||||
return param != null ? Math.round(param.value) : ''; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
data: [ |
|
||||||
{ |
|
||||||
name: 'XX标点', |
|
||||||
coord: ['2013/5/31', 2300], |
|
||||||
value: 2300, |
|
||||||
itemStyle: { |
|
||||||
normal: {color: 'rgb(41,60,85)'} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'highest value', |
|
||||||
type: 'max', |
|
||||||
valueDim: 'highest' |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'lowest value', |
|
||||||
type: 'min', |
|
||||||
valueDim: 'lowest' |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'average value on close', |
|
||||||
type: 'average', |
|
||||||
valueDim: 'close' |
|
||||||
} |
|
||||||
], |
|
||||||
tooltip: { |
|
||||||
formatter: function (param) { |
|
||||||
return param.name + '<br>' + (param.data.coord || ''); |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
markLine: { |
|
||||||
symbol: ['none', 'none'], |
|
||||||
data: [ |
|
||||||
[ |
|
||||||
{ |
|
||||||
name: 'from lowest to highest', |
|
||||||
type: 'min', |
|
||||||
valueDim: 'lowest', |
|
||||||
symbol: 'circle', |
|
||||||
symbolSize: 10, |
|
||||||
label: { |
|
||||||
normal: {show: false}, |
|
||||||
emphasis: {show: false} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
type: 'max', |
|
||||||
valueDim: 'highest', |
|
||||||
symbol: 'circle', |
|
||||||
symbolSize: 10, |
|
||||||
label: { |
|
||||||
normal: {show: false}, |
|
||||||
emphasis: {show: false} |
|
||||||
} |
|
||||||
} |
|
||||||
], |
|
||||||
{ |
|
||||||
name: 'min line on close', |
|
||||||
type: 'min', |
|
||||||
valueDim: 'close' |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'max line on close', |
|
||||||
type: 'max', |
|
||||||
valueDim: 'close' |
|
||||||
} |
|
||||||
] |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'MA5', |
|
||||||
type: 'line', |
|
||||||
data: calculateMA(5), |
|
||||||
smooth: true, |
|
||||||
lineStyle: { |
|
||||||
normal: {opacity: 0.5} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'MA10', |
|
||||||
type: 'line', |
|
||||||
data: calculateMA(10), |
|
||||||
smooth: true, |
|
||||||
lineStyle: { |
|
||||||
normal: {opacity: 0.5} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'MA20', |
|
||||||
type: 'line', |
|
||||||
data: calculateMA(20), |
|
||||||
smooth: true, |
|
||||||
lineStyle: { |
|
||||||
normal: {opacity: 0.5} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'MA30', |
|
||||||
type: 'line', |
|
||||||
data: calculateMA(30), |
|
||||||
smooth: true, |
|
||||||
lineStyle: { |
|
||||||
normal: {opacity: 0.5} |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,496 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/extension/bmap.min.js" type="text/javascript"></script> |
|
||||||
<script src="http://echarts.baidu.com/asset/map/js/china.js"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
myChart.setOption({ |
|
||||||
series: [{ |
|
||||||
type: 'map', |
|
||||||
map: 'china' |
|
||||||
}] |
|
||||||
}); |
|
||||||
|
|
||||||
var geoCoordMap = { |
|
||||||
"海门":[121.15,31.89], |
|
||||||
"鄂尔多斯":[109.781327,39.608266], |
|
||||||
"招远":[120.38,37.35], |
|
||||||
"舟山":[122.207216,29.985295], |
|
||||||
"齐齐哈尔":[123.97,47.33], |
|
||||||
"盐城":[120.13,33.38], |
|
||||||
"赤峰":[118.87,42.28], |
|
||||||
"青岛":[120.33,36.07], |
|
||||||
"乳山":[121.52,36.89], |
|
||||||
"金昌":[102.188043,38.520089], |
|
||||||
"泉州":[118.58,24.93], |
|
||||||
"莱西":[120.53,36.86], |
|
||||||
"日照":[119.46,35.42], |
|
||||||
"胶南":[119.97,35.88], |
|
||||||
"南通":[121.05,32.08], |
|
||||||
"拉萨":[91.11,29.97], |
|
||||||
"云浮":[112.02,22.93], |
|
||||||
"梅州":[116.1,24.55], |
|
||||||
"文登":[122.05,37.2], |
|
||||||
"上海":[121.48,31.22], |
|
||||||
"攀枝花":[101.718637,26.582347], |
|
||||||
"威海":[122.1,37.5], |
|
||||||
"承德":[117.93,40.97], |
|
||||||
"厦门":[118.1,24.46], |
|
||||||
"汕尾":[115.375279,22.786211], |
|
||||||
"潮州":[116.63,23.68], |
|
||||||
"丹东":[124.37,40.13], |
|
||||||
"太仓":[121.1,31.45], |
|
||||||
"曲靖":[103.79,25.51], |
|
||||||
"烟台":[121.39,37.52], |
|
||||||
"福州":[119.3,26.08], |
|
||||||
"瓦房店":[121.979603,39.627114], |
|
||||||
"即墨":[120.45,36.38], |
|
||||||
"抚顺":[123.97,41.97], |
|
||||||
"玉溪":[102.52,24.35], |
|
||||||
"张家口":[114.87,40.82], |
|
||||||
"阳泉":[113.57,37.85], |
|
||||||
"莱州":[119.942327,37.177017], |
|
||||||
"湖州":[120.1,30.86], |
|
||||||
"汕头":[116.69,23.39], |
|
||||||
"昆山":[120.95,31.39], |
|
||||||
"宁波":[121.56,29.86], |
|
||||||
"湛江":[110.359377,21.270708], |
|
||||||
"揭阳":[116.35,23.55], |
|
||||||
"荣成":[122.41,37.16], |
|
||||||
"连云港":[119.16,34.59], |
|
||||||
"葫芦岛":[120.836932,40.711052], |
|
||||||
"常熟":[120.74,31.64], |
|
||||||
"东莞":[113.75,23.04], |
|
||||||
"河源":[114.68,23.73], |
|
||||||
"淮安":[119.15,33.5], |
|
||||||
"泰州":[119.9,32.49], |
|
||||||
"南宁":[108.33,22.84], |
|
||||||
"营口":[122.18,40.65], |
|
||||||
"惠州":[114.4,23.09], |
|
||||||
"江阴":[120.26,31.91], |
|
||||||
"蓬莱":[120.75,37.8], |
|
||||||
"韶关":[113.62,24.84], |
|
||||||
"嘉峪关":[98.289152,39.77313], |
|
||||||
"广州":[113.23,23.16], |
|
||||||
"延安":[109.47,36.6], |
|
||||||
"太原":[112.53,37.87], |
|
||||||
"清远":[113.01,23.7], |
|
||||||
"中山":[113.38,22.52], |
|
||||||
"昆明":[102.73,25.04], |
|
||||||
"寿光":[118.73,36.86], |
|
||||||
"盘锦":[122.070714,41.119997], |
|
||||||
"长治":[113.08,36.18], |
|
||||||
"深圳":[114.07,22.62], |
|
||||||
"珠海":[113.52,22.3], |
|
||||||
"宿迁":[118.3,33.96], |
|
||||||
"咸阳":[108.72,34.36], |
|
||||||
"铜川":[109.11,35.09], |
|
||||||
"平度":[119.97,36.77], |
|
||||||
"佛山":[113.11,23.05], |
|
||||||
"海口":[110.35,20.02], |
|
||||||
"江门":[113.06,22.61], |
|
||||||
"章丘":[117.53,36.72], |
|
||||||
"肇庆":[112.44,23.05], |
|
||||||
"大连":[121.62,38.92], |
|
||||||
"临汾":[111.5,36.08], |
|
||||||
"吴江":[120.63,31.16], |
|
||||||
"石嘴山":[106.39,39.04], |
|
||||||
"沈阳":[123.38,41.8], |
|
||||||
"苏州":[120.62,31.32], |
|
||||||
"茂名":[110.88,21.68], |
|
||||||
"嘉兴":[120.76,30.77], |
|
||||||
"长春":[125.35,43.88], |
|
||||||
"胶州":[120.03336,36.264622], |
|
||||||
"银川":[106.27,38.47], |
|
||||||
"张家港":[120.555821,31.875428], |
|
||||||
"三门峡":[111.19,34.76], |
|
||||||
"锦州":[121.15,41.13], |
|
||||||
"南昌":[115.89,28.68], |
|
||||||
"柳州":[109.4,24.33], |
|
||||||
"三亚":[109.511909,18.252847], |
|
||||||
"自贡":[104.778442,29.33903], |
|
||||||
"吉林":[126.57,43.87], |
|
||||||
"阳江":[111.95,21.85], |
|
||||||
"泸州":[105.39,28.91], |
|
||||||
"西宁":[101.74,36.56], |
|
||||||
"宜宾":[104.56,29.77], |
|
||||||
"呼和浩特":[111.65,40.82], |
|
||||||
"成都":[104.06,30.67], |
|
||||||
"大同":[113.3,40.12], |
|
||||||
"镇江":[119.44,32.2], |
|
||||||
"桂林":[110.28,25.29], |
|
||||||
"张家界":[110.479191,29.117096], |
|
||||||
"宜兴":[119.82,31.36], |
|
||||||
"北海":[109.12,21.49], |
|
||||||
"西安":[108.95,34.27], |
|
||||||
"金坛":[119.56,31.74], |
|
||||||
"东营":[118.49,37.46], |
|
||||||
"牡丹江":[129.58,44.6], |
|
||||||
"遵义":[106.9,27.7], |
|
||||||
"绍兴":[120.58,30.01], |
|
||||||
"扬州":[119.42,32.39], |
|
||||||
"常州":[119.95,31.79], |
|
||||||
"潍坊":[119.1,36.62], |
|
||||||
"重庆":[106.54,29.59], |
|
||||||
"台州":[121.420757,28.656386], |
|
||||||
"南京":[118.78,32.04], |
|
||||||
"滨州":[118.03,37.36], |
|
||||||
"贵阳":[106.71,26.57], |
|
||||||
"无锡":[120.29,31.59], |
|
||||||
"本溪":[123.73,41.3], |
|
||||||
"克拉玛依":[84.77,45.59], |
|
||||||
"渭南":[109.5,34.52], |
|
||||||
"马鞍山":[118.48,31.56], |
|
||||||
"宝鸡":[107.15,34.38], |
|
||||||
"焦作":[113.21,35.24], |
|
||||||
"句容":[119.16,31.95], |
|
||||||
"北京":[116.46,39.92], |
|
||||||
"徐州":[117.2,34.26], |
|
||||||
"衡水":[115.72,37.72], |
|
||||||
"包头":[110,40.58], |
|
||||||
"绵阳":[104.73,31.48], |
|
||||||
"乌鲁木齐":[87.68,43.77], |
|
||||||
"枣庄":[117.57,34.86], |
|
||||||
"杭州":[120.19,30.26], |
|
||||||
"淄博":[118.05,36.78], |
|
||||||
"鞍山":[122.85,41.12], |
|
||||||
"溧阳":[119.48,31.43], |
|
||||||
"库尔勒":[86.06,41.68], |
|
||||||
"安阳":[114.35,36.1], |
|
||||||
"开封":[114.35,34.79], |
|
||||||
"济南":[117,36.65], |
|
||||||
"德阳":[104.37,31.13], |
|
||||||
"温州":[120.65,28.01], |
|
||||||
"九江":[115.97,29.71], |
|
||||||
"邯郸":[114.47,36.6], |
|
||||||
"临安":[119.72,30.23], |
|
||||||
"兰州":[103.73,36.03], |
|
||||||
"沧州":[116.83,38.33], |
|
||||||
"临沂":[118.35,35.05], |
|
||||||
"南充":[106.110698,30.837793], |
|
||||||
"天津":[117.2,39.13], |
|
||||||
"富阳":[119.95,30.07], |
|
||||||
"泰安":[117.13,36.18], |
|
||||||
"诸暨":[120.23,29.71], |
|
||||||
"郑州":[113.65,34.76], |
|
||||||
"哈尔滨":[126.63,45.75], |
|
||||||
"聊城":[115.97,36.45], |
|
||||||
"芜湖":[118.38,31.33], |
|
||||||
"唐山":[118.02,39.63], |
|
||||||
"平顶山":[113.29,33.75], |
|
||||||
"邢台":[114.48,37.05], |
|
||||||
"德州":[116.29,37.45], |
|
||||||
"济宁":[116.59,35.38], |
|
||||||
"荆州":[112.239741,30.335165], |
|
||||||
"宜昌":[111.3,30.7], |
|
||||||
"义乌":[120.06,29.32], |
|
||||||
"丽水":[119.92,28.45], |
|
||||||
"洛阳":[112.44,34.7], |
|
||||||
"秦皇岛":[119.57,39.95], |
|
||||||
"株洲":[113.16,27.83], |
|
||||||
"石家庄":[114.48,38.03], |
|
||||||
"莱芜":[117.67,36.19], |
|
||||||
"常德":[111.69,29.05], |
|
||||||
"保定":[115.48,38.85], |
|
||||||
"湘潭":[112.91,27.87], |
|
||||||
"金华":[119.64,29.12], |
|
||||||
"岳阳":[113.09,29.37], |
|
||||||
"长沙":[113,28.21], |
|
||||||
"衢州":[118.88,28.97], |
|
||||||
"廊坊":[116.7,39.53], |
|
||||||
"菏泽":[115.480656,35.23375], |
|
||||||
"合肥":[117.27,31.86], |
|
||||||
"武汉":[114.31,30.52], |
|
||||||
"大庆":[125.03,46.58] |
|
||||||
}; |
|
||||||
|
|
||||||
var convertData = function (data) { |
|
||||||
var res = []; |
|
||||||
for (var i = 0; i < data.length; i++) { |
|
||||||
var geoCoord = geoCoordMap[data[i].name]; |
|
||||||
if (geoCoord) { |
|
||||||
res.push(geoCoord.concat(data[i].value)); |
|
||||||
} |
|
||||||
} |
|
||||||
return res; |
|
||||||
}; |
|
||||||
|
|
||||||
option = { |
|
||||||
title: { |
|
||||||
text: '全国主要城市空气质量', |
|
||||||
subtext: 'data from PM25.in', |
|
||||||
sublink: 'http://www.pm25.in', |
|
||||||
left: 'center', |
|
||||||
textStyle: { |
|
||||||
color: '#fff' |
|
||||||
} |
|
||||||
}, |
|
||||||
backgroundColor: '#404a59', |
|
||||||
visualMap: { |
|
||||||
min: 0, |
|
||||||
max: 500, |
|
||||||
splitNumber: 5, |
|
||||||
inRange: { |
|
||||||
color: ['#d94e5d','#eac736','#50a3ba'].reverse() |
|
||||||
}, |
|
||||||
textStyle: { |
|
||||||
color: '#fff' |
|
||||||
} |
|
||||||
}, |
|
||||||
geo: { |
|
||||||
map: 'china', |
|
||||||
label: { |
|
||||||
emphasis: { |
|
||||||
show: false |
|
||||||
} |
|
||||||
}, |
|
||||||
roam: true, |
|
||||||
itemStyle: { |
|
||||||
normal: { |
|
||||||
areaColor: '#323c48', |
|
||||||
borderColor: '#111' |
|
||||||
}, |
|
||||||
emphasis: { |
|
||||||
areaColor: '#2a333d' |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
series: [{ |
|
||||||
name: 'AQI', |
|
||||||
type: 'heatmap', |
|
||||||
coordinateSystem: 'geo', |
|
||||||
data: convertData([ |
|
||||||
{name: "海门", value: 9}, |
|
||||||
{name: "鄂尔多斯", value: 12}, |
|
||||||
{name: "招远", value: 12}, |
|
||||||
{name: "舟山", value: 12}, |
|
||||||
{name: "齐齐哈尔", value: 14}, |
|
||||||
{name: "盐城", value: 15}, |
|
||||||
{name: "赤峰", value: 16}, |
|
||||||
{name: "青岛", value: 18}, |
|
||||||
{name: "乳山", value: 18}, |
|
||||||
{name: "金昌", value: 19}, |
|
||||||
{name: "泉州", value: 21}, |
|
||||||
{name: "莱西", value: 21}, |
|
||||||
{name: "日照", value: 21}, |
|
||||||
{name: "胶南", value: 22}, |
|
||||||
{name: "南通", value: 23}, |
|
||||||
{name: "拉萨", value: 24}, |
|
||||||
{name: "云浮", value: 24}, |
|
||||||
{name: "梅州", value: 25}, |
|
||||||
{name: "文登", value: 25}, |
|
||||||
{name: "上海", value: 25}, |
|
||||||
{name: "攀枝花", value: 25}, |
|
||||||
{name: "威海", value: 25}, |
|
||||||
{name: "承德", value: 25}, |
|
||||||
{name: "厦门", value: 26}, |
|
||||||
{name: "汕尾", value: 26}, |
|
||||||
{name: "潮州", value: 26}, |
|
||||||
{name: "丹东", value: 27}, |
|
||||||
{name: "太仓", value: 27}, |
|
||||||
{name: "曲靖", value: 27}, |
|
||||||
{name: "烟台", value: 28}, |
|
||||||
{name: "福州", value: 29}, |
|
||||||
{name: "瓦房店", value: 30}, |
|
||||||
{name: "即墨", value: 30}, |
|
||||||
{name: "抚顺", value: 31}, |
|
||||||
{name: "玉溪", value: 31}, |
|
||||||
{name: "张家口", value: 31}, |
|
||||||
{name: "阳泉", value: 31}, |
|
||||||
{name: "莱州", value: 32}, |
|
||||||
{name: "湖州", value: 32}, |
|
||||||
{name: "汕头", value: 32}, |
|
||||||
{name: "昆山", value: 33}, |
|
||||||
{name: "宁波", value: 33}, |
|
||||||
{name: "湛江", value: 33}, |
|
||||||
{name: "揭阳", value: 34}, |
|
||||||
{name: "荣成", value: 34}, |
|
||||||
{name: "连云港", value: 35}, |
|
||||||
{name: "葫芦岛", value: 35}, |
|
||||||
{name: "常熟", value: 36}, |
|
||||||
{name: "东莞", value: 36}, |
|
||||||
{name: "河源", value: 36}, |
|
||||||
{name: "淮安", value: 36}, |
|
||||||
{name: "泰州", value: 36}, |
|
||||||
{name: "南宁", value: 37}, |
|
||||||
{name: "营口", value: 37}, |
|
||||||
{name: "惠州", value: 37}, |
|
||||||
{name: "江阴", value: 37}, |
|
||||||
{name: "蓬莱", value: 37}, |
|
||||||
{name: "韶关", value: 38}, |
|
||||||
{name: "嘉峪关", value: 38}, |
|
||||||
{name: "广州", value: 38}, |
|
||||||
{name: "延安", value: 38}, |
|
||||||
{name: "太原", value: 39}, |
|
||||||
{name: "清远", value: 39}, |
|
||||||
{name: "中山", value: 39}, |
|
||||||
{name: "昆明", value: 39}, |
|
||||||
{name: "寿光", value: 40}, |
|
||||||
{name: "盘锦", value: 40}, |
|
||||||
{name: "长治", value: 41}, |
|
||||||
{name: "深圳", value: 41}, |
|
||||||
{name: "珠海", value: 42}, |
|
||||||
{name: "宿迁", value: 43}, |
|
||||||
{name: "咸阳", value: 43}, |
|
||||||
{name: "铜川", value: 44}, |
|
||||||
{name: "平度", value: 44}, |
|
||||||
{name: "佛山", value: 44}, |
|
||||||
{name: "海口", value: 44}, |
|
||||||
{name: "江门", value: 45}, |
|
||||||
{name: "章丘", value: 45}, |
|
||||||
{name: "肇庆", value: 46}, |
|
||||||
{name: "大连", value: 47}, |
|
||||||
{name: "临汾", value: 47}, |
|
||||||
{name: "吴江", value: 47}, |
|
||||||
{name: "石嘴山", value: 49}, |
|
||||||
{name: "沈阳", value: 50}, |
|
||||||
{name: "苏州", value: 50}, |
|
||||||
{name: "茂名", value: 50}, |
|
||||||
{name: "嘉兴", value: 51}, |
|
||||||
{name: "长春", value: 51}, |
|
||||||
{name: "胶州", value: 52}, |
|
||||||
{name: "银川", value: 52}, |
|
||||||
{name: "张家港", value: 52}, |
|
||||||
{name: "三门峡", value: 53}, |
|
||||||
{name: "锦州", value: 54}, |
|
||||||
{name: "南昌", value: 54}, |
|
||||||
{name: "柳州", value: 54}, |
|
||||||
{name: "三亚", value: 54}, |
|
||||||
{name: "自贡", value: 56}, |
|
||||||
{name: "吉林", value: 56}, |
|
||||||
{name: "阳江", value: 57}, |
|
||||||
{name: "泸州", value: 57}, |
|
||||||
{name: "西宁", value: 57}, |
|
||||||
{name: "宜宾", value: 58}, |
|
||||||
{name: "呼和浩特", value: 58}, |
|
||||||
{name: "成都", value: 58}, |
|
||||||
{name: "大同", value: 58}, |
|
||||||
{name: "镇江", value: 59}, |
|
||||||
{name: "桂林", value: 59}, |
|
||||||
{name: "张家界", value: 59}, |
|
||||||
{name: "宜兴", value: 59}, |
|
||||||
{name: "北海", value: 60}, |
|
||||||
{name: "西安", value: 61}, |
|
||||||
{name: "金坛", value: 62}, |
|
||||||
{name: "东营", value: 62}, |
|
||||||
{name: "牡丹江", value: 63}, |
|
||||||
{name: "遵义", value: 63}, |
|
||||||
{name: "绍兴", value: 63}, |
|
||||||
{name: "扬州", value: 64}, |
|
||||||
{name: "常州", value: 64}, |
|
||||||
{name: "潍坊", value: 65}, |
|
||||||
{name: "重庆", value: 66}, |
|
||||||
{name: "台州", value: 67}, |
|
||||||
{name: "南京", value: 67}, |
|
||||||
{name: "滨州", value: 70}, |
|
||||||
{name: "贵阳", value: 71}, |
|
||||||
{name: "无锡", value: 71}, |
|
||||||
{name: "本溪", value: 71}, |
|
||||||
{name: "克拉玛依", value: 72}, |
|
||||||
{name: "渭南", value: 72}, |
|
||||||
{name: "马鞍山", value: 72}, |
|
||||||
{name: "宝鸡", value: 72}, |
|
||||||
{name: "焦作", value: 75}, |
|
||||||
{name: "句容", value: 75}, |
|
||||||
{name: "北京", value: 79}, |
|
||||||
{name: "徐州", value: 79}, |
|
||||||
{name: "衡水", value: 80}, |
|
||||||
{name: "包头", value: 80}, |
|
||||||
{name: "绵阳", value: 80}, |
|
||||||
{name: "乌鲁木齐", value: 84}, |
|
||||||
{name: "枣庄", value: 84}, |
|
||||||
{name: "杭州", value: 84}, |
|
||||||
{name: "淄博", value: 85}, |
|
||||||
{name: "鞍山", value: 86}, |
|
||||||
{name: "溧阳", value: 86}, |
|
||||||
{name: "库尔勒", value: 86}, |
|
||||||
{name: "安阳", value: 90}, |
|
||||||
{name: "开封", value: 90}, |
|
||||||
{name: "济南", value: 92}, |
|
||||||
{name: "德阳", value: 93}, |
|
||||||
{name: "温州", value: 95}, |
|
||||||
{name: "九江", value: 96}, |
|
||||||
{name: "邯郸", value: 98}, |
|
||||||
{name: "临安", value: 99}, |
|
||||||
{name: "兰州", value: 99}, |
|
||||||
{name: "沧州", value: 100}, |
|
||||||
{name: "临沂", value: 103}, |
|
||||||
{name: "南充", value: 104}, |
|
||||||
{name: "天津", value: 105}, |
|
||||||
{name: "富阳", value: 106}, |
|
||||||
{name: "泰安", value: 112}, |
|
||||||
{name: "诸暨", value: 112}, |
|
||||||
{name: "郑州", value: 113}, |
|
||||||
{name: "哈尔滨", value: 114}, |
|
||||||
{name: "聊城", value: 116}, |
|
||||||
{name: "芜湖", value: 117}, |
|
||||||
{name: "唐山", value: 119}, |
|
||||||
{name: "平顶山", value: 119}, |
|
||||||
{name: "邢台", value: 119}, |
|
||||||
{name: "德州", value: 120}, |
|
||||||
{name: "济宁", value: 120}, |
|
||||||
{name: "荆州", value: 127}, |
|
||||||
{name: "宜昌", value: 130}, |
|
||||||
{name: "义乌", value: 132}, |
|
||||||
{name: "丽水", value: 133}, |
|
||||||
{name: "洛阳", value: 134}, |
|
||||||
{name: "秦皇岛", value: 136}, |
|
||||||
{name: "株洲", value: 143}, |
|
||||||
{name: "石家庄", value: 147}, |
|
||||||
{name: "莱芜", value: 148}, |
|
||||||
{name: "常德", value: 152}, |
|
||||||
{name: "保定", value: 153}, |
|
||||||
{name: "湘潭", value: 154}, |
|
||||||
{name: "金华", value: 157}, |
|
||||||
{name: "岳阳", value: 169}, |
|
||||||
{name: "长沙", value: 175}, |
|
||||||
{name: "衢州", value: 177}, |
|
||||||
{name: "廊坊", value: 193}, |
|
||||||
{name: "菏泽", value: 194}, |
|
||||||
{name: "合肥", value: 229}, |
|
||||||
{name: "武汉", value: 273}, |
|
||||||
{name: "大庆", value: 279} |
|
||||||
]) |
|
||||||
}] |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,238 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
特别声明:ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。如需使用,详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。 |
|
||||||
</blockquote> |
|
||||||
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> |
|
||||||
<div id="main" style="width: 100%;height:400px;"></div> |
|
||||||
<blockquote class="layui-elem-quote"> |
|
||||||
注意:本案例的Echarts图表库由cdn引入,需要在线才能正常使用,如想离线,请至Echarts官网下载。 |
|
||||||
</blockquote> |
|
||||||
</div> |
|
||||||
<script src="//cdn.bootcss.com/echarts/3.3.2/echarts.min.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript"> |
|
||||||
// 基于准备好的dom,初始化echarts实例 |
|
||||||
var myChart = echarts.init(document.getElementById('main')); |
|
||||||
|
|
||||||
// 指定图表的配置项和数据 |
|
||||||
option = { |
|
||||||
tooltip : { |
|
||||||
formatter: "{a} <br/>{c} {b}" |
|
||||||
}, |
|
||||||
toolbox: { |
|
||||||
show: true, |
|
||||||
feature: { |
|
||||||
restore: {show: true}, |
|
||||||
saveAsImage: {show: true} |
|
||||||
} |
|
||||||
}, |
|
||||||
series : [ |
|
||||||
{ |
|
||||||
name: '速度', |
|
||||||
type: 'gauge', |
|
||||||
z: 3, |
|
||||||
min: 0, |
|
||||||
max: 220, |
|
||||||
splitNumber: 11, |
|
||||||
radius: '50%', |
|
||||||
axisLine: { // 坐标轴线 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
width: 10 |
|
||||||
} |
|
||||||
}, |
|
||||||
axisTick: { // 坐标轴小标记 |
|
||||||
length: 15, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
splitLine: { // 分隔线 |
|
||||||
length: 20, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
title : { |
|
||||||
textStyle: { // 其余属性默认使用全局文本样式,详见TEXTSTYLE |
|
||||||
fontWeight: 'bolder', |
|
||||||
fontSize: 20, |
|
||||||
fontStyle: 'italic' |
|
||||||
} |
|
||||||
}, |
|
||||||
detail : { |
|
||||||
textStyle: { // 其余属性默认使用全局文本样式,详见TEXTSTYLE |
|
||||||
fontWeight: 'bolder' |
|
||||||
} |
|
||||||
}, |
|
||||||
data:[{value: 40, name: 'km/h'}] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: '转速', |
|
||||||
type: 'gauge', |
|
||||||
center: ['20%', '55%'], // 默认全局居中 |
|
||||||
radius: '35%', |
|
||||||
min:0, |
|
||||||
max:7, |
|
||||||
endAngle:45, |
|
||||||
splitNumber:7, |
|
||||||
axisLine: { // 坐标轴线 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
width: 8 |
|
||||||
} |
|
||||||
}, |
|
||||||
axisTick: { // 坐标轴小标记 |
|
||||||
length:12, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
splitLine: { // 分隔线 |
|
||||||
length:20, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
pointer: { |
|
||||||
width:5 |
|
||||||
}, |
|
||||||
title: { |
|
||||||
offsetCenter: [0, '-30%'], // x, y,单位px |
|
||||||
}, |
|
||||||
detail: { |
|
||||||
textStyle: { // 其余属性默认使用全局文本样式,详见TEXTSTYLE |
|
||||||
fontWeight: 'bolder' |
|
||||||
} |
|
||||||
}, |
|
||||||
data:[{value: 1.5, name: 'x1000 r/min'}] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: '油表', |
|
||||||
type: 'gauge', |
|
||||||
center: ['77%', '50%'], // 默认全局居中 |
|
||||||
radius: '25%', |
|
||||||
min: 0, |
|
||||||
max: 2, |
|
||||||
startAngle: 135, |
|
||||||
endAngle: 45, |
|
||||||
splitNumber: 2, |
|
||||||
axisLine: { // 坐标轴线 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
width: 8 |
|
||||||
} |
|
||||||
}, |
|
||||||
axisTick: { // 坐标轴小标记 |
|
||||||
splitNumber: 5, |
|
||||||
length: 10, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
axisLabel: { |
|
||||||
formatter:function(v){ |
|
||||||
switch (v + '') { |
|
||||||
case '0' : return 'E'; |
|
||||||
case '1' : return 'Gas'; |
|
||||||
case '2' : return 'F'; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
splitLine: { // 分隔线 |
|
||||||
length: 15, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
pointer: { |
|
||||||
width:2 |
|
||||||
}, |
|
||||||
title : { |
|
||||||
show: false |
|
||||||
}, |
|
||||||
detail : { |
|
||||||
show: false |
|
||||||
}, |
|
||||||
data:[{value: 0.5, name: 'gas'}] |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: '水表', |
|
||||||
type: 'gauge', |
|
||||||
center : ['77%', '50%'], // 默认全局居中 |
|
||||||
radius : '25%', |
|
||||||
min: 0, |
|
||||||
max: 2, |
|
||||||
startAngle: 315, |
|
||||||
endAngle: 225, |
|
||||||
splitNumber: 2, |
|
||||||
axisLine: { // 坐标轴线 |
|
||||||
lineStyle: { // 属性lineStyle控制线条样式 |
|
||||||
width: 8 |
|
||||||
} |
|
||||||
}, |
|
||||||
axisTick: { // 坐标轴小标记 |
|
||||||
show: false |
|
||||||
}, |
|
||||||
axisLabel: { |
|
||||||
formatter:function(v){ |
|
||||||
switch (v + '') { |
|
||||||
case '0' : return 'H'; |
|
||||||
case '1' : return 'Water'; |
|
||||||
case '2' : return 'C'; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
splitLine: { // 分隔线 |
|
||||||
length: 15, // 属性length控制线长 |
|
||||||
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式 |
|
||||||
color: 'auto' |
|
||||||
} |
|
||||||
}, |
|
||||||
pointer: { |
|
||||||
width:2 |
|
||||||
}, |
|
||||||
title: { |
|
||||||
show: false |
|
||||||
}, |
|
||||||
detail: { |
|
||||||
show: false |
|
||||||
}, |
|
||||||
data:[{value: 0.5, name: 'gas'}] |
|
||||||
} |
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
setInterval(function (){ |
|
||||||
option.series[0].data[0].value = (Math.random()*100).toFixed(2) - 0; |
|
||||||
option.series[1].data[0].value = (Math.random()*7).toFixed(2) - 0; |
|
||||||
option.series[2].data[0].value = (Math.random()*2).toFixed(2) - 0; |
|
||||||
option.series[3].data[0].value = (Math.random()*2).toFixed(2) - 0; |
|
||||||
myChart.setOption(option,true); |
|
||||||
},2000); |
|
||||||
|
|
||||||
|
|
||||||
// 使用刚指定的配置项和数据显示图表。 |
|
||||||
myChart.setOption(option); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,33 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
</head> |
|
||||||
<body> |
|
||||||
<div class="layui-container"> |
|
||||||
<div class="fly-panel"> |
|
||||||
<div class="fly-none"> |
|
||||||
<h2><i class="layui-icon layui-icon-404"></i></h2> |
|
||||||
<p>页面或者数据被<a href=""> 纸飞机 </a>运到火星了,啥都看不到了…</p> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,68 +0,0 @@ |
|||||||
<!doctype html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>后台登录-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit|ie-comp|ie-stand"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<meta http-equiv="Cache-Control" content="no-siteapp" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
|
|
||||||
</head> |
|
||||||
<body class="login-bg"> |
|
||||||
|
|
||||||
<div class="login layui-anim layui-anim-up"> |
|
||||||
<div class="message">x-admin2.0-管理登录</div> |
|
||||||
<div id="darkbannerwrap"></div> |
|
||||||
|
|
||||||
<form method="post" class="layui-form" > |
|
||||||
<input name="username" placeholder="用户名" type="text" lay-verify="required" class="layui-input" > |
|
||||||
<hr class="hr15"> |
|
||||||
<input name="password" lay-verify="required" placeholder="密码" type="password" class="layui-input"> |
|
||||||
<hr class="hr15"> |
|
||||||
<input value="登录" lay-submit lay-filter="login" style="width:100%;" type="submit"> |
|
||||||
<hr class="hr20" > |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
|
|
||||||
<script> |
|
||||||
$(function () { |
|
||||||
layui.use('form', function(){ |
|
||||||
var form = layui.form; |
|
||||||
// layer.msg('玩命卖萌中', function(){ |
|
||||||
// //关闭后的操作 |
|
||||||
// }); |
|
||||||
//监听提交 |
|
||||||
form.on('submit(login)', function(data){ |
|
||||||
// alert(888) |
|
||||||
layer.msg(JSON.stringify(data.field),function(){ |
|
||||||
location.href='index.html' |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
}); |
|
||||||
}) |
|
||||||
|
|
||||||
|
|
||||||
</script> |
|
||||||
|
|
||||||
|
|
||||||
<!-- 底部结束 --> |
|
||||||
<script> |
|
||||||
//百度统计可去掉 |
|
||||||
var _hmt = _hmt || []; |
|
||||||
(function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})(); |
|
||||||
</script> |
|
||||||
</body> |
|
||||||
</html> |
|
@ -1,123 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_email" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>邮箱 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_email" name="email" required="" lay-verify="email" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>昵称 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_username" name="username" required="" lay-verify="nikename" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_pass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_pass" name="pass" required="" lay-verify="pass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
6到16个字符 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>确认密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="add" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
//关闭当前frame |
|
||||||
x_admin_close(); |
|
||||||
|
|
||||||
// 可以对父窗口进行刷新 |
|
||||||
x_admin_father_reload(); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,122 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_email" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>邮箱 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_email" name="email" required="" lay-verify="email" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span>将会成为您唯一的登入名 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>昵称 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_username" name="username" required="" lay-verify="nikename" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_pass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_pass" name="pass" required="" lay-verify="pass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
6到16个字符 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>确认密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="add" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
File diff suppressed because it is too large
Load Diff
@ -1,125 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body class=""> |
|
||||||
<div class="x-nav"> |
|
||||||
<span class="layui-breadcrumb"> |
|
||||||
<a href="">首页</a> |
|
||||||
<a href="">演示</a> |
|
||||||
<a> |
|
||||||
<cite>导航元素</cite></a> |
|
||||||
</span> |
|
||||||
<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新"> |
|
||||||
<i class="layui-icon" style="line-height:30px">ဂ</i></a> |
|
||||||
</div> |
|
||||||
<div class="x-body"> |
|
||||||
<div class="layui-row"> |
|
||||||
<form class="layui-form layui-col-md12 x-so"> |
|
||||||
<input class="layui-input" autocomplete="off" placeholder="开始日" name="start" id="start"> |
|
||||||
<input class="layui-input" autocomplete="off" placeholder="截止日" name="end" id="end"> |
|
||||||
<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input"> |
|
||||||
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon"></i></button> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<table class="layui-table" lay-data="{url:'./user.json',page:true,toolbar: '#toolbarDemo',id:'test'}" lay-filter="test"> |
|
||||||
<thead> |
|
||||||
<tr> |
|
||||||
<th lay-data="{type:'checkbox'}">ID</th> |
|
||||||
<th lay-data="{field:'id', width:80, sort: true}">ID</th> |
|
||||||
<th lay-data="{field:'username', width:120, sort: true, edit: 'text'}">用户名</th> |
|
||||||
<th lay-data="{field:'email', edit: 'text', minWidth: 150}">邮箱</th> |
|
||||||
<th lay-data="{field:'sex', width:80,templet: '#switchTpl'}">性别</th> |
|
||||||
<th lay-data="{field:'city', edit: 'text', minWidth: 100}">城市</th> |
|
||||||
<th lay-data="{field:'experience', sort: true, edit: 'text'}">积分</th> |
|
||||||
</tr> |
|
||||||
</thead> |
|
||||||
</table> |
|
||||||
|
|
||||||
</div> |
|
||||||
<script type="text/html" id="toolbarDemo"> |
|
||||||
<div class="layui-btn-container"> |
|
||||||
<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button> |
|
||||||
<button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button> |
|
||||||
<button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button> |
|
||||||
</div> |
|
||||||
</script> |
|
||||||
<script type="text/html" id="switchTpl"> |
|
||||||
<!-- 这里的 checked 的状态只是演示 --> |
|
||||||
<input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="女|男" lay-filter="sexDemo" {{ d.id == 10003 ? 'checked' : '' }}> |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
layui.use('laydate', function(){ |
|
||||||
var laydate = layui.laydate; |
|
||||||
|
|
||||||
//执行一个laydate实例 |
|
||||||
laydate.render({ |
|
||||||
elem: '#start' //指定元素 |
|
||||||
}); |
|
||||||
|
|
||||||
//执行一个laydate实例 |
|
||||||
laydate.render({ |
|
||||||
elem: '#end' //指定元素 |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script> |
|
||||||
layui.use('table', function(){ |
|
||||||
var table = layui.table; |
|
||||||
|
|
||||||
//监听单元格编辑 |
|
||||||
table.on('edit(test)', function(obj){ |
|
||||||
var value = obj.value //得到修改后的值 |
|
||||||
,data = obj.data //得到所在行所有键值 |
|
||||||
,field = obj.field; //得到字段 |
|
||||||
layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为:'+ value); |
|
||||||
}); |
|
||||||
|
|
||||||
//头工具栏事件 |
|
||||||
table.on('toolbar(test)', function(obj){ |
|
||||||
var checkStatus = table.checkStatus(obj.config.id); |
|
||||||
switch(obj.event){ |
|
||||||
case 'getCheckData': |
|
||||||
var data = checkStatus.data; |
|
||||||
layer.alert(JSON.stringify(data)); |
|
||||||
break; |
|
||||||
case 'getCheckLength': |
|
||||||
var data = checkStatus.data; |
|
||||||
layer.msg('选中了:'+ data.length + ' 个'); |
|
||||||
break; |
|
||||||
case 'isAll': |
|
||||||
layer.msg(checkStatus.isAll ? '全选': '未全选'); |
|
||||||
break; |
|
||||||
}; |
|
||||||
}); |
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,103 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_username" class="layui-form-label"> |
|
||||||
昵称 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_username" name="username" disabled="" value="小明" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>旧密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="oldpass" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_pass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>新密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_pass" name="newpass" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
6到16个字符 |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>确认密码 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="password" id="L_repass" name="repass" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="save" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(save)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("修改成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,185 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form class="layui-form"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>用户名 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="username" name="username" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>收货人 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="username" name="username" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="phone" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>手机 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="phone" name="phone" required="" lay-verify="phone" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>收货地址 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="username" name="username" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>配送物流 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<select id="shipping" name="shipping" class="valid"> |
|
||||||
<option value="shentong">申通物流</option> |
|
||||||
<option value="shunfeng">顺丰物流</option> |
|
||||||
</select> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="username" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>支付方式 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<select name="contrller"> |
|
||||||
<option>支付方式</option> |
|
||||||
<option>支付宝</option> |
|
||||||
<option>微信</option> |
|
||||||
<option>货到付款</option> |
|
||||||
</select> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_email" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>发票抬头 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="L_email" name="email" required="" lay-verify="email" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
<div class="layui-form-mid layui-word-aux"> |
|
||||||
<span class="x-red">*</span> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item layui-form-text"> |
|
||||||
<label for="desc" class="layui-form-label"> |
|
||||||
商品增加 |
|
||||||
</label> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<table class="layui-table"> |
|
||||||
<tbody> |
|
||||||
<tr> |
|
||||||
<td>haier海尔 BC-93TMPF 93升单门冰箱</div></td> |
|
||||||
<td>0.01</div></td> |
|
||||||
<td>984</div></td> |
|
||||||
<td>1</td> |
|
||||||
<td>删除</td> |
|
||||||
</tr> |
|
||||||
<tr> |
|
||||||
<td>haier海尔 BC-93TMPF 93升单门冰箱</div></td> |
|
||||||
<td>0.01</div></td> |
|
||||||
<td>984</div></td> |
|
||||||
<td>1</td> |
|
||||||
<td>删除</td> |
|
||||||
</tr> |
|
||||||
</tbody> |
|
||||||
</table> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item layui-form-text"> |
|
||||||
<label for="desc" class="layui-form-label"> |
|
||||||
描述 |
|
||||||
</label> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<textarea placeholder="请输入内容" id="desc" name="desc" class="layui-textarea"></textarea> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="L_repass" class="layui-form-label"> |
|
||||||
</label> |
|
||||||
<button class="layui-btn" lay-filter="add" lay-submit=""> |
|
||||||
增加 |
|
||||||
</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
@ -1,147 +0,0 @@ |
|||||||
<!DOCTYPE html> |
|
||||||
<html class="x-admin-sm"> |
|
||||||
|
|
||||||
<head> |
|
||||||
<meta charset="UTF-8"> |
|
||||||
<title>欢迎页面-X-admin2.1</title> |
|
||||||
<meta name="renderer" content="webkit"> |
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|
||||||
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> |
|
||||||
<link rel="stylesheet" href="../assets/css/font.css"> |
|
||||||
<link rel="stylesheet" href="../assets/css/xadmin.css"> |
|
||||||
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/lib/layui/layui.js" charset="utf-8"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/xadmin.js"></script> |
|
||||||
<script type="text/javascript" src="../assets/js/cookie.js"></script> |
|
||||||
<!-- 让IE8/9支持媒体查询,从而兼容栅格 --> |
|
||||||
<!--[if lt IE 9]> |
|
||||||
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script> |
|
||||||
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> |
|
||||||
<![endif]--> |
|
||||||
</head> |
|
||||||
|
|
||||||
<body> |
|
||||||
<div class="x-body"> |
|
||||||
<form action="" method="post" class="layui-form layui-form-pane"> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<label for="name" class="layui-form-label"> |
|
||||||
<span class="x-red">*</span>角色名 |
|
||||||
</label> |
|
||||||
<div class="layui-input-inline"> |
|
||||||
<input type="text" id="name" name="name" required="" lay-verify="required" |
|
||||||
autocomplete="off" class="layui-input"> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item layui-form-text"> |
|
||||||
<label class="layui-form-label"> |
|
||||||
拥有权限 |
|
||||||
</label> |
|
||||||
<table class="layui-table layui-input-block"> |
|
||||||
<tbody> |
|
||||||
<tr> |
|
||||||
<td> |
|
||||||
<input type="checkbox" name="like1[write]" lay-skin="primary" lay-filter="father" title="用户管理"> |
|
||||||
</td> |
|
||||||
<td> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" title="用户停用" value="2"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户删除"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户修改"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表"> |
|
||||||
</div> |
|
||||||
</td> |
|
||||||
</tr> |
|
||||||
<tr> |
|
||||||
<td> |
|
||||||
|
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章管理" lay-filter="father"> |
|
||||||
</td> |
|
||||||
<td> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章添加"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章删除"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章修改"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章改密"> |
|
||||||
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章列表"> |
|
||||||
</div> |
|
||||||
</td> |
|
||||||
</tr> |
|
||||||
</tbody> |
|
||||||
</table> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item layui-form-text"> |
|
||||||
<label for="desc" class="layui-form-label"> |
|
||||||
描述 |
|
||||||
</label> |
|
||||||
<div class="layui-input-block"> |
|
||||||
<textarea placeholder="请输入内容" id="desc" name="desc" class="layui-textarea"></textarea> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
<div class="layui-form-item"> |
|
||||||
<button class="layui-btn" lay-submit="" lay-filter="add">增加</button> |
|
||||||
</div> |
|
||||||
</form> |
|
||||||
</div> |
|
||||||
<script> |
|
||||||
layui.use(['form','layer'], function(){ |
|
||||||
$ = layui.jquery; |
|
||||||
var form = layui.form |
|
||||||
,layer = layui.layer; |
|
||||||
|
|
||||||
//自定义验证规则 |
|
||||||
form.verify({ |
|
||||||
nikename: function(value){ |
|
||||||
if(value.length < 5){ |
|
||||||
return '昵称至少得5个字符啊'; |
|
||||||
} |
|
||||||
} |
|
||||||
,pass: [/(.+){6,12}$/, '密码必须6到12位'] |
|
||||||
,repass: function(value){ |
|
||||||
if($('#L_pass').val()!=$('#L_repass').val()){ |
|
||||||
return '两次密码不一致'; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//监听提交 |
|
||||||
form.on('submit(add)', function(data){ |
|
||||||
console.log(data); |
|
||||||
//发异步,把数据提交给php |
|
||||||
layer.alert("增加成功", {icon: 6},function () { |
|
||||||
// 获得frame索引 |
|
||||||
var index = parent.layer.getFrameIndex(window.name); |
|
||||||
//关闭当前frame |
|
||||||
parent.layer.close(index); |
|
||||||
}); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
form.on('checkbox(father)', function(data){ |
|
||||||
|
|
||||||
if(data.elem.checked){ |
|
||||||
$(data.elem).parent().siblings('td').find('input').prop("checked", true); |
|
||||||
form.render(); |
|
||||||
}else{ |
|
||||||
$(data.elem).parent().siblings('td').find('input').prop("checked", false); |
|
||||||
form.render(); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
}); |
|
||||||
</script> |
|
||||||
<script>var _hmt = _hmt || []; (function() { |
|
||||||
var hm = document.createElement("script"); |
|
||||||
hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; |
|
||||||
var s = document.getElementsByTagName("script")[0]; |
|
||||||
s.parentNode.insertBefore(hm, s); |
|
||||||
})();</script> |
|
||||||
</body> |
|
||||||
|
|
||||||
</html> |
|
File diff suppressed because it is too large
Load Diff
@ -1,95 +0,0 @@ |
|||||||
{ |
|
||||||
"code": 0 |
|
||||||
,"msg": "" |
|
||||||
,"count": 3000000 |
|
||||||
,"data": [{ |
|
||||||
"id": "10001" |
|
||||||
,"username": "杜甫" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "点击此处,显示更多。当内容超出时,点击单元格会自动显示更多内容。" |
|
||||||
,"experience": "116" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "108" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10002" |
|
||||||
,"username": "李白" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "君不见,黄河之水天上来,奔流到海不复回。 君不见,高堂明镜悲白发,朝如青丝暮成雪。 人生得意须尽欢,莫使金樽空对月。 天生我材必有用,千金散尽还复来。 烹羊宰牛且为乐,会须一饮三百杯。 岑夫子,丹丘生,将进酒,杯莫停。 与君歌一曲,请君为我倾耳听。(倾耳听 一作:侧耳听) 钟鼓馔玉不足贵,但愿长醉不复醒。(不足贵 一作:何足贵;不复醒 一作:不愿醒/不用醒) 古来圣贤皆寂寞,惟有饮者留其名。(古来 一作:自古;惟 通:唯) 陈王昔时宴平乐,斗酒十千恣欢谑。 主人何为言少钱,径须沽取对君酌。 五花马,千金裘,呼儿将出换美酒,与尔同销万古愁。" |
|
||||||
,"experience": "12" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
,"LAY_CHECKED": true |
|
||||||
}, { |
|
||||||
"id": "10003" |
|
||||||
,"username": "王勃" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "65" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10004" |
|
||||||
,"username": "李清照" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "女" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "666" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10005" |
|
||||||
,"username": "冰心" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "女" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "86" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10006" |
|
||||||
,"username": "贤心" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "12" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10007" |
|
||||||
,"username": "贤心" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "16" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}, { |
|
||||||
"id": "10008" |
|
||||||
,"username": "贤心" |
|
||||||
,"email": "xianxin@layui.com" |
|
||||||
,"sex": "男" |
|
||||||
,"city": "浙江杭州" |
|
||||||
,"sign": "人生恰似一场修行" |
|
||||||
,"experience": "106" |
|
||||||
,"ip": "192.168.0.8" |
|
||||||
,"logins": "106" |
|
||||||
,"joinTime": "2016-10-14" |
|
||||||
}] |
|
||||||
} |
|
@ -0,0 +1,33 @@ |
|||||||
|
package com.gitee.sop.adminserver.config; |
||||||
|
|
||||||
|
import org.springframework.context.annotation.Configuration; |
||||||
|
import org.springframework.stereotype.Controller; |
||||||
|
import org.springframework.web.bind.annotation.GetMapping; |
||||||
|
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry; |
||||||
|
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; |
||||||
|
|
||||||
|
@Configuration |
||||||
|
public class WebConfig extends WebMvcConfigurerAdapter { |
||||||
|
|
||||||
|
@Override |
||||||
|
public void addResourceHandlers(ResourceHandlerRegistry registry) { |
||||||
|
//配置映射关系
|
||||||
|
registry.addResourceHandler("/conf/**").addResourceLocations("classpath:/META-INF/resources/webjars/sop-admin-front/1.0.0-SNAPSHOT/"); |
||||||
|
} |
||||||
|
|
||||||
|
@Controller |
||||||
|
public static class ConfController { |
||||||
|
|
||||||
|
private static final String REDIRECT_INDEX = "redirect:/conf/index.html"; |
||||||
|
|
||||||
|
@GetMapping("/") |
||||||
|
public String index() { |
||||||
|
return REDIRECT_INDEX; |
||||||
|
} |
||||||
|
|
||||||
|
@GetMapping("/conf") |
||||||
|
public String conf() { |
||||||
|
return REDIRECT_INDEX; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
Loading…
Reference in new issue