From 55fed4a550054a4a21b1d57eb3e214f3670fba30 Mon Sep 17 00:00:00 2001 From: Kelani Tolulope Date: Wed, 4 Oct 2023 17:13:23 +0100 Subject: [PATCH] Add save as copy to module and chart resources --- .../compose/src/views/Admin/Charts/Edit.vue | 19 +++++++++++---- .../compose/src/views/Admin/Modules/Edit.vue | 23 ++++++++++++++----- lib/js/src/compose/types/chart/base.ts | 4 ++++ 3 files changed, 36 insertions(+), 10 deletions(-) diff --git a/client/web/compose/src/views/Admin/Charts/Edit.vue b/client/web/compose/src/views/Admin/Charts/Edit.vue index 880231a52f..c9cfa104ff 100644 --- a/client/web/compose/src/views/Admin/Charts/Edit.vue +++ b/client/web/compose/src/views/Admin/Charts/Edit.vue @@ -417,10 +417,11 @@ :processing-delete="processingDelete" :hide-delete="hideDelete" :hide-save="hideSave" - hide-clone + :hide-clone="!isEdit" :disable-save="disableSave" @delete="handleDelete()" @save="handleSave()" + @clone="handleClone()" @saveAndClose="handleSave({ closeOnSuccess: true })" @back="$router.push(previousPage || { name: 'admin.charts' })" /> @@ -677,6 +678,7 @@ export default { if (chartID === NoID) { let c = new compose.Chart({ namespaceID: this.namespace.namespaceID }) + switch (this.category) { case 'gauge': c = new compose.GaugeChart(c) @@ -762,7 +764,7 @@ export default { this.processing = false }, - handleSave ({ closeOnSuccess = false } = {}) { + handleSave ({ closeOnSuccess = false, chart = this.chart } = {}) { this.processing = true if (closeOnSuccess) { @@ -777,9 +779,9 @@ export default { */ const resourceTranslationLanguage = this.currentLanguage - const c = Object.assign({}, this.chart, resourceTranslationLanguage) + const c = Object.assign({}, chart, resourceTranslationLanguage) - if (this.chart.chartID === NoID) { + if (chart.chartID === NoID) { this.createChart(c).then(({ chartID }) => { this.toastSuccess(this.$t('notification:chart.saved')) this.initialChartState = cloneDeep(chartConstructor(this.chart)) @@ -836,6 +838,15 @@ export default { }) }, + handleClone () { + const chart = this.chart.clone() + chart.chartID = NoID + chart.name = `${this.chart.name} (copy)` + chart.handle = this.chart.handle ? `${this.chart.handle}_copy` : '' + + this.handleSave({ chart }) + }, + redirect () { this.$router.push(this.previousPage || { name: 'admin.charts' }) }, diff --git a/client/web/compose/src/views/Admin/Modules/Edit.vue b/client/web/compose/src/views/Admin/Modules/Edit.vue index 35ec720a34..a85ea33b2f 100644 --- a/client/web/compose/src/views/Admin/Modules/Edit.vue +++ b/client/web/compose/src/views/Admin/Modules/Edit.vue @@ -443,12 +443,13 @@ :processing-save-and-close="processingSaveAndClose" :processing-delete="processingDelete" :hide-delete="hideDelete" - hide-clone + :hide-clone="!isEdit" :hide-save="hideSave" :disable-save="disableSave" @delete="handleDelete" @save="handleSave()" @saveAndClose="handleSave({ closeOnSuccess: true })" + @clone="handleClone" @back="$router.push(previousPage || { name: 'admin.modules' })" /> @@ -667,6 +668,7 @@ export default { { fields: [new compose.ModuleFieldString({ fieldID: NoID, name: this.$t('general.placeholder.sample') })] }, this.namespace, ) + this.initialModuleState = this.module.clone() } else { const params = { @@ -770,7 +772,7 @@ export default { this.module.config = { ...this.module.config, ...changes } }, - handleSave ({ closeOnSuccess = false } = {}) { + handleSave ({ closeOnSuccess = false, module = this.module } = {}) { /** * Pass a special tag alongside payload that * instructs store layer to add content-language header to the API request @@ -784,11 +786,11 @@ export default { this.processingSave = true } - if (!this.isEdit) { + if (module.moduleID === NoID) { // Filter out record fields that reference this not yet created module let fields = [] const toBeUpdatedFields = [] - this.module.fields.forEach(f => { + module.fields.forEach(f => { if (f.kind === 'Record' && f.options.moduleID === '-1') { toBeUpdatedFields.push(f) } else { @@ -798,7 +800,7 @@ export default { // If such fields exist , after module is created add fields, map moduleID and update module // Unfortunately this ruins the initial field order, but we can improve this later - this.createModule({ ...this.module, fields, resourceTranslationLanguage }).then(async module => { + this.createModule({ ...module, fields, resourceTranslationLanguage }).then(async module => { if (toBeUpdatedFields.length) { fields = [ ...module.fields, @@ -831,7 +833,7 @@ export default { } }) } else { - this.updateModule({ ...this.module, resourceTranslationLanguage }).then(module => { + this.updateModule({ ...module, resourceTranslationLanguage }).then(module => { this.module = new compose.Module({ ...module }, this.namespace) this.initialModuleState = this.module.clone() @@ -873,6 +875,15 @@ export default { }) }, + handleClone () { + const module = this.module.clone() + module.moduleID = NoID + module.name = `${this.module.name} (copy)` + module.handle = this.module.handle ? `${this.module.handle}_copy` : '' + + this.handleSave({ module }) + }, + async fetchConnection (connectionID) { if (connectionID && connectionID !== NoID) { this.$SystemAPI.dalConnectionRead({ connectionID }) diff --git a/lib/js/src/compose/types/chart/base.ts b/lib/js/src/compose/types/chart/base.ts index c423b565f4..0389b3d9ea 100644 --- a/lib/js/src/compose/types/chart/base.ts +++ b/lib/js/src/compose/types/chart/base.ts @@ -389,6 +389,10 @@ export class BaseChart { get resourceType (): string { return 'compose:chart' } + + clone (): BaseChart { + return new BaseChart(JSON.parse(JSON.stringify(this))) + } } export { chartUtil } from './util'