Skip to content

Commit 81921b9

Browse files
committed
feat(ui): support dry run operations on every CRD form
1 parent b9d48b4 commit 81921b9

19 files changed

Lines changed: 817 additions & 291 deletions

stackgres-k8s/src/admin-ui/public/assets/css/sg-1.0.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -636,7 +636,7 @@ form.form .helpTooltip {
636636
padding-top: 25px;
637637
position: sticky;
638638
top: 90px;
639-
z-index: 3;
639+
z-index: 2;
640640
}
641641

642642
ul.steps {

stackgres-k8s/src/admin-ui/public/assets/css/style.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -817,7 +817,7 @@ form#login .warning {
817817
.loadingContainer.loading:after {
818818
display: block;
819819
content: " ";
820-
position: absolute;
820+
position: fixed;
821821
z-index: 2;
822822
top: 0;
823823
left: 0;

stackgres-k8s/src/admin-ui/src/api/sgApi.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,16 +34,16 @@ export default {
3434
return axios.get(baseURL + resources[resource])
3535
},
3636

37-
create(resource, data) {
38-
return axios.post(baseURL + resources[resource], data)
37+
create(resource, data, dryRun = false) {
38+
return axios.post(baseURL + resources[resource] + (dryRun ? '?dryRun=true' : ''), data)
3939
},
4040

41-
update(resource, data) {
42-
return axios.put(baseURL + resources[resource], data)
41+
update(resource, data, dryRun = false) {
42+
return axios.put(baseURL + resources[resource] + (dryRun ? '?dryRun=true' : ''), data)
4343
},
4444

45-
delete(resource, data) {
46-
return axios.delete(baseURL + resources[resource], data)
45+
delete(resource, data, dryRun = false) {
46+
return axios.delete(baseURL + resources[resource] + (dryRun ? '?dryRun=true' : ''), data)
4747
},
4848

4949
getResourceDetails(resource, namespace, name, details = '', query = '') {

stackgres-k8s/src/admin-ui/src/components/forms/CreateSGBackups.vue

Lines changed: 83 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,30 @@
5959
<button class="btn border" @click="cancel()">Cancel</button>
6060

6161
<button type="button" class="btn floatRight" @click="createBackup(true)">View Summary</button>
62+
<button
63+
type="button"
64+
class="btn border floatRight"
65+
title="Dry run mode helps to evaluate a request through the typical request stages without any storage persistance or resource allocation."
66+
@click="
67+
dryRun = true;
68+
createBackup();
69+
"
70+
>
71+
Dry Run
72+
</button>
6273
</form>
63-
64-
<CRDSummary :crd="previewCRD" kind="SGBackup" v-if="showSummary" @closeSummary="showSummary = false"></CRDSummary>
74+
75+
<CRDSummary
76+
v-if="showSummary"
77+
:crd="previewCRD"
78+
:dryRun="dryRun"
79+
kind="SGBackup"
80+
@closeSummary="
81+
showSummary = false;
82+
dryRun = false;
83+
previewCRD = {};
84+
"
85+
></CRDSummary>
6586
</div>
6687
</template>
6788

@@ -88,6 +109,7 @@
88109
return {
89110
editMode: vm.$route.name.includes('Edit'),
90111
editReady: false,
112+
dryRun: false,
91113
advancedMode: false,
92114
previewCRD: {},
93115
showSummary: false,
@@ -146,32 +168,44 @@
146168
createBackup(preview = false) {
147169
const vc = this;
148170
149-
if(vc.checkRequired()) {
171+
if(!vc.checkRequired()) {
172+
vc.dryRun = false;
173+
vc.showSummary = false;
174+
return;
175+
}
150176
151-
let backup = {
152-
"metadata": {
153-
"name": this.backupName,
154-
"namespace": this.backupNamespace
155-
},
156-
"spec": {
157-
"sgCluster": this.backupCluster,
158-
"managedLifecycle": this.managedLifecycle
159-
},
160-
"status": {}
161-
};
177+
store.commit('loading', true);
162178
163-
if(preview) {
179+
let backup = {
180+
"metadata": {
181+
"name": this.backupName,
182+
"namespace": this.backupNamespace
183+
},
184+
"spec": {
185+
"sgCluster": this.backupCluster,
186+
"managedLifecycle": this.managedLifecycle
187+
},
188+
"status": {}
189+
};
164190
165-
vc.previewCRD = {};
166-
vc.previewCRD['data'] = backup;
167-
vc.showSummary = true;
191+
if(preview) {
168192
169-
} else {
193+
vc.previewCRD = {};
194+
vc.previewCRD['data'] = backup;
195+
vc.showSummary = true;
196+
store.commit('loading', false);
197+
198+
} else {
170199
171-
if(this.editMode) {
172-
sgApi
173-
.update('sgbackups', backup)
174-
.then(function (response) {
200+
if(this.editMode) {
201+
sgApi
202+
.update('sgbackups', backup, vc.dryRun)
203+
.then(function (response) {
204+
205+
if(vc.dryRun) {
206+
vc.showSummary = true;
207+
vc.validateDryRun(response.data);
208+
} else {
175209
vc.notify('Backup <strong>"'+backup.metadata.name+'"</strong> updated successfully', 'message', 'sgbackups');
176210
177211
vc.fetchAPI('sgbackup');
@@ -192,17 +226,25 @@
192226
router.push('/' + backup.metadata.namespace + '/sgbackup/');
193227
}
194228
}
195-
})
196-
.catch(function (error) {
197-
console.log(error.response);
198-
vc.notify(error.response.data,'error', 'sgbackups');
199-
});
229+
}
200230
201-
} else {
202-
sgApi
203-
.create('sgbackups', backup)
204-
.then(function (response) {
231+
store.commit('loading', false);
232+
})
233+
.catch(function (error) {
234+
console.log(error.response);
235+
vc.notify(error.response.data,'error', 'sgbackups');
236+
store.commit('loading', false);
237+
});
205238
239+
} else {
240+
sgApi
241+
.create('sgbackups', backup, vc.dryRun)
242+
.then(function (response) {
243+
244+
if(vc.dryRun) {
245+
vc.showSummary = true;
246+
vc.validateDryRun(response.data);
247+
} else {
206248
var urlParams = new URLSearchParams(window.location.search);
207249
if(urlParams.has('newtab')) {
208250
opener.fetchParentAPI('sgbackups');
@@ -213,14 +255,16 @@
213255
214256
vc.fetchAPI('sgbackup');
215257
router.push('/' + backup.metadata.namespace + '/sgbackups');
216-
})
217-
.catch(function (error) {
218-
console.log(error.response);
219-
vc.notify(error.response.data,'error', 'sgbackups');
220-
});
221-
}
258+
}
259+
260+
store.commit('loading', false);
261+
})
262+
.catch(function (error) {
263+
console.log(error.response);
264+
vc.notify(error.response.data,'error', 'sgbackups');
265+
store.commit('loading', false);
266+
});
222267
}
223-
224268
}
225269
226270
}

stackgres-k8s/src/admin-ui/src/components/forms/CreateSGClusters.vue

Lines changed: 58 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3471,19 +3471,41 @@
34713471
<hr/>
34723472

34733473
<template v-if="editMode">
3474-
<button type="submit" class="btn" @click="createCluster(false)">Update Cluster</button>
3474+
<button type="submit" class="btn" @click="createCluster()">Update Cluster</button>
34753475
</template>
34763476
<template v-else>
3477-
<button type="submit" class="btn" @click="createCluster(false)">Create Cluster</button>
3477+
<button type="submit" class="btn" @click="createCluster()">Create Cluster</button>
34783478
</template>
34793479

3480-
<button type="button" class="btn floatRight" @click="createCluster(true)">View Summary</button>
3481-
34823480
<button type="button" @click="setupTemplate(true)" class="btn border">Cancel</button>
3481+
3482+
<button type="button" class="btn floatRight" @click="createCluster(true)">View Summary</button>
3483+
<button
3484+
type="button"
3485+
class="btn border floatRight"
3486+
title="Dry run mode helps to evaluate a request through the typical request stages without any storage persistance or resource allocation."
3487+
@click="
3488+
dryRun = true;
3489+
createCluster();
3490+
"
3491+
>
3492+
Dry Run
3493+
</button>
3494+
34833495
</template>
34843496
</form>
34853497

3486-
<ClusterSummary :cluster="previewCRD" :extensionsList="extensionsList[flavor][postgresVersion]" v-if="showSummary" @closeSummary="showSummary = false"></ClusterSummary>
3498+
<ClusterSummary
3499+
v-if="showSummary"
3500+
:cluster="previewCRD"
3501+
:extensionsList="extensionsList[flavor][postgresVersion]"
3502+
:dryRun="dryRun"
3503+
@closeSummary="
3504+
showSummary = false;
3505+
dryRun = false;
3506+
previewCRD = {};
3507+
"
3508+
></ClusterSummary>
34873509
</div>
34883510
</template>
34893511

@@ -3852,9 +3874,13 @@
38523874
const vc = this;
38533875
38543876
if(!vc.checkRequired()) {
3855-
return;
3877+
vc.dryRun = false;
3878+
vc.showSummary = false;
3879+
return;
38563880
}
38573881
3882+
store.commit('loading', true);
3883+
38583884
if (!previous) {
38593885
sgApi
38603886
.getResourceDetails('sgclusters', this.namespace, this.name)
@@ -4085,36 +4111,53 @@
40854111
vc.previewCRD = {};
40864112
vc.previewCRD['data'] = cluster;
40874113
vc.showSummary = true;
4114+
store.commit('loading', false);
40884115
40894116
} else {
4090-
4117+
40914118
if(this.editMode) {
40924119
sgApi
4093-
.update('sgclusters', cluster)
4120+
.update('sgclusters', cluster, vc.dryRun)
40944121
.then(function (response) {
4095-
vc.notify('Cluster <strong>"'+cluster.metadata.name+'"</strong> updated successfully', 'message', 'sgclusters');
4122+
4123+
if(vc.dryRun) {
4124+
vc.showSummary = true;
4125+
vc.validateDryRun(response.data);
4126+
} else {
4127+
vc.notify('Cluster <strong>"'+cluster.metadata.name+'"</strong> updated successfully', 'message', 'sgclusters');
40964128
4097-
vc.fetchAPI('sgclusters');
4098-
router.push('/' + cluster.metadata.namespace + '/sgcluster/' + cluster.metadata.name);
4129+
vc.fetchAPI('sgclusters');
4130+
router.push('/' + cluster.metadata.namespace + '/sgcluster/' + cluster.metadata.name);
4131+
}
4132+
store.commit('loading', false);
40994133
41004134
})
41014135
.catch(function (error) {
41024136
console.log(error.response);
41034137
vc.notify(error.response.data,'error', 'sgclusters');
4138+
store.commit('loading', false);
41044139
});
41054140
} else {
41064141
sgApi
4107-
.create('sgclusters', cluster)
4142+
.create('sgclusters', cluster, vc.dryRun)
41084143
.then(function (response) {
4109-
vc.notify('Cluster <strong>"'+cluster.metadata.name+'"</strong> created successfully', 'message', 'sgclusters');
41104144
4111-
vc.fetchAPI('sgclusters');
4112-
router.push('/' + cluster.metadata.namespace + '/sgclusters');
4145+
if(vc.dryRun) {
4146+
vc.showSummary = true;
4147+
vc.validateDryRun(response.data);
4148+
} else {
4149+
vc.notify('Cluster <strong>"'+cluster.metadata.name+'"</strong> created successfully', 'message', 'sgclusters');
4150+
4151+
vc.fetchAPI('sgclusters');
4152+
router.push('/' + cluster.metadata.namespace + '/sgclusters');
4153+
}
4154+
store.commit('loading', false);
41134155
41144156
})
41154157
.catch(function (error) {
41164158
console.log(error.response);
41174159
vc.notify(error.response.data,'error','sgclusters');
4160+
store.commit('loading', false);
41184161
});
41194162
}
41204163

0 commit comments

Comments
 (0)