Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
易企天创
zui
提交
3c61efd2
Z
zui
项目概览
易企天创
/
zui
大约 1 年 前同步成功
通知
6
Star
0
Fork
1
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
37
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
Z
zui
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
37
Issue
37
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
3c61efd2
编写于
2月 17, 2014
作者:
C
Catouse
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
* added refresh button to the dashboard.
上级
072d97b6
变更
6
展开全部
隐藏空白更改
内联
并排
Showing
6 changed file
with
89 addition
and
11 deletion
+89
-11
dist/css/zui.css
dist/css/zui.css
+2
-2
dist/js/zui.min.js
dist/js/zui.min.js
+2
-2
examples/dashboard.html
examples/dashboard.html
+5
-4
src/js/dashboard.js
src/js/dashboard.js
+38
-0
src/js/zui.js
src/js/zui.js
+39
-0
src/less/views/dashboard.less
src/less/views/dashboard.less
+3
-3
未找到文件。
dist/css/zui.css
浏览文件 @
3c61efd2
因为 它太大了无法显示 source diff 。你可以改为
查看blob
。
dist/js/zui.min.js
浏览文件 @
3c61efd2
此差异已折叠。
点击以展开。
examples/dashboard.html
浏览文件 @
3c61efd2
...
@@ -88,15 +88,15 @@
...
@@ -88,15 +88,15 @@
</nav>
</nav>
<article>
<article>
<h1>
Dashboard
</h1>
<h1>
Dashboard
</h1>
<div
class=
"segment"
style=
'max-width: 1600px; width: inherit; padding: 80px 50px;
background: #3280fc
'
>
<div
class=
"segment"
style=
'max-width: 1600px; width: inherit; padding: 80px 50px;'
>
<div
id=
"dashboard"
class=
"dashboard dashboard-draggable"
data-height=
"300"
>
<div
id=
"dashboard"
class=
"dashboard dashboard-draggable"
data-height=
"300"
>
<header></header>
<header></header>
<section
class=
'row'
>
<section
class=
'row'
>
<div
class=
"col-md-4 col-sm-6"
>
<div
class=
"col-md-4 col-sm-6"
>
<div
class=
"panel"
>
<div
class=
"panel"
data-url=
'http://baidu.com'
>
<div
class=
"panel-heading"
>
<div
class=
"panel-heading"
>
<div
class=
"panel-actions"
>
<div
class=
"panel-actions"
>
<button
class=
"btn btn-mini"
><i
class=
"icon-refresh"
></i></button>
<button
class=
"btn btn-mini
refresh-panel
"
><i
class=
"icon-refresh"
></i></button>
<div
class=
"dropdown"
>
<div
class=
"dropdown"
>
<button
role=
"button"
class=
"btn btn-mini"
data-toggle=
"dropdown"
><span
class=
"caret"
></span></button>
<button
role=
"button"
class=
"btn btn-mini"
data-toggle=
"dropdown"
><span
class=
"caret"
></span></button>
<ul
class=
"dropdown-menu pull-right"
role=
"menu"
aria-labelledby=
"dropdownMenu1"
>
<ul
class=
"dropdown-menu pull-right"
role=
"menu"
aria-labelledby=
"dropdownMenu1"
>
...
@@ -123,7 +123,7 @@
...
@@ -123,7 +123,7 @@
</div>
</div>
</div>
</div>
<div
class=
"col-md-4 col-sm-6"
>
<div
class=
"col-md-4 col-sm-6"
>
<div
class=
"panel"
>
<div
class=
"panel"
data-url=
'http://chanzhi.org'
>
<div
class=
"panel-heading"
>
<div
class=
"panel-heading"
>
<div
class=
"panel-actions"
>
<div
class=
"panel-actions"
>
<a
href=
"#"
><i
class=
"icon-refresh"
></i></a>
<a
href=
"#"
><i
class=
"icon-refresh"
></i></a>
...
@@ -131,6 +131,7 @@
...
@@ -131,6 +131,7 @@
<a
href=
'#'
role=
"button"
data-toggle=
"dropdown"
><span
class=
"caret"
></span></a>
<a
href=
'#'
role=
"button"
data-toggle=
"dropdown"
><span
class=
"caret"
></span></a>
<ul
class=
"dropdown-menu pull-right"
role=
"menu"
aria-labelledby=
"dropdownMenu1"
>
<ul
class=
"dropdown-menu pull-right"
role=
"menu"
aria-labelledby=
"dropdownMenu1"
>
<li><a
href=
"#"
><i
class=
"icon-pencil"
></i>
编辑
</a></li>
<li><a
href=
"#"
><i
class=
"icon-pencil"
></i>
编辑
</a></li>
<li><a
href=
"#"
class=
'refresh-panel'
><i
class=
"icon-refresh"
></i>
刷新
</a></li>
<li><a
href=
"#"
class=
"remove-panel"
><i
class=
"icon-remove"
></i>
移除
</a></li>
<li><a
href=
"#"
class=
"remove-panel"
><i
class=
"icon-remove"
></i>
移除
</a></li>
</ul>
</ul>
</div>
</div>
...
...
src/js/dashboard.js
浏览文件 @
3c61efd2
...
@@ -41,6 +41,15 @@
...
@@ -41,6 +41,15 @@
});
});
};
};
Dashboard
.
prototype
.
handleRefreshEvent
=
function
()
{
this
.
$
.
find
(
'
.refresh-panel
'
).
click
(
function
()
{
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
refreshPanel
(
panel
);
});
}
Dashboard
.
prototype
.
handleDraggable
=
function
()
Dashboard
.
prototype
.
handleDraggable
=
function
()
{
{
var
dashboard
=
this
.
$
;
var
dashboard
=
this
.
$
;
...
@@ -59,6 +68,7 @@
...
@@ -59,6 +68,7 @@
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
var
row
=
panel
.
closest
(
'
.row
'
);
var
row
=
panel
.
closest
(
'
.row
'
);
var
dPanel
=
panel
.
clone
().
addClass
(
'
panel-dragging-shadow
'
);
var
dPanel
=
panel
.
clone
().
addClass
(
'
panel-dragging-shadow
'
);
var
dCol
=
panel
.
parent
().
clone
().
addClass
(
'
panel-shadow-col
'
);
var
pos
=
panel
.
offset
();
var
pos
=
panel
.
offset
();
var
dPos
=
dashboard
.
offset
();
var
dPos
=
dashboard
.
offset
();
...
@@ -175,11 +185,37 @@
...
@@ -175,11 +185,37 @@
});
});
};
};
function
refreshPanel
(
panel
)
{
var
url
=
panel
.
data
(
'
url
'
);
if
(
!
url
)
return
;
panel
.
addClass
(
'
panel-loading
'
).
find
(
'
.panel-heading .icon-refresh,.panel-heading .icon-repeat
'
).
addClass
(
'
icon-spin
'
);
$
.
ajax
(
{
url
:
url
,
dataType
:
'
html
'
,
})
.
done
(
function
(
data
)
{
panel
.
find
(
'
.panel-body
'
).
html
(
data
);
})
.
fail
(
function
()
{
panel
.
addClass
(
'
panel-error
'
);
})
.
always
(
function
()
{
panel
.
removeClass
(
'
panel-loading
'
);
panel
.
find
(
'
.panel-heading .icon-refresh,.panel-heading .icon-repeat
'
).
removeClass
(
'
icon-spin
'
);
});
}
Dashboard
.
prototype
.
init
=
function
()
Dashboard
.
prototype
.
init
=
function
()
{
{
this
.
handlePanelHeight
();
this
.
handlePanelHeight
();
this
.
handlePanelPadding
();
this
.
handlePanelPadding
();
this
.
handleRemoveEvent
();
this
.
handleRemoveEvent
();
this
.
handleRefreshEvent
();
if
(
this
.
draggable
)
this
.
handleDraggable
();
if
(
this
.
draggable
)
this
.
handleDraggable
();
...
@@ -196,6 +232,8 @@
...
@@ -196,6 +232,8 @@
{
{
$this
.
attr
(
'
data-id
'
,
orderSeed
);
$this
.
attr
(
'
data-id
'
,
orderSeed
);
}
}
refreshPanel
(
$this
);
});
});
}
}
...
...
src/js/zui.js
浏览文件 @
3c61efd2
...
@@ -1770,6 +1770,7 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
...
@@ -1770,6 +1770,7 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
};
};
})(
jQuery
);
})(
jQuery
);
/* Dashboard */
/* Dashboard */
+
function
(
$
,
window
,
document
,
Math
)
+
function
(
$
,
window
,
document
,
Math
)
{
{
...
@@ -1813,6 +1814,15 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
...
@@ -1813,6 +1814,15 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
});
});
};
};
Dashboard
.
prototype
.
handleRefreshEvent
=
function
()
{
this
.
$
.
find
(
'
.refresh-panel
'
).
click
(
function
()
{
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
refreshPanel
(
panel
);
});
}
Dashboard
.
prototype
.
handleDraggable
=
function
()
Dashboard
.
prototype
.
handleDraggable
=
function
()
{
{
var
dashboard
=
this
.
$
;
var
dashboard
=
this
.
$
;
...
@@ -1831,6 +1841,7 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
...
@@ -1831,6 +1841,7 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
var
panel
=
$
(
this
).
closest
(
'
.panel
'
);
var
row
=
panel
.
closest
(
'
.row
'
);
var
row
=
panel
.
closest
(
'
.row
'
);
var
dPanel
=
panel
.
clone
().
addClass
(
'
panel-dragging-shadow
'
);
var
dPanel
=
panel
.
clone
().
addClass
(
'
panel-dragging-shadow
'
);
var
dCol
=
panel
.
parent
().
clone
().
addClass
(
'
panel-shadow-col
'
);
var
pos
=
panel
.
offset
();
var
pos
=
panel
.
offset
();
var
dPos
=
dashboard
.
offset
();
var
dPos
=
dashboard
.
offset
();
...
@@ -1947,11 +1958,37 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
...
@@ -1947,11 +1958,37 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
});
});
};
};
function
refreshPanel
(
panel
)
{
var
url
=
panel
.
data
(
'
url
'
);
if
(
!
url
)
return
;
panel
.
addClass
(
'
panel-loading
'
).
find
(
'
.panel-heading .icon-refresh,.panel-heading .icon-repeat
'
).
addClass
(
'
icon-spin
'
);
$
.
ajax
(
{
url
:
url
,
dataType
:
'
html
'
,
})
.
done
(
function
(
data
)
{
panel
.
find
(
'
.panel-body
'
).
html
(
data
);
})
.
fail
(
function
()
{
panel
.
addClass
(
'
panel-error
'
);
})
.
always
(
function
()
{
panel
.
removeClass
(
'
panel-loading
'
);
panel
.
find
(
'
.panel-heading .icon-refresh,.panel-heading .icon-repeat
'
).
removeClass
(
'
icon-spin
'
);
});
}
Dashboard
.
prototype
.
init
=
function
()
Dashboard
.
prototype
.
init
=
function
()
{
{
this
.
handlePanelHeight
();
this
.
handlePanelHeight
();
this
.
handlePanelPadding
();
this
.
handlePanelPadding
();
this
.
handleRemoveEvent
();
this
.
handleRemoveEvent
();
this
.
handleRefreshEvent
();
if
(
this
.
draggable
)
this
.
handleDraggable
();
if
(
this
.
draggable
)
this
.
handleDraggable
();
...
@@ -1968,6 +2005,8 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
...
@@ -1968,6 +2005,8 @@ if (typeof jQuery === "undefined") { throw new Error("ZUI requires jQuery") }
{
{
$this
.
attr
(
'
data-id
'
,
orderSeed
);
$this
.
attr
(
'
data-id
'
,
orderSeed
);
}
}
refreshPanel
(
$this
);
});
});
}
}
...
...
src/less/views/dashboard.less
浏览文件 @
3c61efd2
...
@@ -88,7 +88,7 @@
...
@@ -88,7 +88,7 @@
.panel
.panel
{
{
box-shadow: 0 1px
10px rgba(0, 0, 0, 0.
5);
box-shadow: 0 1px
5px rgba(0, 0, 0, 0.1
5);
}
}
.panel-body
.panel-body
...
@@ -136,12 +136,12 @@
...
@@ -136,12 +136,12 @@
{
{
position: absolute;
position: absolute;
border: 2px solid rgba(255,255,255,0.9);
border: 2px solid rgba(255,255,255,0.9);
box-shadow:
2px 0 25px rgba(0,0,0,0.8
)!important;
box-shadow:
1px 2px 15px rgba(0,0,0,0.5
)!important;
background: rgba(255,255,255,0.5);
background: rgba(255,255,255,0.5);
> * {.opacity(0.7);}
> * {.opacity(0.7);}
}
}
.dragging-in:before {box-sizing: content-box; content:' '; display: block; position: absolute; left: -2px; top: -10px; width: 2px; height: 100%; background-color: rgba(
255,255,255, 0.5); border: 1px solid #fff
;}
.dragging-in:before {box-sizing: content-box; content:' '; display: block; position: absolute; left: -2px; top: -10px; width: 2px; height: 100%; background-color: rgba(
0,0,0, 0.15); border: 1px solid #eee
;}
.dragging-in.dragging-col:before {display: none;}
.dragging-in.dragging-col:before {display: none;}
}
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录