bfg-common 1.5.391 → 1.5.393
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/components/common/backup/storage/actions/add/Add.vue +17 -20
- package/components/common/backup/storage/actions/add/New.vue +304 -305
- package/components/common/backup/storage/actions/add/Old.vue +0 -1
- package/components/common/backup/storage/actions/add/lib/validations.ts +59 -69
- package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigure.vue +0 -4
- package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureNew.vue +51 -55
- package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureOld.vue +60 -68
- package/package.json +1 -1
@@ -152,30 +152,27 @@ const validationFunc = async (
|
|
152
152
|
)
|
153
153
|
value = serverValidation.newValue
|
154
154
|
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
)
|
162
|
-
value = usernameValidation.newValue
|
163
|
-
|
164
|
-
const passwordValidation = validation.checkPasswordSync(
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
value = passwordValidation.newValue
|
155
|
+
// PC-2542
|
156
|
+
// const usernameValidation = validation.checkUsernameSync(
|
157
|
+
// localization.value,
|
158
|
+
// form.value.user,
|
159
|
+
// wizard,
|
160
|
+
// value
|
161
|
+
// )
|
162
|
+
// value = usernameValidation.newValue
|
163
|
+
|
164
|
+
// const passwordValidation = validation.checkPasswordSync(
|
165
|
+
// localization.value,
|
166
|
+
// form.value.password,
|
167
|
+
// wizard,
|
168
|
+
// value
|
169
|
+
// )
|
170
|
+
// value = passwordValidation.newValue
|
172
171
|
|
173
172
|
stepHasError =
|
174
173
|
nameValidation.stepHasError ||
|
175
174
|
folderValidation.stepHasError ||
|
176
|
-
serverValidation.stepHasError
|
177
|
-
usernameValidation.stepHasError ||
|
178
|
-
passwordValidation.stepHasError
|
175
|
+
serverValidation.stepHasError
|
179
176
|
}
|
180
177
|
|
181
178
|
if (
|
@@ -1,305 +1,304 @@
|
|
1
|
-
<template>
|
2
|
-
<ui-wizard
|
3
|
-
show
|
4
|
-
:steps="props.wizard.steps"
|
5
|
-
:selected-scheme="props.selectedScheme"
|
6
|
-
:is-loading="props.wizard.wizardLoader.status"
|
7
|
-
:title="props.title"
|
8
|
-
:texts="texts"
|
9
|
-
test-id="add-datastore-wizard"
|
10
|
-
@change-steps="onChangeSteps"
|
11
|
-
@hide="onHideModal"
|
12
|
-
@submit="onCreateDatastore"
|
13
|
-
>
|
14
|
-
<template #content="{ selectedStep }">
|
15
|
-
<ui-wizard-block
|
16
|
-
v-if="selectedStep.id === dynamicSteps.type"
|
17
|
-
:sub-title-height="height0"
|
18
|
-
>
|
19
|
-
<template #subTitle>
|
20
|
-
<div ref="subTitleBlock0">
|
21
|
-
<div class="subtitle-block flex-row items-start">
|
22
|
-
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
23
|
-
|
24
|
-
<common-tooltip-help
|
25
|
-
:title="localization.common.information"
|
26
|
-
:help-text="localization.common.datastoreTypeHelpDesc"
|
27
|
-
:is-show-help="isShowFirstStepHelp"
|
28
|
-
test-id="datastore-type-subtitle-tooltip"
|
29
|
-
help-id="datastore-type-subtitle-tooltip-icon"
|
30
|
-
dropdown-width="320px"
|
31
|
-
dropdown-left
|
32
|
-
class="ml-2"
|
33
|
-
@update-is-show="onUpdateIsShowFirstStepHelp"
|
34
|
-
/>
|
35
|
-
</div>
|
36
|
-
</div>
|
37
|
-
</template>
|
38
|
-
<template #content>
|
39
|
-
<common-backup-storage-actions-add-steps-type-mode
|
40
|
-
v-if="selectedStep.id === dynamicSteps.type"
|
41
|
-
v-model="formModelLocal.type_code"
|
42
|
-
:updater-hide-all-help-popups="updaterHideAllHelpPopups"
|
43
|
-
@hide-all-help-popups="isShowFirstStepHelp = false"
|
44
|
-
/>
|
45
|
-
</template>
|
46
|
-
</ui-wizard-block>
|
47
|
-
|
48
|
-
<ui-wizard-block
|
49
|
-
v-if="selectedStep.id === dynamicSteps.name"
|
50
|
-
:sub-title-height="height1"
|
51
|
-
>
|
52
|
-
<template #subTitle>
|
53
|
-
<div ref="subTitleBlock1">
|
54
|
-
<div class="subtitle-block">
|
55
|
-
<ui-alert
|
56
|
-
v-if="props.alertMessages[dynamicSteps.name].length"
|
57
|
-
:messages="props.alertMessages[dynamicSteps.name]"
|
58
|
-
test-id="add-host-connection-settings-error-alert"
|
59
|
-
type="error"
|
60
|
-
size="md"
|
61
|
-
class="subtitle-block__alert"
|
62
|
-
/>
|
63
|
-
|
64
|
-
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
65
|
-
</div>
|
66
|
-
</div>
|
67
|
-
</template>
|
68
|
-
<template #content>
|
69
|
-
<common-backup-storage-actions-add-steps-name
|
70
|
-
v-if="selectedStep.id === dynamicSteps.name"
|
71
|
-
v-model="formModelLocal"
|
72
|
-
:project="props.project"
|
73
|
-
:alert-messages="props.alertMessages[dynamicSteps.name]"
|
74
|
-
:messages-fields="selectedStep.fields"
|
75
|
-
:is-disabled-name-field="wizard.wizardLoader.status"
|
76
|
-
/>
|
77
|
-
</template>
|
78
|
-
</ui-wizard-block>
|
79
|
-
|
80
|
-
<ui-wizard-block
|
81
|
-
v-if="selectedStep.id === dynamicSteps.nameAndConfigure"
|
82
|
-
:sub-title-height="height2"
|
83
|
-
>
|
84
|
-
<template #subTitle>
|
85
|
-
<div ref="subTitleBlock2">
|
86
|
-
<div class="subtitle-block">
|
87
|
-
<ui-alert
|
88
|
-
v-if="props.alertMessages[dynamicSteps.nameAndConfigure].length"
|
89
|
-
:messages="props.alertMessages[dynamicSteps.nameAndConfigure]"
|
90
|
-
test-id="add-host-connection-settings-error-alert"
|
91
|
-
type="error"
|
92
|
-
size="md"
|
93
|
-
class="subtitle-block__alert"
|
94
|
-
/>
|
95
|
-
|
96
|
-
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
97
|
-
</div>
|
98
|
-
</div>
|
99
|
-
</template>
|
100
|
-
<template #content>
|
101
|
-
<common-backup-storage-actions-add-steps-name-and-configure
|
102
|
-
v-if="selectedStep.id === dynamicSteps.nameAndConfigure"
|
103
|
-
v-model="formModelLocal"
|
104
|
-
:
|
105
|
-
:
|
106
|
-
:
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
:datastore="props.
|
136
|
-
:
|
137
|
-
|
138
|
-
hide-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
"
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
v-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
"
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
:
|
196
|
-
:
|
197
|
-
:
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
import {
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
import type
|
213
|
-
import type {
|
214
|
-
import type {
|
215
|
-
import type {
|
216
|
-
import type {
|
217
|
-
import
|
218
|
-
|
219
|
-
|
220
|
-
const
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
(event: 'change-
|
234
|
-
(event: '
|
235
|
-
(event: '
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
const
|
256
|
-
const
|
257
|
-
|
258
|
-
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
const
|
263
|
-
|
264
|
-
|
265
|
-
const
|
266
|
-
|
267
|
-
|
268
|
-
const
|
269
|
-
|
270
|
-
|
271
|
-
const
|
272
|
-
|
273
|
-
|
274
|
-
const
|
275
|
-
|
276
|
-
|
277
|
-
const
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
const
|
286
|
-
|
287
|
-
|
288
|
-
|
289
|
-
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
</style>
|
1
|
+
<template>
|
2
|
+
<ui-wizard
|
3
|
+
show
|
4
|
+
:steps="props.wizard.steps"
|
5
|
+
:selected-scheme="props.selectedScheme"
|
6
|
+
:is-loading="props.wizard.wizardLoader.status"
|
7
|
+
:title="props.title"
|
8
|
+
:texts="texts"
|
9
|
+
test-id="add-datastore-wizard"
|
10
|
+
@change-steps="onChangeSteps"
|
11
|
+
@hide="onHideModal"
|
12
|
+
@submit="onCreateDatastore"
|
13
|
+
>
|
14
|
+
<template #content="{ selectedStep }">
|
15
|
+
<ui-wizard-block
|
16
|
+
v-if="selectedStep.id === dynamicSteps.type"
|
17
|
+
:sub-title-height="height0"
|
18
|
+
>
|
19
|
+
<template #subTitle>
|
20
|
+
<div ref="subTitleBlock0">
|
21
|
+
<div class="subtitle-block flex-row items-start">
|
22
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
23
|
+
|
24
|
+
<common-tooltip-help
|
25
|
+
:title="localization.common.information"
|
26
|
+
:help-text="localization.common.datastoreTypeHelpDesc"
|
27
|
+
:is-show-help="isShowFirstStepHelp"
|
28
|
+
test-id="datastore-type-subtitle-tooltip"
|
29
|
+
help-id="datastore-type-subtitle-tooltip-icon"
|
30
|
+
dropdown-width="320px"
|
31
|
+
dropdown-left
|
32
|
+
class="ml-2"
|
33
|
+
@update-is-show="onUpdateIsShowFirstStepHelp"
|
34
|
+
/>
|
35
|
+
</div>
|
36
|
+
</div>
|
37
|
+
</template>
|
38
|
+
<template #content>
|
39
|
+
<common-backup-storage-actions-add-steps-type-mode
|
40
|
+
v-if="selectedStep.id === dynamicSteps.type"
|
41
|
+
v-model="formModelLocal.type_code"
|
42
|
+
:updater-hide-all-help-popups="updaterHideAllHelpPopups"
|
43
|
+
@hide-all-help-popups="isShowFirstStepHelp = false"
|
44
|
+
/>
|
45
|
+
</template>
|
46
|
+
</ui-wizard-block>
|
47
|
+
|
48
|
+
<ui-wizard-block
|
49
|
+
v-if="selectedStep.id === dynamicSteps.name"
|
50
|
+
:sub-title-height="height1"
|
51
|
+
>
|
52
|
+
<template #subTitle>
|
53
|
+
<div ref="subTitleBlock1">
|
54
|
+
<div class="subtitle-block">
|
55
|
+
<ui-alert
|
56
|
+
v-if="props.alertMessages[dynamicSteps.name].length"
|
57
|
+
:messages="props.alertMessages[dynamicSteps.name]"
|
58
|
+
test-id="add-host-connection-settings-error-alert"
|
59
|
+
type="error"
|
60
|
+
size="md"
|
61
|
+
class="subtitle-block__alert"
|
62
|
+
/>
|
63
|
+
|
64
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
65
|
+
</div>
|
66
|
+
</div>
|
67
|
+
</template>
|
68
|
+
<template #content>
|
69
|
+
<common-backup-storage-actions-add-steps-name
|
70
|
+
v-if="selectedStep.id === dynamicSteps.name"
|
71
|
+
v-model="formModelLocal"
|
72
|
+
:project="props.project"
|
73
|
+
:alert-messages="props.alertMessages[dynamicSteps.name]"
|
74
|
+
:messages-fields="selectedStep.fields"
|
75
|
+
:is-disabled-name-field="wizard.wizardLoader.status"
|
76
|
+
/>
|
77
|
+
</template>
|
78
|
+
</ui-wizard-block>
|
79
|
+
|
80
|
+
<ui-wizard-block
|
81
|
+
v-if="selectedStep.id === dynamicSteps.nameAndConfigure"
|
82
|
+
:sub-title-height="height2"
|
83
|
+
>
|
84
|
+
<template #subTitle>
|
85
|
+
<div ref="subTitleBlock2">
|
86
|
+
<div class="subtitle-block">
|
87
|
+
<ui-alert
|
88
|
+
v-if="props.alertMessages[dynamicSteps.nameAndConfigure].length"
|
89
|
+
:messages="props.alertMessages[dynamicSteps.nameAndConfigure]"
|
90
|
+
test-id="add-host-connection-settings-error-alert"
|
91
|
+
type="error"
|
92
|
+
size="md"
|
93
|
+
class="subtitle-block__alert"
|
94
|
+
/>
|
95
|
+
|
96
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
97
|
+
</div>
|
98
|
+
</div>
|
99
|
+
</template>
|
100
|
+
<template #content>
|
101
|
+
<common-backup-storage-actions-add-steps-name-and-configure
|
102
|
+
v-if="selectedStep.id === dynamicSteps.nameAndConfigure"
|
103
|
+
v-model="formModelLocal"
|
104
|
+
:alert-messages="props.alertMessages"
|
105
|
+
:messages-fields="selectedStep.fields"
|
106
|
+
:is-disabled-name-field="wizard.wizardLoader.status"
|
107
|
+
/>
|
108
|
+
</template>
|
109
|
+
</ui-wizard-block>
|
110
|
+
|
111
|
+
<ui-wizard-block
|
112
|
+
v-if="selectedStep.id === dynamicSteps.storage"
|
113
|
+
:sub-title-height="height3"
|
114
|
+
>
|
115
|
+
<template #subTitle>
|
116
|
+
<div ref="subTitleBlock3">
|
117
|
+
<div class="subtitle-block">
|
118
|
+
<ui-alert
|
119
|
+
v-if="props.alertMessages[dynamicSteps.storage].length"
|
120
|
+
:messages="props.alertMessages[dynamicSteps.storage]"
|
121
|
+
test-id="add-host-accessibility-error-alert"
|
122
|
+
type="error"
|
123
|
+
size="md"
|
124
|
+
class="subtitle-block__alert"
|
125
|
+
/>
|
126
|
+
|
127
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
128
|
+
</div>
|
129
|
+
</div>
|
130
|
+
</template>
|
131
|
+
<template #content>
|
132
|
+
<div class="pb-4">
|
133
|
+
<common-vm-actions-common-select-storage
|
134
|
+
:datastore="props.datastore"
|
135
|
+
:is-datastore-loading="props.isDatastoreLoading"
|
136
|
+
:get-datastore-table-func="props.getDatastoreTableFunc"
|
137
|
+
hide-compatibility
|
138
|
+
hide-alert
|
139
|
+
class="storage-datatable h-full"
|
140
|
+
@change-storage="onChangeStorage"
|
141
|
+
/>
|
142
|
+
</div>
|
143
|
+
</template>
|
144
|
+
</ui-wizard-block>
|
145
|
+
|
146
|
+
<ui-wizard-block
|
147
|
+
v-if="selectedStep.id === dynamicSteps.hostAccessibility"
|
148
|
+
:sub-title-height="height4"
|
149
|
+
>
|
150
|
+
<template #subTitle>
|
151
|
+
<div ref="subTitleBlock4">
|
152
|
+
<div class="subtitle-block">
|
153
|
+
<ui-alert
|
154
|
+
v-if="
|
155
|
+
props.alertMessages[dynamicSteps.hostAccessibility].length
|
156
|
+
"
|
157
|
+
:messages="props.alertMessages[dynamicSteps.hostAccessibility]"
|
158
|
+
test-id="add-host-accessibility-error-alert"
|
159
|
+
type="error"
|
160
|
+
size="md"
|
161
|
+
class="subtitle-block__alert"
|
162
|
+
/>
|
163
|
+
|
164
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
165
|
+
</div>
|
166
|
+
</div>
|
167
|
+
</template>
|
168
|
+
<template #content>
|
169
|
+
<common-backup-storage-actions-add-steps-host-accessibility
|
170
|
+
v-if="selectedStep.id === dynamicSteps.hostAccessibility"
|
171
|
+
v-model="formModelLocal.hosts"
|
172
|
+
:alert-messages="
|
173
|
+
props.alertMessages[dynamicSteps.hostAccessibility]
|
174
|
+
"
|
175
|
+
:hosts="props.hosts"
|
176
|
+
/>
|
177
|
+
</template>
|
178
|
+
</ui-wizard-block>
|
179
|
+
|
180
|
+
<ui-wizard-block
|
181
|
+
v-if="selectedStep.id === dynamicSteps.readyComplete"
|
182
|
+
:sub-title-height="height5"
|
183
|
+
>
|
184
|
+
<template #subTitle>
|
185
|
+
<div ref="subTitleBlock5">
|
186
|
+
<div class="subtitle-block">
|
187
|
+
<ui-wizard-subtitle :sub-title="selectedStep.subTitle" />
|
188
|
+
</div>
|
189
|
+
</div>
|
190
|
+
</template>
|
191
|
+
<template #content>
|
192
|
+
<common-backup-storage-actions-add-steps-ready-complete
|
193
|
+
v-if="selectedStep.id === dynamicSteps.readyComplete"
|
194
|
+
:form="formModelLocal"
|
195
|
+
:project="props.project"
|
196
|
+
:hosts="props.hosts"
|
197
|
+
:datastore="props.datastore"
|
198
|
+
/>
|
199
|
+
</template>
|
200
|
+
</ui-wizard-block>
|
201
|
+
</template>
|
202
|
+
</ui-wizard>
|
203
|
+
</template>
|
204
|
+
|
205
|
+
<script setup lang="ts">
|
206
|
+
import { useElementSize } from '@vueuse/core'
|
207
|
+
import type {
|
208
|
+
UI_I_WizardStep,
|
209
|
+
UI_I_WizardTexts,
|
210
|
+
} from '~/node_modules/bfg-uikit/components/ui/wizard/lib/models/interfaces'
|
211
|
+
import type Wizard from '~/node_modules/bfg-uikit/components/ui/wizard/lib/utils/utils'
|
212
|
+
import type { UI_I_Localization } from '~/lib/models/interfaces'
|
213
|
+
import type { UI_T_Project } from '~/lib/models/types'
|
214
|
+
import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
|
215
|
+
import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
|
216
|
+
import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
|
217
|
+
import { dynamicSteps } from '~/components/common/backup/storage/actions/add/lib/config/steps'
|
218
|
+
|
219
|
+
const formModelLocal = defineModel<UI_I_CreateDatastoreForm>({ required: true })
|
220
|
+
const props = defineProps<{
|
221
|
+
project: UI_T_Project
|
222
|
+
wizard: Wizard
|
223
|
+
selectedScheme: number[]
|
224
|
+
alertMessages: string[][]
|
225
|
+
title: string
|
226
|
+
datastore: UI_I_DatastoreTableItem[]
|
227
|
+
isDatastoreLoading: boolean
|
228
|
+
getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
|
229
|
+
hosts?: any[]
|
230
|
+
}>()
|
231
|
+
const emits = defineEmits<{
|
232
|
+
(event: 'change-steps', value: UI_I_WizardStep[]): void
|
233
|
+
(event: 'change-storage', value: UI_I_WizardStep[]): void
|
234
|
+
(event: 'hide'): void
|
235
|
+
(event: 'submit', value: any): void
|
236
|
+
}>()
|
237
|
+
|
238
|
+
const localization = computed<UI_I_Localization>(() => useLocal())
|
239
|
+
|
240
|
+
const texts = computed<UI_I_WizardTexts>(() => ({
|
241
|
+
cancel: localization.value.common.cancel,
|
242
|
+
back: localization.value.common.backCap,
|
243
|
+
processing: localization.value.common.processing,
|
244
|
+
next: localization.value.common.next,
|
245
|
+
finish: localization.value.common.create,
|
246
|
+
incompleteTitle: localization.value.common.incompleteProcess,
|
247
|
+
incompleteMessage: localization.value.common.incompleteProcessMessage,
|
248
|
+
incompleteCancel: localization.value.common.cancel,
|
249
|
+
incompleteLeave: localization.value.common.leave,
|
250
|
+
step: localization.value.common.step,
|
251
|
+
of: localization.value.common.of2,
|
252
|
+
}))
|
253
|
+
|
254
|
+
const updaterHideAllHelpPopups = ref<number>(0)
|
255
|
+
const isShowFirstStepHelp = ref<boolean>(false)
|
256
|
+
const onUpdateIsShowFirstStepHelp = (value: boolean): void => {
|
257
|
+
updaterHideAllHelpPopups.value++
|
258
|
+
isShowFirstStepHelp.value = value
|
259
|
+
}
|
260
|
+
|
261
|
+
const subTitleBlock0 = ref<HTMLElement | null>(null)
|
262
|
+
const { height: height0 } = useElementSize(subTitleBlock0)
|
263
|
+
|
264
|
+
const subTitleBlock1 = ref<HTMLElement | null>(null)
|
265
|
+
const { height: height1 } = useElementSize(subTitleBlock1)
|
266
|
+
|
267
|
+
const subTitleBlock2 = ref<HTMLElement | null>(null)
|
268
|
+
const { height: height2 } = useElementSize(subTitleBlock2)
|
269
|
+
|
270
|
+
const subTitleBlock3 = ref<HTMLElement | null>(null)
|
271
|
+
const { height: height3 } = useElementSize(subTitleBlock3)
|
272
|
+
|
273
|
+
const subTitleBlock4 = ref<HTMLElement | null>(null)
|
274
|
+
const { height: height4 } = useElementSize(subTitleBlock4)
|
275
|
+
|
276
|
+
const subTitleBlock5 = ref<HTMLElement | null>(null)
|
277
|
+
const { height: height5 } = useElementSize(subTitleBlock5)
|
278
|
+
|
279
|
+
const onChangeSteps = async (value: UI_I_WizardStep[]): Promise<void> =>
|
280
|
+
emits('change-steps', value)
|
281
|
+
const onChangeStorage = async (value: UI_I_WizardStep[]): Promise<void> =>
|
282
|
+
emits('change-storage', value)
|
283
|
+
|
284
|
+
const onHideModal = (): void => emits('hide')
|
285
|
+
const onCreateDatastore = (): void => emits('submit')
|
286
|
+
</script>
|
287
|
+
|
288
|
+
<style scoped lang="scss">
|
289
|
+
.subtitle-block {
|
290
|
+
display: flex;
|
291
|
+
flex-direction: column;
|
292
|
+
row-gap: 16px;
|
293
|
+
border-bottom: 1px solid var(--wizard-line);
|
294
|
+
padding-bottom: 12px;
|
295
|
+
|
296
|
+
&.flex-row {
|
297
|
+
flex-direction: row;
|
298
|
+
}
|
299
|
+
|
300
|
+
:deep(&__alert) {
|
301
|
+
padding: 10px 12px;
|
302
|
+
}
|
303
|
+
}
|
304
|
+
</style>
|
@@ -29,7 +29,6 @@
|
|
29
29
|
<common-backup-storage-actions-add-steps-name-and-configure
|
30
30
|
v-if="selectedStep.id === dynamicSteps.nameAndConfigure"
|
31
31
|
v-model="formModelLocal"
|
32
|
-
:project="props.project"
|
33
32
|
:messages-fields="selectedStep.fields"
|
34
33
|
:alert-messages="props.alertMessages[dynamicSteps.nameAndConfigure]"
|
35
34
|
/>
|
@@ -125,75 +125,65 @@ export const checkServerSync = (
|
|
125
125
|
}
|
126
126
|
}
|
127
127
|
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
): UI_I_ValidationReturn => {
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
value
|
188
|
-
)
|
189
|
-
}
|
190
|
-
}
|
191
|
-
|
192
|
-
return {
|
193
|
-
newValue: value,
|
194
|
-
stepHasError,
|
195
|
-
}
|
196
|
-
}
|
128
|
+
// PC-2542
|
129
|
+
// export const checkUsernameSync = (
|
130
|
+
// localization: UI_I_Localization,
|
131
|
+
// name: string,
|
132
|
+
// wizard: Wizard,
|
133
|
+
// value: UI_I_WizardStep[]
|
134
|
+
// ): UI_I_ValidationReturn => {
|
135
|
+
// let stepHasError = false
|
136
|
+
//
|
137
|
+
// if (!name) {
|
138
|
+
// stepHasError = wizard.setValidation(dynamicSteps.nameAndConfigure, 'user', {
|
139
|
+
// fieldMessage: localization.common.fieldRequired,
|
140
|
+
// alertMessage: '',
|
141
|
+
// })
|
142
|
+
// } else if (wizard.hasMessage(dynamicSteps.nameAndConfigure, 'user')) {
|
143
|
+
// value = wizard.removeValidation(
|
144
|
+
// dynamicSteps.nameAndConfigure,
|
145
|
+
// 'user',
|
146
|
+
// value
|
147
|
+
// )
|
148
|
+
// }
|
149
|
+
//
|
150
|
+
// return {
|
151
|
+
// newValue: value,
|
152
|
+
// stepHasError,
|
153
|
+
// }
|
154
|
+
// }
|
155
|
+
|
156
|
+
// PC-2542
|
157
|
+
// export const checkPasswordSync = (
|
158
|
+
// localization: UI_I_Localization,
|
159
|
+
// name: string,
|
160
|
+
// wizard: Wizard,
|
161
|
+
// value: UI_I_WizardStep[]
|
162
|
+
// ): UI_I_ValidationReturn => {
|
163
|
+
// let stepHasError = false
|
164
|
+
//
|
165
|
+
// if (!name) {
|
166
|
+
// stepHasError = wizard.setValidation(
|
167
|
+
// dynamicSteps.nameAndConfigure,
|
168
|
+
// 'password',
|
169
|
+
// {
|
170
|
+
// fieldMessage: localization.common.fieldRequired,
|
171
|
+
// alertMessage: '',
|
172
|
+
// }
|
173
|
+
// )
|
174
|
+
// } else if (wizard.hasMessage(dynamicSteps.nameAndConfigure, 'password')) {
|
175
|
+
// value = wizard.removeValidation(
|
176
|
+
// dynamicSteps.nameAndConfigure,
|
177
|
+
// 'password',
|
178
|
+
// value
|
179
|
+
// )
|
180
|
+
// }
|
181
|
+
//
|
182
|
+
// return {
|
183
|
+
// newValue: value,
|
184
|
+
// stepHasError,
|
185
|
+
// }
|
186
|
+
// }
|
197
187
|
|
198
188
|
export const checkHostsAccessibilitySync = (
|
199
189
|
localization: UI_I_Localization,
|
package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigure.vue
CHANGED
@@ -6,7 +6,6 @@
|
|
6
6
|
:alert-messages="props.alertMessages"
|
7
7
|
:messages-fields="props.messagesFields"
|
8
8
|
:is-disabled-name-field="props.isDisabledNameField"
|
9
|
-
:project="props.project"
|
10
9
|
/>
|
11
10
|
|
12
11
|
<common-backup-storage-actions-add-steps-name-and-configure-old
|
@@ -15,19 +14,16 @@
|
|
15
14
|
v-model:alert-info="isShowAlertInfo"
|
16
15
|
:alert-messages="props.alertMessages"
|
17
16
|
:messages-fields="props.messagesFields"
|
18
|
-
:project="props.project"
|
19
17
|
@hide-alert="(e) => emits('hide-alert', e)"
|
20
18
|
/>
|
21
19
|
</template>
|
22
20
|
|
23
21
|
<script lang="ts" setup>
|
24
|
-
import type { UI_T_Project } from '~/lib/models/types'
|
25
22
|
import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
|
26
23
|
import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
|
27
24
|
|
28
25
|
const formModel = defineModel<UI_I_CreateDatastoreForm>({ required: true })
|
29
26
|
const props = defineProps<{
|
30
|
-
project: UI_T_Project
|
31
27
|
alertMessages: string[]
|
32
28
|
messagesFields: UI_I_WizardStep['fields']
|
33
29
|
isDisabledNameField?: boolean
|
package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureNew.vue
CHANGED
@@ -88,51 +88,47 @@
|
|
88
88
|
</div>
|
89
89
|
|
90
90
|
<!-- PC-2542-->
|
91
|
-
<
|
92
|
-
<div class="basics-step-line"></div>
|
91
|
+
<!-- <div class="basics-step-line"></div>-->
|
93
92
|
|
94
|
-
<div class="basics-step-row"
|
95
|
-
<div class="basics-step-row-title"
|
96
|
-
<span class="basics-step-row-title-text"
|
97
|
-
{{ localization.auth.username }}
|
98
|
-
</span
|
99
|
-
</div
|
100
|
-
<div class="basics-step-row-content"
|
101
|
-
<ui-input
|
102
|
-
id="configuration-username-input"
|
103
|
-
v-model="formModelLocal.user"
|
104
|
-
:placeholder="localization.auth.username"
|
105
|
-
:error="usernameErrorText"
|
106
|
-
:disabled="props.isDisabledNameField"
|
107
|
-
test-id="configuration-username-input"
|
108
|
-
|
109
|
-
</div
|
110
|
-
</div
|
111
|
-
</template>
|
93
|
+
<!-- <div class="basics-step-row">-->
|
94
|
+
<!-- <div class="basics-step-row-title">-->
|
95
|
+
<!-- <span class="basics-step-row-title-text">-->
|
96
|
+
<!-- {{ localization.auth.username }}-->
|
97
|
+
<!-- </span>-->
|
98
|
+
<!-- </div>-->
|
99
|
+
<!-- <div class="basics-step-row-content">-->
|
100
|
+
<!-- <ui-input-->
|
101
|
+
<!-- id="configuration-username-input"-->
|
102
|
+
<!-- v-model="formModelLocal.user"-->
|
103
|
+
<!-- :placeholder="localization.auth.username"-->
|
104
|
+
<!-- :error="usernameErrorText"-->
|
105
|
+
<!-- :disabled="props.isDisabledNameField"-->
|
106
|
+
<!-- test-id="configuration-username-input"-->
|
107
|
+
<!-- />-->
|
108
|
+
<!-- </div>-->
|
109
|
+
<!-- </div>-->
|
112
110
|
|
113
111
|
<!-- PC-2542-->
|
114
|
-
<
|
115
|
-
<div class="basics-step-line"></div>
|
112
|
+
<!-- <div class="basics-step-line"></div>-->
|
116
113
|
|
117
|
-
<div class="basics-step-row"
|
118
|
-
<div class="basics-step-row-title"
|
119
|
-
<span class="basics-step-row-title-text"
|
120
|
-
{{ localization.auth.password }}
|
121
|
-
</span
|
122
|
-
</div
|
123
|
-
<div class="basics-step-row-content"
|
124
|
-
<ui-input
|
125
|
-
id="configuration-password-input"
|
126
|
-
v-model="formModelLocal.password"
|
127
|
-
:placeholder="localization.auth.password"
|
128
|
-
:error="passwordErrorText"
|
129
|
-
:disabled="props.isDisabledNameField"
|
130
|
-
type="password"
|
131
|
-
test-id="configuration-password-input"
|
132
|
-
|
133
|
-
</div
|
134
|
-
</div
|
135
|
-
</template>
|
114
|
+
<!-- <div class="basics-step-row">-->
|
115
|
+
<!-- <div class="basics-step-row-title">-->
|
116
|
+
<!-- <span class="basics-step-row-title-text">-->
|
117
|
+
<!-- {{ localization.auth.password }}-->
|
118
|
+
<!-- </span>-->
|
119
|
+
<!-- </div>-->
|
120
|
+
<!-- <div class="basics-step-row-content">-->
|
121
|
+
<!-- <ui-input-->
|
122
|
+
<!-- id="configuration-password-input"-->
|
123
|
+
<!-- v-model="formModelLocal.password"-->
|
124
|
+
<!-- :placeholder="localization.auth.password"-->
|
125
|
+
<!-- :error="passwordErrorText"-->
|
126
|
+
<!-- :disabled="props.isDisabledNameField"-->
|
127
|
+
<!-- type="password"-->
|
128
|
+
<!-- test-id="configuration-password-input"-->
|
129
|
+
<!-- />-->
|
130
|
+
<!-- </div>-->
|
131
|
+
<!-- </div>-->
|
136
132
|
</div>
|
137
133
|
</template>
|
138
134
|
|
@@ -140,7 +136,6 @@
|
|
140
136
|
import type { UI_I_Localization } from '~/lib/models/interfaces'
|
141
137
|
import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
|
142
138
|
import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
|
143
|
-
import type { UI_T_Project } from '~/lib/models/types'
|
144
139
|
|
145
140
|
const formModelLocal = defineModel<UI_I_CreateDatastoreForm>({ required: true })
|
146
141
|
const isShowAlertInfo = defineModel<boolean>('alertInfo', { required: true })
|
@@ -149,7 +144,6 @@ const props = defineProps<{
|
|
149
144
|
alertMessages: string[]
|
150
145
|
messagesFields: UI_I_WizardStep['fields']
|
151
146
|
isDisabledNameField?: boolean
|
152
|
-
project?: UI_T_Project
|
153
147
|
}>()
|
154
148
|
|
155
149
|
const localization = computed<UI_I_Localization>(() => useLocal())
|
@@ -188,20 +182,22 @@ const serverErrorText = computed<string>(() => {
|
|
188
182
|
})
|
189
183
|
|
190
184
|
/* Validation error text for Username input field */
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
185
|
+
// PC-2542
|
186
|
+
// const usernameErrorText = computed<string>(() => {
|
187
|
+
// if (isEmptyAlertMessages.value && props.messagesFields.user?.field) {
|
188
|
+
// return props.messagesFields.user.field
|
189
|
+
// }
|
190
|
+
// return ''
|
191
|
+
// })
|
197
192
|
|
198
193
|
/* Validation error text for Password input field */
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
194
|
+
// PC-2542
|
195
|
+
// const passwordErrorText = computed<string>(() => {
|
196
|
+
// if (isEmptyAlertMessages.value && props.messagesFields.password?.field) {
|
197
|
+
// return props.messagesFields.password.field
|
198
|
+
// }
|
199
|
+
// return ''
|
200
|
+
// })
|
205
201
|
</script>
|
206
202
|
|
207
203
|
<style scoped lang="scss">
|
package/components/common/backup/storage/actions/add/steps/nameAndConfigure/NameAndConfigureOld.vue
CHANGED
@@ -112,74 +112,68 @@
|
|
112
112
|
</div>
|
113
113
|
|
114
114
|
<!-- PC-2542-->
|
115
|
-
<div
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
class="
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
</div>
|
146
|
-
</div>
|
147
|
-
</div>
|
115
|
+
<!-- <div class="nd-mt-0 clr-form-control clr-row">-->
|
116
|
+
<!-- <label class="clr-control-label clr-col-md-2">-->
|
117
|
+
<!-- {{ localization.auth.username }}-->
|
118
|
+
<!-- </label>-->
|
119
|
+
|
120
|
+
<!-- <div-->
|
121
|
+
<!-- class="clr-control-container"-->
|
122
|
+
<!-- :class="usernameErrorText && 'clr-error'"-->
|
123
|
+
<!-- >-->
|
124
|
+
<!-- <div class="flex-align-center input-action-wrapper">-->
|
125
|
+
<!-- <input-->
|
126
|
+
<!-- id="configuration-username-input"-->
|
127
|
+
<!-- v-model="formModelLocal.user"-->
|
128
|
+
<!-- data-id="configuration-username-input"-->
|
129
|
+
<!-- type="text"-->
|
130
|
+
<!-- class="clr-input"-->
|
131
|
+
<!-- @blur="initValidation(true, ['user'])"-->
|
132
|
+
<!-- @input="initValidation(false, ['user'])"-->
|
133
|
+
<!-- />-->
|
134
|
+
<!-- <atoms-the-icon class="error-icon" name="info-circle" />-->
|
135
|
+
<!-- </div>-->
|
136
|
+
<!-- <div-->
|
137
|
+
<!-- v-if="usernameErrorText"-->
|
138
|
+
<!-- class="clr-subtext"-->
|
139
|
+
<!-- data-id="username-name-field-require"-->
|
140
|
+
<!-- >-->
|
141
|
+
<!-- {{ usernameErrorText }}-->
|
142
|
+
<!-- </div>-->
|
143
|
+
<!-- </div>-->
|
144
|
+
<!-- </div>-->
|
148
145
|
|
149
146
|
<!-- PC-2542-->
|
150
|
-
<div
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
class="
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
</div>
|
181
|
-
</div>
|
182
|
-
</div>
|
147
|
+
<!-- <div class="nd-mt-0 clr-form-control clr-row">-->
|
148
|
+
<!-- <label class="clr-control-label clr-col-md-2">-->
|
149
|
+
<!-- {{ localization.auth.password }}-->
|
150
|
+
<!-- </label>-->
|
151
|
+
|
152
|
+
<!-- <div-->
|
153
|
+
<!-- class="clr-control-container"-->
|
154
|
+
<!-- :class="passwordErrorText && 'clr-error'"-->
|
155
|
+
<!-- >-->
|
156
|
+
<!-- <div class="flex-align-center input-action-wrapper">-->
|
157
|
+
<!-- <input-->
|
158
|
+
<!-- id="configuration-password-input"-->
|
159
|
+
<!-- v-model="formModelLocal.password"-->
|
160
|
+
<!-- data-id="configuration-password-input"-->
|
161
|
+
<!-- type="password"-->
|
162
|
+
<!-- class="clr-input"-->
|
163
|
+
<!-- @blur="initValidation(true, ['password'])"-->
|
164
|
+
<!-- @input="initValidation(false, ['password'])"-->
|
165
|
+
<!-- />-->
|
166
|
+
<!-- <atoms-the-icon class="error-icon" name="info-circle" />-->
|
167
|
+
<!-- </div>-->
|
168
|
+
<!-- <div-->
|
169
|
+
<!-- v-if="passwordErrorText"-->
|
170
|
+
<!-- class="clr-subtext"-->
|
171
|
+
<!-- data-id="password-name-field-require"-->
|
172
|
+
<!-- >-->
|
173
|
+
<!-- {{ passwordErrorText }}-->
|
174
|
+
<!-- </div>-->
|
175
|
+
<!-- </div>-->
|
176
|
+
<!-- </div>-->
|
183
177
|
</div>
|
184
178
|
</template>
|
185
179
|
|
@@ -189,7 +183,6 @@ import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/inter
|
|
189
183
|
import type { UI_I_InitialValidationFields } from '~/components/common/backup/storage/actions/add/steps/nameAndConfigure/lib/models/interfaces'
|
190
184
|
import type { UI_I_CreateDatastoreForm } from '~/components/common/backup/storage/actions/add/lib/models/interfaces'
|
191
185
|
import type { UI_T_InitialValidationFields } from '~/components/common/backup/storage/actions/add/steps/nameAndConfigure/lib/models/types'
|
192
|
-
import type { UI_T_Project } from '~/lib/models/types'
|
193
186
|
import { dynamicSteps } from '~/components/common/backup/storage/actions/add/lib/config/steps'
|
194
187
|
|
195
188
|
const formModelLocal = defineModel<UI_I_CreateDatastoreForm>({ required: true })
|
@@ -198,7 +191,6 @@ const isShowAlertInfo = defineModel<boolean>('alertInfo', { required: true })
|
|
198
191
|
const props = defineProps<{
|
199
192
|
alertMessages: string[]
|
200
193
|
messagesFields: UI_I_WizardStep['fields']
|
201
|
-
project?: UI_T_Project
|
202
194
|
}>()
|
203
195
|
const emits = defineEmits<{
|
204
196
|
(event: 'hide-alert', value: number): void
|