Skip to content

Commit

Permalink
feat: add bulk activate and bulk deactivate of notification_rules
Browse files Browse the repository at this point in the history
  • Loading branch information
@sbgap
sbgap committed Jul 4, 2024
1 parent 83126e4 commit ef3b593
Show file tree
Hide file tree
Showing 2 changed files with 203 additions and 2 deletions.
198 changes: 196 additions & 2 deletions src/components/NotificationRuleList.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,88 @@
</v-card>
</v-form>
</v-dialog>
<v-dialog
v-model="deactivateBulkDialog"
max-width="540px"
>
<v-form ref="form">
<v-card>
<v-card-title>
<v-flex
xs12
sm6
md9
>
<span class="headline">
Active
</span>
</v-flex>
</v-card-title>

<v-card-text>
<v-container grid-list-md>
<v-layout wrap>
<v-flex
xs8
>
<v-menu
ref="menu3"
v-model="menu3"
:close-on-content-click="false"
:nudge-right="40"
lazy
transition="scale-transition"
offset-y
full-width
max-width="290px"
min-width="290px"
>
<v-text-field
slot="activator"
v-model="bulkDeactivateItem.reactivateDate"
:label="$t('ReactivateDate')"
prepend-icon="event"
/>
<v-date-picker
v-model="bulkDeactivateItem.reactivateDate"
no-title
@input="menu3 = false"
/>
</v-menu>
</v-flex>

<v-flex
xs4
>
<v-combobox
v-model="bulkDeactivateItem.reactivateTime"
:items="times"
/>
</v-flex>
</v-layout>
</v-container>
</v-card-text>

<v-card-actions>
<v-spacer />
<v-btn
color="blue darken-1"
flat
@click="closeBulkActive()"
>
{{ $t('Cancel') }}
</v-btn>
<v-btn
color="blue darken-1"
flat
@click="changeBulkState(bulkDeactivateItem)"
>
{{ $t('Save') }}
</v-btn>
</v-card-actions>
</v-card>
</v-form>
</v-dialog>
<v-dialog
v-model="dialog"
max-width="540px"
Expand Down Expand Up @@ -512,6 +594,46 @@
<v-card-title class="title">
{{ $t('notificationRules') }}
<v-spacer />
<span
v-if="selectableRows"
class="subheading"
>
{{ selected.length }}<span class="hidden-sm-and-down"> {{ $t('selected') }}</span>
</span>

<v-tooltip
v-if="selectableRows"
bottom
>
<v-btn
slot="activator"
icon
class="btn--plain"
@click="activateBulk()"
>
<v-icon>
check
</v-icon>
</v-btn>
<span>{{ $t('Activate') }}</span>
</v-tooltip>
<v-tooltip
v-if="selectableRows"
bottom
>
<v-btn
slot="activator"
icon
class="btn--plain"
@click="deactivateBulk()"
>
<v-icon>
highlight_off
</v-icon>
</v-btn>
<span>{{ $t('Deactivate') }}</span>
</v-tooltip>
<v-spacer />
<v-btn-toggle
v-model="status"
class="transparent"
Expand Down Expand Up @@ -554,20 +676,33 @@
</v-card-title>

<v-data-table
v-model="selected"
:headers="computedHeaders"
:items="notification_rules"
:pagination.sync="pagination"
:total-items="pagination.totalItems"
:rows-per-page-items="pagination.rowsPerPageItems"
class="px-2"
class="table"
:loading="isLoading"
must-sort
sort-icon="arrow_drop_down"
select-all
>
<template
slot="items"
slot-scope="props"
>
<td>
<v-checkbox
v-model="props.selected"
primary
hide-details
color="gray"
class="select-box"
:ripple="false"
@click.stop
/>
</td>
<td>
<v-btn
v-has-perms.disable="'write:notification_rules'"
Expand Down Expand Up @@ -792,6 +927,17 @@ export default {
{ text: i18n.t('Actions'), value: 'name', sortable: false }
],
editedId: null,
deactivateBulkDialog: false,
bulkDeactivateItem:{
active: false,
reactivateDate: null,
reactivateTime: null,
},
bulkDeactivateDefaultItem:{
active: false,
reactivateDate: null,
reactivateTime: null,
},
editedItem: {
active: true,
customer: null,
Expand Down Expand Up @@ -827,6 +973,7 @@ export default {
},
menu1: false,
menu2: false,
menu3: false,
defaultItem: {
active: true,
customer: null,
Expand Down Expand Up @@ -972,6 +1119,17 @@ export default {
statuses() {
return Object.keys(this.$store.getters.getConfig('alarm_model').status)
},
selected: {
get() {
return this.$store.state.notificationRules.selected
},
set(value) {
this.$store.dispatch('notificationRules/updateSelected', value)
}
},
selectableRows() {
return this.selected.length > 0
},
times() {
return Array.from(
{
Expand Down Expand Up @@ -1076,6 +1234,12 @@ export default {
if (this.editedItem.active) this.changeState(this.editedItem)
else this.active_dialog = true
},
deactivateBulk() {
this.deactivateBulkDialog = true
},
activateBulk() {
this.changeBulkState({active:true})
},
editItem(item) {
this.editedId = item.id
this.editedItem = Object.assign({}, item)
Expand Down Expand Up @@ -1108,6 +1272,12 @@ export default {
this.editedId = null
}, 300)
},
closeBulkActive() {
this.deactivateBulkDialog = false
setTimeout(() => {
this.bulkDeactivateItem = Object.assign({}, this.bulkDeactivateDefaultItem)
}, 300)
},
validate() {
if (this.$refs.form.validate()) {
this.$refs.form.resetValidation()
Expand All @@ -1127,6 +1297,26 @@ export default {
])
this.close_active()
},
changeBulkState(item) {
this.selected.map(a => {
this.$store
.dispatch('notificationRules/updateNotificationRule', [
a.id,
{
active: item.active,
reactivate: this.bulkDeactivateItem.reactivateDate ? this.toISODate(
this.bulkDeactivateItem.reactivateDate,
this.bulkDeactivateItem.reactivateTime
) : null
}
])
})
this.clearSelected()
this.closeBulkActive()
},
clearSelected() {
this.$store.dispatch('notificationRules/updateSelected', [])
},
refresh_all() {
this.$store.dispatch('set', ['refresh', true])
setTimeout(() => {
Expand Down Expand Up @@ -1209,4 +1399,8 @@ export default {
}
</script>

<style></style>
<style>
.table .v-table th, td {
padding: 0px 5px !important;
}
</style>
7 changes: 7 additions & 0 deletions src/store/modules/notificationRule.store.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ const state = {
isLoading: false,

notification_rules: [],
selected: [],

query: {},

Expand All @@ -31,6 +32,9 @@ const mutations = {
state.pagination.totalItems = total
state.pagination.rowsPerPage = pageSize
},
SET_SELECTED(state, selected) {
state.selected = selected
},
RESET_LOADING(state) {
state.isLoading = false
},
Expand Down Expand Up @@ -62,6 +66,9 @@ const actions = {
dispatch('getNotificationRules')
})
},
updateSelected({commit}, selected) {
commit('SET_SELECTED', selected)
},
updateNotificationRule({dispatch, commit}, [notificationRuleId, update]) {
return NotificationRuleApi.updateNotificationRule(notificationRuleId, update).then(response => {
dispatch('getNotificationRules')
Expand Down

0 comments on commit ef3b593

Please sign in to comment.