diff options
Diffstat (limited to 'portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html')
| -rw-r--r-- | portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html | 291 |
1 files changed, 291 insertions, 0 deletions
diff --git a/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html b/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html new file mode 100644 index 00000000..d55e4319 --- /dev/null +++ b/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/overlayvpn.html @@ -0,0 +1,291 @@ +<!--
+
+ Copyright 2016, Huawei Technologies 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>
+ <head lang="en">
+ <meta charset="UTF-8">
+ <title></title>
+ <link href="css/bootstrap.min.css" rel="stylesheet"/>
+ <link href="css/VMMain.css" rel="stylesheet"/>
+ <link href="css/bootstrap-table.min.css" rel="stylesheet"/>
+ <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
+ <script type="text/javascript" src="js/bootstrap.min.js"></script>
+ <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>
+ <script type="text/javascript" src="js/bootstrap-table-filter-control.min.js"></script>
+ <style type="text/css">
+ </style>
+ <script type="text/javascript">
+ $(document).ready(function () {
+ var jsondata = [];
+ jsondata = loadOverlayData();
+
+ $('#sai').bootstrapTable({
+ //Assigning data to table
+ data: jsondata
+ });
+ $('.table tbody tr').click(function () {
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');
+ });
+
+ $('#sai').on('sort.bs.table', function () {
+
+
+ }).on('click-row.bs.table', function () {
+
+
+ $('.table tbody tr').click(function() {
+
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');
+ });
+
+ });
+
+ var serviceId = getQueryStringValue("serviceId");
+ console.log("overlayvpn - serviceId : " + serviceId);
+ });
+
+ function getQueryStringValue (key) {
+ var params = new URLSearchParams(window.location.search.slice(1));
+ return params.get(key);
+ }
+
+ function operateFormatter(value, row, index) {
+ return [
+ '<img class="siteDeleteImg" src="images/delete.png" href="javascript:void(0)" style="cursor: pointer" name="title" title="Delete" />'
+ ].join('');
+ }
+ window.operateEvents = {
+ 'click .siteDeleteImg': function(e, value, row, index) {
+ // TO DO ajex call for delete
+ console.log(value, row, index);
+ }
+ };
+ </script>
+ <style>
+ .dropdown-menu {
+ min-width: 10px;
+ }
+ .btn {
+ padding: 4px;
+ }
+ .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;
+ }
+
+ .clearfix {
+ display: none;
+ }
+
+ .page-list{
+ float:none !important;
+ display:inline-block !important;
+ margin-right: 10px;
+ vertical-align: middle;
+ margin-bottom: 25px;
+
+ }
+ .pull-left{
+ float:none !important;
+ display:inline-block !important;
+ }
+
+ .pull-right{
+ float:none !important;
+ display:inline-block !important;
+ }
+
+ .fixed-table-pagination{
+ float:right;
+ }
+ </style>
+</head>
+
+<body id="open_base_vpn_cotentBody" class="ng-scope">
+<div class="container-fluid ms-controller">
+
+ <h3> Overlay VPN </h3>
+ <!-- <div class="row-fluid" data-name="table_zone">
+ <div id='ict_virtualApplication_table_div'>
+ <div>
+ <div class="top">
+ <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">
+ <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">Name
+ </span>
+ </div>
+ </th>
+ <th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" 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>
+ </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>
+ </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>
+ </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>
+ </th>
+ <th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayVPC" 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 ">VPC
+ </span>
+ </div>
+ </th>
+ <th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayVPCCIDR" 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 ">VPC CIDR
+ </span>
+ </div>
+ </th>
+ <th class="openo-table-state-default openo-table-th openo-table-disable-element leftHeaderAlign" data-field="overlayOperation" align="center" data-formatter="operateFormatter" data-events="operateEvents">
+ <div class="openo-table-th-border"></div>
+ <div class="DataTables_sort_wrapper openo-ellipsis ">
+ <span id="portAction_sorticon" class="openo-table-th-sorticon overflow_elip leftHeaderAlign openo-table-disable-element ">Action</span>
+ </div>
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+
+ <tr>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>
+ <button class="table-btn delete-btn"></button>
+ </td>
+ </tr>
+ <tr>
+ <td>data </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>
+ <button class="table-btn delete-btn"></button>
+ </td>
+ </tr>
+ <tr>
+ <td>now </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>
+ <button class="table-btn delete-btn"></button>
+ </td>
+ </tr>
+ <tr>
+ <td>then </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>Sample </td>
+ <td>
+ <button class="table-btn delete-btn"></button>
+ </td>
+ </tr>
+ </tbody>
+
+ </table>
+ </div>
+ </div>
+ </div>
+ </div> -->
+
+ <div class="row-fluid" data-name="table_zone">
+ <div id='ict_virtualApplication_table_div'>
+ <div>
+ <div class="top">
+ <table class="table-striped table " id="sai" data-pagination="true" data-pagination-first-text="First"
+ data-pagination-pre-text="Previous" data-pagination-next-text="Next" data-pagination-last-text="Last"
+ data-filter-control="true">
+ <thead style="background:#ECECEC">
+ <tr>
+ <th data-field="name" data-sortable="true" data-filter-control="input">Name</th>
+ <th data-field="desc" data-sortable="true" data-filter-control="input">Description</th>
+ <th data-field="thinCpe" data-sortable="true" data-filter-control="input">Thin CPE</th>
+ <th data-field="port" data-sortable="true" data-filter-control="input">Port:Vlan ID</th>
+ <th data-field="dcName" data-sortable="true" data-filter-control="input">DC Name</th>
+ <th data-field="vpc" data-sortable="true" data-filter-control="input">VPC</th>
+ <th data-field="vpcCidr" data-sortable="true" data-filter-control="input">VPC CIDR</th>
+ <th data-field="action" data-sortable="">Action</th>
+ </tr>
+ </thead>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+</body>
+</html>
\ No newline at end of file |