lishuai
Committed by Gerrit Code Review

[ONOS-4191] Add js,css and html for service function chain.

Change-Id: I1eb0e92806982aaaa1e4bb2ff5635b33079e304b
1 +/*
2 + * Copyright 2016 Open Networking Laboratory
3 + *
4 + * Licensed under the Apache License, Version 2.0 (the "License");
5 + * you may not use this file except in compliance with the License.
6 + * You may obtain a copy of the License at
7 + *
8 + * http://www.apache.org/licenses/LICENSE-2.0
9 + *
10 + * Unless required by applicable law or agreed to in writing, software
11 + * distributed under the License is distributed on an "AS IS" BASIS,
12 + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 + * See the License for the specific language governing permissions and
14 + * limitations under the License.
15 + */
16 +
17 +/*
18 + ONOS GUI -- SFC View -- CSS file
19 + */
20 +
21 +#ov-sfc h2 {
22 + display: inline-block;
23 +}
24 +
25 +#ov-sfc div.ctrl-btns {
26 + width: 45px;
27 +}
...\ No newline at end of file ...\ No newline at end of file
1 +<!--
2 + ~ Copyright 2016 Open Networking Laboratory
3 + ~
4 + ~ Licensed under the Apache License, Version 2.0 (the "License");
5 + ~ you may not use this file except in compliance with the License.
6 + ~ You may obtain a copy of the License at
7 + ~
8 + ~ http://www.apache.org/licenses/LICENSE-2.0
9 + ~
10 + ~ Unless required by applicable law or agreed to in writing, software
11 + ~ distributed under the License is distributed on an "AS IS" BASIS,
12 + ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 + ~ See the License for the specific language governing permissions and
14 + ~ limitations under the License.
15 + -->
16 +
17 +<!-- SFC partial HTML -->
18 +<div id="ov-sfc">
19 + <div class="tabular-header">
20 + <h2>service function chains ({{tableData.length}} total)</h2>
21 + <div class="ctrl-btns">
22 + <div class="refresh" ng-class="{active: autoRefresh}"
23 + icon icon-size="36" icon-id="refresh"
24 + tooltip tt-msg="autoRefreshTip"
25 + ng-click="toggleRefresh()"></div>
26 + </div>
27 + </div>
28 +
29 + <div class="summary-list" onos-table-resize>
30 + <div class="table-header" onos-sortable-header>
31 + <table>
32 + <tr>
33 + <td colId="_iconid_state" class="table-icon" sortable></td>
34 + <td colId="portChainName" sortable>PortChainName </td>
35 + <td colId="hosts" sortable>Hosts </td>
36 + <td colId="type" sortable>Type </td>
37 + <td colId="srcIp" sortable>Source IP Prefix </td>
38 + <td colId="dstIp" sortable>Destination IP Prefix </td>
39 + </tr>
40 + </table>
41 + </div>
42 +
43 + <div class="table-body">
44 + <table onos-flash-changes id-prop="one">
45 + <tr ng-if="!tableData.length" class="no-data">
46 + <td colspan="6">
47 + No Service Function Chain found
48 + </td>
49 + </tr>
50 +
51 + <tr ng-repeat="sfc in tableData track by $index"
52 + ng-repeat-complete row-id="{{sfc.id}}">
53 + <td class="table-icon">
54 + <div icon icon-id="{{sfc._iconid_state}}"></div>
55 + </td>
56 + <td>{{sfc.portChainName}}</td>
57 + <td>{{sfc.hosts}}</td>
58 + <td>{{sfc.type}}</td>
59 + <td>{{sfc.srcIp}}</td>
60 + <td>{{sfc.dstIp}}</td>
61 + </tr>
62 + </table>
63 + </div>
64 +
65 + </div>
66 +
67 +</div>
1 +/*
2 + * Copyright 2016 Open Networking Laboratory
3 + *
4 + * Licensed under the Apache License, Version 2.0 (the "License");
5 + * you may not use this file except in compliance with the License.
6 + * You may obtain a copy of the License at
7 + *
8 + * http://www.apache.org/licenses/LICENSE-2.0
9 + *
10 + * Unless required by applicable law or agreed to in writing, software
11 + * distributed under the License is distributed on an "AS IS" BASIS,
12 + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 + * See the License for the specific language governing permissions and
14 + * limitations under the License.
15 + */
16 +
17 +/*
18 + ONOS GUI -- SFC View Module
19 + */
20 +
21 +(function () {
22 + 'use strict';
23 +
24 + angular.module('ovSfc', [])
25 + .controller('OvSfcCtrl',
26 + ['$log', '$scope', '$sce', 'FnService', 'TableBuilderService',
27 +
28 + function ($log, $scope, $sce, fs, tbs) {
29 + tbs.buildTable({
30 + scope: $scope,
31 + tag: 'sfc'
32 + });
33 +
34 + $log.log('OvSfcCtrl has been created');
35 + }]);
36 +}());
1 +<link rel="stylesheet" href="app/view/sfc/sfc.css">
...\ No newline at end of file ...\ No newline at end of file
1 +<script src="app/view/sfc/sfc.js"></script>
...\ No newline at end of file ...\ No newline at end of file