Mercurial > gemma
comparison client/src/components/Pdftool.vue @ 2387:f185503ef35a
client: unified box's header styles by creating a reusable component
The clients html/css and resulting look and feel of the app is partially very inconsistent.
By moving code to more small and reusable components consistency will hopefully be increased.
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Mon, 25 Feb 2019 15:02:34 +0100 |
parents | 6efd7ecd3a7d |
children | bb5286acfee2 |
comparison
equal
deleted
inserted
replaced
2386:24e3e86b8cb6 | 2387:f185503ef35a |
---|---|
4 'box ui-element rounded bg-white text-nowrap', | 4 'box ui-element rounded bg-white text-nowrap', |
5 { expanded: showPdfTool } | 5 { expanded: showPdfTool } |
6 ]" | 6 ]" |
7 > | 7 > |
8 <div style="width: 18rem"> | 8 <div style="width: 18rem"> |
9 <h6 class="mb-0 py-2 px-3 border-bottom d-flex align-items-center"> | 9 <UIBoxHeader |
10 <font-awesome-icon icon="file-pdf" class="mr-2"></font-awesome-icon> | 10 icon="file-pdf" |
11 <translate>Generate PDF</translate> | 11 title="Generate PDF" |
12 <font-awesome-icon | 12 :closeCallback="close" |
13 icon="times" | 13 /> |
14 class="ml-auto text-muted pointer" | |
15 @click="$store.commit('application/showPdfTool', false)" | |
16 ></font-awesome-icon> | |
17 </h6> | |
18 <div class="p-3 text-left"> | 14 <div class="p-3 text-left"> |
19 <select | 15 <select |
20 @change="applyTemplateToForm" | 16 @change="applyTemplateToForm" |
21 v-model="form.template" | 17 v-model="form.template" |
22 class="form-control d-block mb-2 w-100 font-weight-bold" | 18 class="form-control d-block mb-2 w-100 font-weight-bold" |
197 | 193 |
198 return filename; | 194 return filename; |
199 } | 195 } |
200 }, | 196 }, |
201 methods: { | 197 methods: { |
198 close() { | |
199 this.$store.commit("application/showPdfTool", false); | |
200 }, | |
202 // When a template is chosen from the dropdown, its propoerties are | 201 // When a template is chosen from the dropdown, its propoerties are |
203 // applied to the rest of the form. | 202 // applied to the rest of the form. |
204 applyTemplateToForm() { | 203 applyTemplateToForm() { |
205 if (this.form.template) { | 204 if (this.form.template) { |
206 HTTP.get("/templates/print/" + this.form.template.name, { | 205 HTTP.get("/templates/print/" + this.form.template.name, { |