Mercurial > gemma

annotate client/src/components/stretches/StretchForm.vue @ 4338:08aef146f95a

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Define_stretches: upload etd
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 05 Sep 2019 17:16:54 +0200
parents c9b60130cdfb
children 46d97ada1ce7
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 <template>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
2 <div class="d-flex flex-column">
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
3 <div class="ml-3 mr-3 my-4">
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
4 <div class="custom-file mt-4">
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
5 <input
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
6 accept=".zip,.txt"
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
7 type="file"
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
8 @change="fileSelected"
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
9 class="custom-file-input"
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
10 id="uploadFile"
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
11 />
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
12 <label class="pointer custom-file-label" for="uploadFile">
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
13 {{ uploadLabel }}
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
14 </label>
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
15 </div>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
16 </div>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
17 <div class="d-flex justify-content-between mt-2 p-2 border-top">
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
18 <button @click="$parent.showForm = false" class="btn btn-sm btn-warning">
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
19 <translate>Back</translate>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
20 </button>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
21 <button
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
22 @click="save"
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 type="submit"
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24 class="shadow-sm btn btn-sm btn-info submit-button"
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
25 :disabled="!uploadFile"
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
26 >
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
27 <translate>Submit</translate>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
28 </button>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
29 </div>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
30 </div>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
31 </template>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
32
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
33 <script>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
34 /* This is Free Software under GNU Affero General Public License v >= 3.0
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
35 * without warranty, see README.md and license for details.
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 *
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
37 * SPDX-License-Identifier: AGPL-3.0-or-later
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 * License-Filename: LICENSES/AGPL-3.0.txt
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 *
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
40 * Copyright (C) 2018, 2019 by via donau
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
41 * – Österreichische Wasserstraßen-Gesellschaft mbH
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
42 * Software engineering by Intevation GmbH
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
43 *
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
44 * Author(s):
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
45 * Thomas Junk <thomas.junk@intevation.de>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
46 * Tom Gottfried <tom.gottfried@intevation.de>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
47 * Markus Kottländer <markus.kottlaender@intevation.de>
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
48 */
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
49 import { displayError, displayInfo } from "@/lib/errors";
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
50 import { HTTP } from "@/lib/http";
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
51
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
52 export default {
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
53 props: ["editStretch"],
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
54 data() {
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
55 return {
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
56 uploadLabel: this.$gettext(this.$options.UPLOADLABEL),
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
57 uploadFile: null
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
58 };
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
59 },
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
60 computed: {},
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
61 methods: {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
62 initialState() {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
63 this.uploadFile = null;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
64 this.uploadLabel = this.$options.UPLOADLABEL;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
65 this.$parent.showForm = false;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
66 },
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
67 fileSelected(e) {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
68 const files = e.target.files || e.dataTransfer.files;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
69 if (!files) return;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
70 this.uploadLabel = files[0].name;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
71 this.uploadFile = files[0];
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
72 },
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
73 save() {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
74 let formData = new FormData();
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
75 formData.append("stsh", this.uploadFile);
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
76 HTTP.post(`/imports/stsh`, formData, {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
77 headers: {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
78 "X-Gemma-Auth": localStorage.getItem("token")
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
79 }
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
80 })
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
81 .then(() => {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
82 displayInfo({
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
83 title: this.$gettext("Import"),
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
84 message: this.$gettext("Upload of stretch complete")
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
85 });
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
86 this.initialState();
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
87 })
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
88 .catch(error => {
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
89 const { status, data } = error.response;
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
90 displayError({
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
91 title: this.$gettext("Backend Error"),
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
92 message: `${status}: ${data.message || data}`
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
93 });
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
94 });
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
95 }
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
96 },
4338
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
97 mounted() {},
08aef146f95a Define_stretches: upload etd
Thomas Junk <thomas.junk@intevation.de>
parents: 3365
diff changeset
98 UPLOADLABEL: "choose a .zip shapefile"
3289
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
99 };
c2cba529658d client: define stretches: seperated list and form into two components
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
100 </script>