Skip to content

Commit c2570e5

Browse files
robsontenoriorobsontenorio
committed
New features
- fetch style request with $get() - pagination with page() and limit()
1 parent c97fdfa commit c2570e5

File tree

10 files changed

+280
-3915
lines changed

10 files changed

+280
-3915
lines changed

‎.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
/node_modules/
22
/build/
3-
/coverage/
3+
/coverage/
4+
yarn-error.log

‎README.md

Lines changed: 97 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@
66
<img src="https://codecov.io/gh/robsontenorio/vue-api-query/branch/master/graph/badge.svg" />
77
</a>
88
<a href="https://www.npmjs.com/package/vue-api-query">
9-
<img src="https://badge.fury.io/js/vue-api-query.svg" />
9+
<img src="https://img.shields.io/npm/dt/vue-api-query.svg" />
10+
</a>
11+
<a href="https://www.npmjs.com/package/vue-api-query">
12+
<img src="https://img.shields.io/npm/v/vue-api-query.svg" />
1013
</a>
1114
<a href="https://github.com/robsontenorio/vue-api-query/blob/master/LICENSE">
1215
<img src="https://img.shields.io/apm/l/vim-mode.svg" />
@@ -88,7 +91,7 @@ We can use relationships:
8891
let user = await User.find(1)
8992

9093
// GET users/1/posts
91-
let posts = user
94+
let posts = await user
9295
.posts()
9396
.get()
9497

@@ -245,7 +248,7 @@ let latest = await Post
245248
.first()
246249
```
247250

248-
## Full example
251+
# Full example
249252

250253
**/models/Post.js**
251254
```js
@@ -344,6 +347,38 @@ let posts = await Post
344347

345348
```
346349

350+
If you like the "promise way" just do it like this:
351+
352+
```js
353+
354+
// single object
355+
356+
let user
357+
358+
User
359+
.where('status', 'ACTIVE')
360+
.first()
361+
.then(response => {
362+
user = response
363+
})
364+
365+
// array of objects
366+
367+
let users
368+
369+
User
370+
.where('status', 'ACTIVE')
371+
.get()
372+
.then(response => {
373+
users = response
374+
375+
// or (depending on backend response)
376+
377+
users = response.data
378+
})
379+
380+
```
381+
347382
And in some page/component:
348383

349384
```js
@@ -379,6 +414,19 @@ export default {
379414

380415
```
381416

417+
# Pagination
418+
419+
```js
420+
// GET /users?sort=firstname&page=1&limit=20
421+
422+
let users = await User
423+
.orderBy('firstname')
424+
.page(1)
425+
.limit(20)
426+
.$get() // sometimes you will prefer $get()
427+
428+
```
429+
382430
# Response from backend
383431

384432
This package automatically handles the response from backend and convert it into an instance of a such Model.
@@ -450,47 +498,60 @@ let user = await User.get()
450498
```js
451499
// works - `data` exists in the root and contains the array of objects
452500
{
453-
data: {
454-
[
455-
{
456-
id: 1,
457-
firstname: 'John',
458-
lastname: 'Doe',
459-
age: 25
460-
},
461-
{
462-
id: 2,
463-
firstname: 'Mary',
464-
lastname: 'Doe',
465-
age: 22
466-
}
467-
]
468-
},
501+
data: [
502+
{
503+
id: 1,
504+
firstname: 'John',
505+
lastname: 'Doe',
506+
age: 25
507+
},
508+
{
509+
id: 2,
510+
firstname: 'Mary',
511+
lastname: 'Doe',
512+
age: 22
513+
}
514+
],
469515
someField: '',
470516
anotherOne: '',
471517
}
518+
519+
// Normally you would handle the response like this
520+
521+
let response = User.get()
522+
let users = response.data
523+
524+
525+
// or like this
526+
527+
const { data } = User.get()
528+
let users = data
529+
530+
// but you can use the "fetch style request" with "$get()"
531+
532+
let users = await User
533+
.where('status', 'ACTIVE')
534+
.$get() // <---- HERE
472535
```
473536

474537
This **WILL NOT** be converted into an array of `User` model.
475538

476539
```js
477540
{
478-
users: {
479-
[
480-
{
481-
id: 1,
482-
firstname: 'John',
483-
lastname: 'Doe',
484-
age: 25
485-
},
486-
{
487-
id: 2,
488-
firstname: 'Mary',
489-
lastname: 'Doe',
490-
age: 22
491-
}
492-
]
493-
},
541+
users: [
542+
{
543+
id: 1,
544+
firstname: 'John',
545+
lastname: 'Doe',
546+
age: 25
547+
},
548+
{
549+
id: 2,
550+
firstname: 'Mary',
551+
lastname: 'Doe',
552+
age: 22
553+
}
554+
],
494555
someField: '',
495556
anotherOne: '',
496557
}
@@ -509,5 +570,5 @@ Why another package if we have those? Because currently (march, 2018) they restr
509570

510571
# Contact
511572

512-
Twitter @robsontenorio
573+
Twitter [@robsontenorio](https://twitter.com/robsontenorio)
513574

‎src/Builder.js

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ export default class Builder {
66
this.includes = []
77
this.appends = []
88
this.sorts = []
9+
this.pageValue = null
10+
this.limitValue = null
911
this.filters = {
1012
filter: {}
1113
}
@@ -29,6 +31,26 @@ export default class Builder {
2931
return this
3032
}
3133

34+
page (value) {
35+
if (!Number.isInteger(value)) {
36+
throw new Error('The VALUE must be an integer on page() method.')
37+
}
38+
39+
this.pageValue = value
40+
41+
return this
42+
}
43+
44+
limit (value) {
45+
if (!Number.isInteger(value)) {
46+
throw new Error('The VALUE must be an integer on limit() method.')
47+
}
48+
49+
this.limitValue = value
50+
51+
return this
52+
}
53+
3254
where (key, value) {
3355
if (key === undefined || value === undefined)
3456
throw new Error('The KEY and VALUE are required on where() method.')

‎src/Model.js

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,26 +58,43 @@ export default class Model extends StaticModel {
5858

5959
include (...args) {
6060
this._builder.include(...args)
61+
6162
return this
6263
}
6364

6465
where (field, value) {
6566
this._builder.where(field, value)
67+
6668
return this
6769
}
6870

6971
whereIn (field, array) {
7072
this._builder.whereIn(field, array)
73+
7174
return this
7275
}
7376

7477
append (...args) {
7578
this._builder.append(...args)
79+
80+
return this
81+
}
82+
83+
page (value) {
84+
this._builder.page(value)
85+
86+
return this
87+
}
88+
89+
limit (value) {
90+
this._builder.limit(value)
91+
7692
return this
7793
}
7894

7995
orderBy (...args) {
8096
this._builder.orderBy(...args)
97+
8198
return this
8299
}
83100

@@ -97,7 +114,7 @@ export default class Model extends StaticModel {
97114

98115
find (id) {
99116
if (!Number.isInteger(id)) {
100-
throw new Error('The "id" must be a integer on find() method.')
117+
throw new Error('The ID must be an integer on find() method.')
101118
}
102119

103120
let url = `${this.baseURL()}/${this.resource()}/${id}${this._builder.query()}`
@@ -148,6 +165,20 @@ export default class Model extends StaticModel {
148165
})
149166
}
150167

168+
$get () {
169+
return this.get().then(response => {
170+
let collection
171+
172+
if (response.data) {
173+
collection = response.data
174+
} else {
175+
collection = response
176+
}
177+
178+
return collection
179+
})
180+
}
181+
151182
hasId () {
152183
return this.id !== undefined && this.id !== 0 && this.id !== ''
153184
}

‎src/Parser.js

Lines changed: 26 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ export default class Parser {
1212
this.filters()
1313
this.appends()
1414
this.sorts()
15+
this.page()
16+
this.limit()
1517

1618
return this.uri
1719
}
@@ -28,6 +30,14 @@ export default class Parser {
2830
return this.builder.appends.length > 0
2931
}
3032

33+
hasPage () {
34+
return this.builder.pageValue !== null
35+
}
36+
37+
hasLimit () {
38+
return this.builder.limitValue !== null
39+
}
40+
3141
hasSorts () {
3242
return this.builder.sorts.length > 0
3343
}
@@ -44,7 +54,6 @@ export default class Parser {
4454
this.uri += this.prepend() + 'include=' + this.builder.includes
4555
}
4656

47-
4857
appends () {
4958
if (!this.hasAppends()) {
5059
return
@@ -53,6 +62,22 @@ export default class Parser {
5362
this.uri += this.prepend() + 'append=' + this.builder.appends
5463
}
5564

65+
page () {
66+
if (!this.hasPage()) {
67+
return
68+
}
69+
70+
this.uri += this.prepend() + 'page=' + this.builder.pageValue
71+
}
72+
73+
limit () {
74+
if (!this.hasLimit()) {
75+
return
76+
}
77+
78+
this.uri += this.prepend() + 'limit=' + this.builder.limitValue
79+
}
80+
5681
sorts () {
5782
if (!this.hasSorts()) {
5883
return

‎src/StaticModel.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,20 @@ export default class StaticModel {
4747
return self
4848
}
4949

50+
static page (value) {
51+
let self = this.instance()
52+
self.page(value)
53+
54+
return self
55+
}
56+
57+
static limit (value) {
58+
let self = this.instance()
59+
self.limit(value)
60+
61+
return self
62+
}
63+
5064
static orderBy (...args) {
5165
let self = this.instance()
5266
self.orderBy(...args)
@@ -71,4 +85,10 @@ export default class StaticModel {
7185

7286
return self.get()
7387
}
88+
89+
static $get () {
90+
let self = this.instance()
91+
92+
return self.$get()
93+
}
7494
}

0 commit comments

Comments
 (0)