edvoyui-component-library-test-flight 0.0.107 → 0.0.108
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/alerts/EUIAlerts.vue.d.ts +4 -0
- package/dist/alerts/EUIAlerts.vue.d.ts.map +1 -0
- package/dist/library-vue-ts.cjs.js +23 -23
- package/dist/library-vue-ts.css +1 -1
- package/dist/library-vue-ts.es.js +4858 -4634
- package/dist/library-vue-ts.umd.js +24 -24
- package/package.json +1 -1
- package/src/components/HelloWorld.vue +293 -167
- package/src/components/alerts/EUIAlerts.stories.ts +217 -0
- package/src/components/alerts/EUIAlerts.vue +194 -0
- package/src/components/index.ts +1 -0
package/package.json
CHANGED
|
@@ -8,79 +8,116 @@
|
|
|
8
8
|
</template>
|
|
9
9
|
<script setup lang="ts">
|
|
10
10
|
|
|
11
|
-
|
|
12
11
|
</script>
|
|
13
12
|
<style lang="scss"></style>
|
|
14
13
|
|
|
15
|
-
<!-- Development code here
|
|
14
|
+
<!-- Development code here -->
|
|
16
15
|
<!-- <template>
|
|
17
16
|
<div class="h-[clac(100svh-64px)] w-full px-10 py-8 max-w-screen-xl mx-auto">
|
|
18
17
|
<h1 class="mb-2 font-semibold text-gray-900 tetx-lg">Edvoy UI Componnet</h1>
|
|
19
18
|
|
|
20
|
-
<
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
19
|
+
<div class="grid gap-4 sm:grid-cols-2 place-items-start">
|
|
20
|
+
<div
|
|
21
|
+
class="w-full max-w-screen-xl col-span-2 p-4 bg-white border border-gray-200 border-solid rounded-lg hover:ring-2 ring-purple-500 ring-offset-1"
|
|
22
|
+
>
|
|
23
|
+
<span
|
|
24
|
+
class="px-1 py-1 mb-0 font-mono text-xs leading-none text-gray-500 bg-gray-100 rounded-md"
|
|
26
25
|
>
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
26
|
+
Name: Alert
|
|
27
|
+
</span>
|
|
28
|
+
<pre
|
|
29
|
+
class="pb-4 my-4 text-sm font-normal text-gray-700 whitespace-pre-wrap border-b border-gray-100 border-solid"
|
|
30
|
+
><code><EUIInput label="Firstname" placeholder="Enter your name" /></code></pre>
|
|
31
|
+
|
|
32
|
+
<div class="space-y-4">
|
|
33
|
+
<EUIAlerts
|
|
34
|
+
alert-type="Success"
|
|
35
|
+
heading="Deactivate account"
|
|
36
|
+
textMessage="Are you sure you want to deactivate your account? All of your data will be permanently removed from our servers forever. This action cannot be undone."
|
|
37
|
+
/>
|
|
38
|
+
|
|
39
|
+
<EUIAlerts
|
|
40
|
+
alert-type="Warning"
|
|
41
|
+
heading="Send Icon here"
|
|
42
|
+
:alertIcon="ExclamationTriangleIcon"
|
|
43
|
+
>
|
|
44
|
+
<template #xclose>
|
|
45
|
+
<a href="#" class="text-sm font-medium text-yellow-700 whitespace-nowrap hover:text-yellow-600">
|
|
46
|
+
Go to Page
|
|
47
|
+
<span aria-hidden="true"> →</span>
|
|
48
|
+
</a>
|
|
35
49
|
</template>
|
|
36
|
-
</
|
|
50
|
+
</EUIAlerts>
|
|
37
51
|
|
|
38
|
-
<Delete />
|
|
39
|
-
<UTableview />
|
|
40
|
-
<div class="">
|
|
41
|
-
<pre class="text-[0.5rem] p-2 rounded-lg max-h-72 overflow-y-auto text-red-600 border border-gray-100">
|
|
42
|
-
{{ `Total Row:${selectedRows.length}` }}
|
|
43
|
-
{{ selectedRows.map(x => x?._id)}}
|
|
44
|
-
</pre>
|
|
45
52
|
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
53
|
+
<EUIAlerts
|
|
54
|
+
alert-type="Success"
|
|
55
|
+
heading="Title only show here"
|
|
56
|
+
/>
|
|
57
|
+
|
|
58
|
+
<EUIAlerts
|
|
59
|
+
alert-type="Warning"
|
|
60
|
+
heading="Send Icon here"
|
|
61
|
+
:icon="ExclamationTriangleIcon"
|
|
62
|
+
/>
|
|
63
|
+
|
|
64
|
+
<EUIAlerts
|
|
65
|
+
alert-type="Default"
|
|
66
|
+
heading="Close Icon Boolean enabled"
|
|
67
|
+
close-icon
|
|
68
|
+
/>
|
|
69
|
+
|
|
70
|
+
<EUIAlerts
|
|
71
|
+
alert-type="Error"
|
|
72
|
+
heading="Deactivate account"
|
|
73
|
+
textMessage="Are you sure you want to deactivate your account? All of your data will be permanently removed from our servers forever. This action cannot be undone."
|
|
74
|
+
:showAlert="showAlert"
|
|
75
|
+
:close-icon="true"
|
|
76
|
+
@update:showAlert="showAlert = $event"
|
|
77
|
+
/>
|
|
78
|
+
|
|
79
|
+
<EUIAlerts
|
|
80
|
+
alert-type="Warning"
|
|
81
|
+
heading="Deactivate account"
|
|
82
|
+
textMessage="Are you sure you want to deactivate your account? All of your data will be permanently removed from our servers forever. This action cannot be undone."
|
|
83
|
+
:showAlert="showAlert"
|
|
84
|
+
close-icon
|
|
85
|
+
action-items
|
|
86
|
+
@update:showAlert="showAlert = $event"
|
|
87
|
+
@alertAction="onClickAlert"
|
|
88
|
+
@alertDismiss="showAlert = false"
|
|
89
|
+
/>
|
|
90
|
+
|
|
91
|
+
<EUIAlerts
|
|
92
|
+
alert-type="Warning"
|
|
93
|
+
:showAlert="showAlert"
|
|
94
|
+
@update:showAlert="showAlert = $event"
|
|
95
|
+
>
|
|
96
|
+
<template #icon>
|
|
97
|
+
<ExclamationTriangleIcon class="text-current size-4" aria-hidden="true" />
|
|
98
|
+
</template>
|
|
99
|
+
<template #title>Use Template here</template>
|
|
100
|
+
<template #content>Are you sure you want to deactivate your account? All of your data will be permanently removed from our servers forever. This action cannot be undone.</template>
|
|
101
|
+
|
|
102
|
+
<template #actionButtons>
|
|
103
|
+
<div class="pt-4">
|
|
104
|
+
<button type="button"
|
|
105
|
+
class="rounded-md px-3 py-1.5 text-sm font-medium bg-black text-white focus:outline-none focus:ring-2 focus:ring-offset-2"
|
|
106
|
+
>
|
|
107
|
+
View status
|
|
108
|
+
</button>
|
|
109
|
+
<button
|
|
110
|
+
type="button"
|
|
111
|
+
class="ml-3 rounded-md px-3 py-1.5 bg-white text-sm font-medium focus:outline-none focus:ring-2 focus:ring-offset-2"
|
|
112
|
+
>
|
|
113
|
+
Dismiss
|
|
114
|
+
</button>
|
|
73
115
|
</div>
|
|
74
|
-
</
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
</template>
|
|
80
|
-
</EUITable>
|
|
81
|
-
</div>
|
|
82
|
-
</div>
|
|
83
|
-
<div class="grid gap-4 sm:grid-cols-2 place-items-start">
|
|
116
|
+
</template>
|
|
117
|
+
</EUIAlerts>
|
|
118
|
+
</div>
|
|
119
|
+
</div>
|
|
120
|
+
|
|
84
121
|
<div
|
|
85
122
|
class="w-full max-w-screen-xl col-span-2 p-4 bg-white border border-gray-200 border-solid rounded-lg hover:ring-2 ring-purple-500 ring-offset-1"
|
|
86
123
|
>
|
|
@@ -89,9 +126,11 @@
|
|
|
89
126
|
>
|
|
90
127
|
Name: Input
|
|
91
128
|
</span>
|
|
92
|
-
<pre
|
|
129
|
+
<pre
|
|
130
|
+
class="pb-4 my-4 text-sm font-normal text-gray-700 whitespace-pre-wrap border-b border-gray-100 border-solid"
|
|
131
|
+
><code><EUIInput label="Firstname" placeholder="Enter your name" /></code></pre>
|
|
93
132
|
|
|
94
|
-
|
|
133
|
+
<div class="grid grid-cols-3 gap-4 pb-6 mb-4 border-b">
|
|
95
134
|
<EUIInput
|
|
96
135
|
v-model.trim="form.input"
|
|
97
136
|
name="addnote"
|
|
@@ -240,7 +279,7 @@
|
|
|
240
279
|
</div>
|
|
241
280
|
</div>
|
|
242
281
|
|
|
243
|
-
|
|
282
|
+
<div
|
|
244
283
|
class="w-full max-w-screen-xl col-span-2 p-4 bg-white border border-gray-200 border-solid rounded-lg hover:ring-2 ring-purple-500 ring-offset-1"
|
|
245
284
|
>
|
|
246
285
|
<span
|
|
@@ -255,34 +294,33 @@
|
|
|
255
294
|
input required" tag-color="Error" /></code>
|
|
256
295
|
</pre>
|
|
257
296
|
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
<EUITelephone
|
|
273
|
-
v-model="mobileNumber"
|
|
274
|
-
name="contactNumber"
|
|
275
|
-
label="Contact Number"
|
|
276
|
-
placeholder="Your mobile number"
|
|
277
|
-
tag="Mobile input required"
|
|
278
|
-
tag-color="Error"
|
|
279
|
-
:errors="{ name: 'Enter a valid phone number' }"
|
|
280
|
-
icon-type="startIcon"
|
|
281
|
-
:icon="DevicePhoneMobileIcon"
|
|
282
|
-
required
|
|
283
|
-
/>
|
|
284
|
-
</div>
|
|
297
|
+
<div class="grid grid-cols-2 gap-6">
|
|
298
|
+
<EUITelephone
|
|
299
|
+
v-model="mobileNumber"
|
|
300
|
+
name="contactNumber"
|
|
301
|
+
label="Contact Number"
|
|
302
|
+
placeholder="Your mobile number"
|
|
303
|
+
tag="Mobile input required"
|
|
304
|
+
tag-color="Error"
|
|
305
|
+
:errors="{ name: 'Enter a valid phone number' }"
|
|
306
|
+
icon-type="startIcon"
|
|
307
|
+
:icon="DevicePhoneMobileIcon"
|
|
308
|
+
inputFilled
|
|
309
|
+
/>
|
|
285
310
|
|
|
311
|
+
<EUITelephone
|
|
312
|
+
v-model="mobileNumber"
|
|
313
|
+
name="contactNumber"
|
|
314
|
+
label="Contact Number"
|
|
315
|
+
placeholder="Your mobile number"
|
|
316
|
+
tag="Mobile input required"
|
|
317
|
+
tag-color="Error"
|
|
318
|
+
:errors="{ name: 'Enter a valid phone number' }"
|
|
319
|
+
icon-type="startIcon"
|
|
320
|
+
:icon="DevicePhoneMobileIcon"
|
|
321
|
+
required
|
|
322
|
+
/>
|
|
323
|
+
</div>
|
|
286
324
|
</div>
|
|
287
325
|
|
|
288
326
|
<div
|
|
@@ -299,7 +337,7 @@
|
|
|
299
337
|
<code><EUISelect label="Firstname" placeholder="Enter your name" :items="datas" /></code>
|
|
300
338
|
</pre>
|
|
301
339
|
|
|
302
|
-
|
|
340
|
+
<div class="grid grid-cols-3 gap-4">
|
|
303
341
|
<EUISelect
|
|
304
342
|
search-label="name"
|
|
305
343
|
label="Select Label"
|
|
@@ -345,7 +383,7 @@
|
|
|
345
383
|
</div>
|
|
346
384
|
</div>
|
|
347
385
|
|
|
348
|
-
|
|
386
|
+
<div
|
|
349
387
|
class="w-full max-w-xl p-4 bg-white border border-gray-200 border-solid rounded-lg hover:ring-2 ring-purple-500 ring-offset-1 z-[calc(infinity)]"
|
|
350
388
|
>
|
|
351
389
|
<span
|
|
@@ -357,22 +395,26 @@
|
|
|
357
395
|
class="pb-4 my-4 text-sm font-normal text-gray-700 whitespace-pre-wrap border-b border-gray-100 border-solid"
|
|
358
396
|
><code><EUIMultiDropdown title="dropdown" :menu-items="menubar" /></code>
|
|
359
397
|
</pre>
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
398
|
+
<div class="inline-flex items-center gap-4">
|
|
399
|
+
<EUIMultiDropdown title="dropdown" :menu-items="menubar" />
|
|
400
|
+
|
|
401
|
+
<EUIMultiDropdown
|
|
402
|
+
class-name="px-3 py-2 text-gray-700 hover:text-gray-900 bg-white rounded-md focus:bg-violet-100 group focus:outline-none focus:ring-2 focus:ring-violet-400 focus:ring-opacity-100 hover:bg-gray-100 active:bg-violet-200"
|
|
403
|
+
@subMenuItem="handleSubMenuItem"
|
|
404
|
+
@menuItem="handleMenuItem"
|
|
405
|
+
@action-item="addAction"
|
|
406
|
+
>
|
|
407
|
+
<template #dropdownName="{ open }">
|
|
408
|
+
<span>My Students</span>
|
|
409
|
+
<ChevronDownStroke
|
|
410
|
+
:class="open ? 'text-gray-900 rotate-180' : 'text-gray-500'"
|
|
411
|
+
class="transition duration-100 ease-in-out transform rotate-0 size-6 group-hover:text-opacity-80"
|
|
412
|
+
aria-hidden="true"
|
|
413
|
+
/>
|
|
414
|
+
</template>
|
|
415
|
+
<template #actionName> + Add Custom Filter </template>
|
|
416
|
+
</EUIMultiDropdown>
|
|
417
|
+
</div>
|
|
376
418
|
</div>
|
|
377
419
|
|
|
378
420
|
<div
|
|
@@ -861,7 +903,7 @@
|
|
|
861
903
|
</EUIDashboardTable>
|
|
862
904
|
</code>
|
|
863
905
|
</pre>
|
|
864
|
-
|
|
906
|
+
<EUIDashboardTable
|
|
865
907
|
:checkable="true"
|
|
866
908
|
paginated
|
|
867
909
|
:checked-rows.sync="checkedRows"
|
|
@@ -893,42 +935,120 @@
|
|
|
893
935
|
</template>
|
|
894
936
|
</EUIDashboardTable>
|
|
895
937
|
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
938
|
+
<div class="py-4">
|
|
939
|
+
<EUITable
|
|
940
|
+
:checkable="true"
|
|
941
|
+
:table-loading="loading"
|
|
942
|
+
paginated
|
|
943
|
+
:checked-rows.sync="checkedRows"
|
|
944
|
+
backend-pagination
|
|
945
|
+
:per-page="10"
|
|
946
|
+
:headers="studentHeader"
|
|
947
|
+
:items="studentData"
|
|
948
|
+
:total="studentData.length"
|
|
949
|
+
:default-sort-direction="defaultSortOrder"
|
|
950
|
+
default-sort=""
|
|
951
|
+
:current-page="offset"
|
|
952
|
+
@changePage="onPageChange"
|
|
953
|
+
@sort="onSort"
|
|
954
|
+
@mouseenter="select"
|
|
955
|
+
@mouseleave="(selectedIndex = null), (selected = null)"
|
|
956
|
+
>
|
|
957
|
+
<template #[`item.firstName`]="{ row, rowIndex }">
|
|
958
|
+
<div class="space-y-0.5">
|
|
959
|
+
<div class="block text-sm font-medium leading-snug">
|
|
960
|
+
{{
|
|
961
|
+
capitalizeText(row?.firstName) +
|
|
962
|
+
" " +
|
|
963
|
+
capitalizeText(row?.lastName)
|
|
964
|
+
}}
|
|
965
|
+
</div>
|
|
966
|
+
<div class="text-xs font-medium text-gray-900 leading-[normal]">
|
|
967
|
+
{{ row?.referenceId }}
|
|
968
|
+
</div>
|
|
969
|
+
</div>
|
|
970
|
+
</template>
|
|
971
|
+
<template #[`item.activeUser`]="{ row, rowIndex }">
|
|
972
|
+
{{ row?.activeUser?.user?.firstName }}
|
|
973
|
+
{{ row?.activeUser?.user?.lastName }}
|
|
974
|
+
</template>
|
|
975
|
+
</EUITable>
|
|
976
|
+
</div>
|
|
977
|
+
</div>
|
|
978
|
+
</div>
|
|
979
|
+
|
|
980
|
+
<div class="">
|
|
981
|
+
<pre
|
|
982
|
+
class="text-[0.5rem] p-2 rounded-lg max-h-72 overflow-y-auto text-red-600 border border-gray-100"
|
|
914
983
|
>
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
984
|
+
{{ `Total Row:${selectedRows.length}` }}
|
|
985
|
+
{{ selectedRows.map((x) => x?._id) }}
|
|
986
|
+
</pre>
|
|
987
|
+
|
|
988
|
+
<div class="py-4">
|
|
989
|
+
<EUITable
|
|
990
|
+
:checkable="true"
|
|
991
|
+
:table-loading="loading"
|
|
992
|
+
paginated
|
|
993
|
+
v-model:selectedRows.sync="selectedRows"
|
|
994
|
+
:checked-rows.sync="checkedRows"
|
|
995
|
+
backend-pagination
|
|
996
|
+
:per-page="10"
|
|
997
|
+
:headers="studentHeader"
|
|
998
|
+
:items="studentData"
|
|
999
|
+
:total="studentData.length"
|
|
1000
|
+
:default-sort-direction="defaultSortOrder"
|
|
1001
|
+
default-sort=""
|
|
1002
|
+
:current-page="offset"
|
|
1003
|
+
@changePage="onPageChange"
|
|
1004
|
+
@sort="onSort"
|
|
1005
|
+
@mouseenter="select"
|
|
1006
|
+
@mouseleave="(selectedIndex = null), (selected = null)"
|
|
1007
|
+
>
|
|
1008
|
+
<template #[`item.firstName`]="{ row, rowIndex }">
|
|
1009
|
+
<div class="space-y-0.5">
|
|
1010
|
+
<div class="block text-sm font-medium leading-snug">
|
|
1011
|
+
{{
|
|
1012
|
+
capitalizeText(row?.firstName) +
|
|
1013
|
+
" " +
|
|
1014
|
+
capitalizeText(row?.lastName)
|
|
1015
|
+
}}
|
|
1016
|
+
</div>
|
|
1017
|
+
<div class="text-xs font-medium text-gray-900 leading-[normal]">
|
|
1018
|
+
{{ row?.referenceId }}
|
|
1019
|
+
</div>
|
|
922
1020
|
</div>
|
|
923
|
-
</
|
|
1021
|
+
</template>
|
|
1022
|
+
<template #[`item.activeUser`]="{ row, rowIndex }">
|
|
1023
|
+
{{ row?.activeUser?.user?.firstName }}
|
|
1024
|
+
{{ row?.activeUser?.user?.lastName }}
|
|
1025
|
+
</template>
|
|
1026
|
+
</EUITable>
|
|
1027
|
+
</div>
|
|
1028
|
+
</div>
|
|
1029
|
+
<div>
|
|
1030
|
+
<UTableview />
|
|
1031
|
+
<Delete />
|
|
1032
|
+
<EUIAccordion
|
|
1033
|
+
:datas="accordionData"
|
|
1034
|
+
:defaultOpen="[1]"
|
|
1035
|
+
:collapse="true"
|
|
1036
|
+
accordionStyle="separated"
|
|
1037
|
+
@update:activeItem="handleActiveItem"
|
|
1038
|
+
>
|
|
1039
|
+
<template #title="{ item }">
|
|
1040
|
+
<div>{{ item.title }}</div>
|
|
924
1041
|
</template>
|
|
925
|
-
<template #
|
|
926
|
-
|
|
927
|
-
|
|
1042
|
+
<template #right-icon="{ item }">
|
|
1043
|
+
<div
|
|
1044
|
+
:key="item"
|
|
1045
|
+
class="w-10 h-10 bg-red-100 border border-red-500 rounded-full"
|
|
1046
|
+
/>
|
|
928
1047
|
</template>
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
1048
|
+
<template #content="{ item }">
|
|
1049
|
+
<div>{{ item.content }}</div>
|
|
1050
|
+
</template>
|
|
1051
|
+
</EUIAccordion>
|
|
932
1052
|
</div>
|
|
933
1053
|
</div>
|
|
934
1054
|
</template>
|
|
@@ -944,7 +1064,10 @@ import EUITabs from "./tabs/EUITabs.vue";
|
|
|
944
1064
|
import EUITextarea from "./textArea/EUITextArea.vue";
|
|
945
1065
|
import EUISelectSearch from "./selectSearch/EUISelectSearch.vue";
|
|
946
1066
|
import EUITimeLine from "./timeLine/EUITimeLine.vue";
|
|
947
|
-
import {
|
|
1067
|
+
import {
|
|
1068
|
+
ArrowDownCircleIcon,
|
|
1069
|
+
MagnifyingGlassIcon,
|
|
1070
|
+
} from "@heroicons/vue/24/solid";
|
|
948
1071
|
import EUITag from "./tag/EUITag.vue";
|
|
949
1072
|
import EUIToggle from "./toggle/EUIToggle.vue";
|
|
950
1073
|
import EUILoader from "./loader/EUILoader.vue";
|
|
@@ -952,7 +1075,7 @@ import EUIAvatar from "./avatar/EUIAvatar.vue";
|
|
|
952
1075
|
import EUIStepperTimeline from "./stepperTimeline/EUIStepperTimeline.vue";
|
|
953
1076
|
import EUIAccordion from "./accordion/EUIAccordion.vue";
|
|
954
1077
|
import EUITelephone from "./telephone/EUITelephone.vue";
|
|
955
|
-
import { DevicePhoneMobileIcon, HomeIcon } from "@heroicons/vue/24/outline";
|
|
1078
|
+
import { DevicePhoneMobileIcon, ExclamationTriangleIcon, HomeIcon } from "@heroicons/vue/24/outline";
|
|
956
1079
|
import EUIDatepicker from "./datepicker/EUIDatepicker.vue";
|
|
957
1080
|
import EUIDashboardTable from "./table/EUIDashboardTable.vue";
|
|
958
1081
|
import tabData from "../data/tab";
|
|
@@ -964,22 +1087,28 @@ import {
|
|
|
964
1087
|
} from "../data/table";
|
|
965
1088
|
import EUITable from "./table/EUITable.vue";
|
|
966
1089
|
import { capitalizeText } from "../utils/lodash";
|
|
967
|
-
import ChevronDownStroke from
|
|
968
|
-
import EUIMultiDropdown from
|
|
1090
|
+
import ChevronDownStroke from "../assets/svg/ChevronDownStroke.vue";
|
|
1091
|
+
import EUIMultiDropdown from "./dropdown/EUIMultiDropdown.vue";
|
|
969
1092
|
import Delete from "./delete.vue";
|
|
970
|
-
import UTableview from
|
|
1093
|
+
import UTableview from "./table/UTableview.vue";
|
|
1094
|
+
import EUIAlerts from "./alerts/EUIAlerts.vue";
|
|
971
1095
|
|
|
972
1096
|
const mobileNumber = ref("+91 8667444951");
|
|
973
1097
|
const datepicker = ref(new Date());
|
|
974
|
-
const loading = ref(false)
|
|
1098
|
+
const loading = ref(false);
|
|
975
1099
|
|
|
976
1100
|
const form = reactive({
|
|
977
1101
|
input: "Lorem ipsum dolor sit",
|
|
978
1102
|
mobile: "+918667444951",
|
|
979
1103
|
});
|
|
980
1104
|
|
|
1105
|
+
const showAlert = ref(true);
|
|
1106
|
+
const onClickAlert = () => {
|
|
1107
|
+
alert("Alert action button clicked");
|
|
1108
|
+
};
|
|
1109
|
+
|
|
981
1110
|
//TODO: Dashboard Table
|
|
982
|
-
const selectedRows = ref([])
|
|
1111
|
+
const selectedRows = ref([]);
|
|
983
1112
|
const checkedRows = ref([]);
|
|
984
1113
|
const defaultSortOrder = ref("asc");
|
|
985
1114
|
const limit = ref(5);
|
|
@@ -1006,30 +1135,27 @@ const onSort = (field: string, order: string) => {
|
|
|
1006
1135
|
|
|
1007
1136
|
const onPageChange = (offsetData: number) => {
|
|
1008
1137
|
offset.value = offsetData;
|
|
1009
|
-
loading.value = true
|
|
1138
|
+
loading.value = true;
|
|
1010
1139
|
console.log("@changePage:", offsetData);
|
|
1011
|
-
|
|
1012
|
-
loading.value = false
|
|
1140
|
+
setTimeout(() => {
|
|
1141
|
+
loading.value = false;
|
|
1013
1142
|
}, 800);
|
|
1014
1143
|
};
|
|
1015
1144
|
|
|
1016
1145
|
// TODO: Multi dropdown menu clicked access
|
|
1017
|
-
const menubar = ref([
|
|
1018
|
-
{ text: "Students" },
|
|
1019
|
-
{ text: "Application" },
|
|
1020
|
-
])
|
|
1146
|
+
const menubar = ref([{ text: "Students" }, { text: "Application" }]);
|
|
1021
1147
|
|
|
1022
|
-
const handleMenuItem = (item:any) => {
|
|
1023
|
-
console.log(
|
|
1024
|
-
}
|
|
1148
|
+
const handleMenuItem = (item: any) => {
|
|
1149
|
+
console.log("Menu clicked:", item);
|
|
1150
|
+
};
|
|
1025
1151
|
|
|
1026
|
-
const addAction = (e:Event) => {
|
|
1027
|
-
console.log("Action Item clicked:" + e)
|
|
1028
|
-
}
|
|
1152
|
+
const addAction = (e: Event) => {
|
|
1153
|
+
console.log("Action Item clicked:" + e);
|
|
1154
|
+
};
|
|
1029
1155
|
|
|
1030
|
-
const handleSubMenuItem = (subItem:any) => {
|
|
1156
|
+
const handleSubMenuItem = (subItem: any) => {
|
|
1031
1157
|
console.log("Submenu item clicked:", subItem);
|
|
1032
|
-
}
|
|
1158
|
+
};
|
|
1033
1159
|
|
|
1034
1160
|
//TODO: TagModal
|
|
1035
1161
|
const tagModal = ref(false);
|
|
@@ -1049,9 +1175,9 @@ const openModal = () => {
|
|
|
1049
1175
|
};
|
|
1050
1176
|
|
|
1051
1177
|
// accordion active Index
|
|
1052
|
-
const handleActiveItem = (activeItems:number) => {
|
|
1053
|
-
console.log("Currently active accordion(s):", activeItems)
|
|
1054
|
-
}
|
|
1178
|
+
const handleActiveItem = (activeItems: number) => {
|
|
1179
|
+
console.log("Currently active accordion(s):", activeItems);
|
|
1180
|
+
};
|
|
1055
1181
|
|
|
1056
1182
|
//TODO: Select Data
|
|
1057
1183
|
const datas = ref([
|