@finema/finework-layer 0.2.68 → 0.2.69
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/.husky/pre-commit +1 -1
- package/.playground/app/pages/layout-admin/[id]/index.vue +145 -145
- package/.playground/app/pages/layout-admin/test/[id]/index.vue +286 -286
- package/.playground/app/pages/layout-admin.vue +275 -275
- package/.playground/app/pages/submenu/layout-admin.vue +210 -210
- package/CHANGELOG.md +342 -340
- package/app/app.config.ts +136 -136
- package/app/app.vue +10 -10
- package/app/assets/css/main.css +75 -75
- package/app/components/Button/ActionIcon.vue +29 -29
- package/app/components/Button/Back.vue +22 -22
- package/app/components/InfoItemList.vue +196 -196
- package/app/components/Layout/Admin/Sidebar.vue +329 -329
- package/app/components/Layout/Admin/index.vue +224 -224
- package/app/components/Layout/Apps.vue +45 -45
- package/app/components/Layout/User/index.vue +99 -99
- package/app/components/StatusBox.vue +56 -56
- package/app/composables/useRequestOptions.ts +50 -50
- package/app/constants/routes.ts +86 -86
- package/app/error.vue +218 -218
- package/app/middleware/auth.ts +45 -45
- package/app/middleware/common.ts +12 -12
- package/app/middleware/guest.ts +7 -7
- package/app/middleware/permissions.ts +29 -29
- package/bun.lock +2 -2
- package/index.d.ts +16 -16
- package/nuxt.config.ts +41 -41
- package/package.json +2 -2
package/app/app.config.ts
CHANGED
|
@@ -1,136 +1,136 @@
|
|
|
1
|
-
export default defineAppConfig({
|
|
2
|
-
core: {
|
|
3
|
-
is_thai_year: true,
|
|
4
|
-
is_thai_month: true,
|
|
5
|
-
date_format: 'dd MMM yyyy',
|
|
6
|
-
month_format: 'MMM yyyy',
|
|
7
|
-
date_time_format: 'dd MMM yyyy HH:mm',
|
|
8
|
-
color: '#335AFF',
|
|
9
|
-
limit_per_page: 10,
|
|
10
|
-
locale: 'en',
|
|
11
|
-
},
|
|
12
|
-
ui: {
|
|
13
|
-
dialog: {
|
|
14
|
-
slots: {
|
|
15
|
-
base: [
|
|
16
|
-
'bg-[url(/dialog-bg.png)] bg-no-repeat bg-top-left bg-size-[220px]',
|
|
17
|
-
],
|
|
18
|
-
},
|
|
19
|
-
},
|
|
20
|
-
|
|
21
|
-
card: {
|
|
22
|
-
variants: {
|
|
23
|
-
variant: {
|
|
24
|
-
soft: {
|
|
25
|
-
root: 'bg-elevated/50 divide-y divide-default',
|
|
26
|
-
},
|
|
27
|
-
},
|
|
28
|
-
},
|
|
29
|
-
defaultVariants: {
|
|
30
|
-
variant: 'soft',
|
|
31
|
-
},
|
|
32
|
-
|
|
33
|
-
},
|
|
34
|
-
tabs: {
|
|
35
|
-
slots: {
|
|
36
|
-
list: 'p-0 ',
|
|
37
|
-
label: ' font-bold ',
|
|
38
|
-
leadingIcon: 'hover:!text-primary',
|
|
39
|
-
},
|
|
40
|
-
variants: {
|
|
41
|
-
variant: {
|
|
42
|
-
pill: {
|
|
43
|
-
list: 'bg-white rounded-sm',
|
|
44
|
-
trigger: 'grow',
|
|
45
|
-
indicator: 'rounded-md shadow-xs',
|
|
46
|
-
},
|
|
47
|
-
link: {
|
|
48
|
-
list: 'border-default',
|
|
49
|
-
indicator: 'rounded-none',
|
|
50
|
-
trigger: 'focus:outline-none',
|
|
51
|
-
},
|
|
52
|
-
},
|
|
53
|
-
orientation: {
|
|
54
|
-
horizontal: {
|
|
55
|
-
root: 'flex-col',
|
|
56
|
-
list: 'w-full ',
|
|
57
|
-
indicator: 'left-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position) ',
|
|
58
|
-
trigger: 'justify-center ',
|
|
59
|
-
},
|
|
60
|
-
vertical: {
|
|
61
|
-
list: 'flex-col',
|
|
62
|
-
trigger: '!px-3 py-2 text-sm gap-3',
|
|
63
|
-
indicator: 'top-0 h-(--reka-tabs-indicator-size) translate-y-(--reka-tabs-indicator-position) ',
|
|
64
|
-
},
|
|
65
|
-
},
|
|
66
|
-
size: {
|
|
67
|
-
lg: {
|
|
68
|
-
trigger: 'px-4 py-2 text-sm gap-3',
|
|
69
|
-
leadingIcon: 'size-6',
|
|
70
|
-
leadingAvatarSize: '2xs',
|
|
71
|
-
},
|
|
72
|
-
},
|
|
73
|
-
},
|
|
74
|
-
compoundVariants: [
|
|
75
|
-
{
|
|
76
|
-
orientation: 'horizontal',
|
|
77
|
-
variant: 'pill',
|
|
78
|
-
class: {
|
|
79
|
-
root: ' px-4 py-2 bg-white rounded-xl',
|
|
80
|
-
indicator: 'inset-y-5 ',
|
|
81
|
-
label: 'text-[#344054]',
|
|
82
|
-
trigger: 'data-[state=active]:bg-[#F9FAFB]',
|
|
83
|
-
},
|
|
84
|
-
},
|
|
85
|
-
{
|
|
86
|
-
orientation: 'vertical',
|
|
87
|
-
variant: 'pill',
|
|
88
|
-
class: {
|
|
89
|
-
indicator: 'inset-x-1',
|
|
90
|
-
list: 'items-center gap-3 xl:gap-5',
|
|
91
|
-
root: 'p-4 bg-white rounded-xl',
|
|
92
|
-
label: 'text-[#344054]',
|
|
93
|
-
trigger: 'data-[state=active]:bg-[#F9FAFB]',
|
|
94
|
-
},
|
|
95
|
-
},
|
|
96
|
-
{
|
|
97
|
-
orientation: 'horizontal',
|
|
98
|
-
variant: 'link',
|
|
99
|
-
class: {
|
|
100
|
-
list: 'border-b -mb-px',
|
|
101
|
-
indicator: '-bottom-px h-px',
|
|
102
|
-
trigger: 'data-[state=active]:text-primary ',
|
|
103
|
-
},
|
|
104
|
-
},
|
|
105
|
-
{
|
|
106
|
-
orientation: 'vertical',
|
|
107
|
-
variant: 'link',
|
|
108
|
-
class: {
|
|
109
|
-
list: 'border-none -ms-px gap-1',
|
|
110
|
-
indicator: '-start-px w-px !w-[2px] !left-[-2px]',
|
|
111
|
-
},
|
|
112
|
-
},
|
|
113
|
-
{
|
|
114
|
-
color: 'primary',
|
|
115
|
-
variant: 'pill',
|
|
116
|
-
class: {
|
|
117
|
-
indicator: 'bg-[#F9FAFB]',
|
|
118
|
-
trigger: 'data-[state=active]:text-primary',
|
|
119
|
-
},
|
|
120
|
-
},
|
|
121
|
-
|
|
122
|
-
],
|
|
123
|
-
defaultVariants: {
|
|
124
|
-
color: 'primary',
|
|
125
|
-
variant: 'pill',
|
|
126
|
-
size: 'lg',
|
|
127
|
-
},
|
|
128
|
-
},
|
|
129
|
-
table: {
|
|
130
|
-
slots: {
|
|
131
|
-
th: 'text-[#222222] whitespace-nowrap border-r border-[#EAECF0] last:border-0 bg-[#F9FAFB]',
|
|
132
|
-
td: 'text-[#222222] border-r border-[#EAECF0] last:border-0',
|
|
133
|
-
},
|
|
134
|
-
},
|
|
135
|
-
},
|
|
136
|
-
})
|
|
1
|
+
export default defineAppConfig({
|
|
2
|
+
core: {
|
|
3
|
+
is_thai_year: true,
|
|
4
|
+
is_thai_month: true,
|
|
5
|
+
date_format: 'dd MMM yyyy',
|
|
6
|
+
month_format: 'MMM yyyy',
|
|
7
|
+
date_time_format: 'dd MMM yyyy HH:mm',
|
|
8
|
+
color: '#335AFF',
|
|
9
|
+
limit_per_page: 10,
|
|
10
|
+
locale: 'en',
|
|
11
|
+
},
|
|
12
|
+
ui: {
|
|
13
|
+
dialog: {
|
|
14
|
+
slots: {
|
|
15
|
+
base: [
|
|
16
|
+
'bg-[url(/dialog-bg.png)] bg-no-repeat bg-top-left bg-size-[220px]',
|
|
17
|
+
],
|
|
18
|
+
},
|
|
19
|
+
},
|
|
20
|
+
|
|
21
|
+
card: {
|
|
22
|
+
variants: {
|
|
23
|
+
variant: {
|
|
24
|
+
soft: {
|
|
25
|
+
root: 'bg-elevated/50 divide-y divide-default',
|
|
26
|
+
},
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
defaultVariants: {
|
|
30
|
+
variant: 'soft',
|
|
31
|
+
},
|
|
32
|
+
|
|
33
|
+
},
|
|
34
|
+
tabs: {
|
|
35
|
+
slots: {
|
|
36
|
+
list: 'p-0 ',
|
|
37
|
+
label: ' font-bold ',
|
|
38
|
+
leadingIcon: 'hover:!text-primary',
|
|
39
|
+
},
|
|
40
|
+
variants: {
|
|
41
|
+
variant: {
|
|
42
|
+
pill: {
|
|
43
|
+
list: 'bg-white rounded-sm',
|
|
44
|
+
trigger: 'grow',
|
|
45
|
+
indicator: 'rounded-md shadow-xs',
|
|
46
|
+
},
|
|
47
|
+
link: {
|
|
48
|
+
list: 'border-default',
|
|
49
|
+
indicator: 'rounded-none',
|
|
50
|
+
trigger: 'focus:outline-none',
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
orientation: {
|
|
54
|
+
horizontal: {
|
|
55
|
+
root: 'flex-col',
|
|
56
|
+
list: 'w-full ',
|
|
57
|
+
indicator: 'left-0 w-(--reka-tabs-indicator-size) translate-x-(--reka-tabs-indicator-position) ',
|
|
58
|
+
trigger: 'justify-center ',
|
|
59
|
+
},
|
|
60
|
+
vertical: {
|
|
61
|
+
list: 'flex-col',
|
|
62
|
+
trigger: '!px-3 py-2 text-sm gap-3',
|
|
63
|
+
indicator: 'top-0 h-(--reka-tabs-indicator-size) translate-y-(--reka-tabs-indicator-position) ',
|
|
64
|
+
},
|
|
65
|
+
},
|
|
66
|
+
size: {
|
|
67
|
+
lg: {
|
|
68
|
+
trigger: 'px-4 py-2 text-sm gap-3',
|
|
69
|
+
leadingIcon: 'size-6',
|
|
70
|
+
leadingAvatarSize: '2xs',
|
|
71
|
+
},
|
|
72
|
+
},
|
|
73
|
+
},
|
|
74
|
+
compoundVariants: [
|
|
75
|
+
{
|
|
76
|
+
orientation: 'horizontal',
|
|
77
|
+
variant: 'pill',
|
|
78
|
+
class: {
|
|
79
|
+
root: ' px-4 py-2 bg-white rounded-xl',
|
|
80
|
+
indicator: 'inset-y-5 ',
|
|
81
|
+
label: 'text-[#344054]',
|
|
82
|
+
trigger: 'data-[state=active]:bg-[#F9FAFB]',
|
|
83
|
+
},
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
orientation: 'vertical',
|
|
87
|
+
variant: 'pill',
|
|
88
|
+
class: {
|
|
89
|
+
indicator: 'inset-x-1',
|
|
90
|
+
list: 'items-center gap-3 xl:gap-5',
|
|
91
|
+
root: 'p-4 bg-white rounded-xl',
|
|
92
|
+
label: 'text-[#344054]',
|
|
93
|
+
trigger: 'data-[state=active]:bg-[#F9FAFB]',
|
|
94
|
+
},
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
orientation: 'horizontal',
|
|
98
|
+
variant: 'link',
|
|
99
|
+
class: {
|
|
100
|
+
list: 'border-b -mb-px',
|
|
101
|
+
indicator: '-bottom-px h-px',
|
|
102
|
+
trigger: 'data-[state=active]:text-primary ',
|
|
103
|
+
},
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
orientation: 'vertical',
|
|
107
|
+
variant: 'link',
|
|
108
|
+
class: {
|
|
109
|
+
list: 'border-none -ms-px gap-1',
|
|
110
|
+
indicator: '-start-px w-px !w-[2px] !left-[-2px]',
|
|
111
|
+
},
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
color: 'primary',
|
|
115
|
+
variant: 'pill',
|
|
116
|
+
class: {
|
|
117
|
+
indicator: 'bg-[#F9FAFB]',
|
|
118
|
+
trigger: 'data-[state=active]:text-primary',
|
|
119
|
+
},
|
|
120
|
+
},
|
|
121
|
+
|
|
122
|
+
],
|
|
123
|
+
defaultVariants: {
|
|
124
|
+
color: 'primary',
|
|
125
|
+
variant: 'pill',
|
|
126
|
+
size: 'lg',
|
|
127
|
+
},
|
|
128
|
+
},
|
|
129
|
+
table: {
|
|
130
|
+
slots: {
|
|
131
|
+
th: 'text-[#222222] whitespace-nowrap border-r border-[#EAECF0] last:border-0 bg-[#F9FAFB]',
|
|
132
|
+
td: 'text-[#222222] border-r border-[#EAECF0] last:border-0',
|
|
133
|
+
},
|
|
134
|
+
},
|
|
135
|
+
},
|
|
136
|
+
})
|
package/app/app.vue
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<App
|
|
3
|
-
:toaster="{
|
|
4
|
-
position: 'top-right',
|
|
5
|
-
progress: false,
|
|
6
|
-
}"
|
|
7
|
-
>
|
|
8
|
-
<NuxtPage />
|
|
9
|
-
</App>
|
|
10
|
-
</template>
|
|
1
|
+
<template>
|
|
2
|
+
<App
|
|
3
|
+
:toaster="{
|
|
4
|
+
position: 'top-right',
|
|
5
|
+
progress: false,
|
|
6
|
+
}"
|
|
7
|
+
>
|
|
8
|
+
<NuxtPage />
|
|
9
|
+
</App>
|
|
10
|
+
</template>
|
package/app/assets/css/main.css
CHANGED
|
@@ -1,76 +1,76 @@
|
|
|
1
|
-
@import "tailwindcss";
|
|
2
|
-
|
|
3
|
-
@theme static{
|
|
4
|
-
--color-main: #1570EF;
|
|
5
|
-
--color-main-50: #EFF8FF;
|
|
6
|
-
--color-main-100: #D1E9FF;
|
|
7
|
-
--color-main-200: #B2DDFF;
|
|
8
|
-
--color-main-300: #84CAFF;
|
|
9
|
-
--color-main-400: #53B1FD;
|
|
10
|
-
--color-main-500: #2E90FA;
|
|
11
|
-
--color-main-600: #1570EF;
|
|
12
|
-
--color-main-700: #175CD3;
|
|
13
|
-
--color-main-800: #1849A9;
|
|
14
|
-
--color-main-900: #194185;
|
|
15
|
-
--color-main-950: #102A56;
|
|
16
|
-
|
|
17
|
-
--color-warning: #DC6803;
|
|
18
|
-
--color-warning-50: #FFFAEB;
|
|
19
|
-
--color-warning-100: #FEF0C7;
|
|
20
|
-
--color-warning-200: #FEDF89;
|
|
21
|
-
--color-warning-300: #FEC84B;
|
|
22
|
-
--color-warning-400: #FDB022;
|
|
23
|
-
--color-warning-500: #F79009;
|
|
24
|
-
--color-warning-600: #DC6803;
|
|
25
|
-
--color-warning-700: #B54708;
|
|
26
|
-
--color-warning-800: #93370D;
|
|
27
|
-
--color-warning-900: #7A2E0E;
|
|
28
|
-
--color-warning-950: #4E1D09;
|
|
29
|
-
|
|
30
|
-
--color-success: #079455;
|
|
31
|
-
--color-success-50: #ECFDF3;
|
|
32
|
-
--color-success-100: #DCFAE6;
|
|
33
|
-
--color-success-200: #ABEFC6;
|
|
34
|
-
--color-success-300: #75E0A7;
|
|
35
|
-
--color-success-400: #47CD89;
|
|
36
|
-
--color-success-500: #17B26A;
|
|
37
|
-
--color-success-600: #079455;
|
|
38
|
-
--color-success-700: #067647;
|
|
39
|
-
--color-success-800: #085D3A;
|
|
40
|
-
--color-success-900: #074D31;
|
|
41
|
-
--color-success-950: #053321;
|
|
42
|
-
|
|
43
|
-
--color-error: #AF1738;
|
|
44
|
-
--color-error-50: #FEF3F2;
|
|
45
|
-
--color-error-100: #FEE4E2;
|
|
46
|
-
--color-error-200: #FECDCA;
|
|
47
|
-
--color-error-300: #FDA29B;
|
|
48
|
-
--color-error-400: #F97066;
|
|
49
|
-
--color-error-500: #F04438;
|
|
50
|
-
--color-error-600: #D92D20;
|
|
51
|
-
--color-error-700: #B42318;
|
|
52
|
-
--color-error-800: #912018;
|
|
53
|
-
--color-error-900: #7A271A;
|
|
54
|
-
--color-error-950: #55160C;
|
|
55
|
-
|
|
56
|
-
--color-gray: #475467;
|
|
57
|
-
--color-gray-50: #F9FAFB;
|
|
58
|
-
--color-gray-100: #F2F4F7;
|
|
59
|
-
--color-gray-200: #EAECF0;
|
|
60
|
-
--color-gray-300: #D0D5DD;
|
|
61
|
-
--color-gray-400: #98A2B3;
|
|
62
|
-
--color-gray-500: #667085;
|
|
63
|
-
--color-gray-600: #475467;
|
|
64
|
-
--color-gray-700: #344054;
|
|
65
|
-
--color-gray-800: #182230;
|
|
66
|
-
--color-gray-900: #101828;
|
|
67
|
-
--color-gray-950: #0C111D;
|
|
68
|
-
}
|
|
69
|
-
:root {
|
|
70
|
-
--color-background: var(--color-gray-50);
|
|
71
|
-
--ui-primary: var(--color-main-600);
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
body {
|
|
75
|
-
@apply bg-[var(--color-background)];
|
|
1
|
+
@import "tailwindcss";
|
|
2
|
+
|
|
3
|
+
@theme static{
|
|
4
|
+
--color-main: #1570EF;
|
|
5
|
+
--color-main-50: #EFF8FF;
|
|
6
|
+
--color-main-100: #D1E9FF;
|
|
7
|
+
--color-main-200: #B2DDFF;
|
|
8
|
+
--color-main-300: #84CAFF;
|
|
9
|
+
--color-main-400: #53B1FD;
|
|
10
|
+
--color-main-500: #2E90FA;
|
|
11
|
+
--color-main-600: #1570EF;
|
|
12
|
+
--color-main-700: #175CD3;
|
|
13
|
+
--color-main-800: #1849A9;
|
|
14
|
+
--color-main-900: #194185;
|
|
15
|
+
--color-main-950: #102A56;
|
|
16
|
+
|
|
17
|
+
--color-warning: #DC6803;
|
|
18
|
+
--color-warning-50: #FFFAEB;
|
|
19
|
+
--color-warning-100: #FEF0C7;
|
|
20
|
+
--color-warning-200: #FEDF89;
|
|
21
|
+
--color-warning-300: #FEC84B;
|
|
22
|
+
--color-warning-400: #FDB022;
|
|
23
|
+
--color-warning-500: #F79009;
|
|
24
|
+
--color-warning-600: #DC6803;
|
|
25
|
+
--color-warning-700: #B54708;
|
|
26
|
+
--color-warning-800: #93370D;
|
|
27
|
+
--color-warning-900: #7A2E0E;
|
|
28
|
+
--color-warning-950: #4E1D09;
|
|
29
|
+
|
|
30
|
+
--color-success: #079455;
|
|
31
|
+
--color-success-50: #ECFDF3;
|
|
32
|
+
--color-success-100: #DCFAE6;
|
|
33
|
+
--color-success-200: #ABEFC6;
|
|
34
|
+
--color-success-300: #75E0A7;
|
|
35
|
+
--color-success-400: #47CD89;
|
|
36
|
+
--color-success-500: #17B26A;
|
|
37
|
+
--color-success-600: #079455;
|
|
38
|
+
--color-success-700: #067647;
|
|
39
|
+
--color-success-800: #085D3A;
|
|
40
|
+
--color-success-900: #074D31;
|
|
41
|
+
--color-success-950: #053321;
|
|
42
|
+
|
|
43
|
+
--color-error: #AF1738;
|
|
44
|
+
--color-error-50: #FEF3F2;
|
|
45
|
+
--color-error-100: #FEE4E2;
|
|
46
|
+
--color-error-200: #FECDCA;
|
|
47
|
+
--color-error-300: #FDA29B;
|
|
48
|
+
--color-error-400: #F97066;
|
|
49
|
+
--color-error-500: #F04438;
|
|
50
|
+
--color-error-600: #D92D20;
|
|
51
|
+
--color-error-700: #B42318;
|
|
52
|
+
--color-error-800: #912018;
|
|
53
|
+
--color-error-900: #7A271A;
|
|
54
|
+
--color-error-950: #55160C;
|
|
55
|
+
|
|
56
|
+
--color-gray: #475467;
|
|
57
|
+
--color-gray-50: #F9FAFB;
|
|
58
|
+
--color-gray-100: #F2F4F7;
|
|
59
|
+
--color-gray-200: #EAECF0;
|
|
60
|
+
--color-gray-300: #D0D5DD;
|
|
61
|
+
--color-gray-400: #98A2B3;
|
|
62
|
+
--color-gray-500: #667085;
|
|
63
|
+
--color-gray-600: #475467;
|
|
64
|
+
--color-gray-700: #344054;
|
|
65
|
+
--color-gray-800: #182230;
|
|
66
|
+
--color-gray-900: #101828;
|
|
67
|
+
--color-gray-950: #0C111D;
|
|
68
|
+
}
|
|
69
|
+
:root {
|
|
70
|
+
--color-background: var(--color-gray-50);
|
|
71
|
+
--ui-primary: var(--color-main-600);
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
body {
|
|
75
|
+
@apply bg-[var(--color-background)];
|
|
76
76
|
}
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<Button
|
|
3
|
-
size="lg"
|
|
4
|
-
variant="ghost"
|
|
5
|
-
:icon="icon"
|
|
6
|
-
:color="color"
|
|
7
|
-
square
|
|
8
|
-
:disabled="disabled"
|
|
9
|
-
:loading="loading"
|
|
10
|
-
:to="to"
|
|
11
|
-
@click="$emit('click')"
|
|
12
|
-
/>
|
|
13
|
-
</template>
|
|
14
|
-
|
|
15
|
-
<script lang="ts" setup>
|
|
16
|
-
defineEmits<{
|
|
17
|
-
(e: 'click'): void
|
|
18
|
-
}>()
|
|
19
|
-
|
|
20
|
-
withDefaults(defineProps<{
|
|
21
|
-
to?: string
|
|
22
|
-
icon: string
|
|
23
|
-
color?: 'neutral' | 'error' | 'primary' | 'success' | 'warning' | 'info'
|
|
24
|
-
disabled?: boolean
|
|
25
|
-
loading?: boolean
|
|
26
|
-
}>(), {
|
|
27
|
-
color: 'neutral',
|
|
28
|
-
})
|
|
29
|
-
</script>
|
|
1
|
+
<template>
|
|
2
|
+
<Button
|
|
3
|
+
size="lg"
|
|
4
|
+
variant="ghost"
|
|
5
|
+
:icon="icon"
|
|
6
|
+
:color="color"
|
|
7
|
+
square
|
|
8
|
+
:disabled="disabled"
|
|
9
|
+
:loading="loading"
|
|
10
|
+
:to="to"
|
|
11
|
+
@click="$emit('click')"
|
|
12
|
+
/>
|
|
13
|
+
</template>
|
|
14
|
+
|
|
15
|
+
<script lang="ts" setup>
|
|
16
|
+
defineEmits<{
|
|
17
|
+
(e: 'click'): void
|
|
18
|
+
}>()
|
|
19
|
+
|
|
20
|
+
withDefaults(defineProps<{
|
|
21
|
+
to?: string
|
|
22
|
+
icon: string
|
|
23
|
+
color?: 'neutral' | 'error' | 'primary' | 'success' | 'warning' | 'info'
|
|
24
|
+
disabled?: boolean
|
|
25
|
+
loading?: boolean
|
|
26
|
+
}>(), {
|
|
27
|
+
color: 'neutral',
|
|
28
|
+
})
|
|
29
|
+
</script>
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<Button
|
|
3
|
-
icon="ph:caret-left"
|
|
4
|
-
variant="outline"
|
|
5
|
-
color="neutral"
|
|
6
|
-
:to="to"
|
|
7
|
-
@click="$emit('click')"
|
|
8
|
-
>
|
|
9
|
-
{{ label || 'กลับ' }}
|
|
10
|
-
</Button>
|
|
11
|
-
</template>
|
|
12
|
-
|
|
13
|
-
<script lang="ts" setup>
|
|
14
|
-
defineEmits<{
|
|
15
|
-
(e: 'click'): void
|
|
16
|
-
}>()
|
|
17
|
-
|
|
18
|
-
defineProps<{
|
|
19
|
-
to?: string
|
|
20
|
-
label?: string
|
|
21
|
-
}>()
|
|
22
|
-
</script>
|
|
1
|
+
<template>
|
|
2
|
+
<Button
|
|
3
|
+
icon="ph:caret-left"
|
|
4
|
+
variant="outline"
|
|
5
|
+
color="neutral"
|
|
6
|
+
:to="to"
|
|
7
|
+
@click="$emit('click')"
|
|
8
|
+
>
|
|
9
|
+
{{ label || 'กลับ' }}
|
|
10
|
+
</Button>
|
|
11
|
+
</template>
|
|
12
|
+
|
|
13
|
+
<script lang="ts" setup>
|
|
14
|
+
defineEmits<{
|
|
15
|
+
(e: 'click'): void
|
|
16
|
+
}>()
|
|
17
|
+
|
|
18
|
+
defineProps<{
|
|
19
|
+
to?: string
|
|
20
|
+
label?: string
|
|
21
|
+
}>()
|
|
22
|
+
</script>
|