@ramathibodi/nuxt-commons 0.1.74 → 0.1.75

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 (96) hide show
  1. package/README.md +115 -115
  2. package/dist/module.json +1 -1
  3. package/dist/runtime/components/Alert.vue +58 -58
  4. package/dist/runtime/components/BarcodeReader.vue +130 -130
  5. package/dist/runtime/components/ExportCSV.vue +110 -110
  6. package/dist/runtime/components/FileBtn.vue +79 -79
  7. package/dist/runtime/components/ImportCSV.vue +151 -151
  8. package/dist/runtime/components/MrzReader.vue +168 -168
  9. package/dist/runtime/components/SplitterPanel.vue +67 -67
  10. package/dist/runtime/components/TabsGroup.vue +39 -39
  11. package/dist/runtime/components/TextBarcode.vue +66 -66
  12. package/dist/runtime/components/device/IdCardButton.vue +95 -95
  13. package/dist/runtime/components/device/IdCardWebSocket.vue +207 -207
  14. package/dist/runtime/components/device/Scanner.vue +350 -350
  15. package/dist/runtime/components/dialog/Confirm.vue +112 -112
  16. package/dist/runtime/components/dialog/Host.vue +88 -88
  17. package/dist/runtime/components/dialog/Index.vue +84 -84
  18. package/dist/runtime/components/dialog/Loading.vue +51 -51
  19. package/dist/runtime/components/dialog/default/Confirm.vue +112 -112
  20. package/dist/runtime/components/dialog/default/Loading.vue +60 -60
  21. package/dist/runtime/components/dialog/default/Notify.vue +82 -82
  22. package/dist/runtime/components/dialog/default/Printing.vue +46 -46
  23. package/dist/runtime/components/dialog/default/VerifyUser.vue +144 -144
  24. package/dist/runtime/components/document/Form.vue +50 -50
  25. package/dist/runtime/components/document/TemplateBuilder.vue +536 -536
  26. package/dist/runtime/components/form/ActionPad.vue +156 -156
  27. package/dist/runtime/components/form/Birthdate.vue +116 -116
  28. package/dist/runtime/components/form/CheckboxGroup.vue +99 -99
  29. package/dist/runtime/components/form/CodeEditor.vue +45 -45
  30. package/dist/runtime/components/form/Date.vue +270 -270
  31. package/dist/runtime/components/form/DateTime.vue +220 -220
  32. package/dist/runtime/components/form/Dialog.vue +178 -178
  33. package/dist/runtime/components/form/EditPad.vue +157 -157
  34. package/dist/runtime/components/form/File.vue +295 -295
  35. package/dist/runtime/components/form/Hidden.vue +44 -44
  36. package/dist/runtime/components/form/Iterator.vue +538 -538
  37. package/dist/runtime/components/form/Login.vue +143 -143
  38. package/dist/runtime/components/form/Pad.vue +399 -399
  39. package/dist/runtime/components/form/SignPad.vue +226 -226
  40. package/dist/runtime/components/form/System.vue +34 -34
  41. package/dist/runtime/components/form/Table.vue +391 -391
  42. package/dist/runtime/components/form/TableData.vue +236 -236
  43. package/dist/runtime/components/form/Time.vue +177 -177
  44. package/dist/runtime/components/form/images/Capture.vue +245 -245
  45. package/dist/runtime/components/form/images/Edit.vue +133 -133
  46. package/dist/runtime/components/form/images/Field.vue +331 -331
  47. package/dist/runtime/components/form/images/Pad.vue +54 -54
  48. package/dist/runtime/components/label/Date.vue +37 -37
  49. package/dist/runtime/components/label/DateAgo.vue +102 -102
  50. package/dist/runtime/components/label/DateCount.vue +152 -152
  51. package/dist/runtime/components/label/Field.vue +111 -111
  52. package/dist/runtime/components/label/FormatMoney.vue +37 -37
  53. package/dist/runtime/components/label/Mask.vue +46 -46
  54. package/dist/runtime/components/label/Object.vue +21 -21
  55. package/dist/runtime/components/master/Autocomplete.vue +89 -89
  56. package/dist/runtime/components/master/Combobox.vue +88 -88
  57. package/dist/runtime/components/master/RadioGroup.vue +90 -90
  58. package/dist/runtime/components/master/Select.vue +70 -70
  59. package/dist/runtime/components/master/label.vue +55 -55
  60. package/dist/runtime/components/model/Autocomplete.vue +91 -91
  61. package/dist/runtime/components/model/Combobox.vue +90 -90
  62. package/dist/runtime/components/model/Pad.vue +114 -114
  63. package/dist/runtime/components/model/Select.vue +78 -84
  64. package/dist/runtime/components/model/Table.vue +370 -370
  65. package/dist/runtime/components/model/iterator.vue +497 -497
  66. package/dist/runtime/components/model/label.vue +58 -58
  67. package/dist/runtime/components/pdf/Print.vue +75 -75
  68. package/dist/runtime/components/pdf/View.vue +146 -146
  69. package/dist/runtime/composables/dialog.d.ts +1 -1
  70. package/dist/runtime/composables/graphql.d.ts +1 -1
  71. package/dist/runtime/composables/graphqlModel.d.ts +9 -9
  72. package/dist/runtime/composables/graphqlModelItem.d.ts +7 -7
  73. package/dist/runtime/composables/graphqlModelOperation.d.ts +6 -6
  74. package/dist/runtime/composables/userPermission.d.ts +1 -1
  75. package/dist/runtime/labs/Calendar.vue +99 -99
  76. package/dist/runtime/labs/form/EditMobile.vue +152 -152
  77. package/dist/runtime/labs/form/TextFieldMask.vue +43 -43
  78. package/dist/runtime/plugins/clientConfig.d.ts +1 -1
  79. package/dist/runtime/plugins/default.d.ts +1 -1
  80. package/dist/runtime/plugins/dialogManager.d.ts +1 -1
  81. package/dist/runtime/plugins/permission.d.ts +1 -1
  82. package/dist/runtime/types/alert.d.ts +11 -11
  83. package/dist/runtime/types/clientConfig.d.ts +13 -13
  84. package/dist/runtime/types/dialogManager.d.ts +35 -35
  85. package/dist/runtime/types/formDialog.d.ts +5 -5
  86. package/dist/runtime/types/graphqlOperation.d.ts +23 -23
  87. package/dist/runtime/types/menu.d.ts +31 -31
  88. package/dist/runtime/types/modules.d.ts +7 -7
  89. package/dist/runtime/types/permission.d.ts +13 -13
  90. package/package.json +131 -131
  91. package/scripts/enrich-vue-docs-from-ai.mjs +197 -197
  92. package/scripts/generate-ai-summary.mjs +321 -321
  93. package/scripts/generate-composables-md.mjs +129 -129
  94. package/scripts/postInstall.cjs +70 -70
  95. package/templates/.codegen/codegen.ts +32 -32
  96. package/templates/.codegen/plugin-schema-object.js +161 -161
@@ -1,112 +1,112 @@
1
- <script lang="ts" setup>
2
- /**
3
- * DialogConfirm coordinates modal rendering and interactions for runtime dialog flows.
4
- * This doc block is consumed by vue-docgen for generated API documentation.
5
- */
6
- import { type Ref, ref, watch, computed } from 'vue'
7
- import { isEqual, isUndefined, isEmpty } from 'lodash-es'
8
-
9
- interface DialogProps {
10
- title?: string // Title text displayed in the component header or dialog.
11
- modelValue: boolean // Bound value for v-model synchronization with the parent component.
12
- message?: string // main message body shown in UI
13
- buttonTrueText?: string // label for the confirm/primary action
14
- buttonFalseText?: string // label for the cancel/secondary action
15
- type?: 'primary' | 'success' | 'warning' | 'info' | 'error' // visual variant controlling color and intent semantics
16
- confirmData?: string // confirmation text that users must type before continue
17
- width?: string // dialog/component width in CSS-compatible units
18
- }
19
-
20
- /**
21
- * Public props accepted by DialogConfirm.
22
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
23
- */
24
- const props = withDefaults(defineProps<DialogProps>(), {
25
- title: 'ยืนยัน',
26
- message: 'ยืนยันทำรายการนี้',
27
- buttonTrueText: 'ตกลง',
28
- buttonFalseText: 'ยกเลิก',
29
- width: 'auto',
30
- })
31
-
32
- /**
33
- * Custom events emitted by DialogConfirm.
34
- * Parents can listen to these events to react to user actions and internal state changes.
35
- */
36
- const emit = defineEmits<{
37
- (e: 'update:result', value: boolean): void
38
- (e: 'update:modelValue', value: boolean): void
39
- }>()
40
-
41
- const dialogVisible: Ref<boolean> = ref(false)
42
- dialogVisible.value = props.modelValue
43
- watch(
44
- () => props.modelValue,
45
- () => {
46
- dialogVisible.value = props.modelValue
47
- },
48
- )
49
-
50
- const txtConfirm = ref<string>()
51
-
52
- const isDisabled = computed(() => {
53
- if (isUndefined(props.confirmData)) return false
54
- if (isEmpty(props.confirmData)) return true
55
- return props.confirmData ? !isEqual(txtConfirm.value, props.confirmData) : false
56
- })
57
-
58
- const handleResult = (result: boolean) => {
59
- dialogVisible.value = false
60
- emit('update:modelValue', dialogVisible.value)
61
- emit('update:result', result)
62
- txtConfirm.value = ''
63
- }
64
- </script>
65
-
66
- <template>
67
- <v-row justify="center">
68
- <v-dialog
69
- v-model="dialogVisible"
70
- persistent
71
- :width="props.width"
72
- >
73
- <v-card>
74
- <v-toolbar
75
- :color="props.type"
76
- :title="props.title"
77
- />
78
- <v-card-text>{{ props.message }}</v-card-text>
79
- <v-card-text v-if="props.confirmData">
80
- <v-text-field
81
- v-model="txtConfirm"
82
- variant="underlined"
83
- >
84
- <template #label>
85
- <slot
86
- name="labelTextConfirm"
87
- :text="props.confirmData"
88
- />
89
- </template>
90
- </v-text-field>
91
- </v-card-text>
92
- <v-card-actions>
93
- <v-spacer />
94
- <v-btn
95
- variant="text"
96
- @click="handleResult(false)"
97
- >
98
- {{ props.buttonFalseText }}
99
- </v-btn>
100
- <v-btn
101
- :color="props.type"
102
- variant="text"
103
- :disabled="isDisabled"
104
- @click="handleResult(true)"
105
- >
106
- {{ props.buttonTrueText }}
107
- </v-btn>
108
- </v-card-actions>
109
- </v-card>
110
- </v-dialog>
111
- </v-row>
112
- </template>
1
+ <script lang="ts" setup>
2
+ /**
3
+ * DialogConfirm coordinates modal rendering and interactions for runtime dialog flows.
4
+ * This doc block is consumed by vue-docgen for generated API documentation.
5
+ */
6
+ import { type Ref, ref, watch, computed } from 'vue'
7
+ import { isEqual, isUndefined, isEmpty } from 'lodash-es'
8
+
9
+ interface DialogProps {
10
+ title?: string // Title text displayed in the component header or dialog.
11
+ modelValue: boolean // Bound value for v-model synchronization with the parent component.
12
+ message?: string // main message body shown in UI
13
+ buttonTrueText?: string // label for the confirm/primary action
14
+ buttonFalseText?: string // label for the cancel/secondary action
15
+ type?: 'primary' | 'success' | 'warning' | 'info' | 'error' // visual variant controlling color and intent semantics
16
+ confirmData?: string // confirmation text that users must type before continue
17
+ width?: string // dialog/component width in CSS-compatible units
18
+ }
19
+
20
+ /**
21
+ * Public props accepted by DialogConfirm.
22
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
23
+ */
24
+ const props = withDefaults(defineProps<DialogProps>(), {
25
+ title: 'ยืนยัน',
26
+ message: 'ยืนยันทำรายการนี้',
27
+ buttonTrueText: 'ตกลง',
28
+ buttonFalseText: 'ยกเลิก',
29
+ width: 'auto',
30
+ })
31
+
32
+ /**
33
+ * Custom events emitted by DialogConfirm.
34
+ * Parents can listen to these events to react to user actions and internal state changes.
35
+ */
36
+ const emit = defineEmits<{
37
+ (e: 'update:result', value: boolean): void
38
+ (e: 'update:modelValue', value: boolean): void
39
+ }>()
40
+
41
+ const dialogVisible: Ref<boolean> = ref(false)
42
+ dialogVisible.value = props.modelValue
43
+ watch(
44
+ () => props.modelValue,
45
+ () => {
46
+ dialogVisible.value = props.modelValue
47
+ },
48
+ )
49
+
50
+ const txtConfirm = ref<string>()
51
+
52
+ const isDisabled = computed(() => {
53
+ if (isUndefined(props.confirmData)) return false
54
+ if (isEmpty(props.confirmData)) return true
55
+ return props.confirmData ? !isEqual(txtConfirm.value, props.confirmData) : false
56
+ })
57
+
58
+ const handleResult = (result: boolean) => {
59
+ dialogVisible.value = false
60
+ emit('update:modelValue', dialogVisible.value)
61
+ emit('update:result', result)
62
+ txtConfirm.value = ''
63
+ }
64
+ </script>
65
+
66
+ <template>
67
+ <v-row justify="center">
68
+ <v-dialog
69
+ v-model="dialogVisible"
70
+ persistent
71
+ :width="props.width"
72
+ >
73
+ <v-card>
74
+ <v-toolbar
75
+ :color="props.type"
76
+ :title="props.title"
77
+ />
78
+ <v-card-text>{{ props.message }}</v-card-text>
79
+ <v-card-text v-if="props.confirmData">
80
+ <v-text-field
81
+ v-model="txtConfirm"
82
+ variant="underlined"
83
+ >
84
+ <template #label>
85
+ <slot
86
+ name="labelTextConfirm"
87
+ :text="props.confirmData"
88
+ />
89
+ </template>
90
+ </v-text-field>
91
+ </v-card-text>
92
+ <v-card-actions>
93
+ <v-spacer />
94
+ <v-btn
95
+ variant="text"
96
+ @click="handleResult(false)"
97
+ >
98
+ {{ props.buttonFalseText }}
99
+ </v-btn>
100
+ <v-btn
101
+ :color="props.type"
102
+ variant="text"
103
+ :disabled="isDisabled"
104
+ @click="handleResult(true)"
105
+ >
106
+ {{ props.buttonTrueText }}
107
+ </v-btn>
108
+ </v-card-actions>
109
+ </v-card>
110
+ </v-dialog>
111
+ </v-row>
112
+ </template>
@@ -1,88 +1,88 @@
1
- <script setup lang="ts">
2
- /**
3
- * DialogHost coordinates modal rendering and interactions for runtime dialog flows.
4
- * This doc block is consumed by vue-docgen for generated API documentation.
5
- */
6
- import {shallowReactive, onMounted} from 'vue'
7
- import {useDialog} from "../../composables/dialog"
8
- import type {DialogOpenResult} from "../../types/dialogManager";
9
-
10
- interface DialogEntry {
11
- id: number
12
- component: any
13
- props: Record<string, any>
14
- resolve: (val: any) => void
15
- reject: (val: any) => void
16
- }
17
-
18
- const dialogs = shallowReactive<DialogEntry[]>([])
19
- let idCounter = 0
20
-
21
- function open(component: any, inputProps: Record<string, any> = {}) : DialogOpenResult {
22
- const id = ++idCounter
23
-
24
- const promise = new Promise<any>((resolve,reject) => {
25
- const dialogProps = {
26
- ...inputProps,
27
- modelValue: true,
28
- 'onUpdate:modelValue': (v: boolean) => {
29
- if (!v) close(id, null)
30
- },
31
- onResolve: (val: any) => close(id, val),
32
- onReject: (val: any) => closeWithReject(id, val)
33
- }
34
-
35
- dialogs.push({
36
- id,
37
- component,
38
- props: dialogProps,
39
- resolve,
40
- reject
41
- })
42
- })
43
-
44
- const closeInstance = (val?: any) => {
45
- close(id,val)
46
- }
47
-
48
- const rejectInstance = (val?: any) => {
49
- closeWithReject(id,val)
50
- }
51
-
52
- return { id, promise, closeInstance, rejectInstance}
53
- }
54
-
55
- function close(id: number, val: any) {
56
- const index = dialogs.findIndex((d) => d.id === id)
57
- if (index !== -1) {
58
- dialogs[index].resolve(val)
59
- dialogs.splice(index, 1)
60
- }
61
- }
62
-
63
- function closeWithReject(id: number, val: any) {
64
- const index = dialogs.findIndex((d) => d.id === id)
65
- if (index !== -1) {
66
- dialogs[index].reject(val)
67
- dialogs.splice(index, 1)
68
- }
69
- }
70
-
71
- onMounted(() => {
72
- useDialog()?.setDialogHost(open, close)
73
- })
74
-
75
- defineExpose({ open, close })
76
- </script>
77
- <template>
78
- <Teleport to="body">
79
- <div>
80
- <component
81
- v-for="dialog in dialogs"
82
- :key="dialog.id"
83
- :is="dialog.component"
84
- v-bind="dialog.props"
85
- />
86
- </div>
87
- </Teleport>
88
- </template>
1
+ <script setup lang="ts">
2
+ /**
3
+ * DialogHost coordinates modal rendering and interactions for runtime dialog flows.
4
+ * This doc block is consumed by vue-docgen for generated API documentation.
5
+ */
6
+ import {shallowReactive, onMounted} from 'vue'
7
+ import {useDialog} from "../../composables/dialog"
8
+ import type {DialogOpenResult} from "../../types/dialogManager";
9
+
10
+ interface DialogEntry {
11
+ id: number
12
+ component: any
13
+ props: Record<string, any>
14
+ resolve: (val: any) => void
15
+ reject: (val: any) => void
16
+ }
17
+
18
+ const dialogs = shallowReactive<DialogEntry[]>([])
19
+ let idCounter = 0
20
+
21
+ function open(component: any, inputProps: Record<string, any> = {}) : DialogOpenResult {
22
+ const id = ++idCounter
23
+
24
+ const promise = new Promise<any>((resolve,reject) => {
25
+ const dialogProps = {
26
+ ...inputProps,
27
+ modelValue: true,
28
+ 'onUpdate:modelValue': (v: boolean) => {
29
+ if (!v) close(id, null)
30
+ },
31
+ onResolve: (val: any) => close(id, val),
32
+ onReject: (val: any) => closeWithReject(id, val)
33
+ }
34
+
35
+ dialogs.push({
36
+ id,
37
+ component,
38
+ props: dialogProps,
39
+ resolve,
40
+ reject
41
+ })
42
+ })
43
+
44
+ const closeInstance = (val?: any) => {
45
+ close(id,val)
46
+ }
47
+
48
+ const rejectInstance = (val?: any) => {
49
+ closeWithReject(id,val)
50
+ }
51
+
52
+ return { id, promise, closeInstance, rejectInstance}
53
+ }
54
+
55
+ function close(id: number, val: any) {
56
+ const index = dialogs.findIndex((d) => d.id === id)
57
+ if (index !== -1) {
58
+ dialogs[index].resolve(val)
59
+ dialogs.splice(index, 1)
60
+ }
61
+ }
62
+
63
+ function closeWithReject(id: number, val: any) {
64
+ const index = dialogs.findIndex((d) => d.id === id)
65
+ if (index !== -1) {
66
+ dialogs[index].reject(val)
67
+ dialogs.splice(index, 1)
68
+ }
69
+ }
70
+
71
+ onMounted(() => {
72
+ useDialog()?.setDialogHost(open, close)
73
+ })
74
+
75
+ defineExpose({ open, close })
76
+ </script>
77
+ <template>
78
+ <Teleport to="body">
79
+ <div>
80
+ <component
81
+ v-for="dialog in dialogs"
82
+ :key="dialog.id"
83
+ :is="dialog.component"
84
+ v-bind="dialog.props"
85
+ />
86
+ </div>
87
+ </Teleport>
88
+ </template>
@@ -1,84 +1,84 @@
1
- <script lang="ts" setup>
2
- /**
3
- * DialogIndex coordinates modal rendering and interactions for runtime dialog flows.
4
- * This doc block is consumed by vue-docgen for generated API documentation.
5
- */
6
- import { computed } from 'vue'
7
-
8
- interface DialogProps {
9
- modelValue?: boolean // Bound value for v-model synchronization with the parent component.
10
- title?: string // Title text displayed in the component header or dialog.
11
- message?: string // main message body shown in UI
12
- type?: 'success' | 'error' | 'warning' | 'info' // visual variant controlling color and intent semantics
13
- width?: number | string // dialog/component width in CSS-compatible units
14
- }
15
-
16
- /**
17
- * Public props accepted by DialogIndex.
18
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
19
- */
20
- const props = defineProps<DialogProps>()
21
- /**
22
- * Custom events emitted by DialogIndex.
23
- * Parents can listen to these events to react to user actions and internal state changes.
24
- */
25
- const emit = defineEmits(['update:modelValue'])
26
-
27
- const dialogIcon = computed(() => {
28
- switch (props.type) {
29
- case 'success':
30
- return 'mdi mdi-check-circle'
31
- case 'error':
32
- return 'mdi mdi-alert-circle'
33
- case 'warning':
34
- return 'mdi mdi-alert'
35
- case 'info':
36
- return 'mdi mdi-information-variant-circle'
37
- default:
38
- return ''
39
- }
40
- })
41
- </script>
42
-
43
- <template>
44
- <VDialog
45
- :model-value="modelValue"
46
- :width="width"
47
- max-width="800"
48
- @update:model-value="emit('update:modelValue', false)"
49
- >
50
- <VCard>
51
- <VToolbar :color="type">
52
- <VToolbarTitle>
53
- <VIcon :icon="dialogIcon" />
54
- {{ title }}
55
- </VToolbarTitle>
56
- <VBtn
57
- icon="mdi mdi-close"
58
- size="x-small"
59
- @click="emit('update:modelValue', false)"
60
- />
61
- </VToolbar>
62
- <VCardText>
63
- <slot>
64
- {{ message }}
65
- </slot>
66
- </VCardText>
67
- <VDivider />
68
- <VCardActions>
69
- <VBtn
70
- :color="type"
71
- block
72
- class="ma-auto"
73
- @click="emit('update:modelValue', false)"
74
- >
75
- ตกลง
76
- </VBtn>
77
- </VCardActions>
78
- </VCard>
79
- </VDialog>
80
- </template>
81
-
82
- <style lang="">
83
-
84
- </style>
1
+ <script lang="ts" setup>
2
+ /**
3
+ * DialogIndex coordinates modal rendering and interactions for runtime dialog flows.
4
+ * This doc block is consumed by vue-docgen for generated API documentation.
5
+ */
6
+ import { computed } from 'vue'
7
+
8
+ interface DialogProps {
9
+ modelValue?: boolean // Bound value for v-model synchronization with the parent component.
10
+ title?: string // Title text displayed in the component header or dialog.
11
+ message?: string // main message body shown in UI
12
+ type?: 'success' | 'error' | 'warning' | 'info' // visual variant controlling color and intent semantics
13
+ width?: number | string // dialog/component width in CSS-compatible units
14
+ }
15
+
16
+ /**
17
+ * Public props accepted by DialogIndex.
18
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
19
+ */
20
+ const props = defineProps<DialogProps>()
21
+ /**
22
+ * Custom events emitted by DialogIndex.
23
+ * Parents can listen to these events to react to user actions and internal state changes.
24
+ */
25
+ const emit = defineEmits(['update:modelValue'])
26
+
27
+ const dialogIcon = computed(() => {
28
+ switch (props.type) {
29
+ case 'success':
30
+ return 'mdi mdi-check-circle'
31
+ case 'error':
32
+ return 'mdi mdi-alert-circle'
33
+ case 'warning':
34
+ return 'mdi mdi-alert'
35
+ case 'info':
36
+ return 'mdi mdi-information-variant-circle'
37
+ default:
38
+ return ''
39
+ }
40
+ })
41
+ </script>
42
+
43
+ <template>
44
+ <VDialog
45
+ :model-value="modelValue"
46
+ :width="width"
47
+ max-width="800"
48
+ @update:model-value="emit('update:modelValue', false)"
49
+ >
50
+ <VCard>
51
+ <VToolbar :color="type">
52
+ <VToolbarTitle>
53
+ <VIcon :icon="dialogIcon" />
54
+ {{ title }}
55
+ </VToolbarTitle>
56
+ <VBtn
57
+ icon="mdi mdi-close"
58
+ size="x-small"
59
+ @click="emit('update:modelValue', false)"
60
+ />
61
+ </VToolbar>
62
+ <VCardText>
63
+ <slot>
64
+ {{ message }}
65
+ </slot>
66
+ </VCardText>
67
+ <VDivider />
68
+ <VCardActions>
69
+ <VBtn
70
+ :color="type"
71
+ block
72
+ class="ma-auto"
73
+ @click="emit('update:modelValue', false)"
74
+ >
75
+ ตกลง
76
+ </VBtn>
77
+ </VCardActions>
78
+ </VCard>
79
+ </VDialog>
80
+ </template>
81
+
82
+ <style lang="">
83
+
84
+ </style>
@@ -1,51 +1,51 @@
1
- <script setup lang="ts">
2
- /**
3
- * DialogLoading coordinates modal rendering and interactions for runtime dialog flows.
4
- * This doc block is consumed by vue-docgen for generated API documentation.
5
- */
6
- import { ref, watch } from 'vue'
7
-
8
- interface DialogProps {
9
- modelValue: boolean // Bound value for v-model synchronization with the parent component.
10
- color?: string // Vuetify color name applied to the visual element.
11
- }
12
- /**
13
- * Custom events emitted by DialogLoading.
14
- * Parents can listen to these events to react to user actions and internal state changes.
15
- */
16
- const emit = defineEmits(['update:modelValue'])
17
-
18
- /**
19
- * Public props accepted by DialogLoading.
20
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
21
- */
22
- const props = defineProps<DialogProps>()
23
- const dialogVisible = ref<boolean>(props.modelValue)
24
-
25
- watch(() => props.modelValue, (newValue) => {
26
- dialogVisible.value = newValue
27
- })
28
-
29
- watch(() => dialogVisible.value, (newValue) => {
30
- emit('update:modelValue', newValue)
31
- })
32
- </script>
33
-
34
- <template>
35
- <v-dialog
36
- v-model="dialogVisible"
37
- persistent
38
- max-width="500"
39
- >
40
- <v-card :color="props.color">
41
- <v-card-text>
42
- <v-row>
43
- <v-col class="text-center">
44
- <slot>กรุณารอสักครู่</slot>
45
- </v-col>
46
- </v-row>
47
- </v-card-text>
48
- <v-progress-linear indeterminate />
49
- </v-card>
50
- </v-dialog>
51
- </template>
1
+ <script setup lang="ts">
2
+ /**
3
+ * DialogLoading coordinates modal rendering and interactions for runtime dialog flows.
4
+ * This doc block is consumed by vue-docgen for generated API documentation.
5
+ */
6
+ import { ref, watch } from 'vue'
7
+
8
+ interface DialogProps {
9
+ modelValue: boolean // Bound value for v-model synchronization with the parent component.
10
+ color?: string // Vuetify color name applied to the visual element.
11
+ }
12
+ /**
13
+ * Custom events emitted by DialogLoading.
14
+ * Parents can listen to these events to react to user actions and internal state changes.
15
+ */
16
+ const emit = defineEmits(['update:modelValue'])
17
+
18
+ /**
19
+ * Public props accepted by DialogLoading.
20
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
21
+ */
22
+ const props = defineProps<DialogProps>()
23
+ const dialogVisible = ref<boolean>(props.modelValue)
24
+
25
+ watch(() => props.modelValue, (newValue) => {
26
+ dialogVisible.value = newValue
27
+ })
28
+
29
+ watch(() => dialogVisible.value, (newValue) => {
30
+ emit('update:modelValue', newValue)
31
+ })
32
+ </script>
33
+
34
+ <template>
35
+ <v-dialog
36
+ v-model="dialogVisible"
37
+ persistent
38
+ max-width="500"
39
+ >
40
+ <v-card :color="props.color">
41
+ <v-card-text>
42
+ <v-row>
43
+ <v-col class="text-center">
44
+ <slot>กรุณารอสักครู่</slot>
45
+ </v-col>
46
+ </v-row>
47
+ </v-card-text>
48
+ <v-progress-linear indeterminate />
49
+ </v-card>
50
+ </v-dialog>
51
+ </template>