bfg-common 1.2.50 → 1.2.51

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 (3) hide show
  1. package/components/common/vm/actions/clone/Clone.vue +1 -0
  2. package/components/common/vm/actions/common/select/storage/Storage.vue +194 -177
  3. package/package.json +1 -1
package/components/common/vm/actions/clone/Clone.vue CHANGED
@@ -30,6 +30,7 @@
30
30
  v-show="stepPosition === 1"
31
31
  :storage-submit="storageSubmit"
32
32
  :datastore="props.datastore"
33
+ :storage="vmSettings.storage"
33
34
  :get-datastore-table-func="props.getDatastoreTableFunc"
34
35
  @submit="onChangeStorageAndNext"
35
36
  />
package/components/common/vm/actions/common/select/storage/Storage.vue CHANGED
@@ -1,177 +1,194 @@
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 '~/models/interfaces'
53
- import { UI_I_TablePayload } from '~/models/store/interfaces'
54
- import { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
55
- import * as table from '~/components/common/vm/actions/common/select/storage/config/config'
56
- import { UI_I_Localization } from '~/models/interfaces'
57
- import {
58
- UI_I_ColumnKey,
59
- UI_I_HeadItem,
60
- UI_I_BodyItem,
61
- } from '~/components/atoms/table/dataGrid/models/interfaces'
62
-
63
- const props = defineProps<{
64
- storageSubmit: number
65
- datastore: UI_I_DatastoreTableItem[]
66
- hideCompatibility?: boolean
67
- getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
68
- }>()
69
- const emits = defineEmits<{
70
- (event: 'submit', value: UI_I_DatastoreTableItem): void
71
- }>()
72
-
73
- const localization = computed<UI_I_Localization>(() => useLocal())
74
-
75
- const headItems = ref<UI_I_HeadItem[]>(table.headItems(localization.value))
76
- const columnKeys = ref<UI_I_ColumnKey[]>(table.columnKeys(localization.value))
77
- watch(localization, () => {
78
- columnKeys.value = table.columnKeys(localization.value)
79
- })
80
-
81
- const bodyItems = computed<UI_I_BodyItem[][]>(() => {
82
- return table.bodyItems(props.datastore || [], localization.value)
83
- })
84
-
85
- const sort = ref<string | null>(null)
86
- const pagination = ref<UI_I_Pagination>({
87
- page: 1,
88
- pageSize: 100,
89
- })
90
-
91
- const sorting = (data: [string, boolean]): void => {
92
- const [column, status] = data
93
- const direction = status ? 'asc' : 'desc'
94
- sort.value = `${column}.${direction}`
95
-
96
- getStorage()
97
- }
98
-
99
- const getStorage = async (): Promise<void> => {
100
- const payload: UI_I_TablePayload = {
101
- pagination: pagination.value,
102
- sortBy: sort.value,
103
- type: 'datastore',
104
- schema: 'full',
105
- }
106
-
107
- props.getDatastoreTableFunc(payload).then(() => {
108
- selectedRow.value = null
109
- })
110
- }
111
- getStorage()
112
-
113
- const selectedStorage = ref<UI_I_DatastoreTableItem | null>(null)
114
- const selectedRow = ref<number | null>(null)
115
- const changeStorage = (index: number): void => {
116
- if (!props.datastore) return
117
- selectedStorage.value = props.datastore[index]
118
- }
119
-
120
- watch(
121
- () => props.storageSubmit,
122
- () => {
123
- submit()
124
- }
125
- )
126
- const submit = (): void => {
127
- if (!selectedStorage.value) {
128
- showValidationErrors([localization.value.selectValidDestinationStorage])
129
- return
130
- }
131
-
132
- emits('submit', selectedStorage.value)
133
- }
134
-
135
- const errors = ref<string[]>([])
136
- const showValidationErrors = (arr: string[]): void => {
137
- errors.value = arr
138
- }
139
- const onRemoveValidationErrors = (): void => {
140
- errors.value = []
141
- }
142
- </script>
143
-
144
- <style scoped lang="scss">
145
- .select-storage {
146
- flex: 1;
147
- display: flex;
148
- flex-direction: column;
149
-
150
- .table-wrap {
151
- flex: 1;
152
-
153
- .datagrid-cell-icon {
154
- margin-right: 6px;
155
- }
156
-
157
- :deep(.relative) {
158
- height: 100%;
159
-
160
- .datagrid-outer-wrapper {
161
- height: 100%;
162
- }
163
- }
164
- }
165
-
166
- .compatibility-wrap {
167
- padding-top: 10px;
168
-
169
- .compatibility-message {
170
- border: 1px solid #000;
171
- padding-top: 5px;
172
- padding-left: 5px;
173
- overflow: auto;
174
- }
175
- }
176
- }
177
- </style>
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 '~/models/interfaces'
53
+ import { UI_I_TablePayload } from '~/models/store/interfaces'
54
+ import { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
55
+ import { UI_I_Localization } from '~/models/interfaces'
56
+ import {
57
+ UI_I_ColumnKey,
58
+ UI_I_HeadItem,
59
+ UI_I_BodyItem,
60
+ } from '~/components/atoms/table/dataGrid/models/interfaces'
61
+ import * as table from '~/components/common/vm/actions/common/select/storage/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>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "bfg-common",
3
3
  "private": false,
4
- "version": "1.2.50",
4
+ "version": "1.2.51",
5
5
  "scripts": {
6
6
  "build": "nuxt build",
7
7
  "dev": "nuxt dev --port=3002",