|
|
@@ -3,7 +3,7 @@ const FormBus = new Vue();
|
|
|
Vue.component('component-text', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="text"' +
|
|
|
' :id="id"' +
|
|
|
' :maxlength="maxlength"' +
|
|
|
@@ -15,7 +15,7 @@ Vue.component('component-text', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -28,7 +28,7 @@ Vue.component('component-text', {
|
|
|
Vue.component('component-textarea', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<textarea ' +
|
|
|
' :id="id"' +
|
|
|
' :readonly="readonly"' +
|
|
|
@@ -39,7 +39,7 @@ Vue.component('component-textarea', {
|
|
|
' :value="value"' +
|
|
|
' @input="update($event, name)"></textarea>' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -52,7 +52,7 @@ Vue.component('component-textarea', {
|
|
|
Vue.component('component-url', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="url"' +
|
|
|
' :id="id"' +
|
|
|
' :maxlength="maxlength"' +
|
|
|
@@ -64,7 +64,7 @@ Vue.component('component-url', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -77,7 +77,7 @@ Vue.component('component-url', {
|
|
|
Vue.component('component-number', {
|
|
|
props: ['class', 'id', 'description', 'min', 'max', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="number"' +
|
|
|
' :id="id"' +
|
|
|
' :min="min"' +
|
|
|
@@ -91,7 +91,7 @@ Vue.component('component-number', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -104,7 +104,7 @@ Vue.component('component-number', {
|
|
|
Vue.component('component-email', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="email"' +
|
|
|
' :id="id"' +
|
|
|
' :maxlength="maxlength"' +
|
|
|
@@ -116,7 +116,7 @@ Vue.component('component-email', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -129,7 +129,7 @@ Vue.component('component-email', {
|
|
|
Vue.component('component-tel', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="tel"' +
|
|
|
' :id="id"' +
|
|
|
' :maxlength="maxlength"' +
|
|
|
@@ -141,7 +141,7 @@ Vue.component('component-tel', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -154,7 +154,7 @@ Vue.component('component-tel', {
|
|
|
Vue.component('component-password', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="password"' +
|
|
|
' :id="id"' +
|
|
|
' :maxlength="maxlength"' +
|
|
|
@@ -166,7 +166,7 @@ Vue.component('component-password', {
|
|
|
' :value="value"' +
|
|
|
'@input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -179,7 +179,7 @@ Vue.component('component-password', {
|
|
|
Vue.component('component-date', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="date" ' +
|
|
|
' :id="id"' +
|
|
|
' :readonly="readonly"' +
|
|
|
@@ -190,7 +190,7 @@ Vue.component('component-date', {
|
|
|
' :value="value"' +
|
|
|
' @input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -203,7 +203,7 @@ Vue.component('component-date', {
|
|
|
Vue.component('component-color', {
|
|
|
props: ['class', 'id', 'description', 'maxlength', 'readonly', 'required', 'disabled', 'placeholder', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<input type="color" ' +
|
|
|
' :id="id"' +
|
|
|
' :readonly="readonly"' +
|
|
|
@@ -214,7 +214,7 @@ Vue.component('component-color', {
|
|
|
' :value="value"' +
|
|
|
' @input="update($event, name)">' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -227,7 +227,7 @@ Vue.component('component-color', {
|
|
|
Vue.component('component-select', {
|
|
|
props: ['class', 'id', 'description', 'readonly', 'required', 'disabled', 'label', 'name', 'type', 'options', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{label}}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<select' +
|
|
|
' :id="id"' +
|
|
|
' :name="name"' +
|
|
|
@@ -238,7 +238,7 @@ Vue.component('component-select', {
|
|
|
'<option v-for="option,optionkey in options" v-bind:value="optionkey">{{option}}</option>' +
|
|
|
'</select>' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, name)
|
|
|
@@ -251,7 +251,7 @@ Vue.component('component-select', {
|
|
|
Vue.component('component-checkbox', {
|
|
|
props: ['class', 'id', 'description', 'readonly', 'required', 'disabled', 'label', 'checkboxlabel', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<label class="control-group">{{ checkboxlabel }}' +
|
|
|
'<input type="checkbox"' +
|
|
|
' :id="id"' +
|
|
|
@@ -263,7 +263,7 @@ Vue.component('component-checkbox', {
|
|
|
' @change="update($event, value, name)">' +
|
|
|
'<span class="checkmark"></span>' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</label>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
@@ -277,7 +277,7 @@ Vue.component('component-checkbox', {
|
|
|
Vue.component('component-checkboxlist', {
|
|
|
props: ['class', 'description', 'readonly', 'required', 'disabled', 'label', 'checkboxlabel', 'options', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<label v-for="option, optionvalue in options" class="control-group">{{ option }}' +
|
|
|
'<input type="checkbox"' +
|
|
|
' :id="optionvalue"' +
|
|
|
@@ -286,7 +286,7 @@ Vue.component('component-checkboxlist', {
|
|
|
' @change="update($event, value, optionvalue, name)">' +
|
|
|
'<span class="checkmark"></span>' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
update: function($event, value, optionvalue, name)
|
|
|
@@ -304,7 +304,7 @@ Vue.component('component-checkboxlist', {
|
|
|
Vue.component('component-radio', {
|
|
|
props: ['class', 'id', 'description', 'readonly', 'required', 'disabled', 'options', 'label', 'name', 'type', 'value', 'errors'],
|
|
|
template: '<div class="large">' +
|
|
|
- '<label>{{ label }}</label>' +
|
|
|
+ '<label>{{ $t(label) }}</label>' +
|
|
|
'<label v-for="option,optionvalue in options" class="control-group">{{ option }}' +
|
|
|
'<input type="radio"' +
|
|
|
' :id="id"' +
|
|
|
@@ -317,7 +317,7 @@ Vue.component('component-radio', {
|
|
|
' @change="update($event, value, name)">' +
|
|
|
'<span class="radiomark"></span>' +
|
|
|
'<span v-if="errors[name]" class="error">{{ errors[name] }}</span>' +
|
|
|
- '<span v-else class="fielddescription"><small>{{ description }}</small></span>' +
|
|
|
+ '<span v-else class="fielddescription"><small>{{ $t(description) }}</small></span>' +
|
|
|
'</label>' +
|
|
|
'</div>',
|
|
|
methods: {
|
|
|
@@ -339,9 +339,9 @@ Vue.component('tab-meta', {
|
|
|
'v-model="formdata[index]"' +
|
|
|
'v-bind="field">' +
|
|
|
'</component>' +
|
|
|
- '<div v-if="saved" class="metaLarge"><div class="metaSuccess">Saved successfully</div></div>' +
|
|
|
- '<div v-if="errors" class="metaLarge"><div class="metaErrors">Please correct the errors above</div></div>' +
|
|
|
- '<div class="large"><input type="submit" @click.prevent="saveInput" value="save"></input></div>' +
|
|
|
+ '<div v-if="saved" class="metaLarge"><div class="metaSuccess">{{ $t(\'Saved successfully\') }}</div></div>' +
|
|
|
+ '<div v-if="errors" class="metaLarge"><div class="metaErrors">{{ $t(\'Please correct the errors above\') }}</div></div>' +
|
|
|
+ '<div class="large"><input type="submit" @click.prevent="saveInput" :value="$t(\'save\')"></input></div>' +
|
|
|
'</form></section>',
|
|
|
methods: {
|
|
|
selectComponent: function(field)
|
|
|
@@ -356,6 +356,12 @@ Vue.component('tab-meta', {
|
|
|
})
|
|
|
|
|
|
let meta = new Vue({
|
|
|
+
|
|
|
+ i18n: new VueI18n({
|
|
|
+ locale: language,
|
|
|
+ messages: vuejsLabels
|
|
|
+ }),
|
|
|
+
|
|
|
delimiters: ['${', '}'],
|
|
|
el: '#metanav',
|
|
|
data: function () {
|
trendschau