comparison client/src/components/systemconfiguration/PDFTemplates.vue @ 2459:408e0f4d4008

clinet:pdf-gen template:unifiy feedback messages for template * improve displaying a message after uploading a template * give a feedback message after deleting a template
author Fadi Abbud <fadi.abbud@intevation.de>
date Mon, 04 Mar 2019 10:26:19 +0100
parents 8044e379d8ee
children 9ae2a2f758bb
comparison
equal deleted inserted replaced
2458:204b0baac93c 2459:408e0f4d4008
28 <td v-if="template.country">{{ template.country }}</td> 28 <td v-if="template.country">{{ template.country }}</td>
29 <td v-else><i>global</i></td> 29 <td v-else><i>global</i></td>
30 <td class="text-right"> 30 <td class="text-right">
31 <button 31 <button
32 class="btn btn-sm btn-dark" 32 class="btn btn-sm btn-dark"
33 @click=" 33 @click="deleteTemplate(template)"
34 deleteTemplate(template);
35 showSuccessUploadMsg = false;
36 "
37 > 34 >
38 <font-awesome-icon icon="trash" /> 35 <font-awesome-icon icon="trash" />
39 </button> 36 </button>
40 </td> 37 </td>
41 </tr> 38 </tr>
42 </transition-group> 39 </transition-group>
43 </table> 40 </table>
44 </transition> 41 </transition>
45 <button 42 <button class="btn btn-info mt-2" @click="$refs.uploadTemplate.click()">
46 class="btn btn-info mt-2"
47 @click="
48 $refs.uploadTemplate.click();
49 showSuccessUploadMsg = false;
50 "
51 >
52 <font-awesome-icon 43 <font-awesome-icon
53 icon="spinner" 44 icon="spinner"
54 class="fa-spin fa-fw" 45 class="fa-spin fa-fw"
55 v-if="uploading" 46 v-if="uploading"
56 /> 47 />
57 <font-awesome-icon icon="upload" class="fa-fw" v-else /> 48 <font-awesome-icon icon="upload" class="fa-fw" v-else />
58 <translate>Upload new template</translate> 49 <translate>Upload new template</translate>
59 </button> 50 </button>
60 <div v-if="showSuccessUploadMsg" class="text-center">
61 <p class="text-muted" v-translate>
62 {{ templateToUpload.name }} uploaded successfully
63 </p>
64 </div>
65 </div> 51 </div>
66 </div> 52 </div>
67 </template> 53 </template>
68 54
69 <style lang="scss" scoped> 55 <style lang="scss" scoped>
89 * 75 *
90 * Author(s): 76 * Author(s):
91 * Markus Kottländer <markus@intevation.de> 77 * Markus Kottländer <markus@intevation.de>
92 */ 78 */
93 import { HTTP } from "@/lib/http"; 79 import { HTTP } from "@/lib/http";
94 import { displayError } from "@/lib/errors.js"; 80 import { displayError, displayInfo } from "@/lib/errors.js";
95 81
96 export default { 82 export default {
97 name: "pdftemplates", 83 name: "pdftemplates",
98 data() { 84 data() {
99 return { 85 return {
100 templates: [], 86 templates: [],
101 uploading: false, 87 uploading: false
102 templateToUpload: "",
103 showSuccessUploadMsg: false
104 }; 88 };
105 }, 89 },
106 methods: { 90 methods: {
107 uploadTemplate() { 91 uploadTemplate() {
108 const reader = new FileReader(); 92 const reader = new FileReader();
133 } 117 }
134 } 118 }
135 ) 119 )
136 .then(() => { 120 .then(() => {
137 this.loadTemplates(); 121 this.loadTemplates();
138 this.templateToUpload = template; 122 displayInfo({
139 this.showSuccessUploadMsg = true; 123 message:
124 template.name + " " + this.$gettext("uploaded successfully")
125 });
140 }) 126 })
141 .catch(e => { 127 .catch(e => {
142 const { status, data } = e.response; 128 const { status, data } = e.response;
143 displayError({ 129 displayError({
144 title: this.$gettext("Backend Error"), 130 title: this.$gettext("Backend Error"),
202 let removeIndex = this.templates.findIndex( 188 let removeIndex = this.templates.findIndex(
203 t => t.name === template.name 189 t => t.name === template.name
204 ); 190 );
205 if (removeIndex !== -1) { 191 if (removeIndex !== -1) {
206 this.templates.splice(removeIndex, 1); 192 this.templates.splice(removeIndex, 1);
193 displayInfo({
194 message:
195 template.name + " " + this.$gettext("deleted successfully")
196 });
207 } 197 }
208 }); 198 });
209 } 199 }
210 }, 200 },
211 cancel: { 201 cancel: {