Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: add bulk activate and bulk deactivate of notification_rules #27

Merged
merged 1 commit into from
Aug 28, 2024
Merged

feat: add bulk activate and bulk deactivate of notification_rules #27

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
198 changes: 196 additions & 2 deletions src/components/NotificationRuleList.vue
View file
Open in desktop
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
Open in desktop
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
Loading