89 lines
2.2 KiB
Vue
89 lines
2.2 KiB
Vue
<template>
|
|
<v-stepper v-model="step">
|
|
|
|
<Loading text="Loading" :show="loadingCatalog"/>
|
|
|
|
<v-stepper-header ma-0 pa-0>
|
|
<v-stepper-step :complete="step > 1" step="1">Catalog info</v-stepper-step>
|
|
<v-divider></v-divider>
|
|
<v-stepper-step :complete="step > 2" step="2">Contents</v-stepper-step>
|
|
<v-divider></v-divider>
|
|
<v-stepper-step step="3">Pagination</v-stepper-step>
|
|
</v-stepper-header>
|
|
|
|
<v-stepper-items>
|
|
<v-stepper-content step="1">
|
|
<!-- <CatalogInfo/> -->
|
|
<CatalogContents/>
|
|
<v-btn flat>Cancel</v-btn>
|
|
<v-btn @click="step = 1" disabled>Back</v-btn>
|
|
<v-btn @click="step = 2" color="primary" class="black--text">Next</v-btn>
|
|
</v-stepper-content>
|
|
|
|
<v-stepper-content step="2">
|
|
<CatalogContents/>
|
|
<v-btn flat>Cancel</v-btn>
|
|
<v-btn @click="step = 1">Back</v-btn>
|
|
<v-btn @click="step = 3" color="primary" class="black--text">Next</v-btn>
|
|
</v-stepper-content>
|
|
|
|
<v-stepper-content step="3">
|
|
<v-card
|
|
class="mb-5"
|
|
color="grey lighten-1"
|
|
height="200px"
|
|
></v-card>
|
|
|
|
<v-btn flat>Cancel</v-btn>
|
|
<v-btn @click="step = 2">Back</v-btn>
|
|
<v-btn color="primary" class="black--text">Save</v-btn>
|
|
</v-stepper-content>
|
|
</v-stepper-items>
|
|
|
|
</v-stepper>
|
|
</template>
|
|
|
|
<script>
|
|
import Loading from './Loading'
|
|
import CatalogInfo from './CatalogInfo'
|
|
import CatalogContents from './CatalogContents'
|
|
|
|
export default {
|
|
components: {
|
|
Loading,
|
|
CatalogInfo,
|
|
CatalogContents
|
|
},
|
|
data: () => ({
|
|
step: 1,
|
|
}),
|
|
computed: {
|
|
loadingCatalog() {
|
|
return this.$store.getters.loadingCatalog
|
|
},
|
|
savingCatalog() {
|
|
return this.$store.getters.savingCatalog
|
|
},
|
|
},
|
|
methods: {
|
|
saveCatalog() {
|
|
this.$store.dispatch('saveCatalog')
|
|
},
|
|
},
|
|
mounted: function() {
|
|
// catalogID is set by django
|
|
// in a script block in our parent page.
|
|
var catalogID = JSON.parse(document.getElementById('catalogID').textContent)
|
|
if (catalogID > 0) {
|
|
this.$store.dispatch('loadCatalog', catalogID)
|
|
} else {
|
|
this.$store.dispatch('newCatalog')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|