working on displaying errors
This commit is contained in:
parent
bb0f26c1fc
commit
81431f1896
4 changed files with 45 additions and 8 deletions
|
@ -1,10 +1,12 @@
|
|||
<script>
|
||||
import moment from 'moment'
|
||||
import axios from 'axios'
|
||||
import Error from '@/types/ErrorType.vue'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
customer_list: []
|
||||
customer_list: [],
|
||||
errors: {}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
|
@ -32,6 +34,15 @@ export default {
|
|||
minute: '2-digit',
|
||||
second: '2-digit'})
|
||||
},
|
||||
async error(msg) {
|
||||
let e = new Error()
|
||||
e.msg = msg
|
||||
e.id = crypto.randomUUID()
|
||||
this.errors[e.id] = e
|
||||
setTimeout(() => {
|
||||
delete this.errors[e.id]
|
||||
}, 10000)
|
||||
},
|
||||
async getCustomerList(name) {
|
||||
console.log("searching customers...")
|
||||
if (this.customer_list.length == 0) {
|
||||
|
|
16
src/components/ErrorBanner.vue
Normal file
16
src/components/ErrorBanner.vue
Normal file
|
@ -0,0 +1,16 @@
|
|||
<template>
|
||||
<v-row>
|
||||
<v-list>
|
||||
<v-list-item v-for="e in errors" :key="e.id">
|
||||
<v-banner color="error" icon="mdi-exclamation-thick">{{ e.msg }}</v-banner>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-row>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
errors: {}
|
||||
}
|
||||
}
|
||||
</script>
|
6
src/types/ErrorType.vue
Normal file
6
src/types/ErrorType.vue
Normal file
|
@ -0,0 +1,6 @@
|
|||
<script>
|
||||
export default class Error {
|
||||
id = "";
|
||||
msg = "";
|
||||
}
|
||||
</script>
|
|
@ -63,6 +63,7 @@
|
|||
<v-textarea rows=3 label="Office Comments" v-model="contract.office_comments"></v-textarea>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<ErrorBanner :errors="errors" />
|
||||
</v-container>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
|
@ -82,6 +83,7 @@
|
|||
<script>
|
||||
import axios from 'axios'
|
||||
import DatePicker from '@vuepic/vue-datepicker'
|
||||
import ErrorBanner from '@/components/ErrorBanner.vue'
|
||||
import methods from '@/CommonMethods.vue'
|
||||
import Product from '@/types/ProductType.vue'
|
||||
export default {
|
||||
|
@ -89,7 +91,8 @@ export default {
|
|||
setcontract: {}
|
||||
},
|
||||
components: {
|
||||
DatePicker
|
||||
DatePicker,
|
||||
ErrorBanner
|
||||
},
|
||||
watch: {
|
||||
setcontract(newval) {
|
||||
|
@ -147,14 +150,15 @@ export default {
|
|||
}).then(resp => {
|
||||
console.log("Saved Contract : " + JSON.stringify(resp.data))
|
||||
this.saving = false
|
||||
if (this.contract.isNew) {
|
||||
if (resp.data == true) {
|
||||
if (this.contract.isNew) {
|
||||
this.$emit('contractupdate', resp.data)
|
||||
} else {
|
||||
console.log("Not Saved")
|
||||
this.$emit('contractupdate', resp.data)
|
||||
}
|
||||
} else {
|
||||
this.$emit('contractupdate', resp.data)
|
||||
this.error("Contract not saved.")
|
||||
console.log("Not Saved")
|
||||
}
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
|
|
Loading…
Reference in a new issue