36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
import Vue from 'vue';
|
|
import { Component } from "vue-property-decorator";
|
|
import { Message } from "../model/message";
|
|
import store, { Messages, MessagesSettings } from '../store'
|
|
|
|
@Component({ template: require("../../components/messages.html"), store })
|
|
export class MessagesComponent extends Vue {
|
|
@Messages.State('messages')
|
|
public allMessages: Message[];
|
|
|
|
@MessagesSettings.State
|
|
public displayedEntriesCount: number;
|
|
|
|
public showAll: boolean = false;
|
|
|
|
get messages() {
|
|
return this.showAll
|
|
? this.allMessages
|
|
: this.allMessages.slice(0, this.displayedEntriesCount);
|
|
}
|
|
|
|
get nonDisplayedCount(): number {
|
|
return Math.max(this.allMessages.length - this.displayedEntriesCount, 0);
|
|
}
|
|
|
|
public type(message: Message) {
|
|
switch (message.type) {
|
|
case "breakdown": return "danger";
|
|
case "info": return "info";
|
|
case "unknown": return "warning";
|
|
}
|
|
}
|
|
}
|
|
|
|
Vue.component('Messages', MessagesComponent);
|