mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-04-27 10:06:16 -04:00
feat: added components
This commit is contained in:
Corentin Thomasset
parent
6e0c369398
commit
5fa81533d9
30 changed files with 2405 additions and 1853 deletions
106
pages/tools/crypto/cypher-uncyfer-text.vue
Normal file
106
pages/tools/crypto/cypher-uncyfer-text.vue
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<template>
|
||||
<ToolWrapper :config="config()">
|
||||
<v-row justify="center" align="center">
|
||||
<v-col cols="12" lg="8" md="12">
|
||||
<v-textarea
|
||||
v-model="key"
|
||||
outlined
|
||||
label="Encryption key"
|
||||
rows="1"
|
||||
@input="encrypt"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="12" lg="4" md="12">
|
||||
<v-select
|
||||
v-model="algorithm"
|
||||
:items="Object.keys(algorithms)"
|
||||
label="Algorithm"
|
||||
outlined
|
||||
@change="encrypt"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-textarea
|
||||
v-model="decrypted"
|
||||
outlined
|
||||
label="Clear text"
|
||||
@input="encrypt"
|
||||
/>
|
||||
|
||||
<v-textarea
|
||||
v-model="encrypted"
|
||||
outlined
|
||||
label="Cyphered text"
|
||||
@input="decrypt"
|
||||
/>
|
||||
<div class="text-center">
|
||||
<v-btn depressed @click="copy(encrypted)">
|
||||
Copy result
|
||||
</v-btn>
|
||||
</div>
|
||||
</ToolWrapper>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import {Component} from 'nuxt-property-decorator'
|
||||
import {CopyableMixin} from '@/mixins/copyable.mixin'
|
||||
import Tool from '@/components/Tool'
|
||||
import {ToolConfig} from '@/types/ToolConfig'
|
||||
import CryptoJS from 'crypto-js'
|
||||
|
||||
const algos = {
|
||||
AES: CryptoJS.AES,
|
||||
TripleDES: CryptoJS.TripleDES,
|
||||
Rabbit: CryptoJS.Rabbit,
|
||||
RabbitLegacy: CryptoJS.RabbitLegacy,
|
||||
RC4: CryptoJS.RC4
|
||||
}
|
||||
|
||||
@Component({
|
||||
mixins: [CopyableMixin]
|
||||
})
|
||||
export default class CypherUncyferText extends Tool {
|
||||
algorithm: keyof typeof algos = 'AES'
|
||||
algorithms: typeof algos = algos
|
||||
key = 'sup3r s3cr3t k3y'
|
||||
decrypted = 'Lorem ipsum dolor sit amet.'
|
||||
encrypted = ''
|
||||
|
||||
config(): ToolConfig {
|
||||
return {
|
||||
title: 'Cypher / uncypher text',
|
||||
description: 'Cypher and uncyfer text.',
|
||||
icon: 'mdi-lock-open',
|
||||
keywords: ['cypher', 'uncypher', 'text', ...Object.keys(algos).map(s => s.toLowerCase())]
|
||||
}
|
||||
}
|
||||
|
||||
mounted() {
|
||||
this.encrypt()
|
||||
}
|
||||
|
||||
encrypt() {
|
||||
try {
|
||||
this.encrypted = this.algorithms[this.algorithm]
|
||||
.encrypt(this.decrypted.trim(), this.key)
|
||||
.toString()
|
||||
} catch (ignored) {
|
||||
// ignored
|
||||
}
|
||||
}
|
||||
|
||||
decrypt() {
|
||||
try {
|
||||
this.decrypted = this.algorithms[this.algorithm]
|
||||
.decrypt(this.encrypted.trim(), this.key)
|
||||
.toString(CryptoJS.enc.Utf8)
|
||||
} catch (ignored) {
|
||||
// ignored
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
</style>
|
||||
78
pages/tools/crypto/hash-text.vue
Normal file
78
pages/tools/crypto/hash-text.vue
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
<template>
|
||||
<ToolWrapper :config="config()">
|
||||
<v-textarea
|
||||
v-model="inputText"
|
||||
outlined
|
||||
label="Text to hash"
|
||||
/>
|
||||
|
||||
<v-select
|
||||
v-model="algorithm"
|
||||
:items="Object.keys(algorithms)"
|
||||
label="Algorithm"
|
||||
outlined
|
||||
/>
|
||||
|
||||
<v-textarea
|
||||
v-model="hashed"
|
||||
outlined
|
||||
readonly
|
||||
label="Hashed text"
|
||||
/>
|
||||
<div class="text-center">
|
||||
<v-btn depressed @click="copy(hashed)">
|
||||
Copy hash
|
||||
</v-btn>
|
||||
</div>
|
||||
</ToolWrapper>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import {Component} from 'nuxt-property-decorator'
|
||||
import CryptoJS from 'crypto-js'
|
||||
import {CopyableMixin} from '~/mixins/copyable.mixin'
|
||||
import Tool from '~/components/Tool.vue'
|
||||
import {ToolConfig} from '~/types/ToolConfig'
|
||||
|
||||
const algos = {
|
||||
MD5: CryptoJS.MD5,
|
||||
SHA1: CryptoJS.SHA1,
|
||||
SHA256: CryptoJS.SHA256,
|
||||
SHA224: CryptoJS.SHA224,
|
||||
SHA512: CryptoJS.SHA512,
|
||||
SHA384: CryptoJS.SHA384,
|
||||
SHA3: CryptoJS.SHA3,
|
||||
RIPEMD160: CryptoJS.RIPEMD160
|
||||
}
|
||||
|
||||
@Component({
|
||||
mixins: [CopyableMixin]
|
||||
})
|
||||
export default class HashText extends Tool {
|
||||
config(): ToolConfig {
|
||||
return {
|
||||
title: 'Hash text',
|
||||
description: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus distinctio dolor dolorum eaque eligendi, facilis impedit laboriosam odit placeat.',
|
||||
icon: 'mdi-script-text-play',
|
||||
keywords: ['hash', 'text', ...Object.keys(algos).map(s => s.toLowerCase())]
|
||||
}
|
||||
}
|
||||
|
||||
inputText = 'Lorem ipsum dolor sit amet, consectetur adipisicing elit.'
|
||||
algorithm: keyof typeof algos = 'SHA256'
|
||||
algorithms: typeof algos = algos
|
||||
|
||||
get hashed() {
|
||||
if (this.algorithms[this.algorithm]) {
|
||||
return this.algorithms[this.algorithm](this.inputText).toString()
|
||||
} else {
|
||||
this.$toast.error('Invalid algorithm.')
|
||||
return ''
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-slider v-model="length" :label="`Length (${length})`" min="1" max="256" />
|
||||
<v-slider v-model="length" :label="`Length (${length})`" min="1" max="512" />
|
||||
|
||||
<v-textarea v-model="token" outlined />
|
||||
|
||||
|
|
@ -30,16 +30,16 @@
|
|||
import {Component} from 'nuxt-property-decorator'
|
||||
import Tool from '~/components/Tool.vue'
|
||||
import {ToolConfig} from '~/types/ToolConfig'
|
||||
import {Copyable} from '~/mixins/copyable'
|
||||
import {CopyableMixin} from '~/mixins/copyable.mixin'
|
||||
import {shuffle} from '~/utils/string'
|
||||
|
||||
const shuffle = (s: string) => s.split('').sort(() => 0.5 - Math.random()).join('')
|
||||
const lowercase = 'abcdefghijklmopqrstuvwxyz'
|
||||
const uppercase = 'ABCDEFGHIJKLMOPQRSTUVWXYZ'
|
||||
const numbers = '0123456789'
|
||||
const specials = '.,;:!?./-"\'#{([-|\\@)]=}*+'
|
||||
|
||||
@Component({
|
||||
mixins: [Copyable]
|
||||
mixins: [CopyableMixin]
|
||||
})
|
||||
export default class TokenGenerator extends Tool {
|
||||
config(): ToolConfig {
|
||||
|
|
|
|||
92
pages/tools/crypto/uuid-generator.vue
Normal file
92
pages/tools/crypto/uuid-generator.vue
Normal file
|
|
@ -0,0 +1,92 @@
|
|||
<template>
|
||||
<ToolWrapper :config="config()">
|
||||
<v-text-field
|
||||
v-model.number="quantity"
|
||||
outlined
|
||||
type="number"
|
||||
label="Quantity"
|
||||
dense
|
||||
class="quantity"
|
||||
:rules="rules.quantity"
|
||||
/>
|
||||
<v-textarea
|
||||
v-model="token"
|
||||
outlined
|
||||
class="centered-input"
|
||||
:rows="quantity <= 10 ? quantity : 10"
|
||||
readonly
|
||||
/>
|
||||
|
||||
<div class="text-center">
|
||||
<v-btn depressed class="mr-4" @click="computeToken">
|
||||
Refresh
|
||||
</v-btn>
|
||||
<v-btn depressed @click="copy(token, `UUID${quantity > 1 ? 's' : ''} copied !`)">
|
||||
Copy UUID{{ quantity > 1 ? 's' : '' }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</ToolWrapper>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
||||
import {Component, Ref, Watch} from 'nuxt-property-decorator'
|
||||
import {CopyableMixin} from '@/mixins/copyable.mixin'
|
||||
import {ToolConfig} from '@/types/ToolConfig'
|
||||
import { VTextField } from 'vuetify/lib'
|
||||
import Tool from '~/components/Tool.vue'
|
||||
|
||||
const generateUuid = () => '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, c => ((c as unknown as number) ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> (c as unknown as number) / 4).toString(16))
|
||||
|
||||
@Component({
|
||||
mixins: [CopyableMixin]
|
||||
})
|
||||
export default class UuidGenerator extends Tool {
|
||||
config(): ToolConfig {
|
||||
return {
|
||||
title: 'UUIDs generator',
|
||||
description: 'A universally unique identifier (UUID) is a 128-bit number used to identify information in computer systems. ',
|
||||
icon: 'mdi-fingerprint',
|
||||
keywords: ['uuid', 'v4', 'random', 'id', 'alphanumeric', 'identity']
|
||||
}
|
||||
}
|
||||
|
||||
@Ref() readonly quantityEl! : typeof VTextField
|
||||
token = ''
|
||||
quantity = 1
|
||||
rules = {
|
||||
quantity: [
|
||||
(v: any) => !!v || 'Quantity is required',
|
||||
(v: any) => (v > 0 && v <= 50) || 'Quantity should be > 0 and <= 50',
|
||||
(v: any) => Number.isInteger(v) || 'Quantity should be an integer'
|
||||
]
|
||||
}
|
||||
|
||||
mounted() {
|
||||
this.computeToken()
|
||||
}
|
||||
|
||||
@Watch('quantity')
|
||||
computeToken() {
|
||||
this.token = Array.from({length: this.quantity}, generateUuid).join('\n')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.quantity {
|
||||
width: 100px;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
|
||||
::v-deep input {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .centered-input textarea {
|
||||
text-align: center;
|
||||
margin-top: 13px !important;
|
||||
font-family: Consolas, monospace;
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue