mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-04-21 23:36:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: add whatsapp/sms message links forger

Browse source 
Fix #635
This commit is contained in:
ShareVB 2024-09-22 19:45:05 +02:00
parent c6b75ca3ba
commit ba2d10af9d
3 changed files with 64 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

3
components.d.ts vendored
View file

@ -126,7 +126,9 @@ declare module '@vue/runtime-core' {
MenuLayout: typeof import('./src/components/MenuLayout.vue')['default']
MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
NA: typeof import('naive-ui')['NA']
NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
NButton: typeof import('naive-ui')['NButton']
NCode: typeof import('naive-ui')['NCode']
NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
NConfigProvider: typeof import('naive-ui')['NConfigProvider']
@ -145,6 +147,7 @@ declare module '@vue/runtime-core' {
NMenu: typeof import('naive-ui')['NMenu']
NScrollbar: typeof import('naive-ui')['NScrollbar']
NSpin: typeof import('naive-ui')['NSpin']
NTable: typeof import('naive-ui')['NTable']
NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default']

9
src/tools/phone-parser-and-formatter/index.ts
View file

@ -1,11 +1,11 @@
import { Phone } from '@vicons/tabler';
import { defineTool } from '../tool';
import { translate } from '@/plugins/i18n.plugin';
export const tool = defineTool({
name: translate('tools.phone-parser-and-formatter.title'),
name: 'Phone parser and formatter',
path: '/phone-parser-and-formatter',
description: translate('tools.phone-parser-and-formatter.description'),
description:
'Parse, validate and format phone numbers. Get information about the phone number, like the country code, type, etc. Forge link to send message in WhatsApp and SMS',
keywords: [
'phone',
'parser',
@ -18,6 +18,9 @@ export const tool = defineTool({
'cell',
'international',
'national',
'whatsapp',
'sms',
'message',
],
component: () => import('./phone-parser-and-formatter.vue'),
icon: Phone,

57
src/tools/phone-parser-and-formatter/phone-parser-and-formatter.vue
View file

@ -23,13 +23,16 @@ const validation = useValidation({
],
});
const parsedDetails = computed(() => {
const parsedRaw = computed(() => {
if (!validation.isValid) {
return undefined;
}
const parsed = withDefaultOnError(() => parsePhoneNumber(rawPhone.value, defaultCountryCode.value), undefined);
return withDefaultOnError(() => parsePhoneNumber(rawPhone.value, defaultCountryCode.value), undefined);
});
const parsedDetails = computed(() => {
const parsed = parsedRaw.value;
if (!parsed) {
return undefined;
}
@ -82,6 +85,27 @@ const countriesOptions = getCountries().map(code => ({
label: `${lookup.byIso(code)?.country || code} (+${getCountryCallingCode(code)})`,
value: code,
}));
const messageToSend = ref('');
const whatsAppLink = computed(() => {
const parsed = parsedRaw.value;
if (!parsed) {
return undefined;
}
const internationalNoPunts = parsed.formatInternational().replace(/^\+0*/g, '').replace(/\D/g, '');
return `https://wa.me/${internationalNoPunts}?text=${encodeURIComponent(messageToSend.value)}`;
});
const smsLink = computed(() => {
const parsed = parsedRaw.value;
if (!parsed) {
return undefined;
}
const internationalNoSpaces = parsed.formatInternational().replace(/\s/g, '');
return `sms:${internationalNoSpaces}&body=${encodeURIComponent(messageToSend.value)}`;
});
</script>
<template>
@ -111,5 +135,34 @@ const countriesOptions = getCountries().map(code => ({
</tr>
</tbody>
</n-table>
<n-divider />
<c-input-text
v-model:value="messageToSend"
multiline
rows="4"
placeholder="Enter a message to send"
label="Message to send:"
mb-2
/>
<c-card v-if="whatsAppLink" title="WhatsApp Send link" mb-2>
<input-copyable :value="whatsAppLink" mb-2 />
<div flex justify-center>
<!-- //NOSONAR --><c-button :href="whatsAppLink" target="_blank">
Send via WhatsApp
</c-button>
</div>
</c-card>
<c-card v-if="smsLink" title="SMS Send link">
<input-copyable :value="smsLink" mb-2 />
<div flex justify-center>
<!-- //NOSONAR --><c-button :href="smsLink" target="_blank">
Send via SMS
</c-button>
</div>
</c-card>
</div>
</template>