Mercurial > gemma
view client/src/components/Statistics.vue @ 3159:4f4905b57fcf
toolbar: added statistics dialog component
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Mon, 06 May 2019 13:02:25 +0200 |
parents | |
children | 975efa874acf |
line wrap: on
line source
<template> <div :class="[ 'box ui-element rounded bg-white text-nowrap', { expanded: showStatistics } ]" > <div style="width: 18rem"> <UIBoxHeader icon="chart-line" :title="label" :closeCallback="close" /> <div class="box-body"> <UISpinnerOverlay v-if="loading" /> <div class="d-flex flex-column"> <select class="form-control font-weight-bold" v-model="type"> <option :value="null">{{ $options.TYPES.EMPTY }}</option> <option>{{ $options.TYPES.AVAILABLEFAIRWAYDEPTH }}</option> </select> </div> </div> </div> </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): * Markus Kottländer <markus.kottlaender@intevation.de> * Thomas Junk <thomas.junk@intevation.de> */ import app from "@/main"; import { mapState } from "vuex"; export default { data() { return { type: null, loading: false }; }, methods: { close() { this.$store.commit("application/showStatistics", false); } }, computed: { ...mapState("application", ["showStatistics", "paneSetup"]), label() { return this.$gettext("Statistics"); } }, TYPES: { AVAILABLEFAIRWAYDEPTH: app.$gettext("Available Fairway Depth"), EMPTY: app.$gettext("Please choose statistic") } }; </script> <style></style>