%PDF- %PDF-
| Direktori : /backups/router/usr/local/opnsense/mvc/app/views/OPNsense/IPsec/ |
| Current File : //backups/router/usr/local/opnsense/mvc/app/views/OPNsense/IPsec/sessions.volt |
{#
# Copyright (c) 2022 Deciso B.V.
# All rights reserved.
#
# Redistribution and use in source and binary forms, with or without modification,
# are permitted provided that the following conditions are met:
#
# 1. Redistributions of source code must retain the above copyright notice,
# this list of conditions and the following disclaimer.
#
# 2. Redistributions in binary form must reproduce the above copyright notice,
# this list of conditions and the following disclaimer in the documentation
# and/or other materials provided with the distribution.
#
# THIS SOFTWARE IS PROVIDED ``AS IS'' AND ANY EXPRESS OR IMPLIED WARRANTIES,
# INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY
# AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
# AUTHOR BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY,
# OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
# SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
# INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
# CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
# ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
# POSSIBILITY OF SUCH DAMAGE.
#}
<script>
'use strict';
$( document ).ready(function() {
let grid_phase1 = $("#grid-phase1").UIBootgrid({
search:'/api/ipsec/sessions/search_phase1',
options:{
initialSearchPhrase: getUrlHash('search'),
multiSelect: false,
rowSelect: true,
selection: true,
formatters:{
commands: function (column, row) {
let connect = "{{ lang._('Connect') }}";
let disconnect = "{{ lang._('Disconnect') }}";
return $(`
<div>
<button type="button" class="btn btn-xs btn-default command-${row['connected'] ? 'disconnect' : 'connect'}"
data-toggle="tooltip"
title="${row['connected'] ? disconnect: connect}"
data-row-id=${row.name}>
<span class="fa ${row['connected'] ? 'fa-remove' : 'fa-play'} fa-fw"></span>
</button>
<a href="/ui/diagnostics/log/core/ipsec#search=${encodeURIComponent(row.name)}"
class="btn btn-xs btn-default" data-toggle="tooltip"
title="{{ lang._('Search Logs') }}" target="_blank" rel="noopener noreferrer" style="margin-left: 2px;">
<span class="fa fa-search fa-fw"></span>
</a>
</div>
`).prop('outerHTML');
},
status: function (column, row) {
if (row['connected']) {
return '<span class="fa fa-play fa-fw text-success" data-toggle="tooltip" title="{{ lang._('Connected') }}"></span>';
} else {
return '<span class="fa fa-remove fa-fw text-danger" data-toggle="tooltip" title="{{ lang._('Disconnected') }}"></span>';
}
}
}
}
});
grid_phase1.on('loaded.rs.jquery.bootgrid', function() {
$('[data-toggle="tooltip"]').tooltip();
let ids = $("#grid-phase1").bootgrid("getCurrentRows");
if (ids.length > 0) {
$("#grid-phase1").bootgrid('select', [ids[0].name]);
}
$('.command-disconnect').click(function(){
ajaxCall("/api/ipsec/sessions/disconnect/" + $(this).data('row-id'), {}, function(){
$('#grid-phase1').bootgrid('reload');
});
});
$('.command-connect').click(function(){
ajaxCall("/api/ipsec/sessions/connect/" + $(this).data('row-id'), {}, function(){
$('#grid-phase1').bootgrid('reload');
});
});
});
grid_phase1.on("selected.rs.jquery.bootgrid", function(e, rows) {
$("#grid-phase2").bootgrid('reload');
});
grid_phase1.on("deselected.rs.jquery.bootgrid", function(e, rows) {
$("#grid-phase2").bootgrid('reload');
});
let grid_phase2 = $("#grid-phase2").UIBootgrid({
search:'/api/ipsec/sessions/search_phase2',
options:{
formatters:{
addresses: function (column, row) {
if (typeof row[column.id] === 'string') {
return row[column.id].replaceAll(/,/g, "<br/>");
}
}
},
useRequestHandlerOnGet: true,
requestHandler: function(request) {
let ids = $("#grid-phase1").bootgrid("getSelectedRows");
request['id'] = ids.length > 0 ? ids[0] : "__not_found__";
return request;
}
}
});
grid_phase2.on('loaded.rs.jquery.bootgrid', function() {
if (grid_phase2.bootgrid("getTotalRowCount") > 0) {
$("#box-phase2").show();
} else {
$("#box-phase2").hide();
}
});
$("div.actionBar").each(function(){
let heading_text = "";
if ($(this).closest(".bootgrid-header").attr("id").includes("phase1")) {
heading_text = "{{ lang._('Phase 1') }}";
} else {
heading_text = "{{ lang._('Phase 2') }}";
}
$(this).parent().prepend($('<td class="col-sm-2 theading-text">'+heading_text+'</div>'));
$(this).removeClass("col-sm-12");
$(this).addClass("col-sm-10");
});
updateServiceControlUI('ipsec');
});
</script>
<div class="tab-content content-box __mb">
<table id="grid-phase1" class="table table-condensed table-hover table-striped table-responsive">
<thead>
<tr>
<th data-column-id="name" data-type="string" data-sortable="false" data-identifier="true" data-visible="false">{{ lang._('ID') }}</th>
<th data-column-id="connected" data-width="6em" data-type="string" data-width="3em" data-formatter="status">{{ lang._('Status') }}</th>
<th data-column-id="phase1desc" data-type="string">{{ lang._('Connection') }}</th>
<th data-column-id="version" data-width="6em" data-type="string">{{ lang._('Version') }}</th>
<th data-column-id="local-id" data-type="string">{{ lang._('Local ID') }}</th>
<th data-column-id="local-addrs" data-type="string">{{ lang._('Local IP') }}</th>
<th data-column-id="remote-id" data-type="string">{{ lang._('Remote ID') }}</th>
<th data-column-id="remote-addrs" data-type="string">{{ lang._('Remote IP') }}</th>
<th data-column-id="install-time" data-type="string">{{ lang._('Time') }}</th>
<th data-column-id="bytes-in" data-type="numeric" data-formatter="bytes">{{ lang._('Bytes in') }}</th>
<th data-column-id="bytes-out" data-type="numeric" data-formatter="bytes">{{ lang._('Bytes out') }}</th>
<th data-column-id="local-class" data-visible="false" data-type="string">{{ lang._('Local Auth') }}</th>
<th data-column-id="remote-class" data-visible="false" data-type="string">{{ lang._('Remote Auth') }}</th>
<th data-column-id="commands" data-width="6em" data-formatter="commands" data-sortable="false"></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div class="tab-content content-box __mb" id="box-phase2" style="display:none">
<table id="grid-phase2" class="table table-condensed table-hover table-striped table-responsive">
<thead>
<tr>
<th data-column-id="name" data-type="string" data-sortable="false" data-visible="false">{{ lang._('ID') }}</th>
<th data-column-id="local-ts" data-type="string" data-formatter="addresses">{{ lang._('Local subnets ') }}</th>
<th data-column-id="spi-in" data-type="string">{{ lang._('spi-in') }}</th>
<th data-column-id="spi-out" data-type="string">{{ lang._('spi-out') }}</th>
<th data-column-id="remote-ts" data-type="string" data-formatter="addresses">{{ lang._('Remote subnets') }}</th>
<th data-column-id="state" data-type="string">{{ lang._('State') }}</th>
<th data-column-id="install-time" data-type="string">{{ lang._('Time') }}</th>
<th data-column-id="bytes-in" data-type="numeric" data-formatter="bytes">{{ lang._('Bytes in') }}</th>
<th data-column-id="bytes-out" data-type="numeric" data-formatter="bytes">{{ lang._('Bytes out') }}</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>