Skip to content

Commit

Permalink
feat(core): Add -dash support for phone formatting
Browse files Browse the repository at this point in the history 
BREAKING CHANGE: Update the component if you need to dashes support
  • Loading branch information
@perchiks
perchiks committed Apr 2, 2018
1 parent bc7a92b commit 5123f9b
Show file tree
Hide file tree
Showing 5 changed files with 122 additions and 19 deletions.
34 changes: 21 additions & 13 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@ import e164 from 'vue-164'
const options = {
plus: true,
brackets: false,
space: false
space: false,
dash: false
}

Vue.use(e164, options)
Expand All @@ -27,28 +28,35 @@ Vue.use(e164, options)
**plus** {Boolean} - add plus symbol before area code
**brackets** {Boolean} - add brackets
**space** {Boolean} - split number by space
**dash** {Boolean} - split number -

If you want to use E.164 standart, you need this options:

```
{
plus: true,
brackets: false,
space: false
space: false,
dash: false
}
```

### Examples
| plus | brackets | space | Result |
|:-----:|:--------:|:-----:|:----------------------:|
| true | true | true | `+1 (495) 000 99 88` |
| false | false | false | `14950009988` |
| true | false | false | `+14950009988` (E.164) |
| true | true | false | `+1(495)0009988` |
| false | true | true | `1 (495) 000 99 88` |
| false | false | true | `1 495 000 99 88` |
| false | true | false | `1(495)0009988` |
| true | false | true | `+1 495 000 99 88` |
| plus | brackets | space | dash | Result |
|:-----:|:--------:|:-----:|:-----:|:----------------------:|
| true | true | true | false | `+1 (495) 000 99 88` |
| false | false | false | false | `14950009988` |
| true | false | false | false | `+14950009988` (E.164) |
| true | true | false | false | `+1(495)0009988` |
| false | true | true | false | `1 (495) 000 99 88` |
| false | false | true | false | `1 495 000 99 88` |
| false | true | false | false | `1(495)0009988` |
| true | false | true | false | `+1 495 000 99 88` |
| true | true | true | true |`+1 (495) 000 - 99 - 88`|
| true | true | false | true | `+1(495)000-99-88` |
| true | false | true | true | `+1 495 000 - 99 - 88` |
| false | true | true | true |`1 (495) 000 - 99 - 88` |
| true | false | true | true | `+1 495 000 - 99 - 88` |

### Usage

Expand All @@ -62,7 +70,7 @@ vue-e164 add `phone` filter, and can be used as any other vue.js filter.
If you need to use different options for each element, from `v0.0.2` you can use directive `v-phone`:
```
<template>
<p v-phone="{ plus: true, brackets: false, space: false }">{{ string }}</p>
<p v-phone="{ plus: true, brackets: false, space: false, dash: false }">{{ string }}</p>
</template>
```

Expand Down
46 changes: 45 additions & 1 deletion dist/test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,50 +8,93 @@ var tests = [{
plus: true,
brackets: true,
space: true,
dash: false,
answer: '+7 (999) 975 70 65',
pattern: '+ () _'
}, {
plus: false,
brackets: false,
space: false,
dash: false,
answer: '79999757065',
pattern: 'all options false'
}, {
plus: true,
brackets: false,
space: false,
dash: false,
answer: '+79999757065',
pattern: '+'
}, {
plus: true,
brackets: true,
space: false,
dash: false,
answer: '+7(999)9757065',
pattern: '+ ()'
}, {
plus: false,
brackets: true,
space: true,
dash: false,
answer: '7 (999) 975 70 65',
pattern: '() _'
}, {
plus: false,
brackets: false,
space: true,
dash: false,
answer: '7 999 975 70 65',
pattern: '_'
}, {
plus: false,
brackets: true,
space: false,
dash: false,
answer: '7(999)9757065',
pattern: '()'
}, {
plus: true,
brackets: false,
space: true,
dash: false,
answer: '+7 999 975 70 65',
pattern: '+ _'
}, {
plus: true,
brackets: true,
space: true,
dash: true,
answer: '+7 (999) 975 - 70 - 65',
pattern: '+ () _ -'
}, {
plus: true,
brackets: true,
space: false,
dash: true,
answer: '+7(999)975-70-65',
pattern: '+ () -'
}, {
plus: true,
brackets: false,
space: true,
dash: true,
answer: '+7 999 975 - 70 - 65',
pattern: '+ _ -'
}, {
plus: false,
brackets: true,
space: true,
dash: true,
answer: '7 (999) 975 - 70 - 65',
pattern: '() _ -'
}, {
plus: true,
brackets: false,
space: true,
dash: true,
answer: '+7 999 975 - 70 - 65',
pattern: '+ _ -'
}];

describe('Using different options', function () {
Expand All @@ -64,7 +107,8 @@ describe('Using different options', function () {
assert.equal((0, _vueE.filter)('', {
plus: true,
brackets: false,
space: true
space: true,
dash: false
}), '');
});
});
4 changes: 2 additions & 2 deletions dist/vue-e164.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

51 changes: 50 additions & 1 deletion src/test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,57 +6,105 @@ const tests = [
plus: true,
brackets: true,
space: true,
dash: false,
answer: '+7 (999) 975 70 65',
pattern: '+ () _'
},
{
plus: false,
brackets: false,
space: false,
dash: false,
answer: '79999757065',
pattern: 'all options false'
},
{
plus: true,
brackets: false,
space: false,
dash: false,
answer: '+79999757065',
pattern: '+'
},
{
plus: true,
brackets: true,
space: false,
dash: false,
answer: '+7(999)9757065',
pattern: '+ ()'
},
{
plus: false,
brackets: true,
space: true,
dash: false,
answer: '7 (999) 975 70 65',
pattern: '() _'
},
{
plus: false,
brackets: false,
space: true,
dash: false,
answer: '7 999 975 70 65',
pattern: '_'
},
{
plus: false,
brackets: true,
space: false,
dash: false,
answer: '7(999)9757065',
pattern: '()'
},
{
plus: true,
brackets: false,
space: true,
dash: false,
answer: '+7 999 975 70 65',
pattern: '+ _'
},
{
plus: true,
brackets: true,
space: true,
dash: true,
answer: '+7 (999) 975 - 70 - 65',
pattern: '+ () _ -'
},
{
plus: true,
brackets: true,
space: false,
dash: true,
answer: '+7(999)975-70-65',
pattern: '+ () -'
},
{
plus: true,
brackets: false,
space: true,
dash: true,
answer: '+7 999 975 - 70 - 65',
pattern: '+ _ -'
},
{
plus: false,
brackets: true,
space: true,
dash: true,
answer: '7 (999) 975 - 70 - 65',
pattern: '() _ -'
},
{
plus: true,
brackets: false,
space: true,
dash: true,
answer: '+7 999 975 - 70 - 65',
pattern: '+ _ -'
}
]

Expand All @@ -70,7 +118,8 @@ describe('Using different options', () => {
assert.equal(filter('', {
plus: true,
brackets: false,
space: true
space: true,
dash: false
}), '')
})
})
6 changes: 4 additions & 2 deletions src/vue-e164.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,17 @@ function standart (string/*: string */)/*: string */ {
return `+${newString.join('').substring(0, 15)}`
}

export function filter (value/*: string */, _options/*: {plus: boolean, brackets: boolean, space: boolean} */) {
export function filter (value/*: string */, _options/*: {plus: boolean, brackets: boolean, space: boolean, dash: boolean} */) {
if (!value) return ''
let reg = /^(\+)(\d)(\d{2,3})(\d{3})(\d{2})(\d{2})/ig
let plus = (_options.plus) ? '+' : ''
let brackets = (_options.brackets) ? {l: '(', r: ')'} : {l: '', r: ''}
let space = (_options.space) ? ' ' : ''
let dash = (_options.dash) ? '-' : ''
let e164/*: string */ = standart(value)
let ph = reg.exec(e164)
return `${plus}${ph[2]}${space}${brackets.l}${ph[3]}${brackets.r}${space}${ph[4]}${space}${ph[5]}${space}${ph[6]}`
/* + 7 _ ( 123 ) _ 123 _ - 45 _ - 67 */
return `${plus}${ph[2]}${space}${brackets.l}${ph[3]}${brackets.r}${space}${ph[4]}${space}${dash}${(dash) ? space : ''}${ph[5]}${space}${dash}${(dash) ? space : ''}${ph[6]}`
}

vueE164.install = function (Vue /*: any */, options/*: {plus: boolean, brackets: boolean, space: boolean} */) {
Expand Down

0 comments on commit 5123f9b

Please # to comment.