Mercurial > gemma
changeset 2541:468c8dc796cf
client: convert lib helper functions to Vue filters
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Thu, 07 Mar 2019 15:53:12 +0100 |
parents | 3c17d401fbd4 |
children | fc7d828695c9 |
files | client/src/components/Bottlenecks.vue client/src/components/ImportStretches.vue client/src/components/fairway/Profiles.vue client/src/components/importoverview/staging/StagingDetail.vue client/src/lib/date.js client/src/lib/filters.js client/src/main.js |
diffstat | 7 files changed, 60 insertions(+), 75 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/Bottlenecks.vue Thu Mar 07 15:19:16 2019 +0100 +++ b/client/src/components/Bottlenecks.vue Thu Mar 07 15:53:12 2019 +0100 @@ -29,7 +29,7 @@ }}</a> </div> <div class="col-3 py-2"> - {{ formatSurveyDate(bottleneck.properties.current) }} + {{ bottleneck.properties.current | surveyDate }} </div> <div class="col-3 py-2"> {{ @@ -80,7 +80,7 @@ :key="index" @click="selectSurvey(survey, bottleneck)" > - {{ formatSurveyDate(survey.date_info) }} + {{ survey.date_info | surveyDate }} </a> </div> </UITableBody> @@ -125,7 +125,6 @@ import { mapState } from "vuex"; import { HTTP } from "@/lib/http"; import { displayError } from "@/lib/errors.js"; -import { formatSurveyDate } from "@/lib/date.js"; export default { name: "bottlenecks", @@ -152,9 +151,6 @@ } }, methods: { - formatSurveyDate(date) { - return formatSurveyDate(date); - }, filteredAndSortedBottlenecks() { return this.bottlenecksList .filter(bn => {
--- a/client/src/components/ImportStretches.vue Thu Mar 07 15:19:16 2019 +0100 +++ b/client/src/components/ImportStretches.vue Thu Mar 07 15:53:12 2019 +0100 @@ -34,7 +34,7 @@ }}</a> </div> <div class="py-2 col-2"> - {{ formatSurveyDate(stretch.properties["date_info"]) }} + {{ stretch.properties["date_info"] | surveyDate }} </div> <div class="py-2 col-3"> {{ stretch.properties["source_organization"] }} @@ -254,7 +254,6 @@ */ import { mapState, mapGetters } from "vuex"; import { displayError, displayInfo } from "@/lib/errors.js"; -import { formatSurveyDate } from "@/lib/date.js"; import { LAYERS } from "@/store/map.js"; export default { @@ -376,9 +375,6 @@ preventZoomOut: true }); }, - formatSurveyDate(d) { - return formatSurveyDate(d); - }, loadStretches() { return new Promise((resolve, reject) => { this.$store
--- a/client/src/components/fairway/Profiles.vue Thu Mar 07 15:19:16 2019 +0100 +++ b/client/src/components/fairway/Profiles.vue Thu Mar 07 15:53:12 2019 +0100 @@ -47,7 +47,7 @@ :key="wl" :value="wl" > - {{ formatSurveyDate(wl) }} + {{ wl | surveyDate }} </option> </select> </div> @@ -61,7 +61,7 @@ v-for="survey in surveys" :key="survey.date_info" :value="survey" - >{{ formatSurveyDate(survey.date_info) }}</option + >{{ survey.date_info | surveyDate }}</option > </select> </div> @@ -81,7 +81,7 @@ v-for="survey in additionalSurveys" :key="survey.date_info" :value="survey" - >{{ formatSurveyDate(survey.date_info) }}</option + >{{ survey.date_info | surveyDate }}</option > </select> </div> @@ -244,7 +244,6 @@ import Feature from "ol/Feature"; import LineString from "ol/geom/LineString"; import { displayError, displayInfo } from "@/lib/errors.js"; -import { formatSurveyDate } from "@/lib/date.js"; import { LAYERS } from "@/store/map.js"; export default { @@ -366,9 +365,6 @@ close() { this.$store.commit("application/showProfiles", false); }, - formatSurveyDate(date) { - return formatSurveyDate(date); - }, loadProfile(survey) { if (survey) { this.$store.commit("fairwayprofile/profileLoading", true);
--- a/client/src/components/importoverview/staging/StagingDetail.vue Thu Mar 07 15:19:16 2019 +0100 +++ b/client/src/components/importoverview/staging/StagingDetail.vue Thu Mar 07 15:53:12 2019 +0100 @@ -39,11 +39,11 @@ {{ data.kind.toUpperCase() }} </div> <div v-if="data.summary" class="mt-auto mb-auto small text-left date"> - {{ formatSurveyDate(data.summary.date) }} + {{ data.summary.date | surveyDate }} </div> <div v-else class="mt-auto mb-auto small text-left date">-</div> <div class="mt-auto mb-auto small text-left imported"> - {{ formatSurveyDate(data.enqueued.split("T")[0]) }} + {{ data.enqueued.split("T")[0] | surveyDate }} </div> <div class="mt-auto mb-auto small text-left username"> {{ data.user }} @@ -207,7 +207,7 @@ ><small>{{ result["fk-gauge-id"] }}</small></span > <span class="agmdetail text-left" - ><small>{{ formatDateTime(result["measure-date"]) }}</small></span + ><small>{{ result["measure-date"] | dateTime }}</small></span > <div @click="toggleDiff(index)" @@ -299,7 +299,6 @@ * Thomas Junk <thomas.junk@intevation.de> */ -import { formatSurveyDate, formatDateTime } from "@/lib/date.js"; import { STATES } from "@/store/imports.js"; import { HTTP } from "@/lib/http"; import { WFS } from "ol/format.js"; @@ -462,12 +461,6 @@ isSoundingResult(kind) { return kind === "SR"; }, - formatSurveyDate(date) { - return formatSurveyDate(date); - }, - formatDateTime(date) { - return formatDateTime(date); - }, needsApproval(item) { return item.status === STATES.NEEDSAPPROVAL; },
--- a/client/src/lib/date.js Thu Mar 07 15:19:16 2019 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,43 +0,0 @@ -/* 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 locale2 from "locale2"; - -const formatSurveyDate = current => { - return current - ? new Date(current).toLocaleDateString(locale2, { - day: "2-digit", - month: "2-digit", - year: "numeric" - }) - : ""; -}; - -const formatDateTime = date => { - if (!date) return ""; - const d = new Date(date); - return ( - d.toLocaleDateString(locale2, { - day: "2-digit", - month: "2-digit", - year: "numeric" - }) + - " - " + - d.toLocaleTimeString(locale2, { - hour12: false - }) - ); -}; - -export { formatSurveyDate, formatDateTime };
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/src/lib/filters.js Thu Mar 07 15:53:12 2019 +0100 @@ -0,0 +1,43 @@ +/* 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> + * Markus Kottländer <markus.kottlaender@intevation.de> + */ + +import locale2 from "locale2"; + +export default { + surveyDate(date) { + return date + ? new Date(date).toLocaleDateString(locale2, { + day: "2-digit", + month: "2-digit", + year: "numeric" + }) + : ""; + }, + dateTime(date) { + if (!date) return ""; + const d = new Date(date); + return ( + d.toLocaleDateString(locale2, { + day: "2-digit", + month: "2-digit", + year: "numeric" + }) + + " - " + + d.toLocaleTimeString(locale2, { + hour12: false + }) + ); + } +};
--- a/client/src/main.js Thu Mar 07 15:19:16 2019 +0100 +++ b/client/src/main.js Thu Mar 07 15:53:12 2019 +0100 @@ -15,7 +15,6 @@ // 3rd-party import Vue from "vue"; -import App from "./components/App.vue"; import VTooltip from "v-tooltip"; import GetTextPlugin from "vue-gettext"; import Snotify, { SnotifyPosition } from "vue-snotify"; @@ -25,10 +24,12 @@ import { library } from "@fortawesome/fontawesome-svg-core"; // local -import router from "./router"; -import store from "./store"; -import translations from "./locale/translations.json"; +import router from "@/router"; +import store from "@/store"; +import translations from "@/locale/translations.json"; +import filters from "@/lib/filters"; import { supportedLanguages, defaultLanguage } from "./locale/languages.js"; +import App from "@/components/App.vue"; import UIBoxHeader from "@/components/ui/UIBoxHeader"; import UITableHeader from "@/components/ui/UITableHeader"; import UITableBody from "@/components/ui/UITableBody"; @@ -168,6 +169,9 @@ Vue.component("UITableHeader", UITableHeader); Vue.component("UITableBody", UITableBody); +// register global filters +for (let name in filters) Vue.filter(name, filters[name]); + // global vue config Vue.config.productionTip = false;