@finema/core 1.4.71 → 1.4.72

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 (46) hide show
  1. package/README.md +63 -63
  2. package/dist/module.json +1 -1
  3. package/dist/module.mjs +1 -1
  4. package/dist/runtime/components/Alert.vue +48 -48
  5. package/dist/runtime/components/Avatar.vue +27 -27
  6. package/dist/runtime/components/Badge.vue +53 -53
  7. package/dist/runtime/components/Breadcrumb.vue +44 -44
  8. package/dist/runtime/components/Button/Group.vue +37 -37
  9. package/dist/runtime/components/Button/index.vue +76 -76
  10. package/dist/runtime/components/Card.vue +38 -38
  11. package/dist/runtime/components/Core.vue +13 -13
  12. package/dist/runtime/components/Dialog/index.vue +108 -108
  13. package/dist/runtime/components/Dropdown/index.vue +70 -70
  14. package/dist/runtime/components/Form/FieldWrapper.vue +23 -23
  15. package/dist/runtime/components/Form/Fields.vue +153 -153
  16. package/dist/runtime/components/Form/InputCheckbox/index.vue +21 -21
  17. package/dist/runtime/components/Form/InputDateTime/index.vue +60 -60
  18. package/dist/runtime/components/Form/InputRadio/index.vue +27 -27
  19. package/dist/runtime/components/Form/InputSelect/index.vue +36 -36
  20. package/dist/runtime/components/Form/InputStatic/index.vue +16 -16
  21. package/dist/runtime/components/Form/InputText/index.vue +54 -54
  22. package/dist/runtime/components/Form/InputTextarea/index.vue +25 -25
  23. package/dist/runtime/components/Form/InputToggle/index.vue +14 -14
  24. package/dist/runtime/components/Form/InputUploadDropzone/index.vue +158 -158
  25. package/dist/runtime/components/Form/InputUploadDropzoneAuto/index.vue +242 -242
  26. package/dist/runtime/components/Form/InputUploadFileClassic/index.vue +102 -102
  27. package/dist/runtime/components/Form/InputUploadFileClassicAuto/index.vue +166 -166
  28. package/dist/runtime/components/Form/index.vue +6 -6
  29. package/dist/runtime/components/Icon.vue +23 -23
  30. package/dist/runtime/components/Image.vue +36 -36
  31. package/dist/runtime/components/Loader.vue +14 -14
  32. package/dist/runtime/components/Modal/index.vue +146 -146
  33. package/dist/runtime/components/SimplePagination.vue +96 -96
  34. package/dist/runtime/components/Slideover/index.vue +110 -110
  35. package/dist/runtime/components/Table/Base.vue +139 -139
  36. package/dist/runtime/components/Table/ColumnDate.vue +16 -16
  37. package/dist/runtime/components/Table/ColumnDateTime.vue +18 -18
  38. package/dist/runtime/components/Table/ColumnImage.vue +15 -15
  39. package/dist/runtime/components/Table/ColumnNumber.vue +14 -14
  40. package/dist/runtime/components/Table/ColumnText.vue +25 -25
  41. package/dist/runtime/components/Table/Simple.vue +64 -64
  42. package/dist/runtime/components/Table/index.vue +60 -60
  43. package/dist/runtime/components/Tabs/index.vue +64 -64
  44. package/dist/runtime/composables/useForm.d.ts +2 -2
  45. package/dist/runtime/ui.css +32 -32
  46. package/package.json +88 -88
@@ -1,25 +1,25 @@
1
- <template>{{ getValue }}</template>
2
- <script lang="ts" setup>
3
- import { computed } from 'vue'
4
- import { type IColumn } from '#core/components/Table/types'
5
- import { StringHelper } from '#imports'
6
-
7
- const props = defineProps<{
8
- value: any
9
- row: any
10
- column: IColumn<{
11
- max?: number
12
- }>
13
- }>()
14
-
15
- const getValue = computed<string>(() => {
16
- const value = props.value
17
- const max = props.column.props?.max
18
-
19
- if (max) {
20
- return StringHelper.truncate(value, max)
21
- }
22
-
23
- return value ?? '-'
24
- })
25
- </script>
1
+ <template>{{ getValue }}</template>
2
+ <script lang="ts" setup>
3
+ import { computed } from 'vue'
4
+ import { type IColumn } from '#core/components/Table/types'
5
+ import { StringHelper } from '#imports'
6
+
7
+ const props = defineProps<{
8
+ value: any
9
+ row: any
10
+ column: IColumn<{
11
+ max?: number
12
+ }>
13
+ }>()
14
+
15
+ const getValue = computed<string>(() => {
16
+ const value = props.value
17
+ const max = props.column.props?.max
18
+
19
+ if (max) {
20
+ return StringHelper.truncate(value, max)
21
+ }
22
+
23
+ return value ?? '-'
24
+ })
25
+ </script>
@@ -1,64 +1,64 @@
1
- <template>
2
- <Base
3
- v-bind="$attrs"
4
- :columns="options.columns"
5
- :raw-data="itemsByPage"
6
- :status="options.status"
7
- :page-options="pageOptions"
8
- :is-simple-pagination="isShowSimplePagination"
9
- :is-hide-bottom-pagination="options.isHideBottomPagination"
10
- @page-change="onPageChange"
11
- >
12
- <template v-for="(_, slot) of $slots" #[slot]="slotProps">
13
- <slot :name="slot" v-bind="slotProps || {}" />
14
- </template>
15
- </Base>
16
- </template>
17
- <script lang="ts" setup>
18
- import { computed, type PropType, ref } from 'vue'
19
- import { type ISimpleTableOptions } from '#core/components/Table/types'
20
- import Base from '#core/components/Table/Base.vue'
21
- import { initPageOptions } from '#core/composables/loaderPage'
22
- import { useCoreConfig } from '#core/composables/useConfig'
23
-
24
- const props = defineProps({
25
- options: { type: Object as PropType<ISimpleTableOptions>, required: true },
26
- })
27
-
28
- const currentPage = ref(1)
29
- const coreConfig = useCoreConfig()
30
- const isShowSimplePagination = computed(
31
- (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
32
- )
33
-
34
- const pageOptions = computed(() => {
35
- if (!props.options?.limit) {
36
- return undefined
37
- }
38
-
39
- return {
40
- ...initPageOptions({
41
- limit: props.options.limit,
42
- primary: props.options.primary,
43
- }),
44
- totalCount: props.options.rawData.length,
45
- totalPage: Math.ceil(props.options.rawData.length / props.options.limit),
46
- currentPage: currentPage.value,
47
- }
48
- })
49
-
50
- const onPageChange = (page: number) => {
51
- currentPage.value = page
52
- }
53
-
54
- const itemsByPage = computed(() => {
55
- if (!pageOptions.value) {
56
- return props.options?.rawData
57
- }
58
-
59
- const start = (pageOptions.value.currentPage - 1) * pageOptions.value.limit
60
- const end = start + pageOptions.value.limit
61
-
62
- return props.options?.rawData.slice(start, end)
63
- })
64
- </script>
1
+ <template>
2
+ <Base
3
+ v-bind="$attrs"
4
+ :columns="options.columns"
5
+ :raw-data="itemsByPage"
6
+ :status="options.status"
7
+ :page-options="pageOptions"
8
+ :is-simple-pagination="isShowSimplePagination"
9
+ :is-hide-bottom-pagination="options.isHideBottomPagination"
10
+ @page-change="onPageChange"
11
+ >
12
+ <template v-for="(_, slot) of $slots" #[slot]="slotProps">
13
+ <slot :name="slot" v-bind="slotProps || {}" />
14
+ </template>
15
+ </Base>
16
+ </template>
17
+ <script lang="ts" setup>
18
+ import { computed, type PropType, ref } from 'vue'
19
+ import { type ISimpleTableOptions } from '#core/components/Table/types'
20
+ import Base from '#core/components/Table/Base.vue'
21
+ import { initPageOptions } from '#core/composables/loaderPage'
22
+ import { useCoreConfig } from '#core/composables/useConfig'
23
+
24
+ const props = defineProps({
25
+ options: { type: Object as PropType<ISimpleTableOptions>, required: true },
26
+ })
27
+
28
+ const currentPage = ref(1)
29
+ const coreConfig = useCoreConfig()
30
+ const isShowSimplePagination = computed(
31
+ (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
32
+ )
33
+
34
+ const pageOptions = computed(() => {
35
+ if (!props.options?.limit) {
36
+ return undefined
37
+ }
38
+
39
+ return {
40
+ ...initPageOptions({
41
+ limit: props.options.limit,
42
+ primary: props.options.primary,
43
+ }),
44
+ totalCount: props.options.rawData.length,
45
+ totalPage: Math.ceil(props.options.rawData.length / props.options.limit),
46
+ currentPage: currentPage.value,
47
+ }
48
+ })
49
+
50
+ const onPageChange = (page: number) => {
51
+ currentPage.value = page
52
+ }
53
+
54
+ const itemsByPage = computed(() => {
55
+ if (!pageOptions.value) {
56
+ return props.options?.rawData
57
+ }
58
+
59
+ const start = (pageOptions.value.currentPage - 1) * pageOptions.value.limit
60
+ const end = start + pageOptions.value.limit
61
+
62
+ return props.options?.rawData.slice(start, end)
63
+ })
64
+ </script>
@@ -1,60 +1,60 @@
1
- <template>
2
- <div>
3
- <div v-if="options.isEnabledSearch" class="mb-4 flex justify-end">
4
- <UInput
5
- v-model="q"
6
- icon="i-heroicons-magnifying-glass"
7
- :placeholder="options.searchPlaceholder || 'ค้นหา...'"
8
- />
9
- </div>
10
- <Base
11
- v-bind="$attrs"
12
- :columns="options.columns"
13
- :raw-data="options.rawData"
14
- :status="options.status"
15
- :page-options="options.pageOptions"
16
- :is-simple-pagination="isShowSimplePagination"
17
- :is-hide-bottom-pagination="options.isHideBottomPagination"
18
- @page-change="onPageChange"
19
- >
20
- <template v-for="(_, slot) of $slots" #[slot]="slotProps">
21
- <slot :name="slot" v-bind="slotProps || {}" />
22
- </template>
23
- </Base>
24
- </div>
25
- </template>
26
- <script lang="ts" setup>
27
- import { type PropType } from 'vue'
28
- import { type ITableOptions } from '#core/components/Table/types'
29
- import { _debounce, computed, ref, watch } from '#imports'
30
- import { useCoreConfig } from '#core/composables/useConfig'
31
- import Base from '#core/components/Table/Base.vue'
32
-
33
- const emits = defineEmits<{
34
- (event: 'pageChange', page: number): void
35
- (event: 'search', q: string): void
36
- }>()
37
-
38
- const props = defineProps({
39
- options: { type: Object as PropType<ITableOptions>, required: true },
40
- })
41
-
42
- const coreConfig = useCoreConfig()
43
-
44
- const q = ref(props.options?.pageOptions.search ?? '')
45
-
46
- const isShowSimplePagination = computed(
47
- (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
48
- )
49
-
50
- watch(
51
- q,
52
- _debounce((value) => {
53
- emits('search', value)
54
- }, 500)
55
- )
56
-
57
- const onPageChange = (page: number) => {
58
- emits('pageChange', page)
59
- }
60
- </script>
1
+ <template>
2
+ <div>
3
+ <div v-if="options.isEnabledSearch" class="mb-4 flex justify-end">
4
+ <UInput
5
+ v-model="q"
6
+ icon="i-heroicons-magnifying-glass"
7
+ :placeholder="options.searchPlaceholder || 'ค้นหา...'"
8
+ />
9
+ </div>
10
+ <Base
11
+ v-bind="$attrs"
12
+ :columns="options.columns"
13
+ :raw-data="options.rawData"
14
+ :status="options.status"
15
+ :page-options="options.pageOptions"
16
+ :is-simple-pagination="isShowSimplePagination"
17
+ :is-hide-bottom-pagination="options.isHideBottomPagination"
18
+ @page-change="onPageChange"
19
+ >
20
+ <template v-for="(_, slot) of $slots" #[slot]="slotProps">
21
+ <slot :name="slot" v-bind="slotProps || {}" />
22
+ </template>
23
+ </Base>
24
+ </div>
25
+ </template>
26
+ <script lang="ts" setup>
27
+ import { type PropType } from 'vue'
28
+ import { type ITableOptions } from '#core/components/Table/types'
29
+ import { _debounce, computed, ref, watch } from '#imports'
30
+ import { useCoreConfig } from '#core/composables/useConfig'
31
+ import Base from '#core/components/Table/Base.vue'
32
+
33
+ const emits = defineEmits<{
34
+ (event: 'pageChange', page: number): void
35
+ (event: 'search', q: string): void
36
+ }>()
37
+
38
+ const props = defineProps({
39
+ options: { type: Object as PropType<ITableOptions>, required: true },
40
+ })
41
+
42
+ const coreConfig = useCoreConfig()
43
+
44
+ const q = ref(props.options?.pageOptions.search ?? '')
45
+
46
+ const isShowSimplePagination = computed(
47
+ (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
48
+ )
49
+
50
+ watch(
51
+ q,
52
+ _debounce((value) => {
53
+ emits('search', value)
54
+ }, 500)
55
+ )
56
+
57
+ const onPageChange = (page: number) => {
58
+ emits('pageChange', page)
59
+ }
60
+ </script>
@@ -1,64 +1,64 @@
1
- <template>
2
- <UTabs
3
- v-bind="attrs"
4
- :model-value="modelValue"
5
- :class="$props.class"
6
- :items="items"
7
- :orientation="orientation"
8
- :default-index="defaultIndex"
9
- :ui="ui"
10
- @change="change"
11
- >
12
- <template #default="{ item, index, selected }">
13
- <slot name="default" :item="item" :index="index" :selected="selected" />
14
- </template>
15
-
16
- <template #item="{ item, index, selected }">
17
- <slot name="item" :item="item" :index="index" :selected="selected" />
18
- </template>
19
- </UTabs>
20
- </template>
21
-
22
- <script setup lang="ts">
23
- import { useUiConfig, type PropType, useUI, toRef } from '#imports'
24
- import { tabs } from '#core/ui.config'
25
- import type { Strategy, TabItem } from '#ui/types'
26
-
27
- const config = useUiConfig<typeof tabs>(tabs, 'tabs')
28
-
29
- const props = defineProps({
30
- modelValue: {
31
- type: Number,
32
- default: undefined,
33
- },
34
- items: {
35
- type: Array as PropType<TabItem[]>,
36
- default: () => [],
37
- },
38
- orientation: {
39
- type: String as PropType<'horizontal' | 'vertical'>,
40
- default: 'horizontal',
41
- validator: (value: string) => ['horizontal', 'vertical'].includes(value),
42
- },
43
- defaultIndex: {
44
- type: Number,
45
- default: 0,
46
- },
47
- class: {
48
- type: [String, Object, Array] as PropType<any>,
49
- default: () => '',
50
- },
51
- ui: {
52
- type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
53
- default: () => ({}),
54
- },
55
- })
56
-
57
- const emits = defineEmits(['update:modelValue', 'change'])
58
-
59
- const change = (index: number) => {
60
- emits('change', index)
61
- }
62
-
63
- const { ui, attrs } = useUI('tabs', toRef(props, 'ui'), config, toRef(props, 'class'))
64
- </script>
1
+ <template>
2
+ <UTabs
3
+ v-bind="attrs"
4
+ :model-value="modelValue"
5
+ :class="$props.class"
6
+ :items="items"
7
+ :orientation="orientation"
8
+ :default-index="defaultIndex"
9
+ :ui="ui"
10
+ @change="change"
11
+ >
12
+ <template #default="{ item, index, selected }">
13
+ <slot name="default" :item="item" :index="index" :selected="selected" />
14
+ </template>
15
+
16
+ <template #item="{ item, index, selected }">
17
+ <slot name="item" :item="item" :index="index" :selected="selected" />
18
+ </template>
19
+ </UTabs>
20
+ </template>
21
+
22
+ <script setup lang="ts">
23
+ import { useUiConfig, type PropType, useUI, toRef } from '#imports'
24
+ import { tabs } from '#core/ui.config'
25
+ import type { Strategy, TabItem } from '#ui/types'
26
+
27
+ const config = useUiConfig<typeof tabs>(tabs, 'tabs')
28
+
29
+ const props = defineProps({
30
+ modelValue: {
31
+ type: Number,
32
+ default: undefined,
33
+ },
34
+ items: {
35
+ type: Array as PropType<TabItem[]>,
36
+ default: () => [],
37
+ },
38
+ orientation: {
39
+ type: String as PropType<'horizontal' | 'vertical'>,
40
+ default: 'horizontal',
41
+ validator: (value: string) => ['horizontal', 'vertical'].includes(value),
42
+ },
43
+ defaultIndex: {
44
+ type: Number,
45
+ default: 0,
46
+ },
47
+ class: {
48
+ type: [String, Object, Array] as PropType<any>,
49
+ default: () => '',
50
+ },
51
+ ui: {
52
+ type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
53
+ default: () => ({}),
54
+ },
55
+ })
56
+
57
+ const emits = defineEmits(['update:modelValue', 'change'])
58
+
59
+ const change = (index: number) => {
60
+ emits('change', index)
61
+ }
62
+
63
+ const { ui, attrs } = useUI('tabs', toRef(props, 'ui'), config, toRef(props, 'class'))
64
+ </script>
@@ -1,9 +1,9 @@
1
1
  import { type ComputedRef } from 'vue';
2
2
  import { type FieldContext, type FieldOptions } from 'vee-validate';
3
- import { type IFieldProps } from '../components/Form/types';
3
+ import { type IFieldProps, type IFormField } from '../components/Form/types';
4
4
  interface IFieldContext<TValue> extends FieldContext<TValue> {
5
5
  wrapperProps: ComputedRef<IFieldProps>;
6
6
  }
7
7
  export declare const useFieldHOC: <TValue = unknown>(newFormProps: IFieldProps, opts?: Partial<FieldOptions<TValue>> | undefined) => IFieldContext<TValue>;
8
- export declare const createFormFields: <T extends unknown>(fields: () => T[]) => ComputedRef<T[]>;
8
+ export declare const createFormFields: (fields: () => IFormField[]) => any;
9
9
  export {};
@@ -1,32 +1,32 @@
1
- :root {
2
- --dp-font-family: inherit !important;
3
- }
4
-
5
- .dp__theme_light {
6
- --dp-primary-color: rgb(var(--color-primary-DEFAULT)) !important;
7
- --dp-primary-disabled-color: rgb(var(--color-primary-200)) !important;
8
- }
9
-
10
- ::-webkit-scrollbar {
11
- -webkit-appearance: none;
12
- width: 10px;
13
- height: 10px;
14
- }
15
-
16
- ::-webkit-scrollbar-thumb {
17
- border-radius: 4px;
18
- background-color: rgb(0 0 0 / 30%);
19
- box-shadow: 0 0 1px rgb(255 255 255 / 50%);
20
- }
21
-
22
-
23
- html,
24
- body,
25
- #__nuxt,
26
- #__layout,
27
- .root-container {
28
- height: 100%;
29
- display: flex;
30
- flex-direction: column;
31
- }
32
-
1
+ :root {
2
+ --dp-font-family: inherit !important;
3
+ }
4
+
5
+ .dp__theme_light {
6
+ --dp-primary-color: rgb(var(--color-primary-DEFAULT)) !important;
7
+ --dp-primary-disabled-color: rgb(var(--color-primary-200)) !important;
8
+ }
9
+
10
+ ::-webkit-scrollbar {
11
+ -webkit-appearance: none;
12
+ width: 10px;
13
+ height: 10px;
14
+ }
15
+
16
+ ::-webkit-scrollbar-thumb {
17
+ border-radius: 4px;
18
+ background-color: rgb(0 0 0 / 30%);
19
+ box-shadow: 0 0 1px rgb(255 255 255 / 50%);
20
+ }
21
+
22
+
23
+ html,
24
+ body,
25
+ #__nuxt,
26
+ #__layout,
27
+ .root-container {
28
+ height: 100%;
29
+ display: flex;
30
+ flex-direction: column;
31
+ }
32
+