Skip to content

Commit

Permalink
route
Browse files Browse the repository at this point in the history
  • Loading branch information
@Levan-Du
Levan-Du committed Jun 19, 2017
1 parent 208cbb4 commit c43db32
Show file tree
Hide file tree
Showing 37 changed files with 823 additions and 629 deletions.
753 changes: 456 additions & 297 deletions dist/bundle.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/index.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>avalon spa demo</title> <!--[if lt IE 9]> <script src="js/html5shiv.min.js"></script> <script src="js/respond.min.js"></script> <![endif]--></head><body> <div class="container-full clearfix" ms-controller="app"> <aside class="sidebar" ms-controller="vm_sidebar"> <header class="sidebar__header"> <ms-logininfo /> </header> <nav class="sidebar__nav"> <ms-menu ms-widget="{menus:menus,submenus:submenus,removeItem:removeTabItem}" /> </nav> </aside> <article class="main"> <header class="main__top"> <ms-topbar /> </header> <article class="main__content"> <ms-pagetab ms-widget="{items:tabItems,removeItem:removeTabItem}" /> </article> <footer class="main__footer"> <ms-statusbar /> </footer> </article> </div><script type="text/javascript" src="bundle.js"></script></body></html>
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>avalon spa demo</title> <!--[if lt IE 9]> <script src="js/html5shiv.min.js"></script> <script src="js/respond.min.js"></script> <![endif]--></head><body> <div class="container-full clearfix" ms-controller="app"> <aside class="sidebar" ms-controller="vm_sidebar"> <header class="sidebar__header"> <ms-logininfo /> </header> <nav class="sidebar__nav"> <ms-menu ms-widget="{menus:menus,submenus:submenus,removeItem:removeTabItem}" /> </nav> </aside> <article class="main"> <header class="main__top"> <ms-topbar /> </header> <article class="main__content"> <ms-router ms-widget="{path:'/',component:'<ms-pagetab ms-widget=\'{items:option,onTabTitleClick:callback}\' />'}" /> </article> <footer class="main__footer"> <ms-statusbar /> </footer> </article> </div><script type="text/javascript" src="bundle.js"></script></body></html>
Expand Down
32 changes: 11 additions & 21 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

25 changes: 12 additions & 13 deletions src/components/Menu/index.css
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,32 @@
.menu {}

.menu__item.checked {
.menu__item:hover {
background: #2a3845;
color: #eee;
}

.menu__item.checked > .menu__title .nav-link {
color: #eef;
.menu__item.checked {
background: #2a3845;
}

.menu__item .nav-link {
color: #aab;
padding: .5rem 2rem;
}

.menu__item .nav-link.checked {
color: #eee;
.menu__item:hover .nav-link {
/*color: #eee;*/
}

.menu__item > .menu__title .nav-link {
padding: .8rem 2rem;
font-size: 16px;
font-weight: 600;
padding: 1rem 2rem;
}

.menu__item:hover {
background: #2a3845;
.menu__item.checked > .menu__title .nav-link {
color: #eee;
}

.menu__item:hover .nav-link {
/*color: #eee;*/
}

.submenu {
color: #ddd;
padding-bottom: 1rem;
Expand All @@ -43,4 +40,6 @@

.submenu__item .nav-link {
padding-left: 4.5rem;
font-weight: 300;
font-size: 14px;
}
20 changes: 15 additions & 5 deletions src/components/Menu/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,21 @@
<ul class="menu">
<li ms-for="(i,m) in menus" ms-class="['menu__item',m.checked&&'checked']">
<li class="menu__item checked">
<div class="menu__title">
<ms-navlink ms-widget="{item:m,glyphicon:'glyphicon-home',iconvisible:true,click:menuItemClick}" />
<a class="nav-link">11111</a>
</div>
<ul ms-class="['submenu',m.checked&&'checked']">
<li class="submenu__item" ms-for="sm in submenuArr[m.id]">
<ms-navlink ms-widget="{item:sm,glyphicon:'glyphicon-home',click:subMenuItemClick}" />
<ul class="submenu checked">
<li class="submenu__item">
<ms-navlink ms-widget="{to:'/page101'}">page101</ms-navlink>
</li>
</ul>
</li>
<li class="menu__item checked">
<div class="menu__title">
<a class="nav-link">22222</a>
</div>
<ul class="submenu checked">
<li class="submenu__item">
<ms-navlink ms-widget="{to:'/page201'}">page201</ms-navlink>
</li>
</ul>
</li>
Expand Down
4 changes: 3 additions & 1 deletion src/components/Menu/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,9 @@ component('ms-menu', {
menuItemClick(e, item) {
var preIndex = this.menus.findIndex(el => el.checked);
var currIndex = this.menus.findIndex(el => item.id === el.id);
this.menus[preIndex].checked = false;
if (preIndex >= 0) {
this.menus[preIndex].checked = false;
}
this.menus[currIndex].checked = true;
},
subMenuItemClick(e, item) {
Expand Down
39 changes: 0 additions & 39 deletions src/components/NavLink/index.css
View file

This file was deleted.

5 changes: 0 additions & 5 deletions src/components/NavLink/index.html
View file

This file was deleted.

23 changes: 0 additions & 23 deletions src/components/NavLink/index.js
View file

This file was deleted.

34 changes: 20 additions & 14 deletions src/components/PageTab/index.css
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
.tab {
.pagetab {
width: 100%;
height: 100%;
list-style: none;
position: relative;
}

.tab ul,
.tab li {
.pagetab ul,
.pagetab li {
list-style: none;
padding: 0;
margin: 0;
}

.tab__header {
.pagetab__header {
position: absolute;
left: 0;
right: 0;
Expand All @@ -22,16 +22,16 @@
border-bottom: solid .2rem #203040;
}

.tab__header .left {
.pagetab__header .left {
float: left;
border-right: solid 1px #e7e7e7;
}

.tab__header .glyphicon {
.pagetab__header .glyphicon {
padding: 0 .3rem;
}

.tab__header .link {
.pagetab__header .link {
display: block;
float: left;
height: 100%;
Expand All @@ -41,33 +41,39 @@
cursor: pointer;
}

.tab__header .dropdown-menu {
.pagetab__header .dropdown-menu {
border-radius: 0;
}

.tab__header .link a {
.pagetab__header .link a {
color: #999;
}

.tab__header .link:hover {
.pagetab__header .link:hover {
background: #eee;
}

.tab__header .mid {
.pagetab__header .mid {
overflow: hidden;
}

.tab__header .right {
.pagetab__header .right {
float: right;
border-left: solid 1px #e7e7e7;
}

.tab__title__wrapper {
.pagetab__title__wrapper {
height: 100%;
width: 1000rem;
}

.tab__content {
.pagetab__title {
float: left;
display: block;
border-right: solid 1px #eee;
}

.pagetab__content {
position: absolute;
left: 0;
right: 0;
Expand Down
26 changes: 17 additions & 9 deletions src/components/PageTab/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
<div class="tab">
<ul class="tab__header">
<li class="left"><a class="link"><i class="glyphicon glyphicon-backward"></i></a></li>
<div class="pagetab" ms-attr="{id:$id}">
<ul class="pagetab__header">
<li class="left">
<a class="link" ms-click="moveLeft"><i class="glyphicon glyphicon-backward"></i></a>
</li>
<li class="right clearfix">
<a class="link"><i class="glyphicon glyphicon-forward"></i></a>
<a class="link" ms-click="moveRight"><i class="glyphicon glyphicon-forward"></i></a>
<div class="link dropdown">
<a class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
关闭操作
Expand All @@ -19,12 +21,18 @@
<a class="link"><i class="glyphicon glyphicon-log-out"></i><span>退出</span></a>
</li>
<li class="mid">
<ul class="tab__title__wrapper clearfix">
<ms-tabtitle ms-for="item in items" ms-widget="{item:item,click:onTabTitleClick,closeTab:removeItem}" />
<ul class="pagetab__title__wrapper clearfix" ms-css="{marginLeft:tabTitleWrapperMarginLeft}">
<li class="pagetab__title">
<ms-navlink ms-widget="{to:'/page101'}">page101</ms-navlink>
</li>
<li class="pagetab__title">
<ms-navlink ms-widget="{to:'/page201'}">page201</ms-navlink>
</li>
</ul>
</li>
</ul>
<ul class="tab__content">
<ms-pagetabpage ms-for="item in items" ms-widget="{tmpl:item.tmpl,checked:item.checked}">
</ul>
<div class="pagetab__content">
<ms-route ms-widget="{path:'/page101',component:'<ms-page101 ms-widget={shown:shown} />'}" />
<ms-route ms-widget="{path:'/page201',component:'<ms-page201 ms-widget={shown:shown />'}" />
</div>
</div>
Loading

0 comments on commit c43db32

Please sign in to comment.