quasar-factory-lib 0.0.39 → 0.0.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Table/Table.vue.d.ts +10 -14
- package/dist/components/Table/utils/filterMethod.d.ts +1 -0
- package/dist/layouts/PdaLayout.vue.d.ts +12 -14
- package/dist/pages/TablePage.vue.d.ts +13 -14
- package/dist/quasar-factory-lib.js +1329 -1350
- package/dist/quasar-factory-lib.umd.cjs +11 -11
- package/package.json +1 -1
- package/src/components/Table/Table.vue +6 -19
- package/src/components/Table/utils/filterMethod.ts +6 -6
- package/src/layouts/PdaLayout.vue +187 -2
- package/src/pages/TablePage.vue +15 -2
package/package.json
CHANGED
|
@@ -99,7 +99,6 @@ import TableColumnsSelector from './components/TableColumnsSelector.vue'
|
|
|
99
99
|
import TableSlotBody from './components/TableSlotBody.vue'
|
|
100
100
|
import TableSlotGrid from './components/TableSlotGrid.vue'
|
|
101
101
|
import TableFilter from './components/TableFilter.vue'
|
|
102
|
-
import TableSort from './utils/sort.js'
|
|
103
102
|
import TableSkeleton from './components/TableSkeleton.vue'
|
|
104
103
|
import CardListSkeleton from './components/CardListSkeleton.vue'
|
|
105
104
|
|
|
@@ -128,15 +127,15 @@ export default defineComponent({
|
|
|
128
127
|
},
|
|
129
128
|
filterMethod: {
|
|
130
129
|
type: Function,
|
|
131
|
-
|
|
130
|
+
required: true
|
|
132
131
|
},
|
|
133
132
|
filterComputed: {
|
|
134
133
|
type: Object,
|
|
135
|
-
|
|
134
|
+
required: true
|
|
136
135
|
},
|
|
137
|
-
|
|
138
|
-
type:
|
|
139
|
-
|
|
136
|
+
sortMethod: {
|
|
137
|
+
type: Function,
|
|
138
|
+
required: true
|
|
140
139
|
},
|
|
141
140
|
selectionType: {
|
|
142
141
|
type: String as () => 'none' | 'single' | 'multiple',
|
|
@@ -284,19 +283,7 @@ export default defineComponent({
|
|
|
284
283
|
},
|
|
285
284
|
toogleLoading () {
|
|
286
285
|
this.loading = !this.loading
|
|
287
|
-
},
|
|
288
|
-
sortMethod (rows: object[], sortBy: string, descending: boolean): object[] | [] {
|
|
289
|
-
const allrowsSorted = TableSort.sortMethod(rows, sortBy, descending, this.sortDataValues)
|
|
290
|
-
const rowsSliced = allrowsSorted.slice(0, rows.length)
|
|
291
|
-
if (this.store.valueInputFilterTable === '') {
|
|
292
|
-
return rowsSliced
|
|
293
|
-
} else {
|
|
294
|
-
return TableSort.sortMethod(rows, sortBy, descending, this.sortDataValues)
|
|
295
|
-
}
|
|
296
286
|
}
|
|
297
287
|
}
|
|
298
288
|
})
|
|
299
|
-
</script>
|
|
300
|
-
<style>
|
|
301
|
-
/* @import url('./style.css'); */
|
|
302
|
-
</style>
|
|
289
|
+
</script>
|
|
@@ -2,16 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
import infiniteScroll from './infiniteScroll'
|
|
4
4
|
const filterMethod = {
|
|
5
|
-
filter (self: {filterTerms: string }, rows: string | [], terms: { search: string }): object[] | [] {
|
|
6
|
-
self.
|
|
7
|
-
if (terms.search) {
|
|
5
|
+
filter (self: {filterTerms: string, filteredRows: object [] | [] }, rows: string | [], terms: { search: string }): object[] | [] {
|
|
6
|
+
if (self.store.filterValue !== '') {
|
|
8
7
|
const filteredRows = []
|
|
9
8
|
const lowerSearch = terms.search ? terms.search.toLowerCase() : ''
|
|
10
|
-
for (let i = 0; i < rows.length; i++) {
|
|
11
|
-
if (this.containsSearchTermInRow(rows[i], lowerSearch)) {
|
|
12
|
-
filteredRows.push(rows[i])
|
|
9
|
+
for (let i = 0; i < self.rows.length; i++) {
|
|
10
|
+
if (this.containsSearchTermInRow(self.rows[i], lowerSearch)) {
|
|
11
|
+
filteredRows.push(self.rows[i])
|
|
13
12
|
}
|
|
14
13
|
}
|
|
14
|
+
self.filteredRows = filteredRows
|
|
15
15
|
return infiniteScroll.paginationNewTable(self, filteredRows)
|
|
16
16
|
} else {
|
|
17
17
|
return infiniteScroll.paginationNewTable(self, rows)
|
|
@@ -31,6 +31,8 @@
|
|
|
31
31
|
:selection-type="'multiple'"
|
|
32
32
|
:filter-method="filterMethod"
|
|
33
33
|
:filter-computed="filter"
|
|
34
|
+
:sortDataValues="['date']"
|
|
35
|
+
:filteredRows="filteredRows"
|
|
34
36
|
@on-select-visible-columns="saveSelectedColumns"
|
|
35
37
|
@on-update-basic-checkbox-value="onUpdateBasicCheckboxValue"
|
|
36
38
|
@on-update-customized-checkbox-value="onUpdateCustomizedCheckboxValue"
|
|
@@ -61,7 +63,7 @@ export default {
|
|
|
61
63
|
forceRender: false,
|
|
62
64
|
store: tableStore(),
|
|
63
65
|
totalPage: 0,
|
|
64
|
-
pageSize:
|
|
66
|
+
pageSize:15,
|
|
65
67
|
tableStyle: '',
|
|
66
68
|
columns: [{
|
|
67
69
|
name: 'name',
|
|
@@ -70,6 +72,13 @@ export default {
|
|
|
70
72
|
align: 'left',
|
|
71
73
|
sortable: true
|
|
72
74
|
},
|
|
75
|
+
{
|
|
76
|
+
name: 'date',
|
|
77
|
+
required: true,
|
|
78
|
+
label: 'Fecha',
|
|
79
|
+
align: 'left',
|
|
80
|
+
sortable: true
|
|
81
|
+
},
|
|
73
82
|
{
|
|
74
83
|
name: 'available',
|
|
75
84
|
required: true,
|
|
@@ -164,6 +173,7 @@ export default {
|
|
|
164
173
|
{
|
|
165
174
|
id: 1,
|
|
166
175
|
name: 'Frozen Yogurt',
|
|
176
|
+
date: '21/12/2024',
|
|
167
177
|
booleanIcon: true,
|
|
168
178
|
available: true,
|
|
169
179
|
calories: 159,
|
|
@@ -178,6 +188,7 @@ export default {
|
|
|
178
188
|
{
|
|
179
189
|
id: 2,
|
|
180
190
|
name: 'Ice cream sandwich',
|
|
191
|
+
date: '12/12/2024',
|
|
181
192
|
booleanIcon: true,
|
|
182
193
|
available: false,
|
|
183
194
|
calories: 237,
|
|
@@ -192,6 +203,7 @@ export default {
|
|
|
192
203
|
{
|
|
193
204
|
id: 3,
|
|
194
205
|
name: 'Eclair',
|
|
206
|
+
date: '21/12/2025',
|
|
195
207
|
booleanIcon: true,
|
|
196
208
|
available: true,
|
|
197
209
|
calories: 262,
|
|
@@ -206,6 +218,7 @@ export default {
|
|
|
206
218
|
{
|
|
207
219
|
id: 4,
|
|
208
220
|
name: 'Cupcake',
|
|
221
|
+
date: '05/07/2024',
|
|
209
222
|
booleanIcon: false,
|
|
210
223
|
available: false,
|
|
211
224
|
calories: 305,
|
|
@@ -220,6 +233,7 @@ export default {
|
|
|
220
233
|
{
|
|
221
234
|
id: 5,
|
|
222
235
|
name: 'Gingerbread',
|
|
236
|
+
date: '07/05/2024',
|
|
223
237
|
booleanIcon: true,
|
|
224
238
|
available: true,
|
|
225
239
|
calories: 356,
|
|
@@ -234,6 +248,7 @@ export default {
|
|
|
234
248
|
{
|
|
235
249
|
id: 5,
|
|
236
250
|
name: 'Jelly bean',
|
|
251
|
+
date: '11/12/2025',
|
|
237
252
|
booleanIcon: false,
|
|
238
253
|
available: false,
|
|
239
254
|
calories: 375,
|
|
@@ -249,6 +264,7 @@ export default {
|
|
|
249
264
|
id: 6,
|
|
250
265
|
name: 'Lollipop',
|
|
251
266
|
booleanIcon: true,
|
|
267
|
+
date: '21/12/2024',
|
|
252
268
|
available: true,
|
|
253
269
|
calories: 392,
|
|
254
270
|
fat: 0.2,
|
|
@@ -263,6 +279,7 @@ export default {
|
|
|
263
279
|
id: 7,
|
|
264
280
|
name: 'Honeycomb',
|
|
265
281
|
booleanIcon: true,
|
|
282
|
+
date: '22/12/2023',
|
|
266
283
|
available: false,
|
|
267
284
|
calories: 408,
|
|
268
285
|
fat: 3.2,
|
|
@@ -277,6 +294,7 @@ export default {
|
|
|
277
294
|
id: 8,
|
|
278
295
|
name: 'Donut',
|
|
279
296
|
booleanIcon: true,
|
|
297
|
+
date: '25/12/2024',
|
|
280
298
|
available: true,
|
|
281
299
|
calories: 452,
|
|
282
300
|
fat: 25.0,
|
|
@@ -290,6 +308,172 @@ export default {
|
|
|
290
308
|
{
|
|
291
309
|
id: 9,
|
|
292
310
|
name: 'KitKat',
|
|
311
|
+
date: '20/12/2024',
|
|
312
|
+
booleanIcon: false,
|
|
313
|
+
available: false,
|
|
314
|
+
calories: 518,
|
|
315
|
+
fat: 26.0,
|
|
316
|
+
carbs: 65,
|
|
317
|
+
checked: true,
|
|
318
|
+
protein: 7,
|
|
319
|
+
sodium: 54,
|
|
320
|
+
calcium: '12%',
|
|
321
|
+
iron: '6%'
|
|
322
|
+
},
|
|
323
|
+
{
|
|
324
|
+
id: 10,
|
|
325
|
+
name: 'Frozen Yogurt',
|
|
326
|
+
date: '21/12/2024',
|
|
327
|
+
booleanIcon: true,
|
|
328
|
+
available: true,
|
|
329
|
+
calories: 159,
|
|
330
|
+
fat: 6.0,
|
|
331
|
+
carbs: 24,
|
|
332
|
+
checked: false,
|
|
333
|
+
protein: 4.0,
|
|
334
|
+
sodium: 87,
|
|
335
|
+
calcium: '14%',
|
|
336
|
+
iron: '1%'
|
|
337
|
+
},
|
|
338
|
+
{
|
|
339
|
+
id: 11,
|
|
340
|
+
name: 'Frozen Yogurt',
|
|
341
|
+
date: '21/12/2024',
|
|
342
|
+
booleanIcon: true,
|
|
343
|
+
available: true,
|
|
344
|
+
calories: 159,
|
|
345
|
+
fat: 6.0,
|
|
346
|
+
carbs: 24,
|
|
347
|
+
checked: false,
|
|
348
|
+
protein: 4.0,
|
|
349
|
+
sodium: 87,
|
|
350
|
+
calcium: '14%',
|
|
351
|
+
iron: '1%'
|
|
352
|
+
},
|
|
353
|
+
{
|
|
354
|
+
id: 12,
|
|
355
|
+
name: 'Ice cream sandwich',
|
|
356
|
+
date: '12/12/2024',
|
|
357
|
+
booleanIcon: true,
|
|
358
|
+
available: false,
|
|
359
|
+
calories: 237,
|
|
360
|
+
fat: 9.0,
|
|
361
|
+
carbs: 37,
|
|
362
|
+
checked: false,
|
|
363
|
+
protein: 4.3,
|
|
364
|
+
sodium: 129,
|
|
365
|
+
calcium: '8%',
|
|
366
|
+
iron: '1%'
|
|
367
|
+
},
|
|
368
|
+
{
|
|
369
|
+
id: 13,
|
|
370
|
+
name: 'Eclair',
|
|
371
|
+
date: '21/12/2025',
|
|
372
|
+
booleanIcon: true,
|
|
373
|
+
available: true,
|
|
374
|
+
calories: 262,
|
|
375
|
+
fat: 16.0,
|
|
376
|
+
carbs: 23,
|
|
377
|
+
checked: false,
|
|
378
|
+
protein: 6.0,
|
|
379
|
+
sodium: 337,
|
|
380
|
+
calcium: '6%',
|
|
381
|
+
iron: '7%'
|
|
382
|
+
},
|
|
383
|
+
{
|
|
384
|
+
id: 14,
|
|
385
|
+
name: 'Cupcake',
|
|
386
|
+
date: '05/07/2024',
|
|
387
|
+
booleanIcon: false,
|
|
388
|
+
available: false,
|
|
389
|
+
calories: 305,
|
|
390
|
+
fat: 3.7,
|
|
391
|
+
carbs: 67,
|
|
392
|
+
checked: false,
|
|
393
|
+
protein: 4.3,
|
|
394
|
+
sodium: 413,
|
|
395
|
+
calcium: '3%',
|
|
396
|
+
iron: '8%'
|
|
397
|
+
},
|
|
398
|
+
{
|
|
399
|
+
id: 15,
|
|
400
|
+
name: 'Gingerbread',
|
|
401
|
+
date: '07/05/2024',
|
|
402
|
+
booleanIcon: true,
|
|
403
|
+
available: true,
|
|
404
|
+
calories: 356,
|
|
405
|
+
fat: 16.0,
|
|
406
|
+
carbs: 49,
|
|
407
|
+
checked: false,
|
|
408
|
+
protein: 3.9,
|
|
409
|
+
sodium: 327,
|
|
410
|
+
calcium: '7%',
|
|
411
|
+
iron: '16%'
|
|
412
|
+
},
|
|
413
|
+
{
|
|
414
|
+
id: 16,
|
|
415
|
+
name: 'Jelly bean',
|
|
416
|
+
date: '11/12/2025',
|
|
417
|
+
booleanIcon: false,
|
|
418
|
+
available: false,
|
|
419
|
+
calories: 375,
|
|
420
|
+
fat: 0.0,
|
|
421
|
+
carbs: 94,
|
|
422
|
+
checked: true,
|
|
423
|
+
protein: 0.0,
|
|
424
|
+
sodium: 50,
|
|
425
|
+
calcium: '0%',
|
|
426
|
+
iron: '0%'
|
|
427
|
+
},
|
|
428
|
+
{
|
|
429
|
+
id: 17,
|
|
430
|
+
name: 'Lollipop',
|
|
431
|
+
booleanIcon: true,
|
|
432
|
+
date: '21/12/2024',
|
|
433
|
+
available: true,
|
|
434
|
+
calories: 392,
|
|
435
|
+
fat: 0.2,
|
|
436
|
+
carbs: 98,
|
|
437
|
+
checked: false,
|
|
438
|
+
protein: 0,
|
|
439
|
+
sodium: 38,
|
|
440
|
+
calcium: '0%',
|
|
441
|
+
iron: '2%'
|
|
442
|
+
},
|
|
443
|
+
{
|
|
444
|
+
id: 18,
|
|
445
|
+
name: 'Honeycomb',
|
|
446
|
+
booleanIcon: true,
|
|
447
|
+
date: '22/12/2023',
|
|
448
|
+
available: false,
|
|
449
|
+
calories: 408,
|
|
450
|
+
fat: 3.2,
|
|
451
|
+
carbs: 87,
|
|
452
|
+
checked: true,
|
|
453
|
+
protein: 6.5,
|
|
454
|
+
sodium: 562,
|
|
455
|
+
calcium: '0%',
|
|
456
|
+
iron: '45%'
|
|
457
|
+
},
|
|
458
|
+
{
|
|
459
|
+
id: 19,
|
|
460
|
+
name: 'Donut',
|
|
461
|
+
booleanIcon: true,
|
|
462
|
+
date: '25/12/2024',
|
|
463
|
+
available: true,
|
|
464
|
+
calories: 452,
|
|
465
|
+
fat: 25.0,
|
|
466
|
+
carbs: 51,
|
|
467
|
+
checked: false,
|
|
468
|
+
protein: 4.9,
|
|
469
|
+
sodium: 326,
|
|
470
|
+
calcium: '2%',
|
|
471
|
+
iron: '22%'
|
|
472
|
+
},
|
|
473
|
+
{
|
|
474
|
+
id: 20,
|
|
475
|
+
name: 'Last line',
|
|
476
|
+
date: '31/12/2026',
|
|
293
477
|
booleanIcon: false,
|
|
294
478
|
available: false,
|
|
295
479
|
calories: 518,
|
|
@@ -302,7 +486,8 @@ export default {
|
|
|
302
486
|
iron: '6%'
|
|
303
487
|
}
|
|
304
488
|
],
|
|
305
|
-
visibleColumns: []
|
|
489
|
+
visibleColumns: [],
|
|
490
|
+
filteredRows: []
|
|
306
491
|
}
|
|
307
492
|
},
|
|
308
493
|
computed: {
|
package/src/pages/TablePage.vue
CHANGED
|
@@ -18,6 +18,7 @@
|
|
|
18
18
|
:selection-type="'multiple'"
|
|
19
19
|
:filter-method="filterMethod"
|
|
20
20
|
:filter-computed="filter"
|
|
21
|
+
:sort-method="sortMethod"
|
|
21
22
|
@on-select-visible-columns="saveSelectedColumns"
|
|
22
23
|
@on-update-basic-checkbox-value="onUpdateBasicCheckboxValue"
|
|
23
24
|
@on-update-customized-checkbox-value="onUpdateCustomizedCheckboxValue"
|
|
@@ -32,6 +33,7 @@ import Table from '../components/Table/Table.vue'
|
|
|
32
33
|
import setTableHeight from '../components/Table/utils/setTableHeight'
|
|
33
34
|
import infiniteScroll from '../components/Table/utils/infiniteScroll'
|
|
34
35
|
import FilterMethod from '../components/Table/utils/filterMethod'
|
|
36
|
+
import TableSort from '../components/Table/utils/sort.js'
|
|
35
37
|
import { tableStore } from '../store/table.js'
|
|
36
38
|
export default {
|
|
37
39
|
components: {
|
|
@@ -275,7 +277,9 @@ export default {
|
|
|
275
277
|
iron: '6%'
|
|
276
278
|
}
|
|
277
279
|
],
|
|
278
|
-
visibleColumns: []
|
|
280
|
+
visibleColumns: [],
|
|
281
|
+
sortDateValues: ['dateCreation'],
|
|
282
|
+
filteredRows: []
|
|
279
283
|
}
|
|
280
284
|
},
|
|
281
285
|
computed: {
|
|
@@ -291,10 +295,10 @@ export default {
|
|
|
291
295
|
},
|
|
292
296
|
mounted () {
|
|
293
297
|
this.store.cleanTableFilter()
|
|
298
|
+
this.visibleColumns = this.store.visiblecolumns
|
|
294
299
|
this.tableStyle = setTableHeight.setTableHeight()
|
|
295
300
|
infiniteScroll.handleInfiniteScrollNewTable(this)
|
|
296
301
|
this.rows = this.rowsData
|
|
297
|
-
this.visibleColumns = this.store.visiblecolumns
|
|
298
302
|
},
|
|
299
303
|
methods: {
|
|
300
304
|
saveSelectedColumns (columns: string []): void {
|
|
@@ -312,6 +316,15 @@ export default {
|
|
|
312
316
|
},
|
|
313
317
|
setItemNotFound (rows: object []) {
|
|
314
318
|
console.log(rows, 'onClickButton')
|
|
319
|
+
},
|
|
320
|
+
sortMethod (rows: object[], sortBy: string, descending: boolean): object[] | [] {
|
|
321
|
+
let allrowsSorted = []
|
|
322
|
+
if (this.store.filterValue !== '') {
|
|
323
|
+
allrowsSorted = TableSort.sortMethod(this.filteredRows, sortBy, descending, this.sortDateValues)
|
|
324
|
+
} else {
|
|
325
|
+
allrowsSorted = TableSort.sortMethod(this.rows, sortBy, descending, this.sortDateValues)
|
|
326
|
+
}
|
|
327
|
+
return allrowsSorted.slice(0, rows.length)
|
|
315
328
|
}
|
|
316
329
|
}
|
|
317
330
|
}
|