diff options
| author |   Seshu-Kumar-M <seshu.kumar.m@huawei.com> | 2016-09-28 17:49:37 +0800 |
|---|---|---|
| committer | Seshu-Kumar-M <seshu.kumar.m@huawei.com> | 2016-09-28 17:49:37 +0800 |
| commit | 5cba4bb121a736e3801d1f436263ff818a68a389 (patch) | |
| tree | dd5d2215a9655b823c2e0ad79db1dce773fac4f5 /openo-portal/portal-lifecyclemgr | |
| parent | b441b1ff3ec3c2bc9e88e3a917067bcfacc5a063 (diff) | |
Changes for the LCM integration and new GSO design
Change-Id: I319237a9386cea88fae887c73ae2feff217f6f85
Signed-off-by: Seshu-Kumar-M <seshu.kumar.m@huawei.com>
Diffstat (limited to 'openo-portal/portal-lifecyclemgr')
6 files changed, 1067 insertions, 783 deletions
diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/RMain.css b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/RMain.css index 0a74032c..c40182ba 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/RMain.css +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/RMain.css @@ -4,7 +4,7 @@ * 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
+ * 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,
@@ -14,226 +14,197 @@ */
#iemp_layout_container {
- padding: 0px;
- margin: 1px auto;
- width: 100%;
- height: 100%;
+ padding: 0px;
+ margin: 1px auto;
+ width: 100%;
+ height: 100%;
}
-
#iemp_layout_container .three-cols-layout {
- width: 100%;
- height: 100%;
- border-collapse: collapse;
- margin-left: 0px;
- margin-top: 0px;
- margin-right: 0px;
- margin-bottom: 0px;
+ width: 100%;
+ height: 100%;
+ border-collapse: collapse;
+ margin-left: 0px;
+ margin-top: 0px;
+ margin-right: 0px;
+ margin-bottom: 0px;
}
-
#iemp_layout_container .three-cols-layout {
- width: 100%;
- height: 100%;
- border-collapse: collapse;
- margin-left: 0px;
- margin-top: 0px;
- margin-right: 0px;
- margin-bottom: 0px;
+ width: 100%;
+ height: 100%;
+ border-collapse: collapse;
+ margin-left: 0px;
+ margin-top: 0px;
+ margin-right: 0px;
+ margin-bottom: 0px;
}
-
#iemp_layout_container .three-cols-column.three-cols-left {
- width: 215px;
- background-color: #f5f5f5;
+ width: 215px;
+ background-color: #f5f5f5;
}
-
.accordion_parent {
- position: relative;
- width: 220px;
- background-color: #f5f5f5;
+ position: relative;
+ width: 220px;
+ background-color: #f5f5f5;
}
-
.openo-accordion-resizable-handle {
- z-index: 1 !important;
- cursor: e-resize;
- width: 7px;
- right: -5px;
- top: 0;
- height: 100%;
- position: absolute;
- font-size: .1px;
- display: block;
+ z-index: 1!important;
+ cursor: e-resize;
+ width: 7px;
+ right: -5px;
+ top: 0;
+ height: 100%;
+ position: absolute;
+ font-size: .1px;
+ display: block;
}
-
.openoAccordian_accordionmenu {
- width: 100%;
- margin: 0;
- padding: 0;
- list-style-type: none;
- line-height: 17px;
+ width: 100%;
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ line-height: 17px;
}
-
.openoAccordian_accordionmenu li {
- min-width: 75px;
- margin: 0;
- padding: 0;
- list-style-type: none;
- color: #000;
- clear: both;
+ min-width: 75px;
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+ color: #000;
+ clear: both;
}
-
.openo_accordion_ui-icon-collapse, .openo_accordion_ui-icon-expand {
- display: block;
- float: left;
- margin-bottom: -1px;
- border-bottom: 1px solid #e5e5e5;
- cursor: pointer;
- width: 13px;
- padding-top: 26px;
+ display: block;
+ float: left;
+ margin-bottom: -1px;
+ border-bottom: 1px solid #e5e5e5;
+ cursor: pointer;
+ width: 13px;
+ padding-top: 26px;
}
-
.openo_accordion_ui-icon-expand {
- background: url(../images/collapse_arrow.png) right 20px no-repeat;
- margin-top: 8px;
+ background: url(../images/collapse_arrow.png) right 20px no-repeat;
+ margin-top: 8px;
}
-
-.openo_accordion_ui-icon-expand.current {
- background: url(../images/expand_arrow.png) right 20px no-repeat;
+.openo_accordion_ui-icon-expand.current{
+ background: url(../images/expand_arrow.png) right 20px no-repeat;
}
-
.openoAccordian_showHideArrow_hide, .openoAccordian_showHideArrow_show {
- display: block;
- position: absolute;
- right: 0;
- top: 4px;
- width: 18px;
- height: 41px;
- cursor: pointer;
- background-color: #f5f5f5;
+ display: block;
+ position: absolute;
+ right: 0;
+ top: 4px;
+ width: 18px;
+ height: 41px;
+ cursor: pointer;
+ background-color: #f5f5f5;
}
-
.openoAccordian_showHideArrow_hide {
- background-image: url(../images/openo.png);
- background-position: -7px 0 !important;
- border-collapse: separate;
- /*box-shadow: inset -1px 0 0 #e5e5e5;*/
+ background-image: url(../images/openo.png);
+ background-position: -7px 0!important;
+ border-collapse: separate;
+ /*box-shadow: inset -1px 0 0 #e5e5e5;*/
}
-
a.header.opened, a.header.closed {
- font-size: 16px;
- padding-top: 24px;
- padding-bottom: 25px;
- color: #999999;
+ font-size: 16px;
+ padding-top: 24px;
+ padding-bottom: 25px;
+ color: #999999;
}
-
.openoAccordian_accordionmenu .closed, .openoAccordian_accordionmenu .opened {
- padding-right: 10px;
- background-position: 98% 50%;
- background-repeat: no-repeat;
+ padding-right: 10px;
+ background-position: 98% 50%;
+ background-repeat: no-repeat;
}
-
.openoAccordian_accordionmenu li a {
- padding: 11px 10px 12px;
- color: #333333;
- margin-right: 1px;
- margin-top: -1px;
- text-align: left !important;
- font-family: "Microsoft Yahei", SimSun, Arial, Tahoma;
- font-size: 14px;
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
- border-top: 1px solid #e5e5e5;
- border-bottom: 1px solid #e5e5e5;
- /*height: 19px;*/
+ padding: 11px 10px 12px;
+ color: #333333;
+ margin-right: 1px;
+ margin-top: -1px;
+ text-align: left!important;
+ font-family: "Microsoft Yahei",SimSun,Arial,Tahoma;
+ font-size: 14px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+ border-top: 1px solid #e5e5e5;
+ border-bottom: 1px solid #e5e5e5;
+ /*height: 19px;*/
}
-
.openoAccordian_accordionmenu ul {
- margin: 0;
- padding: 0;
- overflow: hidden;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
}
-
.openoAccordian_accordionmenu a {
- display: block;
- text-decoration: none;
+ display: block;
+ text-decoration: none;
}
-
a {
- color: #428bca;
- text-decoration: none;
- background: 0 0;
+ color: #428bca;
+ text-decoration: none;
+ background: 0 0;
}
-
-.bar {
+.bar{
height: 834px;
width: 18px;
background: #f8f8f8;
display: none;
}
-
-.bar span {
+.bar span{
width: 13px;
height: 34px;
background-image: url(../images/openo.png);
- background-position: -39px 0 !important;
- display: block;
- /*margin-top: -430px;*/
+ background-position: -39px 0!important;
+ display: block;
+ /*margin-top: -430px;*/
}
-
-#accordionmenuid_ul_0_0_brAppTopMenuID_UL li {
+#accordionmenuid_ul_0_0_brAppTopMenuID_UL li{
cursor: pointer;
}
-
-#puer_base_openo {
+#puer_base_openo{
border: 1px solid #ddd;
}
-
.openo_accordion_selected {
- margin-left: 0;
- margin-right: 0;
- background: #fafafa;
- border-left: 3px solid #4ac9ff !important;
- box-shadow: none;
- position: relative;
+ margin-left: 0;
+ margin-right: 0;
+ background: #fafafa;
+ border-left: 3px solid #4ac9ff!important;
+ box-shadow: none;
+ position: relative;
}
-
-a:hover {
- color: #4ac9ff !important;
+a:hover{
+ color: #4ac9ff!important;
}
-
.openoAccordian_accordionmenu li.openo_accordion_selected a {
- position: relative;
- left: -3px;
- color: #009ae7;
+ position: relative;
+ left: -3px;
+ color: #009ae7;
}
-
.openo-accordion-resizable-handle {
- z-index: 1 !important;
- cursor: e-resize;
- width: 7px;
- right: -5px;
- top: 0;
- height: 100%;
- position: absolute;
- font-size: .1px;
- display: block;
+ z-index: 1!important;
+ cursor: e-resize;
+ width: 7px;
+ right: -5px;
+ top: 0;
+ height: 100%;
+ position: absolute;
+ font-size: .1px;
+ display: block;
}
-
#iframeContainer iframe {
- width: 100%;
- height: 100%;
- border: 0;
+ width: 100%;
+ height: 100%;
+ border: 0;
}
-
#accordionContent, #iframeContainer {
- margin: 0;
- padding: 0;
- border: 0;
- width: 100%;
- height: 100%;
+ margin: 0;
+ padding: 0;
+ border: 0;
+ width: 100%;
+ height: 100%;
}
-
.openoAccordian_showHideArrow_show {
- background-image: url(../images/openo.png);
- background-position: -39px 0 !important;
- box-shadow: inset 1px 0 0 #e5e5e5, inset -1px 0 0 #e5e5e5;
+ background-image: url(../images/openo.png);
+ background-position: -39px 0!important;
+ box-shadow: inset 1px 0 0 #e5e5e5,inset -1px 0 0 #e5e5e5;
}
\ No newline at end of file diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/VMMain.css b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/VMMain.css index a1c08668..48e82b59 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/VMMain.css +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/css/VMMain.css @@ -4,7 +4,7 @@ * 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
+ * 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,
@@ -13,202 +13,181 @@ * limitations under the License.
*/
-body {
+body{
font-family: '微软雅黑';
font-size: 12px;
color: #333;
background: #fafafa;
}
-
-button {
+button{
outline: none;
}
-
-ul, li {
+ul,li{
list-style: none;
- padding: 0;
- margin: 0;
+ padding:0;
+ margin:0;
}
-
-.titleFont {
+.titleFont{
font-size: 16px;
}
-
-.separator-line {
+.separator-line{
height: 1px;
width: 100%;
- border: 1px solid #ddd;
+ border:1px solid #ddd;
margin: 6px 0 15px 0;
}
-
-.uploadBtn {
+.uploadBtn{
overflow: hidden;
}
-
.creat-btn {
- padding: 0 14px;
- height: 24px;
+ padding: 0 14px;
+ height: 24px;
float: left;
cursor: pointer;
text-decoration: none;
outline: 0;
border: 1px solid #d3d3d3;
text-align: center;
- box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
+ box-shadow: 0 1px 1px rgba(0,0,0,.05);
background: #fafafa;
- background: -moz-linear-gradient(top, #fff, #fafafa);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100%, #fafafa));
- background: -webkit-linear-gradient(top, #fff, #fafafa);
- background: linear-gradient(to bottom, #fff, #fafafa);
+ background: -moz-linear-gradient(top,#fff,#fafafa);
+ background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(100%,#fafafa));
+ background: -webkit-linear-gradient(top,#fff,#fafafa);
+ background: linear-gradient(to bottom,#fff,#fafafa);
border-radius: 6px;
background: #fff url(../images/add.png) no-repeat 5px center;
padding-left: 20px;
}
-
.creat-btn:hover {
- color: #009ae7;
- border: 1px solid #4AC9FF
+ color: #009ae7;
+ border: 1px solid #4AC9FF
}
-
.creat-btn:active {
- color: #000;
- border: 1px solid #4AC9FF
+ color: #000;
+ border: 1px solid #4AC9FF
}
-/*.creat-btn{
- background: #fff url(../image/add.png) no-repeat 5px center;
- border: 1px solid #ddd;
- float: left;
+.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
+ color: #009ae7;
+ background-color: #fff;
+
}
-.creat-btn:hover{
- background: #428bca;
- color: #fff;
- border:1px solid #428bca;
-}*/
-.search {
+
+.search{
width: 310px;
height: 30px;
- float: right;
+ float:right;
}
-
-.search-text {
+.search-text{
width: 250px;
float: left;
margin-right: 6px;
}
-
-.search-btn {
+.search-btn{
height: 30px;
background: #fff;
border: 1px solid #ddd;
float: left;
}
-
-#ict_virtualApplication_table_div {
+#ict_virtualApplication_table_div{
margin-top: 15px;
}
-
-.table > thead > tr.active > th {
- border: 1px solid #ddd !important;
+.table>thead>tr.active>th{
+ border: 1px solid #ddd!important;
border-bottom: 0;
background: #f0f0f0;
}
-
/*.table tbody tr:hover{
background: #e6fbe0!important;
}*/
-.table tbody tr:last-child {
+.table tbody tr:last-child{
border-bottom: 1px solid #ddd;
}
-
-.table-btn {
+.table-btn{
border: 1px solid #ccc;
border-radius: 3px;
}
-
-.delete-btn {
+.delete-btn{
background: url(../image/delete.png) no-repeat;
width: 16px;
height: 16px;
border: none;
}
-
-.detail-btn {
+.detail-btn{
background: url(../image/openo.png) no-repeat -343px -283px;
width: 16px;
height: 16px;
border: none;
}
-
-.detail-btn.current {
+.detail-btn.current{
background-position: -7px -314px;
}
-.detail {
- height: 200px;
+.detail-top ul li:hover{
+ color: #4ac9ff;
+}
+.detail{
+
border: 1px solid #ddd;
margin-top: 60px;
+
}
-.detail-top ul {
- height: 50px;
- line-height: 50px;
+.detailModal{
+ height: 200px;
+ border: 1px solid #ddd;
+
+}
+
+.detail-top ul{
+ height: 30px;
+ line-height: 30px;
border-bottom: 1px solid #ddd;
padding-left: 0px;
- background: #fafafa;
+ background: #fafafa;
}
-
-.detail-top ul li {
- float: left;
+.detail-top ul li{
+ float:left;
width: 120px;
text-align: center;
border-right: 1px solid #ddd;
cursor: pointer;
}
-
-.detail-top ul li.current {
+.detail-top ul li.current{
background: #fff;
}
-
-.vmapp-margin {
+.vmapp-margin{
margin-bottom: 10px;
}
-
-.control-label .required {
+.control-label .required{
color: #e02222;
font-size: 12px;
padding-left: 2px;
}
-
-.form-group .control-label {
+.form-group .control-label{
font-size: 12px;
font-weight: 400;
}
-
-legend {
+legend{
font-size: 12px;
font-weight: bold;
}
-
-.pageGro {
+.pageGro{
width: 250px;
float: right;
}
-
-.pageUp, .pageDown, .pageList, .pageList li {
+.pageUp,.pageDown,.pageList,.pageList li{
float: left;
cursor: pointer;
}
-
-.pageUp, .pageDown {
+.pageUp,.pageDown{
width: 60px;
height: 30px;
border: 1px solid #ddd;
text-align: center;
line-height: 30px;
}
-
-.pageList li {
+.pageList li{
width: 30px;
height: 30px;
border: 1px solid #ddd;
@@ -216,543 +195,466 @@ legend { line-height: 30px;
border-left: none;
}
-
-.pageList li.active {
+.pageList li.active{
background: #428bca;
color: #fff;
border-color: #428bca;
}
-
-.pageDown {
+.pageDown{
border-left: none;
}
-
-.headerLinkP {
+.headerLinkP{
padding-top: 17px;
}
-
-.headerLinkP span {
+.headerLinkP span{
font-size: 12px;
color: #666;
- font-weight: normal !important;
+ font-weight: normal!important;
}
-
-label {
- font-weight: normal !important;
+label{
+ font-weight: normal!important;
}
-
table.userform tbody tr td {
- display: table-cell;
- padding-right: 10px;
- padding-top: 10px;
- font-size: 12px;
- color: #333;
+ display: table-cell;
+ padding-right: 10px;
+ padding-top: 10px;
+ font-size: 12px;
+ color: #333;
}
-
-.table th, .table td {
- padding-top: 3px !important;
- padding-bottom: 3px !important;
+.table th,.table td{
+ padding-top: 3px!important;
+ padding-bottom: 3px!important;
}
-
.openoBrowseButton_element {
- display: table;
+ display: table;
}
-
.openo {
- font-family: "Microsoft Yahei", SimSun, Arial, Tahoma;
- font-size: 12px;
- color: #000;
+ font-family: "Microsoft Yahei",SimSun,Arial,Tahoma;
+ font-size: 12px;
+ color: #000;
}
-
.openoBrowseButton_input {
- width: 198px;
- position: relative;
- border: 1px solid #c3c3c3 !important;
- height: 26px;
- background-color: #f3f3f3;
- border-radius: 4px 0 0 4px;
- border-right: none;
- padding: 0;
+ width: 198px;
+ position: relative;
+ border: 1px solid #c3c3c3!important;
+ height: 26px;
+ background-color: #f3f3f3;
+ border-radius: 4px 0 0 4px;
+ border-right: none;
+ padding: 0;
}
-
.buttonClassDefault, .buttonClassDefault:active {
- cursor: pointer;
- background-image: url(../images/openo.png);
- background-position: -154px -7px !important;
+ cursor: pointer;
+ background-image: url(../images/openo.png);
+ background-position: -154px -7px!important;
}
-
.openoBrowseButton_button {
- width: 27px;
- border: 0;
- float: right;
- position: relative;
- height: 26px;
- right: 0;
- top: 0;
- border-radius: 0 4px 4px 0;
- border-right: 1px solid #c3c3c3;
- border-left: none;
+ width: 27px;
+ border: 0;
+ float: right;
+ position: relative;
+ height: 26px;
+ right: 0;
+ top: 0;
+ border-radius: 0 4px 4px 0;
+ border-right: 1px solid #c3c3c3;
+ border-left: none;
}
-
.openo .openo-input, .openo.openo-input {
- outline: 0;
- border: 1px solid #c3c3c3;
- box-shadow: 1px 1px #f6f6f6 inset;
- background-color: #fff;
- height: 26px;
+ outline: 0;
+ border: 1px solid #c3c3c3;
+ box-shadow: 1px 1px #f6f6f6 inset;
+ background-color: #fff;
+ height: 26px;
}
-
.openoInput_openoDefaultText {
- padding: 0 0 0 6px;
- border-radius: 4px;
- color: #000;
- display: inline-block;
- outline: 0;
- box-shadow: 1px 1px #f6f6f6 inset;
- font-size: 12px;
- background: #fff;
+ padding: 0 0 0 6px;
+ border-radius: 4px;
+ color: #000;
+ display: inline-block;
+ outline: 0;
+ box-shadow: 1px 1px #f6f6f6 inset;
+ font-size: 12px;
+ background: #fff;
}
-
div.openo-select {
- border: 1px solid #c3c3c3;
- border-radius: 4px;
- background: url(../images/arrow-down-enable.png) right no-repeat #fff;
- line-height: 24px;
- padding-left: 3px;
- display: block;
-}
-
-div.openo-select > input.openo-select-input {
- border: none;
- outline: 0;
- line-height: 21px;
- height: 21px;
- padding-left: 3px;
- border-right: solid 1px #c3c3c3;
+ border: 1px solid #c3c3c3;
+ border-radius: 4px;
+ background: url(../images/arrow-down-enable.png) right no-repeat #fff;
+ line-height: 24px;
+ padding-left: 3px;
+ display: block;
+}
+div.openo-select>input.openo-select-input {
+ border: none;
+ outline: 0;
+ line-height: 21px;
+ height: 21px;
+ padding-left: 3px;
+ border-right: solid 1px #c3c3c3;
}
-
.openo .openo-ellipsis, .openo.openo-ellipsis {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
}
-
a.openoButton_buttonClass, a.openoButton_buttonDisableClass, div.openoButton_buttonClass, div.openoButton_buttonDisableClass {
- height: 26px;
- float: left;
- cursor: pointer;
- text-decoration: none;
- outline: 0;
- border: 1px solid #d3d3d3;
- text-align: center;
- box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
- background: #fafafa;
- background: -moz-linear-gradient(top, #fff, #fafafa);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100%, #fafafa));
- background: -webkit-linear-gradient(top, #fff, #fafafa);
- background: linear-gradient(to bottom, #fff, #fafafa);
- border-radius: 6px;
-}
-
-.openoButton_buttonInnerClass {
- padding: 0 19px;
- border-radius: 6px;
+ height: 26px;
+ float: left;
+ cursor: pointer;
+ text-decoration: none;
+ outline: 0;
+ border: 1px solid #d3d3d3;
+ text-align: center;
+ box-shadow: 0 1px 1px rgba(0,0,0,.05);
+ background: #fafafa;
+ background: -moz-linear-gradient(top,#fff,#fafafa);
+ background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(100%,#fafafa));
+ background: -webkit-linear-gradient(top,#fff,#fafafa);
+ background: linear-gradient(to bottom,#fff,#fafafa);
+ border-radius: 6px;
+}
+.openoButton_buttonInnerClass{
+ padding: 0 19px;
+ border-radius: 6px;
}
-
.openoButton_buttonCenterText {
- color: #000;
- line-height: 24px;
- white-space: nowrap;
- width: auto !important;
+ color: #000;
+ line-height: 24px;
+ white-space: nowrap;
+ width: auto!important;
}
-
.userHeader {
- clear: left;
- overflow: hidden;
- margin-bottom: 10px;
- padding: 10px 10px 0px 0px;
+ clear: left;
+ overflow: hidden;
+ margin-bottom: 10px;
+ padding: 10px 10px 0px 0px;
}
-
.openoButton_buttonGroupClass {
- display: inline;
+ display: inline;
}
-
.openoButton_buttonGroupClass div.openoButton_buttonClass_parent:first-child {
- margin-left: 0;
+ margin-left: 0;
}
-
.openoButton_buttonLeftImg {
- margin-right: 5px;
+ margin-right: 5px;
}
-
.openoButton_buttonLeftImg, .openoButton_buttonRightImg {
- display: inline-block;
- vertical-align: top;
- width: 16px;
- height: 16px;
- margin-top: 4px;
+ display: inline-block;
+ vertical-align: top;
+ width: 16px;
+ height: 16px;
+ margin-top: 4px;
}
-
.openo-table-pagination-wrapper {
- height: 37px;
+ height: 37px;
}
-
.openo-pagination {
- display: block;
- float: left;
- overflow: hidden;
- padding: 5px 0 0;
- margin-top: 8px;
+ display: block;
+ float: left;
+ overflow: hidden;
+ padding: 5px 0 0;
+ margin-top: 8px;
}
-
.openoPagination_openoPaginationLengthOptions:not(msie8) {
- line-height: 24px;
+ line-height: 24px;
}
-
.openoPagination_openoPaginationLengthOptions {
- white-space: normal;
- height: 24px;
- float: left;
- outline: 0;
- line-height: 20px;
- margin: 0 5px;
+ white-space: normal;
+ height: 24px;
+ float: left;
+ outline: 0;
+ line-height: 20px;
+ margin: 0 5px;
}
-
.openo-pagination-select {
- height: 26px;
- line-height: 22px;
- text-align: center;
- margin-right: -2px;
- border: 1px solid #e0e0e0;
- border-radius: 5px 0 0 5px;
- padding: 1px;
+ height: 26px;
+ line-height: 22px;
+ text-align: center;
+ margin-right: -2px;
+ border: 1px solid #e0e0e0;
+ border-radius: 5px 0 0 5px;
+ padding: 1px;
}
-
.openoPagination_openoPaginationLengthOptions span {
- background-color: #fff !important;
+ background-color: #fff!important;
}
-
.openo-pagination-theme a, .openo-pagination-theme span {
- float: left;
- color: #666;
- font: 12px Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
- line-height: 24px;
- font-weight: 400;
- text-align: center;
- border: 1px solid #e0e0e0;
- text-decoration: none !important;
- padding: 0 7px;
- border-radius: 3px;
- background: #fff;
+ float: left;
+ color: #666;
+ font: 12px Lucida Grande,Verdana,Arial,Helvetica,sans-serif;
+ line-height: 24px;
+ font-weight: 400;
+ text-align: center;
+ border: 1px solid #e0e0e0;
+ text-decoration: none!important;
+ padding: 0 7px;
+ border-radius: 3px;
+ background: #fff;
}
-
.openo-pagination-selectspan {
- background: url(../images/ideo_default_select.png) left no-repeat !important;
- float: right !important;
- width: 26px;
- height: 26px;
- cursor: pointer;
+ background: url(../images/ideo_default_select.png) left no-repeat!important;
+ float: right!important;
+ width: 26px;
+ height: 26px;
+ cursor: pointer;
}
-
.openo-pagination-theme label {
- padding-top: 6px;
- vertical-align: middle;
- margin-right: 20px;
- margin-top: -1px;
- float: left;
- display: inline-block;
- height: 20px;
- font: 12px Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
+ padding-top: 6px;
+ vertical-align: middle;
+ margin-right: 20px;
+ margin-top: -1px;
+ float: left;
+ display: inline-block;
+ height: 20px;
+ font: 12px Lucida Grande,Verdana,Arial,Helvetica,sans-serif;
}
-
.openo-pagination li, .openo-pagination ul {
- list-style: none;
- padding: 0;
- margin: 0;
- float: left;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ float: left;
}
-
dd, dl, dt, li {
- color: #000;
+ color: #000;
}
-
.openo-pagination-theme a, .openo-pagination-theme span.current {
- margin: 0 5px 0 0;
+ margin: 0 5px 0 0;
}
-
.openo .openo-disabled, .openo.openo-disabled {
- border-color: #c3c3c3 !important;
- color: #666 !important;
- opacity: .3;
- filter: alpha(opacity=30);
+ border-color: #c3c3c3!important;
+ color: #666!important;
+ opacity: .3;
+ filter: alpha(opacity=30);
}
-
.openo-pagination-theme .prev {
- background: 0 0;
- float: left;
+ background: 0 0;
+ float: left;
}
-
.openo-pagination-theme .current {
- text-decoration: none !important;
- float: left;
- padding-left: 6px;
- height: 24px;
- color: #fff;
- display: inline;
- border-color: #00adf5;
- background: #4ad2ff;
+ text-decoration: none!important;
+ float: left;
+ padding-left: 6px;
+ height: 24px;
+ color: #fff;
+ display: inline;
+ border-color: #00adf5;
+ background: #4ad2ff;
}
-
.openo-pagination-theme a, .openo-pagination-theme span {
- float: left;
- color: #666;
- font: 12px Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
- line-height: 24px;
- font-weight: 400;
- text-align: center;
- border: 1px solid #e0e0e0;
- text-decoration: none !important;
- padding: 0 7px;
- border-radius: 3px;
- background: #fff;
+ float: left;
+ color: #666;
+ font: 12px Lucida Grande,Verdana,Arial,Helvetica,sans-serif;
+ line-height: 24px;
+ font-weight: 400;
+ text-align: center;
+ border: 1px solid #e0e0e0;
+ text-decoration: none!important;
+ padding: 0 7px;
+ border-radius: 3px;
+ background: #fff;
}
-
.openo-pagination-theme .prev.openo-disabled:before {
- background: url(../images/page_left_disabled.png) 50% 45% no-repeat;
+ background: url(../images/page_left_disabled.png) 50% 45% no-repeat;
}
-
.openo-pagination-theme .prev.openo-disabled:before {
- background: url(../images/page_left_disabled.png) 50% 45% no-repeat;
+ background: url(../images/page_left_disabled.png) 50% 45% no-repeat;
}
-
.openo-pagination-theme .prev:before {
- background: url(../images/page_l.png) 50% 45% no-repeat;
+ background: url(../images/page_l.png) 50% 45% no-repeat;
}
-
.openo-pagination-theme .next:after, .openo-pagination-theme .prev:before {
- display: inline-block;
- content: "";
- vertical-align: middle;
- width: 10px;
- height: 24px;
+ display: inline-block;
+ content: "";
+ vertical-align: middle;
+ width: 10px;
+ height: 24px;
}
-
.openo-pagination-theme .prev:before {
- background: url(../images/page_l.png) 50% 45% no-repeat;
+ background: url(../images/page_l.png) 50% 45% no-repeat;
}
-
.openo-pagination-theme .next:after, .openo-pagination-theme .prev:before {
- display: inline-block;
- content: "";
- vertical-align: middle;
- width: 10px;
- height: 24px;
+ display: inline-block;
+ content: "";
+ vertical-align: middle;
+ width: 10px;
+ height: 24px;
}
-
pagination ul {
- list-style: none;
- padding: 0;
- margin: 0;
- float: left;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ float: left;
}
-
.openo-pagination li, .openo-pagination ul {
- list-style: none;
- padding: 0;
- margin: 0;
- float: left;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ float: left;
}
-
.openoPagination_gototext {
- background: #FFF;
- outline: 0;
- width: 29px;
- float: left;
- height: 26px;
- line-height: 24px;
- border-radius: 4px;
- border: 1px solid #c3c3c3;
- padding: 0 0 0 5px;
- margin: 0;
- color: #666;
- min-width: 50px;
+ background: #FFF;
+ outline: 0;
+ width: 29px;
+ float: left;
+ height: 26px;
+ line-height: 24px;
+ border-radius: 4px;
+ border: 1px solid #c3c3c3;
+ padding: 0 0 0 5px;
+ margin: 0;
+ color: #666;
+ min-width: 50px;
}
-
.openoPagination_gotoimage {
- width: 29px;
- height: 26px;
- line-height: 26px;
- background-color: #FFF;
- background-image: url(/portal/themes/default/components/openo/images/openo.png);
- padding-left: 21px;
- float: left;
- margin-left: 5px;
- border: 1px solid #e0e0e0;
- border-radius: 4px;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- background-position: -184px -181px !important;
+ width: 29px;
+ height: 26px;
+ line-height: 26px;
+ background-color: #FFF;
+ background-image: url(/portal/themes/default/components/openo/images/openo.png);
+ padding-left: 21px;
+ float: left;
+ margin-left: 5px;
+ border: 1px solid #e0e0e0;
+ border-radius: 4px;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ background-position: -184px -181px!important;
}
-
.openo-pagination-theme .ellipse {
- float: left;
- margin-left: -8px;
- margin-right: -4px;
- background: 0 0;
- border: none;
- border-radius: 0;
- box-shadow: none;
- font-weight: 700;
- cursor: default;
+ float: left;
+ margin-left: -8px;
+ margin-right: -4px;
+ background: 0 0;
+ border: none;
+ border-radius: 0;
+ box-shadow: none;
+ font-weight: 700;
+ cursor: default;
}
-
.openo.openo-disabled {
- border-color: #c3c3c3 !important;
- color: #666 !important;
- opacity: .3;
- filter: alpha(opacity=30);
+ border-color: #c3c3c3!important;
+ color: #666!important;
+ opacity: .3;
+ filter: alpha(opacity=30);
}
-
.openo-pagination-theme .prev {
- background: 0 0;
- float: left;
+ background: 0 0;
+ float: left;
}
-
.openo-pagination-theme .current {
- text-decoration: none !important;
- float: left;
- padding-left: 6px;
- height: 26px;
- color: #fff;
- display: inline;
- /*border-color: #00adf5;
- background: #4ad2ff;*/
+ text-decoration: none!important;
+ float: left;
+ padding-left: 6px;
+ height: 26px;
+ color: #fff;
+ display: inline;
+ /*border-color: #00adf5;
+ background: #4ad2ff;*/
border: 1px solid #e0e0e0;
}
-
.openo-pagination-theme .next:after {
- background: url(../images/page_r.png) 50% 45% no-repeat;
+ background: url(../images/page_r.png) 50% 45% no-repeat;
}
-
.openoButton_buttonGroupClass div.openoButton_buttonClass_parent, .openoButton_buttonRightImg {
- margin-left: 5px;
+ margin-left: 5px;
}
html, body {
- height: 99%;
- width: 98%;
+ height: 99%;
+ width: 98%;
}
-
.cotentBody {
- padding: 0px 20px 0px 20px;
+ padding: 0px 20px 0px 20px;
}
div.openoButton_buttonClass:hover {
- border: 1px solid #4ac9ff;
+ border: 1px solid #4ac9ff;
}
-
div.openoButton_button_default:hover .openoButton_buttonCenterText {
- color: #009ae7;
+ color: #009ae7;
}
-
.header_lineimg {
- height: 1px;
- width: 100%;
- margin-top: 17px;
+ height: 1px;
+ width: 100%;
+ margin-top: 17px;
}
-
.openo.openo-hide {
- display: none;
+ display: none;
}
-
div.openo-select-popup-container {
- position: absolute;
- border: 1px solid #4ac9ff;
- border-top: none;
- border-radius: 0 0 4px 4px;
- max-height: 202px;
- overflow-y: auto;
- background-color: #fff;
- z-index: 880;
-}
-
-div.openo-select-popup-container > div.openo-select-item {
- display: block;
+ position: absolute;
+ border: 1px solid #4ac9ff;
+ border-top: none;
+ border-radius: 0 0 4px 4px;
+ max-height: 202px;
+ overflow-y: auto;
+ background-color: #fff;
+ z-index: 880;
+}
+div.openo-select-popup-container>div.openo-select-item {
+ display: block;
}
-
.openo .openo-ellipsis, .openo.openo-ellipsis {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
}
-
-div.openo-select-popup-container > div.openo-select-item > label {
- padding-top: 3px;
- padding-bottom: 3px;
- line-height: 20px;
+div.openo-select-popup-container>div.openo-select-item>label {
+ padding-top: 3px;
+ padding-bottom: 3px;
+ line-height: 20px;
}
-
.openo .openo-ellipsis, .openo.openo-ellipsis {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
}
-
.openo-select-item label {
- margin-left: 4px;
- margin-right: 4px;
- white-space: nowrap;
+ margin-left: 4px;
+ margin-right: 4px;
+ white-space: nowrap;
}
-
-div.openo-select-popup-container > div.openo-select-item.openo-item-selected, div.openo-select-popup-container > div.openo-select-item:hover {
- background-color: #f1f1f1;
- color: #008fd6;
+div.openo-select-popup-container>div.openo-select-item.openo-item-selected, div.openo-select-popup-container>div.openo-select-item:hover {
+ background-color: #f1f1f1;
+ color: #008fd6;
}
-
div.openo-select.openo-focus {
- border: 1px solid #4ac9ff;
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
- border-bottom-color: #ddd;
+ border: 1px solid #4ac9ff;
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+ border-bottom-color: #ddd;
}
-
.openo-pagination-theme a:hover {
- border-color: #4ac9ff;
- cursor: pointer;
+ border-color: #4ac9ff;
+ cursor: pointer;
}
-
-.SDBtn {
- background: #fff;
- color: #333;
- border: 1px solid #ddd;
+.SDBtn{
+ background: #fff;
+ color: #333;
+ border: 1px solid #ddd;
}
-
-.SDBtn:hover {
+.SDBtn:hover{
color: #009ae7;
- border: 1px solid #4AC9FF
+ border: 1px solid #4AC9FF
}
-
-table tbody tr.even:hover td, table tbody tr.odd:hover td {
- background-color: #e6fbe0;
-}
-
+/*table tbody tr.even:hover td, table tbody tr.odd:hover td {
+ background-color: #e6fbe0;
+}*/
table tr.openoTable_row_selected td {
- background: #e8f8fe !important;
- border-bottom: 1px solid #e8e8e8 !important;
+ background: #e8f8fe!important;
+ border-bottom: 1px solid #e8e8e8!important;
}
-
-.modal-body {
- padding: 0 !important;
+.modal-body{
+ padding: 0!important;
}
-
-.form-control {
- height: 26px !important;
+.form-control{
+ height: 26px!important;
}
-
.form-group .control-label {
- margin-left: 20px;
+ margin-left: 20px;
}
.form-horizontal .control-label {
- text-align: left;
+ text-align: left;
}
\ No newline at end of file diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/gsolcmmain.html b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/gsolcmmain.html index 507a8904..b373f3ae 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/gsolcmmain.html +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/gsolcmmain.html @@ -28,14 +28,50 @@ <script type="text/javascript" src="js/rest.js"></script>
<script type="text/javascript" src="js/bootstrap-table.min.js"></script>
<script type="text/javascript" src="js/gsolcm.js"></script>
+ <script type="text/javascript" src="js/jquery-ui-1.12.1.min.js">
+ </script>
+ <link href="css/jquery-ui-1.12.1.min.css" rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function () {
- var jsondata = [];
- //jsondata = loadNeData();
+ var url = "";
+ /* $('.modal-content').resizable({
+
+ minHeight: 300,
+ minWidth: 300
+ });*/
+ $('.modal-dialog').draggable();
+ $("#detailCont").show();
+ var jsondata = loadGetServiceData(url);
$('#sai').bootstrapTable({
//Assigning data to table
data: jsondata
});
+ $('.table tbody tr').click(function() {
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');
+ })
+
+ $('.detail-top ul li').click(function() {
+ $(this).addClass('current').siblings().removeClass('current');
+ });
+ $("#topoCont").hide();
+ $("#inpCont").hide();
+ $("#topoContMod").hide();
+ $("#detailContMod").show();
+ $("#inpContMod").hide();
+
+ $('#sai').bootstrapTable({}) .on('click-row.bs.table', function (e, row, $element) {
+ var newURL = "accorTables.html?serviceId="+row.serviceId;
+ console.log("URL: "+newURL);
+ document.getElementById("tabContainer").style.display = "none";
+ document.getElementById("detailConObj").setAttribute('data', newURL);
+ document.getElementById("detailContMod").setAttribute('data', newURL);
+ document.getElementById("tabContainer").style.display = "block";
+
+ //loadIframe("topoFrame", "chartTopo.html?serviceId="+row.serviceId);
+ document.getElementById("topoCont").setAttribute('data', 'chartTopo.html?serviceId='+row.serviceId);
+ document.getElementById('inputcontent').setAttribute('data', 'inputData.html?json='+ JSON.stringify(row));
+ document.getElementById('inputcontentDlg').setAttribute('data', 'inputData.html?json='+ JSON.stringify(row));
+ });
new lcmHandler();
});
@@ -43,7 +79,13 @@ return [
'<img class="siteDeleteImg" src="images/delete.png" href="javascript:void(0)" style="cursor: pointer" name="title" title="Delete" />'
].join('');
-
+ }
+
+ function operateFormatterServiceName(value, row, index){
+ var temp = row.serviceId;
+ return [
+ '<a data-toggle="modal" href="#ModifyModal" style="text-decoration:underline" onclick="return anchorClick(' + temp + ')">' + value + '</a>'
+ ].join('');
}
window.operateEvents = {
'click .siteDeleteImg': function (e, value, row, index) {
@@ -52,12 +94,122 @@ }
};
+ function hideBasic() {
+ $("#basicInfoTab").hide();
+ }
+
+ function showBasic() {
+ $("#basicInfoTab").show();
+ }
+
+ function showTopoCont() {
+ $("#topoCont").show();
+ $("#detailCont").hide();
+ $("#inpCont").hide();
+ }
+
+ function showDetCont() {
+ $("#topoCont").hide();
+ $("#detailCont").show();
+ $("#inpCont").hide();
+ }
+
+ function showInpCont() {
+ $("#topoCont").hide();
+ $("#detailCont").hide();
+ $("#inpCont").show();
+ }
+
+ function showTopoContMod() {
+ $("#topoContMod").show();
+ $("#detailContMod").hide();
+ $("#inpContMod").hide();
+ }
+
+ function showDetContMod() {
+ $("#topoContMod").hide();
+ $("#detailContMod").show();
+ $("#inpContMod").hide();
+ }
+
+ function showInpContMod() {
+ $("#topoContMod").hide();
+ $("#detailContMod").hide();
+ $("#inpContMod").show();
+ }
+
+ function loadIframe(iframeName, url) {
+ var $iframe = $('#' + iframeName);
+ if ( $iframe.length ) {
+ $iframe.attr('src',url);
+ $iframe.style.height = "400px";
+ return false;
+ }
+ return true;
+ }
</script>
+ <style>
+ .nav-tabs {
+ border-bottom-style: none;
+ }
+ .mT15 {
+ margin-top: 15px;
+ }
+ .fixed-table-container tbody td .th-inner,
+ .fixed-table-container thead th .th-inner {
+ line-height: 4px;
+ }
+ .fixed-table-pagination .pagination-info {
+ display: none !important;
+ }
+ .table tbody tr:hover td,
+ .table tbody tr.odd:hover td {
+ background-color: #e6fbe0 !important;
+ }
+ /*.fixed-table-pagination .page-list{display:inline-block !important}*/
+ /*.detail-top ul{
+ background:#F8F6F6 !important;
+ }*/
+
+ .detail {
+ border-top-style: none;
+ }
+ .btn {
+ padding: 4px;
+ }
+ #ModifyModal .modal-dialog {
+ width: 1100px;
+ }
+ #vmAppDialog .modal-dialog {
+ width: 630px;
+ }
+ #ModifyModal .modal-dialog body {
+ margin: 10px;
+ }
+ .dropdown-menu {
+ min-width: 10px;
+ }
+ .nav-tabs.nav-justified>.active>a,
+ .nav-tabs.nav-justified>.active>a:hover,
+ .nav-tabs.nav-justified>.active>a:focus {
+ border-left: 1px solid #4AC9FF;
+ border-right: 1px solid #4AC9FF;
+ border-top: 1px solid #4AC9FF;
+ border-right: 1px solid #4AC9FF
+ }
+ .nav-tabs.nav-justified>li>a {
+ border-bottom: 1px solid #4AC9FF;
+ border-radius: 4px 4px 0 0
+ }
+ .clearfix {
+ display: none;
+ }
+ </style>
</head>
<body id="open_base_site_cotentBody" class="cotentBody ng-scope">
<div class="container-fluid ms-controller">
<h3> Life Cycle Manager </h3>
-
+ <div class="separator-line"></div>
<div class="uploadBtn">
<div id="open_base_tpL_userHeader" class="userHeader">
<div id="open_base_tpL_buttonGroup" class="openoButton_buttonGroupClass">
@@ -77,64 +229,57 @@ </div>
<div class="row-fluid" data-name="table_zone">
- <div id="ict_virtualApplication_table_div">
+ <div id='ict_virtualApplication_table_div'>
<div>
<div class="top">
- <table id="sai" data-pagination="true" data-page-size="5" data-pagination-first-text="First"
- data-pagination-pre-text="Previous" data-pagination-next-text="Next"
- data-pagination-last-text="Last">
- <thead id="soverlayTable_thead" class="openo-table-thead">
- <tr class="active">
- <!--<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayName" data-sortable="true">
- <div class="openo-table-th-border"></div>
- <div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayName_sorticon" class="openo-table-th-sorticon overflow_elip openoTable_sortable leftHeaderAlign openo-table-disable-element">Service ID
- </span>
- </div>
- </th>-->
+ <table class="table table-striped" id="sai" data-pagination="true" data-page-size="5"
+ data-pagination-first-text="First" data-pagination-pre-text="Previous"
+ data-pagination-next-text="Next" data-pagination-last-text="Last">
+ <thead id="soverlayTable_thead" class="openo-table-thead" style="background:#ECECEC">
+ <tr class="active" style="background:#D9D6D5">
+
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
- data-field="overlayDesc" data-sortable="true">
+ data-formatter="operateFormatterServiceName" data-field="serviceName"
+ data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayDesc_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Service Name
- </span></div>
+ <span id="overlayDesc_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Service Name
+ </span>
+ </div>
</th>
+
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
- data-field="overlayThincCPE" data-sortable="true">
+ data-field="templateName" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayThincCPE_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Template Name
- </span></div>
+ <span id="overlayThincCPE_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Template Name
+ </span>
+ </div>
</th>
- <!--<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayPortVlanID" data-sortable="true">
- <div class="openo-table-th-border"></div><div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayPortVlanID_sorticon" class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Service Type
- </span></div></th> -->
- <th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
- data-field="overlayDCName" data-sortable="true">
+
+ <!-- th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayDCName" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayDCName_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Service Instruction </span>
+ <span id="overlayDCName_sorticon" class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Service Instruction </span>
</div>
- </th>
+ </th -->
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
- data-field="overlayVPC" data-sortable="true">
+ data-field="createTime" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayVPC_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Create Time
+ <span id="overlayVPC_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Create Time
</span>
</div>
</th>
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
- data-field="overlayVPCCIDR" data-sortable="true">
+ data-field="creator" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayVPCCIDR_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Creator
+ <span id="overlayVPCCIDR_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Creator
</span>
</div>
</th>
@@ -150,97 +295,234 @@ </tr>
</thead>
+ <tbody>
+
+
+ </tbody>
+
</table>
</div>
</div>
</div>
</div>
- <!-- <div id="tpListopenotable_pagination_wrapper" class="openo-table-pagination-wrapper" style="display: block;"><div class="pagination-container openo-pagination-theme openo-pagination"><div class="openoPagination_openoPaginationLengthOptions" id="tpListopenotable_wrapper_div"><input readonly="true" class="openo-pagination-select openopaginationselect" value="" id="tpListopenotable_wrapper_input" actualval="20" style="width: 32px;"><span class="openo-pagination-selectspan openopaginationselectspan" id="tpListopenotable_wrapper_trigger"></span></div><label style="display: block;float:left;">Total records: 23</label><li class="active"><span class="current prev openo-disabled" id="tpListopenotable_wrapper_prev"> </span></li><ul><li class="active"><span class="current" id="tpListopenotable_wrapper_page_link_1">1</span></li><li><a class="page-link" id="tpListopenotable_wrapper_page_link_2">2</a></li><li><a class="page-link" id="tpListopenotable_wrapper_page_link_3">3</a></li><li><a class="page-link next" id="tpListopenotable_wrapper_next"> </a></li></ul></div></div> -->
- <div id="vmAppDialog" class="modal fade" tabindex="-1" role="dialog"
- aria-labelledby="myModalLabel" aria-hidden="false">
+ <div id="ModifyModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
+ aria-hidden="false">
<div class="modal-dialog">
<div class="modal-content">
- <div class="content">
+ <div class="content" style="background:#fafafa;">
<div class="modal-header">
- <button type="button" class="close" data-dismiss="modal"
- aria-hidden="true">×
+ <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
</button>
- <h4 class="modal-title" id="myModalLabel">
- <span>Create</span>
+ <h4 class="modal-title" id="">
+ <span>Service Info</span>
</h4>
</div>
- <form class="form-horizontal" role="form" id="neForm">
- <div id="wizard">
- <div class="modal-body">
- <ul class="nav nav-pills nav-justified vmapp-margin">
-
- </ul>
- <div class="tab-content">
- <ul class="nav nav-tabs">
- <li class="active"><a id="basicInfoTab" href="#basicTab" data-toggle="tab">Basic
- Info</a></li>
- <li><a id="parameterTabHeader" href="#parameterTab" data-toggle="tab">Template
- Parameters</a></li>
- </ul>
- <div id="myTabContent" class="tab-content">
- <div class="tab-pane active" id="basicTab">
- <div class="form-group" ms-class="has-error:vmAppDialog.name==''">
- <label class="col-sm-3 control-label">
- <span>Service Name</span>
- <span class="required">*</span>
- </label>
- <div class="col-sm-7">
- <input type="text" id="svcName" name="svcName" class="form-control"
- placeholder="Service Name"/>
- </div>
- </div>
- <div class="form-group">
- <label class="col-sm-3 control-label">
- <span>Service Description</span>
- </label>
- <div class="col-sm-7">
- <input type="text" id="svcDesc" name="svcDesc" class="form-control"
- placeholder="Service Description"/>
- </div>
- </div>
- <div class="form-group" ms-class="has-error:vmAppDialog.name==''">
- <label class="col-sm-3 control-label">
- <span>Service Template</span>
- <span class="required">*</span>
- </label>
- <div class="col-sm-7">
- <select class="form-control"
- style="padding-top: 0px;padding-bottom: 0px;" id="svcTempl"
- name="svcTempl">
- <option value="1.1">1.1</option>
- <option value="1.2">1.2</option>
- </select>
- </div>
- </div>
- </div>
- <div class="tab-pane" id="parameterTab">
-
- </div>
- </div>
- </div>
+
+ <div class="detail" style="margin:10px;border-radius:5px;">
+ <div class="detail-top" style="margin-top:10px;border-radius:5px;">
+ <ul class="nav nav-tabs nav-justified vmapp-margin">
+ <li class="active basic">
+ <a href="#" onClick="showDetContMod();" id="" data-toggle="tab">
+ <span>Detail Info</span>
+ </a>
+ </li>
+ <li class="">
+ <a href="#" onclick="showTopoContMod();" data-toggle="tab">
+ <span>Topo</span>
+ </a>
+ </li>
+ <li class="">
+ <a href="#" onclick="showInpContMod();" data-toggle="tab">
+ <span>Input Data</span>
+ </a>
+ </li>
+ </ul>
+
+ <div id="detailContMod">
+ <object data="accorTables.html" width="100%" height="300" type="text/html">
+
+ </object>
+ </div>
+ <div id="topoContMod" style="display:none;">
+ <object data="chartTopo.html" width="100%" height="300" type="text/html">
+
+ </object>
+ <!--<iframe id="topoFrame" src="chartTopo.html" name="" style="width:100%; height:400px;" allowTransparency="true" scrolling="no" frameborder="0">
+ </iframe>-->
</div>
- <div class="modal-footer">
- <button type="button" class="btn SDBtn" data-dismiss="modal" aria-hidden="true"
- id="createNS">
- <span id="nfv-virtualApplication-iui-text-cancelBtn">OK</span>
- </button>
- <button type="button" class="btn button-previous SDBtn">
- <span id="nfv-virtualApplication-iui-text-previousBtn">Cancel</span>
- </button>
+ <div id="inpContMod" style="display:none;">
+ <object id="inputcontentDlg" data="inputData.html" width="100%" height="300"
+ type="text/html">
+ </object>
+ <!--<iframe src="inputData.html" name="" style="width:100%" allowTransparency="true" scrolling="no" frameborder="0">
+ </iframe>
+ </iframe>-->
</div>
+
</div>
- </form>
+ <div class="detail-bottom"></div>
+
+ </div>
+ <div class="modal-footer">
+ <button type="button" style="width:80px;" class="btn SDBtn" data-dismiss="modal"
+ aria-hidden="true" id="">
+ <span id="nfv-virtualApplication-iui-text-cancelBtn">OK</span>
+ </button>
+ <button data-dismiss="modal" style="width:80px;" type="button"
+ class="btn button-previous SDBtn">
+ <span id="nfv-virtualApplication-iui-text-previousBtn">Cancel</span>
+ </button>
+
+ </div>
+ </br>
+
</div>
</div>
</div>
</div>
+
+ <div style="padding-top:20px;"></div>
+
+ <div id="tabContainer" class="detail" style="border-radius:5px;display: none">
+ <div class="detail-top" style="margin-top:2px;border-radius:5px;">
+ <ul class="nav nav-tabs nav-justified vmapp-margin">
+
+ <li class="active basic">
+ <a href="#" onClick="showDetCont();" id="detHov" data-toggle="tab">
+ <span>Detail Info</span>
+ </a>
+ </li>
+
+ <li class="">
+ <a href="#" onclick="showTopoCont();" data-toggle="tab">
+ <span>Topo</span>
+ </a>
+ </li>
+
+ <li class="">
+ <a href="#" onclick="showInpCont();" data-toggle="tab">
+ <span>Input Data</span>
+ </a>
+ </li>
+
+ </ul>
+ </div>
+
+ <div style="border-radius:5px;">
+ <div id="detailCont" style="display:none;">
+
+ <object id="detailConObj" data="accorTables.html" width="100%" height="300" type="text/html">
+
+ </object>
+ </div>
+ <div id="topoCont" style="display:none;">
+ <!--<iframe src="chartTopo.html" name="" style="width:100%" allowTransparency="true" scrolling="no" frameborder="0">
+ </iframe>-->
+ <object data="chartTopo.html" width="100%" height="300" type="text/html">
+
+ </object>
+ </div>
+ <div id="inpCont" style="display:none;">
+ <object id="inputcontent" src="inputData.html" width="100%" height="300" type="text/html">
+ </object>
+ </div>
+ </div>
+
+ </div>
+
+</div>
+</br>
+
+<div id="vmAppDialog" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="content">
+ <div class="modal-header" style="margin-bottom: 15px;">
+ <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×
+ </button>
+ <h4 class="modal-title" id="myModalLabel">
+ <span>Create</span>
+ </h4>
+ </div>
+ <form class="form-horizontal" role="form" id="neForm">
+ <div id="wizard">
+ <div class="modal-body">
+
+ <ul class="nav nav-tabs nav-justified vmapp-margin">
+ <li class="active basic">
+ <a href="#basicTab" style="margin-left:1px;" onclick="showBasic();" id="basicTab"
+ data-toggle="tab">
+ <span>Base</span>
+ </a>
+ </li>
+ <li style="padding-right:2px;" class="para">
+ <a href="#" onclick="hideBasic();" data-toggle="tab">
+ <span>Template Parameters</span>
+ </a>
+ </li>
+
+ </ul>
+
+ <div id="basicInfoTab">
+ <div class="mT15 form-group" style="margin-left:25px;"
+ ms-class="has-error:vmAppDialog.name==''">
+ <label class="col-sm-3 control-label">
+ <span>Service Name</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <input type="text" id="svcName" name="svcName" class="form-control"
+ placeholder="Service Name" maxlength="256"/>
+ </div>
+ </div>
+ <div class="mT15 form-group" style="margin-left:25px;"
+ ms-class="has-error:vmAppDialog.name==''">
+ <label class="col-sm-3 control-label">
+ <span>Service Description</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <input type="text" id="" name="" class="form-control"
+ placeholder="Service Description" maxlength="256"/>
+ </div>
+ </div>
+
+ <div class="form-group" style="margin-left:25px;margin-bottom:15px;"
+ ms-class="has-error:vmAppDialog.name==''">
+ <label class="col-sm-3 control-label">
+ <span>Service Template</span>
+ <span class="required">*</span>
+ </label>
+ <div class="col-sm-7">
+ <select class="form-control" style="padding-top: 0px;padding-bottom: 0px;"
+ id="svcTempl" name="svcTempl">
+ <option value="select">--select--</option>
+ <option value="1.1">1.1</option>
+ <option value="1.2">1.2</option>
+ </select>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ <div class="modal-footer">
+ <button type="button" style="width:80px;" class="btn SDBtn" data-dismiss="modal"
+ aria-hidden="true" id="createNS">
+ <span id="nfv-virtualApplication-iui-text-cancelBtn">OK</span>
+ </button>
+ <button type="button" style="width:80px;" class="btn button-previous SDBtn">
+ <span id="nfv-virtualApplication-iui-text-previousBtn">Cancel</span>
+ </button>
+
+ </div>
+ </div>
+ </form>
+ </div>
+ </div>
+ </div>
+</div>
</div>
<div id="filterTpLogicalType_select_popupcontainer" class="openo openo-select-popup-container openo-hide"
style="width: 155px; max-height: 130px; left: 628px; top: 104px; z-index: 1761;">
diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/js/rest.js b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/js/rest.js index 680ad113..bc4d216a 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/js/rest.js +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/js/rest.js @@ -78,4 +78,79 @@ $(function () { return o;
};
-})
\ No newline at end of file + $('#createNS').click(function(){
+ var formData = JSON.stringify($("#neForm").serializeObject());
+ var jsonobj = JSON.parse(formData);
+ var newJson = {"managedElement": jsonobj};
+ formData = JSON.stringify(newJson);
+ var requestUrl = "http://localhost:8080/org.openo.sdno.brs/openoapi/sdnobrs/v1/managed-elements";
+ $
+ .ajax({
+ type : "POST",
+ url : requestUrl,
+ contentType : "application/json",
+ dataType : "json",
+ data : formData,
+ success : function(jsonResp) {
+ alert("NS saved successfully!!!");
+ jsonobj["id"]= jsonResp.managedElement.id;
+ $('#ne').bootstrapTable("append", jsonobj);
+ $('#vmAppDialog').removeClass('in').css('display','none');
+
+ },
+ error : function(xhr, ajaxOptions, thrownError) {
+ alert("Error on page : " + xhr.responseText);
+ }
+ });
+ });
+})
+
+/*******************************************Get Service**********************************************/
+function loadGetServiceData(url){
+ return JSON.parse('[{"serviceId":"1111","serviceName":"siteToDC","description":"siteToDC","createTime":"xxxxxx","creator":"XXXX","serviceType":"GSO","templateName":"xxxxxx","inputParameters":{"POP-1-0-0.vFW-moc":"xxx","POP-1-0-0.vCPE-moc":"xxx"}},{"serviceId":"2222","serviceName":"siteToDC","description":"siteToDC","createTime":"xxxxxx","creator":"XXXX","serviceType":"GSO","templateName":"xxxxxx","inputParameters":{"POP-1-0-0.vFW-moc":"xxx1","POP-1-0-0.vCPE-moc":"xxx1"}}]');
+
+ // TODO authenticate the url.
+ var requestUrl = url + "/openoapi/sdnobrs/v1/topological-links";
+ $
+ .ajax({
+ type : "GET",
+ url : requestUrl,
+ contentType : "application/json",
+ success : function(jsonobj) {
+ // TODO return according to the json data received.
+ return jsonobj;
+ },
+ error : function(xhr, ajaxOptions, thrownError) {
+ alert("Error on getting link data : " + xhr.responseText);
+ }
+ });
+}
+
+/*********************************************Get Service Details********************************************/
+function loadServiceDetails(url, serviceId){
+ return JSON.parse('[{"id":"12345", "name":"sdno"}, {"id":"23456", "name":"gso"},{"id":"12345", "name":"nfvo"}]');
+ //return JSON.parse('{"sdno":[{"id":"12345", "name":"SDNO"}], "nfvo":[{"id":"12345", "name":"SDNO"}]}');
+ //return JSON.parse('"nfvo":[{"id":"12345", "name":"SDNO"}]}');
+ // TODO authenticate the url.
+ var requestUrl = url + "/openoapi/lifecyclemgr/v1/services/toposequence/" + serviceId;
+ $
+ .ajax({
+ type : "GET",
+ url : requestUrl,
+ contentType : "application/json",
+ success : function(jsonobj) {
+ // TODO return according to the json data received.
+ return jsonobj;
+ },
+ error : function(xhr, ajaxOptions, thrownError) {
+ alert("Error on getting link data : " + xhr.responseText);
+ }
+ });
+}
+
+function anchorClick(serviceId){
+ var url = "";
+ var jsonData = loadServiceDetails(url, serviceId);
+ //TODO populate the modal according to json response
+ return true;
+}
diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html index 7de57fce..896481a5 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html @@ -41,7 +41,9 @@ //Assigning data to table
data: jsondata
});
-
+ $('.table tbody tr').click(function () {
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');
+ })
});
function operateFormatter(value, row, index) {
return [
@@ -56,8 +58,34 @@ }
};
</script>
- </head>
-<body id="open_base_vpn_cotentBody" class="cotentBody ng-scope">
+ <style>
+ .fixed-table-container tbody td .th-inner,
+ .fixed-table-container thead th .th-inner {
+ line-height: 4px;
+ }
+
+ .fixed-table-pagination .pagination-info {
+ display: none !important;
+ }
+
+ .table tbody tr:hover td,
+ .table tbody tr.odd:hover td {
+ background-color: #e6fbe0 !important;
+ }
+
+ table tr.openoTable_row_selected td {
+ background: #e8f8fe !important;
+ border-bottom: 1px solid #e8e8e8 !important;
+ }
+
+ .container-fluid {
+ padding-left: 30px;
+ padding-right: 0px;
+ }
+ </style>
+</head>
+
+<body id="open_base_vpn_cotentBody" class="ng-scope">
<div class="container-fluid ms-controller">
<h3> Overlay VPN </h3>
@@ -65,10 +93,10 @@ <div id='ict_virtualApplication_table_div'>
<div>
<div class="top">
- <table id="sai" data-pagination="true" data-page-size="5" data-pagination-first-text="First"
- data-pagination-pre-text="Previous" data-pagination-next-text="Next"
- data-pagination-last-text="Last">
- <thead id="soverlayTable_thead" class="openo-table-thead">
+ <table id="sai" class="table table-striped" data-pagination="true" data-page-size="5"
+ data-pagination-first-text="First" data-pagination-pre-text="Previous"
+ data-pagination-next-text="Next" data-pagination-last-text="Last">
+ <thead id="soverlayTable_thead" class="openo-table-thead" style="background:#ECECEC">
<tr class="active">
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
data-field="overlayName" data-sortable="true">
@@ -83,33 +111,37 @@ data-field="overlayDesc" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayDesc_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element "> Description
- </span></div>
+ <span id="overlayDesc_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element "> Description
+ </span>
+ </div>
</th>
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
data-field="overlayThincCPE" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayThincCPE_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Thin CPE
- </span></div>
+ <span id="overlayThincCPE_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Thin CPE
+ </span>
+ </div>
</th>
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
data-field="overlayPortVlanID" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayPortVlanID_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Port:Vlan ID
- </span></div>
+ <span id="overlayPortVlanID_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Port:Vlan ID
+ </span>
+ </div>
</th>
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
data-field="overlayDCName" data-sortable="true">
<div class="openo-table-th-border"></div>
<div class="DataTables_sort_wrapper openo-ellipsis ">
- <span id="overlayDCName_sorticon"
- class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">DC Name
- </span></div>
+ <span id="overlayDCName_sorticon"
+ class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">DC Name
+ </span>
+ </div>
</th>
<th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign"
data-field="overlayVPC" data-sortable="true">
diff --git a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/underlayvpn.html b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/underlayvpn.html index 6a6c34c3..4db9f27f 100644 --- a/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/underlayvpn.html +++ b/openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/underlayvpn.html @@ -31,18 +31,37 @@ <script type="text/javascript" src="js/brs.js"></script>
<script type="text/javascript" src="js/underlay.js"></script>
<script type="text/javascript" src="js/bootstrap-table.min.js"></script>
- <style type="text/css">
- hr {
- # #-moz-border-bottom-colors: none;
- -moz-border-image: none;
- -moz-border-left-colors: none;
- -moz-border-right-colors: none;
- -moz-border-top-colors: none;
- # #border-color: #EEEEEE -moz-use-text-color #FFFFFF;
- border-style: solid none;
- border-width: 1px 0;
- margin: 50px 0;
- }
+ <style>
+ .fixed-table-container tbody td .th-inner,
+ .fixed-table-container thead th .th-inner {
+ line-height: 4px;
+ }
+
+ .fixed-table-pagination .pagination-info {
+ display: none !important;
+ }
+
+ .table tbody tr:hover td,
+ .table tbody tr.odd:hover td {
+ background-color: #e6fbe0 !important;
+ }
+
+ .delete-btn {
+ background: url(delete.png) no-repeat !important;
+ width: 16px;
+ height: 16px;
+ border: none;
+ }
+
+ table tr.openoTable_row_selected td {
+ background: #e8f8fe !important;
+ border-bottom: 1px solid #e8e8e8 !important;
+ }
+
+ .container-fluid {
+ padding-left: 10px;
+ padding-right: 0px;
+ }
</style>
<script type="text/javascript">
$(document).ready(function () {
@@ -57,6 +76,9 @@ //Assigning data to table
data: {}
});
+ $('.table tbody tr').click(function () {
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');
+ })
});
function operateFormatter(value, row, index) {
return [
@@ -95,10 +117,10 @@ <div id='ict_virtualApplication_table_div'>
<div>
<div class="top">
- <table id="tbl_overlay" data-pagination="true" data-page-size="5" data-pagination-first-text="First"
- data-pagination-pre-text="Previous" data-pagination-next-text="Next"
- data-pagination-last-text="Last">
- <thead id="sunderlayTable_thead" class="openo-table-thead">
+ <table class="table table-striped" id="tbl_overlay" data-pagination="true" data-page-size="5"
+ data-pagination-first-text="First" data-pagination-pre-text="Previous"
+ data-pagination-next-text="Next" data-pagination-last-text="Last">
+ <thead id="sunderlayTable_thead" class="openo-table-thead" style="background:#ECECEC">
<tr class="active">
|