diff options
author | 2017-03-16 23:09:07 +0800 | |
---|---|---|
committer | 2017-03-16 23:09:21 +0800 | |
commit | 739b4395c43351361c82b29deedfafedbfd1c6b2 (patch) | |
tree | 8981cd09c166de0549261c64452000515140c331 /login | |
parent | 108730b2f8fe2a95e826bc0144ad84a632a92656 (diff) |
modify login function
Issue-id: CLIENT-13
Change-Id: I6a10a0eb0b0f81cd8a51f260fd0e956ea63e1d90
Signed-off-by: “shentao” <shentao@chinamobile.com>
Diffstat (limited to 'login')
30 files changed, 1841 insertions, 17 deletions
diff --git a/login/src/main/webapp/login/css/login_background.css b/login/src/main/webapp/login/css/login_background.css new file mode 100644 index 00000000..96a82304 --- /dev/null +++ b/login/src/main/webapp/login/css/login_background.css @@ -0,0 +1,277 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +*{ + margin:0; + padding:0; +} + +.slideshow { + position: absolute; + width: 100vw; + height: 100vh; + overflow: hidden; +} + +.slideshow-image { + position: absolute; + width: 100%; + height: 100%; + background: no-repeat 50% 50%; + background-size: cover; + -webkit-animation-name: kenburns; + animation-name: kenburns; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-duration: 16s; + animation-duration: 16s; + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); +} + +.slideshow-image:nth-child(1) { + -webkit-animation-name: kenburns-1; + animation-name: kenburns-1; + z-index: 3; +} + +.slideshow-image:nth-child(2) { + -webkit-animation-name: kenburns-2; + animation-name: kenburns-2; + z-index: 2; +} + +.slideshow-image:nth-child(3) { + -webkit-animation-name: kenburns-3; + animation-name: kenburns-3; + z-index: 1; +} + +.slideshow-image:nth-child(4) { + -webkit-animation-name: kenburns-4; + animation-name: kenburns-4; + z-index: 0; +} + +@-webkit-keyframes kenburns-1 { + 0% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 1.5625% { + opacity: 1; + } + 23.4375% { + opacity: 1; + } + 26.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 98.4375% { + opacity: 0; + -webkit-transform: scale(1.21176); + transform: scale(1.21176); + } + 100% { + opacity: 1; + } +} + +@keyframes kenburns-1 { + 0% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 1.5625% { + opacity: 1; + } + 23.4375% { + opacity: 1; + } + 26.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 98.4375% { + opacity: 0; + -webkit-transform: scale(1.21176); + transform: scale(1.21176); + } + 100% { + opacity: 1; + } +} + +@-webkit-keyframes kenburns-2 { + 23.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 26.5625% { + opacity: 1; + } + 48.4375% { + opacity: 1; + } + 51.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} + +@keyframes kenburns-2 { + 23.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 26.5625% { + opacity: 1; + } + 48.4375% { + opacity: 1; + } + 51.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} + +@-webkit-keyframes kenburns-3 { + 48.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 51.5625% { + opacity: 1; + } + 73.4375% { + opacity: 1; + } + 76.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} + +@keyframes kenburns-3 { + 48.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 51.5625% { + opacity: 1; + } + 73.4375% { + opacity: 1; + } + 76.5625% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } + 100% { + opacity: 0; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } +} + +@-webkit-keyframes kenburns-4 { + 73.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 76.5625% { + opacity: 1; + } + 98.4375% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } +} + +@keyframes kenburns-4 { + 73.4375% { + opacity: 1; + -webkit-transform: scale(1.2); + transform: scale(1.2); + } + 76.5625% { + opacity: 1; + } + 98.4375% { + opacity: 1; + } + 100% { + opacity: 0; + -webkit-transform: scale(1); + transform: scale(1); + } +} + +h1 { + position: absolute; + top: 50%; + left: 50%; + -webkit-transform: translate3d(-50%, -50%, 0); + transform: translate3d(-50%, -50%, 0); + z-index: 99; +} diff --git a/login/src/main/webapp/login/css/login_inputForm.css b/login/src/main/webapp/login/css/login_inputForm.css new file mode 100644 index 00000000..681c774a --- /dev/null +++ b/login/src/main/webapp/login/css/login_inputForm.css @@ -0,0 +1,345 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +#login_container { + text-align: left; + margin: 0; + padding: 0; + margin: 0 auto; + font-family: "Trebuchet MS","Myriad Pro",Arial,sans-serif; +} + +@font-face { + font-family: 'FontomasCustomRegular'; + src: url('/openoui/thirdparty/fonts/fontomas-webfont.eot'); + src: url('/openoui/thirdparty/fonts/fontomas-webfont.eot?#iefix') format('embedded-opentype'), + url('/openoui/thirdparty/fonts/fontomas-webfont.woff') format('woff'), + url('/openoui/thirdparty/fonts/fontomas-webfont.ttf') format('truetype'), + url('/openoui/thirdparty/fonts/fontomas-webfont.svg#FontomasCustomRegular') format('svg'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'FranchiseRegular'; + src: url('/openoui/thirdparty/fonts/franchise-bold-webfont.eot'); + src: url('/openoui/thirdparty/fonts/franchise-bold-webfont.eot?#iefix') format('embedded-opentype'), + url('/openoui/thirdparty/fonts/franchise-bold-webfont.woff') format('woff'), + url('/openoui/thirdparty/fonts/franchise-bold-webfont.ttf') format('truetype'), + url('/openoui/thirdparty/fonts/franchise-bold-webfont.svg#FranchiseRegular') format('svg'); + font-weight: normal; + font-style: normal; +} + +a.hiddenanchor { + display: none; +} + +#wrapper { + right: 0px; + min-height: 560px; + margin: 0px auto; + width: 500px; + position: relative; +} + +#wrapper a { + color: rgb(95, 155, 198); + text-decoration: underline; +} + +#wrapper p { + margin-bottom: 15px; +} + +#wrapper p:first-child { + margin: 0px; +} + +#wrapper label { + color: rgb(64, 92, 96); + position: relative; +} + +::-webkit-input-placeholder { + color: rgb(190, 188, 188); + font-style: italic; +} + +input:-moz-placeholder, +textarea:-moz-placeholder { + color: rgb(190, 188, 188); + font-style: italic; +} + +input { + outline: none; +} + +#wrapper input:not([type="checkbox"]) { + width: 92%; + margin-top: 4px; + padding: 10px 5px 10px 32px; + border: 1px solid rgb(178, 178, 178); + -webkit-appearance: textfield; + -webkit-box-sizing: content-box; + -moz-box-sizing : content-box; + box-sizing : content-box; + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; + -webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset; + -moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset; + box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset; + -webkit-transition: all 0.2s linear; + -moz-transition: all 0.2s linear; + -o-transition: all 0.2s linear; + transition: all 0.2s linear; +} + +#wrapper input:not([type="checkbox"]):active, +#wrapper input:not([type="checkbox"]):focus { + border: 1px solid rgba(91, 90, 90, 0.7); + background: rgba(238, 236, 240, 0.2); + -webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset; + -moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset; + box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset; +} + +[data-icon]:after { + content: attr(data-icon); + font-family: 'FontomasCustomRegular'; + color: rgb(106, 159, 171); + position: absolute; + left: 10px; + top: 35px; + width: 30px; +} + +#wrapper p.button input { + width: 30%; + cursor: pointer; + background: rgb(61, 157, 179); + padding: 8px 5px; + font-family: 'BebasNeueRegular','Arial Narrow',Arial,sans-serif; + color: #fff; + font-size: 24px; + border: 1px solid rgb(28, 108, 122); + margin-bottom: 10px; + text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); + -webkit-border-radius: 3px; + -moz-border-radius: 3px; + border-radius: 3px; + -webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, + 0px 0px 0px 3px rgb(254, 254, 254), + 0px 5px 3px 3px rgb(210, 210, 210); + -moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, + 0px 0px 0px 3px rgb(254, 254, 254), + 0px 5px 3px 3px rgb(210, 210, 210); + box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, + 0px 0px 0px 3px rgb(254, 254, 254), + 0px 5px 3px 3px rgb(210, 210, 210); + -webkit-transition: all 0.2s linear; + -moz-transition: all 0.2s linear; + -o-transition: all 0.2s linear; + transition: all 0.2s linear; +} + +#wrapper p.button input:hover { + background: rgb(74, 179, 198); +} + +#wrapper p.button input:active, +#wrapper p.button input:focus { + background: rgb(40, 137, 154); + position: relative; + top: 1px; + border: 1px solid rgb(12, 76, 87); + -webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset; + -moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset; + box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset; +} + +p.login.button, +p.signin.button { + text-align: right; + margin: 5px 0; +} + +.keeplogin { + margin-top: -5px; +} + +.keeplogin input, +.keeplogin label { + display: inline-block; + font-size: 12px; + font-style: italic; +} + +.keeplogin input#loginkeeping { + margin-right: 5px; +} + +.keeplogin label { + width: 80%; +} + +p.change_link { + position: absolute; + color: rgb(127, 124, 124); + left: 0px; + height: 20px; + width: 440px; + padding: 17px 30px 20px 30px; + font-size: 16px; + text-align: right; + border-top: 1px solid rgb(219, 229, 232); + -webkit-border-radius: 0 0 5px 5px; + -moz-border-radius: 0 0 5px 5px; + border-radius: 0 0 5px 5px; + background: rgb(225, 234, 235); +} + +#wrapper p.change_link a { + display: inline-block; + font-weight: bold; + background: rgb(247, 248, 241); + padding: 2px 6px; + color: rgb(29, 162, 193); + margin-left: 10px; + text-decoration: none; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + border: 1px solid rgb(203, 213, 214); + -webkit-transition: all 0.4s linear; + -moz-transition: all 0.4s linear; + -o-transition: all 0.4s linear; + -ms-transition: all 0.4s linear; + transition: all 0.4s linear; +} + +#wrapper p.change_link a:hover { + color: rgb(57, 191, 215); + background: rgb(247, 247, 247); + border: 1px solid rgb(74, 179, 198); +} + +#wrapper p.change_link a:active { + position: relative; + top: 1px; +} + +#register, +#login { + position: absolute; + top: 0px; + width: 88%; + padding: 18px 6% 10px 6%; + margin: 0 0 35px 0; + background: rgb(247, 247, 247); + border: 1px solid rgba(147, 184, 189, 0.8); + -webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset; + -moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset; + box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset; + -webkit-box-shadow: 5px; + -moz-border-radius: 5px; + border-radius: 5px; + filter: alpha(opacity=85); + opacity: 0.85; +} + +#register { + z-index: 21; + opacity: 0; +} + +#login { + z-index: 22; +} + +#toregister:target ~ #wrapper #register, +#tologin:target ~ #wrapper #login { + z-index: 22; + -webkit-animation-delay: .6s; + -webkit-animation-timing-function: ease-in; + -moz-animation-delay: .6s; + -moz-animation-timing-function: ease-in; + -o-animation-delay: .6s; + -o-animation-timing-function: ease-in; + -ms-animation-delay: .6s; + -ms-animation-timing-function: ease-in; + animation-delay: .6s; + animation-timing-function: ease-in; + -webkit-animation-name: scaleIn; + -moz-animation-name: scaleIn; + -ms-animation-name: scaleIn; + -o-animation-name: scaleIn; + animation-name: scaleIn; +} + +#toregister:target ~ #wrapper #login, +#tologin:target ~ #wrapper #register { + -webkit-animation-timing-function: ease-out; + -moz-animation-timing-function: ease-out; + -o-animation-timing-function: ease-out; + -ms-animation-timing-function: ease-out; + animation-timing-function: ease-out; + -webkit-animation-name: scaleOut; + -moz-animation-name: scaleOut; + -ms-animation-name: scaleOut; + -o-animation-name: scaleOut; + animation-name: scaleOut; +} + +.animate { + -webkit-animation-duration: 0.5s; + -webkit-animation-fill-mode: both; + -moz-animation-duration: 0.5s; + -moz-animation-fill-mode: both; + -o-animation-duration: 0.5s; + -o-animation-fill-mode: both; + -ms-animation-duration: 0.5s; + -ms-animation-fill-mode: both; + animation-duration: 0.5s; + animation-fill-mode: both; +} + +.lt8 #wrapper input { + padding: 10px 5px 10px 32px; + width: 92%; +} + +.lt8 #wrapper input[type=checkbox] { + width: 10px; + padding: 0; +} + +.lt8 #wrapper h1 { + color: #066A75; +} + +.lt8 #register { + display: none; +} + +.lt8 p.change_link, +.ie9 p.change_link { + position: absolute; + height: 90px; + background: transparent; +} diff --git a/login/src/main/webapp/login/css/login_mainStyle.css b/login/src/main/webapp/login/css/login_mainStyle.css new file mode 100644 index 00000000..e2c65040 --- /dev/null +++ b/login/src/main/webapp/login/css/login_mainStyle.css @@ -0,0 +1,192 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +@font-face { + font-family: 'BebasNeueRegular'; + src: url('/openoui/thirdparty/fonts/BebasNeue-webfont.eot'); + src: url('/openoui/thirdparty/fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), + url('/openoui/thirdparty/fonts/BebasNeue-webfont.woff') format('woff'), + url('/openoui/thirdparty/fonts/BebasNeue-webfont.ttf') format('truetype'), + url('/openoui/thirdparty/fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg'); + font-weight: normal; + font-style: normal; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +fieldset,img { + border: 0; +} + +address,caption,cite,code,dfn,th,var { + font-style: normal; + font-weight: normal; +} + +ol,ul { + list-style: none; +} + +caption,th { + text-align: left; +} + +h1,h2,h3,h4,h5,h6 { + font-size: 100%; + font-weight: normal; +} + +q:before,q:after { + content: ''; +} + +abbr,acronym { + border: 0; +} + +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} + +body { + font-family: Cambria, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; + font-weight: 400; + font-size: 15px; + color: #1d3c41; + overflow-y: scroll; +} + +a { + color: #333; + text-decoration: none; +} + +.container { + width: 100%; + height: 100%; + position: relative; + text-align: center; +} + +.clr { + clear: both; +} + +.container > header { + padding: 20px 30px 10px 30px; + margin: 0px 20px 10px 20px; + position: relative; + display: block; + text-shadow: 1px 1px 1px rgba(0,0,0,0.2); + text-align: center; +} + +.container > header h1 { + font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif; + font-size: 35px; + line-height: 35px; + position: relative; + font-weight: 400; + color: rgba(26,89,120,0.9); + text-shadow: 1px 1px 1px rgba(0,0,0,0.1); + padding: 0px 0px 5px 0px; +} + +.container > header h1 span { + color: #7cbcd6; + text-shadow: 0px 1px 1px rgba(255,255,255,0.8); +} + +.container > header h2 { + font-size: 16px; + font-style: italic; + color: #2d6277; + text-shadow: 0px 1px 1px rgba(255,255,255,0.8); +} + +.codrops-top { + line-height: 24px; + font-size: 11px; + background: rgba(255, 255, 255, 0.4); + text-transform: uppercase; + z-index: 9999; + position: relative; + box-shadow: 1px 0px 2px rgba(0,0,0,0.2); +} + +.codrops-top a { + padding: 0px 10px; + letter-spacing: 1px; + color: #333; + text-shadow: 0px 1px 1px #fff; + display: block; + float: left; +} + +.codrops-top a:hover { + background: #fff; +} + +.codrops-top span.right { + float: right; +} + +.codrops-top span.right a { + float: left; + display: block; +} + +.codrops-demos { + text-align: center; + display: block; + padding: 14px; +} + +.codrops-demos span { + display: inline-block; + padding-right: 15px; + text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8); +} + +.codrops-demos a, +.codrops-demos a.current-demo, +.codrops-demos a.current-demo:hover { + display: inline-block; + font-style: italic; + font-size: 12px; + padding: 3px 5px; + margin: 0px 3px; + font-weight: 800; + box-shadow: 1px 1px 1px rgba(0,0,0,0.05) inset; + color: #fff; + text-shadow: 1px 1px 1px rgba(0,0,0,0.1); + background: rgba(104,171,194,0.5); +} + +.codrops-demos a:hover { + background: #4fa2c4; +} + +.codrops-demos a.current-demo, +.codrops-demos a.current-demo:hover { + color: rgba(104,171,194,1); + background: rgba(255,255,255,0.9); + box-shadow: 0px 1px 1px rgba(0,0,0,0.1); +} diff --git a/login/src/main/webapp/login/css/menu_mainStyle.css b/login/src/main/webapp/login/css/menu_mainStyle.css new file mode 100644 index 00000000..848609a3 --- /dev/null +++ b/login/src/main/webapp/login/css/menu_mainStyle.css @@ -0,0 +1,282 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +#page-wrapper, body, html { + height: 100%; +} + +#page-wrapper { + position: relative; +} + +.fixed-sidebar #page-sidebar { + position: fixed; + top: 0; +} + +.fixed-sidebar #page-main { + margin-left: 0; +} + +/* Sidebar */ +#page-sidebar { + width: 240px; + position: relative; + z-index: 90; + background: #e4e9f0; + border: #c1cad5 solid 1px; + border-width: 0 1px 0 0; +} + +.fixed-sidebar #page-sidebar { + position: fixed; + top: 0; +} + +.close-sidebar #page-sidebar { + margin-left: -240px; +} + +.close-sidebar.fixed-header #page-sidebar { + position: fixed; + top: 0; +} + +.fixed-header.fixed-footer #page-sidebar { + padding-bottom: 50px; +} + +#header-logo { + width: 240px; + background: #2b394a; + text-transform: uppercase; + font-weight: normal; + height: 52px; + line-height: 52px; + color: #fff; +} + +#sidebar-menu { + width: 240px; + background: #e4e9f0; + overflow: hidden; + height: auto !important; + position: absolute; + left: 0; + border: #c1cad5 solid 1px; + border-width: 0 1px 2px 0; +} + +ul { + list-style-type: none; +} + +a { + color: #b63b4d; + text-decoration: none; +} + +.accordion { + width: 240px; + background: #FFF; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + -webkit-padding-start: 0px; + margin-bottom: 0px; +} + +.accordion .link { + cursor: pointer; + display: block; + padding: 15px 15px 15px 42px; + color: #4D4D4D; + font-size: 14px; + font-weight: 700; + border-bottom: 1px solid #CCC; + position: relative; + -webkit-transition: all 0.4s ease; + -o-transition: all 0.4s ease; + transition: all 0.4s ease; +} + +.accordion li:last-child .link { + border-bottom: 0; +} + +.accordion li i { + position: absolute; + top: 16px; + left: 12px; + font-size: 18px; + color: #595959; + -webkit-transition: all 0.4s ease; + -o-transition: all 0.4s ease; + transition: all 0.4s ease; +} + +.accordion li i.fa-chevron-down { + right: 12px; + left: auto; + font-size: 16px; +} + +.accordion li.open .link { + color: #b63b4d; +} + +.accordion li.open i { + color: #b63b4d; +} + +.accordion li.open i.fa-chevron-down { + -webkit-transform: rotate(180deg); + -ms-transform: rotate(180deg); + -o-transform: rotate(180deg); + transform: rotate(180deg); +} + +.submenu { + display: none; + background: #444359; + font-size: 14px; + -webkit-padding-start: 0px; +} + +.submenu li { + border-bottom: 1px solid #4b4a5e; +} + +.submenu a { + display: block; + text-decoration: none; + color: #d9d9d9; + padding: 12px; + padding-left: 42px; + -webkit-transition: all 0.25s ease; + -o-transition: all 0.25s ease; + transition: all 0.25s ease; +} + +.submenu a:hover { + background: #b63b4d; + color: #FFF; +} + +#page-main-wrapper { + margin-left: 240px; +} + +#page-header { + background: #37485d; + padding: 0; +} + +#page-header a, +#header-logo a { + color: rgba(255,255,255,0.5); +} + +#page-header .button-group > a:hover, +#page-header .top-icon-bar > a:hover, +#page-header .top-icon-bar a.user-ico:hover { + color: #fff !important; +} + +#page-header .dropdown-menu a { + color: #000; +} + +#page-header .top-icon-bar { + border-right: rgba(255,255,255,0.1) solid 1px; + float: right; +} + +#page-header .top-icon-bar .dropdown { + float: left; + display: block; +} + +#page-header .top-icon-bar > a { + display: block; + height: 52px; + line-height: 52px; + text-align: center; + float: left; + position: relative; + font-size: 24px; + width: 60px; + border-left: rgba(255,255,255,0.1) solid 1px; +} + +#page-header .top-icon-bar > a .glyph-icon { + display: block; +} + +#page-header .top-icon-bar > a:hover { + background: rgba(255,255,255,0.05); +} + +#page-header .top-icon-bar > a .badge-absolute { + top: 6px; + right: 6px; + left: auto; + border: 0; + height: 16px; + line-height: 16px; + padding: 0 3px !important; + border-radius: 2px; +} + +#page-header .top-icon-bar a.user-ico { + line-height: 36px; + font-size: 14px; + width: auto; +} + +#page-header .top-icon-bar a.user-ico img { + margin: 8px 0 0 8px; + float: left; +} + +#page-header .top-icon-bar a.user-ico span { + display: block; + float: left; + height: 44px; + line-height: 36px; + margin: 8px 8px 0; +} + +#page-header .top-icon-bar.dropdown .dropdown-menu.float-right { + min-width: 100px; + right: 0; +} + +#page-header .top-icon-bar a.user-ico i { + margin: 8px 8px 0 0; + font-size: 10px; + display: block; + float: left; + height: 36px; + line-height: 36px; +} + +.submenu_active { + font-style: italic; + color: #191970 !important; + background:#d9d9d9; + border-left: 3px solid #4ac9ff; +} diff --git a/login/src/main/webapp/login/html/login.html b/login/src/main/webapp/login/html/login.html index fefdfdd5..ee20f5ec 100644 --- a/login/src/main/webapp/login/html/login.html +++ b/login/src/main/webapp/login/html/login.html @@ -1,5 +1,5 @@ <!-- - Copyright 2016, CMCC Technologies Co., Ltd. + Copyright 2016-2017, China Mobile Co., Ltd. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -13,19 +13,37 @@ See the License for the specific language governing permissions and limitations under the License. --> -<!DOCTYPE html> -<html> - <head> - <title id="openo_login_title" name_i18n="openo_login_i18n_login"></title> - <meta charset="utf-8"/> - <meta http-equiv="X-UA-Compatible" content="IE=edge"> - <meta http-equiv="pragma" content="no-cache"/> - <meta http-equiv="cache-control" content="no-cache, no-store, max-age=0, must-revalidate"/> - <meta content="width=device-width, initial-scale=1.0" name="viewport"/> - <meta content="" name="description"/> - <meta content="" name="author"/> - </head> - <body> -demo - </body> -</html> + +<h1> + <div id="login_container"> + <div id="wrapper"> + <div id="login" class="animate form"> + <form ng-init="loginFormInit()" ng-submit="loginFormSubmit()"> + <img src="/openoui/login/image/openo_logo_pantone.png" width="100%" style="display:inline"/> + <br/><br/><span style="color:red">{{error}}</span><br/><br/> + <p> + <label for="username" class="uname" data-icon="u">Your username</label> + <input id="username" name="username" required="required" type="text" ng-model="user.username" placeholder="open-o user"/> + </p> + <p> + <label for="password" class="youpasswd" data-icon="p">Your password</label> + <input id="password" name="password" required="required" type="password" ng-model="user.password" placeholder="eg. X8df!90EO"/> + </p> + <p class="keeplogin"> + <input type="checkbox" name="loginkeeping" id="loginkeeping" ng-model="user.loginkeeping" ng-true-value="true" ng-false-value="false"/> + <label for="loginkeeping">Keep me logged in</label> + </p> + <p class="login button"> + <input type="submit" value="Login"/> + </p> + </form> + </div> + </div> + </div> +</h1> +<div class="slideshow"> + <div class="slideshow-image" style="background-image: url('/openoui/login/image/loginBackground01.jpg')"></div> + <div class="slideshow-image" style="background-image: url('/openoui/login/image/loginBackground02.jpg')"></div> + <div class="slideshow-image" style="background-image: url('/openoui/login/image/loginBackground03.jpg')"></div> + <div class="slideshow-image" style="background-image: url('/openoui/login/image/loginBackground04.jpg')"></div> +</div> diff --git a/login/src/main/webapp/login/html/menu.html b/login/src/main/webapp/login/html/menu.html new file mode 100644 index 00000000..59bc30a7 --- /dev/null +++ b/login/src/main/webapp/login/html/menu.html @@ -0,0 +1,113 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> + +<div id="page-wrapper" class="main-menu fixed-sidebar fixed-header"> + <div id="page-sidebar"> + <div id="header-logo"> + <img src="/openoui/login/image/openo_logo_white.png" width="75%" style="display:block; margin:0 auto;"/> + </div> + <div id="sidebar-menu"> + <ul id="accordion" class="accordion"> + <li> + <div class="link"> + <i class="fa fa-globe"></i>Service<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".serviceManagement" ui-sref-active="submenu_active">Service Management</a></li> + </ul> + </li> + <li> + <div class="link"> + <i class="fa fa-search-minus"></i>Resource Mgr<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".resourceSdno" ui-sref-active="submenu_active">Resource Mgr sdno</a></li> + <li><a ui-sref=".resourceNfvo" ui-sref-active="submenu_active">Resource Mgr Nfvo</a></li> + </ul> + </li> + <li> + <div class="link"> + <i class="fa fa-puzzle-piece"></i>Orchestrator<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".modelDesign" ui-sref-active="submenu_active">Model Design</a></li> + <li><a ui-sref=".package" ui-sref-active="submenu_active">Package</a></li> + <li><a ui-sref=".serviceTemplate" ui-sref-active="submenu_active">Service Template</a></li> + </ul> + </li> + <li> + <div class="link"> + <i class="fa fa-cogs"></i>Manage View<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".vimManage" ui-sref-active="submenu_active">VIM Manage</a></li> + <li><a ui-sref=".vnfm" ui-sref-active="submenu_active">VNFM</a></li> + <li><a ui-sref=".sdbController" ui-sref-active="submenu_active">SDN Controller</a></li> + </ul> + </li> + <li> + <div class="link"> + <i class="fa fa-line-chart"></i>Performance<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".performanceQuery" ui-sref-active="submenu_active">Performance Query</a></li> + <li><a ui-sref=".alarmQuery" ui-sref-active="submenu_active">Alarm Query</a></li> + </ul> + </li> + <li> + <div class="link"> + <i class="fa fa-eye"></i>Monitor<i class="fa fa-chevron-down"></i> + </div> + <ul class="submenu"> + <li><a ui-sref=".parameterSetting" ui-sref-active="submenu_active">Parameter Setting</a></li> + </ul> + </li> + </ul> + </div> + </div> + + <div id="page-main-wrapper"> + <div id="page-header"> + <div id="page-header-wrapper" class="clearfix"> + <div class="top-icon-bar dropdown"> + <a href="javascript:;" title="" class="user-ico clearfix" data-toggle="dropdown"> + <img width="36" src="/openoui/login/image/user.png" alt=""> + <span>User Name</span> + <i class="fa fa-chevron-down"></i> + </a> + <ul class="dropdown-menu float-right"> + <li> + <a href="javascript:;" title=""> + <span class="font-bold">Logout</span> + </a> + </li> + </ul> + </div> + <div class="top-icon-bar"> + <a href="javascript:;" class="popover-button" data-placement="bottom" title="Messages Widget" data-id="#msg-box"> + <i class="fa fa-envelope-o" style="color: green;"></i> + </a> + <a href="javascript:;" class="popover-button" data-placement="bottom" title="" data-id="#notif-box"> + <i class="fa fa-bell-o" style="color: red;"></i> + </a> + </div> + </div> + </div> + <div id="rightContainer" class="col-sm-8 col-md-9 col-lg-9"> + <ui-view></ui-view> + </div> + </div> +</div>
\ No newline at end of file diff --git a/login/src/main/webapp/login/html/temp/alarmQuery.html b/login/src/main/webapp/login/html/temp/alarmQuery.html new file mode 100644 index 00000000..e4f23650 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/alarmQuery.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>alarmQuery test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/modelDesign.html b/login/src/main/webapp/login/html/temp/modelDesign.html new file mode 100644 index 00000000..dcc37303 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/modelDesign.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>modelDesign test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/package.html b/login/src/main/webapp/login/html/temp/package.html new file mode 100644 index 00000000..88b6c551 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/package.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>package test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/parameterSetting.html b/login/src/main/webapp/login/html/temp/parameterSetting.html new file mode 100644 index 00000000..395fff33 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/parameterSetting.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>parameterSetting test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/performanceQuery.html b/login/src/main/webapp/login/html/temp/performanceQuery.html new file mode 100644 index 00000000..7a050ace --- /dev/null +++ b/login/src/main/webapp/login/html/temp/performanceQuery.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>performanceQuery test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/resourceNfvo.html b/login/src/main/webapp/login/html/temp/resourceNfvo.html new file mode 100644 index 00000000..52e583bd --- /dev/null +++ b/login/src/main/webapp/login/html/temp/resourceNfvo.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>resourceNfvo test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/resourceSdno.html b/login/src/main/webapp/login/html/temp/resourceSdno.html new file mode 100644 index 00000000..76ff13e1 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/resourceSdno.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>resourceSdno test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/sdbController.html b/login/src/main/webapp/login/html/temp/sdbController.html new file mode 100644 index 00000000..a561ba3e --- /dev/null +++ b/login/src/main/webapp/login/html/temp/sdbController.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>sdbController test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/serviceManagement.html b/login/src/main/webapp/login/html/temp/serviceManagement.html new file mode 100644 index 00000000..8a7caaa0 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/serviceManagement.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>serviceManagement test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/serviceTemplate.html b/login/src/main/webapp/login/html/temp/serviceTemplate.html new file mode 100644 index 00000000..b368cd75 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/serviceTemplate.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>serviceTemplate test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/vimManage.html b/login/src/main/webapp/login/html/temp/vimManage.html new file mode 100644 index 00000000..79335012 --- /dev/null +++ b/login/src/main/webapp/login/html/temp/vimManage.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>vimManage test page</h4> +</div> diff --git a/login/src/main/webapp/login/html/temp/vnfm.html b/login/src/main/webapp/login/html/temp/vnfm.html new file mode 100644 index 00000000..38975f4d --- /dev/null +++ b/login/src/main/webapp/login/html/temp/vnfm.html @@ -0,0 +1,18 @@ +<!-- + Copyright 2016-2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div> + <h4>vnfm test page</h4> +</div> diff --git a/login/src/main/webapp/login/image/favicon.ico b/login/src/main/webapp/login/image/favicon.ico Binary files differnew file mode 100644 index 00000000..fd2c63fb --- /dev/null +++ b/login/src/main/webapp/login/image/favicon.ico diff --git a/login/src/main/webapp/login/image/loginBackground01.jpg b/login/src/main/webapp/login/image/loginBackground01.jpg Binary files differnew file mode 100644 index 00000000..0bfb01dd --- /dev/null +++ b/login/src/main/webapp/login/image/loginBackground01.jpg diff --git a/login/src/main/webapp/login/image/loginBackground02.jpg b/login/src/main/webapp/login/image/loginBackground02.jpg Binary files differnew file mode 100644 index 00000000..8183ffae --- /dev/null +++ b/login/src/main/webapp/login/image/loginBackground02.jpg diff --git a/login/src/main/webapp/login/image/loginBackground03.jpg b/login/src/main/webapp/login/image/loginBackground03.jpg Binary files differnew file mode 100644 index 00000000..fa9c6d65 --- /dev/null +++ b/login/src/main/webapp/login/image/loginBackground03.jpg diff --git a/login/src/main/webapp/login/image/loginBackground04.jpg b/login/src/main/webapp/login/image/loginBackground04.jpg Binary files differnew file mode 100644 index 00000000..ff065934 --- /dev/null +++ b/login/src/main/webapp/login/image/loginBackground04.jpg diff --git a/login/src/main/webapp/login/image/openo_logo_black.png b/login/src/main/webapp/login/image/openo_logo_black.png Binary files differnew file mode 100644 index 00000000..f320af35 --- /dev/null +++ b/login/src/main/webapp/login/image/openo_logo_black.png diff --git a/login/src/main/webapp/login/image/openo_logo_pantone.png b/login/src/main/webapp/login/image/openo_logo_pantone.png Binary files differnew file mode 100644 index 00000000..14135042 --- /dev/null +++ b/login/src/main/webapp/login/image/openo_logo_pantone.png diff --git a/login/src/main/webapp/login/image/openo_logo_white.png b/login/src/main/webapp/login/image/openo_logo_white.png Binary files differnew file mode 100644 index 00000000..7adc4ac3 --- /dev/null +++ b/login/src/main/webapp/login/image/openo_logo_white.png diff --git a/login/src/main/webapp/login/image/user.png b/login/src/main/webapp/login/image/user.png Binary files differnew file mode 100644 index 00000000..08a68b6d --- /dev/null +++ b/login/src/main/webapp/login/image/user.png diff --git a/login/src/main/webapp/login/index.html b/login/src/main/webapp/login/index.html new file mode 100644 index 00000000..57cc88dc --- /dev/null +++ b/login/src/main/webapp/login/index.html @@ -0,0 +1,55 @@ +<!-- + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> + +<!DOCTYPE html> +<html> + <head lang="en"> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>OPEN-O</title> + <link rel="shortcut icon" type="image/x-icon" href="/openoui/login/image/favicon.ico"/> + + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/bootstrap.min.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/font-awesome.min.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/zTreeStyle.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/magic-check.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/ng-table.min.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/thirdparty/css/animate-custom.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/framework/css/open-ostyle.css"/> + + <link rel="stylesheet" type="text/css" href="/openoui/login/css/login_mainStyle.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/login/css/login_background.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/login/css/login_inputForm.css"/> + <link rel="stylesheet" type="text/css" href="/openoui/login/css/menu_mainStyle.css"/> + + <script type="text/javascript" src="/openoui/thirdparty/js/angular.min.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/angular-ui-router.min.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/ng-table.min.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/jquery_1.12.4.min.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/jquery-ui.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/bootstrap.min.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/mustache.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/jquery.ztree.core-3.5.js"></script> + <script type="text/javascript" src="/openoui/thirdparty/js/jquery.cookie.js"></script> + + <script type="text/javascript" src="/openoui/login/js/app.js"></script> + <script type="text/javascript" src="/openoui/login/js/rest.js"></script> + </head> + <body ng-app="POCApp" onload="loadTemplate()"> + <ui-view></ui-view> + </body> +</html> diff --git a/login/src/main/webapp/login/js/app.js b/login/src/main/webapp/login/js/app.js new file mode 100644 index 00000000..2b983a8e --- /dev/null +++ b/login/src/main/webapp/login/js/app.js @@ -0,0 +1,268 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +var app = angular.module("POCApp", ["ui.router", "ngTable"]) + .config(function($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider){ + $urlMatcherFactoryProvider.caseInsensitive(true); + $urlRouterProvider.otherwise('/login'); + $stateProvider + .state('login', { + url : '/login', + templateUrl : '/openoui/login/html/login.html', + controller : 'loginCtrl', + authenticate: false + }) + .state("menu", { + url: "/menu", + templateUrl : "/openoui/login/html/menu.html", + controller : "menuCtrl", + authenticate: true + }) + .state("menu.serviceManagement", { + url: "/serviceManagement", + templateUrl : "/openoui/login/html/temp/serviceManagement.html", + controller : "serviceManagementCtrl", + authenticate: true + }) + .state("menu.resourceSdno", { + url: "/resourceSdno", + templateUrl : "/openoui/login/html/temp/resourceSdno.html", + controller : "resourceSdnoCtrl", + authenticate: true + }) + .state("menu.resourceNfvo", { + url: "/resourceNfvo", + templateUrl : "/openoui/login/html/temp/resourceNfvo.html", + controller : "resourceNfvoCtrl", + authenticate: true + }) + .state("menu.modelDesign", { + url: "/modelDesign", + templateUrl : "/openoui/login/html/temp/modelDesign.html", + controller : "modelDesignCtrl", + authenticate: true + }) + .state("menu.package", { + url: "/package", + templateUrl : "/openoui/login/html/temp/package.html", + controller : "packageCtrl", + authenticate: true + }) + .state("menu.serviceTemplate", { + url: "/serviceTemplate", + templateUrl : "/openoui/login/html/temp/serviceTemplate.html", + controller : "serviceTemplateCtrl", + authenticate: true + }) + .state("menu.vimManage", { + url: "/vimManage", + templateUrl : "/openoui/login/html/temp/vimManage.html", + controller : "vimManageCtrl", + authenticate: true + }) + .state("menu.vnfm", { + url: "/vnfm", + templateUrl : "/openoui/login/html/temp/vnfm.html", + controller : "vnfmCtrl", + authenticate: true + }) + .state("menu.sdbController", { + url: "/sdbController", + templateUrl : "/openoui/login/html/temp/sdbController.html", + controller : "sdbControllerCtrl", + authenticate: true + }) + .state("menu.performanceQuery", { + url: "/performanceQuery", + templateUrl : "/openoui/login/html/temp/performanceQuery.html", + controller : "performanceQueryCtrl", + authenticate: true + }) + .state("menu.alarmQuery", { + url: "/alarmQuery", + templateUrl : "/openoui/login/html/temp/alarmQuery.html", + controller : "alarmQueryCtrl", + authenticate: true + }) + .state("menu.parameterSetting", { + url: "/parameterSetting", + templateUrl : "/openoui/login/html/temp/parameterSetting.html", + controller : "parameterSettingCtrl", + authenticate: true + }) + }) + + /*Login Controller*/ + .controller('loginCtrl', function($scope, $rootScope, $stateParams, $state, LoginService) { + $scope.loginFormInit = function() { + $scope.error = ""; + if ($.cookie("loginkeeping") == "true") { + $scope.user = { + 'username': $.cookie("username"), + 'password': $.cookie("password"), + 'loginkeeping': true, + }; + } else { + $scope.user = { + 'username': $.cookie("username"), + 'password': $.cookie("password"), + 'loginkeeping': false, + }; + } + }; + $scope.loginFormSubmit = function() { + LoginService.login($scope.user) + .then(function (response){ + if ($scope.user.loginkeeping) { + $.cookie("loginkeeping", "true", {expires: 7}); + $.cookie("username", $scope.user.username, {expires: 7}); + $.cookie("password", $scope.user.password, {expires: 7}); + } else { + $.cookie("loginkeeping", "false", {expire: -1}); + $.cookie("username", "", {expires: -1}); + $.cookie("password", "", {expires: -1}); + } + + $scope.error = ""; + $state.transitionTo('menu'); + //if (response.status == -1) { + // $scope.error = "Incorrect username/password !"; + //} else { + // $scope.error = ""; + // $state.transitionTo('menu'); + //} + }); + }; + }) + + /*Menu Controller*/ + .controller("menuCtrl", function($scope, $state, DataService){ + $scope.message = "Menu"; + init_menu(); + }) + + /*Service Management Controller*/ + .controller("serviceManagementCtrl", function($scope, DataService, $log){ + $scope.message = "Service Management"; + }) + + /*Resource Sdno Controller*/ + .controller("resourceSdnoCtrl", function($scope, DataService, $log){ + $scope.message = "Resource Sdno"; + }) + + /*Resource Nfvo Controller*/ + .controller("resourceNfvoCtrl", function($scope, DataService, $log){ + $scope.message = "Resource Nfvo"; + }) + + /*Model Design Controller*/ + .controller("modelDesignCtrl", function($scope, DataService, $log){ + $scope.message = "Model Design"; + }) + + /*Package Controller*/ + .controller("packageCtrl", function($scope, DataService, $log){ + $scope.message = "Package"; + }) + + /*Service Template Controller*/ + .controller("serviceTemplateCtrl", function($scope, DataService, $log){ + $scope.message = "Service Template"; + }) + + /*Vim Manage Controller*/ + .controller("vimManageCtrl", function($scope, DataService, $log){ + $scope.message = "Vim Manage"; + }) + + /*VNFM Controller*/ + .controller("vnfmCtrl", function($scope, DataService, $log){ + $scope.message = "VNFM"; + }) + + /*Sdn Controller Controller*/ + .controller("sdnControllerCtrl", function($scope, DataService, $log){ + $scope.message = "Sdn Controller"; + }) + + /*Performance Query Controller*/ + .controller("performanceQueryCtrl", function($scope, DataService, $log){ + $scope.message = "Performance Query"; + }) + + /*Alarm Query Controller*/ + .controller("alarmQueryCtrl", function($scope, DataService, $log){ + $scope.message = "Alarm Query"; + }) + + /*Parameter Setting Controller*/ + .controller("parameterSettingCtrl", function($scope, DataService, $log){ + $scope.message = "Parameter Setting"; + }) + +var modelTemplate = ""; +function loadTemplate() { + $.get('/openoui/framework/template.html', function (template) { + modelTemplate += template; + }); + $.get('/openoui/framework/templateContainer.html', function (template) { + modelTemplate += template; + }); + $.get('/openoui/framework/templateWidget.html', function (template) { + //console.log("Template is : "+template); + modelTemplate += template; + }); + $.get('/openoui/framework/templateNotification.html', function (template) { + modelTemplate += template; + }); + $.get('/openoui/framework/templateFunctional.html', function (template) { + modelTemplate += template; + }); +} + +function init_menu() { + var windowH = $(window).height(); + var headerH = $('#header-logo').height(); + var menuHeight = windowH - headerH; + $('#page-sidebar').height(windowH); + $("#sidebar-menu").height(menuHeight); + + var Accordion = function(el, multiple) { + this.el = el || {}; + this.multiple = multiple || false; + + // Variables privadas + var links = this.el.find('.link'); + // Evento + links.on('click', {el: this.el, multiple: this.multiple}, this.dropdown) + } + + Accordion.prototype.dropdown = function(e) { + var $el = e.data.el; + $this = $(this), + $next = $this.next(); + + $next.slideToggle(); + $this.parent().toggleClass('open'); + + if (!e.data.multiple) { + $el.find('.submenu').not($next).slideUp().parent().removeClass('open'); + }; + } + + var accordion = new Accordion($('#accordion'), false); +} diff --git a/login/src/main/webapp/login/js/rest.js b/login/src/main/webapp/login/js/rest.js new file mode 100644 index 00000000..020c6899 --- /dev/null +++ b/login/src/main/webapp/login/js/rest.js @@ -0,0 +1,58 @@ +/* + Copyright 2017, China Mobile Co., Ltd. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ + +app.factory("DataService", function($http, $log){ + return { + /*getAllData: function (value) { + //var value = $scope.param; + return $http({ + url: 'http://localhost:8080/POC_NodeToServletPorting_Server/?widgetType=' + value, + headers: {'Content-Type': 'application/json'}, + method: 'GET' + }).then(function (response) { + $log.info(response.data); + return response.data; + }) + },*/ + } +}); + +app.factory('LoginService', function($http, $log) { + return { + login: function(user) { + return $http({ + // TODO + url: 'http://localhost:8080/api/signin', + method: 'POST', + data: {'name':user.username, 'pswd':user.password}, + headers: {'Content-Type': 'application/json'} + }).then(function(response){ + if(response.status == 200) { + // TODO + // login succeeded + } else { + // TODO + // login failed + } + // TODO + return response; + }, function(error){ + // TODO + return error; + }); + } + }; +}); |