Skip to content

Commit 5c2db28

Browse files
Nikhil-AshokaNikhil-Ashoka
authored
Adding delay to Delete and disabling tables (#155)
- Delete would take time to update the table as add and edit, Added delay to delete as well. - Also, disabling the tables when the process of add, edit, delete and other related property changes are in-progress to avoid issues. - Defect: https://jazz07.rchland.ibm.com:13443/jazz/web/projects/CSSD#action=com.ibm.team.workitem.viewWorkItem&id=578982 Signed-off-by: Nikhil Ashoka <[email protected]>
1 parent f057435 commit 5c2db28

File tree

5 files changed

+108
-44
lines changed

5 files changed

+108
-44
lines changed

‎src/store/modules/Settings/NetworkStore.js

+28-8
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ const NetworkStore = {
1111
networkSettings: [],
1212
selectedInterfaceId: '', // which tab is selected
1313
selectedInterfaceIndex: 0, // which tab is selected
14+
isTableBusy: false,
1415
},
1516
getters: {
1617
dchpEnabledState: (state) => state.dchpEnabledState,
@@ -19,6 +20,7 @@ const NetworkStore = {
1920
networkSettings: (state) => state.networkSettings,
2021
selectedInterfaceId: (state) => state.selectedInterfaceId,
2122
selectedInterfaceIndex: (state) => state.selectedInterfaceIndex,
23+
isTableBusy: (state) => state.isTableBusy,
2224
},
2325
mutations: {
2426
setDchpEnabledState: (state, dchpEnabledState) =>
@@ -39,6 +41,7 @@ const NetworkStore = {
3941
(state.selectedInterfaceId = selectedInterfaceId),
4042
setSelectedInterfaceIndex: (state, selectedInterfaceIndex) =>
4143
(state.selectedInterfaceIndex = selectedInterfaceIndex),
44+
setIsTableBusy: (state, isTableBusy) => (state.isTableBusy = isTableBusy),
4245
setNetworkSettings: (state, data) => {
4346
state.networkSettings = data.map(({ data }) => {
4447
const {
@@ -121,10 +124,14 @@ const NetworkStore = {
121124
console.log('Network Data:', error);
122125
});
123126
},
124-
async getEthernetDataAfterDelay({ dispatch }) {
127+
async getEthernetDataAfterDelay({ commit, dispatch }) {
128+
commit('setIsTableBusy', true);
125129
setTimeout(() => {
126130
dispatch('getEthernetData');
127131
}, 10000);
132+
setTimeout(() => {
133+
commit('setIsTableBusy', false);
134+
}, 15000);
128135
},
129136
async saveDomainNameState({ commit, state, dispatch }, domainState) {
130137
commit('setDomainNameState', domainState);
@@ -295,10 +302,8 @@ const NetworkStore = {
295302
.then(() => {
296303
// Getting Ethernet data here so that the toggle gets updated
297304
dispatch('getEthernetData');
298-
setTimeout(() => {
299-
// Getting Ethernet data here so that the IPv6 table gets updated
300-
dispatch('getEthernetData');
301-
}, 10000);
305+
// Getting Ethernet data here so that the IPv6 table gets updated
306+
dispatch('getEthernetDataAfterDelay');
302307
})
303308
.then(() => {
304309
return i18n.t('pageNetwork.toast.successSaveNetworkSettings', {
@@ -459,7 +464,12 @@ const NetworkStore = {
459464
`/redfish/v1/Managers/bmc/EthernetInterfaces/${state.selectedInterfaceId}`,
460465
{ IPv4StaticAddresses: newIpv4Array }
461466
)
462-
.then(dispatch('getEthernetData'))
467+
.then(() => {
468+
// Getting Ethernet data here so that the address is deleted immediately
469+
dispatch('getEthernetData');
470+
// Getting Ethernet data here so that the IPv4 table gets updated
471+
dispatch('getEthernetDataAfterDelay');
472+
})
463473
.then(() => {
464474
return i18n.t('pageNetwork.toast.successDeletingIpv4Server');
465475
})
@@ -484,7 +494,12 @@ const NetworkStore = {
484494
`/redfish/v1/Managers/bmc/EthernetInterfaces/${state.selectedInterfaceId}`,
485495
{ IPv6StaticAddresses: newIpv6Array }
486496
)
487-
.then(dispatch('getEthernetData'))
497+
.then(() => {
498+
// Getting Ethernet data here so that the address is deleted immediately
499+
dispatch('getEthernetData');
500+
// Getting Ethernet data here so that the IPv6 table gets updated
501+
dispatch('getEthernetDataAfterDelay');
502+
})
488503
.then(() => {
489504
return i18n.t('pageNetwork.toast.successDeletingIpv6Server');
490505
})
@@ -513,7 +528,12 @@ const NetworkStore = {
513528
`/redfish/v1/Managers/bmc/EthernetInterfaces/${state.selectedInterfaceId}`,
514529
{ IPv6StaticDefaultGateways: newIpv6Array }
515530
)
516-
.then(dispatch('getEthernetData'))
531+
.then(() => {
532+
// Getting Ethernet data here so that the address is deleted immediately
533+
dispatch('getEthernetData');
534+
// Getting Ethernet data here so that the table gets updated
535+
dispatch('getEthernetDataAfterDelay');
536+
})
517537
.then(() => {
518538
return i18n.t(
519539
'pageNetwork.toast.successDeletingIpv6StaticDefaultGateway'

‎src/views/Settings/Network/Network.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -290,7 +290,7 @@ export default {
290290
setEndLoaderAfterDelay() {
291291
setTimeout(() => {
292292
this.endLoader();
293-
}, 10000);
293+
}, 15000);
294294
},
295295
},
296296
};

‎src/views/Settings/Network/TableIpv4.vue

+26-9
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
v-model="dhcpEnabledState"
1212
data-test-id="networkSettings-switch-dhcpEnabled"
1313
switch
14+
:disabled="isTablesDisabled"
1415
@change="changeDhcpEnabledState"
1516
>
1617
<span v-if="dhcpEnabledState">
@@ -24,7 +25,11 @@
2425
</b-row>
2526
<b-row>
2627
<b-col class="text-right">
27-
<b-button variant="primary" @click="initIpv4Modal()">
28+
<b-button
29+
variant="primary"
30+
:disabled="isTablesDisabled"
31+
@click="initIpv4Modal()"
32+
>
2833
<icon-add />
2934
{{ $t('pageNetwork.table.addIpv4Address') }}
3035
</b-button>
@@ -36,6 +41,7 @@
3641
:fields="ipv4TableFields"
3742
:items="form.ipv4TableItems"
3843
:empty-text="$t('global.table.emptyMessage')"
44+
:busy="isTablesDisabled"
3945
class="mb-0"
4046
show-empty
4147
>
@@ -121,6 +127,9 @@ export default {
121127
};
122128
},
123129
computed: {
130+
isTablesDisabled() {
131+
return this.$store.getters['network/isTableBusy'];
132+
},
124133
network() {
125134
return this.$store.getters['network/networkSettings'];
126135
},
@@ -180,12 +189,14 @@ export default {
180189
});
181190
},
182191
onIpv4TableAction(action, $event, item) {
183-
if ($event === 'edit') {
184-
this.$root.$emit('edit-address', item);
185-
this.initIpv4Modal();
186-
}
187-
if ($event === 'delete') {
188-
this.deleteIpv4TableRow(item);
192+
if (!this.isTablesDisabled) {
193+
if ($event === 'edit') {
194+
this.$root.$emit('edit-address', item);
195+
this.initIpv4Modal();
196+
}
197+
if ($event === 'delete') {
198+
this.deleteIpv4TableRow(item);
199+
}
189200
}
190201
},
191202
deleteIpv4TableRow(item) {
@@ -216,7 +227,13 @@ export default {
216227
if (deleteConfirmed) {
217228
this.$store
218229
.dispatch('network/deleteIpv4Address', newIpv4Array)
219-
.then((message) => this.successToast(message))
230+
.then((message) => {
231+
this.successToast(message);
232+
this.startLoader();
233+
setTimeout(() => {
234+
this.endLoader();
235+
}, 15000);
236+
})
220237
.catch(({ message }) => this.errorToast(message));
221238
}
222239
});
@@ -252,7 +269,7 @@ export default {
252269
this.startLoader();
253270
setTimeout(() => {
254271
this.endLoader();
255-
}, 10000);
272+
}, 15000);
256273
})
257274
.catch(({ message }) => this.errorToast(message));
258275
} else {

‎src/views/Settings/Network/TableIpv6.vue

+29-18
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
id="dhcpIpv6Switch"
1111
v-model="dhcpEnabledState"
1212
switch
13+
:disabled="isTablesDisabled"
1314
@change="changeIpv6DhcpEnabledState"
1415
>
1516
<span v-if="dhcpEnabledState">
@@ -28,7 +29,7 @@
2829
id="ipv6AutoConfigSwitch"
2930
v-model="ipv6AutoConfigState"
3031
switch
31-
:disabled="!isAutoConfigLoaded"
32+
:disabled="isTablesDisabled"
3233
@change="changeIpv6AutoConfigState"
3334
>
3435
<span v-if="ipv6AutoConfigState">
@@ -48,7 +49,11 @@
4849
</b-row>
4950
<b-row>
5051
<b-col class="text-right">
51-
<b-button variant="primary" @click="initIpv6Modal()">
52+
<b-button
53+
variant="primary"
54+
:disabled="isTablesDisabled"
55+
@click="initIpv6Modal()"
56+
>
5257
<icon-add />
5358
{{ $t('pageNetwork.table.addIpv6Address') }}
5459
</b-button>
@@ -60,6 +65,7 @@
6065
:fields="ipv6TableFields"
6166
:items="form.ipv6TableItems"
6267
:empty-text="$t('global.table.emptyMessage')"
68+
:busy="isTablesDisabled"
6369
class="mb-0"
6470
show-empty
6571
>
@@ -110,7 +116,6 @@ export default {
110116
},
111117
data() {
112118
return {
113-
isAutoConfigLoaded: true,
114119
form: {
115120
ipv6TableItems: [],
116121
},
@@ -142,6 +147,9 @@ export default {
142147
};
143148
},
144149
computed: {
150+
isTablesDisabled() {
151+
return this.$store.getters['network/isTableBusy'];
152+
},
145153
network() {
146154
return this.$store.getters['network/networkSettings'];
147155
},
@@ -219,12 +227,14 @@ export default {
219227
});
220228
},
221229
onIpv6TableAction(action, $event, item) {
222-
if ($event === 'edit') {
223-
this.$root.$emit('edit-address', item);
224-
this.initIpv6Modal();
225-
}
226-
if ($event === 'delete') {
227-
this.deleteIpv6TableRow(item);
230+
if (!this.isTablesDisabled) {
231+
if ($event === 'edit') {
232+
this.$root.$emit('edit-address', item);
233+
this.initIpv6Modal();
234+
}
235+
if ($event === 'delete') {
236+
this.deleteIpv6TableRow(item);
237+
}
228238
}
229239
},
230240
deleteIpv6TableRow(item) {
@@ -254,7 +264,13 @@ export default {
254264
if (deleteConfirmed) {
255265
this.$store
256266
.dispatch('network/deleteIpv6Address', newIpv6Array)
257-
.then((message) => this.successToast(message))
267+
.then((message) => {
268+
this.successToast(message);
269+
this.startLoader();
270+
setTimeout(() => {
271+
this.endLoader();
272+
}, 15000);
273+
})
258274
.catch(({ message }) => this.errorToast(message));
259275
}
260276
});
@@ -270,26 +286,21 @@ export default {
270286
this.startLoader();
271287
setTimeout(() => {
272288
this.endLoader();
273-
}, 10000);
289+
}, 15000);
274290
})
275291
.catch(({ message }) => this.errorToast(message));
276292
},
277293
changeIpv6AutoConfigState(state) {
278-
this.isAutoConfigLoaded = false;
279294
this.$store
280295
.dispatch('network/saveIpv6AutoConfigState', state)
281296
.then((success) => {
282297
this.startLoader();
283298
this.successToast(success);
284299
setTimeout(() => {
285-
this.isAutoConfigLoaded = true;
286300
this.endLoader();
287-
}, 10000);
301+
}, 15000);
288302
})
289-
.catch(({ message }) => {
290-
this.isAutoConfigLoaded = true;
291-
this.errorToast(message);
292-
});
303+
.catch(({ message }) => this.errorToast(message));
293304
},
294305
},
295306
};

‎src/views/Settings/Network/TableIpv6StaticDefaultGateway.vue

+24-8
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,11 @@
33
<page-section :section-title="$t('pageNetwork.ipv6StaticDefaultGateway')">
44
<b-row>
55
<b-col class="text-right">
6-
<b-button variant="primary" @click="initIpv6DefaultGatewayModal()">
6+
<b-button
7+
variant="primary"
8+
:disabled="isTablesDisabled"
9+
@click="initIpv6DefaultGatewayModal()"
10+
>
711
<icon-add />
812
{{ $t('pageNetwork.table.addIpv6StaticDefaultGateway') }}
913
</b-button>
@@ -15,6 +19,7 @@
1519
:fields="ipv6DefaultGatewayTableFields"
1620
:items="form.ipv6DefaultGatewayTableItems"
1721
:empty-text="$t('global.table.emptyMessage')"
22+
:busy="isTablesDisabled"
1823
class="mb-0"
1924
show-empty
2025
>
@@ -94,6 +99,9 @@ export default {
9499
};
95100
},
96101
computed: {
102+
isTablesDisabled() {
103+
return this.$store.getters['network/isTableBusy'];
104+
},
97105
network() {
98106
return this.$store.getters['network/networkSettings'];
99107
},
@@ -139,12 +147,14 @@ export default {
139147
});
140148
},
141149
onIpv6DefaultGatewayTableAction(action, $event, item) {
142-
if ($event === 'edit') {
143-
this.$root.$emit('edit-address', item);
144-
this.initIpv6DefaultGatewayModal();
145-
}
146-
if ($event === 'delete') {
147-
this.deleteIpv6DefaultGatewayTableRow(item);
150+
if (!this.isTablesDisabled) {
151+
if ($event === 'edit') {
152+
this.$root.$emit('edit-address', item);
153+
this.initIpv6DefaultGatewayModal();
154+
}
155+
if ($event === 'delete') {
156+
this.deleteIpv6DefaultGatewayTableRow(item);
157+
}
148158
}
149159
},
150160
deleteIpv6DefaultGatewayTableRow(item) {
@@ -177,7 +187,13 @@ export default {
177187
'network/deleteIpv6StaticDefaultGatewayAddress',
178188
newIpv6Array
179189
)
180-
.then((message) => this.successToast(message))
190+
.then((message) => {
191+
this.successToast(message);
192+
this.startLoader();
193+
setTimeout(() => {
194+
this.endLoader();
195+
}, 15000);
196+
})
181197
.catch(({ message }) => this.errorToast(message));
182198
}
183199
});

0 commit comments

Comments
 (0)