fix: Delete record with contextual menu in data table. (#329)
parent
ed74a67ea7
commit
be0e3d8eec
|
@ -61,10 +61,10 @@
|
||||||
</a>
|
</a>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-submenu
|
<el-submenu
|
||||||
v-if="['browser', 'window'].includes(panelType)"
|
v-if="isManageDataRecords"
|
||||||
:disabled="isDisabledExportRecord"
|
:disabled="isDisabledExportRecord"
|
||||||
index="exportRecord"
|
index="exportRecord"
|
||||||
@click.native="exportRecord('xlsx')"
|
@click.native="exportRecord(defaultFromatExport)"
|
||||||
>
|
>
|
||||||
<template slot="title">
|
<template slot="title">
|
||||||
{{ $t('data.exportRecord') }}
|
{{ $t('data.exportRecord') }}
|
||||||
|
@ -76,7 +76,7 @@
|
||||||
<el-menu-item v-show="$route.name === 'Report Viewer'" index="printFormat" @click="redirect">
|
<el-menu-item v-show="$route.name === 'Report Viewer'" index="printFormat" @click="redirect">
|
||||||
{{ $t('components.contextMenuPrintFormatSetup') }}
|
{{ $t('components.contextMenuPrintFormatSetup') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item v-if="panelType !== 'process'" index="refreshData" @click="refreshData">
|
<el-menu-item v-if="isManageDataRecords" index="refreshData" @click="refreshData">
|
||||||
{{ $t('components.contextMenuRefresh') }}
|
{{ $t('components.contextMenuRefresh') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="shareLink" @click="setShareLink">
|
<el-menu-item index="shareLink" @click="setShareLink">
|
||||||
|
|
|
@ -43,6 +43,10 @@ export const contextMixin = {
|
||||||
isInsertRecord: {
|
isInsertRecord: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: undefined
|
default: undefined
|
||||||
|
},
|
||||||
|
defaultFromatExport: {
|
||||||
|
type: String,
|
||||||
|
default: 'xlsx'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
@ -172,6 +176,9 @@ export const contextMixin = {
|
||||||
},
|
},
|
||||||
isPersonalLock() {
|
isPersonalLock() {
|
||||||
return this.$store.getters['user/getIsPersonalLock']
|
return this.$store.getters['user/getIsPersonalLock']
|
||||||
|
},
|
||||||
|
isManageDataRecords() {
|
||||||
|
return ['browser', 'window'].includes(this.panelType)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -226,9 +233,7 @@ export const contextMixin = {
|
||||||
this.$store.dispatch('deleteEntity', {
|
this.$store.dispatch('deleteEntity', {
|
||||||
parentUuid: this.parentUuid,
|
parentUuid: this.parentUuid,
|
||||||
containerUuid: this.containerUuid,
|
containerUuid: this.containerUuid,
|
||||||
recordUuid: this.recordUuid,
|
recordUuid: this.recordUuid
|
||||||
panelType: 'window',
|
|
||||||
isNewRecord: false
|
|
||||||
})
|
})
|
||||||
break
|
break
|
||||||
case 'f5':
|
case 'f5':
|
||||||
|
@ -411,18 +416,20 @@ export const contextMixin = {
|
||||||
href: window.location.href
|
href: window.location.href
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
let reportFormat = action.reportExportType
|
let reportFormat = action.reportExportType
|
||||||
if (this.isEmptyValue(reportFormat)) {
|
if (this.isEmptyValue(reportFormat)) {
|
||||||
if (!this.isEmptyValue(this.$route.query.reportType)) {
|
|
||||||
reportFormat = this.$route.query.reportType
|
reportFormat = this.$route.query.reportType
|
||||||
} else if (!this.isEmptyValue(this.$route.meta.reportFormat)) {
|
if (this.isEmptyValue(reportFormat)) {
|
||||||
reportFormat = this.$route.meta.reportFormat
|
reportFormat = this.$route.meta.reportFormat
|
||||||
} else {
|
if (this.isEmptyValue(reportFormat)) {
|
||||||
reportFormat = 'html'
|
reportFormat = 'html'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
this.$store.dispatch(action.action, {
|
this.$store.dispatch(action.action, {
|
||||||
action: action,
|
action,
|
||||||
parentUuid: this.containerUuid,
|
parentUuid: this.containerUuid,
|
||||||
containerUuid: containerParams, // EVALUATE IF IS action.uuid
|
containerUuid: containerParams, // EVALUATE IF IS action.uuid
|
||||||
panelType: this.panelType, // determinate if get table name and record id (window) or selection (browser)
|
panelType: this.panelType, // determinate if get table name and record id (window) or selection (browser)
|
||||||
|
|
|
@ -68,7 +68,7 @@
|
||||||
</a>
|
</a>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-submenu
|
<el-submenu
|
||||||
v-if="['browser', 'window'].includes(panelType)"
|
v-if="isManageDataRecords"
|
||||||
:disabled="isDisabledExportRecord"
|
:disabled="isDisabledExportRecord"
|
||||||
index="exportRecord"
|
index="exportRecord"
|
||||||
>
|
>
|
||||||
|
@ -82,7 +82,7 @@
|
||||||
<el-menu-item v-show="$route.name === 'Report Viewer'" index="printFormat" @click="redirect">
|
<el-menu-item v-show="$route.name === 'Report Viewer'" index="printFormat" @click="redirect">
|
||||||
{{ $t('components.contextMenuPrintFormatSetup') }}
|
{{ $t('components.contextMenuPrintFormatSetup') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item v-if="panelType !== 'process'" index="refreshData" @click="refreshData">
|
<el-menu-item v-if="isManageDataRecords" index="refreshData" @click="refreshData">
|
||||||
{{ $t('components.contextMenuRefresh') }}
|
{{ $t('components.contextMenuRefresh') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item index="shareLink" @click="setShareLink">
|
<el-menu-item index="shareLink" @click="setShareLink">
|
||||||
|
|
|
@ -3,7 +3,6 @@
|
||||||
:default-active="menuTable"
|
:default-active="menuTable"
|
||||||
:class="classTableMenu + ' menu-table-container'"
|
:class="classTableMenu + ' menu-table-container'"
|
||||||
mode="horizontal"
|
mode="horizontal"
|
||||||
@select="exporRecordTable"
|
|
||||||
>
|
>
|
||||||
<el-submenu index="2">
|
<el-submenu index="2">
|
||||||
<template slot="title">
|
<template slot="title">
|
||||||
|
@ -41,15 +40,19 @@
|
||||||
<el-submenu
|
<el-submenu
|
||||||
:disabled="Boolean(getDataSelection.length < 1)"
|
:disabled="Boolean(getDataSelection.length < 1)"
|
||||||
index="xlsx"
|
index="xlsx"
|
||||||
|
@click.native="exporRecordTable(defaultFromatExport)"
|
||||||
>
|
>
|
||||||
<template slot="title">
|
<template slot="title">
|
||||||
{{ $t('table.dataTable.exportRecordTable') }}
|
{{ $t('table.dataTable.exportRecordTable') }}
|
||||||
</template>
|
</template>
|
||||||
<template v-for="(format, index) in supportedTypes">
|
<el-menu-item
|
||||||
<el-menu-item :key="index" :index="index">
|
v-for="(format, keyFormat) in supportedTypes"
|
||||||
|
:key="keyFormat"
|
||||||
|
:index="keyFormat"
|
||||||
|
@click.native="exporRecordTable(keyFormat)"
|
||||||
|
>
|
||||||
{{ format }}
|
{{ format }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
|
||||||
</el-submenu>
|
</el-submenu>
|
||||||
<el-menu-item index="optional" @click="showOptionalColums()">
|
<el-menu-item index="optional" @click="showOptionalColums()">
|
||||||
{{ $t('components.filterableItems') }}
|
{{ $t('components.filterableItems') }}
|
||||||
|
@ -61,13 +64,17 @@
|
||||||
{{ $t('table.dataTable.showAllAvailableColumns') }}
|
{{ $t('table.dataTable.showAllAvailableColumns') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item
|
<el-menu-item
|
||||||
v-if="['browser', 'window'].includes(panelType)"
|
|
||||||
:disabled="isFieldsQuantity"
|
:disabled="isFieldsQuantity"
|
||||||
@click="showTotals()"
|
@click="showTotals()"
|
||||||
>
|
>
|
||||||
{{ panelMetadata.isShowedTotals ? $t('table.dataTable.hiddenTotal') : $t('table.dataTable.showTotal') }}
|
{{ panelMetadata.isShowedTotals ? $t('table.dataTable.hiddenTotal') : $t('table.dataTable.showTotal') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
<el-menu-item v-if="!isPanelWindow" :disabled="Boolean(getDataSelection.length < 1)" index="zoom-record" @click="zoomRecord()">
|
<el-menu-item
|
||||||
|
v-if="!isPanelWindow"
|
||||||
|
:disabled="Boolean(getDataSelection.length < 1)"
|
||||||
|
index="zoom-record"
|
||||||
|
@click="zoomRecord()"
|
||||||
|
>
|
||||||
{{ $t('table.ProcessActivity.zoomIn') }}
|
{{ $t('table.ProcessActivity.zoomIn') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</el-submenu>
|
</el-submenu>
|
||||||
|
|
|
@ -40,6 +40,10 @@ export const menuTableMixin = {
|
||||||
panelMetadata: {
|
panelMetadata: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {}
|
default: () => {}
|
||||||
|
},
|
||||||
|
defaultFromatExport: {
|
||||||
|
type: String,
|
||||||
|
default: 'xlsx'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
@ -232,12 +236,13 @@ export const menuTableMixin = {
|
||||||
this.$store.dispatch('deleteSelectionDataList', {
|
this.$store.dispatch('deleteSelectionDataList', {
|
||||||
parentUuid: this.parentUuid,
|
parentUuid: this.parentUuid,
|
||||||
containerUuid: this.containerUuid
|
containerUuid: this.containerUuid
|
||||||
})
|
}).then(() => {
|
||||||
this.$store.dispatch('setRecordSelection', {
|
this.$store.dispatch('setRecordSelection', {
|
||||||
parentUuid: this.parentUuid,
|
parentUuid: this.parentUuid,
|
||||||
containerUuid: this.containerUuid,
|
containerUuid: this.containerUuid,
|
||||||
panelType: this.panelType
|
panelType: this.panelType
|
||||||
})
|
})
|
||||||
|
})
|
||||||
},
|
},
|
||||||
addNewRow() {
|
addNewRow() {
|
||||||
if (this.getterNewRecords <= 0) {
|
if (this.getterNewRecords <= 0) {
|
||||||
|
|
|
@ -1,36 +1,36 @@
|
||||||
<template>
|
<template>
|
||||||
<el-menu
|
<el-menu
|
||||||
:collapse="isCollapse"
|
:collapse="isCollapse"
|
||||||
class="el-menu-demo"
|
|
||||||
@select="exporRecordTable"
|
|
||||||
>
|
>
|
||||||
<el-submenu
|
<el-submenu
|
||||||
index="xlsx"
|
index="xlsx"
|
||||||
|
@click.native="exportRecord(defaultFromatExport)"
|
||||||
>
|
>
|
||||||
<template
|
<template slot="title">
|
||||||
slot="title"
|
|
||||||
>
|
|
||||||
{{ $t('data.exportRecord') }}
|
{{ $t('data.exportRecord') }}
|
||||||
</template>
|
</template>
|
||||||
<template v-for="(format, index) in supportedTypes">
|
|
||||||
<el-menu-item
|
<el-menu-item
|
||||||
:key="index"
|
v-for="(format, keyFormat) in supportedTypes"
|
||||||
:index="index"
|
:key="keyFormat"
|
||||||
|
:index="keyFormat"
|
||||||
|
@click.native="exportRecord(keyFormat)"
|
||||||
>
|
>
|
||||||
{{ format }}
|
{{ format }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
|
||||||
</el-submenu>
|
</el-submenu>
|
||||||
<el-menu-item
|
<el-menu-item
|
||||||
|
v-if="panelType === 'window'"
|
||||||
index="delete"
|
index="delete"
|
||||||
@click="deleteRecord()"
|
@click="deleteRecord()"
|
||||||
>
|
>
|
||||||
{{ $t('window.deleteRecord') }}
|
{{ $t('window.deleteRecord') }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
|
|
||||||
|
<!-- process associated -->
|
||||||
<el-menu-item
|
<el-menu-item
|
||||||
v-for="(process, key) in processMenu"
|
v-for="(process, key) in processMenu"
|
||||||
:key="key"
|
:key="key"
|
||||||
index="process"
|
:index="'process' + key"
|
||||||
@click="showModalTable(process)"
|
@click="showModalTable(process)"
|
||||||
>
|
>
|
||||||
{{ process.name }}
|
{{ process.name }}
|
||||||
|
@ -48,6 +48,15 @@ export default {
|
||||||
return {
|
return {
|
||||||
menuType: 'tableContextMenu'
|
menuType: 'tableContextMenu'
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
deleteRecord() {
|
||||||
|
this.$store.dispatch('deleteEntity', {
|
||||||
|
parentUuid: this.parentUuid,
|
||||||
|
containerUuid: this.containerUuid,
|
||||||
|
row: this.currentRow
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -408,26 +408,38 @@ const windowControl = {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
deleteEntity({ dispatch, rootGetters }, parameters) {
|
deleteEntity({ dispatch, rootGetters }, {
|
||||||
|
parentUuid,
|
||||||
|
containerUuid,
|
||||||
|
recordUuid,
|
||||||
|
recordId,
|
||||||
|
row
|
||||||
|
}) {
|
||||||
return new Promise(resolve => {
|
return new Promise(resolve => {
|
||||||
const panel = rootGetters.getPanel(parameters.containerUuid)
|
const panel = rootGetters.getPanel(containerUuid)
|
||||||
|
if (!isEmptyValue(row)) {
|
||||||
|
recordUuid = row.UUID
|
||||||
|
recordId = row[`${panel.tableName}_ID`]
|
||||||
|
}
|
||||||
|
|
||||||
deleteEntity({
|
deleteEntity({
|
||||||
tableName: panel.tableName,
|
tableName: panel.tableName,
|
||||||
recordUuid: parameters.recordUuid
|
recordUuid,
|
||||||
|
recordId
|
||||||
})
|
})
|
||||||
.then(responseDeleteEntity => {
|
.then(responseDeleteEntity => {
|
||||||
// refresh record list
|
// refresh record list
|
||||||
dispatch('getDataListTab', {
|
dispatch('getDataListTab', {
|
||||||
parentUuid: parameters.parentUuid,
|
parentUuid,
|
||||||
containerUuid: parameters.containerUuid
|
containerUuid
|
||||||
})
|
})
|
||||||
.then(responseDataList => {
|
.then(responseDataList => {
|
||||||
|
if (panel.isParentTab) {
|
||||||
// if response is void, go to new record
|
// if response is void, go to new record
|
||||||
if (responseDataList.length <= 0) {
|
if (responseDataList.length <= 0) {
|
||||||
dispatch('resetPanelToNew', {
|
dispatch('resetPanelToNew', {
|
||||||
parentUuid: parameters.parentUuid,
|
parentUuid,
|
||||||
containerUuid: parameters.containerUuid,
|
containerUuid,
|
||||||
panelType: 'window',
|
panelType: 'window',
|
||||||
isNewRecord: true
|
isNewRecord: true
|
||||||
})
|
})
|
||||||
|
@ -445,19 +457,24 @@ const windowControl = {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
showMessage({
|
showMessage({
|
||||||
message: language.t('data.deleteRecordSuccessful'),
|
message: language.t('data.deleteRecordSuccessful'),
|
||||||
type: 'success'
|
type: 'success'
|
||||||
})
|
})
|
||||||
|
|
||||||
// set data log to undo action
|
if (isEmptyValue(recordId)) {
|
||||||
|
// TODO: Verify performance with tableName_ID
|
||||||
const fieldId = panel.fieldList.find(itemField => itemField.isKey)
|
const fieldId = panel.fieldList.find(itemField => itemField.isKey)
|
||||||
|
recordId = fieldId.value
|
||||||
|
}
|
||||||
|
// set data log to undo action
|
||||||
dispatch('setDataLog', {
|
dispatch('setDataLog', {
|
||||||
containerUuid: parameters.containerUuid,
|
containerUuid,
|
||||||
tableName: panel.tableName,
|
tableName: panel.tableName,
|
||||||
recordId: fieldId.value, // TODO: Verify performance with tableName_ID
|
recordId,
|
||||||
recordUuid: parameters.recordUuid,
|
recordUuid,
|
||||||
eventType: 'DELETE'
|
eventType: 'DELETE'
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue