bfg-common 1.4.832 → 1.4.834
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/assets/localization/local_en.json +1 -1
- package/components/common/modals/confirmByInput/ConfirmByInput.vue +10 -86
- package/components/common/modals/confirmByInput/ConfirmByInputNew.vue +1 -0
- package/components/common/modals/confirmByInput/ConfirmByInputOld.vue +4 -9
- package/lib/models/store/interfaces.ts +1 -0
- package/package.json +1 -1
|
@@ -2982,7 +2982,7 @@
|
|
|
2982
2982
|
"createSphereHaNetwork": "Create a Sphere HA network",
|
|
2983
2983
|
"prerequisitesDescOne": "This private network must be separate from the management network. It is used for internal communication between the nodes. For best performance, the network latency between the nodes should be less than or equal to 10ms.",
|
|
2984
2984
|
"reserveStaticIpAddressesNodes": "Reserve static IP addresses for all the nodes",
|
|
2985
|
-
"prerequisitesDescSecond": "These will be required in Sphere HA IP settings during the set up process."
|
|
2985
|
+
"prerequisitesDescSecond": "These will be required in Sphere HA IP settings during the set up process."
|
|
2986
2986
|
|
|
2987
2987
|
}
|
|
2988
2988
|
}
|
|
@@ -2,24 +2,26 @@
|
|
|
2
2
|
<common-modals-confirm-by-input-new
|
|
3
3
|
v-if="isNewViewLocal"
|
|
4
4
|
v-model="confirmationForm"
|
|
5
|
+
:is-valid="isValid"
|
|
5
6
|
:title="props.title"
|
|
6
7
|
:description="props.description"
|
|
7
8
|
:sub-title="props.subTitle"
|
|
8
9
|
:modal-texts="props.modalTexts"
|
|
9
10
|
:test-id="props.testId"
|
|
10
11
|
@hide="emits('hide')"
|
|
11
|
-
@confirm="
|
|
12
|
+
@confirm="onConfirm"
|
|
12
13
|
/>
|
|
13
14
|
<common-modals-confirm-by-input-old
|
|
14
15
|
v-else
|
|
15
16
|
v-model="confirmationForm"
|
|
17
|
+
:is-valid="isValid"
|
|
16
18
|
:title="props.title"
|
|
17
19
|
:sub-title="props.subTitle"
|
|
18
20
|
:test-id="props.testId"
|
|
19
21
|
:loading="props.loading"
|
|
20
22
|
:width="props.width"
|
|
21
23
|
@hide="emits('hide')"
|
|
22
|
-
@confirm="
|
|
24
|
+
@confirm="onConfirm"
|
|
23
25
|
>
|
|
24
26
|
<template #content>
|
|
25
27
|
<slot name="content" />
|
|
@@ -83,90 +85,12 @@ const isValid = computed<boolean>(() => {
|
|
|
83
85
|
// props.subTitle
|
|
84
86
|
// )
|
|
85
87
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
//
|
|
89
|
-
// emits('confirm')
|
|
90
|
-
// }
|
|
88
|
+
const onConfirm = async (): Promise<void> => {
|
|
89
|
+
if (!isValid.value) return
|
|
91
90
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
// }
|
|
95
|
-
</script>
|
|
96
|
-
|
|
97
|
-
<style lang="scss" scoped>
|
|
98
|
-
@import 'assets/scss/common/mixins.scss';
|
|
99
|
-
.confirm-by-input {
|
|
100
|
-
:deep(.modal-header) {
|
|
101
|
-
display: flex;
|
|
102
|
-
justify-content: space-between;
|
|
103
|
-
align-items: flex-start;
|
|
104
|
-
|
|
105
|
-
.modal-title {
|
|
106
|
-
color: var(--main-color-mode);
|
|
107
|
-
font-size: 24px;
|
|
108
|
-
max-width: 65%;
|
|
109
|
-
}
|
|
110
|
-
.secondary-title {
|
|
111
|
-
color: var(--modal-secondary-title);
|
|
112
|
-
font-size: 0.75rem;
|
|
113
|
-
font-weight: lighter;
|
|
114
|
-
user-select: none;
|
|
115
|
-
}
|
|
116
|
-
.separator {
|
|
117
|
-
content: '';
|
|
118
|
-
border-left: 1px solid #ccc;
|
|
119
|
-
margin: 0 18px;
|
|
120
|
-
height: 22px;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
.close-icon {
|
|
124
|
-
fill: var(--close-icon);
|
|
125
|
-
width: 24px;
|
|
126
|
-
height: 24px;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
&__body {
|
|
131
|
-
@include flex($align: flex-start);
|
|
132
|
-
|
|
133
|
-
.form-group {
|
|
134
|
-
margin-top: 20px;
|
|
135
|
-
|
|
136
|
-
label {
|
|
137
|
-
font-weight: bold;
|
|
138
|
-
font-size: 0.6rem;
|
|
139
|
-
user-select: none;
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
&:not(:first-child) input {
|
|
143
|
-
width: 100%;
|
|
144
|
-
}
|
|
145
|
-
&__input {
|
|
146
|
-
display: flex;
|
|
147
|
-
width: 100%;
|
|
148
|
-
min-height: 30px;
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
}
|
|
91
|
+
emits('confirm')
|
|
92
|
+
}
|
|
152
93
|
|
|
153
|
-
|
|
154
|
-
min-width: 48px;
|
|
155
|
-
height: 48px;
|
|
156
|
-
margin-right: 20px;
|
|
157
|
-
fill: #c27b00;
|
|
158
|
-
}
|
|
94
|
+
</script>
|
|
159
95
|
|
|
160
|
-
|
|
161
|
-
&__loading {
|
|
162
|
-
:deep(.spinner) {
|
|
163
|
-
width: 25px;
|
|
164
|
-
height: 25px;
|
|
165
|
-
min-width: 25px;
|
|
166
|
-
min-height: 25px;
|
|
167
|
-
margin-top: 5px;
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
</style>
|
|
96
|
+
<style lang="scss" scoped></style>
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
@keyup.enter="onConfirm"
|
|
35
35
|
/>
|
|
36
36
|
<div
|
|
37
|
-
v-show="!isValid && confirmationFormLocal"
|
|
37
|
+
v-show="!props.isValid && confirmationFormLocal"
|
|
38
38
|
class="form-validate"
|
|
39
39
|
>
|
|
40
40
|
<atoms-tooltip :test-id="`${props.testId}-tooltip`">
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
:data-id="`${props.testId}-modal-apply-button`"
|
|
71
71
|
class="btn btn-primary"
|
|
72
72
|
:class="props.loading && 'modal-dialog__loader'"
|
|
73
|
-
:disabled="!isValid || props.loading"
|
|
73
|
+
:disabled="!props.isValid || props.loading"
|
|
74
74
|
@click="onConfirm"
|
|
75
75
|
>
|
|
76
76
|
<atoms-loader-pre-loader
|
|
@@ -94,6 +94,7 @@ import type { UI_I_Localization } from '~/lib/models/interfaces'
|
|
|
94
94
|
const props = defineProps<{
|
|
95
95
|
title: string
|
|
96
96
|
subTitle: string
|
|
97
|
+
isValid: boolean
|
|
97
98
|
testId: string
|
|
98
99
|
width: string
|
|
99
100
|
loading?: boolean
|
|
@@ -106,10 +107,6 @@ const emits = defineEmits<{
|
|
|
106
107
|
|
|
107
108
|
const localization = computed<UI_I_Localization>(() => useLocal())
|
|
108
109
|
|
|
109
|
-
const isValid = computed<boolean>(() => {
|
|
110
|
-
return confirmationFormLocal.value === props.subTitle
|
|
111
|
-
})
|
|
112
|
-
|
|
113
110
|
const confirmationText = localization.value.common.confirmDeletionInput.replace(
|
|
114
111
|
'{title}',
|
|
115
112
|
props.subTitle
|
|
@@ -120,9 +117,7 @@ const confirmDeletionInputError =
|
|
|
120
117
|
props.subTitle
|
|
121
118
|
)
|
|
122
119
|
|
|
123
|
-
const onConfirm =
|
|
124
|
-
if (!isValid.value) return
|
|
125
|
-
|
|
120
|
+
const onConfirm = (): void => {
|
|
126
121
|
emits('confirm')
|
|
127
122
|
}
|
|
128
123
|
|