Skip to content

Commit

Permalink
field rules
Browse files Browse the repository at this point in the history
  • Loading branch information
@szczepanmasny
szczepanmasny committed Feb 15, 2019
1 parent f93dbaa commit 95e8d68
Show file tree
Hide file tree
Showing 5 changed files with 137 additions and 91 deletions.
28 changes: 16 additions & 12 deletions src/crud/components/ChildDetails.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,33 +8,33 @@
<div v-for="(field, i) in fields" :key="i">

<!-- input -->
<v-text-field :required="isRequired(field.required)" hide-details v-if="field.type == 'input'" :label="field.text"
<v-text-field :rules="fieldRules(field)" hide-details v-if="field.type == 'input'" :label="field.text"
v-model="field.value"></v-text-field>

<!-- number -->
<v-text-field hide-details v-else-if="field.type == 'number'" :label="field.text" v-model="field.value" type="number" step="1" min="0"></v-text-field>

<!-- decimal -->
<v-text-field :required="isRequired(field.required)" hide-details v-else-if="field.type == 'decimal'" :label="field.text" v-model="field.value" type="number" step="0.01" min="0"></v-text-field>
<v-text-field :rules="fieldRules(field)" hide-details v-else-if="field.type == 'decimal'" :label="field.text" v-model="field.value" type="number" step="0.01" min="0"></v-text-field>

<!--date -->
<v-text-field :required="isRequired(field.required)" hide-details v-else-if="field.type == 'date'" :label="field.text" v-model="field.value" mask="####-##-##" return-masked-value></v-text-field>
<v-text-field :rules="fieldRules(field)" hide-details v-else-if="field.type == 'date'" :label="field.text" v-model="field.value" mask="####-##-##" return-masked-value></v-text-field>

<!--time -->
<v-text-field :required="isRequired(field.required)" hide-details v-else-if="field.type == 'time'" :label="field.text" v-model="field.value" mask="##:##" return-masked-value></v-text-field>
<v-text-field :rules="fieldRules(field)" hide-details v-else-if="field.type == 'time'" :label="field.text" v-model="field.value" mask="##:##" return-masked-value></v-text-field>

<!--datetime -->
<v-text-field :required="isRequired(field.required)" hide-details v-else-if="field.type == 'datetime'" :label="field.text" v-model="field.value" mask="####-##-## ##:##:##" return-masked-value></v-text-field>
<v-text-field :rules="fieldRules(field)" hide-details v-else-if="field.type == 'datetime'" :label="field.text" v-model="field.value" mask="####-##-## ##:##:##" return-masked-value></v-text-field>

<!-- text area -->
<v-textarea :required="isRequired(field.required)" hide-details v-else-if="field.type == 'textarea'" :label="field.text"
<v-textarea :rules="fieldRules(field)" hide-details v-else-if="field.type == 'textarea'" :label="field.text"
v-model="field.value"></v-textarea>

<!-- select -->
<template v-else-if="field.type == 'select'">
<v-autocomplete v-if="field.async"
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
:loading="searchLoading['search_' + field.name]"
:items="searchData['search_' + field.name]"
v-model="field.value"
Expand All @@ -49,7 +49,7 @@
></v-autocomplete>
<v-autocomplete v-else
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
:items="field.list.data"
v-model="field.value"
:item-text="field.list.text"
Expand All @@ -62,7 +62,7 @@
</template>

<span v-else-if="field.type == 'checkbox'">
<input :required="isRequired(field.required)" type="checkbox" color="blue" :label="field.text" v-model="field.value">
<input :rules="fieldRules(field)" type="checkbox" color="blue" :label="field.text" v-model="field.value">
<label class="checkbox-label">{{field.text}}</label>
</span>

Expand Down Expand Up @@ -196,7 +196,8 @@ export default {
rules() {
let self = this;
return {
input: [v => !!v || self.$t("global.details.rules.required")]
input: [v => !!v || self.$t("global.details.rules.required")],
required: v => !!v || self.$t("global.details.rules.required")
};
}
},
Expand Down Expand Up @@ -278,8 +279,11 @@ export default {
}
},
methods: {
isRequired(required) {
return required != undefined ? required : true;
fieldRules(field) {
let rules = []
let required = field.required != undefined ? field.required : true;
rules.push(this.rules.required)
return rules
},
reset() {
this.$parent.reset();
Expand Down
47 changes: 27 additions & 20 deletions src/crud/components/ItemDetails.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
<!-- input -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-if="field.type == 'input'"
:label="field.text"
v-model="field.value"
Expand All @@ -28,7 +28,7 @@
<!-- number -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'number'"
:label="field.text"
v-model="field.value"
Expand All @@ -40,7 +40,7 @@
<!-- decimal -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'decimal'"
:label="field.text"
v-model="field.value"
Expand All @@ -52,7 +52,7 @@
<!--date -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'date'"
:label="field.text"
v-model="field.value"
Expand All @@ -63,7 +63,7 @@
<!--time -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'time'"
:label="field.text"
v-model="field.value"
Expand All @@ -74,7 +74,7 @@
<!--datetime -->
<v-text-field
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'datetime'"
:label="field.text"
v-model="field.value"
Expand All @@ -85,7 +85,7 @@
<!-- text area -->
<v-textarea
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
v-else-if="field.type == 'textarea'"
:label="field.text"
v-model="field.value"
Expand Down Expand Up @@ -116,7 +116,7 @@
<v-autocomplete
v-if="field.async"
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
:loading="searchLoading['search_' + field.name]"
:items="searchData['search_' + field.name]"
v-model="field.value"
Expand All @@ -132,7 +132,7 @@
<v-autocomplete
v-else
hide-details
:required="isRequired(field.required)"
:rules="fieldRules(field)"
:items="field.list.data"
v-model="field.value"
:item-text="field.list.text"
Expand Down Expand Up @@ -233,7 +233,7 @@ export default {
uploadLoaders: {},
searchPhrases: {},
searchLoading: {},
searchData: {}
searchData: {},
};
},
created() {
Expand Down Expand Up @@ -434,7 +434,9 @@ export default {
rules() {
let self = this;
return {
input: [v => !!v || self.$t("global.details.rules.required")]
required: v => !!v || self.$t("global.details.rules.required"),
minLength: (v) => v.length >= 24 || 'Min ' + 24 + ' characters',
maxLength: (v, val) => v.length <= val || 'Max ' + val + ' characters'
};
}
},
Expand All @@ -461,29 +463,34 @@ export default {
close() {
this.details.show = false;
},
isRequired(required) {
if (this.details.action == "multiedit") {
return false;
} else {
return required != undefined ? required : true;
fieldRules(field) {
let rules = []
let required = field.required != undefined ? field.required : true;
if (this.details.action != "multiedit"){
if (required) {
rules.push(this.rules.required)
}
}
return rules
},
update() {
this.close();
this.updateItem([
this.details.id,
this.itemData,
this.$t("global.alerts.updated"),
this.$t("global.alerts.updateError")
]);
]).then(response => {
this.close();
})
},
store() {
this.close();
this.storeItem([
this.itemData,
this.$t("global.alerts.stored"),
this.$t("global.alerts.storeError")
]);
]).then(response => {
this.close();
})
},
updateSelected() {
let filteredFields = this.fields.filter(field => field.updateColumn);
Expand Down
13 changes: 13 additions & 0 deletions src/crud/components/ItemDetailsExtended.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -264,6 +264,13 @@ export default {
},
computed: {
...mapState("crud", ["item", "itemIdColumn", "detailsDialog"]),
rules() {
let self = this;
return {
input: [v => !!v || self.$t("global.details.rules.required")],
required: v => !!v || self.$t("global.details.rules.required")
};
},
fields() {
let self = this;
let result = this.fieldsInfo.map(field => {
Expand Down Expand Up @@ -303,6 +310,12 @@ export default {
}
}, 100);
},
fieldRules(field) {
let rules = []
let required = field.required != undefined ? field.required : true;
rules.push(this.rules.required)
return rules
},
remember(field) {
field.oldValue = field.value;
}
Expand Down
10 changes: 6 additions & 4 deletions src/crud/mixins/child.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -108,22 +108,24 @@ export default {
}
},
update(id, data) {
this.close()
this.updateChild([
id,
data,
this.$t('global.alerts.updated'),
this.path
])
]).then(response => {
this.close();
})
},
store(data) {
data[this.fkName] = this.item[this.itemIdColumn]
this.close()
this.storeChild([
data,
this.$t('global.alerts.stored'),
this.path
])
]).then(response => {
this.close();
})
},
itemElementsClosed(){
this.getItemDetails([this.item[this.itemIdColumn]])
Expand Down
Loading

0 comments on commit 95e8d68

Please sign in to comment.