bfg-common 1.5.632 → 1.5.633

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 (86) hide show
  1. package/CODE_STYLE.md +109 -109
  2. package/assets/img/icons/icons-sprite-dark-3.svg +227 -227
  3. package/assets/img/icons/icons-sprite-dark-5.svg +488 -488
  4. package/assets/img/icons/icons-sprite-light-3.svg +227 -227
  5. package/assets/img/icons/icons-sprite-light-5.svg +488 -488
  6. package/components/atoms/TheIcon3.vue +50 -50
  7. package/components/atoms/collapse/CollapseNav.vue +170 -170
  8. package/components/atoms/perPage/PerPage.vue +58 -58
  9. package/components/atoms/table/dataGrid/DataGrid.vue +1718 -1718
  10. package/components/atoms/table/dataGrid/DataGridPagination.vue +97 -97
  11. package/components/atoms/table/dataGrid/lib/config/settingsTable.ts +94 -94
  12. package/components/atoms/table/dataGrid/lib/utils/export.ts +16 -16
  13. package/components/common/backup/storage/actions/add/lib/utils.ts +51 -51
  14. package/components/common/browse/blocks/contents/filesNew/Skeleton.vue +18 -18
  15. package/components/common/diagramMain/modals/lib/config/portModal.ts +251 -251
  16. package/components/common/diagramMain/modals/lib/config/vCenterModal.ts +48 -48
  17. package/components/common/diagramMain/port/Port.vue +580 -580
  18. package/components/common/layout/theHeader/helpMenu/About.vue +79 -79
  19. package/components/common/layout/theHeader/helpMenu/aboutOld/AboutOld.vue +79 -79
  20. package/components/common/monitor/overview/filters/Filters.vue +169 -170
  21. package/components/common/pages/backups/DetailView.vue +52 -52
  22. package/components/common/pages/backups/lib/models/interfaces.ts +36 -36
  23. package/components/common/pages/backups/modals/Modals.vue +243 -243
  24. package/components/common/pages/backups/modals/createBackup/configuration/maxBandwidth/lib/config/options.ts +6 -6
  25. package/components/common/pages/backups/modals/createBackup/lib/config/readyToCompleteOptions.ts +69 -69
  26. package/components/common/pages/backups/modals/lib/config/restore.ts +115 -115
  27. package/components/common/pages/backups/modals/lib/models/interfaces.ts +186 -186
  28. package/components/common/pages/backups/modals/restore/name/lib/models/interfaces.ts +6 -6
  29. package/components/common/pages/home/lib/models/interfaces.ts +48 -48
  30. package/components/common/pages/home/widgets/hosts/Hosts.vue +27 -27
  31. package/components/common/pages/home/widgets/hosts/lib/config/items.ts +23 -23
  32. package/components/common/pages/home/widgets/vms/VmsOld.vue +35 -35
  33. package/components/common/pages/home/widgets/vms/lib/config/items.ts +19 -19
  34. package/components/common/pages/scheduledTasks/lib/utils/utils.ts +84 -84
  35. package/components/common/readyToComplete/ReadyToComplete.vue +17 -17
  36. package/components/common/select/radio/RadioGroup.vue +137 -137
  37. package/components/common/spiceConsole/Drawer.vue +420 -420
  38. package/components/common/spiceConsole/SpiceConsole.vue +184 -184
  39. package/components/common/spiceConsole/lib/models/interfaces.ts +5 -5
  40. package/components/common/tools/Actions.vue +207 -207
  41. package/components/common/treeView/TreeView.vue +52 -52
  42. package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/lib/config/options.ts +28 -28
  43. package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/Memory.vue +283 -283
  44. package/components/common/vm/actions/common/select/compatibility/Old.vue +107 -107
  45. package/components/common/vm/actions/common/select/createType/lib/models/interfaces.ts +5 -5
  46. package/components/common/vm/actions/common/select/storage/Old.vue +125 -125
  47. package/components/common/vm/actions/common/select/storage/new/New.vue +311 -311
  48. package/components/common/vm/actions/common/select/storage/new/lib/models/interfaces.ts +5 -5
  49. package/components/common/vm/actions/common/select/storage/new/lib/utils/utils.ts +21 -21
  50. package/components/common/vm/actions/common/select/template/old/Old.vue +50 -50
  51. package/components/common/vm/actions/editSettings/new/Skeleton.vue +88 -88
  52. package/components/common/vm/actions/register/lib/config/steps.ts +86 -86
  53. package/components/common/wizards/common/compatibility/Compatibility.vue +35 -35
  54. package/components/common/wizards/common/compatibility/New.vue +99 -99
  55. package/components/common/wizards/common/compatibility/Old.vue +53 -53
  56. package/components/common/wizards/common/steps/computeResource/New.vue +93 -93
  57. package/components/common/wizards/common/steps/name/Name.vue +178 -178
  58. package/components/common/wizards/common/steps/name/New.vue +221 -221
  59. package/components/common/wizards/common/steps/name/Old.vue +121 -121
  60. package/components/common/wizards/common/steps/name/lib/models/interfaces.ts +4 -4
  61. package/components/common/wizards/common/steps/name/location/New.vue +40 -40
  62. package/components/common/wizards/datastore/add/Add.vue +228 -228
  63. package/components/common/wizards/datastore/add/lib/utils.ts +85 -85
  64. package/components/common/wizards/datastore/add/steps/typeMode/lib/config/typeOptions.ts +43 -43
  65. package/composables/useAppVersion.ts +21 -21
  66. package/composables/useLocal.ts +6 -6
  67. package/composables/useLocalCommon.ts +39 -39
  68. package/package.json +1 -1
  69. package/plugins/console.ts +21 -21
  70. package/plugins/mouse.ts +21 -21
  71. package/plugins/panelStates.ts +70 -70
  72. package/plugins/text.ts +59 -59
  73. package/public/spice-console/application/clientgui.js +854 -854
  74. package/public/spice-console/application/packetfactory.js +211 -211
  75. package/public/spice-console/application/virtualmouse.js +147 -147
  76. package/public/spice-console/lib/images/bitmap.js +203 -203
  77. package/public/spice-console/network/spicechannel.js +440 -440
  78. package/public/spice-console/process/cursorprocess.js +128 -128
  79. package/public/spice-console/process/inputprocess.js +227 -227
  80. package/public/spice-console/process/mainprocess.js +212 -212
  81. package/public/spice-console/run.js +210 -210
  82. package/store/main/mutations.ts +7 -7
  83. package/store/main/state.ts +7 -7
  84. package/store/tasks/actions.ts +165 -165
  85. package/store/tasks/mappers/recentTasks.ts +118 -118
  86. package/store/tasks/mutations.ts +82 -82
@@ -1,97 +1,97 @@
1
- <template>
2
- <div class="pagination">
3
- <div v-if="!props.hidePagination" class="pagination-size">
4
- <atoms-per-page
5
- v-if="!props.hidePageSize"
6
- :test-id="props.testId"
7
- :page-size="props.pageSize"
8
- :options="props.options"
9
- @change="changePageSize"
10
- />
11
- </div>
12
-
13
- <div
14
- :class="['pagination-description', { 'ml-1': !props.isShowHiddenInfo }]"
15
- >
16
- {{ totalItemCount }}
17
- </div>
18
-
19
- <atoms-table-data-grid-page
20
- v-if="!props.hidePagination"
21
- :test-id="props.testId"
22
- :page="props.page"
23
- :total-items="props.totalItems"
24
- :total-pages="props.totalPages"
25
- :page-size="props.pageSize"
26
- @change="changePage"
27
- />
28
- </div>
29
- </template>
30
-
31
- <script setup lang="ts">
32
- import type { UI_I_Localization } from '~/lib/models/interfaces'
33
- import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
34
-
35
- const props = withDefaults(
36
- defineProps<{
37
- options: UI_I_OptionItem[]
38
- pageSize: number
39
- page: number
40
- totalItems: number
41
- totalPages: number
42
- pageItemsCount: number
43
- hidePagination?: boolean
44
- hidePageSize?: boolean
45
- showPageInfo?: boolean
46
- testId?: string
47
- isShowHiddenInfo?: boolean
48
- }>(),
49
- {
50
- hidePagination: undefined,
51
- hidePageSize: undefined,
52
- showPageInfo: undefined,
53
- testId: 'ui-data-grid-pagination',
54
- isShowHiddenInfo: false,
55
- }
56
- )
57
- const emits = defineEmits<{
58
- (event: 'change-page-size', value: number): void
59
- (event: 'change-page', value: number): void
60
- }>()
61
- const localization = computed<UI_I_Localization>(() => useLocal())
62
- const totalItemCount = computed<string>(() => {
63
- const start = (props.page - 1) * props.pageSize + 1
64
-
65
- // const paginationInfo = props.showPageInfo
66
- // ? `${start} - ${props.pageItemsCount} ${localization.value.common.of}`
67
- // : ''
68
-
69
- if (props.showPageInfo) {
70
- return `${start} - ${props.pageItemsCount}
71
- ${localization.value.common.of}
72
- ${props.totalItems} ${localization.value.common.items.toLowerCase()}`
73
- }
74
-
75
- return `${
76
- // props.totalItems
77
- props.pageItemsCount
78
- } ${localization.value.common.items.toLowerCase()}`
79
- })
80
-
81
- const changePageSize = (pageSize: number): void => {
82
- const newTotalPages = Math.ceil(props.totalItems / pageSize)
83
- if (newTotalPages < props.page) changePage(newTotalPages)
84
- emits('change-page-size', pageSize)
85
- }
86
-
87
- const changePage = (page: number): void => {
88
- emits('change-page', page)
89
- }
90
- </script>
91
-
92
- <style scoped lang="scss">
93
- .pagination {
94
- display: inline-flex;
95
- align-items: center;
96
- }
97
- </style>
1
+ <template>
2
+ <div class="pagination">
3
+ <div v-if="!props.hidePagination" class="pagination-size">
4
+ <atoms-per-page
5
+ v-if="!props.hidePageSize"
6
+ :test-id="props.testId"
7
+ :page-size="props.pageSize"
8
+ :options="props.options"
9
+ @change="changePageSize"
10
+ />
11
+ </div>
12
+
13
+ <div
14
+ :class="['pagination-description', { 'ml-1': !props.isShowHiddenInfo }]"
15
+ >
16
+ {{ totalItemCount }}
17
+ </div>
18
+
19
+ <atoms-table-data-grid-page
20
+ v-if="!props.hidePagination"
21
+ :test-id="props.testId"
22
+ :page="props.page"
23
+ :total-items="props.totalItems"
24
+ :total-pages="props.totalPages"
25
+ :page-size="props.pageSize"
26
+ @change="changePage"
27
+ />
28
+ </div>
29
+ </template>
30
+
31
+ <script setup lang="ts">
32
+ import type { UI_I_Localization } from '~/lib/models/interfaces'
33
+ import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
34
+
35
+ const props = withDefaults(
36
+ defineProps<{
37
+ options: UI_I_OptionItem[]
38
+ pageSize: number
39
+ page: number
40
+ totalItems: number
41
+ totalPages: number
42
+ pageItemsCount: number
43
+ hidePagination?: boolean
44
+ hidePageSize?: boolean
45
+ showPageInfo?: boolean
46
+ testId?: string
47
+ isShowHiddenInfo?: boolean
48
+ }>(),
49
+ {
50
+ hidePagination: undefined,
51
+ hidePageSize: undefined,
52
+ showPageInfo: undefined,
53
+ testId: 'ui-data-grid-pagination',
54
+ isShowHiddenInfo: false,
55
+ }
56
+ )
57
+ const emits = defineEmits<{
58
+ (event: 'change-page-size', value: number): void
59
+ (event: 'change-page', value: number): void
60
+ }>()
61
+ const localization = computed<UI_I_Localization>(() => useLocal())
62
+ const totalItemCount = computed<string>(() => {
63
+ const start = (props.page - 1) * props.pageSize + 1
64
+
65
+ // const paginationInfo = props.showPageInfo
66
+ // ? `${start} - ${props.pageItemsCount} ${localization.value.common.of}`
67
+ // : ''
68
+
69
+ if (props.showPageInfo) {
70
+ return `${start} - ${props.pageItemsCount}
71
+ ${localization.value.common.of}
72
+ ${props.totalItems} ${localization.value.common.items.toLowerCase()}`
73
+ }
74
+
75
+ return `${
76
+ // props.totalItems
77
+ props.pageItemsCount
78
+ } ${localization.value.common.items.toLowerCase()}`
79
+ })
80
+
81
+ const changePageSize = (pageSize: number): void => {
82
+ const newTotalPages = Math.ceil(props.totalItems / pageSize)
83
+ if (newTotalPages < props.page) changePage(newTotalPages)
84
+ emits('change-page-size', pageSize)
85
+ }
86
+
87
+ const changePage = (page: number): void => {
88
+ emits('change-page', page)
89
+ }
90
+ </script>
91
+
92
+ <style scoped lang="scss">
93
+ .pagination {
94
+ display: inline-flex;
95
+ align-items: center;
96
+ }
97
+ </style>
@@ -1,94 +1,94 @@
1
- import type { UI_ColumnSettingsStrategy } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
2
- import type {
3
- UI_I_ColumnKey,
4
- UI_I_HeadItem,
5
- } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
6
- import type { UI_I_DropdownButtonItem } from '~/components/common/select/button/lib/models/interfaces'
7
- import type { UI_I_Localization } from '~/lib/models/interfaces'
8
- import {
9
- constructColumnKey,
10
- constructHeadItem,
11
- } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
12
-
13
- export const defaultColumnKeys = (
14
- items: [string, boolean, string, string][],
15
- strategy?: UI_ColumnSettingsStrategy
16
- ): UI_I_ColumnKey[] => {
17
- const result: UI_I_ColumnKey[] = []
18
- items.forEach((item, i) => {
19
- let col: string = `col${i}` // Стандартное значение по умолчанию
20
-
21
- if (strategy) {
22
- // Проходим по ключам объекта и ищем соответствие индекса i в значениях
23
- for (const key in strategy) {
24
- if (strategy[key].includes(i)) {
25
- col = key
26
- break
27
- }
28
- }
29
- }
30
-
31
- result.push(
32
- constructColumnKey(col, item[0], item[1], `show-column-${item[3]}`)
33
- )
34
- })
35
- return result
36
- }
37
-
38
- export const defaultHeadItems = (
39
- items: [string, boolean, string, string][],
40
- strategy?: UI_ColumnSettingsStrategy
41
- ): UI_I_HeadItem[] => {
42
- const result: UI_I_HeadItem[] = []
43
- items.forEach((item, i) => {
44
- let col: string = `col${i}` // Стандартное значение по умолчанию
45
-
46
- if (strategy) {
47
- // Проходим по ключам объекта и ищем соответствие индекса i в значениях
48
- for (const key in strategy) {
49
- if (strategy[key].includes(i)) {
50
- col = key
51
- break
52
- }
53
- }
54
- }
55
-
56
- result.push(
57
- constructHeadItem(
58
- col,
59
- item[0],
60
- item[3],
61
- false,
62
- item[2],
63
- undefined,
64
- item[3]
65
- )
66
- )
67
- })
68
- return result
69
- }
70
-
71
- export const exportItemsFunc = (
72
- localization: UI_I_Localization,
73
- rows: number,
74
- selectedRows: number,
75
- testId: string
76
- ): UI_I_DropdownButtonItem[] => {
77
- return [
78
- {
79
- text: localization.common.allRowsCount.replace('{0}', '' + rows),
80
- type: '0',
81
- disabled: false,
82
- testId: `${testId}-export-all`,
83
- },
84
- {
85
- text: localization.common.selectedRowsCount.replace(
86
- '{0}',
87
- '' + selectedRows
88
- ),
89
- type: '1',
90
- disabled: false,
91
- testId: `${testId}-export-selected`,
92
- },
93
- ]
94
- }
1
+ import type { UI_ColumnSettingsStrategy } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
2
+ import type {
3
+ UI_I_ColumnKey,
4
+ UI_I_HeadItem,
5
+ } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
6
+ import type { UI_I_DropdownButtonItem } from '~/components/common/select/button/lib/models/interfaces'
7
+ import type { UI_I_Localization } from '~/lib/models/interfaces'
8
+ import {
9
+ constructColumnKey,
10
+ constructHeadItem,
11
+ } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
12
+
13
+ export const defaultColumnKeys = (
14
+ items: [string, boolean, string, string][],
15
+ strategy?: UI_ColumnSettingsStrategy
16
+ ): UI_I_ColumnKey[] => {
17
+ const result: UI_I_ColumnKey[] = []
18
+ items.forEach((item, i) => {
19
+ let col: string = `col${i}` // Стандартное значение по умолчанию
20
+
21
+ if (strategy) {
22
+ // Проходим по ключам объекта и ищем соответствие индекса i в значениях
23
+ for (const key in strategy) {
24
+ if (strategy[key].includes(i)) {
25
+ col = key
26
+ break
27
+ }
28
+ }
29
+ }
30
+
31
+ result.push(
32
+ constructColumnKey(col, item[0], item[1], `show-column-${item[3]}`)
33
+ )
34
+ })
35
+ return result
36
+ }
37
+
38
+ export const defaultHeadItems = (
39
+ items: [string, boolean, string, string][],
40
+ strategy?: UI_ColumnSettingsStrategy
41
+ ): UI_I_HeadItem[] => {
42
+ const result: UI_I_HeadItem[] = []
43
+ items.forEach((item, i) => {
44
+ let col: string = `col${i}` // Стандартное значение по умолчанию
45
+
46
+ if (strategy) {
47
+ // Проходим по ключам объекта и ищем соответствие индекса i в значениях
48
+ for (const key in strategy) {
49
+ if (strategy[key].includes(i)) {
50
+ col = key
51
+ break
52
+ }
53
+ }
54
+ }
55
+
56
+ result.push(
57
+ constructHeadItem(
58
+ col,
59
+ item[0],
60
+ item[3],
61
+ false,
62
+ item[2],
63
+ undefined,
64
+ item[3]
65
+ )
66
+ )
67
+ })
68
+ return result
69
+ }
70
+
71
+ export const exportItemsFunc = (
72
+ localization: UI_I_Localization,
73
+ rows: number,
74
+ selectedRows: number,
75
+ testId: string
76
+ ): UI_I_DropdownButtonItem[] => {
77
+ return [
78
+ {
79
+ text: localization.common.allRowsCount.replace('{0}', '' + rows),
80
+ type: '0',
81
+ disabled: false,
82
+ testId: `${testId}-export-all`,
83
+ },
84
+ {
85
+ text: localization.common.selectedRowsCount.replace(
86
+ '{0}',
87
+ '' + selectedRows
88
+ ),
89
+ type: '1',
90
+ disabled: false,
91
+ testId: `${testId}-export-selected`,
92
+ },
93
+ ]
94
+ }
@@ -1,16 +1,16 @@
1
- export const generateCsvAndDownload = (rows: HTMLElement[]): void => {
2
- const content: string[] = []
3
- rows.forEach((row: HTMLElement) => {
4
- content.push(row.innerText.replaceAll(';', ',').replaceAll('\n', ';'))
5
- })
6
-
7
- const csvContent = 'data:text/csv;charset=utf-8,' + content.join('\n')
8
-
9
- const encodedUri = encodeURI(csvContent)
10
- const link = document.createElement('a')
11
- link.setAttribute('href', encodedUri)
12
- link.setAttribute('download', 'my_data.csv')
13
- document.body.appendChild(link)
14
-
15
- link.click()
16
- }
1
+ export const generateCsvAndDownload = (rows: HTMLElement[]): void => {
2
+ const content: string[] = []
3
+ rows.forEach((row: HTMLElement) => {
4
+ content.push(row.innerText.replaceAll(';', ',').replaceAll('\n', ';'))
5
+ })
6
+
7
+ const csvContent = 'data:text/csv;charset=utf-8,' + content.join('\n')
8
+
9
+ const encodedUri = encodeURI(csvContent)
10
+ const link = document.createElement('a')
11
+ link.setAttribute('href', encodedUri)
12
+ link.setAttribute('download', 'my_data.csv')
13
+ document.body.appendChild(link)
14
+
15
+ link.click()
16
+ }
@@ -1,51 +1,51 @@
1
- import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
2
- import type { API_UI_I_Error } from '~/lib/models/store/interfaces'
3
- import type { UI_T_Project } from '~/lib/models/types'
4
- import { UI_E_Kind } from '~/lib/models/enums'
5
-
6
- export const checkValidityName = async ({
7
- name,
8
- wizard,
9
- project,
10
- sendMessage,
11
- datacenterId,
12
- }: {
13
- name: string
14
- wizard: Wizard
15
- project: UI_T_Project
16
- sendMessage: (message: string) => void
17
- datacenterId?: string
18
- }): Promise<void> => {
19
- wizard.setLoader(true)
20
-
21
- const url = buildValidationUrl(name, project, datacenterId)
22
- const { error } = await useMyFetch<null, API_UI_I_Error>(url, {
23
- method: 'GET',
24
- })
25
- wizard.setLoader(false)
26
-
27
- if (error.value && error.value.data.error_code !== 0) {
28
- const existError = error.value.data?.error_message || error.value.data
29
- sendMessage(existError)
30
- return
31
- }
32
- sendMessage('')
33
- }
34
-
35
- const buildValidationUrl = (
36
- name: string,
37
- project: UI_T_Project,
38
- datacenterId?: string
39
- ): string => {
40
- if (project === 'procurator') {
41
- const params = new URLSearchParams({ name })
42
- return `/ui/ds/validate?${params.toString()}`
43
- }
44
-
45
- const params = new URLSearchParams()
46
- params.set('name', name)
47
- params.set('kind', String(UI_E_Kind.STORAGE_VALIDATION_NAME))
48
- if (datacenterId) params.set('datacenter', datacenterId)
49
-
50
- return `/ui/object/validate_name?${params.toString()}`
51
- }
1
+ import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
2
+ import type { API_UI_I_Error } from '~/lib/models/store/interfaces'
3
+ import type { UI_T_Project } from '~/lib/models/types'
4
+ import { UI_E_Kind } from '~/lib/models/enums'
5
+
6
+ export const checkValidityName = async ({
7
+ name,
8
+ wizard,
9
+ project,
10
+ sendMessage,
11
+ datacenterId,
12
+ }: {
13
+ name: string
14
+ wizard: Wizard
15
+ project: UI_T_Project
16
+ sendMessage: (message: string) => void
17
+ datacenterId?: string
18
+ }): Promise<void> => {
19
+ wizard.setLoader(true)
20
+
21
+ const url = buildValidationUrl(name, project, datacenterId)
22
+ const { error } = await useMyFetch<null, API_UI_I_Error>(url, {
23
+ method: 'GET',
24
+ })
25
+ wizard.setLoader(false)
26
+
27
+ if (error.value && error.value.data.error_code !== 0) {
28
+ const existError = error.value.data?.error_message || error.value.data
29
+ sendMessage(existError)
30
+ return
31
+ }
32
+ sendMessage('')
33
+ }
34
+
35
+ const buildValidationUrl = (
36
+ name: string,
37
+ project: UI_T_Project,
38
+ datacenterId?: string
39
+ ): string => {
40
+ if (project === 'procurator') {
41
+ const params = new URLSearchParams({ name })
42
+ return `/ui/ds/validate?${params.toString()}`
43
+ }
44
+
45
+ const params = new URLSearchParams()
46
+ params.set('name', name)
47
+ params.set('kind', String(UI_E_Kind.STORAGE_VALIDATION_NAME))
48
+ if (datacenterId) params.set('datacenter', datacenterId)
49
+
50
+ return `/ui/object/validate_name?${params.toString()}`
51
+ }
@@ -1,18 +1,18 @@
1
- <template>
2
- <div class="skeleton-wrap">
3
- <ui-skeleton-item height="18px" />
4
- <ui-skeleton-item height="18px" />
5
- <ui-skeleton-item height="18px" />
6
- <ui-skeleton-item height="18px" />
7
- <ui-skeleton-item height="18px" />
8
- </div>
9
- </template>
10
-
11
- <script setup lang="ts"></script>
12
-
13
- <style scoped lang="scss">
14
- .skeleton-wrap {
15
- display: grid;
16
- grid-gap: 12px;
17
- }
18
- </style>
1
+ <template>
2
+ <div class="skeleton-wrap">
3
+ <ui-skeleton-item height="18px" />
4
+ <ui-skeleton-item height="18px" />
5
+ <ui-skeleton-item height="18px" />
6
+ <ui-skeleton-item height="18px" />
7
+ <ui-skeleton-item height="18px" />
8
+ </div>
9
+ </template>
10
+
11
+ <script setup lang="ts"></script>
12
+
13
+ <style scoped lang="scss">
14
+ .skeleton-wrap {
15
+ display: grid;
16
+ grid-gap: 12px;
17
+ }
18
+ </style>