DialogHeading: smarter about close button - simplify dialogs

This commit is contained in:
2020-01-16 13:54:40 -08:00
parent 8b39b37770
commit dda53e7b56
9 changed files with 19 additions and 43 deletions

View File

@ -2,11 +2,7 @@
<div class="text-center">
<v-dialog v-model="show" width="500">
<v-card>
<DialogHeading title="Add Materials">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">clear</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Add Materials" @hide="show = false" />
<v-card-text class="ma-0 pa-0">

View File

@ -3,11 +3,7 @@
<v-dialog v-model="show" width="300">
<v-form v-model="valid">
<v-card>
<DialogHeading title="Add Section">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Add Section" @hide="show = false" />
<v-card-text class="my-0 pb-0 pt-2">
<v-text-field

View File

@ -3,7 +3,11 @@
<v-card-title class="subtitle-1 ma-0 pa-0 pl-1">
<span class="px-2 py-0">{{ title }}</span>
<v-spacer/>
<slot/>
<slot>
<v-btn icon class="ma-0 pa-0" @click="hide()">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</slot>
</v-card-title>
</v-card>
</template>
@ -14,7 +18,12 @@ export default {
title: {
type: String,
default: 'Title',
}
},
},
methods: {
hide: function(id) {
this.$emit('hide')
},
}
}
</script>

View File

@ -2,12 +2,7 @@
<v-row justify="center">
<v-dialog v-model="show" max-width="250">
<v-card>
<DialogHeading title="Exit Editor">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Exit Editor" @hide="show = false" />
<v-card-text class="my-0 pb-0 pt-2">
Abandon changes and return to the catalog list?

View File

@ -2,11 +2,7 @@
<v-row justify="center">
<v-dialog v-model="show" max-width="300">
<v-card>
<DialogHeading title="Remove Material">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Remove Material" @hide="show = false" />
<v-card-text class="pt-4 pb-2">
Really remove material from model?

View File

@ -2,11 +2,7 @@
<v-row justify="center">
<v-dialog v-model="show" max-width="300">
<v-card>
<DialogHeading title="Remove Model">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Remove Model" @hide="show = false" />
<v-card-text class="pt-4 pb-2">
Really remove model from section?

View File

@ -2,11 +2,7 @@
<div class="text-center">
<v-dialog v-model="show" width="250">
<v-card>
<DialogHeading title="Model Info">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Model Info" @hide="show = false" />
<v-card-text class="pt-2 pb-0">
<v-text-field v-model="name" label="Name" required/>

View File

@ -2,11 +2,7 @@
<v-row justify="center">
<v-dialog v-model="show" max-width="300">
<v-card>
<DialogHeading title="Delete Section">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Delete Section" @hide="show = false" />
<v-card-text class="pt-4 pb-2">
Really delete catalog section?

View File

@ -2,11 +2,7 @@
<div class="text-center">
<v-dialog v-model="show" width="250">
<v-card>
<DialogHeading title="Section Info">
<v-btn icon class="ma-0 pa-0" @click="show = false">
<v-icon color="white">mdi-close</v-icon>
</v-btn>
</DialogHeading>
<DialogHeading title="Section Info" @hide="show = false" />
<v-card-text class="pt-2 pb-0">
<v-text-field v-model="name" label="Name" required/>