Mercurial > gemma
view client/src/components/importoverview/LogItem.vue @ 5665:8fc26cc61ba8 clickable-links
Make BNs in log messages linkable
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Tue, 05 Dec 2023 12:22:39 +0100 |
parents | 84d01a536bec |
children | 37c2354a6024 |
line wrap: on
line source
<template> <div> <span :class="[ 'kind', { 'text-danger': /error/.test(line.kind), 'text-warning': /warn/.test(line.kind), 'font-weight-bold': /warn|error/.test(line.kind) } ]" >{{ line.kind.toUpperCase() }} </span> <span :class="[ 'time', { 'text-danger': /error/.test(line.kind), 'text-warning': /warn/.test(line.kind), 'font-weight-bold': /warn|error/.test(line.kind) } ]" >{{ line.time | dateTime }} </span> <span :class="[ 'message', { 'text-danger': /error/.test(line.kind), 'text-warning': /warn/.test(line.kind), 'font-weight-bold': /warn|error/.test(line.kind) } ]" ><template v-for="part in line_message"> <template v-if="/\w+_Bottleneck_?\d+/.test(part)"> <a @click="showBottleneck(part)" href="#" :key="part">{{ part }}</a> </template> <template v-else> {{ part }} </template> </template> </span> </div> </template> <script> /* This is Free Software under GNU Affero General Public License v >= 3.0 * without warranty, see README.md and license for details. * * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt * * Copyright (C) 2018 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH * * Author(s): * Thomas Junk <thomas.junk@intevation.de> */ import { mapGetters } from "vuex"; export default { name: "Item", props: ["height", "line", "index"], computed: { ...mapGetters("bottlenecks", ["bottlenecksForDisplay"]), line_message: { get() { const search = /(\w+_Bottleneck_?\d+)/g; return this.line.message.replace(search, "||$1||").split("||"); } } }, methods: { showBottleneck(bottleneck_id) { const bottleneck = this.bottlenecksForDisplay.filter(bottlenecks => { return bottlenecks.properties.bottleneck_id === bottleneck_id; })[0]; this.$store .dispatch( "bottlenecks/setSelectedBottleneck", bottleneck.properties.bottleneck_id ) .then(() => { this.$store.dispatch("map/moveToFeauture", { feature: bottleneck, zoom: 16, preventZoomOut: true }); }); this.$store.commit( "bottlenecks/setBottleneckForPrint", bottleneck.properties.name ); } } }; </script> <style scoped> .kind { width: 9%; } .time { width: 26%; } .message { width: 65%; word-wrap: break-word; } </style>