bfg-common 1.3.8 → 1.3.10

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.
@@ -1,83 +0,0 @@
1
- <template>
2
- <div class="tree-view">
3
- <atoms-loader-pre-loader
4
- v-show="loading"
5
- id="loader"
6
- class="absolute-center tree-view__loading"
7
- :show="true"
8
- />
9
- <common-recursion-tree
10
- :nodes="nodes"
11
- class="recursion-tree"
12
- @get-nodes="showNodes($event)"
13
- @select-node="selectNode"
14
- @contextmenu.prevent
15
- />
16
- </div>
17
- </template>
18
-
19
- <script setup lang="ts">
20
- import { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
21
-
22
- const props = defineProps<{
23
- dataCenter: UI_I_TreeNode
24
- }>()
25
- const emits = defineEmits<{
26
- (event: 'select-node', value: UI_I_TreeNode): void
27
- }>()
28
-
29
- const { $store } = useNuxtApp()
30
-
31
- const nodes = computed<UI_I_TreeNode[]>(
32
- () => $store.getters['inventory/getFolderTree'] || []
33
- )
34
- const loading = ref<boolean>(false)
35
- const getTree = async (): Promise<void> => {
36
- loading.value = true
37
- await $store.dispatch('inventory/A_GET_FOLDER_TREE', null)
38
- loading.value = false
39
- }
40
- getTree().then(() => {
41
- selectNode(props.dataCenter)
42
- })
43
-
44
- const showNodes = ({
45
- node,
46
- cb,
47
- }: {
48
- node: UI_I_TreeNode
49
- cb: () => void
50
- }): void => {
51
- const payload: any = { node, treeName: 'folderTree' }
52
- $store.dispatch('inventory/A_SHOW_NODE', payload)
53
- cb()
54
- }
55
- const selectNode = (node: UI_I_TreeNode): void => {
56
- const payload: any = {
57
- node,
58
- treeName: 'folderTree',
59
- doSelect: false,
60
- }
61
- $store.dispatch('inventory/A_SELECT_NODE', payload)
62
-
63
- emits('select-node', node)
64
- }
65
-
66
- onUnmounted(() => {
67
- $store.dispatch('inventory/A_CLEAR_FOLDER_TREE', null)
68
- })
69
- </script>
70
-
71
- <style scoped lang="scss">
72
- .tree-view {
73
- &__loading {
74
- :deep(.spinner.spinner-inverse) {
75
- position: static;
76
- width: 45px;
77
- height: 45px;
78
- min-width: 45px;
79
- min-height: 45px;
80
- }
81
- }
82
- }
83
- </style>
@@ -1,118 +0,0 @@
1
- import { UI_I_ArbitraryObject } from '~/lib/models/interfaces'
2
- import { UI_E_Fields } from '~/components/common/vm/actions/common/lib/models/enums'
3
- import { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
4
- import { UI_I_Localization } from '~/lib/models/interfaces'
5
- import { UI_I_VerticalStepItem } from '~/components/atoms/lib/models/interfaces'
6
- import { UI_T_Project } from '~/lib/models/types'
7
- import { checkAllField } from '~/components/common/vm/actions/lib/utils'
8
-
9
- export const objectToOptionItem = (
10
- // TODO переместить в более глобальное место
11
- obj: UI_I_ArbitraryObject<string>
12
- ): UI_I_OptionItem[] => {
13
- const result = []
14
- for (const key in obj) {
15
- result.push({
16
- text: obj[key],
17
- value: key,
18
- })
19
- }
20
- return result
21
- }
22
-
23
- export const getStepPositionByField = (field: string): number => {
24
- if (checkAllField(field)) {
25
- return UI_E_Fields[field]
26
- } else if (field.includes('disk_devices')) {
27
- return UI_E_Fields.disk_devices
28
- } else if (field.includes('network_devices')) {
29
- return UI_E_Fields.network_devices
30
- }
31
- return 5
32
- }
33
-
34
- export const stepItemsFunc = (
35
- localization: UI_I_Localization,
36
- project: UI_T_Project
37
- ): UI_I_VerticalStepItem[] => {
38
- if (project === 'sphere') {
39
- return [
40
- {
41
- text: localization.selectCreationType,
42
- disabled: false,
43
- complete: false,
44
- },
45
- {
46
- text: localization.selectNameFolder,
47
- disabled: true,
48
- complete: false,
49
- },
50
- {
51
- text: localization.selectComputeResource,
52
- disabled: true,
53
- complete: false,
54
- },
55
- { text: localization.selectStorage, disabled: true, complete: false },
56
- { text: localization.compatibility, disabled: true, complete: false },
57
- { text: localization.selectGuestOS, disabled: true, complete: false },
58
- {
59
- text: localization.customizeHardware,
60
- disabled: true,
61
- complete: false,
62
- },
63
- { text: localization.readyComplete, disabled: true, complete: false },
64
- ]
65
- }
66
- return [
67
- {
68
- text: localization.selectCreationType,
69
- disabled: false,
70
- complete: false,
71
- },
72
- {
73
- text: localization.selectName,
74
- disabled: true,
75
- complete: false,
76
- },
77
- { text: localization.selectStorage, disabled: true, complete: false },
78
- { text: localization.compatibility, disabled: true, complete: false },
79
- {
80
- text: localization.selectGuestOSMachineType,
81
- disabled: true,
82
- complete: false,
83
- },
84
- {
85
- text: localization.customizeHardware,
86
- disabled: true,
87
- complete: false,
88
- },
89
- { text: localization.readyComplete, disabled: true, complete: false },
90
- ]
91
- }
92
-
93
- export const subTitleFunc = (
94
- localization: UI_I_Localization,
95
- project: UI_T_Project
96
- ): string[] => {
97
- if (project === 'sphere') {
98
- return [
99
- localization.howWouldLikeCreateVirtualMachine,
100
- localization.specifyUniqueNameTargetLocation,
101
- localization.selectDestinationComputeResourceOperation,
102
- localization.selectStorageConfigurationDiskFiles,
103
- localization.selectCompatibilityVmDependingHostsEnvironment,
104
- localization.chooseGuestOSInstalledVM,
105
- localization.configureVirtualMachineHardware,
106
- localization.clickFinishStartCreation,
107
- ]
108
- }
109
- return [
110
- localization.howWouldLikeCreateVirtualMachine,
111
- localization.specifyUniqueName,
112
- localization.selectStorageConfigurationDiskFiles,
113
- localization.selectCompatibilityVmDependingHostsEnvironment,
114
- localization.chooseGuestOSInstalledVmAndMachineTypeUsedCreateVm,
115
- localization.configureVirtualMachineHardware,
116
- localization.clickFinishStartCreation,
117
- ]
118
- }
@@ -1,215 +0,0 @@
1
- <template>
2
- <div class="select-name">
3
- <atoms-alert
4
- v-show="errors.length"
5
- status="alert-danger"
6
- :items="errors"
7
- @remove="onRemoveValidationErrors"
8
- />
9
-
10
- <form id="virtual-machine-form" @submit.prevent>
11
- <label for="virtual-machine-name"
12
- >{{ localization.virtualMachineName }}:</label
13
- >
14
- <input id="virtual-machine-name" v-model.trim="vmName" type="text" />
15
- <div id="vm-name-help-icon" class="content-signpost relative">
16
- <atoms-the-icon
17
- class="icon-show-help"
18
- fill="#0072a3"
19
- width="24px"
20
- height="24px"
21
- name="info-circle"
22
- @click="isShowHelp = !isShowHelp"
23
- />
24
- <atoms-tooltip-signpost
25
- v-if="isShowHelp"
26
- test-id="help-signpost"
27
- elem-id="vm-name-help-icon"
28
- @hide="isShowHelp = false"
29
- >
30
- <p>
31
- {{ localization.vmNameValidationDescription2 }}
32
- </p>
33
- </atoms-tooltip-signpost>
34
- </div>
35
- </form>
36
-
37
- <template v-if="props.project === 'sphere'">
38
- <p class="new-vm-name-and-folder-instructions mt-1">
39
- {{ localization.selectLocationVirtualMachine }}
40
- </p>
41
- <div class="tree-view-wrap">
42
- <common-vm-actions-add-folder-tree-view
43
- :data-center="props.dataCenter"
44
- @select-node="onSelectNode"
45
- />
46
- </div>
47
- </template>
48
- </div>
49
- </template>
50
-
51
- <script setup lang="ts">
52
- // import { API_UI_I_Error } from '~/lib/models/store/interfaces'
53
- import { UI_I_Localization } from '~/lib/models/interfaces'
54
- import { UI_T_Project } from '~/lib/models/types'
55
- import { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
56
-
57
- const props = defineProps<{
58
- nameFormSubmit: number
59
- show: boolean
60
- project: UI_T_Project
61
- dataCenter?: UI_I_TreeNode // для сферы
62
- }>()
63
- const emits = defineEmits<{
64
- (event: 'submit', value: [string, UI_I_TreeNode | null]): void
65
- (event: 'loading', value: boolean): void
66
- (
67
- event: 'check-name',
68
- value: [[string, UI_I_TreeNode | null], (error: any) => void]
69
- ): void
70
- }>()
71
-
72
- const localization = computed<UI_I_Localization>(() => useLocal())
73
-
74
- const vmName = ref<string>('')
75
-
76
- const selectedNode = ref<UI_I_TreeNode | null>(null)
77
- const onSelectNode = (node: UI_I_TreeNode): void => {
78
- selectedNode.value = node
79
- }
80
-
81
- watch(
82
- () => props.nameFormSubmit,
83
- () => {
84
- submit()
85
- }
86
- )
87
-
88
- const isParentDatacenter = (node: UI_I_TreeNode | null): boolean => {
89
- if (!node) return false
90
-
91
- if (node.parent?.type === 'datacenter') return true
92
- if (node.parent?.type === 'folder') return isParentDatacenter(node.parent)
93
- return false
94
- }
95
- const submit = async (): Promise<void> => {
96
- const name = vmName.value
97
-
98
- if (name !== '') {
99
- const isNameValid = await checkNameIsValid(name)
100
- if (!isNameValid) return
101
- }
102
-
103
- if (props.project === 'sphere') {
104
- const isDatacenterFolder = isParentDatacenter(selectedNode.value)
105
-
106
- if (
107
- selectedNode.value?.type !== 'datacenter' &&
108
- selectedNode.value?.type === 'folder' &&
109
- !isDatacenterFolder
110
- ) {
111
- showValidationErrors([
112
- localization.value.enterValidLocationVirtualMachine,
113
- ])
114
- return
115
- }
116
- }
117
-
118
- onRemoveValidationErrors()
119
- emits('submit', [name, selectedNode.value])
120
- }
121
- const checkNameIsValid = async (name: string): Promise<boolean> => {
122
- emits('loading', true)
123
-
124
- return new Promise((resolve) => {
125
- emits('check-name', [
126
- [name, selectedNode.value],
127
- (error) => {
128
- emits('loading', false)
129
-
130
- const status = error?.statusCode || 200
131
- switch (status) {
132
- case 406: // Invalid name
133
- showValidationErrors([
134
- localization.value.vmNameValidationDescription2,
135
- ])
136
- resolve(false)
137
- break
138
- case 409: // Name exist
139
- showValidationErrors([
140
- localization.value.vmNameExistInSelectedLocation,
141
- ])
142
- resolve(false)
143
- break
144
- }
145
-
146
- resolve(true)
147
- },
148
- ])
149
- })
150
- }
151
-
152
- const errors = ref<string[]>([])
153
- const showValidationErrors = (data: string[]): void => {
154
- errors.value = data
155
- }
156
- const onRemoveValidationErrors = (): void => {
157
- errors.value = []
158
- }
159
-
160
- watch(
161
- () => props.show,
162
- (newValue) => {
163
- if (!newValue) return
164
-
165
- const input = document.getElementById('virtual-machine-name')
166
- if (!input) return
167
-
168
- setTimeout(() => {
169
- input.focus()
170
- }, 0)
171
- }
172
- )
173
-
174
- const isShowHelp = ref<boolean>(false)
175
- </script>
176
-
177
- <style scoped lang="scss">
178
- .select-name {
179
- form {
180
- display: flex;
181
- align-items: center;
182
- padding-top: 20px;
183
-
184
- label {
185
- width: 216px;
186
- }
187
- input {
188
- width: 345px;
189
- }
190
- }
191
-
192
- .tree-view-wrap {
193
- position: relative;
194
- border: 1px solid #000;
195
- padding: 5px;
196
- max-height: 300px;
197
- min-height: 200px;
198
- overflow: auto;
199
- margin-bottom: 10px;
200
- }
201
- }
202
- .content-signpost {
203
- .icon-show-help {
204
- cursor: pointer;
205
- }
206
-
207
- .help-title {
208
- font-size: 22px;
209
- margin-bottom: 24px;
210
- }
211
- .signpost {
212
- max-width: 360px;
213
- }
214
- }
215
- </style>
@@ -1,194 +0,0 @@
1
- <template>
2
- <div class="select-storage">
3
- <atoms-alert
4
- v-show="errors.length"
5
- status="alert-danger"
6
- :items="errors"
7
- @remove="onRemoveValidationErrors"
8
- />
9
- <div class="table-wrap">
10
- <atoms-table-data-grid
11
- v-model:selected-row="selectedRow"
12
- v-model:column-keys="columnKeys"
13
- v-model:page-size="pagination.pageSize"
14
- v-model:page="pagination.page"
15
- type="radio"
16
- :head-items="headItems"
17
- :body-items="bodyItems"
18
- :total-items="bodyItems.length"
19
- :total-pages="1"
20
- server-off
21
- hide-page-size
22
- @sorting="sorting"
23
- @change="changeStorage"
24
- >
25
- <template #icon="{ item }">
26
- <span :class="['datagrid-cell-icon', item.data]" />
27
- <span class="text-ellipsis">
28
- {{ item.text }}
29
- </span>
30
- </template>
31
- </atoms-table-data-grid>
32
- </div>
33
-
34
- <div v-if="!hideCompatibility" class="compatibility-wrap">
35
- <p class="compatibility">
36
- {{ localization.compatibility }}
37
- </p>
38
- <div class="compatibility-message flex-align-center">
39
- <template v-if="selectedStorage">
40
- <div class="icon-status-ok" />
41
- <span>{{ localization.compatibilityChecksSucceeded }}</span>
42
- </template>
43
- <div v-else>
44
- <br />
45
- </div>
46
- </div>
47
- </div>
48
- </div>
49
- </template>
50
-
51
- <script setup lang="ts">
52
- import { UI_I_Pagination } from '~/lib/models/interfaces'
53
- import { UI_I_TablePayload } from '~/lib/models/store/interfaces'
54
- import { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
55
- import { UI_I_Localization } from '~/lib/models/interfaces'
56
- import {
57
- UI_I_ColumnKey,
58
- UI_I_HeadItem,
59
- UI_I_BodyItem,
60
- } from '~/components/atoms/table/dataGrid/lib/models/interfaces'
61
- import * as table from '~/components/common/vm/actions/common/select/storage/lib/config/config'
62
-
63
- const props = defineProps<{
64
- storageSubmit: number
65
- datastore: UI_I_DatastoreTableItem[]
66
- storage: UI_I_DatastoreTableItem
67
- hideCompatibility?: boolean
68
- getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
69
- }>()
70
- const emits = defineEmits<{
71
- (event: 'submit', value: UI_I_DatastoreTableItem): void
72
- }>()
73
-
74
- const localization = computed<UI_I_Localization>(() => useLocal())
75
-
76
- const headItems = ref<UI_I_HeadItem[]>(table.headItems(localization.value))
77
- const columnKeys = ref<UI_I_ColumnKey[]>(table.columnKeys(localization.value))
78
- watch(localization, () => {
79
- columnKeys.value = table.columnKeys(localization.value)
80
- })
81
-
82
- const bodyItems = computed<UI_I_BodyItem[][]>(() => {
83
- return table.bodyItems(props.datastore || [], localization.value)
84
- })
85
-
86
- const sort = ref<string | null>(null)
87
- const pagination = ref<UI_I_Pagination>({
88
- page: 1,
89
- pageSize: 100,
90
- })
91
-
92
- const sorting = (data: [string, boolean]): void => {
93
- const [column, status] = data
94
- const direction = status ? 'asc' : 'desc'
95
- sort.value = `${column}.${direction}`
96
-
97
- getStorage()
98
- }
99
-
100
- const getStorage = async (): Promise<void> => {
101
- const payload: UI_I_TablePayload = {
102
- pagination: pagination.value,
103
- sortBy: sort.value,
104
- type: 'datastore',
105
- schema: 'full',
106
- }
107
-
108
- props.getDatastoreTableFunc(payload).then(() => {
109
- selectedRow.value = null
110
- setStorageFromProps()
111
- })
112
- }
113
- getStorage()
114
-
115
- const selectedStorage = ref<UI_I_DatastoreTableItem | null>(null)
116
- const selectedRow = ref<number | null>(null)
117
- const changeStorage = (index: number): void => {
118
- if (!props.datastore) return
119
- selectedStorage.value = props.datastore[index]
120
- selectedRow.value = index
121
- }
122
-
123
- const setStorageFromProps = (): void => {
124
- if (!props.storage) return
125
- props.datastore.forEach((item, index) => {
126
- if (item.id === props.storage.id) changeStorage(index)
127
- })
128
- }
129
- watch(
130
- () => props.storage,
131
- () => {
132
- setStorageFromProps()
133
- },
134
- { immediate: true }
135
- )
136
-
137
- watch(
138
- () => props.storageSubmit,
139
- () => {
140
- submit()
141
- }
142
- )
143
- const submit = (): void => {
144
- if (!selectedStorage.value) {
145
- showValidationErrors([localization.value.selectValidDestinationStorage])
146
- return
147
- }
148
-
149
- emits('submit', selectedStorage.value)
150
- }
151
-
152
- const errors = ref<string[]>([])
153
- const showValidationErrors = (arr: string[]): void => {
154
- errors.value = arr
155
- }
156
- const onRemoveValidationErrors = (): void => {
157
- errors.value = []
158
- }
159
- </script>
160
-
161
- <style scoped lang="scss">
162
- .select-storage {
163
- flex: 1;
164
- display: flex;
165
- flex-direction: column;
166
-
167
- .table-wrap {
168
- flex: 1;
169
-
170
- .datagrid-cell-icon {
171
- margin-right: 6px;
172
- }
173
-
174
- :deep(.relative) {
175
- height: 100%;
176
-
177
- .datagrid-outer-wrapper {
178
- height: 100%;
179
- }
180
- }
181
- }
182
-
183
- .compatibility-wrap {
184
- padding-top: 10px;
185
-
186
- .compatibility-message {
187
- border: 1px solid #000;
188
- padding-top: 5px;
189
- padding-left: 5px;
190
- overflow: auto;
191
- }
192
- }
193
- }
194
- </style>