root
/
Pear-Admin-Layui
mirror of https://gitee.com/zhang_1334717033/Pear-Admin-Layui
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

2.1版本优化

develop
Jmysy 2020-04-16 18:00:35 +08:00
parent 39130fddcf
commit c6e295e684
10 changed files with 472 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
Pear Admin v 2.0/admin/css/pearAdmin.css
View File

@ -5,12 +5,10 @@
.pear-admin .layui-side{
transition: all .3s;
}
.pear-admin .layui-logo .title{
font-size: 20px;
}
.layui-header .layui-nav-more{
.layui-header .layui-nav-more{
display: none!important;
}
@ -34,17 +32,14 @@
width: calc(100% - 220px);
background-color: white;
}
.pear-admin .layui-header .layui-nav-img{
width: 30px;
height: 30px;
}
.pear-admin .layui-layout-control{
left: 120px;
position: absolute;
}
.pear-admin .layui-logo{
width: 220px;
height: 60px;
@ -52,45 +47,51 @@
background-color: #28333E;
}
.pear-admin .layui-logo img{
width: 36px;
height: 36px;
}
.pear-admin .layui-logo .title{
font-size: 21px;
font-weight: 550;
color: #5FB878;
position: relative;
top: 5px;
margin-left: 5px;
}
.pear-admin .layui-logo .logo{
display: none;
}
.pear-mini .layui-logo .title{
display: none;
}
.pear-mini .layui-logo .logo{
display: inline-block;
}
.pear-admin .layui-side {
top: 0px;
width: 220px;
box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
z-index: 9999;
}
.pear-admin .layui-side-scroll::-webkit-scrollbar{
width:0px;
height:0px;
}
.pear-admin .layui-side-scroll{
height: calc(100% - 60px);
height: calc(100% - 102px);
background-color: #28333E;
}
.pear-admin .layui-header .layui-nav .layui-nav-item>a {
color: black;
font-size: 15px;
}
.pear-admin .layui-body {
left: 220px;
bottom: 0px;
}
.pear-admin .layui-layout-left {
.pear-admin .layui-layout-left {
left: 0px;
}
@ -99,57 +100,95 @@
.pear-mini .layui-side{
width: 60px;
}
.pear-mini .layui-header{
left: 60px;
width: calc(100% - 60px);
}
.pear-mini .layui-body{
left: 60px;
}
.pear-mini .layui-logo{
width: 60px;
}
.pear-mini .layui-nav-tree .layui-nav-item span{
display: none;
}
.pear-mini .bottom-nav li{
width: 100%!important;
}
.pear-mini .layui-side-scroll{
height: calc(100% - 228px);
}
/** 快捷按键 */
.bottom-nav {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
box-shadow: 0 -2px 0 rgba(0,0,0,.3);
background-color: #28333E;
}
.bottom-nav li {
display: block;
float: left;
width: 25%;
padding: 6px;
box-sizing: border-box;
text-align: center;
}
.bottom-nav *{
color: white;
}
.bottom-nav li a {
cursor: pointer;
display: block;
width: 100%;
height: 30px;
line-height: 30px;
color: #666;
border-radius: 4px;
}
.bottom-nav li a:hover{
background-color: #5FB878;
}
/** 顶 部 菜 单 样 式 */
.pear-admin .layui-header .layui-nav .layui-nav-bar {
top: 0px !important;
height: 2px !important;
background-color: #5FB878;
}
.pear-admin .layui-header .layui-nav .layui-this:after {
display: none;
}
/** 新增兼容 */
@media screen and (max-width:768px) {
.pear-mini .bottom-nav{
display: none;
}
.pear-mini .layui-side-scroll{
height: calc(100% - 62px);
}
/** 隐 藏 布 局 样 式 */
.pear-mini .layui-side{
width: 0px;
}
.pear-mini .layui-header{
left: 0px;
width: 100%;
}
.pear-mini .layui-body{
left: 0px;
}
.pear-mini .layui-logo{
width: 0px;
}
.pear-admin .layui-body{
left: 0px;
}
@ -157,7 +196,6 @@
left: 0px;
width: 100%;
}
.pear-admin .pear-cover{
width: 100%;
height: 100%;
@ -167,7 +205,6 @@
z-index: 1000;
opacity: 0;
}
.pear-mini .pear-cover{
display: none;
}
@ -210,6 +247,4 @@
.layui-layer-dialog .layui-layer-content{
padding: 0px!important;
}
}

36
Pear Admin v 2.0/admin/css/pearNotice.css Normal file
View File

@ -0,0 +1,36 @@
.pear-notice .layui-this {
color: #5FB878 !important;
}
.pear-notice li {
border-right: 1px solid whitesmoke;
}
.pear-notice * {
color: dimgray !important;
}
.pear-notice span{
margin-left: 20px;
font-size: 13px;
}
.pear-notice img{
margin-left: 8px;
width: 33px!important;
height: 33px!important;
border-radius: 50px;
}
.pear-notice-item{
height: 45px!important;
line-height: 45px!important;
}
/** 滚动条样式 */
.pear-notice *::-webkit-scrollbar{width:4px;height:4px;}
.pear-notice *::-webkit-scrollbar-track{background: white;border-radius:2px;}
.pear-notice *::-webkit-scrollbar-thumb{background: #E6E6E6;border-radius:2px;}
.pear-notice *::-webkit-scrollbar-thumb:hover{background: #E6E6E6;}
.pear-notice *::-webkit-scrollbar-corner{background: #f6f6f6;}

68
Pear Admin v 2.0/admin/data/notice.json Normal file
View File

@ -0,0 +1,68 @@
[{
"id": 1,
"title": "私信",
"children": [{
"id": 11,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}, {
"id": 12,
"avatar":"admin/images/success.png",
"title": "收到一条成功通知",
"time": "2019-02-15"
}]
},
{
"id": 2,
"title": "消息",
"children": [{
"id": 11,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}, {
"id": 12,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
},
{
"id": 11,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}, {
"id": 12,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
},
{
"id": 11,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}, {
"id": 12,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}]
},
{
"id": 3,
"title": "通知",
"children": [{
"id": 11,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}, {
"id": 12,
"avatar":"admin/images/success.png",
"title": "收到一条紧急任务",
"time": "2019-02-15"
}]
}
]

BIN
Pear Admin v 2.0/admin/images/success.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.4 KiB

6
Pear Admin v 2.0/component/layui/lay/extends/pearAdmin.js
View File

@ -77,7 +77,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'pearTab', 'pearMenu', 'pear
$("body").on("click", ".refresh", function() {
bodyTab.refresh(1000);
bodyTab.refresh(500);
})
sideMenu.click(function(dom, data) {
@ -88,7 +88,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'pearTab', 'pearMenu', 'pear
url: data.menuUrl,
icon: data.menuIcon,
close: true
}, 300);
},300);
compatible();
})
@ -105,7 +105,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'pearTab', 'pearMenu', 'pear
});
$("body").on("click", ".refresh", function() {
bodyFrame.refresh(1000);
bodyFrame.refresh(500);
})
sideMenu.click(function(dom, data) {

3
Pear Admin v 2.0/component/layui/lay/extends/pearMenu.js
View File

@ -242,7 +242,6 @@ layui.define(['table', 'jquery', 'element'], function (exports) {
if(index === option.defaultMenu){
controlItem = '<li pear-id="'+item.id+'" class="layui-this layui-nav-item"><a href="#">'+item.title+'</a></li>';
menuItem = '<ul pear-id="'+item.id+'" lay-filter="'+option.elem+'" class="layui-nav arrow layui-nav-tree pear-nav-tree">';
@ -369,7 +368,7 @@ layui.define(['table', 'jquery', 'element'], function (exports) {
// 封 装
}else{
content += '<div class="toast"><i class="layui-icon layui-icon-more"></i></div>';
content += '<div class="toast"> 无 内 容 </div>';
/* 暂 无 数 据&nbsp;&nbsp;&nbsp;&nbsp; */
}

117
Pear Admin v 2.0/component/layui/lay/extends/pearNotice.js Normal file
View File

@ -0,0 +1,117 @@
layui.define(['table', 'jquery', 'element'], function (exports) {
"use strict";
var MOD_NAME = 'pearNotice',
$ = layui.jquery,
element = layui.element;
var pearNotice = function (opt) {
this.option = opt;
};
pearNotice.prototype.render = function (opt) {
//默认配置值
var option = {
elem:opt.elem,
url:opt.url,
height:opt.height,
data:opt.data,
click:opt.click
}
option.data = getData(option.url);
var notice = createHtml(option);
$("#"+option.elem).html(notice);
// 添加监听
$("*[notice-id]").click(function(){
var id = $(this).attr("notice-id");
var title = $(this).attr("notice-title");
option.click(id,title);
})
return new pearNotice(option);
}
/** 同 步 请 求 获 取 数 据 */
function getData(url){
$.ajaxSettings.async = false;
var data = null;
$.get(url, function(result) {
data = result;
});
$.ajaxSettings.async = true;
return data;
}
function createHtml(option){
var notice = '<li class="layui-nav-item" lay-unselect="">'+
'<a href="#" class="notice layui-icon layui-icon-notice"><span class="layui-badge-dot"></span></a>'+
'<div class="layui-nav-child layui-tab pear-notice" style="left: -200px;">';
var noticeTitle = '<ul class="layui-tab-title">';
var noticeContent = '<div class="layui-tab-content" style="height:'+option.height+';overflow-x: hidden;">'
var index = 0;
// 根据 data 便利数据
$.each(option.data, function(i, item) {
if(index==0){
noticeTitle += '<li class="layui-this">'+item.title+'</li>';
noticeContent += '<div class="layui-tab-item layui-show">';
}else{
noticeTitle += '<li>'+item.title+'</li>';
noticeContent += '<div class="layui-tab-item">';
}
$.each(item.children, function(i, note) {
noticeContent += '<div class="pear-notice-item" notice-title="'+note.title+'" notice-id="'+note.id+'">'+
'<img src="'+note.avatar+'">'+
'<span>'+note.title+'</span>'+
'<span>'+note.time+'</span>'+
'</div>';
})
noticeContent += '</div>';
index++;
})
noticeTitle += '</ul>';
noticeContent += '</div>';
notice += noticeTitle;
notice += noticeContent;
notice += '</div></li>';
return notice;
}
exports(MOD_NAME,new pearNotice());
})

1
Pear Admin v 2.0/component/layui/layui.js
View File

@ -54,6 +54,7 @@
pearAdmin:"extends/pearAdmin",
pearFrame:"extends/pearFrame",
pearSocial:"extends/pearSocial",
pearNotice:"extends/pearNotice",
echarts:"extends/echarts",
echartsTheme:"extends/echartsTheme",
treetable:"extends/treetable",

110
Pear Admin v 2.0/index.html
View File

@ -4,16 +4,15 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="component/layui/css/layui.css" />
<link rel="stylesheet" href="admin/css/pearMenu.css"/>
<link rel="stylesheet" href="admin/css/pearMenu.css" />
<link rel="stylesheet" href="admin/css/pearTab.css" />
<link rel="stylesheet" href="admin/css/pearTheme.css"/>
<link rel="stylesheet" href="admin/css/pearLoad.css"/>
<link rel="stylesheet" href="admin/css/pearFrame.css"/>
<link rel="stylesheet" href="admin/css/pearAdmin.css"/>
<link rel="stylesheet" href="admin/css/pearSocial.css"/>
<style id="pearone-bg-color">
/** 自 定 义 主 题 */
</style>
<link rel="stylesheet" href="admin/css/pearTheme.css" />
<link rel="stylesheet" href="admin/css/pearLoad.css" />
<link rel="stylesheet" href="admin/css/pearFrame.css" />
<link rel="stylesheet" href="admin/css/pearAdmin.css" />
<link rel="stylesheet" href="admin/css/pearNotice.css" />
<link rel="stylesheet" href="admin/css/pearSocial.css" />
<style id="pearone-bg-color"></style>
</head>
<body class="layui-layout-body pear-admin">
<!-- 布局框架 -->
@ -26,71 +25,96 @@
<div id="control" class="layui-layout-control"></div>
<ul class="layui-nav layui-layout-right">
<li class="layui-nav-item layui-hide-xs"><a href="#" class="fullScreen layui-icon layui-icon-screen-full"></a></li>
<li class="layui-nav-item layui-hide-xs"><a href="#" class="layui-icon layui-icon-website"></a></li>
<li class="layui-nav-item layui-hide-xs"><a href="https://gitee.com/Jmysy/Pear-One-Layui" class="layui-icon layui-icon-website"></a></li>
<li class="layui-nav-item" id="headerNotice"></li>
<li class="layui-nav-item" lay-unselect="">
<a href="#" class="notice layui-icon layui-icon-notice"><span class="layui-badge-dot"></span></a>
<dl class="layui-nav-child">
<dd><a href="javascript:;"> 收到一条消息 </a></dd>
<dd><a href="javascript:;"> 收到一条消息 </a></dd>
<dd><a href="javascript:;"> 收到一条消息 </a></dd>
<dd><a href="javascript:;"> 收到一条消息 </a></dd>
</dl>
</li>
<li class="layui-nav-item" lay-unselect="">
<a href="javascript:;"><img src="admin/images/avatar.jpg" class="layui-nav-img">就眠仪式</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">个人信息</a></dd>
<dd><a href="javascript:;">安全配置</a></dd>
<dd><a href="javascript:;">打开百度</a></dd>
<dd><a href="javascript:;">注销登陆</a></dd>
</dl>
<a href="javascript:;"><img src="admin/images/avatar.jpg" class="layui-nav-img">就眠仪式</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;" class="pearson">个人信息</a></dd>
<dd><a href="javascript:;">安全配置</a></dd>
<dd><a href="javascript:;">打开百度</a></dd>
<dd><a href="javascript:;">注销登陆</a></dd>
</dl>
</li>
<li class="setting layui-nav-item"><a href="#" class="layui-icon layui-icon-more-vertical"></a></li>
</ul>
</div>
<div class="layui-side layui-bg-black">
<div class="layui-logo">
<div class="layui-logo">
<img class="logo" src="admin/images/logo.png" />
<span class="title">Pear Admin</span>
</div>
<div class="layui-side-scroll">
<div id="sideMenu"></div>
</div>
<ul class="bottom-nav">
<li class="head-nav-item">
<a href="javascript:;"><i class="layui-icon layui-icon-notice"></i></a>
</li>
<li class="head-nav-item theme">
<a href="javascript:;"><i class="layui-icon layui-icon-theme"></i></a>
</li>
<li class="head-nav-item">
<a href="javascript:;"><i class="layui-icon layui-icon-username"></i></a>
</li>
<li class="head-nav-item">
<a href="javascript:;"><i class="layui-icon layui-icon-edit"></i></a>
</li>
</ul>
</div>
<div class="layui-body">
<div id="content" ></div>
<div id="content"></div>
</div>
</div>
<!-- 移动端 遮盖层 -->
<div class="pear-cover"></div>
<!-- 初始加载 动画-->
<div class="preloader">
<div class="preloader-inner"></div>
</div>
<script src="component/layui/layui.js"></script>
<script>
layui.use(['pearAdmin','jquery','pearTab'],function(){
layui.use(['pearAdmin', 'jquery', 'pearTab', 'pearNotice'], function() {
var pearAdmin = layui.pearAdmin;
var $ = layui.jquery;
var pearTab = layui.pearTab;
var pearNotice = layui.pearNotice;
/**
* 框架初始化配置
* */
var config = {
keepLoad:1000, // 主 页 加 载 过 度 时 长 可为 false
muiltTab:true, // 是 否 开 启 多 标 签 页 true 开启 false 关闭
control:false, // 是 否 开 启 多 系 统 菜 单 true 开启 false 关闭
theme:"dark-theme", // 默 认 主 题 样 式 dark-theme 默认主题 light-theme 亮主题
index:'view/console/console.html', // 默 认 加 载 主 页
data:'admin/data/menu.json', // 菜 单 数 据 加 载 地 址
done:function(){
keepLoad: false, // 主 页 加 载 过 度 时 长 可为 false
muiltTab: true, // 是 否 开 启 多 标 签 页 true 开启 false 关闭
control: false, // 是 否 开 启 多 系 统 菜 单 true 开启 false 关闭
theme: "dark-theme", // 默 认 主 题 样 式 dark-theme 默认主题 light-theme 亮主题
index: 'view/console/console.html', // 默 认 加 载 主 页
data: 'admin/data/menu.json', // 菜 单 数 据 加 载 地 址
done: function() {
/** 框架初始化 */
}
};
pearAdmin.render(config);
/**
* 框架初始化
* */
pearAdmin.render(config);
/**
* 消息组件初始化
* */
pearNotice.render({
elem: 'headerNotice',
url: 'admin/data/notice.json',
height: '200px',
click: function(id, title) {
layer.msg("当前监听消息" + id + "消息标题:" + title);
}
})
})
</script>
</body>
</html>

194
Pear Admin v 2.0/view/console/console.html
View File

@ -73,8 +73,8 @@
}
.list .list-item{
height: 34px;
line-height: 34px;
height: 33px;
line-height: 33px;
color: gray;
padding: 5px;
padding-left: 15px;
@ -120,10 +120,10 @@
<div class="layui-card-header">今日访问</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<div class="layui-col-xs8 layui-col-md8 top-panel-number">
9,04,0
</div>
<div class="layui-col-xs3 layui-col-md4 top-panel-tips">
<div class="layui-col-xs4 layui-col-md4 top-panel-tips">
<i class="layui-icon layui-icon-app" style="color: #4099FF;"></i>
</div>
</div>
@ -135,10 +135,10 @@
<div class="layui-card-header">提交次数</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<div class="layui-col-xs8 layui-col-md8 top-panel-number">
6,34,4
</div>
<div class="layui-col-xs3 layui-col-md4 top-panel-tips">
<div class="layui-col-xs4 layui-col-md4 top-panel-tips">
<i class="layui-icon layui-icon-component" style="color: #DD4A68;"></i>
</div>
</div>
@ -150,10 +150,10 @@
<div class="layui-card-header">下载数量</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<div class="layui-col-xs8 layui-col-md8 top-panel-number">
1,34,1
</div>
<div class="layui-col-xs3 layui-col-md4 top-panel-tips">
<div class="layui-col-xs4 layui-col-md4 top-panel-tips">
<i class="layui-icon layui-icon-carousel" style="color: #5FB878;"></i>
</div>
</div>
@ -165,10 +165,10 @@
<div class="layui-card-header">流量统计</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space5">
<div class="layui-col-xs9 layui-col-md8 top-panel-number">
<div class="layui-col-xs8 layui-col-md8 top-panel-number">
7,04,6
</div>
<div class="layui-col-xs3 layui-col-md4 top-panel-tips">
<div class="layui-col-xs4 layui-col-md4 top-panel-tips">
<i class="layui-icon layui-icon-cart" style="color: #E6A23C;"></i>
</div>
</div>
@ -187,74 +187,7 @@
<li>数据统计</li>
</ul>
<div class="layui-tab-content">
<div class="layui-row layui-col-space10">
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">PearOne</span>
</div>
<div class="body">
城镇中有那么多的酒馆，她却偏偏走进了我的酒馆
</div>
<div class="footer">10小时前</div>
</div>
</div>
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">Angular</span>
</div>
<div class="body">
希望是一个好东西，也许是最好的，好东西是不会消亡
</div>
<div class="footer">1小时前</div>
</div>
</div>
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">Vue</span>
</div>
<div class="body">
生命就像一盒巧克力，结果往往出人意料
</div>
<div class="footer">2小时前</div>
</div>
</div>
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">BootStrap</span>
</div>
<div class="body">
一切都在不可避免的走向庸俗
</div>
<div class="footer">3小时前</div>
</div>
</div>
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">Ant Design</span>
</div>
<div class="body">
你要是愿意我就永远爱你，你要是不愿意我就永远相思
</div>
<div class="footer">10小时前</div>
</div>
</div>
<div class="layui-col-md4">
<div class="card">
<div class="header">
<img class="avatar" src="../../admin/images/avatar.jpg"></img><span class="title">Jmys</span>
</div>
<div class="body">
在所谓'人世间'摸爬滚打至今，一切都会过去
</div>
<div class="footer">24小时前</div>
</div>
</div>
</div>
<div id="echarts-records" style="background-color:#ffffff;min-height:400px;padding: 10px"></div>
</div>
</div>
</div>
@ -280,6 +213,8 @@
<div class="layui-card-header">最近更新</div>
<div class="layui-card-body">
<ul class="list">
<li class="list-item"><span class="title">新增消息组件</span><span class="footer">2019-12-15 11:28</span></li>
<li class="list-item"><span class="title">移动端兼容</span><span class="footer">2019-12-15 11:28</span></li>
<li class="list-item"><span class="title">系统布局优化</span><span class="footer">2019-12-15 11:28</span></li>
<li class="list-item"><span class="title">兼容多系统菜单模式</span><span class="footer">2019-12-15 11:28</span></li>
<li class="list-item"><span class="title">兼容多标签页切换</span><span class="footer">2019-12-9 14:58</span></li>
@ -355,12 +290,103 @@
<!--</div>-->
<script src="../../component/layui/layui.js" charset="utf-8"></script>
<script>
layui.use(['layer', 'echarts','element'], function() {
var $ = layui.jquery,
layer = layui.layer,
echarts = layui.echarts,
element = layui.element;
});
layui.use(['layer', 'echarts','element'], function () {
var $ = layui.jquery,
layer = layui.layer,
element = layui.element,
echarts = layui.echarts;
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');
var optionRecords = {
title: {
text: ''
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
},
legend: {
data: ['邮件营销', '联盟广告', '视频广告', '直接访问', '搜索引擎']
},
toolbox: {
feature: {
saveAsImage: {}
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '邮件营销',
type: 'line',
stack: '总量',
areaStyle: {},
data: [120, 132, 101, 134, 90, 230, 210]
},
{
name: '联盟广告',
type: 'line',
areaStyle: {},
data: [220, 182, 200, 234, 290, 330, 310]
},
{
name: '视频广告',
type: 'line',
stack: '总量',
areaStyle: {},
data: [900, 600, 450, 599, 650, 750, 900]
},
{
name: '直接访问',
type: 'line',
stack: '总量',
areaStyle: {},
data: [600, 454, 545, 699, 899, 1000, 1100]
},
{
name: '搜索引擎',
type: 'line',
stack: '总量',
label: {
normal: {
show: true,
position: 'top'
}
},
areaStyle: {},
data: [820, 932, 901, 934, 1290, 1330, 1320]
}
]
};
echartsRecords.setOption(optionRecords);
window.onresize = function () {
echartsRecords.resize();
}
});
</script>
</body>
</html>