53 lines
1.1 KiB
Vue
53 lines
1.1 KiB
Vue
<template>
|
|
<md-toolbar class="md-primary">
|
|
|
|
<md-button class="md-icon-button" @click="showDrawerClicked">
|
|
<md-icon>menu</md-icon>
|
|
</md-button>
|
|
<span class="md-title">VideON</span>
|
|
|
|
<div class="md-toolbar-section-end">
|
|
|
|
<md-progress-spinner
|
|
v-if="processing"
|
|
class="white-spinner"
|
|
md-mode="indeterminate"
|
|
:md-stroke="4"
|
|
:md-diameter="35" />
|
|
|
|
<md-button class="md-raised" :disabled="!(modelChanged && !processing)" @click="applyClicked">Apply</md-button>
|
|
|
|
</div>
|
|
</md-toolbar>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "ToolbarContent",
|
|
props: {
|
|
processing: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
modelChanged: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
methods: {
|
|
showDrawerClicked() {
|
|
this.$emit("showDrawerClicked");
|
|
},
|
|
applyClicked() {
|
|
this.$emit("applyClicked");
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<!-- This isn't scoped either -->
|
|
<style>
|
|
.white-spinner .md-progress-spinner-draw .md-progress-spinner-circle {
|
|
stroke: white;
|
|
}
|
|
</style> |