@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.
Files changed (314) hide show
  1. package/package.json +1 -1
  2. package/src/asteroid.js +4 -4
  3. package/src/components/actions/QasActions.vue +81 -81
  4. package/src/components/actions/QasActions.yml +34 -34
  5. package/src/components/actions-menu/QasActionsMenu.vue +251 -251
  6. package/src/components/actions-menu/QasActionsMenu.yml +89 -89
  7. package/src/components/actions-menu/composables/use-delete.js +30 -30
  8. package/src/components/actions-menu/composables/use-double-split-actions.js +42 -42
  9. package/src/components/actions-menu/composables/use-options-actions.js +27 -27
  10. package/src/components/actions-menu/composables/use-single-action.js +17 -17
  11. package/src/components/actions-menu/composables/use-single-split-actions.js +35 -35
  12. package/src/components/actions-menu/composables/use-tooltips.js +43 -43
  13. package/src/components/actions-menu/utils/get-label.js +3 -3
  14. package/src/components/actions-menu/utils/set-click-handler.js +6 -6
  15. package/src/components/alert/QasAlert.test.js +43 -43
  16. package/src/components/alert/QasAlert.vue +110 -110
  17. package/src/components/alert/QasAlert.yml +39 -39
  18. package/src/components/app-bar/QasAppBar.vue +119 -119
  19. package/src/components/app-bar/QasAppBar.yml +44 -44
  20. package/src/components/app-menu/QasAppMenu.vue +392 -392
  21. package/src/components/app-menu/QasAppMenu.yml +73 -73
  22. package/src/components/app-menu/composables/use-app-menu-dropdown.js +71 -71
  23. package/src/components/app-menu/composables/use-app-user.js +49 -49
  24. package/src/components/app-menu/composables/use-development-badge.js +23 -23
  25. package/src/components/app-menu/private/PvAppMenuDropdown.vue +71 -71
  26. package/src/components/app-menu/private/PvAppMenuHelpChat.vue +222 -222
  27. package/src/components/app-user/QasAppUser.vue +281 -281
  28. package/src/components/app-user/QasAppUser.yml +56 -56
  29. package/src/components/avatar/QasAvatar.vue +95 -95
  30. package/src/components/avatar/QasAvatar.yml +38 -38
  31. package/src/components/avatar/enums/AvatarColors.js +10 -10
  32. package/src/components/badge/QasBadge.vue +87 -87
  33. package/src/components/badge/QasBadge.yml +55 -55
  34. package/src/components/board-generator/QasBoardGenerator.vue +712 -712
  35. package/src/components/board-generator/QasBoardGenerator.yml +167 -167
  36. package/src/components/box/QasBox.vue +51 -51
  37. package/src/components/box/QasBox.yml +29 -29
  38. package/src/components/breakline/QasBreakline.vue +38 -38
  39. package/src/components/breakline/QasBreakline.yml +25 -25
  40. package/src/components/btn/QasBtn.vue +148 -148
  41. package/src/components/btn/QasBtn.yml +48 -48
  42. package/src/components/btn-dropdown/QasBtnDropdown.vue +146 -146
  43. package/src/components/btn-dropdown/QasBtnDropdown.yml +59 -59
  44. package/src/components/card/QasCard.vue +132 -132
  45. package/src/components/card/QasCard.yml +44 -44
  46. package/src/components/card-image/QasCardImage.vue +95 -95
  47. package/src/components/card-image/QasCardImage.yml +48 -48
  48. package/src/components/chart-view/QasChartView.vue +441 -441
  49. package/src/components/chart-view/QasChartView.yml +109 -109
  50. package/src/components/chart-view/config/charts/bar.js +45 -45
  51. package/src/components/chart-view/config/charts/doughnut.js +43 -43
  52. package/src/components/chart-view/config/charts/index.js +9 -9
  53. package/src/components/chart-view/config/charts/line.js +57 -57
  54. package/src/components/chart-view/config/defaults/colors.js +19 -19
  55. package/src/components/chart-view/config/defaults/font.js +5 -5
  56. package/src/components/chart-view/config/defaults/index.js +2 -2
  57. package/src/components/chart-view/config/index.js +3 -3
  58. package/src/components/chart-view/config/plugins/index.js +3 -3
  59. package/src/components/chart-view/config/plugins/legend.js +9 -9
  60. package/src/components/chart-view/config/plugins/tooltip.js +15 -15
  61. package/src/components/chart-view/config/plugins/zoom.js +31 -31
  62. package/src/components/checkbox/QasCheckbox.vue +150 -150
  63. package/src/components/checkbox/QasCheckbox.yml +36 -36
  64. package/src/components/copy/QasCopy.vue +46 -46
  65. package/src/components/copy/QasCopy.yml +23 -23
  66. package/src/components/date/QasDate.vue +600 -600
  67. package/src/components/date/QasDate.yml +69 -69
  68. package/src/components/date/enums/DateMaskOptions.js +6 -6
  69. package/src/components/date-time-input/QasDateTimeInput.vue +269 -269
  70. package/src/components/date-time-input/QasDateTimeInput.yml +64 -64
  71. package/src/components/debugger/QasDebugger.vue +31 -31
  72. package/src/components/debugger/QasDebugger.yml +10 -10
  73. package/src/components/delete/QasDelete.vue +100 -100
  74. package/src/components/delete/QasDelete.yml +60 -60
  75. package/src/components/dialog/QasDialog.vue +217 -217
  76. package/src/components/dialog/QasDialog.yml +117 -117
  77. package/src/components/dialog/composables/use-cancel.js +40 -40
  78. package/src/components/dialog/composables/use-dynamic-components.js +86 -86
  79. package/src/components/dialog/composables/use-ok.js +45 -45
  80. package/src/components/dialog-router/QasDialogRouter.vue +86 -86
  81. package/src/components/dialog-router/QasDialogRouter.yml +23 -23
  82. package/src/components/drawer/QasDrawer.vue +118 -118
  83. package/src/components/drawer/QasDrawer.yml +58 -58
  84. package/src/components/empty-result-text/QasEmptyResultText.vue +18 -18
  85. package/src/components/empty-result-text/QasEmptyResultText.yml +14 -14
  86. package/src/components/expansion-item/QasExpansionItem.vue +291 -291
  87. package/src/components/expansion-item/QasExpansionItem.yml +76 -76
  88. package/src/components/field/QasField.vue +220 -220
  89. package/src/components/field/QasField.yml +36 -36
  90. package/src/components/filters/QasFilters.vue +472 -472
  91. package/src/components/filters/QasFilters.yml +171 -171
  92. package/src/components/filters/private/PvFiltersButton.vue +101 -101
  93. package/src/components/form-generator/QasFormGenerator.vue +274 -274
  94. package/src/components/form-generator/QasFormGenerator.yml +109 -109
  95. package/src/components/form-view/QasFormView.vue +484 -484
  96. package/src/components/form-view/QasFormView.yml +253 -253
  97. package/src/components/gallery/QasGallery.vue +243 -243
  98. package/src/components/gallery/QasGallery.yml +188 -188
  99. package/src/components/gallery/composables/use-delete.js +54 -54
  100. package/src/components/gallery/private/PvGalleryCarouselDialog.vue +92 -92
  101. package/src/components/gallery/private/PvGalleryDeleteDialog.vue +54 -54
  102. package/src/components/gallery-card/QasGalleryCard.vue +153 -153
  103. package/src/components/gallery-card/QasGalleryCard.yml +61 -61
  104. package/src/components/grabbable/QasGrabbable.vue +185 -185
  105. package/src/components/grabbable/QasGrabbable.yml +26 -26
  106. package/src/components/grid-generator/QasGridGenerator.vue +210 -210
  107. package/src/components/grid-generator/QasGridGenerator.yml +127 -127
  108. package/src/components/grid-item/QasGridItem.vue +89 -89
  109. package/src/components/grid-item/QasGridItem.yml +22 -22
  110. package/src/components/header/QasHeader.vue +152 -152
  111. package/src/components/header/QasHeader.yml +50 -50
  112. package/src/components/infinite-scroll/QasInfiniteScroll.vue +168 -168
  113. package/src/components/infinite-scroll/QasInfiniteScroll.yml +78 -78
  114. package/src/components/info/QasInfo.vue +155 -155
  115. package/src/components/info/QasInfo.yml +34 -34
  116. package/src/components/input/QasInput.vue +252 -252
  117. package/src/components/input/QasInput.yml +65 -65
  118. package/src/components/label/QasLabel.vue +61 -61
  119. package/src/components/label/QasLabel.yml +44 -44
  120. package/src/components/layout/QasLayout.vue +101 -101
  121. package/src/components/layout/QasLayout.yml +46 -46
  122. package/src/components/layout/private/PvLayoutNotificationCard.vue +86 -86
  123. package/src/components/layout/private/PvLayoutNotificationsDrawer.vue +140 -140
  124. package/src/components/list-items/QasListItems.vue +125 -125
  125. package/src/components/list-items/QasListItems.yml +71 -71
  126. package/src/components/list-view/QasListView.vue +302 -302
  127. package/src/components/list-view/QasListView.yml +169 -169
  128. package/src/components/map/QasMap.vue +75 -75
  129. package/src/components/map/QasMap.yml +33 -33
  130. package/src/components/nested-fields/QasNestedFields.vue +584 -584
  131. package/src/components/nested-fields/QasNestedFields.yml +296 -296
  132. package/src/components/numeric-input/QasNumericInput.vue +206 -206
  133. package/src/components/numeric-input/QasNumericInput.yml +85 -85
  134. package/src/components/option-group/QasOptionGroup.vue +54 -54
  135. package/src/components/option-group/QasOptionGroup.yml +30 -30
  136. package/src/components/page-header/QasPageHeader.vue +143 -143
  137. package/src/components/page-header/QasPageHeader.yml +42 -42
  138. package/src/components/pagination/QasPagination.vue +71 -71
  139. package/src/components/pagination/QasPagination.yml +4 -4
  140. package/src/components/password-input/QasPasswordInput.vue +110 -110
  141. package/src/components/password-input/QasPasswordInput.yml +111 -111
  142. package/src/components/password-strength-checker/QasPasswordStrengthChecker.vue +71 -71
  143. package/src/components/password-strength-checker/QasPasswordStrengthChecker.yml +103 -103
  144. package/src/components/profile/QasProfile.vue +98 -98
  145. package/src/components/profile/QasProfile.yml +60 -60
  146. package/src/components/radio/QasRadio.vue +62 -62
  147. package/src/components/radio/QasRadio.yml +11 -11
  148. package/src/components/resizer/QasResizer.vue +90 -90
  149. package/src/components/resizer/QasResizer.yml +24 -24
  150. package/src/components/search-box/QasSearchBox.vue +294 -294
  151. package/src/components/search-box/QasSearchBox.yml +154 -154
  152. package/src/components/search-input/QasSearchInput.vue +106 -106
  153. package/src/components/search-input/QasSearchInput.yml +48 -48
  154. package/src/components/select/QasSelect.vue +514 -514
  155. package/src/components/select/QasSelect.yml +157 -157
  156. package/src/components/select-list/QasSelectList.vue +238 -238
  157. package/src/components/select-list/QasSelectList.yml +108 -108
  158. package/src/components/select-list/private/PvSelectListCheckbox.vue +31 -31
  159. package/src/components/select-list-dialog/QasSelectListDialog.vue +395 -395
  160. package/src/components/select-list-dialog/QasSelectListDialog.yml +108 -108
  161. package/src/components/signature-pad/QasSignaturePad.vue +122 -122
  162. package/src/components/signature-pad/QasSignaturePad.yml +53 -53
  163. package/src/components/signature-uploader/QasSignatureUploader.vue +164 -164
  164. package/src/components/signature-uploader/QasSignatureUploader.yml +37 -37
  165. package/src/components/single-view/QasSingleView.vue +175 -175
  166. package/src/components/single-view/QasSingleView.yml +131 -131
  167. package/src/components/sortable/QasSortable.vue +151 -151
  168. package/src/components/sortable/QasSortable.yml +65 -65
  169. package/src/components/status/QasStatus.test.js +11 -11
  170. package/src/components/status/QasStatus.vue +29 -29
  171. package/src/components/status/QasStatus.yml +10 -10
  172. package/src/components/stepper/QasStepper.vue +199 -152
  173. package/src/components/stepper/QasStepper.yml +35 -35
  174. package/src/components/stepper-form-view/QasStepperFormView.vue +86 -84
  175. package/src/components/stepper-form-view/QasStepperFormView.yml +58 -58
  176. package/src/components/table-generator/QasTableGenerator.vue +416 -416
  177. package/src/components/table-generator/QasTableGenerator.yml +94 -94
  178. package/src/components/tabs-generator/QasTabsGenerator.vue +196 -196
  179. package/src/components/tabs-generator/QasTabsGenerator.yml +53 -53
  180. package/src/components/text-truncate/QasTextTruncate.vue +274 -274
  181. package/src/components/text-truncate/QasTextTruncate.yml +60 -60
  182. package/src/components/timeline/QasTimeline.vue +140 -140
  183. package/src/components/timeline/QasTimeline.yml +36 -36
  184. package/src/components/toggle/QasToggle.vue +14 -14
  185. package/src/components/toggle/QasToggle.yml +5 -5
  186. package/src/components/toggle-visibility/QasToggleVisibility.vue +79 -79
  187. package/src/components/toggle-visibility/QasToggleVisibility.yml +30 -30
  188. package/src/components/transfer/QasTransfer.vue +239 -239
  189. package/src/components/transfer/QasTransfer.yml +60 -60
  190. package/src/components/tree-generator/QasTreeForm.vue +62 -62
  191. package/src/components/tree-generator/QasTreeGenerator.vue +488 -488
  192. package/src/components/tree-generator/QasTreeGenerator.yml +81 -81
  193. package/src/components/uploader/QasUploader.vue +691 -645
  194. package/src/components/uploader/QasUploader.yml +206 -192
  195. package/src/components/uploader/private/PvUploaderGalleryCard.vue +357 -357
  196. package/src/components/welcome/QasWelcome.vue +125 -125
  197. package/src/components/welcome/QasWelcome.yml +23 -23
  198. package/src/components/welcome/private/PvWelcomeShortcutCard.vue +58 -58
  199. package/src/components/whatsapp-link/QasWhatsappLink.vue +34 -34
  200. package/src/components/whatsapp-link/QasWhatsappLink.yml +18 -18
  201. package/src/composables/index.js +8 -8
  202. package/src/composables/private/index.js +3 -3
  203. package/src/composables/private/use-generator.js +174 -174
  204. package/src/composables/private/use-toggle-visibility.js +48 -48
  205. package/src/composables/private/use-view.js +186 -186
  206. package/src/composables/use-context.js +15 -15
  207. package/src/composables/use-form.js +32 -32
  208. package/src/composables/use-history.js +46 -46
  209. package/src/composables/use-notifications.js +128 -128
  210. package/src/composables/use-query-cache.js +60 -60
  211. package/src/composables/use-screen.js +42 -42
  212. package/src/css/base/font-face.scss +28 -28
  213. package/src/css/base/index.scss +1 -1
  214. package/src/css/components/base.scss +12 -12
  215. package/src/css/components/button.scss +116 -116
  216. package/src/css/components/checkbox.scss +14 -14
  217. package/src/css/components/editor.scss +7 -7
  218. package/src/css/components/field.scss +88 -88
  219. package/src/css/components/index.scss +10 -10
  220. package/src/css/components/item.scss +52 -52
  221. package/src/css/components/radio.scss +18 -18
  222. package/src/css/components/scrollbar.scss +20 -20
  223. package/src/css/components/tabs.scss +3 -3
  224. package/src/css/components/toggle.scss +13 -13
  225. package/src/css/mixins/index.scss +3 -3
  226. package/src/css/mixins/set-brand.scss +15 -15
  227. package/src/css/mixins/set-button.scss +26 -26
  228. package/src/css/mixins/set-typography.scss +8 -8
  229. package/src/css/plugins/index.scss +2 -2
  230. package/src/css/plugins/loading.scss +5 -5
  231. package/src/css/plugins/notify.scss +100 -100
  232. package/src/css/utils/background.scss +34 -34
  233. package/src/css/utils/border-radius.scss +29 -29
  234. package/src/css/utils/border.scss +42 -42
  235. package/src/css/utils/container.scss +36 -36
  236. package/src/css/utils/fonts.scss +5 -5
  237. package/src/css/utils/index.scss +10 -10
  238. package/src/css/utils/line-height.scss +19 -19
  239. package/src/css/utils/opacity.scss +5 -5
  240. package/src/css/utils/scroll.scss +21 -21
  241. package/src/css/utils/text.scss +15 -15
  242. package/src/css/utils/unset.scss +8 -8
  243. package/src/css/variables/button.scss +4 -4
  244. package/src/css/variables/index.scss +6 -6
  245. package/src/css/variables/scrollbar.scss +11 -11
  246. package/src/css/variables/separator.scss +2 -2
  247. package/src/css/variables/shadow.scss +3 -3
  248. package/src/css/variables/spacing.scss +98 -98
  249. package/src/css/variables/typography.scss +149 -149
  250. package/src/directives/Test.js +13 -13
  251. package/src/enums/Align.js +7 -7
  252. package/src/enums/Spacing.js +98 -98
  253. package/src/enums/Status.js +33 -33
  254. package/src/helpers/add-counter-suffix.js +3 -3
  255. package/src/helpers/base-64-to-blob.js +21 -21
  256. package/src/helpers/camelize-fields-name.js +15 -15
  257. package/src/helpers/construct-object.js +29 -29
  258. package/src/helpers/copy-to-clipboard.js +15 -15
  259. package/src/helpers/destroy-nested-children-by-key.js +33 -33
  260. package/src/helpers/download-file.js +21 -21
  261. package/src/helpers/filter-list-by-handle.js +31 -31
  262. package/src/helpers/filter-object-to-array.js +29 -29
  263. package/src/helpers/filter-object.js +34 -34
  264. package/src/helpers/filters.js +163 -163
  265. package/src/helpers/find-children-by-key.js +14 -14
  266. package/src/helpers/get-greatest-common-divisor.js +16 -16
  267. package/src/helpers/get-normalized-options.js +20 -20
  268. package/src/helpers/get-placeholder.js +19 -19
  269. package/src/helpers/get-required-label.js +3 -3
  270. package/src/helpers/get-slot-children-text.js +15 -15
  271. package/src/helpers/handle-process.js +13 -13
  272. package/src/helpers/images.js +28 -28
  273. package/src/helpers/index.js +25 -25
  274. package/src/helpers/is-empty.js +3 -3
  275. package/src/helpers/is-local-development.js +3 -3
  276. package/src/helpers/private/gutter-validator.js +15 -15
  277. package/src/helpers/private/has-parent-by-class-name.js +15 -15
  278. package/src/helpers/promise-handler.js +40 -40
  279. package/src/helpers/rules.js +7 -7
  280. package/src/helpers/set-scroll-on-grab.js +128 -128
  281. package/src/index.cjs.js +1 -1
  282. package/src/index.esm.js +4 -4
  283. package/src/index.scss +38 -38
  284. package/src/index.umd.js +2 -2
  285. package/src/mixins/context.js +8 -8
  286. package/src/mixins/delete.js +48 -48
  287. package/src/mixins/dialog-router.js +17 -17
  288. package/src/mixins/form.js +11 -11
  289. package/src/mixins/generator.js +94 -94
  290. package/src/mixins/index.js +17 -17
  291. package/src/mixins/password.js +86 -86
  292. package/src/mixins/search-filter.js +354 -354
  293. package/src/mixins/view.js +156 -156
  294. package/src/pages/ErrorComponent.vue +74 -74
  295. package/src/pages/Forbidden.vue +29 -29
  296. package/src/pages/NotFound.vue +29 -29
  297. package/src/pages/ServerError.vue +29 -29
  298. package/src/pages/Unauthorized.vue +29 -29
  299. package/src/plugins/delete/Delete.js +107 -107
  300. package/src/plugins/delete/Delete.yml +75 -75
  301. package/src/plugins/dialog/Dialog.js +14 -14
  302. package/src/plugins/dialog/Dialog.yml +10 -10
  303. package/src/plugins/index.js +13 -13
  304. package/src/plugins/notify-error/NotifyError.js +13 -13
  305. package/src/plugins/notify-error/NotifyError.yml +11 -11
  306. package/src/plugins/notify-success/NotifySuccess.js +13 -13
  307. package/src/plugins/notify-success/NotifySuccess.yml +11 -11
  308. package/src/plugins/screen/Screen.js +35 -35
  309. package/src/plugins/screen/Screen.yml +16 -16
  310. package/src/shared/date-config.js +26 -26
  311. package/src/shared/fuse-config.js +4 -4
  312. package/src/shared/notify-config.js +7 -7
  313. package/src/vue-plugin/third-party-component-handler.js +29 -29
  314. package/src/vue-plugin.js +282 -282
@@ -1,151 +1,151 @@
1
- <template>
2
- <component :is="tag" ref="sortableItems">
3
- <slot />
4
- </component>
5
- </template>
6
-
7
- <script>
8
- import { Loading, extend } from 'quasar'
9
- import Sortable from 'sortablejs'
10
- import { getAction } from '@bildvitta/store-adapter'
11
-
12
- import { NotifyError } from '../../plugins'
13
-
14
- export default {
15
- name: 'QasSortable',
16
-
17
- props: {
18
- entity: {
19
- default: '',
20
- type: String
21
- },
22
-
23
- sortableOptions: {
24
- default: () => ({ animation: 500 }),
25
- type: Object
26
- },
27
-
28
- tag: {
29
- default: 'div',
30
- type: String
31
- },
32
-
33
- url: {
34
- default: '',
35
- type: String
36
- },
37
-
38
- modelValue: {
39
- default: () => [],
40
- type: Array
41
- },
42
-
43
- useSaveOnSort: {
44
- type: Boolean,
45
- default: true
46
- }
47
- },
48
-
49
- emits: [
50
- 'update:modelValue',
51
- 'sort',
52
- 'success',
53
- 'error'
54
- ],
55
-
56
- data () {
57
- return {
58
- sortable: null,
59
- sortedList: null
60
- }
61
- },
62
-
63
- computed: {
64
- identifiers () {
65
- return this.sortedList.map(({ id }) => id)
66
- }
67
- },
68
-
69
- watch: {
70
- sortableOptions (value) {
71
- this.sortable.options = { ...this.sortable.options, ...value }
72
- },
73
-
74
- modelValue: {
75
- handler (newValues) {
76
- this.sortedList = newValues
77
- },
78
-
79
- deep: true
80
- }
81
- },
82
-
83
- created () {
84
- this.setSortedValue()
85
- },
86
-
87
- async mounted () {
88
- this.sortable = new Sortable(this.$refs.sortableItems, {
89
- ...this.sortableOptions,
90
-
91
- onUpdate: event => {
92
- this.updateOrder(event)
93
- this.$emit('sort', event)
94
- }
95
- })
96
- },
97
-
98
- unmounted () {
99
- this.sortable.destroy()
100
- },
101
-
102
- methods: {
103
- setError (error) {
104
- const { response } = error
105
- const exception = response?.data?.exception || error.message
106
-
107
- NotifyError('Ops! Erro ao salvar ordenação.', exception)
108
- },
109
-
110
- // TODO precisa testar este método quando tivermos uma API para teste.
111
- async replace () {
112
- Loading.show()
113
-
114
- try {
115
- const response = await getAction.call(this, {
116
- entity: this.entity,
117
- key: 'replace',
118
- payload: {
119
- payload: { order: this.identifiers },
120
- url: this.url || `${this.entity}/sort`
121
- }
122
- })
123
-
124
- this.$emit('success', response)
125
- } catch (error) {
126
- this.setError(error)
127
- this.$emit('error', error)
128
- } finally {
129
- Loading.hide()
130
- }
131
- },
132
-
133
- updateOrder ({ newIndex, oldIndex }) {
134
- const deleted = this.sortedList.splice(oldIndex, 1)
135
- this.sortedList.splice(newIndex, 0, deleted[0])
136
-
137
- this.updateModel()
138
-
139
- this.useSaveOnSort && this.replace()
140
- },
141
-
142
- setSortedValue () {
143
- this.sortedList = extend(true, [], this.modelValue)
144
- },
145
-
146
- updateModel () {
147
- this.$emit('update:modelValue', this.sortedList)
148
- }
149
- }
150
- }
151
- </script>
1
+ <template>
2
+ <component :is="tag" ref="sortableItems">
3
+ <slot />
4
+ </component>
5
+ </template>
6
+
7
+ <script>
8
+ import { Loading, extend } from 'quasar'
9
+ import Sortable from 'sortablejs'
10
+ import { getAction } from '@bildvitta/store-adapter'
11
+
12
+ import { NotifyError } from '../../plugins'
13
+
14
+ export default {
15
+ name: 'QasSortable',
16
+
17
+ props: {
18
+ entity: {
19
+ default: '',
20
+ type: String
21
+ },
22
+
23
+ sortableOptions: {
24
+ default: () => ({ animation: 500 }),
25
+ type: Object
26
+ },
27
+
28
+ tag: {
29
+ default: 'div',
30
+ type: String
31
+ },
32
+
33
+ url: {
34
+ default: '',
35
+ type: String
36
+ },
37
+
38
+ modelValue: {
39
+ default: () => [],
40
+ type: Array
41
+ },
42
+
43
+ useSaveOnSort: {
44
+ type: Boolean,
45
+ default: true
46
+ }
47
+ },
48
+
49
+ emits: [
50
+ 'update:modelValue',
51
+ 'sort',
52
+ 'success',
53
+ 'error'
54
+ ],
55
+
56
+ data () {
57
+ return {
58
+ sortable: null,
59
+ sortedList: null
60
+ }
61
+ },
62
+
63
+ computed: {
64
+ identifiers () {
65
+ return this.sortedList.map(({ id }) => id)
66
+ }
67
+ },
68
+
69
+ watch: {
70
+ sortableOptions (value) {
71
+ this.sortable.options = { ...this.sortable.options, ...value }
72
+ },
73
+
74
+ modelValue: {
75
+ handler (newValues) {
76
+ this.sortedList = newValues
77
+ },
78
+
79
+ deep: true
80
+ }
81
+ },
82
+
83
+ created () {
84
+ this.setSortedValue()
85
+ },
86
+
87
+ async mounted () {
88
+ this.sortable = new Sortable(this.$refs.sortableItems, {
89
+ ...this.sortableOptions,
90
+
91
+ onUpdate: event => {
92
+ this.updateOrder(event)
93
+ this.$emit('sort', event)
94
+ }
95
+ })
96
+ },
97
+
98
+ unmounted () {
99
+ this.sortable.destroy()
100
+ },
101
+
102
+ methods: {
103
+ setError (error) {
104
+ const { response } = error
105
+ const exception = response?.data?.exception || error.message
106
+
107
+ NotifyError('Ops! Erro ao salvar ordenação.', exception)
108
+ },
109
+
110
+ // TODO precisa testar este método quando tivermos uma API para teste.
111
+ async replace () {
112
+ Loading.show()
113
+
114
+ try {
115
+ const response = await getAction.call(this, {
116
+ entity: this.entity,
117
+ key: 'replace',
118
+ payload: {
119
+ payload: { order: this.identifiers },
120
+ url: this.url || `${this.entity}/sort`
121
+ }
122
+ })
123
+
124
+ this.$emit('success', response)
125
+ } catch (error) {
126
+ this.setError(error)
127
+ this.$emit('error', error)
128
+ } finally {
129
+ Loading.hide()
130
+ }
131
+ },
132
+
133
+ updateOrder ({ newIndex, oldIndex }) {
134
+ const deleted = this.sortedList.splice(oldIndex, 1)
135
+ this.sortedList.splice(newIndex, 0, deleted[0])
136
+
137
+ this.updateModel()
138
+
139
+ this.useSaveOnSort && this.replace()
140
+ },
141
+
142
+ setSortedValue () {
143
+ this.sortedList = extend(true, [], this.modelValue)
144
+ },
145
+
146
+ updateModel () {
147
+ this.$emit('update:modelValue', this.sortedList)
148
+ }
149
+ }
150
+ }
151
+ </script>
@@ -1,65 +1,65 @@
1
- type: component
2
-
3
- meta:
4
- desc: Componente para reordenar items em uma lista e salvar após isto.
5
-
6
- props:
7
- entity:
8
- desc: Entidade da store que para salvar os items após reordenar a lista.
9
- required: true
10
- type: String
11
-
12
- sortable-options:
13
- desc: Opções do "sortablejs" (https://github.com/SortableJS/Sortable#options).
14
- default: { animation: 500 }
15
- type: Object
16
-
17
- model-value:
18
- desc: Model do componente onde será fornecido a lista, e ele será responsável pela ordenação.
19
- default: []
20
- type: Array
21
- examples: [v-model="fields"]
22
- model: true
23
-
24
- tag:
25
- desc: Tag do componente pai.
26
- default: div
27
- type: String
28
-
29
- url:
30
- desc: Parâmetro enviado para a action "replace".
31
- type: String
32
-
33
- use-save-on-sort:
34
- desc: Controla se deve bater a API para salvar após fazer uma ordenação.
35
- type: Boolean
36
- default: true
37
-
38
- slots:
39
- default:
40
- desc: Slot para adicionar os items que serão reordenados.
41
-
42
- events:
43
- '@error -> function(value)':
44
- desc: Dispara toda vez que acontece algum erro ao salvar a nova ordenação.
45
- params:
46
- value:
47
- desc: fields.
48
- type: Object
49
-
50
- '@sort -> function(value)':
51
- desc: Dispara toda vez que acontece uma nova ordenação.
52
-
53
- '@success -> function(value)':
54
- desc: Dispara toda vez que salva com sucesso a nova ordenação.
55
- params:
56
- value:
57
- desc: fields.
58
- type: Object
59
-
60
- '@update:model-value -> function(values)':
61
- desc: Dispara quando o model-value altera, após acontecer uma ordenação.
62
- params:
63
- values:
64
- desc: Novo valor do model.
65
- type: Array
1
+ type: component
2
+
3
+ meta:
4
+ desc: Componente para reordenar items em uma lista e salvar após isto.
5
+
6
+ props:
7
+ entity:
8
+ desc: Entidade da store que para salvar os items após reordenar a lista.
9
+ required: true
10
+ type: String
11
+
12
+ sortable-options:
13
+ desc: Opções do "sortablejs" (https://github.com/SortableJS/Sortable#options).
14
+ default: { animation: 500 }
15
+ type: Object
16
+
17
+ model-value:
18
+ desc: Model do componente onde será fornecido a lista, e ele será responsável pela ordenação.
19
+ default: []
20
+ type: Array
21
+ examples: [v-model="fields"]
22
+ model: true
23
+
24
+ tag:
25
+ desc: Tag do componente pai.
26
+ default: div
27
+ type: String
28
+
29
+ url:
30
+ desc: Parâmetro enviado para a action "replace".
31
+ type: String
32
+
33
+ use-save-on-sort:
34
+ desc: Controla se deve bater a API para salvar após fazer uma ordenação.
35
+ type: Boolean
36
+ default: true
37
+
38
+ slots:
39
+ default:
40
+ desc: Slot para adicionar os items que serão reordenados.
41
+
42
+ events:
43
+ '@error -> function(value)':
44
+ desc: Dispara toda vez que acontece algum erro ao salvar a nova ordenação.
45
+ params:
46
+ value:
47
+ desc: fields.
48
+ type: Object
49
+
50
+ '@sort -> function(value)':
51
+ desc: Dispara toda vez que acontece uma nova ordenação.
52
+
53
+ '@success -> function(value)':
54
+ desc: Dispara toda vez que salva com sucesso a nova ordenação.
55
+ params:
56
+ value:
57
+ desc: fields.
58
+ type: Object
59
+
60
+ '@update:model-value -> function(values)':
61
+ desc: Dispara quando o model-value altera, após acontecer uma ordenação.
62
+ params:
63
+ values:
64
+ desc: Novo valor do model.
65
+ type: Array
@@ -1,11 +1,11 @@
1
- import { describe, it, expect } from 'vitest'
2
- import { mount } from '@vue/test-utils'
3
- import QasStatus from './QasStatus.vue'
4
-
5
- describe('QasStatus', () => {
6
- it('should render', () => {
7
- const wrapper = mount(QasStatus)
8
-
9
- expect(wrapper.exists()).toBeTruthy()
10
- })
11
- })
1
+ import { describe, it, expect } from 'vitest'
2
+ import { mount } from '@vue/test-utils'
3
+ import QasStatus from './QasStatus.vue'
4
+
5
+ describe('QasStatus', () => {
6
+ it('should render', () => {
7
+ const wrapper = mount(QasStatus)
8
+
9
+ expect(wrapper.exists()).toBeTruthy()
10
+ })
11
+ })
@@ -1,29 +1,29 @@
1
- <template>
2
- <div aria-live="polite" class="qas-status" :class="backgroundClass" role="status" />
3
- </template>
4
-
5
- <script setup>
6
- import { computed } from 'vue'
7
-
8
- defineOptions({
9
- name: 'QasStatus',
10
- inheritAttrs: false
11
- })
12
-
13
- const props = defineProps({
14
- color: {
15
- type: String,
16
- default: 'light-blue-2'
17
- }
18
- })
19
-
20
- const backgroundClass = computed(() => `bg-${props.color}`)
21
- </script>
22
-
23
- <style lang="scss">
24
- .qas-status {
25
- border-radius: 100%;
26
- height: 16px;
27
- width: 16px;
28
- }
29
- </style>
1
+ <template>
2
+ <div aria-live="polite" class="qas-status" :class="backgroundClass" role="status" />
3
+ </template>
4
+
5
+ <script setup>
6
+ import { computed } from 'vue'
7
+
8
+ defineOptions({
9
+ name: 'QasStatus',
10
+ inheritAttrs: false
11
+ })
12
+
13
+ const props = defineProps({
14
+ color: {
15
+ type: String,
16
+ default: 'light-blue-2'
17
+ }
18
+ })
19
+
20
+ const backgroundClass = computed(() => `bg-${props.color}`)
21
+ </script>
22
+
23
+ <style lang="scss">
24
+ .qas-status {
25
+ border-radius: 100%;
26
+ height: 16px;
27
+ width: 16px;
28
+ }
29
+ </style>
@@ -1,10 +1,10 @@
1
- type: component
2
-
3
- meta:
4
- desc: Componente que gera um status circular com a cor do status.
5
-
6
- props:
7
- color:
8
- desc: cor dos status.
9
- default: light-blue-2
10
- type: String
1
+ type: component
2
+
3
+ meta:
4
+ desc: Componente que gera um status circular com a cor do status.
5
+
6
+ props:
7
+ color:
8
+ desc: cor dos status.
9
+ default: light-blue-2
10
+ type: String