orga0063
/
BootstrapAdmin11
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

修改BUG：重构Header布局使用flex

This commit is contained in:
Argo-MacBookPro 2018-08-09 22:36:07 +08:00
parent 871e3f8381
commit ac7997960d
6 changed files with 327 additions and 449 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

210
Bootstrap.Admin/Views/Shared/Header.cshtml
View File

@ -1,114 +1,108 @@
@model Bootstrap.Admin.Models.HeaderBarModel
<header class="header">
<div class="bg">
</div>
<a id="navbar" href="#" class="sidebar-toggle-box">
<i class="fa fa-bars"></i>
<span id="websiteTitle">@Model.Title</span>
</a>
@if (User.IsInRole("Administrators"))
{
<ul class="notify-row">
<!-- tasks start -->
<li class="dropdown">
<a data-toggle="dropdown" href="#">
<i class="fa fa-tasks"></i>
<span id="msgHeaderTaskBadge" class="badge badge-pill bg-success"></span>
</a>
<ul class="dropdown-menu tasks-bar">
<li class="notify-arrow notify-arrow-green"></li>
<li id="msgHeaderTaskContent">
<p>您有 <span id="msgHeaderTask">0</span> 个未完成的任务</p>
</li>
<li>
<a href="~/Admin/Tasks">查看所有任务</a>
</li>
</ul>
</li>
<!-- tasks end -->
<!-- message dropdown start-->
<li class="dropdown">
<a data-toggle="dropdown" href="#">
<i class="fa fa-envelope"></i>
<span id="msgHeaderMsgBadge" class="badge badge-pill bg-important"></span>
</a>
<ul class="dropdown-menu inbox">
<li class="notify-arrow notify-arrow-red"></li>
<li id="msgHeaderMsgContent">
<p>您有 <span id="msgHeaderMsg">0</span> 个未读的消息</p>
</li>
<li>
<a href="~/Admin/Messages">查看所有消息</a>
</li>
</ul>
</li>
<!-- message dropdown end -->
<!-- users dropdown start-->
<li class="dropdown">
<a data-toggle="dropdown" href="#">
<i class="fa fa-user-plus"></i>
<span id="msgHeaderUserBadge" class="badge badge-pill bg-user"></span>
</a>
<ul class="dropdown-menu users">
<li class="notify-arrow notify-arrow-user"></li>
<li id="msgHeaderUserContent">
<p>您有 <span id="msgHeaderUser">0</span> 条新用户通知</p>
</li>
<li>
<a href="~/Admin/Notifications">查看所有通知</a>
</li>
</ul>
</li>
<!-- users dropdown end -->
<!-- apps dropdown start-->
<li class="dropdown">
<a data-toggle="dropdown" href="#">
<i class="fa fa-bug"></i>
<span id="msgHeaderAppBadge" class="badge badge-pill bg-warning"></span>
</a>
<ul class="dropdown-menu notification">
<li class="notify-arrow notify-arrow-yellow"></li>
<li id="msgHeaderAppContent">
<p>您有 <span id="msgHeaderApp">0</span> 条程序异常通知</p>
</li>
<li>
<a href="~/Admin/Exceptions">查看所有异常</a>
</li>
</ul>
</li>
<!-- apps dropdown end -->
<!-- db dropdown start-->
<li class="dropdown">
<a data-toggle="dropdown" href="#">
<i class="fa fa-database"></i>
<span id="msgHeaderDbBadge" class="badge badge-pill bg-db"></span>
</a>
<ul class="dropdown-menu dbs">
<li class="notify-arrow notify-arrow-db"></li>
<li id="msgHeaderDbContent">
<p>您有 <span id="msgHeaderDb">0</span> 条数据库异常通知</p>
</li>
<li>
<a href="~/Admin/Exceptions">查看所有异常</a>
</li>
</ul>
</li>
<!-- db dropdown end -->
</ul>
}
<div class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
<img id="headerIcon" alt="" src="@Url.Content(Model.Icon)">
<span id="userDisplayName" data-userName="@Model.UserName" class="username">@Model.DisplayName</span>
<b class="caret"></b>
<div class="bg"></div>
<div class="d-flex align-items-center">
<a id="navbar" href="#" class="sidebar-toggle-box">
<i class="fa fa-bars"></i>
<span id="websiteTitle">@Model.Title</span>
</a>
<ul class="dropdown-menu dropdown-menu-right">
<li></li>
<li><a href="~/Admin/Profiles"><i class=" fa fa-suitcase"></i>个人中心</a></li>
<li><a href="~/Admin/Index"><i class="fa fa-cog"></i>设置</a></li>
<li><a href="~/Admin/Notifications"><i class="fa fa-bell"></i>通知<span id="logoutNoti" class="badge badge-pill"></span></a></li>
<li><a href="~/Account/Logout"><i class="fa fa-key"></i>注销</a></li>
</ul>
@if (User.IsInRole("Administrators"))
{
<div class="nav">
<!-- tasks start -->
<div class="dropdown">
<a data-toggle="dropdown" class="shadow-primary" href="#">
<i class="fa fa-tasks"></i>
<span id="msgHeaderTaskBadge" class="badge badge-pill badge-primary"></span>
</a>
<div class="dropdown-menu">
<div class="dropdown-arrow arrow-primary"></div>
<div id="msgHeaderTaskContent" class="dropdown-header bg-primary">您有 <span id="msgHeaderTask">0</span> 个未完成的任务</div>
<div class="dropdown-footer">
<a href="~/Admin/Tasks">查看所有任务</a>
</div>
</div>
</div>
<!-- tasks end -->
<!-- message dropdown start-->
<div class="dropdown">
<a data-toggle="dropdown" class="shadow-info" href="#">
<i class="fa fa-envelope"></i>
<span id="msgHeaderMsgBadge" class="badge badge-pill badge-info"></span>
</a>
<div class="dropdown-menu">
<div class="dropdown-arrow arrow-info"></div>
<div id="msgHeaderMsgContent" class="dropdown-header bg-info">您有 <span id="msgHeaderMsg">0</span> 个未读的消息</div>
<div class="dropdown-footer">
<a href="~/Admin/Messages">查看所有消息</a>
</div>
</div>
</div>
<!-- message dropdown end -->
<!-- users dropdown start-->
<div class="dropdown">
<a data-toggle="dropdown" class="shadow-success" href="#">
<i class="fa fa-user-plus"></i>
<span id="msgHeaderUserBadge" class="badge badge-pill badge-success"></span>
</a>
<div class="dropdown-menu">
<div class="dropdown-arrow arrow-success"></div>
<div id="msgHeaderUserContent" class="dropdown-header bg-success">您有 <span id="msgHeaderUser">0</span> 条新用户通知</div>
<div class="dropdown-footer">
<a href="~/Admin/Notifications">查看所有通知</a>
</div>
</div>
</div>
<!-- users dropdown end -->
<!-- apps dropdown start-->
<div class="dropdown">
<a data-toggle="dropdown" class="shadow-warning" href="#">
<i class="fa fa-bug"></i>
<span id="msgHeaderAppBadge" class="badge badge-pill badge-warning"></span>
</a>
<div class="dropdown-menu">
<div class="dropdown-arrow arrow-warning"></div>
<div id="msgHeaderAppContent" class="dropdown-header bg-warning">您有 <span id="msgHeaderApp">0</span> 条程序异常通知</div>
<div class="dropdown-footer">
<a href="~/Admin/Exceptions">查看所有异常</a>
</div>
</div>
</div>
<!-- apps dropdown end -->
<!-- db dropdown start-->
<div class="dropdown">
<a data-toggle="dropdown" class="shadow-danger" href="#">
<i class="fa fa-database"></i>
<span id="msgHeaderDbBadge" class="badge badge-pill badge-danger"></span>
</a>
<div class="dropdown-menu">
<div class="dropdown-arrow arrow-danger"></div>
<div id="msgHeaderDbContent" class="dropdown-header bg-danger">您有 <span id="msgHeaderDb">0</span> 条数据库异常通知</div>
<div class="dropdown-footer">
<a href="~/Admin/Exceptions">查看所有异常</a>
</div>
</div>
</div>
<!-- db dropdown end -->
</div>
}
<div class="dropdown userinfo">
<a data-toggle="dropdown" class="dropdown-toggle shadow-default" href="#">
<img id="headerIcon" alt="" src="@Url.Content(Model.Icon)">
<span id="userDisplayName" data-userName="@Model.UserName" class="username">@Model.DisplayName</span>
<b class="caret"></b>
</a>
<div class="dropdown-menu dropdown-menu-right">
<div class="dropdown-item">
<a href="~/Admin/Profiles"><i class=" fa fa-suitcase"></i>个人中心</a>
<a href="~/Admin/Index"><i class="fa fa-cog"></i>设置</a>
<a href="~/Admin/Notifications"><i class="fa fa-bell"></i>通知<span id="logoutNoti" class="badge badge-pill badge-success"></span></a>
</div>
<div class="dropdown-item">
<a href="~/Account/Logout"><i class="fa fa-key"></i>注销</a>
</div>
</div>
</div>
</div>
<nav aria-label="breadcrumb">
<ol class="breadcrumb">

2
Bootstrap.Admin/wwwroot/css/nprogress.css
View File

@ -32,7 +32,7 @@
display: block;
position: fixed;
z-index: 1031;
top: 22px;
top: 20px;
right: 17px;
}

19
Bootstrap.Admin/wwwroot/css/site-responsive.css
View File

@ -1,6 +1,6 @@
@media (min-width: 568px) {
.notify-row {
display: inline-block;
.sidebar-toggle-box span {
display: inline;
}
.cache-item :nth-child(2) {
@ -15,22 +15,25 @@
}
}
@media (min-width: 736px) {
.sidebar-toggle-box span {
display: inline;
}
}
@media (min-width: 768px) {
html, body {
height: 100%;
overflow: hidden;
}
.sidebar-toggle-box {
flex: 0 1 auto;
}
.header {
border-bottom: none;
}
.header .nav {
display: flex;
flex: 1 1 auto;
}
.header, .site-footer {
position: fixed;
z-index: 10;

458
Bootstrap.Admin/wwwroot/css/site.css
View File

@ -19,19 +19,26 @@ a, a:hover, a:focus {
outline: none;
}
.dropdown-menu {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176);
padding: 0;
.dropdown-menu a {
transition: all .25s linear;
padding: 6px 20px;
display: block;
}
.dropdown-menu a {
transition: all .25s linear;
padding: 6px 20px;
display: block;
}
.dropdown-menu .divider {
margin: 1px 0;
}
.dropdown-menu .divider {
margin: 1px 0;
/*Title*/
.sidebar-toggle-box {
font-size: 1.25rem;
color: #333;
flex: 1 1 auto;
padding: 12px 0;
}
.sidebar-toggle-box span {
display: none;
}
.header {
@ -50,113 +57,137 @@ a, a:hover, a:focus {
margin: 0 -15px;
}
.header > .dropdown {
margin-top: 7px;
float: right;
.header .nav {
display: none;
margin-left: 15px;
}
.header > .dropdown > a {
border: 1px solid #eee;
border-radius: 4px;
padding: 6px;
background: none;
margin-right: 0;
display: block;
white-space: nowrap;
color: #777;
.header .nav .dropdown {
margin-right: 6px;
}
.header > .dropdown > a:hover, .header > .dropdown.show > a, .notify-row > li > a:hover {
border: 1px solid #337ab7;
color: #333;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}
.header [data-toggle="dropdown"] {
border: 1px solid #eee;
border-radius: 4px;
padding: 6px 12px;
color: #777;
}
.header > .dropdown > a span {
display: inline-block;
min-width: 18px;
}
.header > .dropdown > a img {
height: 29px;
width: 29px;
}
.header > .dropdown .dropdown-menu {
width: 268px;
margin-top: 10px;
.header [data-toggle="dropdown"]:hover {
color: #333;
}
.header > .dropdown .dropdown-menu li {
text-align: center;
width: 33.3%;
float: left;
}
.header .badge {
position: absolute;
right: -6px;
top: -14px;
opacity: 0.8;
}
.header > .dropdown .dropdown-menu li:first-child {
border-color: transparent transparent #e8e8e8;
border-bottom-color: #e8e8e8;
border-top-color: #e8e8e8;
border-style: solid;
border-width: 0 7px 7px;
position: absolute;
right: 20px;
top: -8px;
width: 0;
}
.header .dropdown-item.active, .header .dropdown-item:active {
color: #fff;
text-decoration: none;
background-color: transparent;
}
.header > .dropdown .dropdown-menu li:last-child {
width: 100%;
}
.header > .dropdown .dropdown-menu li:last-child a {
color: #ca3a39;
border-radius: 0 0 0.15rem 0.15rem;
background: #a9d96c;
background-image: linear-gradient(to bottom, #a9d96c 0%, #799e51 100%);
}
.header > .dropdown .dropdown-menu li:last-child a:hover {
color: #d20100;
background: #6d9046;
background-image: linear-gradient(to bottom, #a9d96c 0%, #6d9046 100%);
}
.header > .dropdown .dropdown-menu li a {
color: #777;
padding: 15px 10px;
display: block;
}
.header > .dropdown .dropdown-menu li a:hover {
color: #333;
}
.header > .dropdown .dropdown-menu li a i {
font-size: 1.7rem;
display: block;
margin-bottom: 4px;
}
.header > .dropdown .dropdown-menu li a .badge {
position: absolute;
right: 20px;
top: 4px;
background: #5cb85c;
}
/*Title*/
.sidebar-toggle-box {
font-size: 1.25rem;
color: #333;
float: left;
margin-top: 15px;
.nav .dropdown-menu {
width: 235px;
border: none;
margin-left: -74px;
margin-top: 12px;
}
.sidebar-toggle-box span, .notify-row {
display: none;
.nav .dropdown-arrow {
border-style: solid;
border-width: 0 9px 9px;
position: absolute;
left: 85px;
top: -9px;
}
.nav .dropdown-header {
color: #fff;
padding: 10px;
border-radius: 4px 4px 0 0;
}
.nav .dropdown-footer {
padding: 6px 0;
}
.nav .dropdown-item {
display: flex;
border-bottom: 1px solid #EBEBEB;
padding: 10px 12px;
font-size: 0.75rem;
}
.nav .dropdown-item:hover {
background-color: #93c9e8;
}
.nav .dropdown-item > :nth-child(2) {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
flex: 1 1 auto;
padding: 0 6px;
}
.nav .dropdown-item .small {
font-weight: bold;
}
.userinfo img {
height: 29px;
width: 29px;
}
.userinfo .dropdown-toggle {
display: block;
padding: 6px;
}
.userinfo .dropdown-item {
display: flex;
flex-wrap: wrap;
width: 270px;
padding: 0;
justify-content: space-around;
}
.userinfo .dropdown-item a {
text-align: center;
color: #777;
padding: 15px 10px;
width: 33.333%;
flex: 1 1 auto;
}
.userinfo .dropdown-item a i {
font-size: 1.7rem;
display: block;
margin-bottom: 4px;
}
.userinfo .dropdown-item:last-child {
border-radius: 0 0 4px 4px;
}
.userinfo .dropdown-item:last-child a {
color: #ca3a39;
border-radius: 0 0 0.15rem 0.15rem;
background: #a9d96c;
background-image: linear-gradient(to bottom, #a9d96c 0%, #799e51 100%);
width: 100%;
}
.userinfo .badge {
left: 234px;
right: auto;
top: 6px;
}
/*end title*/
.site-footer {
@ -187,230 +218,15 @@ a, a:hover, a:focus {
.go-top i {
color: #2A3542;
}
/*notify bar*/
.notify-row {
margin-top: 20px;
padding-left: 20px;
font-size: 1rem;
}
.notify-row .bg-success, .notify-row .dropdown-menu.tasks-bar li p {
background: #a9d86e;
}
.notify-row .bg-important, .notify-row .dropdown-menu.inbox li p {
background: #ff6c60;
}
.notify-row .bg-user, .notify-row .dropdown-menu.users li p {
background: #5cb85c;
}
.notify-row .bg-warning, .notify-row .dropdown-menu.notification li p {
background: #FCB322;
}
.notify-row .bg-db, .notify-row .dropdown-menu.dbs li p {
background: #d03633;
}
.notify-row > li {
float: left;
position: relative;
display: block;
}
.notify-row > li > a {
color: #666666;
border-radius: 4px;
-webkit-border-radius: 4px;
border: 1px solid #f0f0f8;
padding: 2px 6px;
margin-right: 15px;
}
.notify-row .badge {
position: absolute;
top: -14px;
left: 24px;
z-index: 1;
opacity: 0.8;
}
.notify-row .dropdown-menu {
width: 235px;
border: none;
margin-left: -74px;
margin-top: 12px;
}
.notify-row .dropdown-menu .notify-arrow {
border-style: solid;
border-width: 0 9px 9px;
height: 0;
margin-top: 0;
opacity: 0;
position: absolute;
left: 80px;
top: -18px;
transition: all 0.25s ease 0s;
width: 0;
z-index: 10;
margin-top: 10px;
opacity: 1;
}
.notify-row .dropdown-menu .notify-arrow.notify-arrow-green {
border-color: transparent transparent #a9d86e;
border-bottom-color: #a9d86e;
border-top-color: #a9d86e;
}
.notify-row .dropdown-menu .notify-arrow.notify-arrow-yellow {
border-color: transparent transparent #FCB322;
border-bottom-color: #FCB322;
border-top-color: #FCB322;
}
.notify-row .dropdown-menu .notify-arrow.notify-arrow-red {
border-color: transparent transparent #ff6c60;
border-bottom-color: #ff6c60;
border-top-color: #ff6c60;
}
.notify-row .dropdown-menu .notify-arrow.notify-arrow-db {
border-color: transparent transparent #d03633;
border-bottom-color: #d03633;
border-top-color: #d03633;
}
.notify-row .dropdown-menu .notify-arrow.notify-arrow-user {
border-color: transparent transparent #5cb85c;
border-bottom-color: #5cb85c;
border-top-color: #5cb85c;
}
.notify-row .dropdown-menu li:last-child a {
border-bottom: 0;
padding-left: 12px;
font-size: 0.875rem;
}
.notify-row .dropdown-menu li a {
border-bottom: 1px solid #EBEBEB;
list-style: none;
padding: 12px 6px;
display: block;
font-size: 0.75rem;
}
.notify-row .dropdown-menu li:not(:last-child) a:hover {
color: #fff;
background-color: #4b9fd0;
}
.notify-row .dropdown-menu p {
color: #fff;
margin: 0;
padding: 10px;
border-radius: 4px 4px 0 0;
}
.notify-row .dropdown-menu .content {
position: absolute;
left: 36px;
right: 44px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: inline-block;
}
.notify-row .dropdown-menu .label {
width: 20px;
padding: 5px;
}
.notify-row .dropdown-menu .small {
font-style: italic;
font-weight: bold;
float: right;
font-size: 0.75rem;
padding-right: 5px;
}
.notify-row .dropdown-menu.tasks-bar .desc {
font-size: 1.3rem;
font-weight: normal;
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.notify-row .dropdown-menu.tasks-bar .percent {
display: inline-block;
float: right;
font-size: 1.3rem;
font-weight: 600;
}
.notify-row .dropdown-menu.tasks-bar .progress {
margin-top: 4px;
height: 10px;
margin-right: 34px;
margin-bottom: 0;
}
.notify-row .dropdown-menu.inbox .photo img {
border-radius: 2px 2px 2px 2px;
float: left;
height: 42px;
margin-right: 4px;
width: 42px;
border: solid 1px #EBEBEB;
border-radius: 3px;
}
.notify-row .dropdown-menu.inbox .subject {
display: block;
}
.notify-row .dropdown-menu.inbox .subject .from {
font-weight: 600;
}
.notify-row .dropdown-menu.inbox .subject .time {
font-size: 1.1rem;
font-style: italic;
font-weight: bold;
float: right;
}
.notify-row .dropdown-menu.inbox .message {
font-size: 1.1rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: absolute;
right: 6px;
left: 56px;
margin-top: 2px;
}
/*end*/
.breadcrumb {
position: absolute;
top: 60px;
left: 15px;
right: 15px;
border: solid 1px #ddd;
border-width: 1px 0 0 0;
background-color: transparent;
border-top-left-radius: 0;
border-top-right-radius: 0;
padding: 7.5px 10px;
padding: 8px 10px;
}
.breadcrumb i {

62
Bootstrap.Admin/wwwroot/css/theme.css
View File

@ -136,3 +136,65 @@ input.pending {
.close:focus {
outline: none;
}
.dropdown-menu {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176);
padding: 0;
}
.arrow-primary {
border-color: transparent transparent #007bff;
}
.arrow-success {
border-color: transparent transparent #28a745;
}
.arrow-info {
border-color: transparent transparent #17a2b8;
}
.arrow-warning {
border-color: transparent transparent #ffc107;
}
.arrow-danger {
border-color: transparent transparent #dc3545;
}
.shadow-primary:hover {
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 123, 255, 0.5);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 123, 255, 0.5);
border-color: #007bff !important;
}
.shadow-success:hover {
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(40, 167, 69, 0.5);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(40, 167, 69, 0.5);
border-color: #28a745 !important;
}
.shadow-info:hover {
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(23, 162, 184, 0.5);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(23, 162, 184, 0.5);
border-color: #17a2b8 !important;
}
.shadow-warning:hover {
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 193, 7, 0.5);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 193, 7, 0.5);
border-color: #ffc107 !important;
}
.shadow-danger:hover {
border: 1px solid #dc3545 !important;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(220, 53, 69, 0.5);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(220, 53, 69, 0.5);
}
.show .shadow-default, .shadow-default:hover {
border: 1px solid #337ab7 !important;
color: #333;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

25
Bootstrap.Admin/wwwroot/js/common-scripts.js
View File

@ -49,8 +49,8 @@
});
$.extend({
pullNotification: function () {
if ($('.notify-row').length == 0) return;
pullNotification: function (nav) {
if (nav.length == 0) return;
var uri = "ws://" + window.location.host + $.formatUrl("WS");
var socket = new WebSocket(uri);
@ -68,23 +68,26 @@
break;
}
};
if (result.length > 0) $.reloadWidget();
if (result.length > 0) nav.reloadWidget();
};
},
}
});
$.fn.extend({
reloadWidget: function () {
if ($('.notify-row').length == 0) return;
if (this.length === 0) return this;
var that = this;
$.bc({
url: Notifications.url,
swal: false,
method: 'GET',
callback: function (result) {
$('#logoutNoti').text(result.NewUsersCount);
$('.notify-row').resetWidget();
that.resetWidget();
// tasks
// new users
$('#msgHeaderTask').text(result.TasksCount);
$('#msgHeaderTaskBadge').text(result.TasksCount);
var htmlUserTemplate = '<li><a href="../Admin/Tasks?id={3}"><span class="desc">{0}-{2}</span><span class="percent">{1}%</span></span><div class="progress progress-striped"><div class="progress-bar" role="progressbar" aria-valuenow="{1}" aria-valuemin="0" aria-valuemax="100" style="width: {1}%"><span class="sr-only">{1}% 完成</span></div></div></a></li>';
var htmlUserTemplate = '<a class="dropdown-item" href="../Admin/Tasks?id={3}"><span class="desc">{0}-{2}</span><span class="percent">{1}%</span></span><div class="progress progress-striped"><div class="progress-bar" role="progressbar" aria-valuenow="{1}" aria-valuemin="0" aria-valuemax="100" style="width: {1}%"><span class="sr-only">{1}% 完成</span></div></div></a>';
var html = result.Tasks.map(function (u) {
return $.format(htmlUserTemplate, u.TaskName, u.TaskProgress, u.AssignDisplayName, u.Id);
}).join('');
@ -102,7 +105,7 @@
// apps
$('#msgHeaderApp').text(result.AppExceptionsCount);
$('#msgHeaderAppBadge').text(result.AppExceptionsCount);
htmlUserTemplate = '<li><a href="../Admin/Exceptions"><span class="label label-warning"><i class="fa fa-bug"></i></span><div title="{1}" class="content">{0}</div><span class="small italic">{2}</span></a></li>';
htmlUserTemplate = '<a class="dropdown-item" href="../Admin/Exceptions"><span class="label label-warning"><i class="fa fa-bug"></i></span><div title="{1}" class="content">{0}</div><span class="small italic">{2}</span></a>';
html = result.Apps.map(function (u) {
return $.format(htmlUserTemplate, u.ExceptionType, u.Message, u.Period);
}).join('');
@ -111,7 +114,7 @@
// dbs
$('#msgHeaderDb').text(result.DbExceptionsCount);
$('#msgHeaderDbBadge').text(result.DbExceptionsCount);
htmlUserTemplate = '<li><a href="../Admin/Exceptions"><span class="label label-danger"><i class="fa fa-bolt"></i></span><div title="{1}" class="content">{0}</div><span class="small italic">{2}</span></a></li>';
htmlUserTemplate = '<a class="dropdown-item" href="../Admin/Exceptions"><span class="label label-danger"><i class="fa fa-bolt"></i></span><div title="{1}" class="content">{0}</div><span class="small italic">{2}</span></a>';
html = result.Dbs.map(function (u) {
return $.format(htmlUserTemplate, u.ErrorPage, u.Message, u.Period);
}).join('');
@ -127,6 +130,7 @@
$(html).insertAfter($('#msgHeaderMsgContent'));
}
});
return this;
}
});
})(jQuery);
@ -200,6 +204,5 @@ $(function () {
$('[data-toggle="dropdown"].dropdown-select').dropdown('select');
// load widget data
$.reloadWidget();
$.pullNotification();
$.pullNotification($('.header .nav').reloadWidget());
});