@bildvitta/quasar-ui-asteroid 3.17.0-beta.21 → 3.17.0-beta.22
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/package.json +1 -1
- package/src/asteroid.js +4 -4
- package/src/components/actions/QasActions.vue +81 -81
- package/src/components/actions/QasActions.yml +34 -34
- package/src/components/actions-menu/QasActionsMenu.vue +251 -251
- package/src/components/actions-menu/QasActionsMenu.yml +89 -89
- package/src/components/actions-menu/composables/use-delete.js +30 -30
- package/src/components/actions-menu/composables/use-double-split-actions.js +42 -42
- package/src/components/actions-menu/composables/use-options-actions.js +27 -27
- package/src/components/actions-menu/composables/use-single-action.js +17 -17
- package/src/components/actions-menu/composables/use-single-split-actions.js +35 -35
- package/src/components/actions-menu/composables/use-tooltips.js +43 -43
- package/src/components/actions-menu/utils/get-label.js +3 -3
- package/src/components/actions-menu/utils/set-click-handler.js +6 -6
- package/src/components/alert/QasAlert.test.js +43 -43
- package/src/components/alert/QasAlert.vue +110 -110
- package/src/components/alert/QasAlert.yml +39 -39
- package/src/components/app-bar/QasAppBar.vue +119 -119
- package/src/components/app-bar/QasAppBar.yml +44 -44
- package/src/components/app-menu/QasAppMenu.vue +392 -392
- package/src/components/app-menu/QasAppMenu.yml +73 -73
- package/src/components/app-menu/composables/use-app-menu-dropdown.js +71 -71
- package/src/components/app-menu/composables/use-app-user.js +49 -49
- package/src/components/app-menu/composables/use-development-badge.js +23 -23
- package/src/components/app-menu/private/PvAppMenuDropdown.vue +71 -71
- package/src/components/app-menu/private/PvAppMenuHelpChat.vue +222 -222
- package/src/components/app-user/QasAppUser.vue +281 -281
- package/src/components/app-user/QasAppUser.yml +56 -56
- package/src/components/avatar/QasAvatar.vue +95 -95
- package/src/components/avatar/QasAvatar.yml +38 -38
- package/src/components/avatar/enums/AvatarColors.js +10 -10
- package/src/components/badge/QasBadge.vue +87 -87
- package/src/components/badge/QasBadge.yml +55 -55
- package/src/components/board-generator/QasBoardGenerator.vue +712 -712
- package/src/components/board-generator/QasBoardGenerator.yml +167 -167
- package/src/components/box/QasBox.vue +51 -51
- package/src/components/box/QasBox.yml +29 -29
- package/src/components/breakline/QasBreakline.vue +38 -38
- package/src/components/breakline/QasBreakline.yml +25 -25
- package/src/components/btn/QasBtn.vue +148 -148
- package/src/components/btn/QasBtn.yml +48 -48
- package/src/components/btn-dropdown/QasBtnDropdown.vue +146 -146
- package/src/components/btn-dropdown/QasBtnDropdown.yml +59 -59
- package/src/components/card/QasCard.vue +132 -132
- package/src/components/card/QasCard.yml +44 -44
- package/src/components/card-image/QasCardImage.vue +95 -95
- package/src/components/card-image/QasCardImage.yml +48 -48
- package/src/components/chart-view/QasChartView.vue +441 -441
- package/src/components/chart-view/QasChartView.yml +109 -109
- package/src/components/chart-view/config/charts/bar.js +45 -45
- package/src/components/chart-view/config/charts/doughnut.js +43 -43
- package/src/components/chart-view/config/charts/index.js +9 -9
- package/src/components/chart-view/config/charts/line.js +57 -57
- package/src/components/chart-view/config/defaults/colors.js +19 -19
- package/src/components/chart-view/config/defaults/font.js +5 -5
- package/src/components/chart-view/config/defaults/index.js +2 -2
- package/src/components/chart-view/config/index.js +3 -3
- package/src/components/chart-view/config/plugins/index.js +3 -3
- package/src/components/chart-view/config/plugins/legend.js +9 -9
- package/src/components/chart-view/config/plugins/tooltip.js +15 -15
- package/src/components/chart-view/config/plugins/zoom.js +31 -31
- package/src/components/checkbox/QasCheckbox.vue +150 -150
- package/src/components/checkbox/QasCheckbox.yml +36 -36
- package/src/components/copy/QasCopy.vue +46 -46
- package/src/components/copy/QasCopy.yml +23 -23
- package/src/components/date/QasDate.vue +600 -600
- package/src/components/date/QasDate.yml +69 -69
- package/src/components/date/enums/DateMaskOptions.js +6 -6
- package/src/components/date-time-input/QasDateTimeInput.vue +269 -269
- package/src/components/date-time-input/QasDateTimeInput.yml +64 -64
- package/src/components/debugger/QasDebugger.vue +31 -31
- package/src/components/debugger/QasDebugger.yml +10 -10
- package/src/components/delete/QasDelete.vue +100 -100
- package/src/components/delete/QasDelete.yml +60 -60
- package/src/components/dialog/QasDialog.vue +217 -217
- package/src/components/dialog/QasDialog.yml +117 -117
- package/src/components/dialog/composables/use-cancel.js +40 -40
- package/src/components/dialog/composables/use-dynamic-components.js +86 -86
- package/src/components/dialog/composables/use-ok.js +45 -45
- package/src/components/dialog-router/QasDialogRouter.vue +86 -86
- package/src/components/dialog-router/QasDialogRouter.yml +23 -23
- package/src/components/drawer/QasDrawer.vue +118 -118
- package/src/components/drawer/QasDrawer.yml +58 -58
- package/src/components/empty-result-text/QasEmptyResultText.vue +18 -18
- package/src/components/empty-result-text/QasEmptyResultText.yml +14 -14
- package/src/components/expansion-item/QasExpansionItem.vue +291 -291
- package/src/components/expansion-item/QasExpansionItem.yml +76 -76
- package/src/components/field/QasField.vue +220 -220
- package/src/components/field/QasField.yml +36 -36
- package/src/components/filters/QasFilters.vue +472 -472
- package/src/components/filters/QasFilters.yml +171 -171
- package/src/components/filters/private/PvFiltersButton.vue +101 -101
- package/src/components/form-generator/QasFormGenerator.vue +274 -274
- package/src/components/form-generator/QasFormGenerator.yml +109 -109
- package/src/components/form-view/QasFormView.vue +484 -484
- package/src/components/form-view/QasFormView.yml +253 -253
- package/src/components/gallery/QasGallery.vue +243 -243
- package/src/components/gallery/QasGallery.yml +188 -188
- package/src/components/gallery/composables/use-delete.js +54 -54
- package/src/components/gallery/private/PvGalleryCarouselDialog.vue +92 -92
- package/src/components/gallery/private/PvGalleryDeleteDialog.vue +54 -54
- package/src/components/gallery-card/QasGalleryCard.vue +153 -153
- package/src/components/gallery-card/QasGalleryCard.yml +61 -61
- package/src/components/grabbable/QasGrabbable.vue +185 -185
- package/src/components/grabbable/QasGrabbable.yml +26 -26
- package/src/components/grid-generator/QasGridGenerator.vue +210 -210
- package/src/components/grid-generator/QasGridGenerator.yml +127 -127
- package/src/components/grid-item/QasGridItem.vue +89 -89
- package/src/components/grid-item/QasGridItem.yml +22 -22
- package/src/components/header/QasHeader.vue +152 -152
- package/src/components/header/QasHeader.yml +50 -50
- package/src/components/infinite-scroll/QasInfiniteScroll.vue +168 -168
- package/src/components/infinite-scroll/QasInfiniteScroll.yml +78 -78
- package/src/components/info/QasInfo.vue +155 -155
- package/src/components/info/QasInfo.yml +34 -34
- package/src/components/input/QasInput.vue +252 -252
- package/src/components/input/QasInput.yml +65 -65
- package/src/components/label/QasLabel.vue +61 -61
- package/src/components/label/QasLabel.yml +44 -44
- package/src/components/layout/QasLayout.vue +101 -101
- package/src/components/layout/QasLayout.yml +46 -46
- package/src/components/layout/private/PvLayoutNotificationCard.vue +86 -86
- package/src/components/layout/private/PvLayoutNotificationsDrawer.vue +140 -140
- package/src/components/list-items/QasListItems.vue +125 -125
- package/src/components/list-items/QasListItems.yml +71 -71
- package/src/components/list-view/QasListView.vue +302 -302
- package/src/components/list-view/QasListView.yml +169 -169
- package/src/components/map/QasMap.vue +75 -75
- package/src/components/map/QasMap.yml +33 -33
- package/src/components/nested-fields/QasNestedFields.vue +584 -584
- package/src/components/nested-fields/QasNestedFields.yml +296 -296
- package/src/components/numeric-input/QasNumericInput.vue +206 -206
- package/src/components/numeric-input/QasNumericInput.yml +85 -85
- package/src/components/option-group/QasOptionGroup.vue +54 -54
- package/src/components/option-group/QasOptionGroup.yml +30 -30
- package/src/components/page-header/QasPageHeader.vue +143 -143
- package/src/components/page-header/QasPageHeader.yml +42 -42
- package/src/components/pagination/QasPagination.vue +71 -71
- package/src/components/pagination/QasPagination.yml +4 -4
- package/src/components/password-input/QasPasswordInput.vue +110 -110
- package/src/components/password-input/QasPasswordInput.yml +111 -111
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.vue +71 -71
- package/src/components/password-strength-checker/QasPasswordStrengthChecker.yml +103 -103
- package/src/components/profile/QasProfile.vue +98 -98
- package/src/components/profile/QasProfile.yml +60 -60
- package/src/components/radio/QasRadio.vue +62 -62
- package/src/components/radio/QasRadio.yml +11 -11
- package/src/components/resizer/QasResizer.vue +90 -90
- package/src/components/resizer/QasResizer.yml +24 -24
- package/src/components/search-box/QasSearchBox.vue +294 -294
- package/src/components/search-box/QasSearchBox.yml +154 -154
- package/src/components/search-input/QasSearchInput.vue +106 -106
- package/src/components/search-input/QasSearchInput.yml +48 -48
- package/src/components/select/QasSelect.vue +514 -514
- package/src/components/select/QasSelect.yml +157 -157
- package/src/components/select-list/QasSelectList.vue +238 -238
- package/src/components/select-list/QasSelectList.yml +108 -108
- package/src/components/select-list/private/PvSelectListCheckbox.vue +31 -31
- package/src/components/select-list-dialog/QasSelectListDialog.vue +395 -395
- package/src/components/select-list-dialog/QasSelectListDialog.yml +108 -108
- package/src/components/signature-pad/QasSignaturePad.vue +122 -122
- package/src/components/signature-pad/QasSignaturePad.yml +53 -53
- package/src/components/signature-uploader/QasSignatureUploader.vue +164 -164
- package/src/components/signature-uploader/QasSignatureUploader.yml +37 -37
- package/src/components/single-view/QasSingleView.vue +175 -175
- package/src/components/single-view/QasSingleView.yml +131 -131
- package/src/components/sortable/QasSortable.vue +151 -151
- package/src/components/sortable/QasSortable.yml +65 -65
- package/src/components/status/QasStatus.test.js +11 -11
- package/src/components/status/QasStatus.vue +29 -29
- package/src/components/status/QasStatus.yml +10 -10
- package/src/components/stepper/QasStepper.vue +199 -152
- package/src/components/stepper/QasStepper.yml +35 -35
- package/src/components/stepper-form-view/QasStepperFormView.vue +86 -84
- package/src/components/stepper-form-view/QasStepperFormView.yml +58 -58
- package/src/components/table-generator/QasTableGenerator.vue +416 -416
- package/src/components/table-generator/QasTableGenerator.yml +94 -94
- package/src/components/tabs-generator/QasTabsGenerator.vue +196 -196
- package/src/components/tabs-generator/QasTabsGenerator.yml +53 -53
- package/src/components/text-truncate/QasTextTruncate.vue +274 -274
- package/src/components/text-truncate/QasTextTruncate.yml +60 -60
- package/src/components/timeline/QasTimeline.vue +140 -140
- package/src/components/timeline/QasTimeline.yml +36 -36
- package/src/components/toggle/QasToggle.vue +14 -14
- package/src/components/toggle/QasToggle.yml +5 -5
- package/src/components/toggle-visibility/QasToggleVisibility.vue +79 -79
- package/src/components/toggle-visibility/QasToggleVisibility.yml +30 -30
- package/src/components/transfer/QasTransfer.vue +239 -239
- package/src/components/transfer/QasTransfer.yml +60 -60
- package/src/components/tree-generator/QasTreeForm.vue +62 -62
- package/src/components/tree-generator/QasTreeGenerator.vue +488 -488
- package/src/components/tree-generator/QasTreeGenerator.yml +81 -81
- package/src/components/uploader/QasUploader.vue +691 -645
- package/src/components/uploader/QasUploader.yml +206 -192
- package/src/components/uploader/private/PvUploaderGalleryCard.vue +357 -357
- package/src/components/welcome/QasWelcome.vue +125 -125
- package/src/components/welcome/QasWelcome.yml +23 -23
- package/src/components/welcome/private/PvWelcomeShortcutCard.vue +58 -58
- package/src/components/whatsapp-link/QasWhatsappLink.vue +34 -34
- package/src/components/whatsapp-link/QasWhatsappLink.yml +18 -18
- package/src/composables/index.js +8 -8
- package/src/composables/private/index.js +3 -3
- package/src/composables/private/use-generator.js +174 -174
- package/src/composables/private/use-toggle-visibility.js +48 -48
- package/src/composables/private/use-view.js +186 -186
- package/src/composables/use-context.js +15 -15
- package/src/composables/use-form.js +32 -32
- package/src/composables/use-history.js +46 -46
- package/src/composables/use-notifications.js +128 -128
- package/src/composables/use-query-cache.js +60 -60
- package/src/composables/use-screen.js +42 -42
- package/src/css/base/font-face.scss +28 -28
- package/src/css/base/index.scss +1 -1
- package/src/css/components/base.scss +12 -12
- package/src/css/components/button.scss +116 -116
- package/src/css/components/checkbox.scss +14 -14
- package/src/css/components/editor.scss +7 -7
- package/src/css/components/field.scss +88 -88
- package/src/css/components/index.scss +10 -10
- package/src/css/components/item.scss +52 -52
- package/src/css/components/radio.scss +18 -18
- package/src/css/components/scrollbar.scss +20 -20
- package/src/css/components/tabs.scss +3 -3
- package/src/css/components/toggle.scss +13 -13
- package/src/css/mixins/index.scss +3 -3
- package/src/css/mixins/set-brand.scss +15 -15
- package/src/css/mixins/set-button.scss +26 -26
- package/src/css/mixins/set-typography.scss +8 -8
- package/src/css/plugins/index.scss +2 -2
- package/src/css/plugins/loading.scss +5 -5
- package/src/css/plugins/notify.scss +100 -100
- package/src/css/utils/background.scss +34 -34
- package/src/css/utils/border-radius.scss +29 -29
- package/src/css/utils/border.scss +42 -42
- package/src/css/utils/container.scss +36 -36
- package/src/css/utils/fonts.scss +5 -5
- package/src/css/utils/index.scss +10 -10
- package/src/css/utils/line-height.scss +19 -19
- package/src/css/utils/opacity.scss +5 -5
- package/src/css/utils/scroll.scss +21 -21
- package/src/css/utils/text.scss +15 -15
- package/src/css/utils/unset.scss +8 -8
- package/src/css/variables/button.scss +4 -4
- package/src/css/variables/index.scss +6 -6
- package/src/css/variables/scrollbar.scss +11 -11
- package/src/css/variables/separator.scss +2 -2
- package/src/css/variables/shadow.scss +3 -3
- package/src/css/variables/spacing.scss +98 -98
- package/src/css/variables/typography.scss +149 -149
- package/src/directives/Test.js +13 -13
- package/src/enums/Align.js +7 -7
- package/src/enums/Spacing.js +98 -98
- package/src/enums/Status.js +33 -33
- package/src/helpers/add-counter-suffix.js +3 -3
- package/src/helpers/base-64-to-blob.js +21 -21
- package/src/helpers/camelize-fields-name.js +15 -15
- package/src/helpers/construct-object.js +29 -29
- package/src/helpers/copy-to-clipboard.js +15 -15
- package/src/helpers/destroy-nested-children-by-key.js +33 -33
- package/src/helpers/download-file.js +21 -21
- package/src/helpers/filter-list-by-handle.js +31 -31
- package/src/helpers/filter-object-to-array.js +29 -29
- package/src/helpers/filter-object.js +34 -34
- package/src/helpers/filters.js +163 -163
- package/src/helpers/find-children-by-key.js +14 -14
- package/src/helpers/get-greatest-common-divisor.js +16 -16
- package/src/helpers/get-normalized-options.js +20 -20
- package/src/helpers/get-placeholder.js +19 -19
- package/src/helpers/get-required-label.js +3 -3
- package/src/helpers/get-slot-children-text.js +15 -15
- package/src/helpers/handle-process.js +13 -13
- package/src/helpers/images.js +28 -28
- package/src/helpers/index.js +25 -25
- package/src/helpers/is-empty.js +3 -3
- package/src/helpers/is-local-development.js +3 -3
- package/src/helpers/private/gutter-validator.js +15 -15
- package/src/helpers/private/has-parent-by-class-name.js +15 -15
- package/src/helpers/promise-handler.js +40 -40
- package/src/helpers/rules.js +7 -7
- package/src/helpers/set-scroll-on-grab.js +128 -128
- package/src/index.cjs.js +1 -1
- package/src/index.esm.js +4 -4
- package/src/index.scss +38 -38
- package/src/index.umd.js +2 -2
- package/src/mixins/context.js +8 -8
- package/src/mixins/delete.js +48 -48
- package/src/mixins/dialog-router.js +17 -17
- package/src/mixins/form.js +11 -11
- package/src/mixins/generator.js +94 -94
- package/src/mixins/index.js +17 -17
- package/src/mixins/password.js +86 -86
- package/src/mixins/search-filter.js +354 -354
- package/src/mixins/view.js +156 -156
- package/src/pages/ErrorComponent.vue +74 -74
- package/src/pages/Forbidden.vue +29 -29
- package/src/pages/NotFound.vue +29 -29
- package/src/pages/ServerError.vue +29 -29
- package/src/pages/Unauthorized.vue +29 -29
- package/src/plugins/delete/Delete.js +107 -107
- package/src/plugins/delete/Delete.yml +75 -75
- package/src/plugins/dialog/Dialog.js +14 -14
- package/src/plugins/dialog/Dialog.yml +10 -10
- package/src/plugins/index.js +13 -13
- package/src/plugins/notify-error/NotifyError.js +13 -13
- package/src/plugins/notify-error/NotifyError.yml +11 -11
- package/src/plugins/notify-success/NotifySuccess.js +13 -13
- package/src/plugins/notify-success/NotifySuccess.yml +11 -11
- package/src/plugins/screen/Screen.js +35 -35
- package/src/plugins/screen/Screen.yml +16 -16
- package/src/shared/date-config.js +26 -26
- package/src/shared/fuse-config.js +4 -4
- package/src/shared/notify-config.js +7 -7
- package/src/vue-plugin/third-party-component-handler.js +29 -29
- package/src/vue-plugin.js +282 -282
|
@@ -1,164 +1,164 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div>
|
|
3
|
-
<qas-uploader ref="uploader" v-model="model" :add-button-fn="openDialog" :use-resize="false" v-bind="defaultUploaderProps" />
|
|
4
|
-
|
|
5
|
-
<qas-dialog v-model="isOpenedDialog" v-bind="defaultDialogProps">
|
|
6
|
-
<template #header>
|
|
7
|
-
<div class="text-bold text-center">Insira sua assinatura digital no campo abaixo</div>
|
|
8
|
-
</template>
|
|
9
|
-
|
|
10
|
-
<template #description>
|
|
11
|
-
<div :style="signaturePadWidth">
|
|
12
|
-
<qas-signature-pad ref="signaturePadModal" v-model:empty="isEmpty" :height="signaturePadHeight" />
|
|
13
|
-
</div>
|
|
14
|
-
</template>
|
|
15
|
-
</qas-dialog>
|
|
16
|
-
</div>
|
|
17
|
-
</template>
|
|
18
|
-
|
|
19
|
-
<script>
|
|
20
|
-
import QasDialog from '../dialog/QasDialog.vue'
|
|
21
|
-
import QasUploader from '../uploader/QasUploader.vue'
|
|
22
|
-
import QasSignaturePad from '../signature-pad/QasSignaturePad.vue'
|
|
23
|
-
import { base64ToBlob } from '../../helpers'
|
|
24
|
-
import { NotifyError } from '../../plugins'
|
|
25
|
-
|
|
26
|
-
export default {
|
|
27
|
-
name: 'QasSignatureUploader',
|
|
28
|
-
|
|
29
|
-
components: {
|
|
30
|
-
QasDialog,
|
|
31
|
-
QasUploader,
|
|
32
|
-
QasSignaturePad
|
|
33
|
-
},
|
|
34
|
-
|
|
35
|
-
inheritAttrs: false,
|
|
36
|
-
|
|
37
|
-
props: {
|
|
38
|
-
dialogProps: {
|
|
39
|
-
type: Object,
|
|
40
|
-
default: () => ({})
|
|
41
|
-
},
|
|
42
|
-
|
|
43
|
-
modelValue: {
|
|
44
|
-
default: '',
|
|
45
|
-
type: String
|
|
46
|
-
},
|
|
47
|
-
|
|
48
|
-
signatureLabel: {
|
|
49
|
-
default: 'Assinatura',
|
|
50
|
-
type: String
|
|
51
|
-
},
|
|
52
|
-
|
|
53
|
-
type: {
|
|
54
|
-
default: 'image/png',
|
|
55
|
-
type: String
|
|
56
|
-
},
|
|
57
|
-
|
|
58
|
-
uploaderProps: {
|
|
59
|
-
type: Object,
|
|
60
|
-
default: () => ({})
|
|
61
|
-
}
|
|
62
|
-
},
|
|
63
|
-
|
|
64
|
-
emits: ['update:modelValue'],
|
|
65
|
-
|
|
66
|
-
data () {
|
|
67
|
-
return {
|
|
68
|
-
base64: '',
|
|
69
|
-
isEmpty: true,
|
|
70
|
-
isOpenedDialog: false
|
|
71
|
-
}
|
|
72
|
-
},
|
|
73
|
-
|
|
74
|
-
computed: {
|
|
75
|
-
defaultUploaderProps () {
|
|
76
|
-
return {
|
|
77
|
-
addButtonLabel: 'Adicionar assinatura',
|
|
78
|
-
...this.uploaderProps
|
|
79
|
-
}
|
|
80
|
-
},
|
|
81
|
-
|
|
82
|
-
defaultDialogProps () {
|
|
83
|
-
return {
|
|
84
|
-
maxWidth: '620px',
|
|
85
|
-
...this.dialogProps,
|
|
86
|
-
ok: {
|
|
87
|
-
label: 'Salvar',
|
|
88
|
-
onClick: () => this.getSignatureData()
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
|
|
93
|
-
model: {
|
|
94
|
-
get () {
|
|
95
|
-
return this.modelValue
|
|
96
|
-
},
|
|
97
|
-
|
|
98
|
-
set (value) {
|
|
99
|
-
this.$emit('update:modelValue', value)
|
|
100
|
-
}
|
|
101
|
-
},
|
|
102
|
-
|
|
103
|
-
signaturePadHeight () {
|
|
104
|
-
const sizes = {
|
|
105
|
-
[this.$qas.screen.isSmall]: '250',
|
|
106
|
-
[this.$qas.screen.isMedium]: '400',
|
|
107
|
-
[this.$qas.screen.isLarge]: '250'
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
return sizes.true
|
|
111
|
-
},
|
|
112
|
-
|
|
113
|
-
signaturePadWidth () {
|
|
114
|
-
const sizes = {
|
|
115
|
-
[this.$qas.screen.isSmall]: { width: '100%' },
|
|
116
|
-
[this.$qas.screen.isMedium]: { width: '570px' },
|
|
117
|
-
[this.$qas.screen.isLarge]: { width: '350px' }
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
return sizes.true
|
|
121
|
-
},
|
|
122
|
-
|
|
123
|
-
uploaderScope () {
|
|
124
|
-
return this.$refs?.uploader?.uploader
|
|
125
|
-
}
|
|
126
|
-
},
|
|
127
|
-
|
|
128
|
-
methods: {
|
|
129
|
-
NotifyError,
|
|
130
|
-
|
|
131
|
-
closeSignature () {
|
|
132
|
-
this.isOpenedDialog = false
|
|
133
|
-
},
|
|
134
|
-
|
|
135
|
-
openDialog () {
|
|
136
|
-
if (this.readonly) return
|
|
137
|
-
|
|
138
|
-
this.isOpenedDialog = true
|
|
139
|
-
},
|
|
140
|
-
|
|
141
|
-
getSignatureData () {
|
|
142
|
-
this.uploaderScope.removeUploadedFiles()
|
|
143
|
-
|
|
144
|
-
this.base64 = this.$refs.signaturePadModal.getSignatureData()
|
|
145
|
-
|
|
146
|
-
this.upload(this.uploaderScope)
|
|
147
|
-
this.closeSignature()
|
|
148
|
-
},
|
|
149
|
-
|
|
150
|
-
upload () {
|
|
151
|
-
try {
|
|
152
|
-
const fileName = this.signatureLabel.split(' ').join('-')
|
|
153
|
-
const extension = this.type.split('/').pop() || 'png'
|
|
154
|
-
const blob = base64ToBlob(this.base64)
|
|
155
|
-
const file = new File([blob], `${fileName}.${extension}`, { type: this.type })
|
|
156
|
-
|
|
157
|
-
this.uploaderScope.addFiles([file])
|
|
158
|
-
} catch {
|
|
159
|
-
NotifyError('Falha ao carregar assinatura.')
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
}
|
|
164
|
-
</script>
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<qas-uploader ref="uploader" v-model="model" :add-button-fn="openDialog" :use-resize="false" v-bind="defaultUploaderProps" />
|
|
4
|
+
|
|
5
|
+
<qas-dialog v-model="isOpenedDialog" v-bind="defaultDialogProps">
|
|
6
|
+
<template #header>
|
|
7
|
+
<div class="text-bold text-center">Insira sua assinatura digital no campo abaixo</div>
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<template #description>
|
|
11
|
+
<div :style="signaturePadWidth">
|
|
12
|
+
<qas-signature-pad ref="signaturePadModal" v-model:empty="isEmpty" :height="signaturePadHeight" />
|
|
13
|
+
</div>
|
|
14
|
+
</template>
|
|
15
|
+
</qas-dialog>
|
|
16
|
+
</div>
|
|
17
|
+
</template>
|
|
18
|
+
|
|
19
|
+
<script>
|
|
20
|
+
import QasDialog from '../dialog/QasDialog.vue'
|
|
21
|
+
import QasUploader from '../uploader/QasUploader.vue'
|
|
22
|
+
import QasSignaturePad from '../signature-pad/QasSignaturePad.vue'
|
|
23
|
+
import { base64ToBlob } from '../../helpers'
|
|
24
|
+
import { NotifyError } from '../../plugins'
|
|
25
|
+
|
|
26
|
+
export default {
|
|
27
|
+
name: 'QasSignatureUploader',
|
|
28
|
+
|
|
29
|
+
components: {
|
|
30
|
+
QasDialog,
|
|
31
|
+
QasUploader,
|
|
32
|
+
QasSignaturePad
|
|
33
|
+
},
|
|
34
|
+
|
|
35
|
+
inheritAttrs: false,
|
|
36
|
+
|
|
37
|
+
props: {
|
|
38
|
+
dialogProps: {
|
|
39
|
+
type: Object,
|
|
40
|
+
default: () => ({})
|
|
41
|
+
},
|
|
42
|
+
|
|
43
|
+
modelValue: {
|
|
44
|
+
default: '',
|
|
45
|
+
type: String
|
|
46
|
+
},
|
|
47
|
+
|
|
48
|
+
signatureLabel: {
|
|
49
|
+
default: 'Assinatura',
|
|
50
|
+
type: String
|
|
51
|
+
},
|
|
52
|
+
|
|
53
|
+
type: {
|
|
54
|
+
default: 'image/png',
|
|
55
|
+
type: String
|
|
56
|
+
},
|
|
57
|
+
|
|
58
|
+
uploaderProps: {
|
|
59
|
+
type: Object,
|
|
60
|
+
default: () => ({})
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
|
|
64
|
+
emits: ['update:modelValue'],
|
|
65
|
+
|
|
66
|
+
data () {
|
|
67
|
+
return {
|
|
68
|
+
base64: '',
|
|
69
|
+
isEmpty: true,
|
|
70
|
+
isOpenedDialog: false
|
|
71
|
+
}
|
|
72
|
+
},
|
|
73
|
+
|
|
74
|
+
computed: {
|
|
75
|
+
defaultUploaderProps () {
|
|
76
|
+
return {
|
|
77
|
+
addButtonLabel: 'Adicionar assinatura',
|
|
78
|
+
...this.uploaderProps
|
|
79
|
+
}
|
|
80
|
+
},
|
|
81
|
+
|
|
82
|
+
defaultDialogProps () {
|
|
83
|
+
return {
|
|
84
|
+
maxWidth: '620px',
|
|
85
|
+
...this.dialogProps,
|
|
86
|
+
ok: {
|
|
87
|
+
label: 'Salvar',
|
|
88
|
+
onClick: () => this.getSignatureData()
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
|
|
93
|
+
model: {
|
|
94
|
+
get () {
|
|
95
|
+
return this.modelValue
|
|
96
|
+
},
|
|
97
|
+
|
|
98
|
+
set (value) {
|
|
99
|
+
this.$emit('update:modelValue', value)
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
|
|
103
|
+
signaturePadHeight () {
|
|
104
|
+
const sizes = {
|
|
105
|
+
[this.$qas.screen.isSmall]: '250',
|
|
106
|
+
[this.$qas.screen.isMedium]: '400',
|
|
107
|
+
[this.$qas.screen.isLarge]: '250'
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
return sizes.true
|
|
111
|
+
},
|
|
112
|
+
|
|
113
|
+
signaturePadWidth () {
|
|
114
|
+
const sizes = {
|
|
115
|
+
[this.$qas.screen.isSmall]: { width: '100%' },
|
|
116
|
+
[this.$qas.screen.isMedium]: { width: '570px' },
|
|
117
|
+
[this.$qas.screen.isLarge]: { width: '350px' }
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
return sizes.true
|
|
121
|
+
},
|
|
122
|
+
|
|
123
|
+
uploaderScope () {
|
|
124
|
+
return this.$refs?.uploader?.uploader
|
|
125
|
+
}
|
|
126
|
+
},
|
|
127
|
+
|
|
128
|
+
methods: {
|
|
129
|
+
NotifyError,
|
|
130
|
+
|
|
131
|
+
closeSignature () {
|
|
132
|
+
this.isOpenedDialog = false
|
|
133
|
+
},
|
|
134
|
+
|
|
135
|
+
openDialog () {
|
|
136
|
+
if (this.readonly) return
|
|
137
|
+
|
|
138
|
+
this.isOpenedDialog = true
|
|
139
|
+
},
|
|
140
|
+
|
|
141
|
+
getSignatureData () {
|
|
142
|
+
this.uploaderScope.removeUploadedFiles()
|
|
143
|
+
|
|
144
|
+
this.base64 = this.$refs.signaturePadModal.getSignatureData()
|
|
145
|
+
|
|
146
|
+
this.upload(this.uploaderScope)
|
|
147
|
+
this.closeSignature()
|
|
148
|
+
},
|
|
149
|
+
|
|
150
|
+
upload () {
|
|
151
|
+
try {
|
|
152
|
+
const fileName = this.signatureLabel.split(' ').join('-')
|
|
153
|
+
const extension = this.type.split('/').pop() || 'png'
|
|
154
|
+
const blob = base64ToBlob(this.base64)
|
|
155
|
+
const file = new File([blob], `${fileName}.${extension}`, { type: this.type })
|
|
156
|
+
|
|
157
|
+
this.uploaderScope.addFiles([file])
|
|
158
|
+
} catch {
|
|
159
|
+
NotifyError('Falha ao carregar assinatura.')
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
</script>
|
|
@@ -1,37 +1,37 @@
|
|
|
1
|
-
type: component
|
|
2
|
-
|
|
3
|
-
meta:
|
|
4
|
-
desc: Componente que implementa o "QasUploader" e "QasSignaturePad" para fazer upload de assinatura.
|
|
5
|
-
|
|
6
|
-
props:
|
|
7
|
-
dialog-props:
|
|
8
|
-
desc: Repassa propriedades para o "QasDialog".
|
|
9
|
-
type: Object
|
|
10
|
-
default: { maxWidth: '620px' }
|
|
11
|
-
|
|
12
|
-
model-value:
|
|
13
|
-
desc: Model do componente, retorna url da imagem upada, usando para v-model.
|
|
14
|
-
type: String
|
|
15
|
-
|
|
16
|
-
signature-label:
|
|
17
|
-
desc: Rótulo do componente de assinatura.
|
|
18
|
-
default: {}
|
|
19
|
-
type: Object
|
|
20
|
-
|
|
21
|
-
type:
|
|
22
|
-
desc: Tipo da imagem gerada.
|
|
23
|
-
default: image/png
|
|
24
|
-
type: String
|
|
25
|
-
|
|
26
|
-
uploader-props:
|
|
27
|
-
desc: Propriedades repassadas para o QasUploader.
|
|
28
|
-
default: {}
|
|
29
|
-
type: Object
|
|
30
|
-
|
|
31
|
-
events:
|
|
32
|
-
'@update:model-value -> function(value)':
|
|
33
|
-
desc: Dispara toda vez que o acontece um novo upload, usado para v-model.
|
|
34
|
-
params:
|
|
35
|
-
value:
|
|
36
|
-
desc: Novo valor do model.
|
|
37
|
-
type: String
|
|
1
|
+
type: component
|
|
2
|
+
|
|
3
|
+
meta:
|
|
4
|
+
desc: Componente que implementa o "QasUploader" e "QasSignaturePad" para fazer upload de assinatura.
|
|
5
|
+
|
|
6
|
+
props:
|
|
7
|
+
dialog-props:
|
|
8
|
+
desc: Repassa propriedades para o "QasDialog".
|
|
9
|
+
type: Object
|
|
10
|
+
default: { maxWidth: '620px' }
|
|
11
|
+
|
|
12
|
+
model-value:
|
|
13
|
+
desc: Model do componente, retorna url da imagem upada, usando para v-model.
|
|
14
|
+
type: String
|
|
15
|
+
|
|
16
|
+
signature-label:
|
|
17
|
+
desc: Rótulo do componente de assinatura.
|
|
18
|
+
default: {}
|
|
19
|
+
type: Object
|
|
20
|
+
|
|
21
|
+
type:
|
|
22
|
+
desc: Tipo da imagem gerada.
|
|
23
|
+
default: image/png
|
|
24
|
+
type: String
|
|
25
|
+
|
|
26
|
+
uploader-props:
|
|
27
|
+
desc: Propriedades repassadas para o QasUploader.
|
|
28
|
+
default: {}
|
|
29
|
+
type: Object
|
|
30
|
+
|
|
31
|
+
events:
|
|
32
|
+
'@update:model-value -> function(value)':
|
|
33
|
+
desc: Dispara toda vez que o acontece um novo upload, usado para v-model.
|
|
34
|
+
params:
|
|
35
|
+
value:
|
|
36
|
+
desc: Novo valor do model.
|
|
37
|
+
type: String
|