@bildvitta/quasar-ui-asteroid 2.14.0 → 3.0.0-alpha.1
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/api/QasBox.json +16 -0
- package/dist/api/QasBreakline.json +32 -0
- package/dist/api/QasBtn.json +15 -0
- package/dist/api/QasDebugger.json +13 -0
- package/dist/asteroid.cjs.css +1 -1
- package/dist/asteroid.cjs.js +6762 -1400
- package/dist/asteroid.cjs.min.js +2 -2
- package/dist/asteroid.esm.css +1 -1
- package/dist/asteroid.esm.js +6764 -1405
- package/dist/asteroid.esm.min.js +2 -2
- package/dist/asteroid.umd.css +1 -1
- package/dist/asteroid.umd.js +6760 -1405
- package/dist/asteroid.umd.min.js +2 -2
- package/dist/vetur/asteroid-attributes.json +16 -0
- package/dist/vetur/asteroid-tags.json +19 -0
- package/package.json +41 -56
- package/src/assets/logo-modular.svg +1 -1
- package/src/asteroid.js +1 -0
- package/src/components/actions/QasActions.vue +45 -0
- package/src/components/actions-menu/QasActionsMenu.vue +8 -19
- package/src/components/alert/QasAlert.vue +90 -0
- package/src/components/app-bar/QasAppBar.vue +16 -13
- package/src/components/app-menu/QasAppMenu.vue +10 -7
- package/src/components/avatar/QasAvatar.vue +7 -3
- package/src/components/box/QasBox.vue +12 -4
- package/src/components/box/QasBox.yml +13 -0
- package/src/components/breakline/QasBreakline.vue +37 -0
- package/src/components/breakline/QasBreakline.yml +25 -0
- package/src/components/btn/QasBtn.vue +27 -24
- package/src/components/btn/QasBtn.yml +12 -0
- package/src/components/card/QasCard.vue +29 -21
- package/src/components/checkbox-group/QasCheckboxGroup.vue +31 -17
- package/src/components/copy/QasCopy.vue +22 -11
- package/src/components/date-time-input/QasDateTimeInput.vue +16 -26
- package/src/components/debugger/QasDebugger.vue +2 -0
- package/src/components/debugger/QasDebugger.yml +10 -0
- package/src/components/delete/QasDelete.vue +28 -15
- package/src/components/dialog/QasDialog.vue +71 -67
- package/src/components/dialog-router/QasDialogRouter.vue +12 -4
- package/src/components/field/QasField.vue +16 -19
- package/src/components/filters/QasFilters.vue +31 -24
- package/src/components/form-generator/QasFormGenerator.vue +13 -15
- package/src/components/form-view/QasFormView.vue +117 -66
- package/src/components/gallery/QasGallery.vue +39 -26
- package/src/components/grid-generator/QasGridGenerator.vue +12 -6
- package/src/components/index.js +0 -0
- package/src/components/input/QasInput.vue +38 -36
- package/src/components/label/QasLabel.vue +14 -15
- package/src/components/layout/QasLayout.vue +13 -21
- package/src/components/list-items/QasListItems.vue +16 -8
- package/src/components/list-view/QasListView.vue +31 -28
- package/src/components/map/QasMap.vue +15 -25
- package/src/components/nested-fields/QasNestedFields.vue +39 -36
- package/src/components/numeric-input/QasNumericInput.vue +24 -21
- package/src/components/page-header/QasPageHeader.vue +19 -10
- package/src/components/password-input/QasPasswordInput.vue +20 -18
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.vue +52 -31
- package/src/components/profile/QasProfile.vue +14 -12
- package/src/components/resizer/QasResizer.vue +1 -1
- package/src/components/search-box/QasSearchBox.vue +36 -20
- package/src/components/select/QasSelect.vue +41 -44
- package/src/components/select-list/QasSelectList.vue +64 -51
- package/src/components/signature-pad/QasSignaturePad.vue +57 -41
- package/src/components/signature-uploader/QasSignatureUploader.vue +15 -13
- package/src/components/single-view/QasSingleView.vue +31 -17
- package/src/components/sortable/QasSortable.vue +45 -27
- package/src/components/table-generator/QasTableGenerator.vue +95 -22
- package/src/components/tabs-generator/QasTabsGenerator.vue +36 -24
- package/src/components/text-truncate/QasTextTruncate.vue +25 -17
- package/src/components/transfer/QasTransfer.vue +57 -53
- package/src/components/uploader/QasUploader.vue +169 -48
- package/src/css/background.scss +1 -1
- package/src/css/border.scss +7 -6
- package/src/css/design-system.scss +0 -43
- package/src/css/fonts.scss +2 -28
- package/src/css/opacity.scss +0 -4
- package/src/css/set-brand.scss +15 -0
- package/src/css/transitions.scss +1 -1
- package/src/helpers/add-counter-suffix.js +3 -0
- package/src/helpers/{base64ToBlob.js → base-64-to-blob.js} +0 -0
- package/src/helpers/{constructObject.js → construct-object.js} +0 -0
- package/src/helpers/filter-object.js +8 -6
- package/src/helpers/filters.js +2 -3
- package/src/helpers/get-slot-children-text.js +15 -0
- package/src/helpers/{greatestCommonDivisor.js → greatest-common-divisor.js} +0 -0
- package/src/helpers/images.js +28 -0
- package/src/helpers/index.js +11 -59
- package/src/helpers/{isLocalDevelopment.js → is-local-development.js} +0 -0
- package/src/helpers/scroll-on-grap.js +61 -0
- package/src/index.cjs.js +1 -0
- package/src/index.esm.js +4 -0
- package/src/index.scss +19 -21
- package/src/index.umd.js +2 -0
- package/src/mixins/context.js +1 -1
- package/src/mixins/dialog-router.js +17 -0
- package/src/mixins/form.js +4 -12
- package/src/mixins/generator.js +14 -14
- package/src/mixins/index.js +2 -8
- package/src/mixins/password.js +73 -11
- package/src/mixins/screen.js +8 -6
- package/src/mixins/view.js +57 -20
- package/src/plugins/Dialog.js +14 -0
- package/src/plugins/NotifySuccess.js +3 -3
- package/src/plugins/index.js +4 -2
- package/src/store/history.js +43 -0
- package/src/store/index.js +1 -0
- package/src/vue-plugin.js +185 -0
- package/.babelrc +0 -12
- package/.storybook/main.js +0 -35
- package/.storybook/preview.js +0 -26
- package/debug.log +0 -1
- package/index.js +0 -4
- package/jest-setup.js +0 -1
- package/jest.config.json +0 -22
- package/postcss.config.js +0 -5
- package/src/components/Introduction.stories.mdx +0 -12
- package/src/components/actions-menu/QasActionsMenu.stories.js +0 -73
- package/src/components/app-bar/QasAppBar.stories.js +0 -84
- package/src/components/app-menu/QasAppMenu.stories.js +0 -66
- package/src/components/apps-menu/QasAppsMenu.spec.js +0 -58
- package/src/components/apps-menu/QasAppsMenu.stories.js +0 -54
- package/src/components/apps-menu/QasAppsMenu.vue +0 -48
- package/src/components/avatar/QasAvatar.spec.js +0 -14
- package/src/components/avatar/QasAvatar.stories.js +0 -52
- package/src/components/box/QasBox.spec.js +0 -18
- package/src/components/box/QasBox.stories.js +0 -35
- package/src/components/break-line/QasBreakLine.stories.js +0 -57
- package/src/components/break-line/QasBreakLine.vue +0 -52
- package/src/components/btn/QasBtn.stories.js +0 -45
- package/src/components/btn-actions/QasBtnActions.stories.js +0 -77
- package/src/components/btn-actions/QasBtnActions.vue +0 -54
- package/src/components/card/QasCard.stories.js +0 -126
- package/src/components/checkbox-group/QasCheckboxGroup.stories.js +0 -59
- package/src/components/copy/QasCopy.stories.js +0 -41
- package/src/components/date-time-input/QasDateTimeInput.stories.js +0 -67
- package/src/components/debugger/QasDebugger.stories.js +0 -33
- package/src/components/delete/QasDelete.stories.js +0 -80
- package/src/components/dialog/QasDialog.stories.js +0 -139
- package/src/components/dialog-router/QasDialogRouter.stories.js +0 -38
- package/src/components/field/QasField.stories.js +0 -181
- package/src/components/filters/QasFilters.stories.js +0 -121
- package/src/components/form-generator/QasFormGenerator.stories.js +0 -115
- package/src/components/form-view/QasFormView.stories.js +0 -236
- package/src/components/gallery/QasGallery.stories.js +0 -91
- package/src/components/grid-generator/QasGridGenerator.stories.js +0 -138
- package/src/components/input/QasInput.stories.js +0 -78
- package/src/components/label/QasLabel.stories.js +0 -60
- package/src/components/layout/QasLayout.stories.js +0 -104
- package/src/components/list-items/QasListItems.stories.js +0 -130
- package/src/components/list-view/QasListView.stories.js +0 -168
- package/src/components/map/QasMap.stories.js +0 -75
- package/src/components/nested-fields/QasNestedFields.stories.js +0 -255
- package/src/components/numeric-input/QasNumericInput.stories.js +0 -92
- package/src/components/page-header/QasPageHeader.stories.js +0 -61
- package/src/components/password-input/QasPasswordInput.stories.js +0 -76
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.stories.js +0 -54
- package/src/components/profile/QasProfile.stories.js +0 -131
- package/src/components/resizer/QasResizer.stories.js +0 -43
- package/src/components/search-box/QasSearchBox.stories.js +0 -111
- package/src/components/select/QasSelect.stories.js +0 -113
- package/src/components/select-list/QasSelectList.stories.js +0 -153
- package/src/components/signature-pad/QasSignaturePad.stories.js +0 -51
- package/src/components/signature-uploader/QasSignatureUploader.stories.js +0 -69
- package/src/components/single-view/QasSingleView.stories.js +0 -130
- package/src/components/sortable/QasSortable.stories.js +0 -80
- package/src/components/table-generator/QasTableGenerator.stories.js +0 -116
- package/src/components/tabs-generator/QasTabsGenerator.stories.js +0 -145
- package/src/components/text-truncate/QasTextTruncate.stories.js +0 -55
- package/src/components/tip/QasTip.stories.js +0 -57
- package/src/components/tip/QasTip.vue +0 -68
- package/src/components/tooltip/QasTooltip.stories.js +0 -63
- package/src/components/tooltip/QasTooltip.vue +0 -81
- package/src/components/transfer/QasTransfer.stories.js +0 -118
- package/src/components/uploader/QasCustomUploader.vue +0 -121
- package/src/components/uploader/QasUploader.stories.js +0 -139
- package/src/directives/Test.js +0 -13
- package/src/helpers/historyHandler.js +0 -52
- package/src/helpers/label.js +0 -3
- package/src/index.js +0 -249
- package/src/mixins/map-markers.js +0 -26
- package/src/mixins/unsaved-changes.js +0 -24
- package/src/mixins/uploader.js +0 -30
- package/src/mocks/json/user.json +0 -27
- package/src/mocks/json/users-new.json +0 -23
- package/src/mocks/json/users.json +0 -97
- package/src/mocks/storeModule.js +0 -71
- package/src/pages/Forbidden.vue +0 -6
- package/src/pages/NotFound.vue +0 -6
|
@@ -1,168 +0,0 @@
|
|
|
1
|
-
import Vuex from 'vuex'
|
|
2
|
-
import VueRouter from 'vue-router'
|
|
3
|
-
|
|
4
|
-
import users from '../../mocks/storeModule'
|
|
5
|
-
|
|
6
|
-
import QasDebugger from '../debugger/QasDebugger'
|
|
7
|
-
import QasListView from './QasListView.vue'
|
|
8
|
-
|
|
9
|
-
const defaultFilterValues = JSON.stringify({
|
|
10
|
-
entity: 'string',
|
|
11
|
-
errors: 'object',
|
|
12
|
-
fields: 'object',
|
|
13
|
-
metadata: 'object'
|
|
14
|
-
})
|
|
15
|
-
|
|
16
|
-
const slotDefaults = {
|
|
17
|
-
defaultValue: {
|
|
18
|
-
detail: JSON.stringify({
|
|
19
|
-
errors: 'object',
|
|
20
|
-
fields: 'object',
|
|
21
|
-
metadata: 'object'
|
|
22
|
-
}),
|
|
23
|
-
|
|
24
|
-
summary: '{}'
|
|
25
|
-
},
|
|
26
|
-
|
|
27
|
-
type: { summary: null }
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
export default {
|
|
31
|
-
component: QasListView,
|
|
32
|
-
title: 'Components/ListView',
|
|
33
|
-
|
|
34
|
-
parameters: {
|
|
35
|
-
docs: {
|
|
36
|
-
description: {
|
|
37
|
-
component: 'List of entity rows.'
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
|
|
42
|
-
argTypes: {
|
|
43
|
-
// Props
|
|
44
|
-
dialog: {
|
|
45
|
-
description: 'Use when the component is inside a dialog.'
|
|
46
|
-
},
|
|
47
|
-
|
|
48
|
-
disableRefresh: {
|
|
49
|
-
description: 'Disables [QPullToRefresh](https://quasar.dev/vue-components/pull-to-refresh). Usually used in conjunction with sortable.'
|
|
50
|
-
},
|
|
51
|
-
|
|
52
|
-
entity: {
|
|
53
|
-
control: null,
|
|
54
|
-
description: '[VuexStoreModule](https://github.com/bildvitta/vuex-store-module) entity.'
|
|
55
|
-
},
|
|
56
|
-
|
|
57
|
-
filtersProps: {
|
|
58
|
-
description: 'Controls filters props from [QasFilters](https://asteroid.nave.dev/?path=/docs/components-filters--default)'
|
|
59
|
-
},
|
|
60
|
-
|
|
61
|
-
noFilter: {
|
|
62
|
-
description: 'Hide filters.'
|
|
63
|
-
},
|
|
64
|
-
|
|
65
|
-
url: {
|
|
66
|
-
control: null,
|
|
67
|
-
description: 'Ignore entity and specify another endpoint.'
|
|
68
|
-
},
|
|
69
|
-
|
|
70
|
-
// Events
|
|
71
|
-
'fetch-error': {
|
|
72
|
-
description: 'Fires when occur an error fetching value.',
|
|
73
|
-
table: {
|
|
74
|
-
defaultValue: {
|
|
75
|
-
detail: JSON.stringify({ error: 'object' }),
|
|
76
|
-
summary: '{}'
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
|
|
81
|
-
'fetch-success': {
|
|
82
|
-
description: 'Fires when successfully get the value.',
|
|
83
|
-
table: {
|
|
84
|
-
defaultValue: {
|
|
85
|
-
detail: JSON.stringify({ response: 'object' }),
|
|
86
|
-
summary: '{}'
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
},
|
|
90
|
-
|
|
91
|
-
// Slots
|
|
92
|
-
default: {
|
|
93
|
-
description: 'Main content.',
|
|
94
|
-
table: slotDefaults
|
|
95
|
-
},
|
|
96
|
-
|
|
97
|
-
filter: {
|
|
98
|
-
description: 'Replace `QasFilter` component.',
|
|
99
|
-
table: {
|
|
100
|
-
defaultValue: {
|
|
101
|
-
detail: defaultFilterValues,
|
|
102
|
-
summary: '{}'
|
|
103
|
-
},
|
|
104
|
-
|
|
105
|
-
type: { summary: null }
|
|
106
|
-
}
|
|
107
|
-
},
|
|
108
|
-
|
|
109
|
-
footer: {
|
|
110
|
-
description: 'Page\'s footer content.',
|
|
111
|
-
table: {
|
|
112
|
-
type: { summary: null }
|
|
113
|
-
}
|
|
114
|
-
},
|
|
115
|
-
|
|
116
|
-
header: {
|
|
117
|
-
description: 'Page\'s header content.',
|
|
118
|
-
table: slotDefaults
|
|
119
|
-
},
|
|
120
|
-
|
|
121
|
-
'empty-results': {
|
|
122
|
-
description: 'Main content when has no results.',
|
|
123
|
-
table: {
|
|
124
|
-
defaultValue: {
|
|
125
|
-
detail: JSON.stringify({
|
|
126
|
-
fields: 'object',
|
|
127
|
-
metadata: 'object'
|
|
128
|
-
}),
|
|
129
|
-
|
|
130
|
-
summary: '{}'
|
|
131
|
-
},
|
|
132
|
-
|
|
133
|
-
type: { summary: null }
|
|
134
|
-
},
|
|
135
|
-
|
|
136
|
-
type: { summary: null }
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
const Template = (args, { argTypes }) => ({
|
|
142
|
-
components: { QasDebugger, QasListView },
|
|
143
|
-
props: Object.keys(argTypes),
|
|
144
|
-
|
|
145
|
-
router: new VueRouter(),
|
|
146
|
-
|
|
147
|
-
store: new Vuex.Store({
|
|
148
|
-
modules: { users }
|
|
149
|
-
}),
|
|
150
|
-
|
|
151
|
-
template:
|
|
152
|
-
`<q-layout>
|
|
153
|
-
<q-page-container>
|
|
154
|
-
<qas-list-view v-bind="$props">
|
|
155
|
-
<template v-slot="{ results, fields }">
|
|
156
|
-
Results: <qas-debugger :inspect="[results]" />
|
|
157
|
-
Fields: <qas-debugger :inspect="[fields]" />
|
|
158
|
-
</template>
|
|
159
|
-
</qas-list-view>
|
|
160
|
-
</q-page-container>
|
|
161
|
-
</q-layout>`
|
|
162
|
-
})
|
|
163
|
-
|
|
164
|
-
export const Default = Template.bind({})
|
|
165
|
-
|
|
166
|
-
Default.args = {
|
|
167
|
-
entity: 'users'
|
|
168
|
-
}
|
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
import QasMap from './QasMap.vue'
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
component: QasMap,
|
|
5
|
-
title: 'Components/Map',
|
|
6
|
-
|
|
7
|
-
parameters: {
|
|
8
|
-
docs: {
|
|
9
|
-
description: {
|
|
10
|
-
component: `Map component. This component's library needs to be initialized at boot of your system like the example:
|
|
11
|
-
|
|
12
|
-
import * as VueGoogleMaps from 'gmap-vue'
|
|
13
|
-
export default function ({ Vue }) {
|
|
14
|
-
Vue.use(VueGoogleMaps, {
|
|
15
|
-
load: {
|
|
16
|
-
key: 'AIzaSyDl00zRKG51WWBIJa8yVXqX7jFD5xyqe24',
|
|
17
|
-
libraries: 'places'
|
|
18
|
-
}
|
|
19
|
-
})
|
|
20
|
-
}`
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
},
|
|
24
|
-
|
|
25
|
-
argTypes: {
|
|
26
|
-
// Props
|
|
27
|
-
centerPosition: {
|
|
28
|
-
description: 'Define the coordinate to centralize the position.'
|
|
29
|
-
},
|
|
30
|
-
|
|
31
|
-
hasSearch: {
|
|
32
|
-
description: 'Show the search input.'
|
|
33
|
-
},
|
|
34
|
-
|
|
35
|
-
markers: {
|
|
36
|
-
description: 'The list of objects that define and create the main markers in the map.'
|
|
37
|
-
},
|
|
38
|
-
|
|
39
|
-
showPopup: {
|
|
40
|
-
description: 'Shows the popup message on top of the marker.'
|
|
41
|
-
},
|
|
42
|
-
|
|
43
|
-
zoom: {
|
|
44
|
-
description: 'Define the initial zoom.'
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
const Template = (args, { argTypes }) => ({
|
|
50
|
-
components: { QasMap },
|
|
51
|
-
props: Object.keys(argTypes),
|
|
52
|
-
template:
|
|
53
|
-
'<qas-map :center-position="$_position()" has-search :markers="$_createMarkers(values)" show-popup />'
|
|
54
|
-
})
|
|
55
|
-
|
|
56
|
-
const marker = {
|
|
57
|
-
position: { lat: -21.17663, lng: -47.820839 },
|
|
58
|
-
title: 'Teste do componente QasMap',
|
|
59
|
-
description: 'Ribeirão Preto',
|
|
60
|
-
draggable: true
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
export const Default = Template.bind({})
|
|
64
|
-
Default.args = {
|
|
65
|
-
marker
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
Default.parameters = {
|
|
69
|
-
docs: {
|
|
70
|
-
source: {
|
|
71
|
-
code:
|
|
72
|
-
'<qas-map :center-position="{lat: -21.17663, lng: -47.820839 }" has-search :markers="$_createMarker(marker, true)" show-info-window />'
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
}
|
|
@@ -1,255 +0,0 @@
|
|
|
1
|
-
import QasNestedFields from './QasNestedFields.vue'
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
component: QasNestedFields,
|
|
5
|
-
title: 'Components/NestedFields',
|
|
6
|
-
|
|
7
|
-
parameters: {
|
|
8
|
-
docs: {
|
|
9
|
-
description: {
|
|
10
|
-
component: 'Component for nested fields.'
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
|
|
15
|
-
argTypes: {
|
|
16
|
-
// Props
|
|
17
|
-
addInputLabel: {
|
|
18
|
-
description: 'Label of add input.'
|
|
19
|
-
},
|
|
20
|
-
|
|
21
|
-
btnDestroyProps: {
|
|
22
|
-
description: 'Props of destroy btn (not from inline actions).'
|
|
23
|
-
},
|
|
24
|
-
|
|
25
|
-
btnDuplicateProps: {
|
|
26
|
-
description: 'Props of duplicate btn (not from inline actions).'
|
|
27
|
-
},
|
|
28
|
-
|
|
29
|
-
destroyKey: {
|
|
30
|
-
description: 'Key identifier to destroy the field.'
|
|
31
|
-
},
|
|
32
|
-
|
|
33
|
-
errors: {
|
|
34
|
-
description: 'Each field error.'
|
|
35
|
-
},
|
|
36
|
-
|
|
37
|
-
field: {
|
|
38
|
-
description: 'Nested fields'
|
|
39
|
-
},
|
|
40
|
-
|
|
41
|
-
fieldsEvents: {
|
|
42
|
-
description: 'Defines each field events.'
|
|
43
|
-
},
|
|
44
|
-
|
|
45
|
-
fieldsProps: {
|
|
46
|
-
description: 'Defines each field prop.'
|
|
47
|
-
},
|
|
48
|
-
|
|
49
|
-
formColumns: {
|
|
50
|
-
description: 'Grid col class of each field.'
|
|
51
|
-
},
|
|
52
|
-
|
|
53
|
-
formGutter: {
|
|
54
|
-
description: 'Gutter of form fields.'
|
|
55
|
-
},
|
|
56
|
-
|
|
57
|
-
rowLabel: {
|
|
58
|
-
description: 'Defines a text of row title.'
|
|
59
|
-
},
|
|
60
|
-
|
|
61
|
-
rowObject: {
|
|
62
|
-
description: 'Defines the default value to each field.'
|
|
63
|
-
},
|
|
64
|
-
|
|
65
|
-
useAnimation: {
|
|
66
|
-
description: 'Enable animation when add and destroy a field.'
|
|
67
|
-
},
|
|
68
|
-
|
|
69
|
-
useDestroyAlways: {
|
|
70
|
-
description: 'Enable always destroy btn.'
|
|
71
|
-
},
|
|
72
|
-
|
|
73
|
-
useDuplicate: {
|
|
74
|
-
description: 'Enable duplicate btn.'
|
|
75
|
-
},
|
|
76
|
-
|
|
77
|
-
useIndexLabel: {
|
|
78
|
-
description: 'Enable rows enumeration.'
|
|
79
|
-
},
|
|
80
|
-
|
|
81
|
-
useInlineActions: {
|
|
82
|
-
description: 'Enable inline actions.'
|
|
83
|
-
},
|
|
84
|
-
|
|
85
|
-
useSingleLabel: {
|
|
86
|
-
description: 'Enable only one label on component.'
|
|
87
|
-
},
|
|
88
|
-
|
|
89
|
-
value: {
|
|
90
|
-
description: 'Model value.',
|
|
91
|
-
control: { type: Array }
|
|
92
|
-
},
|
|
93
|
-
|
|
94
|
-
// events
|
|
95
|
-
input: {
|
|
96
|
-
description: 'Fires when model changes. Is also used by `v-model`.',
|
|
97
|
-
table: {
|
|
98
|
-
defaultValue: { summary: JSON.stringify({ value: 'array' }) }
|
|
99
|
-
}
|
|
100
|
-
},
|
|
101
|
-
|
|
102
|
-
// Slots
|
|
103
|
-
'add-input': {
|
|
104
|
-
description: 'slot for change add input',
|
|
105
|
-
table: {
|
|
106
|
-
category: 'slots',
|
|
107
|
-
defaultValue: {
|
|
108
|
-
summary: JSON.stringify({
|
|
109
|
-
add: 'function'
|
|
110
|
-
})
|
|
111
|
-
},
|
|
112
|
-
type: { summary: null }
|
|
113
|
-
}
|
|
114
|
-
},
|
|
115
|
-
|
|
116
|
-
'custom-fields': {
|
|
117
|
-
description: 'If need to use some custom component you can use this slot and update the model with updateValue function.',
|
|
118
|
-
table: {
|
|
119
|
-
category: 'slots',
|
|
120
|
-
defaultValue: {
|
|
121
|
-
summary: JSON.stringify({
|
|
122
|
-
index: 'number',
|
|
123
|
-
modelValue: 'object',
|
|
124
|
-
updateValue: 'function'
|
|
125
|
-
})
|
|
126
|
-
},
|
|
127
|
-
type: { summary: null }
|
|
128
|
-
}
|
|
129
|
-
},
|
|
130
|
-
|
|
131
|
-
'field-[field.name]': {
|
|
132
|
-
description: 'Each field inside `fields` is a slot.',
|
|
133
|
-
table: {
|
|
134
|
-
category: 'slots',
|
|
135
|
-
defaultValue: { summary: JSON.stringify({ field: 'object' }) },
|
|
136
|
-
type: { summary: null }
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
function templateGenerator (template) {
|
|
143
|
-
return (args, { argTypes }) => ({
|
|
144
|
-
components: { QasNestedFields },
|
|
145
|
-
props: Object.keys(argTypes),
|
|
146
|
-
|
|
147
|
-
data () {
|
|
148
|
-
return {
|
|
149
|
-
values: []
|
|
150
|
-
}
|
|
151
|
-
},
|
|
152
|
-
|
|
153
|
-
template
|
|
154
|
-
})
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
const Template = templateGenerator(
|
|
158
|
-
`<div>
|
|
159
|
-
<qas-nested-fields v-bind="$props" v-model="values" />
|
|
160
|
-
<pre>{{ values }}</pre>
|
|
161
|
-
</div>`
|
|
162
|
-
)
|
|
163
|
-
|
|
164
|
-
const defaults = {
|
|
165
|
-
field: {
|
|
166
|
-
name: 'nested',
|
|
167
|
-
type: 'nested',
|
|
168
|
-
label: 'Meu nested',
|
|
169
|
-
children: {
|
|
170
|
-
name: {
|
|
171
|
-
name: 'name',
|
|
172
|
-
type: 'text',
|
|
173
|
-
label: 'Nome'
|
|
174
|
-
},
|
|
175
|
-
email: {
|
|
176
|
-
name: 'email',
|
|
177
|
-
type: 'email',
|
|
178
|
-
label: 'E-mail'
|
|
179
|
-
},
|
|
180
|
-
cities: {
|
|
181
|
-
name: 'cities',
|
|
182
|
-
type: 'select',
|
|
183
|
-
label: 'cities',
|
|
184
|
-
multiple: true,
|
|
185
|
-
options: [
|
|
186
|
-
{ label: 'City 1', value: 1 },
|
|
187
|
-
{ label: 'City 2', value: 2 },
|
|
188
|
-
{ label: 'City 3', value: 3 }
|
|
189
|
-
]
|
|
190
|
-
}
|
|
191
|
-
}
|
|
192
|
-
},
|
|
193
|
-
|
|
194
|
-
btnDestroyProps: {
|
|
195
|
-
label: 'Remover',
|
|
196
|
-
icon: 'o_cancel',
|
|
197
|
-
flat: true,
|
|
198
|
-
hideMobileLabel: true,
|
|
199
|
-
dense: true
|
|
200
|
-
},
|
|
201
|
-
|
|
202
|
-
btnDuplicateProps: {
|
|
203
|
-
label: 'Duplicar',
|
|
204
|
-
icon: 'o_content_copy',
|
|
205
|
-
flat: true,
|
|
206
|
-
hideMobileLabel: true,
|
|
207
|
-
dense: true
|
|
208
|
-
}
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
export const Default = Template.bind({})
|
|
212
|
-
Default.args = {
|
|
213
|
-
...defaults
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
export const Error = Template.bind({})
|
|
217
|
-
Error.args = {
|
|
218
|
-
...defaults,
|
|
219
|
-
errors: [
|
|
220
|
-
{
|
|
221
|
-
name: 'name is required',
|
|
222
|
-
email: 'email is required',
|
|
223
|
-
cities: 'cities is required'
|
|
224
|
-
}
|
|
225
|
-
]
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
const customFieldsTemplate = (
|
|
229
|
-
`<div>
|
|
230
|
-
<qas-nested-fields v-bind="$props" v-model="values">
|
|
231
|
-
<template v-slot:custom-fields="{ updateValue, index, modelValue }">
|
|
232
|
-
<q-select v-model="modelValue.colors" :options="['blue', 'green', 'black', 'white']" @input="updateValue(modelValue, index)" />
|
|
233
|
-
</template>
|
|
234
|
-
</qas-nested-fields>
|
|
235
|
-
<pre>{{ values }}</pre>
|
|
236
|
-
</div>`
|
|
237
|
-
)
|
|
238
|
-
|
|
239
|
-
export const CustomFields = templateGenerator(customFieldsTemplate)
|
|
240
|
-
|
|
241
|
-
CustomFields.args = {
|
|
242
|
-
...defaults,
|
|
243
|
-
rowObject: {
|
|
244
|
-
name: '',
|
|
245
|
-
email: '',
|
|
246
|
-
cities: [],
|
|
247
|
-
colors: ''
|
|
248
|
-
}
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
CustomFields.parameters = {
|
|
252
|
-
docs: {
|
|
253
|
-
source: { code: customFieldsTemplate }
|
|
254
|
-
}
|
|
255
|
-
}
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
import QasNumericInput from './QasNumericInput.vue'
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
component: QasNumericInput,
|
|
5
|
-
title: 'Components/NumericInput',
|
|
6
|
-
|
|
7
|
-
parameters: {
|
|
8
|
-
docs: {
|
|
9
|
-
description: {
|
|
10
|
-
component: 'Extends [QInput](https://quasar.dev/vue-components/input) with [AutoNumeric](http://autonumeric.org/) plugin.'
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
|
|
15
|
-
argTypes: {
|
|
16
|
-
// Props
|
|
17
|
-
allowNegative: {
|
|
18
|
-
description: 'Allow negative values.'
|
|
19
|
-
},
|
|
20
|
-
|
|
21
|
-
allowPositive: {
|
|
22
|
-
description: 'Allow positive values.'
|
|
23
|
-
},
|
|
24
|
-
|
|
25
|
-
autonumericProps: {
|
|
26
|
-
description: '(Autonumeric)[http://autonumeric.org/guide] options.'
|
|
27
|
-
},
|
|
28
|
-
|
|
29
|
-
decimalPlaces: {
|
|
30
|
-
description: 'Decimal places.'
|
|
31
|
-
},
|
|
32
|
-
|
|
33
|
-
mode: {
|
|
34
|
-
description: 'Component mode like integer, decimal, percent, and money.'
|
|
35
|
-
},
|
|
36
|
-
|
|
37
|
-
preset: {
|
|
38
|
-
description: 'Property to configure default nationality of currency.'
|
|
39
|
-
},
|
|
40
|
-
|
|
41
|
-
value: {
|
|
42
|
-
description: 'Model value.'
|
|
43
|
-
},
|
|
44
|
-
|
|
45
|
-
// Events
|
|
46
|
-
input: {
|
|
47
|
-
description: 'Emitted when the component needs to change the model. Is also used by `v-model`.',
|
|
48
|
-
table: {
|
|
49
|
-
defaultValue: {
|
|
50
|
-
detail: JSON.stringify({ value: 'number' }),
|
|
51
|
-
summary: '{}'
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
const Template = (args, { argTypes }) => ({
|
|
59
|
-
components: { QasNumericInput },
|
|
60
|
-
props: Object.keys(argTypes),
|
|
61
|
-
|
|
62
|
-
data () {
|
|
63
|
-
return {
|
|
64
|
-
model: 0
|
|
65
|
-
}
|
|
66
|
-
},
|
|
67
|
-
|
|
68
|
-
template:
|
|
69
|
-
`<div>
|
|
70
|
-
<qas-numeric-input v-bind="$props" v-model="model" />
|
|
71
|
-
<pre>{{ model }}</pre>
|
|
72
|
-
</div>`
|
|
73
|
-
})
|
|
74
|
-
|
|
75
|
-
export const Default = Template.bind({})
|
|
76
|
-
|
|
77
|
-
Default.parameters = {
|
|
78
|
-
docs: {
|
|
79
|
-
source: { code: '<qas-numeric-input v-model="model" />' }
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
export const BrazilianReal = Template.bind({})
|
|
84
|
-
|
|
85
|
-
BrazilianReal.args = {
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
BrazilianReal.parameters = {
|
|
89
|
-
docs: {
|
|
90
|
-
source: { code: '<qas-numeric-input v-model="model" />' }
|
|
91
|
-
}
|
|
92
|
-
}
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
import QasPageHeader from './QasPageHeader.vue'
|
|
2
|
-
import QasBtn from '../btn/QasBtn.vue'
|
|
3
|
-
|
|
4
|
-
export default {
|
|
5
|
-
component: QasPageHeader,
|
|
6
|
-
title: 'Components/PageHeader',
|
|
7
|
-
|
|
8
|
-
parameters: {
|
|
9
|
-
docs: {
|
|
10
|
-
description: {
|
|
11
|
-
component: 'Page header structure with breadcrumbs, using [QToolbar](https://quasar.dev/vue-components/toolbar) and [QBreadcrumbs](https://quasar.dev/vue-components/breadcrumbs).'
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
},
|
|
15
|
-
|
|
16
|
-
argTypes: {
|
|
17
|
-
// Props
|
|
18
|
-
breadcrumbs: {
|
|
19
|
-
description: 'Breadcrumbs structure.'
|
|
20
|
-
},
|
|
21
|
-
|
|
22
|
-
noBreadcrumbs: {
|
|
23
|
-
description: 'Disable breadcrumbs.'
|
|
24
|
-
},
|
|
25
|
-
|
|
26
|
-
root: {
|
|
27
|
-
description: 'Breadcrumbs root route.'
|
|
28
|
-
},
|
|
29
|
-
|
|
30
|
-
title: {
|
|
31
|
-
description: 'Header title.'
|
|
32
|
-
},
|
|
33
|
-
|
|
34
|
-
// Slots
|
|
35
|
-
default: {
|
|
36
|
-
description: 'Main slot inside [QToolbar](https://quasar.dev/vue-components/toolbar).',
|
|
37
|
-
table: {
|
|
38
|
-
type: { summary: null }
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
const Template = (args, { argTypes }) => ({
|
|
45
|
-
components: { QasBtn, QasPageHeader },
|
|
46
|
-
props: Object.keys(argTypes),
|
|
47
|
-
|
|
48
|
-
template:
|
|
49
|
-
`<div>
|
|
50
|
-
<qas-page-header v-bind="$props">
|
|
51
|
-
<qas-btn label="This is my default template!" />
|
|
52
|
-
</qas-page-header>
|
|
53
|
-
</div>`
|
|
54
|
-
})
|
|
55
|
-
|
|
56
|
-
export const Default = Template.bind({})
|
|
57
|
-
|
|
58
|
-
Default.args = {
|
|
59
|
-
root: { label: 'Home', route: '/' },
|
|
60
|
-
title: 'Asteroid'
|
|
61
|
-
}
|