comand-component-library 4.0.14 → 4.0.15

Sign up to get free protection for your applications and to get access to all the features.
Files changed (14) hide show
  1. package/dist/comand-component-library.js +1551 -1521
  2. package/dist/comand-component-library.umd.cjs +3 -3
  3. package/dist/style.css +1 -1
  4. package/package.json +2 -2
  5. package/src/components/CmdFancyBox.vue +2 -1
  6. package/src/components/CmdForm.vue +16 -2
  7. package/src/components/CmdFormElement.vue +0 -7
  8. package/src/components/CmdMainNavigation.vue +3 -3
  9. package/src/components/CmdOpeningHours.vue +29 -26
  10. package/src/components/CmdPageHeader.vue +1 -1
  11. package/src/components/CmdSiteHeader.vue +11 -9
  12. package/src/pages/BasicForm.vue +23 -20
  13. package/src/pages/ContactInformation.vue +13 -4
  14. package/src/pages/PageOverview.vue +33 -2
package/src/pages/BasicForm.vue CHANGED
@@ -1,13 +1,12 @@
1
1
  <template>
2
2
  <div class="cmd-pages-basic-form">
3
3
  <!-- being CmdForm -->
4
- <CmdForm :action="formAction"
5
- @submit="onSubmit"
4
+ <CmdForm @submit="onSubmit"
6
5
  novalidate="novalidate"
7
6
  :textLegend="getMessage('basic_form.legend')"
8
7
  :submitButton="submitButton"
9
8
  >
10
- <div class="flex-container no-flex">
9
+ <div v-if="configuration.salutation" class="flex-container no-flex">
11
10
  <!-- begin cmd-form-element -->
12
11
  <CmdFormElement
13
12
  element="input"
@@ -39,7 +38,7 @@
39
38
  <slot name="top"></slot>
40
39
  <!-- end slot (top) -->
41
40
 
42
- <div class="flex-container">
41
+ <div v-if="configuration.lastName || configuration.firstName" class="flex-container">
43
42
  <!-- begin cmd-form-element -->
44
43
  <CmdFormElement
45
44
  v-if="configuration.lastName"
@@ -47,7 +46,6 @@
47
46
  :type="configuration.lastName?.type || 'text'"
48
47
  iconClass="icon-user-profile"
49
48
  :labelText="getMessage('basic_form.labeltext.last_name')"
50
- :tooltipText="formData.lastName.error ? formData.lastName.errorMessage : 'Type your surname!'"
51
49
  :required="configuration.lastName?.required"
52
50
  :name="configuration.lastName?.name || 'last-name'"
53
51
  :placeholder="getMessage('basic_form.placeholder.last_name')"
@@ -64,7 +62,6 @@
64
62
  :type="configuration.firstName?.type || 'text'"
65
63
  iconClass="icon-user-profile"
66
64
  :labelText="getMessage('basic_form.labeltext.first_name')"
67
- :tooltipText="formData.firstName.error ? formData.firstName.errorMessage : 'Type your first name!'"
68
65
  :placeholder="getMessage('basic_form.placeholder.first_name')"
69
66
  :required="configuration.firstName?.required"
70
67
  :name="configuration.firstName?.name || 'first-name'"
@@ -87,7 +84,6 @@
87
84
  :name="configuration.email?.name || 'email'"
88
85
  v-model="formData.email.value"
89
86
  :status="formData.email.error ? 'error' : ''"
90
- :tooltipText="formData.email.error ? formData.email.errorMessage : 'Type your email!'"
91
87
  @validate="onValidate"
92
88
  />
93
89
  <!-- end cmd-form-element -->
@@ -104,15 +100,15 @@
104
100
  :required="configuration.phone?.required"
105
101
  :name="configuration.phone?.name || 'phone'"
106
102
  :status="formData.phone.error ? 'error' : ''"
107
- :tooltipText="formData.phone.error ? formData.phone.errorMessage : 'Type your phone number!'"
108
103
  @validate="onValidate"
109
104
  />
110
105
  <!-- end cmd-form-element -->
111
106
  </div>
112
107
 
113
- <div class="flex-container">
108
+ <div v-if="configuration.streetNo || configuration.zip || configuration.city" class="flex-container">
114
109
  <!-- begin cmd-form-element -->
115
110
  <CmdFormElement
111
+ v-if="configuration.streetNo"
116
112
  element="input"
117
113
  :type="configuration.streetNo?.type || 'text'"
118
114
  :labelText="getMessage('basic_form.labeltext.street_no')"
@@ -121,7 +117,6 @@
121
117
  :name="configuration.streetNo?.name || 'street-no'"
122
118
  v-model="formData.streetNo.value"
123
119
  :status="formData.streetNo.error ? 'error' : ''"
124
- :tooltipText="formData.streetNo.error ? formData.streetNo.errorMessage : 'Type your street and number!'"
125
120
  @validate="onValidate"
126
121
  />
127
122
  <!-- end cmd-form-element -->
@@ -129,6 +124,7 @@
129
124
  <div class="input-wrapper">
130
125
  <!-- begin cmd-form-element -->
131
126
  <CmdFormElement
127
+ v-if="configuration.zip"
132
128
  element="input"
133
129
  :type="configuration.zip?.type || 'number'"
134
130
  :labelText="getMessage('basic_form.labeltext.zip')"
@@ -137,12 +133,13 @@
137
133
  :name="configuration.zip?.name || 'zip'"
138
134
  v-model="formData.zip.value"
139
135
  :status="formData.zip.error ? 'error' : ''"
140
- :tooltipText="formData.zip.error ? formData.zip.errorMessage : 'Type your zip/postal code!'"
141
136
  @validate="onValidate"
142
137
  />
143
138
  <!-- end cmd-form-element -->
139
+
144
140
  <!-- begin cmd-form-element -->
145
141
  <CmdFormElement
142
+ v-if="configuration.city"
146
143
  element="input"
147
144
  :type="configuration.city?.type || 'text'"
148
145
  :labelText="getMessage('basic_form.labeltext.city')"
@@ -151,7 +148,6 @@
151
148
  :name="configuration.city?.name || 'zip'"
152
149
  v-model="formData.city.value"
153
150
  :status="formData.city.error ? 'error' : ''"
154
- :tooltipText="formData.city.error ? formData.city.errorMessage : 'Type your city!'"
155
151
  @validate="onValidate"
156
152
  />
157
153
  <!-- end cmd-form-element -->
@@ -159,6 +155,7 @@
159
155
 
160
156
  <!-- begin cmd-form-element -->
161
157
  <CmdFormElement
158
+ v-if="configuration.additionalAddressInfo"
162
159
  element="input"
163
160
  :type="configuration.additionalAddressInfo?.type || 'text'"
164
161
  :labelText="getMessage('basic_form.labeltext.additional_address_info')"
@@ -167,7 +164,6 @@
167
164
  :name="configuration.additionalAddressInfo?.name || 'additional-address-info'"
168
165
  v-model="formData.additionalAddressInfo.value"
169
166
  :status="formData.additionalAddressInfo.error ? 'error' : ''"
170
- :tooltipText="formData.additionalAddressInfo.error ? formData.additionalAddressInfo.errorMessage : 'Type additional address information!'"
171
167
  @validate="onValidate"
172
168
  />
173
169
  <!-- end cmd-form-element -->
@@ -175,7 +171,8 @@
175
171
 
176
172
  <!-- begin cmd-form-element -->
177
173
  <CmdFormElement
178
- :type="configuration.additionalText?.type || 'textarea'"
174
+ v-if="configuration.additionalText"
175
+ :element="configuration.additionalText?.element || 'textarea'"
179
176
  :labelText="getMessage('basic_form.labeltext.additional_text')"
180
177
  :placeholder="getMessage('basic_form.placeholder.additional_text')"
181
178
  :required="configuration.additionalText?.required"
@@ -192,6 +189,7 @@
192
189
 
193
190
  <!-- begin cmd-form-element -->
194
191
  <CmdFormElement
192
+ v-if="configuration.acceptPrivacy"
195
193
  element="input"
196
194
  type="checkbox"
197
195
  :required="configuration.acceptPrivacy?.required"
@@ -254,6 +252,9 @@ export default {
254
252
  }
255
253
  },
256
254
  props: {
255
+ /**
256
+ * configuration for form-elements used in form
257
+ */
257
258
  configuration: {
258
259
  type: Object,
259
260
  default() {
@@ -298,7 +299,7 @@ export default {
298
299
  },
299
300
  additionalText: {
300
301
  required: false,
301
- type: "textarea"
302
+ element: "textarea"
302
303
  },
303
304
  acceptPrivacy: {
304
305
  required: true,
@@ -307,14 +308,16 @@ export default {
307
308
  }
308
309
  }
309
310
  },
311
+ /**
312
+ * receiver e-mail-address the form is sent to
313
+ */
310
314
  receiverEmailAddress: {
311
315
  type: String,
312
316
  default: ""
313
317
  },
314
- formAction: {
315
- type: String,
316
- required: true
317
- },
318
+ /**
319
+ * submit-button to submit all form-data
320
+ */
318
321
  submitButton: {
319
322
  type: Object,
320
323
  default() {
@@ -322,6 +325,7 @@ export default {
322
325
  iconClass: "icon-message-send",
323
326
  text: "Send mail",
324
327
  type: "submit",
328
+ position: "belowFieldset",
325
329
  primary: true
326
330
  }
327
331
  }
@@ -333,7 +337,6 @@ export default {
333
337
  openFancyBox({url: event.target.getAttribute('href')})
334
338
  })
335
339
  },
336
-
337
340
  methods: {
338
341
  onSubmit(event) {
339
342
  this.onValidate();
package/src/pages/ContactInformation.vue CHANGED
@@ -1,12 +1,12 @@
1
1
  <template>
2
- <!-- begin CmdBasicForm -->
2
+ <!-- begin basicForm -->
3
3
  <BasicForm v-if="contactFormOnly" v-bind="basicForm" />
4
- <!-- end CmdBasicForm -->
4
+ <!-- end basicForm -->
5
5
 
6
6
  <div v-else class="flex-container">
7
- <!-- begin CmdBasicForm -->
7
+ <!-- begin basicForm -->
8
8
  <BasicForm v-bind="basicForm" />
9
- <!-- end CmdBasicForm -->
9
+ <!-- end basicForm -->
10
10
 
11
11
  <!-- begin additional-columns -->
12
12
  <div class="flex-container vertical">
@@ -30,14 +30,23 @@
30
30
  export default {
31
31
  name: "ContactInformation",
32
32
  props: {
33
+ /**
34
+ * properties for basicForm-component
35
+ */
33
36
  basicForm: {
34
37
  type: Object,
35
38
  default: null
36
39
  },
40
+ /**
41
+ * properties for CmdAddressData-component
42
+ */
37
43
  cmdAddressData: {
38
44
  type: Object,
39
45
  default: null
40
46
  },
47
+ /**
48
+ * properties for CmdGoogleMaps-component
49
+ */
41
50
  cmdGoogleMaps: {
42
51
  type: Object,
43
52
  default: null
package/src/pages/PageOverview.vue CHANGED
@@ -14,7 +14,7 @@
14
14
  <span>Contact Information</span>
15
15
  </h2>
16
16
  <ContactInformation
17
- :cmdBasicForm="{}"
17
+ :basicForm="basicForm"
18
18
  :cmdAddressData="{}"
19
19
  :cmdGoogleMaps="{}">
20
20
  <template v-slot:additional-info>
@@ -68,7 +68,38 @@ export default {
68
68
  listOfDownloadsData,
69
69
  listOfSiteLinksData,
70
70
  basicForm: {
71
- formAction: "POST"
71
+ configuration: {
72
+ salutation: {
73
+ name: "salutation",
74
+ default: "m",
75
+ replaceInputType: true
76
+ },
77
+ lastName: {
78
+ name: "surname",
79
+ required: true,
80
+ type: "text"
81
+ },
82
+ firstName: {
83
+ required: false,
84
+ type: "text"
85
+ },
86
+ email: {
87
+ required: true,
88
+ type: "email"
89
+ },
90
+ phone: {
91
+ required: false,
92
+ type: "phone"
93
+ },
94
+ additionalText: {
95
+ required: false,
96
+ element: "textarea"
97
+ },
98
+ acceptPrivacy: {
99
+ required: true,
100
+ replaceInputType: true
101
+ }
102
+ }
72
103
  }
73
104
  }
74
105
  }