aboutsummaryrefslogtreecommitdiff
path: root/src/tools/text-statistics/text-statistics.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/tools/text-statistics/text-statistics.vue')
-rw-r--r--src/tools/text-statistics/text-statistics.vue41
1 files changed, 13 insertions, 28 deletions
diff --git a/src/tools/text-statistics/text-statistics.vue b/src/tools/text-statistics/text-statistics.vue
index 335a5e1..ad11d0e 100644
--- a/src/tools/text-statistics/text-statistics.vue
+++ b/src/tools/text-statistics/text-statistics.vue
@@ -1,38 +1,23 @@
<template>
<n-card>
- <n-input
- v-model:value="text"
- type="textarea"
- placeholder="Your text..."
- rows="5"
- />
- <br>
- <br>
+ <n-input v-model:value="text" type="textarea" placeholder="Your text..." rows="5" />
+ <br />
+ <br />
<n-space justify="space-around">
- <n-statistic
- label="Character count"
- :value="text.length"
- />
- <n-statistic
- label="Word count"
- :value="text.split(/\s+/).length"
- />
- <n-statistic
- label="Line count"
- :value="text.split(/\r\n|\r|\n/).length"
- />
- <n-statistic
- label="Byte size"
- :value="formatBytes(getStringSizeInBytes(text))"
- />
+ <n-statistic label="Character count" :value="text.length" />
+ <n-statistic label="Word count" :value="text.split(/\s+/).length" />
+ <n-statistic label="Line count" :value="text.split(/\r\n|\r|\n/).length" />
+ <n-statistic label="Byte size" :value="formatBytes(getStringSizeInBytes(text))" />
</n-space>
</n-card>
</template>
<script setup lang="ts">
-import { ref } from 'vue'
-import { formatBytes } from '@/utils/convert'
-import { getStringSizeInBytes } from './text-statistics.service'
+import { ref } from 'vue';
+import { formatBytes } from '@/utils/convert';
+import { getStringSizeInBytes } from './text-statistics.service';
-const text = ref('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Commodo risus faucibus varius volutpat habitasse suspendisse justo inceptos primis mi. Fusce molestie lorem bibendum habitasse litora adipiscing turpis egestas quis nec. Non id conubia vulputate etiam iaculis vitae venenatis hac fusce condimentum. Adipiscing pellentesque venenatis ornare pulvinar tempus hac montes velit erat convallis.')
+const text = ref(
+ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Commodo risus faucibus varius volutpat habitasse suspendisse justo inceptos primis mi. Fusce molestie lorem bibendum habitasse litora adipiscing turpis egestas quis nec. Non id conubia vulputate etiam iaculis vitae venenatis hac fusce condimentum. Adipiscing pellentesque venenatis ornare pulvinar tempus hac montes velit erat convallis.',
+);
</script>