stuzer05/random-web-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Activity

Add str len mode, refactor str case mode

Browse Source
This commit is contained in:
Illya Marchenko 2023-11-30 08:12:59 +02:00
parent d0e3625a9c
commit f24c6e330c
Signed by: stuzer05
GPG Key ID: A6ABAAA9268F9F4F
6 changed files with 112 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Sidebar.vue
View File

@ -30,8 +30,8 @@ export default {
},
'Strings': {
'fix_ru_en_keyboard': 'Fix ru-en keyboard',
'str_to_lower': 'Str to lower',
'str_to_upper': 'Str to upper',
'str_length': 'Str length',
'str_to_lower_upper': 'Str to lower/upper',
},
'SQL': {
'sql_split_in': 'SQL split IN',

12
src/router/index.js
View File

@ -16,14 +16,14 @@ const router = createRouter({
* String manipulation
*/
{
path: '/str_to_upper',
name: 'str_to_upper',
component: () => import('../views/StrToUpper.vue'),
path: '/str_length',
name: 'str_length',
component: () => import('../views/StrLength.vue'),
},
{
path: '/str_to_lower',
name: 'str_to_lower',
component: () => import('../views/StrToLower.vue'),
path: '/str_to_lower_upper',
name: 'str_to_lower_upper',
component: () => import('../views/StrToLowerUppper.vue'),
},
{
path: '/fix_ru_en_keyboard',

52
src/views/StrLength.vue Normal file
View File

@ -0,0 +1,52 @@
<template>
<h2 class="tool-title">Str length</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="data">Data</label>
<textarea id="data" v-model="toolData.data" style="height: 150px"></textarea>
</div>
<div class="input-group">
<label>Mode</label>
<div>
<input id="count_mode_characters" value="characters" name="count_mode" v-model="toolData.countMode" type="radio"> <label for="count_mode_characters">characters</label><br>
<input id="count_mode_words" value="words" name="count_mode" v-model="toolData.countMode" type="radio"> <label for="count_mode_words">words</label>
</div>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<textarea id="result" v-model="toolResult" style="height: 150px"></textarea>
</div>
</template>
<script>
export default {
data() {
return {
toolData: {
data: '',
countMode: 'characters',
},
};
},
computed: {
toolResult() {
switch (this.toolData.countMode) {
case 'characters':
return this.toolData.data.length;
case 'words':
return this.toolData.data.trim().split(/\s+/).length;
}
},
},
}
</script>
<style lang="scss">
</style>

37
src/views/StrToLower.vue
View File

@ -1,37 +0,0 @@
<template>
<h2 class="tool-title">Str to lower</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="data">Data</label>
<textarea id="data" v-model="toolData.data" style="height: 150px"></textarea>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<textarea id="result" v-model="toolResult" style="height: 150px"></textarea>
</div>
</template>
<script>
export default {
data() {
return {
toolData: {
data: '',
},
};
},
computed: {
toolResult() {
return this.toolData.data.toLocaleLowerCase();
},
},
}
</script>
<style lang="scss">
</style>

52
src/views/StrToLowerUppper.vue Normal file
View File

@ -0,0 +1,52 @@
<template>
<h2 class="tool-title">Str to lower/upper</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="data">Data</label>
<textarea id="data" v-model="toolData.data" style="height: 150px"></textarea>
</div>
<div class="input-group">
<label>Mode</label>
<div>
<input id="case_mode_lower" value="lower" name="case_mode" v-model="toolData.caseMode" type="radio"> <label for="case_mode_lower">to lower</label><br>
<input id="case_mode_upper" value="upper" name="case_mode" v-model="toolData.caseMode" type="radio"> <label for="case_mode_upper">to upper</label>
</div>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<textarea id="result" v-model="toolResult" style="height: 150px"></textarea>
</div>
</template>
<script>
export default {
data() {
return {
toolData: {
data: '',
caseMode: 'upper',
},
};
},
computed: {
toolResult() {
switch (this.toolData.caseMode) {
case 'lower':
return this.toolData.data.toLocaleLowerCase();
case 'upper':
return this.toolData.data.toLocaleUpperCase();
}
},
},
}
</script>
<style lang="scss">
</style>

37
src/views/StrToUpper.vue
View File

@ -1,37 +0,0 @@
<template>
<h2 class="tool-title">Str to upper</h2>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="data">Data</label>
<textarea id="data" v-model="toolData.data" style="height: 150px"></textarea>
</div>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="result">Result</label>
<textarea id="result" v-model="toolResult" style="height: 150px"></textarea>
</div>
</template>
<script>
export default {
data() {
return {
toolData: {
data: '',
},
};
},
computed: {
toolResult() {
return this.toolData.data.toLocaleUpperCase();
},
},
}
</script>
<style lang="scss">
</style>