Skip to content

Commit

Permalink
Error and Warning Menu
Browse files Browse the repository at this point in the history
  • Loading branch information
frievoe97 committed Mar 9, 2022
1 parent 5832e45 commit 9c4d36f
Show file tree
Hide file tree
Showing 5 changed files with 140 additions and 10 deletions.
2 changes: 1 addition & 1 deletion src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
router-view.main-content
p(style="text-justify: center; margin: auto auto; font-size: 2rem;"): i • S i m W r a p p e r •

.message-zone(v-if="state.statusErrors.length")
//.message-zone(v-if="state.statusErrors.length")
.message-error(v-for="err,i in state.statusErrors")
p: i.fa.fa-icon.fa-exclamation-triangle(style="color: orange;")
p(v-html="err")
Expand Down
5 changes: 5 additions & 0 deletions src/Globals.ts
Original file line number Diff line number Diff line change
Expand Up @@ -123,6 +123,11 @@ export interface BreadCrumb {
url?: string
}

export interface Warnings {
msg: string
desc?: string
}

export interface ColorSet {
text: string
background: string
Expand Down
28 changes: 28 additions & 0 deletions src/charts/bar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,34 @@ export default class VueComponent extends Vue {
this.$emit('dimension-resizer', { id: this.cardId, resizer: this.changeDimensions })
this.$emit('isLoaded')
// Example Error and Warnings
//
// this.$store.commit('setStatus', {
// type: Status.ERROR,
// msg: `This is an Example Error (Bar Plot)`,
// desc: 'Das ist eine detailierte Beschreibung des Fehlers. Damit der Fehler behoben werden kann, muss einiges geändert werden.',
// })
// this.$store.commit('setStatus', {
// type: Status.WARNING,
// msg: `This is an Example Error (Bar Plot)`,
// desc: 'Das ist eine detailierte Beschreibung des Fehlers. Damit der Fehler behoben werden kann, muss einiges geändert werden.',
// })
// this.$store.commit('setStatus', {
// type: Status.ERROR,
// msg: `You did a misstake!`,
// desc: 'Leider hast du einen Fehler.....',
// })
// this.$store.commit('setStatus', {
// type: Status.WARNING,
// msg: `This is an Example Error (Bar Plot) 2`,
// desc: 'Das ist eine detailierte Beschreibung des Fehlers. Damit der Fehler behoben werden kann, muss einiges geändert werden.',
// })
// this.$store.commit('setStatus', {
// type: Status.ERROR,
// msg: `Oooopppsss.. Data is missing`,
// desc: 'Leider hast du einen Fehler.....',
// })
}
private changeDimensions(dimensions: { width: number; height: number }) {
Expand Down
77 changes: 75 additions & 2 deletions src/components/RunFinderPanel.vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,25 @@

.top-panel
.stuff-in-main-panel
.more-stuff

.more-stuff(v-if="!showWarnings")
.root-files(v-for="node,i in rootNodes" :key="i")
h3: b {{ node.name }}

tree-view.things(:initialData="node" @navigate="$emit('navigate', $event)")
.warnings(v-else)
.message-area(v-if="!state.statusErrors.length")
p There are no errors and warnings :)
.message-area(v-else)
h3 {{state.statusErrors.length}} Errors
.single-message(v-for="err,i in state.statusErrors")
li(v-html="err.msg" @click="toggleShowDescription(i, true)")
.description(v-if="descriptionIndexListError.includes(i)")
p(v-html="err.desc")
h3 {{state.statusWarnings.length}} Warnings
.single-message(v-for="err,i in state.statusWarnings")
li(v-html="err.msg" @click="toggleShowDescription(i, false)")
.description(v-if="descriptionIndexListWarning.includes(i)")
p(v-html="err.desc")

.bottom-panel
//- h3 Search
Expand All @@ -21,6 +34,7 @@
button.button(:class="{'is-dark' : state.isDarkMode}" @click="onScan" :title="$t('sync')"): i.fa.fa-sync
button.button(:class="{'is-dark' : state.isDarkMode}" @click="onDarkLight" :title="$t('theme')"): i.fa.fa-adjust
button.button(:class="{'is-dark' : state.isDarkMode}" @click="onLanguage" :title="$t('lang')"): i.fa.fa-globe
button.button(:class="{'is-dark' : state.isDarkMode}" @click="onWarning" :title="$t('lang')"): i.fa.fa-exclamation-triangle
button.button(:class="{'is-dark' : state.isDarkMode}" style="margin-right: 0" @click="onSplit" :title="$t('split')"): i.fa.fa-columns

p(style="margin: 0.25rem 0.25rem 0.25rem 0.5rem") {{ globalState.runFolderCount ? `Folders scanned: ${globalState.runFolderCount}` : '' }}
Expand Down Expand Up @@ -66,6 +80,12 @@ class MyComponent extends Vue {
private baseURL = import.meta.env.BASE_URL
private showWarnings = false
private showDescription = false
private descriptionIndexListWarning: number[] = []
private descriptionIndexListError: number[] = []
private isError = false
private mounted() {
// start the run finder process
runFinder.findRuns()
Expand Down Expand Up @@ -157,6 +177,28 @@ class MyComponent extends Vue {
this.$root.$i18n.locale = newLocale
}
private onWarning() {
this.showWarnings = !this.showWarnings
}
private toggleShowDescription(i: number, isError: boolean) {
this.isError = isError
if (isError) {
if (this.descriptionIndexListError.includes(i)) {
var index = this.descriptionIndexListError.indexOf(i)
this.descriptionIndexListError.splice(index, 1)
} else {
this.descriptionIndexListError.push(i)
}
} else {
if (this.descriptionIndexListWarning.includes(i)) {
var index = this.descriptionIndexListWarning.indexOf(i)
this.descriptionIndexListWarning.splice(index, 1)
} else {
this.descriptionIndexListWarning.push(i)
}
}
}
private globalState = globalStore.state
}
export default MyComponent
Expand Down Expand Up @@ -283,6 +325,37 @@ a {
margin-left: -1rem;
}
.warnings {
display: flex;
flex-direction: column;
inline-size: 13rem;
text-align: left;
}
.message-area {
text-indent: -20px;
margin-left: 20px;
}
.single-message {
list-style-position: outside;
}
.description {
width: 100%;
height: min-content;
background-color: rgb(95, 123, 167);
margin-top: 10px;
margin-bottom: 10px;
padding: 5px;
text-indent: 0px;
margin-left: 0px;
}
::-webkit-scrollbar-corner {
background: rgba(0, 0, 0, 0);
}
@media only screen and (max-width: 640px) {
.content {
padding: 2rem 1rem 8rem 1rem;
Expand Down
38 changes: 31 additions & 7 deletions src/store.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,14 @@ import Vuex, { Store } from 'vuex'

Vue.use(Vuex)

import { BreadCrumb, ColorScheme, FileSystemConfig, Status, VisualizationPlugin } from '@/Globals'
import {
BreadCrumb,
Warnings,
ColorScheme,
FileSystemConfig,
Status,
VisualizationPlugin,
} from '@/Globals'
import fileSystems from '@/fileSystemConfig'
import { MAP_STYLES_ONLINE, MAP_STYLES_OFFLINE } from '@/Globals'
import { debounce } from '@/js/util'
Expand Down Expand Up @@ -44,7 +51,8 @@ interface GlobalState {
resizeEvents: number
runFolders: { [root: string]: { path: string }[] }
runFolderCount: number
statusErrors: string[]
statusErrors: Warnings[]
statusWarnings: Warnings[]
statusMessage: string
svnProjects: FileSystemConfig[]
visualizationTypes: Map<string, VisualizationPlugin>
Expand All @@ -71,7 +79,8 @@ export default new Vuex.Store({
isDarkMode: false,
mapStyles: MAP_STYLES_ONLINE,
needLoginForUrl: '',
statusErrors: [] as string[],
statusErrors: [] as Warnings[],
statusWarnings: [] as Warnings[],
statusMessage: 'Loading',
svnProjects: fileSystems,
visualizationTypes: new Map() as Map<string, VisualizationPlugin>,
Expand Down Expand Up @@ -128,7 +137,7 @@ export default new Vuex.Store({
if (!value.jump) state.viewState = value
else if (state.viewState.initial) state.viewState = value
},
error(state: GlobalState, value: string) {
error(state: GlobalState, value: Warnings) {
// don't repeat yourself
if (
!state.statusErrors.length ||
Expand All @@ -137,16 +146,31 @@ export default new Vuex.Store({
state.statusErrors.push(value)
}
},
setStatus(state: GlobalState, value: { type: Status; msg: string }) {
setStatus(state: GlobalState, value: { type: Status; msg: string; desc?: string }) {
if (!value.desc?.length) {
value.desc = ''
}
const warningObj = {
msg: value.msg,
desc: value.desc,
}
if (value.type === Status.INFO) {
state.statusMessage = value.msg
} else if (value.type === Status.WARNING) {
if (
// don't repeat yourself
!state.statusWarnings.length ||
state.statusWarnings[state.statusWarnings.length - 1].msg !== value.msg
) {
state.statusWarnings.push(warningObj)
}
} else {
if (
// don't repeat yourself
!state.statusErrors.length ||
state.statusErrors[state.statusErrors.length - 1] !== value.msg
state.statusErrors[state.statusErrors.length - 1].msg !== value.msg
) {
state.statusErrors.push(value.msg)
state.statusErrors.push(warningObj)
}
}
},
Expand Down

0 comments on commit 9c4d36f

Please sign in to comment.