@ -0,0 +1,76 @@ |
||||
body { |
||||
margin: 0; |
||||
padding: 0; |
||||
background: #eee !important; |
||||
} |
||||
|
||||
a:link,a:visited,a:active{text-decoration: none; color:#409EFF;} |
||||
|
||||
.ms-container { |
||||
margin: 12px; |
||||
height: 100%; |
||||
padding: 14px 14px 0 14px; |
||||
background: #fff; |
||||
} |
||||
|
||||
.ms-header { |
||||
padding: 10px; |
||||
margin: 0; |
||||
border-bottom: 1px solid #ddd; |
||||
background: #fff; |
||||
height: 50px |
||||
} |
||||
|
||||
.ms-pagination { |
||||
padding: 20px 0; |
||||
text-align: right; |
||||
} |
||||
|
||||
.ms-fr { |
||||
float: right; |
||||
} |
||||
|
||||
.ms-tr { |
||||
text-align: right; |
||||
} |
||||
|
||||
.el-button+.el-button { |
||||
margin-left: 0 |
||||
} |
||||
|
||||
.ms-select{ |
||||
display: block; |
||||
} |
||||
|
||||
.ms-datetimerange{ |
||||
width: 100% !important; |
||||
} |
||||
#index .ms-search{ |
||||
background: #fff; |
||||
} |
||||
#index .ms-search .ms-search-footer{ |
||||
line-height: 60px; |
||||
text-align: center; |
||||
} |
||||
#index .ms-table-pagination { |
||||
height: calc(100% - 75px); |
||||
} |
||||
#myPageTop { |
||||
width: 252px; |
||||
} |
||||
#myPageTop input { |
||||
width: 242px; |
||||
} |
||||
#form .iconfont { |
||||
font-size: 12px; |
||||
margin-right: 5px; |
||||
} |
||||
#form .ms-container{ |
||||
height:calc(100vh - 74px); |
||||
} |
||||
#index .ms-container{ |
||||
height: calc(100vh - 74px); |
||||
} |
||||
[v-cloak]{ |
||||
display: none; |
||||
} |
||||
@ -0,0 +1,513 @@ |
||||
/* |
||||
*这里的值严格按照UI设计图标注值来进行设置 |
||||
*/ |
||||
/* |
||||
*颜色 |
||||
*/ |
||||
/* |
||||
*页面的边距 |
||||
*/ |
||||
/* |
||||
*字体 |
||||
*/ |
||||
/* |
||||
*头像 |
||||
*/ |
||||
/* |
||||
* 按钮 |
||||
*/ |
||||
/* |
||||
*对常见的多行样式进行了方法封装,方便调用,加快开发效率 |
||||
*/ |
||||
html, |
||||
body { |
||||
min-height: 100vh; |
||||
width: 100vw; |
||||
background-color: #eee; |
||||
margin: 0; |
||||
display: flex; |
||||
font-weight: initial !important; |
||||
font-size: 14px !important; |
||||
color: #333 !important; |
||||
} |
||||
html *, |
||||
body * { |
||||
text-decoration: none !important; |
||||
font-family: Verdana, Arial, Helvetica, sans-serif; |
||||
box-sizing: border-box; |
||||
} |
||||
.ms-ellipsis { |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
white-space: nowrap; |
||||
display: block; |
||||
} |
||||
.ms-align-center { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
input::-webkit-input-placeholder, |
||||
textarea::-webkit-input-placeholder { |
||||
font-weight: initial; |
||||
font-size: 12px; |
||||
color: #999; |
||||
resize: none; |
||||
} |
||||
*::-webkit-scrollbar { |
||||
width: 8px; |
||||
height: 8px; |
||||
} |
||||
/*定义滚动条轨道 内阴影+圆角*/ |
||||
*::-webkit-scrollbar-track { |
||||
border-radius: 10px; |
||||
/*滚动条的背景区域的圆角*/ |
||||
background-color: #eee; |
||||
/*滚动条的背景颜色*/ |
||||
} |
||||
/*定义滑块 内阴影+圆角*/ |
||||
*::-webkit-scrollbar-thumb { |
||||
border-radius: 10px; |
||||
/*滚动条的圆角*/ |
||||
background-color: #e6e6e6; |
||||
/*滚动条的背景颜色*/ |
||||
} |
||||
.ms-container { |
||||
margin: 12px; |
||||
height: calc(100% - 24px); |
||||
padding: 14px; |
||||
background: #fff; |
||||
} |
||||
.ms-header { |
||||
padding: 10px; |
||||
margin: 0; |
||||
border-bottom: 1px solid #ddd; |
||||
background: #fff; |
||||
height: 50px; |
||||
} |
||||
.ms-header button { |
||||
height: 30px; |
||||
} |
||||
.ms-pagination { |
||||
padding: 20px 0; |
||||
text-align: right; |
||||
} |
||||
.ms-fr { |
||||
float: right; |
||||
} |
||||
.ms-tr { |
||||
text-align: right; |
||||
} |
||||
.ms-weixin-content { |
||||
width: calc(100% - 140px); |
||||
} |
||||
.ms-weixin-dialog .el-dialog__header { |
||||
height: 55px; |
||||
box-sizing: border-box; |
||||
padding: 10px 10px 25px 10px; |
||||
border-bottom: 1px solid #e6e6e6; |
||||
} |
||||
.ms-weixin-dialog .el-dialog__header .el-dialog__title { |
||||
font-weight: bold; |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.ms-weixin-dialog .el-dialog__footer { |
||||
border-top: 1px solid #e6e6e6; |
||||
padding: 15px !important; |
||||
} |
||||
.ms-hover { |
||||
cursor: pointer; |
||||
} |
||||
.ms-hover:hover { |
||||
color: #0099ff; |
||||
background: #fff; |
||||
border-color: #0099ff; |
||||
} |
||||
.ms-header-select { |
||||
font-size: 0; |
||||
} |
||||
.ms-header-select > .el-select:nth-of-type(2) { |
||||
margin: 0 10px; |
||||
} |
||||
.el-submenu .el-menu-item.is-active { |
||||
border-radius: 4px; |
||||
} |
||||
.el-card, |
||||
.el-message { |
||||
border-radius: 0 !important; |
||||
} |
||||
.sortable-ghost { |
||||
opacity: .3; |
||||
background: #ccc !important; |
||||
border-color: transparent !important; |
||||
color: transparent !important; |
||||
} |
||||
.sortable-ghost * { |
||||
background: #ccc !important; |
||||
border-color: transparent !important; |
||||
color: transparent !important; |
||||
} |
||||
.index { |
||||
width: 100%; |
||||
display: flex; |
||||
} |
||||
.ms-admin-header { |
||||
display: flex; |
||||
padding: 0; |
||||
background-color: #0099ff; |
||||
height: 50px !important; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu { |
||||
background-color: #0099ff; |
||||
border-bottom: none; |
||||
position: relative; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item > *, |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item { |
||||
height: 50px !important; |
||||
line-height: 50px !important; |
||||
background-color: #0099ff !important; |
||||
color: rgba(255, 255, 255, 0.65) !important; |
||||
border-bottom: none !important; |
||||
font-size: 1em; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item > *:hover, |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item:hover { |
||||
color: #fff !important; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item > *.is-active, |
||||
.ms-admin-header .ms-admin-header-menu > .ms-admin-menu-item.is-active { |
||||
color: #fff !important; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu .ms-admin-shortcut-menu { |
||||
padding: 0; |
||||
user-select: none; |
||||
outline: none; |
||||
width: 100%; |
||||
min-width: 500px; |
||||
min-height: 200px; |
||||
background-color: #fff !important; |
||||
height: auto; |
||||
flex-wrap: wrap; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 0; |
||||
z-index: 9; |
||||
background: #ffffff; |
||||
border: 1px solid #e6e6e6; |
||||
box-shadow: 2px 3px 5px 0.1px rgba(0, 0, 0, 0.1); |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu .ms-admin-shortcut-menu > li { |
||||
margin: 0; |
||||
padding: 0 20px; |
||||
text-align: left; |
||||
display: -webkit-inline-box; |
||||
display: inline-block; |
||||
height: 50px; |
||||
line-height: 50px; |
||||
font-weight: normal; |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu .ms-admin-shortcut-menu > li:hover { |
||||
cursor: pointer; |
||||
color: #0099ff; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu .ms-admin-shortcut-menu i { |
||||
position: absolute; |
||||
top: 18px; |
||||
right: 19px; |
||||
font-weight: normal; |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.ms-admin-header .ms-admin-header-menu .ms-admin-shortcut-menu i:hover { |
||||
cursor: pointer; |
||||
} |
||||
.ms-admin-logo { |
||||
min-width: 200px; |
||||
width: 200px; |
||||
display: flex; |
||||
align-items: center; |
||||
overflow: hidden; |
||||
} |
||||
.ms-admin-logo > img { |
||||
padding: 20px 0 20px 20px; |
||||
width: 80px; |
||||
} |
||||
.ms-admin-logo > div { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.ms-admin-logo > div img { |
||||
margin-top: -10px; |
||||
margin-left: 3px; |
||||
} |
||||
.ms-admin-logo > div span { |
||||
margin-top: -7px; |
||||
position: absolute; |
||||
margin-left: 6px; |
||||
font-size: 12px; |
||||
} |
||||
.ms-admin-logo .iconfont { |
||||
color: #fff; |
||||
margin-left: auto; |
||||
margin-right: 20px; |
||||
cursor: pointer; |
||||
} |
||||
.ms-admin-mstore { |
||||
margin-left: auto; |
||||
min-width: 200px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: flex-end; |
||||
padding: 0; |
||||
line-height: 1; |
||||
} |
||||
.ms-admin-mstore .ms-admin-people-head { |
||||
width: 30px !important; |
||||
height: 30px !important; |
||||
margin-right: 10px; |
||||
border-radius: 50%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
background: #fff; |
||||
color: #0099ff; |
||||
} |
||||
.ms-admin-mstore .ms-admin-mstore-icon { |
||||
min-width: 50px; |
||||
width: 50px; |
||||
height: 50px; |
||||
background-color: #0080FF; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
cursor: pointer; |
||||
} |
||||
.ms-admin-mstore .ms-admin-mstore-icon span { |
||||
border-radius: 50%; |
||||
font-weight: initial; |
||||
font-size: 12px; |
||||
color: #fff; |
||||
background: #f00; |
||||
position: absolute; |
||||
width: 1.2em; |
||||
height: 1.2em; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
top: 0.6em; |
||||
right: 0.6em; |
||||
z-index: 2; |
||||
} |
||||
.ms-admin-mstore .ms-admin-mstore-icon .iconfont { |
||||
color: #fff; |
||||
animation: rubberBand 1.4s 1s both infinite; |
||||
font-size: 1.5em; |
||||
} |
||||
.ms-admin-login { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
.ms-admin-login > span { |
||||
width: 130px; |
||||
padding: 0 15px; |
||||
height: 50px; |
||||
display: flex; |
||||
align-items: center; |
||||
cursor: pointer; |
||||
outline: none; |
||||
} |
||||
.ms-admin-login > span img { |
||||
border-radius: 50%; |
||||
width: 20px; |
||||
height: 20px; |
||||
margin-right: 8px; |
||||
} |
||||
.ms-admin-login > span span { |
||||
color: #fff; |
||||
} |
||||
.ms-admin-login .active { |
||||
background: #fff; |
||||
} |
||||
.ms-admin-login .active .ms-admin-people-head { |
||||
background: #0099ff; |
||||
color: #fff; |
||||
} |
||||
.ms-admin-login .active span { |
||||
color: #333; |
||||
} |
||||
.ms-admin-login-down { |
||||
width: 130px; |
||||
padding: 0 15px; |
||||
border: none; |
||||
margin: 0 !important; |
||||
padding: 0 !important; |
||||
border-radius: 0; |
||||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1); |
||||
} |
||||
.ms-admin-login-down > .popper__arrow { |
||||
display: none; |
||||
} |
||||
.ms-admin-menu-aside { |
||||
width: 200px !important; |
||||
height: 100%; |
||||
position: relative; |
||||
overflow: visible; |
||||
} |
||||
.ms-admin-menu-aside .ms-admin-menu { |
||||
width: 200px; |
||||
height: 100%; |
||||
position: relative; |
||||
} |
||||
.ms-admin-menu-aside .ms-admin-menu .el-menu--inline .is-active { |
||||
border-left: 2px solid #0099ff; |
||||
} |
||||
.ms-admin-menu-aside .ms-admin-menu .ms-admin-icon { |
||||
font-weight: initial; |
||||
font-size: 1.5em; |
||||
color: #999; |
||||
} |
||||
.ms-admin-menu-aside .ms-menu-expand { |
||||
transform: rotate(270deg); |
||||
position: absolute; |
||||
right: -34px; |
||||
top: 50%; |
||||
z-index: 999; |
||||
cursor: pointer; |
||||
display: flex; |
||||
flex-direction: column; |
||||
} |
||||
.ms-admin-menu-aside .ms-menu-expand i { |
||||
font-weight: initial; |
||||
font-size: 14px; |
||||
color: #333; |
||||
position: absolute; |
||||
transform: rotate(90deg); |
||||
top: 5px; |
||||
right: 43%; |
||||
} |
||||
.ms-admin-menu-aside .ms-menu-expand::before { |
||||
border-color: transparent transparent #eee; |
||||
border-style: none solid solid; |
||||
border-width: 0 30px 22px; |
||||
content: ""; |
||||
display: block; |
||||
height: 0; |
||||
left: -10px; |
||||
width: 30px; |
||||
} |
||||
.ms-admin-menu-aside .ms-menu-expand { |
||||
transition: right .3s; |
||||
} |
||||
.ms-admin-menu-aside .ms-menu-expand-active { |
||||
transform: rotate(90deg); |
||||
right: -56px; |
||||
} |
||||
.ms-admin-menu-aside .ms-admin-menu-active { |
||||
width: 60px; |
||||
height: 100%; |
||||
} |
||||
.ms-admin-menu-aside-active { |
||||
width: 60px !important; |
||||
} |
||||
.ms-admin-container { |
||||
height: calc(100vh - 60px); |
||||
} |
||||
.ms-admin-container > .ms-admin-main { |
||||
padding: 0; |
||||
background-color: #fff; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs { |
||||
height: 100%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__content { |
||||
height: 100%; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__content .el-tab-pane { |
||||
height: 100%; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__header { |
||||
background: #fafafa; |
||||
margin-bottom: 0; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__header .el-tabs__nav-scroll .el-tabs__nav { |
||||
border-left: none; |
||||
border-radius: 0; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .ms-admin-refresh { |
||||
float: right; |
||||
width: 40px; |
||||
height: 40px; |
||||
text-align: center; |
||||
border-left: 1px solid #e6e6e6; |
||||
cursor: pointer; |
||||
position: relative; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .ms-admin-refresh::before { |
||||
position: absolute; |
||||
left: 34%; |
||||
top: 50%; |
||||
transform: translateY(-50%); |
||||
color: #999; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__nav-next, |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__nav-prev { |
||||
width: 40px; |
||||
height: 40px; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__nav-next { |
||||
border-left: 1px solid #e6e6e6; |
||||
} |
||||
.ms-admin-container > .ms-admin-main .ms-admin-tabs .el-tabs__nav-prev { |
||||
border-right: 1px solid #e6e6e6; |
||||
} |
||||
.ms-admin-container > .ms-admin-main iframe { |
||||
width: 100%; |
||||
height: 100%; |
||||
border: none !important; |
||||
} |
||||
@keyframes rubberBand { |
||||
0 { |
||||
-webkit-transform: scale3d(1, 1, 1); |
||||
transform: scale3d(1, 1, 1); |
||||
} |
||||
10% { |
||||
-webkit-transform: scale3d(1.25, 0.75, 1); |
||||
transform: scale3d(1.25, 0.75, 1); |
||||
} |
||||
20% { |
||||
-webkit-transform: scale3d(0.75, 1.25, 1); |
||||
transform: scale3d(0.75, 1.25, 1); |
||||
} |
||||
30% { |
||||
-webkit-transform: scale3d(1.15, 0.85, 1); |
||||
transform: scale3d(1.15, 0.85, 1); |
||||
} |
||||
40% { |
||||
-webkit-transform: scale3d(0.95, 1.05, 1); |
||||
transform: scale3d(0.95, 1.05, 1); |
||||
} |
||||
50% { |
||||
-webkit-transform: scale3d(1.05, 0.95, 1); |
||||
transform: scale3d(1.05, 0.95, 1); |
||||
} |
||||
51% { |
||||
-webkit-transform: scale3d(1, 1, 1); |
||||
transform: scale3d(1, 1, 1); |
||||
} |
||||
} |
||||
|
||||
.el-scrollbar__wrap{overflow-x:hidden;} |
||||
.el-scrollbar { |
||||
position: static; |
||||
} |
||||
[v-cloak] { |
||||
display: none; |
||||
} |
||||
@ -0,0 +1,211 @@ |
||||
/* |
||||
*这里的值严格按照UI设计图标注值来进行设置 |
||||
*/ |
||||
/* |
||||
*颜色 |
||||
*/ |
||||
/* |
||||
*页面的边距 |
||||
*/ |
||||
/* |
||||
*字体 |
||||
*/ |
||||
/* |
||||
*头像 |
||||
*/ |
||||
/* |
||||
* 按钮 |
||||
*/ |
||||
/* |
||||
*对常见的多行样式进行了方法封装,方便调用,加快开发效率 |
||||
*/ |
||||
html, |
||||
body { |
||||
min-height: 100vh; |
||||
width: 100vw; |
||||
background-color: #eee; |
||||
margin: 0; |
||||
display: flex; |
||||
font-weight: initial !important; |
||||
font-size: 14px !important; |
||||
color: #333 !important; |
||||
} |
||||
html *, |
||||
body * { |
||||
text-decoration: none !important; |
||||
font-family: Verdana, Arial, Helvetica, sans-serif; |
||||
box-sizing: border-box; |
||||
} |
||||
.ms-ellipsis { |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
white-space: nowrap; |
||||
display: block; |
||||
} |
||||
.ms-align-center { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
input::-webkit-input-placeholder, |
||||
textarea::-webkit-input-placeholder { |
||||
font-weight: initial; |
||||
font-size: 12px; |
||||
color: #aaa; |
||||
resize: none; |
||||
} |
||||
*::-webkit-scrollbar { |
||||
width: 8px; |
||||
height: 8px; |
||||
} |
||||
/*定义滚动条轨道 内阴影+圆角*/ |
||||
*::-webkit-scrollbar-track { |
||||
border-radius: 10px; |
||||
/*滚动条的背景区域的圆角*/ |
||||
background-color: #eee; |
||||
/*滚动条的背景颜色*/ |
||||
} |
||||
/*定义滑块 内阴影+圆角*/ |
||||
*::-webkit-scrollbar-thumb { |
||||
border-radius: 10px; |
||||
/*滚动条的圆角*/ |
||||
background-color: #ddd; |
||||
/*滚动条的背景颜色*/ |
||||
} |
||||
.ms-container { |
||||
margin: 12px; |
||||
height: calc(100% - 24px); |
||||
padding: 14px 14px 0 14px; |
||||
background: #fff; |
||||
} |
||||
.ms-header { |
||||
padding: 10px; |
||||
margin: 0; |
||||
border-bottom: 1px solid #ddd; |
||||
background: #fff; |
||||
height: 50px; |
||||
} |
||||
.ms-pagination { |
||||
padding: 20px 0; |
||||
text-align: right; |
||||
} |
||||
.ms-fr { |
||||
float: right; |
||||
} |
||||
.ms-tr { |
||||
text-align: right; |
||||
} |
||||
.ms-weixin-content { |
||||
width: calc(100% - 140px); |
||||
} |
||||
.ms-weixin-dialog .el-dialog__header { |
||||
height: 55px; |
||||
box-sizing: border-box; |
||||
padding: 10px 10px 25px 10px; |
||||
border-bottom: 1px solid #ddd; |
||||
} |
||||
.ms-weixin-dialog .el-dialog__header .el-dialog__title { |
||||
font-weight: bold; |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.ms-weixin-dialog .el-dialog__footer { |
||||
border-top: 1px solid #ddd; |
||||
padding: 15px !important; |
||||
} |
||||
.login { |
||||
width: 100vw; |
||||
height: 100vh; |
||||
} |
||||
.login .ms-admin-login-container { |
||||
height: 100%; |
||||
background: url('../images/login-bg.jpg') center no-repeat; |
||||
background-size: cover; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp { |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
width: 680px; |
||||
height: 320px; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp > img { |
||||
flex: 1; |
||||
display: inline-block; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form { |
||||
flex: 1; |
||||
height: 320px; |
||||
background: #fff; |
||||
padding: 20px 54px; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 { |
||||
line-height: 1; |
||||
font-weight: initial; |
||||
font-size: 12px; |
||||
color: #999999; |
||||
margin: 0 0 20px 0; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form h1 span { |
||||
font-weight: initial; |
||||
font-size: 16px; |
||||
color: #0099ff; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item { |
||||
margin-bottom: 20px; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item > div { |
||||
margin-left: 0 !important; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-form-item__content, |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item .el-input, |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item input { |
||||
height: 34px !important; |
||||
line-height: 34px !important; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input__inner, |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content .el-input { |
||||
width: 110px; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content > img { |
||||
width: 66px; |
||||
height: 34px; |
||||
margin: 0 6px; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
line-height: 1; |
||||
flex-direction: column; |
||||
margin: 0; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(1) { |
||||
font-weight: initial; |
||||
font-size: 10px; |
||||
color: #999999; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-code .el-form-item__content p span:nth-of-type(2) { |
||||
font-weight: initial; |
||||
font-size: 10px; |
||||
color: #0099ff; |
||||
cursor: pointer; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-form-item__content, |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout .el-input, |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-form-item-checkout input { |
||||
height: auto !important; |
||||
line-height: 1px !important; |
||||
} |
||||
.login .ms-admin-login-container .ms-admin-login-main .ms-admin-login-warp .ms-admin-login-form .ms-admin-login-btn { |
||||
width: 100%; |
||||
height: 34px; |
||||
line-height: 5px; |
||||
} |
||||
|
After Width: | Height: | Size: 676 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 251 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 6.1 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
@ -0,0 +1,295 @@ |
||||
/** |
||||
* 上传js |
||||
* 官方插件文档:https://www.plupload.com
|
||||
* 参数方法文档:https://www.cnblogs.com/2050/p/3913184.html
|
||||
*/ |
||||
(function() { |
||||
|
||||
|
||||
|
||||
// 默认支持上传的文件类型
|
||||
var mimeTypes = { |
||||
"image": { |
||||
title: "Image files", |
||||
extensions: "jpg,JPG,jpeg,PNG,gif,png" |
||||
}, |
||||
"file": { |
||||
title: "Zip files", |
||||
extensions: "ZIP,zip,DOC,doc,docx,xls,XLS,xlsx,RAR,rar" |
||||
}, |
||||
"video": { |
||||
title: "video files", |
||||
extensions: "MP3,MP4" |
||||
}, |
||||
"all": { |
||||
title: "all files", |
||||
extensions: "jpg,JPG,jpeg,PNG,gif,png,ZIP,zip,DOC,doc,docx,xls,XLS,xlsx,RAR,rar" |
||||
} |
||||
}; |
||||
|
||||
/** |
||||
* 文件上传 |
||||
|
||||
* id: id属性 |
||||
* { |
||||
* url:"", //(可选)默认ms.base + "/file/upload.do"
|
||||
* mime_types:"image", //(可选)默认图片,支持image、file、video、all(表示包含前三种),也可以设置allowedFile参数覆盖
|
||||
* allowedFile:""//(可选)自定义上传文件后缀例如:jpg,gif
|
||||
* max_file_size:"1mb", //(可选)默认1mb,单位kb,mb,gb,tb,注意后端ms.properties文件也有配置上传大小,优先上传控件大小
|
||||
* multi_selection:false, //(可选)默认单文件
|
||||
* uploadPath:"", //(可选)默认上传upload文件夹下面(如果非upload,需要设置uploadFloderPath参数)对应的站点下面,例如uload/1/xxxxx.jpg
|
||||
* uploadFloderPath:"", //(可选)自定义上传文件夹路径,最终文件路径格式 uploadFloderPath/uploadPath/xxxxxx.jpg,注意这里的uploadPath已经没有了upload文件夹与站点id
|
||||
* diyPath:"", //(可选)自定义上传文件夹路径,可以定义盘符路径
|
||||
* isRename:true,//(可选)文件重命名,默认根据时间命名
|
||||
* fileFiltered:function //每次选择一个文件都会触发
|
||||
* filesAdded:function //每次选择好文件后都会触发
|
||||
* beforeUpload:function //上传文件之前触发,确认上传 业务的情况下有用
|
||||
* uploadProgress:function //处理进度条
|
||||
* fileUploaded:function //(必填)上传成功返回,主要会用到第三个参数的response,这个值是上传成功后返回的数据
|
||||
* } |
||||
*/ |
||||
function upload(id, cfg) {
|
||||
var uploadCfg = { |
||||
url: basePath+"/file/upload.do", |
||||
mime_types: mimeTypes["image"], |
||||
max_file_size: "1mb", |
||||
multi_selection: false, |
||||
uploadPath: "", |
||||
diyPath:"", |
||||
uploadFloderPath: "", |
||||
chunk: "", |
||||
chunks: "", |
||||
prevent_duplicates: true, |
||||
isRename: true,
|
||||
fileFiltered: function(uploader, file) {}, |
||||
filesAdded: function(uploader, files) {}, |
||||
beforeUpload: function(uploader, file) {}, |
||||
uploadProgress: function(uploader, file) {}, |
||||
fileUploaded: function(uploader, file, responseObject) {}, |
||||
|
||||
error: function(uploader, errObject) { |
||||
if (errObject.code == -600) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "文件超过" + |
||||
uploadCfg.max_file_size + "大小" } |
||||
}).show();
|
||||
} else if (errObject.code == -601) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "格式错误" } |
||||
}).show();
|
||||
} else if (errObject.code == -700) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "格式错误"} |
||||
}).show();
|
||||
} else if (errObject.code == -300) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "发生磁盘读写错误时的错误代码,例如本地上某个文件不可读"} |
||||
}).show();
|
||||
} else if (errObject.code == -602) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "文件已上传过,不能重复上传。"} |
||||
}).show();
|
||||
} else if (errObject.code == -702) { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.file.name + "文件网页上传不支持,太大的文件请通过其他途径上传。"} |
||||
}).show();
|
||||
} else { |
||||
$('.ms-notifications').offset({top:43}).notify({ |
||||
type:'warning', |
||||
message: { text:errObject.code + errObject.file.name} |
||||
}).show();
|
||||
} |
||||
}, |
||||
}; |
||||
var multipart_params = {}; // 上传表单参数
|
||||
multipart_params.maxSize = calculationMaxSize(); |
||||
multipart_params.allowedFile = uploadCfg.mime_types.extensions; |
||||
|
||||
// 判断cfg是否为json格式,不是则将默认参数传给cfg
|
||||
if (cfg != undefined && validator.isJSON(JSON.stringify(cfg))) { |
||||
|
||||
// 重新定义后台上传路径
|
||||
if (cfg.url != undefined && cfg.url != "") { |
||||
uploadCfg.url = cfg.url; |
||||
} |
||||
// 允许上传的后缀
|
||||
if (cfg.allowedFile != undefined && cfg.allowedFile != "") { |
||||
uploadCfg.mime_types =
|
||||
{ |
||||
title: "all files", |
||||
extensions: cfg.allowedFile |
||||
}; |
||||
multipart_params.allowedFile = cfg.allowedFile; |
||||
} |
||||
|
||||
//组织后台需要的参数
|
||||
if (cfg.max_file_size != undefined && cfg.max_file_size != "") { |
||||
uploadCfg.max_file_size = cfg.max_file_size; |
||||
multipart_params.maxSize = calculationMaxSize(); |
||||
} |
||||
|
||||
if (cfg.path != undefined && cfg.path != "") { |
||||
uploadCfg.uploadPath = cfg.path; |
||||
multipart_params.uploadPath = cfg.path; |
||||
} |
||||
if (cfg.diyPath != undefined && cfg.diyPath != "") { |
||||
uploadCfg.diyPath = cfg.diyPath; |
||||
multipart_params.diyPath = cfg.diyPath; |
||||
} |
||||
if (cfg.uploadFloderPath != undefined && cfg.uploadFloderPath != "") { |
||||
uploadCfg.uploadFloderPath = cfg.uploadFloderPath; |
||||
multipart_params.uploadFloderPath = cfg.uploadFloderPath; |
||||
} |
||||
if (cfg.chunk != undefined && cfg.chunk != "") { |
||||
multipart_params.chunk = cfg.chunk; |
||||
} |
||||
if (cfg.chunks != undefined && cfg.chunks != "") { |
||||
multipart_params.chunks = cfg.chunks; |
||||
} |
||||
|
||||
if (cfg.name != undefined && cfg.name != "") { |
||||
multipart_params.name = cfg.name; |
||||
} |
||||
|
||||
if (cfg.isRename != undefined) { |
||||
multipart_params.isRename = cfg.isRename; |
||||
} |
||||
|
||||
if (cfg.multi_selection != undefined ) { |
||||
uploadCfg.multi_selection = cfg.multi_selection; |
||||
} |
||||
if (cfg.prevent_duplicates != undefined) { |
||||
uploadCfg.prevent_duplicates = cfg.prevent_duplicates; |
||||
} |
||||
|
||||
|
||||
//回调事件
|
||||
if (cfg.fileUploaded != undefined && cfg.fileUploaded != "") { |
||||
uploadCfg.fileUploaded = cfg.fileUploaded; |
||||
} |
||||
if (cfg.filesAdded != undefined && cfg.filesAdded != "") { |
||||
uploadCfg.filesAdded = cfg.filesAdded; |
||||
} |
||||
if (cfg.fileFiltered != undefined && cfg.fileFiltered != "") { |
||||
uploadCfg.fileFiltered = cfg.fileFiltered; |
||||
} |
||||
if (cfg.beforeUpload != undefined && cfg.beforeUpload != "") { |
||||
uploadCfg.beforeUpload = cfg.beforeUpload; |
||||
} |
||||
if (cfg.uploadProgress != undefined && cfg.uploadProgress != "") { |
||||
uploadCfg.uploadProgress = cfg.uploadProgress; |
||||
} |
||||
if (cfg.error != undefined && cfg.error != "") { |
||||
uploadCfg.error = cfg.error; |
||||
} |
||||
|
||||
} |
||||
|
||||
// 实例化一个plupload上传对象
|
||||
var uploader = new plupload.Uploader({ |
||||
browse_button: id, // 预览按钮元素
|
||||
url: uploadCfg.url, // 上传地址
|
||||
flash_swf_url: 'js/Moxie.swf', |
||||
silverlight_xap_url: 'js/Moxie.xap', |
||||
multi_selection: uploadCfg.multi_selection, // 禁止浏览框多选
|
||||
multipart_params: multipart_params, |
||||
filters: { // 文件类型 大小设置,对不同场景的文件上传配置此参数
|
||||
mime_types: [uploadCfg.mime_types], |
||||
max_file_size: uploadCfg.max_file_size, // 最大只能上传400kb的文件
|
||||
prevent_duplicates: uploadCfg.prevent_duplicates //布尔类型
|
||||
// 不允许选取重复文件
|
||||
}, |
||||
}); |
||||
|
||||
uploader.init(); |
||||
|
||||
/** |
||||
* 选择了多少文件就会触发多少次 |
||||
*uploader为当前的plupload实例对象,file为触发此事件的文件对象 |
||||
*/ |
||||
uploader.bind('FileFiltered', function(uploader, file) { |
||||
eval(uploadCfg.fileFiltered(uploader, file)); |
||||
}); |
||||
|
||||
/** |
||||
* 当文件添加到上传队列后触发 |
||||
* uploader为当前的plupload实例对象,files为一个数组,里面的元素为本次添加到上传队列里的文件对象 |
||||
* 每一次选择文件都会触发,不管选择多个文件还是单个文件都只会触发一次 |
||||
*/ |
||||
uploader.bind('FilesAdded', function(uploader, files) { |
||||
eval(uploadCfg.filesAdded(uploader, files)); |
||||
}); |
||||
|
||||
/** |
||||
* 当队列中的某一个文件正要开始上传前触发 |
||||
* uploader为当前的plupload实例对象,file为触发此事件的文件对象 |
||||
*/ |
||||
uploader.bind('BeforeUpload', function(uploader, file) { |
||||
eval(uploadCfg.beforeUpload(uploader, file)); |
||||
}); |
||||
|
||||
/** |
||||
* 会在文件上传过程中不断触发,可以用此事件来显示上传进度 |
||||
* uploader为当前的plupload实例对象,file为触发此事件的文件对象 |
||||
*/ |
||||
uploader.bind('UploadProgress', function(uploader, file) { |
||||
eval(uploadCfg.uploadProgress(uploader, file)); |
||||
}); |
||||
|
||||
/** |
||||
* 当队列中的某一个文件上传完成后触发监听函数参数:(uploader,file,responseObject) |
||||
* uploader为当前的plupload实例对象, |
||||
* file为触发此事件的文件对象, |
||||
* responseObject为服务器返回的信息对象,它有以下3个属性: |
||||
* response:服务器返回的文本 |
||||
* responseHeaders:服务器返回的头信息 |
||||
* status:服务器返回的http状态码,比如200 |
||||
*/ |
||||
uploader.bind('FileUploaded', function(uploader, file, responseObject) { |
||||
eval(uploadCfg.fileUploaded(uploader, file, responseObject)); |
||||
}); |
||||
|
||||
/** |
||||
* 当发生错误时触发监听函数参数:(uploader,errObject) |
||||
* uploader为当前的plupload实例对象, |
||||
* errObject为错误对象,它至少包含以下3个属性(因为不同类型的错误,属性可能会不同): |
||||
* code:错误代码,具体请参考plupload上定义的表示错误代码的常量属性 |
||||
* file:与该错误相关的文件对象 |
||||
* message:错误信息 |
||||
*/ |
||||
uploader.bind('Error', function(uploader, errObject) { |
||||
eval(uploadCfg.error(uploader, errObject)); |
||||
}); |
||||
|
||||
/** |
||||
* 计算后台的上传大小,因为前端上传空间与后端的大小单位不一致 |
||||
*/ |
||||
function calculationMaxSize() { |
||||
var size = parseInt(uploadCfg.max_file_size); |
||||
|
||||
if (uploadCfg.max_file_size.indexOf("kb") > -1) { |
||||
return parseInt(size) / 1024; |
||||
} else if (uploadCfg.max_file_size.indexOf("mb") > -1) { |
||||
return size; |
||||
} else if (uploadCfg.max_file_size.indexOf("gb") > -1) { |
||||
return size * 1024; |
||||
} else if (uploadCfg.max_file_size.indexOf("tb") > -1) { |
||||
return size * 1024 * 1024; |
||||
} |
||||
} |
||||
return uploader; |
||||
|
||||
} |
||||
|
||||
if (ms == undefined) { |
||||
ms = {}; |
||||
} |
||||
|
||||
window.ms.upload = upload; |
||||
}()); |
||||
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 67 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 162 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 34 KiB |
@ -0,0 +1,292 @@ |
||||
//点击页面其他位置头部菜单收缩
|
||||
$(document).bind("click",function(e){ |
||||
var target = $(e.target); |
||||
if(target.closest(".menu-default").length == 0){ |
||||
manager.topMenu.initTop(); |
||||
} |
||||
}) |
||||
//浏览器窗口调整事件
|
||||
$(window).resize(function () {
|
||||
$(".categoryTree").height($(document).height()); |
||||
$("#listFrame").height($(document).height()); |
||||
|
||||
$('.easyui-tabs').tabs("resize",{ |
||||
width: $('.easyui-tabs').parent().width(), |
||||
fit:true, |
||||
scrollDuration:1000 |
||||
});
|
||||
})
|
||||
$(function(){ |
||||
//左侧菜单滚动条,鼠标上移显示
|
||||
$(".ms-menu,.ms-content-menu").mouseover(function () { |
||||
$(this).css("overflow-y","auto"); |
||||
}); |
||||
$(".ms-menu,.ms-content-menu").mouseleave(function () { |
||||
$(this).css("overflow-y","hidden"); |
||||
}); |
||||
|
||||
//收缩左侧菜单
|
||||
$(".slideMenu").click(function(){ |
||||
var obj = $(this); |
||||
if ($(".ms-menu").css("left") == "0px") { |
||||
//修改图标
|
||||
obj.children(".icon-open").show(); |
||||
obj.children(".icon-close").hide(); |
||||
$(".ms-menu-div").css("position","absolute"); |
||||
$(".ms-menu,.ms-menu-div").animate({left:'-180px'},100) |
||||
//改变右侧部分宽度
|
||||
$('.easyui-tabs').tabs("resize",{ |
||||
width:$('.easyui-tabs').parent().width() |
||||
}); |
||||
} else { |
||||
//修改图标
|
||||
obj.children(".icon-open").hide(); |
||||
obj.children(".icon-close").show(); |
||||
$(".ms-menu-div").css("position","relative"); |
||||
$(".ms-menu,.ms-menu-div").animate({left:'0px'},50) |
||||
|
||||
//恢复右侧部分宽度
|
||||
$('.easyui-tabs').tabs("resize",{ |
||||
width:$('.easyui-tabs').parent().width(), |
||||
fit:true, |
||||
scrollDuration:1000 |
||||
}); |
||||
} |
||||
}) |
||||
|
||||
//点击左侧菜单添加选项卡
|
||||
$(".ms-menu").delegate(".ms-menu-child a","click",function(){ |
||||
$(".easyui-tabs").show(); |
||||
$(".wellcome").hide(); |
||||
$(".ms-menu-child a").removeClass("active"); |
||||
$(this).addClass("active"); |
||||
var title=$(this).data("title"); |
||||
var content=$(this).data("url"); |
||||
var id=$(this).data("id"); |
||||
if (!$('.easyui-tabs').tabs('exists', title)) { |
||||
$('.easyui-tabs').tabs('add', { |
||||
title: title, |
||||
content: '<iframe src='+content+' frameborder="0" height="100%" width="100%" id="mainFrame'+id+'" name="mainFrame'+id+'"></iframe>', |
||||
closable: true, |
||||
tools:[{ |
||||
iconCls:'icon-mini-refresh', |
||||
title:"刷新当前选项卡", |
||||
handler:function(){ |
||||
$('#mainFrame'+id).attr('src', $('#mainFrame'+id).attr('src')); |
||||
} |
||||
}] |
||||
}); |
||||
|
||||
|
||||
} else { |
||||
$('.easyui-tabs').tabs('select', title); |
||||
} |
||||
}) |
||||
|
||||
|
||||
//用户在切换选项卡时,和导航树保持同步
|
||||
$('.easyui-tabs').tabs({ |
||||
onSelect: function(title){ |
||||
var _select = $(".easyui-tabs").tabs("getSelected"); |
||||
var obj = _select.panel("options").tab; |
||||
//循环左侧菜单里每个菜单的text进行选项卡的title进行对比
|
||||
$(".ms-menu").find("li").each(function(){ |
||||
var target = $(this); |
||||
if(target.text() == obj.text()){ |
||||
$(".ms-menu-child a").removeClass("active"); |
||||
//左侧对应菜单展开选中
|
||||
$(".ms-menu-none").hide(); |
||||
target.parent().parent().slideDown(); |
||||
target.parent().slideDown(); |
||||
target.find("a").addClass("active"); |
||||
//头部对应一级菜单进行选中
|
||||
$(".ms-menu-list").find("li").removeClass("active").each(function(){ |
||||
if(target.parent().parent().data("model-id") == $(this).data("model-id")){ |
||||
$(this).addClass("active"); |
||||
} |
||||
}) |
||||
} |
||||
}) |
||||
} |
||||
}); |
||||
|
||||
|
||||
//当关闭最后一个选项卡时,隐藏选项卡页面显示主界面
|
||||
$('.easyui-tabs').tabs({ |
||||
onClose:function(){ |
||||
if($('.easyui-tabs').tabs('tabs').length==0){ |
||||
$(".wellcome").show(); |
||||
$(".easyui-tabs").hide(); |
||||
$(".ms-menu-child a").removeClass("active"); |
||||
$(".ms-menu-list").find("li").removeClass("active") |
||||
} |
||||
|
||||
} |
||||
}) |
||||
}) |
||||
|
||||
//MStore做的计时循环特效
|
||||
window.setInterval(showMstore, 1000);
|
||||
function showMstore(){
|
||||
$(".ms-top-mstore").find(".animated").addClass("rubberBand") |
||||
}
|
||||
window.setInterval(hiddenMstore, 1500);
|
||||
function hiddenMstore(){
|
||||
$(".ms-top-mstore").find(".animated").removeClass("rubberBand") |
||||
}
|
||||
|
||||
var manager = { |
||||
/*头部菜单操作*/ |
||||
topMenu:{ |
||||
initEvent: function() { |
||||
$("*[data-ms-*]").each() |
||||
}, |
||||
/*追加头部菜单*/ |
||||
initMenu: function(json) { |
||||
$("#ms-menu-list-tmpl").tmpl(json).appendTo(".ms-menu-list"); |
||||
if($(".ms-menu-list").children().length>5){ |
||||
$(".openMenu").show(); |
||||
} |
||||
|
||||
|
||||
//将左侧菜单追加,只是隐藏了
|
||||
$("#ms-menu-tmpl").tmpl(json).appendTo(".ms-menu"); |
||||
$(".ms-menu-parent").each(function(n) { |
||||
var arr = new Array; |
||||
for (i = 0; i < json.length; i++) json[i].modelModelId == $(this).data("model-id") && arr.push(json[i]) |
||||
//alert(arr)
|
||||
$("#ms-menu-child-tmpl").tmpl(arr).appendTo($(this).find("ul:first")) |
||||
|
||||
}) |
||||
}, |
||||
|
||||
/*头部菜单点击收缩效果*/ |
||||
topMenuOpen: function(target,menuShow){ |
||||
var _height=$(".ms-menu-list").height(); |
||||
if(target.parent().hasClass(menuShow)){ |
||||
this.initTop(); |
||||
}else{ |
||||
target.parent().addClass(menuShow); |
||||
$('.'+menuShow).height(_height); |
||||
} |
||||
}, |
||||
/*初始化头部菜单*/ |
||||
initTop:function(){ |
||||
$(".menu-default").height("50px"); |
||||
$(".menu-default").removeClass("menu-show"); |
||||
}, |
||||
/*点击头部菜单展示二级菜单*/ |
||||
showChildMenu:function(target,json){ |
||||
var _json = {"modelTitle":target.text(),"modelIcon":target.data("model-icon"),"modelId":target.data("model-id")}; |
||||
var arr = new Array; |
||||
$(".ms-menu-list").find("li").removeClass("active"); |
||||
target.addClass("active"); |
||||
|
||||
//显示左侧菜单
|
||||
if ($(".ms-menu").css("display") == "none") { |
||||
$(".slideMenu").children(".icon-open").hide(); |
||||
$(".slideMenu").children(".icon-close").show(); |
||||
$(".ms-menu,.ms-menu-div").show(); |
||||
//恢复右侧部分宽度
|
||||
$('.easyui-tabs').tabs("resize",{ |
||||
width:$('.easyui-tabs').parent().width(), |
||||
fit:true, |
||||
scrollDuration:1000 |
||||
}); |
||||
} |
||||
|
||||
$(".ms-menu-parent").each(function(){ |
||||
if(target.data("model-id")==$(this).data("model-id")){ |
||||
$(this).show(); |
||||
$(".ms-menu-parent").find("ul").slideUp(); |
||||
$(this).find("ul").slideDown(); |
||||
|
||||
//默认打开当前模块的第一个菜单项
|
||||
$(".easyui-tabs").show(); |
||||
$(".wellcome").hide(); |
||||
var title=$(this).find("ul li:eq(0) a").data("title"); |
||||
var content=$(this).find("ul li:eq(0) a").data("url"); |
||||
var id = $(this).find("ul li:eq(0) a").data("id"); |
||||
if (!$('.easyui-tabs').tabs('exists', title)) { |
||||
$('.easyui-tabs').tabs('add', { |
||||
title: title, |
||||
content: '<iframe src='+content+' frameborder="0" height="100%" width="100%" id="mainFrame'+id+'" name="mainFrame'+id+'"></iframe>', |
||||
closable: true, |
||||
tools:[{ |
||||
iconCls:'icon-mini-refresh', |
||||
handler:function(){ |
||||
$('#mainFrame'+id).attr('src', $('#mainFrame'+id).attr('src')); |
||||
} |
||||
}] |
||||
});
|
||||
} else { |
||||
$('.easyui-tabs').tabs('select', title); |
||||
} |
||||
} |
||||
}) |
||||
this.initTop(); |
||||
}, |
||||
|
||||
}, |
||||
|
||||
/*左侧菜单操作*/ |
||||
leftMenu:{ |
||||
/*左侧菜单点击收缩效果*/ |
||||
leftMenuOpen:function(target,menu){ |
||||
menu.slideToggle(); |
||||
|
||||
}, |
||||
|
||||
}, |
||||
|
||||
|
||||
} |
||||
|
||||
$(function(){ |
||||
|
||||
//当头部菜单超过5个时,点击展开头部菜单
|
||||
$(".openMenu").click(function(){ |
||||
manager.topMenu.topMenuOpen($(this),"menu-show"); |
||||
}) |
||||
|
||||
//点击展开左侧菜单子菜单
|
||||
$(".ms-menu").delegate(".ms-menu-parent-title","click",function(){ |
||||
var menu = $(this).parent().siblings(".ms-menu-child"); |
||||
manager.leftMenu.leftMenuOpen($(this),menu); |
||||
}) |
||||
|
||||
//移除左侧菜单
|
||||
$(".ms-menu").delegate(".ms-menu-parent","mouseover",function(){ |
||||
$(".closeMenu").hide(); |
||||
$(this).find(".closeMenu").show(); |
||||
}) |
||||
$(document).bind("mouseover",function(e){ |
||||
var target = $(e.target); |
||||
if(target.closest(".ms-menu-parent").length == 0){ |
||||
$(".closeMenu").hide(); |
||||
} |
||||
}) |
||||
//关闭左侧菜单
|
||||
$(".ms-menu").delegate(".closeMenu","click",function(){ |
||||
$(this).parent().parent().hide(); |
||||
var menu = $(this).parent().siblings(".ms-menu-child"); |
||||
manager.leftMenu.leftMenuOpen($(this),menu); |
||||
var index=0; |
||||
$(".ms-menu-parent").each(function(){ |
||||
var target = $(this) |
||||
$(".ms-menu-list li").each(function(){ |
||||
if(target.data("model-id")==$(this).data("model-id")){ |
||||
$(this).removeClass("active"); |
||||
} |
||||
}) |
||||
|
||||
if($(this).css("display") == "none"){ |
||||
index++; |
||||
if(index == $(".ms-menu-parent").length){ |
||||
$(".ms-menu-list li").removeClass("active"); |
||||
$(".ms-menu-none").show(); |
||||
} |
||||
} |
||||
}) |
||||
}) |
||||
}) |
||||
@ -0,0 +1,333 @@ |
||||
// JavaScript Document
|
||||
(function($) { |
||||
|
||||
/** |
||||
* ajax提交表单 |
||||
*
|
||||
* @form 表单 格式:#表单id |
||||
* @config 配置扩展用,可包含参数:func,回调方法 |
||||
*/ |
||||
$.fn.postForm = function(form, config) { |
||||
var target = $(this); |
||||
if (isEmpty($(form).attr("action")) && isEmpty(config.action)) { |
||||
alert("配置错误:from表单不存在action属性"); |
||||
return; |
||||
} |
||||
var func; |
||||
var action = $(form).attr("action"); |
||||
var data_type = "json"; |
||||
if (config != undefined) { |
||||
if (config.func != undefined) { |
||||
func = config.func; |
||||
} |
||||
if (config.action != undefined) { |
||||
action = config.action; |
||||
} |
||||
} |
||||
$.ajax({ |
||||
type : "POST", |
||||
url : action, |
||||
dataType : data_type, |
||||
data : $(form).serialize(), |
||||
beforeSend : function() { |
||||
target.attr("disabled", true); |
||||
}, |
||||
success : function(data) { |
||||
if (typeof (func) == "string") { |
||||
eval(func + "(data)"); |
||||
} else if (typeof (func) == "function") { |
||||
func.call(this, data); |
||||
} |
||||
target.removeAttr("disabled"); |
||||
} |
||||
}); |
||||
} |
||||
|
||||
/** |
||||
* 发起ajax连接请求 |
||||
*
|
||||
* @config(优先) 配置扩展用,可包含参数:func,回调方法 |
||||
* config格式:{url:请求地址,data:请求参数,loadingText:加载时文字} |
||||
* 调用该方法的元素必须存在data-ajax-url参数; 参数:data-ajax-url必须 |
||||
* data-ajax-data 可选 |
||||
*/ |
||||
$.fn.request = function(config) { |
||||
var target = $(this); |
||||
if (isEmpty(target.attr("data-ajax-url")) |
||||
&& isEmpty(config.url)) { |
||||
alert(target.selector + "配置错误:data-ajax-url属性不存在"); |
||||
return; |
||||
} |
||||
var method = "POST"; |
||||
var data_type = "json"; |
||||
var func = null; |
||||
var _url = isEmpty(target.attr("data-ajax-url")) ? null |
||||
: target.attr("data-ajax-url");// 请求地址
|
||||
var _data = isEmpty(target.attr("data-ajax-data")) ? null |
||||
: target.attr("data-ajax-data");// 请求参数
|
||||
var _loadingText = isEmpty(target |
||||
.attr("data-ajax-loading-text")) ? null : target |
||||
.attr("data-ajax-loading-text");// 加载状态;
|
||||
var data_type = isEmpty(target.attr("data-ajax-type")) ? null |
||||
: target.attr("data-ajax-type");// 返回数据类型
|
||||
var text = target.text(); |
||||
if (config != undefined) { |
||||
// 请求方法
|
||||
if (config.method != undefined) { |
||||
var _method = config.method; |
||||
if (_method.toLowerCase() != "post" |
||||
|| _method.toLowerCase() != "get") { |
||||
method = _method; |
||||
} |
||||
} |
||||
// 回调方法
|
||||
if (config.func != undefined) { |
||||
func = config.func; |
||||
} |
||||
// 返回数据类型
|
||||
if (config.type != undefined) { |
||||
var _type = config.type.toLowerCase(); |
||||
if (_type == "xml" || _type == "html" |
||||
|| _type == "script" || _type == "jsonp" |
||||
|| _type == "json" || _type == "text") { |
||||
data_type = _type; |
||||
} |
||||
|
||||
} |
||||
if (config.url != undefined) { |
||||
_url = config.url; |
||||
} |
||||
if (config.data != undefined) { |
||||
_data = config.data; |
||||
} |
||||
if (config.loadingText != undefined) { |
||||
_loadingText = config.loadingText; |
||||
} |
||||
} |
||||
$.ajax({ |
||||
type : method, |
||||
url : _url, |
||||
dataType : data_type, |
||||
data : _data, |
||||
beforeSend : function() { |
||||
if (target[0].nodeName == "INPUT") { |
||||
if (!isEmpty(_loadingText)) { |
||||
target.text(_loadingText); |
||||
} |
||||
target.attr("disabled", true); |
||||
} |
||||
|
||||
}, |
||||
success : function(data) { |
||||
|
||||
if (typeof (func) == "string") { |
||||
eval(func + "(data)"); |
||||
} else if (typeof (func) == "function") { |
||||
func.call(this, data); |
||||
} |
||||
if (target[0].nodeName == "INPUT") { |
||||
target.removeAttr("disabled"); |
||||
target.text(text); |
||||
} |
||||
} |
||||
}); |
||||
}, |
||||
|
||||
$.fn.noDataMsg = function(config) { |
||||
if (config != undefined) { |
||||
|
||||
} |
||||
} |
||||
|
||||
/** |
||||
* 判断是否为空, target:判断对象 message:提示信息 true:为空 false:不为空 |
||||
*/ |
||||
function isEmpty(target, message) { |
||||
if (target == undefined || target == null || target.trim() == "" |
||||
|| target.trim().length == 0) { |
||||
if (message != undefined) { |
||||
alert(message); |
||||
} |
||||
return true; |
||||
} |
||||
return false; |
||||
} |
||||
|
||||
})(jQuery); |
||||
|
||||
var Ms = { |
||||
_target : this, |
||||
"msg" : function(str, url) { // 提示消息 Ms.msg()调用
|
||||
var obj = $("<div class='ms-msg'></div>"); |
||||
$("body").append(obj); |
||||
obj.html(str).show(); |
||||
obj.animate({ |
||||
opacity : 1, |
||||
}, 500, 'ease', function() { |
||||
$(this).animate({ |
||||
opacity : 0, |
||||
}, 800, 'ease', function() { |
||||
if (typeof (url) != "undefined") { |
||||
_target.loadUrl(url); |
||||
} |
||||
}); |
||||
}); |
||||
}, |
||||
"loadUrl" : function(url) { |
||||
location.href = url; |
||||
}, |
||||
"post" : function(url, params, func) { // 会员中心ajax请求类
|
||||
$.ajax({ |
||||
type : "POST", |
||||
url : url, |
||||
dataType : 'json', |
||||
data : params, |
||||
beforeSend : function() { |
||||
try { |
||||
_target.msg("加载中...");
|
||||
} catch (e) { |
||||
|
||||
} |
||||
}, |
||||
success : function(json) { |
||||
func(json); |
||||
}, |
||||
error : function(xhr, type) { // 服务器异常提示
|
||||
try { |
||||
_target.msg("服务器繁忙稍后重试!"); |
||||
} catch (e) { |
||||
|
||||
} |
||||
} |
||||
}); |
||||
}, |
||||
"get" : function(url, params, func) { // 会员中心ajax请求类
|
||||
$.ajax({ |
||||
type : "GET", |
||||
url : url, |
||||
dataType : 'json', |
||||
data : params, |
||||
beforeSend : function() { |
||||
try{ |
||||
_target.msg("加载中..."); |
||||
}catch(e){} |
||||
}, |
||||
|
||||
success : function(json) { |
||||
func(json); |
||||
}, |
||||
error : function(xhr, type) { // 服务器异常提示
|
||||
try{ |
||||
_target.msg("服务器繁忙稍后重试!"); |
||||
}catch(e){} |
||||
} |
||||
}); |
||||
}, |
||||
"load" : function(url, method, params, func) { // 非会员中心ajax请求类
|
||||
$.ajax({ |
||||
type : method, |
||||
url : url, |
||||
dataType : 'json', |
||||
data : params, |
||||
beforeSend : function() { |
||||
_target.msg("加载中..."); |
||||
}, |
||||
success : function(json) { |
||||
if (func != null && func != undefined) { |
||||
func(json); |
||||
} |
||||
}, |
||||
error : function(xhr, type) { // 服务器异常提示
|
||||
_target.msg("服务器繁忙稍后重试!"); |
||||
} |
||||
}); |
||||
}, |
||||
"setCookie" : function(key, value, time) { // 依赖zepto.cookie.min.js
|
||||
// time单位为天数字
|
||||
$.fn.cookie(key, value, { |
||||
path : '/', |
||||
expires : time |
||||
}); |
||||
}, |
||||
"getCookie" : function(key) { // 读取cookie
|
||||
return decodeURIComponent($.fn.cookie(key)); |
||||
}, |
||||
"delCookie" : function(key) { |
||||
$.fn.cookie(key, null); |
||||
}, |
||||
"queryString" : function(param) { |
||||
var svalue = location.search.match(new RegExp("[\?\&]" + param |
||||
+ "=([^\&]*)(\&?)", "i")); |
||||
return svalue ? svalue[1] : svalue; |
||||
}, |
||||
"initModal" : function() { // 初始化模态框
|
||||
// 弹出框处理
|
||||
if ($("*[data-toggle='modal']").size() > 0) { |
||||
$("*[data-toggle='modal']").each( |
||||
function(index) { |
||||
$("body").on( |
||||
"tap", |
||||
"[data-target=\"" + $(this).attr("data-target") |
||||
+ "\"]", |
||||
function() { |
||||
if ($(this).attr("data-target") != "") { |
||||
openModal($(this).attr("data-target"), |
||||
w, h); |
||||
} |
||||
}) |
||||
}); |
||||
} |
||||
|
||||
function openModal(modalId, w, h) { |
||||
|
||||
$(modalId).show(); |
||||
Ms.init(w, h); |
||||
|
||||
if (!$(modalId).parent().hasClass("modalMask")) { |
||||
$(modalId) |
||||
.wrap( |
||||
"<div class='modalMask' style='width:" |
||||
+ w |
||||
+ "px;height:" |
||||
+ h |
||||
+ "px;position: absolute;background:rgba(0, 0, 0, 0.6) none repeat scroll 0 0 !important;filter:Alpha(opacity=80); background:#fff;z-index: 9997;top: 0;'>"); |
||||
} else { |
||||
$(modalId).parent().show(); |
||||
} |
||||
$(modalId).find(".ms-modal-button").css("line-height", "200%"); |
||||
$(modalId).css( |
||||
"margin-left", |
||||
($(modalId).parent().width() - $(modalId).width()) / 2 |
||||
+ "px"); |
||||
$(modalId).css("margin-top", "10%"); |
||||
$(modalId).on("tap", ".close", function() { |
||||
// $(modalId).hide();
|
||||
// $(modalId).unwrap().parent();
|
||||
hideModal(modalId); |
||||
}) |
||||
} |
||||
|
||||
function hideModal(modalId) { |
||||
|
||||
$(modalId).parent().hide(); |
||||
$(modalId).hide(); |
||||
} |
||||
}, |
||||
"browser" : { |
||||
versions : function() { |
||||
var u = navigator.userAgent, app = navigator.appVersion; |
||||
return { |
||||
android4 : u.indexOf('Android 4') > -1 |
||||
&& u.indexOf('Linux') > -1, |
||||
android2 : u.indexOf('Android 2') > -1 |
||||
&& u.indexOf('Linux') > -1, |
||||
iPhone : u.indexOf('iPhone') > -1, |
||||
iPad : u.indexOf('iPad') > -1, |
||||
iPod : u.indexOf('iPod') > -1, |
||||
}; |
||||
}(), |
||||
language : (navigator.browserLanguage || navigator.language) |
||||
.toLowerCase() |
||||
} |
||||
}; |
||||
var ms = Ms; |
||||