feat(ipv4-range-expander): expands a given IPv4 start and end address to a valid IPv4 subnet (#366)

* feat(ipv4-range-expander): expands a given IPv4 start and end address to a valid IPv4 subnet

* feat(ipv4-range-expander): remove old component copyable-ip-like.vue

* feat(ipv4-range-expander): fix sonar findings

* feat(ipv4-range-expander): changes due to review

* feat(ipv4-range-expander): only show n-alert if both ipv4 addresses are valid
This commit is contained in:
cgoIT 2023-04-19 20:30:45 +02:00 committed by GitHub
parent 6d2202597c
commit df989e24b3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 284 additions and 9 deletions

View file

@ -1,35 +0,0 @@
<template>
<n-tooltip trigger="hover">
<template #trigger>
<span class="ip" @click="handleClick">{{ ip }}</span>
</template>
{{ tooltipText }}
</n-tooltip>
</template>
<script setup lang="ts">
import { useClipboard } from '@vueuse/core';
import { ref, toRefs } from 'vue';
const props = withDefaults(defineProps<{ ip?: string }>(), { ip: '' });
const { ip } = toRefs(props);
const initialText = 'Copy to clipboard';
const tooltipText = ref(initialText);
const { copy } = useClipboard({ source: ip });
function handleClick() {
copy();
tooltipText.value = 'Copied!';
setTimeout(() => (tooltipText.value = initialText), 1000);
}
</script>
<style scoped lang="less">
.ip {
font-family: monospace;
cursor: pointer;
}
</style>

View file

@ -12,7 +12,7 @@
<n-text strong>{{ label }}</n-text>
</td>
<td>
<copyable-ip-like v-if="getValue(networkInfo)" :ip="getValue(networkInfo)"></copyable-ip-like>
<span-copyable v-if="getValue(networkInfo)" :value="getValue(networkInfo)"></span-copyable>
<n-text v-else depth="3">{{ undefinedFallback }}</n-text>
</td>
</tr>
@ -41,8 +41,8 @@ import { useValidation } from '@/composable/validation';
import { isNotThrowing } from '@/utils/boolean';
import { useStorage } from '@vueuse/core';
import { ArrowLeft, ArrowRight } from '@vicons/tabler';
import SpanCopyable from '@/components/SpanCopyable.vue';
import { getIPClass } from './ipv4-subnet-calculator.models';
import CopyableIpLike from './copyable-ip-like.vue';
const ip = useStorage('ipv4-subnet-calculator:ip', '192.168.0.1/24');