diff --git a/src/lang/en.json b/src/lang/en.json index 8c5e17c34..727358fdc 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -1149,6 +1149,8 @@ "Money": "Money", "Scifi": "Scifi", "Clear": "Clear", + "Select All": "Select All", + "Deselect All": "Deselect All", "Elevator": "Elevator", "Guitar": "Guitar", "Pop": "Pop", diff --git a/src/pages/EditMaintenance.vue b/src/pages/EditMaintenance.vue index 70742a9c6..c8d15dba6 100644 --- a/src/pages/EditMaintenance.vue +++ b/src/pages/EditMaintenance.vue @@ -28,13 +28,16 @@

{{ $t("Affected Monitors") }}

- {{ $t("affectedMonitorsDescription") }}
+
+
{{ $t("affectedMonitorsDescription") }}
+
+ + @select="onMonitorSelect" + @remove="onMonitorRemove" + > + +
@@ -353,6 +365,21 @@ export default { }); }, + affectedMonitorsOptionsWithSelectAll() { + return [ + { + id: "select-all", + pathName: this.affectedMonitorsAllSelected ? this.$t("Deselect All") : this.$t("Select All") + }, + ...this.affectedMonitorsOptions + ]; + }, + + affectedMonitorsAllSelected() { + return this.affectedMonitors.length > 0 && + this.affectedMonitors.length === this.affectedMonitorsOptions.length; + }, + pageName() { let name = "Schedule Maintenance"; @@ -494,6 +521,24 @@ export default { } }, + onMonitorSelect(selectedOption) { + if (selectedOption.id === "select-all") { + this.affectedMonitors = this.affectedMonitors.filter(m => m.id !== "select-all"); + + if (this.affectedMonitorsAllSelected) { + this.affectedMonitors = []; + } else { + this.affectedMonitors = this.affectedMonitorsOptions.slice(); + } + } + }, + + onMonitorRemove(removedOption) { + if (removedOption.id === "select-all") { + this.affectedMonitors = this.affectedMonitors.filter(m => m.id !== "select-all"); + } + }, + /** * Create new maintenance * @returns {Promise}