Use SettingsItem in network view
This commit is contained in:
@@ -1,8 +1,9 @@
|
||||
<script setup>
|
||||
|
||||
import { ref, onMounted, useTemplateRef, computed } from 'vue';
|
||||
import { Dialog, FormGroup } from 'pankow';
|
||||
import { Dialog, Button, FormGroup } from 'pankow';
|
||||
import Section from '../components/Section.vue';
|
||||
import SettingsItem from '../components/SettingsItem.vue';
|
||||
import NetworkModel from '../models/NetworkModel.js';
|
||||
|
||||
const networkModel = NetworkModel.create();
|
||||
@@ -153,14 +154,27 @@ onMounted(async () => {
|
||||
</Dialog>
|
||||
|
||||
<Section :title="$t('network.firewall.title')">
|
||||
<div class="info-row">
|
||||
<div class="info-label">{{ $t('network.firewall.blockedIpRanges') }}</div>
|
||||
<div class="info-value actionable" @click="onBlocklistConfigure()">{{ $t('network.firewall.blocklist', { blockCount: blocklistLength }) }} <i class="fa-solid fa-edit text-small"></i></div>
|
||||
</div>
|
||||
<div class="info-row">
|
||||
<div class="info-label">{{ $t('network.trustedIpRanges') }}</div>
|
||||
<div class="info-value actionable" @click="onTrustedIpsConfigure()">{{ $t('network.trustedIps.summary', { trustCount: trustedIpsLength }) }} <i class="fa-solid fa-edit text-small"></i></div>
|
||||
</div>
|
||||
<SettingsItem>
|
||||
<FormGroup>
|
||||
<label>{{ $t('network.firewall.blockedIpRanges') }}</label>
|
||||
<div>{{ $t('network.firewall.blocklist', { blockCount: blocklistLength }) }}</div>
|
||||
</FormGroup>
|
||||
<div style="display: flex; align-items: center">
|
||||
<!-- TODO -->
|
||||
<Button tool plain @click="onBlocklistConfigure()">Edit</Button>
|
||||
</div>
|
||||
</SettingsItem>
|
||||
|
||||
<SettingsItem>
|
||||
<FormGroup>
|
||||
<label>{{ $t('network.trustedIpRanges') }}</label>
|
||||
<div>{{ $t('network.trustedIps.summary', { trustCount: trustedIpsLength }) }}</div>
|
||||
</FormGroup>
|
||||
<div style="display: flex; align-items: center">
|
||||
<!-- TODO -->
|
||||
<Button tool plain @click="onTrustedIpsConfigure()">Edit</Button>
|
||||
</div>
|
||||
</SettingsItem>
|
||||
</Section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user