'Form validation development'
This commit is contained in:
Burak Civan
parent
7695ce94b5
commit
1840d2aec5
@ -78,7 +78,28 @@ export default {
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.form-container .invalid-feedback {
|
||||
position: absolute;
|
||||
bottom: -18px;
|
||||
}
|
||||
|
||||
.form-container .has-error {
|
||||
position: relative;
|
||||
margin-bottom:unset !important;
|
||||
}
|
||||
|
||||
.form-container .has-error .form-control {
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
border-right:1px solid;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 991px) {
|
||||
.form-container .has-error {
|
||||
position: relative;
|
||||
margin-bottom:1.5rem !important;
|
||||
}
|
||||
|
||||
.current-tab-btn {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
@ -86,7 +86,7 @@
|
||||
description: "Input label (text before input)"
|
||||
},
|
||||
error: {
|
||||
type: String,
|
||||
type: [String, Object, Array],
|
||||
description: "Input error (below input)"
|
||||
},
|
||||
footerError: {
|
||||
|
||||
21
resources/assets/js/mixins/spa-global.js
vendored
21
resources/assets/js/mixins/spa-global.js
vendored
@ -9,6 +9,8 @@ export default {
|
||||
select: "",
|
||||
enabled: 1
|
||||
},
|
||||
error_field: false,
|
||||
error_field_name: ''
|
||||
}
|
||||
},
|
||||
|
||||
@ -16,6 +18,9 @@ export default {
|
||||
addItem() {
|
||||
this.newDatas = true;
|
||||
this.currentTab = undefined;
|
||||
this.error_field = true;
|
||||
this.error_field_name = '';
|
||||
|
||||
if (this.model) {
|
||||
this.model.name = '';
|
||||
this.model.rate = '';
|
||||
@ -26,6 +31,9 @@ export default {
|
||||
handeClickEdit(item, index) {
|
||||
this.newDatas = false;
|
||||
this.currentTab = index;
|
||||
this.error_field = true;
|
||||
this.error_field_name = '';
|
||||
|
||||
if (this.model) {
|
||||
this.model.name = item.name ? item.name : '';
|
||||
this.model.rate = item.rate ? item.rate : '';
|
||||
@ -77,6 +85,7 @@ export default {
|
||||
},
|
||||
onEditEvent(form_method, form_url, plus_data, form_list, form_id) {
|
||||
let self = this;
|
||||
|
||||
const formData = new FormData(this.$refs["form"]);
|
||||
const data = {};
|
||||
|
||||
@ -97,6 +106,7 @@ export default {
|
||||
data: data,
|
||||
})
|
||||
.then(response => {
|
||||
if (form_list.length) {
|
||||
form_list.forEach(item => {
|
||||
if (item.id == form_id) {
|
||||
item.name = response.data.data.name;
|
||||
@ -105,14 +115,19 @@ export default {
|
||||
item.type = plus_data == undefined ? 'normal' : ''
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.onSuccessEvent(response);
|
||||
this.error_field = false;
|
||||
}, this)
|
||||
.catch(error => {
|
||||
self.onFailError(error)
|
||||
this.success = false;
|
||||
});
|
||||
},
|
||||
onSubmitEvent(form_method, form_url, plus_data, form_list) {
|
||||
let self = this;
|
||||
|
||||
const formData = new FormData(this.$refs["form"]);
|
||||
const data = {};
|
||||
|
||||
@ -142,10 +157,16 @@ export default {
|
||||
});
|
||||
|
||||
this.onSuccessEvent(response);
|
||||
this.error_field = false;
|
||||
}, this)
|
||||
.catch(error => {
|
||||
self.onFailError(error)
|
||||
this.success = false;
|
||||
});
|
||||
},
|
||||
onFailError(error) {
|
||||
this.error_field_name = error.response.data.errors;
|
||||
this.error_field = true;
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
@ -119,16 +119,17 @@
|
||||
:placeholder="translations.currencies.name"
|
||||
prepend-icon="fas fa-font"
|
||||
form-classes="col-md-3"
|
||||
:error="error_field_name.name"
|
||||
v-model="model.name"
|
||||
/>
|
||||
<base-input
|
||||
:label="translations.currencies.code"
|
||||
:error="error_field_name.code"
|
||||
form-classes="col-md-3"
|
||||
>
|
||||
<el-select
|
||||
name="code"
|
||||
v-model="model.select"
|
||||
required="required"
|
||||
@change="onChangeCode(model.select)"
|
||||
filterable
|
||||
>
|
||||
@ -156,7 +157,7 @@
|
||||
:placeholder="translations.currencies.rate"
|
||||
prepend-icon="fas fa-percentage"
|
||||
form-classes="col-md-3"
|
||||
required="required"
|
||||
:error="error_field_name.rate"
|
||||
v-model="model.rate"
|
||||
/>
|
||||
<div class="mt-4 col-md-3 current-tab-btn">
|
||||
@ -185,8 +186,9 @@
|
||||
:placeholder="translations.currencies.name"
|
||||
prepend-icon="fas fa-font"
|
||||
v-model="model.name"
|
||||
:error="error_field_name.name"
|
||||
/>
|
||||
<base-input :label="translations.currencies.code">
|
||||
<base-input :label="translations.currencies.code" :error="error_field_name.code">
|
||||
<el-select
|
||||
name="code"
|
||||
v-model="model.select"
|
||||
@ -218,7 +220,7 @@
|
||||
:placeholder="translations.currencies.rate"
|
||||
prepend-icon="fas fa-percentage"
|
||||
v-model="model.rate"
|
||||
required="required"
|
||||
:error="error_field_name.rate"
|
||||
/>
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
@ -305,7 +307,6 @@ export default {
|
||||
type: [Object, Array],
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
active: 1,
|
||||
|
||||
@ -110,6 +110,7 @@
|
||||
:placeholder="translations.taxes.name"
|
||||
prepend-icon="fas fa-font"
|
||||
form-classes="col-md-4"
|
||||
:error="error_field_name.name"
|
||||
v-model="model.name"
|
||||
/>
|
||||
<base-input
|
||||
@ -119,8 +120,8 @@
|
||||
:placeholder="translations.taxes.rate"
|
||||
prepend-icon="fas fa-percentage"
|
||||
form-classes="col-md-4"
|
||||
:error="error_field_name.rate"
|
||||
v-model="model.rate"
|
||||
rules="required"
|
||||
/>
|
||||
<div class="mt-4 col-md-4 current-tab-btn">
|
||||
<base-button
|
||||
@ -146,6 +147,7 @@
|
||||
data-name="name"
|
||||
:placeholder="translations.taxes.name"
|
||||
prepend-icon="fas fa-font"
|
||||
:error="error_field_name.name"
|
||||
v-model="model.name"
|
||||
/>
|
||||
<base-input
|
||||
@ -154,8 +156,8 @@
|
||||
data-name="rate"
|
||||
:placeholder="translations.taxes.rate"
|
||||
prepend-icon="fas fa-percentage"
|
||||
:error="error_field_name.rate"
|
||||
v-model="model.rate"
|
||||
rules="required"
|
||||
/>
|
||||
<div>
|
||||
<div class="d-flex">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user