Merge branch 'new-vue'
This commit is contained in:
@ -5,18 +5,29 @@ module.exports = {
|
||||
es6: true,
|
||||
},
|
||||
'extends': [
|
||||
'plugin:vue/essential',
|
||||
'@vue/standard'
|
||||
'@vue/standard',
|
||||
'plugin:vue/recommended',
|
||||
],
|
||||
plugins: [
|
||||
'vuetify'
|
||||
],
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
'indent': ["warn", 2, { CallExpression: { arguments: "first" },
|
||||
ObjectExpression: "first",
|
||||
ArrayExpression: "first" }],
|
||||
'indent': ['warn', 2, { CallExpression: { arguments: 'first' },
|
||||
ObjectExpression: 'first',
|
||||
ArrayExpression: 'first' }],
|
||||
'comma-dangle': ['warn', 'only-multiline'],
|
||||
'spaced-comment': 'off',
|
||||
'space-before-function-paren': ['warn', 'never'],
|
||||
'vue/html-closing-bracket-newline': 'off',
|
||||
'vue/html-closing-bracket-spacing': 'off',
|
||||
'vue/max-attributes-per-line': 'off',
|
||||
'vue/multiline-html-element-content-newline': 'off',
|
||||
'vue/singleline-html-element-content-newline': 'off',
|
||||
'vuetify/grid-unknown-attributes': 'error',
|
||||
'vuetify/no-deprecated-classes': 'error',
|
||||
'vuetify/no-legacy-grid': 'error',
|
||||
},
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
|
||||
8874
cateditor/package-lock.json
generated
8874
cateditor/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -8,11 +8,12 @@
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vue/cli": "^3.11.0",
|
||||
"array-move": "^2.1.0",
|
||||
"axios": "^0.18.1",
|
||||
"vue": "^2.6.6",
|
||||
"vue2-filters": "^0.6.1",
|
||||
"vuetify": "^1.5.18",
|
||||
"axios": "^0.19.0",
|
||||
"vue": "^2.6.10",
|
||||
"vue2-filters": "^0.7.2",
|
||||
"vuetify": "^2.1.0",
|
||||
"vuex": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
@ -21,15 +22,17 @@
|
||||
"@vue/cli-service": "^3.11.0",
|
||||
"@vue/eslint-config-standard": "^4.0.0",
|
||||
"babel-eslint": "^10.0.3",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint": "^5.0.0",
|
||||
"eslint-plugin-vue": "^5.2.3",
|
||||
"fibers": "^3.1.1",
|
||||
"material-design-icons-iconfont": "^4.0.5",
|
||||
"eslint-plugin-vuetify": "^1.0.0-beta.3",
|
||||
"fibers": "^4.0.1",
|
||||
"material-design-icons-iconfont": "^5.0.1",
|
||||
"node-sass": "^4.12.0",
|
||||
"sass": "^1.22.12",
|
||||
"sass-loader": "^7.3.1",
|
||||
"stylus": "^0.54.7",
|
||||
"stylus-loader": "^3.0.1",
|
||||
"vue-cli-plugin-vuetify": "^0.5.0",
|
||||
"vue-cli-plugin-vuetify": "^0.6.3",
|
||||
"vue-template-compiler": "^2.5.21",
|
||||
"vuedraggable": "^2.23.1",
|
||||
"vuetify-loader": "^1.3.0",
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div class="text-xs-center">
|
||||
<div class="text-center">
|
||||
<v-dialog v-model="show" width="280">
|
||||
<v-card>
|
||||
|
||||
<v-card class="subheading font-weight-bold ma-0 pa-0 white--text" color="keen_dark_grey">
|
||||
<v-card-title class="ma-0 pa-2 pl-3">
|
||||
Add Materials
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-icon color="white" @click="show = false">clear</v-icon>
|
||||
</v-card-title>
|
||||
</v-card>
|
||||
@ -20,15 +20,15 @@
|
||||
placeholder="1001234
|
||||
1001235..."
|
||||
clearable
|
||||
></v-textarea>
|
||||
/>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn small flat @click="show = false">Cancel</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn small flat color="primary" @click="doAdd()">Add</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn small text @click="show = false">Cancel</v-btn>
|
||||
<v-spacer/>
|
||||
<v-btn small text color="primary" @click="doAdd()">Add</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
|
||||
</v-card>
|
||||
@ -40,12 +40,12 @@
|
||||
import { mapActions } from 'vuex'
|
||||
|
||||
export default {
|
||||
data: () => ({
|
||||
text: null,
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
text: null,
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,34 +1,34 @@
|
||||
<template>
|
||||
<div class="text-xs-center">
|
||||
<div class="text-center">
|
||||
<v-dialog v-model="show" width="300">
|
||||
<v-form v-model="valid">
|
||||
<v-card>
|
||||
<DialogHeading title="Add Section">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
:rules="[v => !!v || 'Required']"
|
||||
v-model="name"
|
||||
:rules="[v => !!v || 'Required']"
|
||||
label="Name"
|
||||
v-on:keydown.enter.prevent="doNewSection()"
|
||||
autofocus
|
||||
required>
|
||||
</v-text-field>
|
||||
required
|
||||
@keydown.enter.prevent="doNewSection()"
|
||||
/>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn flat @click="show = false">Cancel</v-btn>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
color="primary"
|
||||
flat
|
||||
@click="doNewSection()">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-form>
|
||||
@ -44,13 +44,13 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
name: '',
|
||||
valid: false,
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,15 +1,15 @@
|
||||
<template>
|
||||
<v-container fluid grid-list-lg ma-0 pa-1>
|
||||
<v-container fluid>
|
||||
|
||||
<v-layout row fill-height>
|
||||
<v-row class="fill-height">
|
||||
<v-btn @click="showAddProductDialog = true">Add products</v-btn>
|
||||
</v-layout>
|
||||
</v-row>
|
||||
|
||||
<v-layout row fill-height>
|
||||
<v-flex xs4>
|
||||
<v-row class="fill-height">
|
||||
<v-col cols="4">
|
||||
<v-card>
|
||||
<DragListHeading title="Sections">
|
||||
<v-btn @click="showAddSectionDialog = true" icon class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="showAddSectionDialog = true">
|
||||
<v-icon>add</v-icon>
|
||||
</v-btn>
|
||||
</DragListHeading>
|
||||
@ -17,7 +17,7 @@
|
||||
<div id="sections" class="list-group">
|
||||
<div v-for="item in catalog.sections" :key="item.id">
|
||||
<v-hover :key="item.id">
|
||||
<v-list-tile
|
||||
<v-list-item
|
||||
slot-scope="{ hover }"
|
||||
:class="sectionListItemClasses(item.id, hover)"
|
||||
@click="selectSection(item.id)"
|
||||
@ -25,18 +25,18 @@
|
||||
<!-- TODO try move sectionparent into v-list-title
|
||||
and so section-drop can cover all interior
|
||||
-->
|
||||
<v-list-tile-content class="section-parent">
|
||||
<v-list-tile-title v-html="item.name"></v-list-tile-title>
|
||||
<v-list-tile-sub-title
|
||||
<v-list-item-content class="section-parent">
|
||||
<v-list-item-title v-text="item.name"/>
|
||||
<v-list-item-subtitle
|
||||
class="caption font-weight-light"
|
||||
color="grey lighten-2"
|
||||
>
|
||||
{{sectionModelCount(item.id)}} {{sectionModelCount(item.id) | pluralize('model') }}
|
||||
</v-list-tile-sub-title>
|
||||
<v-list-tile-sub-title class="section-drop" :section-id="item.id"></v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
{{ sectionModelCount(item.id) }} {{ sectionModelCount(item.id) | pluralize('model') }}
|
||||
</v-list-item-subtitle>
|
||||
<v-list-item-subtitle class="section-drop" :section-id="item.id"/>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-tile-action>
|
||||
<v-list-item-action>
|
||||
<span class="group">
|
||||
<v-btn icon @click.stop="popSectionInfo(item.id)">
|
||||
<v-icon small color="grey lighten-1">info</v-icon>
|
||||
@ -45,37 +45,37 @@
|
||||
<v-icon small color="grey lighten-1">delete</v-icon>
|
||||
</v-btn>
|
||||
</span>
|
||||
</v-list-tile-action>
|
||||
</v-list-item-action>
|
||||
|
||||
</v-list-tile>
|
||||
</v-list-item>
|
||||
</v-hover>
|
||||
</div>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-col>
|
||||
|
||||
<v-flex xs4>
|
||||
<v-col cols="4">
|
||||
<v-card>
|
||||
<DragListHeading title="Models" />
|
||||
|
||||
<div id="models" class="list-group">
|
||||
<div v-for="item in selectedModels" :key="item.model">
|
||||
<v-hover :key="item.model">
|
||||
<v-list-tile
|
||||
<v-list-item
|
||||
slot-scope="{ hover }"
|
||||
:class="modelListItemClasses(item.model, hover)"
|
||||
@click="selectModel(item.model)"
|
||||
>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title v-html="item.name"></v-list-tile-title>
|
||||
<v-list-tile-sub-title
|
||||
<v-list-item-content>
|
||||
<v-list-item-title v-text="item.name"/>
|
||||
<v-list-item-subtitle
|
||||
class="caption font-weight-light"
|
||||
color="grey lighten-2">
|
||||
{{item.ids.length}} {{item.ids.length | pluralize('material') }}
|
||||
</v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
{{ item.ids.length }} {{ item.ids.length | pluralize('material') }}
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-tile-action>
|
||||
<v-list-item-action>
|
||||
<span class="group">
|
||||
<v-btn icon @click.stop="popModelInfo(item.model)">
|
||||
<v-icon small color="grey lighten-1">info</v-icon>
|
||||
@ -84,48 +84,47 @@
|
||||
<v-icon small color="grey lighten-1">delete</v-icon>
|
||||
</v-btn>
|
||||
</span>
|
||||
</v-list-tile-action>
|
||||
</v-list-item-action>
|
||||
|
||||
</v-list-tile>
|
||||
</v-list-item>
|
||||
</v-hover>
|
||||
</div>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-col>
|
||||
|
||||
<v-flex xs4>
|
||||
<v-col cols="4">
|
||||
<v-card>
|
||||
<DragListHeading title="Materials" />
|
||||
|
||||
<div id="materials" class="list-group">
|
||||
<div v-for="item in selectedMaterials" :key="item.id">
|
||||
<v-hover :key="item.id">
|
||||
<v-list-tile
|
||||
@click="selectMaterial(item.id)"
|
||||
<v-list-item
|
||||
slot-scope="{ hover }"
|
||||
:class="materialListItemClasses(item.id, hover)"
|
||||
@click="selectMaterial(item.id)"
|
||||
>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title><b>{{ item.id }}</b> {{ item.name }}</v-list-tile-title>
|
||||
<v-list-tile-sub-title v-html="item.color"></v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title><b>{{ item.id }}</b> {{ item.name }}</v-list-item-title>
|
||||
<v-list-item-subtitle v-text="item.color"/>
|
||||
</v-list-item-content>
|
||||
|
||||
<v-list-tile-action>
|
||||
<v-list-item-action>
|
||||
<span class="group">
|
||||
<v-btn icon @click="popMaterialDelete(item.id)">
|
||||
<v-icon small color="grey lighten-1">delete</v-icon>
|
||||
</v-btn>
|
||||
</span>
|
||||
</v-list-tile-action>
|
||||
</v-list-tile>
|
||||
</v-list-item-action>
|
||||
</v-list-item>
|
||||
</v-hover>
|
||||
</div>
|
||||
</div>
|
||||
</v-card>
|
||||
</v-col>
|
||||
|
||||
</v-flex>
|
||||
|
||||
</v-layout>
|
||||
</v-row>
|
||||
|
||||
<AddProductDialog v-model="showAddProductDialog"/>
|
||||
<AddSectionDialog v-model="showAddSectionDialog"/>
|
||||
@ -201,83 +200,6 @@ export default {
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
sectionModelCount(sectionID) {
|
||||
let section = this.section(sectionID)
|
||||
if (section) {
|
||||
let models = this.sectionModels(section) || []
|
||||
return models.length
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
|
||||
sectionListItemClasses(id, hovering) {
|
||||
if (id === this.selectedSectionID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
modelListItemClasses(id, hovering) {
|
||||
if (id === this.selectedModelID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
materialListItemClasses(id, hovering) {
|
||||
if (id === this.selectedMaterialID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
popSectionInfo(id) {
|
||||
this.selectSection(id)
|
||||
this.showSectionInfoDialog = true
|
||||
},
|
||||
|
||||
popSectionDelete(id) {
|
||||
this.selectSection(id)
|
||||
this.showSectionDeleteDialog = true
|
||||
},
|
||||
|
||||
popModelInfo(id) {
|
||||
this.selectModel(id)
|
||||
this.showModelInfoDialog = true
|
||||
},
|
||||
|
||||
popModelDelete(id) {
|
||||
this.selectModel(id)
|
||||
this.showModelDeleteDialog = true
|
||||
},
|
||||
|
||||
popMaterialDelete(id) {
|
||||
this.selectMaterial(id)
|
||||
this.showMaterialDeleteDialog = true
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'selectSection',
|
||||
'selectModel',
|
||||
'selectMaterial',
|
||||
'reorderSection',
|
||||
'reorderModel',
|
||||
'reorderMaterial',
|
||||
'moveModelToSection',
|
||||
'moveMaterialToSection',
|
||||
]),
|
||||
},
|
||||
mounted: function() {
|
||||
let me = this
|
||||
|
||||
@ -360,6 +282,84 @@ export default {
|
||||
},
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
sectionModelCount(sectionID) {
|
||||
let section = this.section(sectionID)
|
||||
if (section) {
|
||||
let models = this.sectionModels(section) || []
|
||||
return models.length
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
|
||||
sectionListItemClasses(id, hovering) {
|
||||
if (id === this.selectedSectionID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
modelListItemClasses(id, hovering) {
|
||||
if (id === this.selectedModelID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
materialListItemClasses(id, hovering) {
|
||||
if (id === this.selectedMaterialID) {
|
||||
return 'list-item primary'
|
||||
} else if (hovering) {
|
||||
return 'list-item list-hover'
|
||||
} else {
|
||||
return 'list-item'
|
||||
}
|
||||
},
|
||||
|
||||
popSectionInfo(id) {
|
||||
this.selectSection(id)
|
||||
this.showSectionInfoDialog = true
|
||||
},
|
||||
|
||||
popSectionDelete(id) {
|
||||
this.selectSection(id)
|
||||
this.showSectionDeleteDialog = true
|
||||
},
|
||||
|
||||
popModelInfo(id) {
|
||||
this.selectModel(id)
|
||||
this.showModelInfoDialog = true
|
||||
},
|
||||
|
||||
popModelDelete(id) {
|
||||
this.selectModel(id)
|
||||
this.showModelDeleteDialog = true
|
||||
},
|
||||
|
||||
popMaterialDelete(id) {
|
||||
this.selectMaterial(id)
|
||||
this.showMaterialDeleteDialog = true
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'selectSection',
|
||||
'selectModel',
|
||||
'selectMaterial',
|
||||
'reorderSection',
|
||||
'reorderModel',
|
||||
'reorderMaterial',
|
||||
'moveModelToSection',
|
||||
'moveMaterialToSection',
|
||||
]),
|
||||
}
|
||||
}
|
||||
|
||||
function addSectionDrops(myvue) {
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
|
||||
<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-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> -->
|
||||
@ -15,32 +15,32 @@
|
||||
<v-stepper-items>
|
||||
<v-stepper-content step="1">
|
||||
<CatalogInfo/>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn flat @click="popExit()">Cancel</v-btn>
|
||||
<v-spacer/>
|
||||
<v-btn text @click="popExit()">Cancel</v-btn>
|
||||
<v-btn
|
||||
:disabled="!valid"
|
||||
@click="step = 2"
|
||||
color="primary"
|
||||
class="black--text">Next</v-btn>
|
||||
class="black--text"
|
||||
@click="step = 2">Next</v-btn>
|
||||
</v-stepper-content>
|
||||
|
||||
<v-stepper-content step="2">
|
||||
<CatalogContents/>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn flat @click="popExit()">Cancel</v-btn>
|
||||
<v-spacer/>
|
||||
<v-btn text @click="popExit()">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-btn
|
||||
:disabled="!valid"
|
||||
:loading="savingCatalog"
|
||||
@click.stop="saveCatalog()"
|
||||
color="primary"
|
||||
class="black--text">Done</v-btn>
|
||||
class="black--text"
|
||||
@click.stop="saveCatalog()">Done</v-btn>
|
||||
</v-stepper-content>
|
||||
|
||||
<!-- <v-stepper-content step="3">
|
||||
<CatalogPagination/>
|
||||
<v-btn flat>Cancel</v-btn>
|
||||
<v-btn text>Cancel</v-btn>
|
||||
<v-btn @click="step = 2">Back</v-btn>
|
||||
<v-btn color="primary" class="black--text">Save</v-btn>
|
||||
</v-stepper-content> -->
|
||||
@ -52,9 +52,9 @@
|
||||
|
||||
<v-snackbar v-model="showPublicNotice" color="success"
|
||||
multi-line top :timeout="10000">
|
||||
This is a public catalog.<br/>
|
||||
This is a public catalog.<br>
|
||||
Changes will be saved in a new catalog that you own.
|
||||
<v-btn dark flat @click="showPublicNotice = false">Close</v-btn>
|
||||
<v-btn dark text @click="showPublicNotice = false">Close</v-btn>
|
||||
</v-snackbar>
|
||||
|
||||
</v-form>
|
||||
@ -94,14 +94,6 @@ export default {
|
||||
'catalogSavedOK',
|
||||
]),
|
||||
},
|
||||
methods: {
|
||||
popExit: function(id) {
|
||||
this.showExitEditorPopup = true
|
||||
},
|
||||
saveCatalog() {
|
||||
this.$store.dispatch('saveCatalog')
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
catalog(value) {
|
||||
if (value) {
|
||||
@ -128,6 +120,14 @@ export default {
|
||||
} else {
|
||||
this.$store.dispatch('newCatalog')
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
popExit: function(id) {
|
||||
this.showExitEditorPopup = true
|
||||
},
|
||||
saveCatalog() {
|
||||
this.$store.dispatch('saveCatalog')
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,16 +1,8 @@
|
||||
<template>
|
||||
<v-container fluid grid-list-sm>
|
||||
<v-container fluid>
|
||||
|
||||
<!--
|
||||
<v-layout row>
|
||||
<v-flex xs8>
|
||||
<h2>Catalog Info</h2>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
-->
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs8>
|
||||
<v-row>
|
||||
<v-col cols="8">
|
||||
<v-text-field
|
||||
v-model="name"
|
||||
label="Catalog name"
|
||||
@ -18,21 +10,22 @@
|
||||
autofocus
|
||||
class="headline font-weight-medium"
|
||||
height="30px"
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs4>
|
||||
<v-row>
|
||||
<v-col cols="4">
|
||||
<v-select
|
||||
v-model="season"
|
||||
:items="seasons"
|
||||
item-value="id"
|
||||
item-text="name"
|
||||
:rules="[rules.required]"
|
||||
label="Season"></v-select>
|
||||
</v-flex>
|
||||
<v-flex xs4>
|
||||
label="Season"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="4">
|
||||
<v-select
|
||||
v-model="region"
|
||||
:items="regions"
|
||||
@ -41,42 +34,42 @@
|
||||
:rules="[rules.required]"
|
||||
label="Region"
|
||||
class="pl-4"
|
||||
></v-select>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs8>
|
||||
<v-row>
|
||||
<v-col cols="8">
|
||||
<v-text-field
|
||||
v-model="email"
|
||||
:rules="[rules.emailRules]"
|
||||
label="Email"
|
||||
hint="Get notified when the catalog PDF is done"
|
||||
persistent-hint
|
||||
></v-text-field>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs4>
|
||||
<v-row>
|
||||
<v-col cols="4">
|
||||
<v-checkbox
|
||||
v-model="isPublic"
|
||||
label="Public"
|
||||
></v-checkbox>
|
||||
</v-flex>
|
||||
<v-flex xs4>
|
||||
<v-checkbox v-model="prices" label="Show prices"></v-checkbox>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="4">
|
||||
<v-checkbox v-model="prices" label="Show prices"/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs4 v-if="isAdmin">
|
||||
<v-checkbox v-model="utility" label="Is Utility?"></v-checkbox>
|
||||
</v-flex>
|
||||
<v-flex xs4 v-if="isAdmin">
|
||||
<v-checkbox v-model="master" label="Region master"></v-checkbox>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-row>
|
||||
<v-col v-if="isAdmin" cols="4">
|
||||
<v-checkbox v-model="utility" label="Is Utility?"/>
|
||||
</v-col>
|
||||
<v-col v-if="isAdmin" cols="4">
|
||||
<v-checkbox v-model="master" label="Region master"/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
@ -1,63 +1,65 @@
|
||||
<template>
|
||||
<v-container fluid grid-list-lg>
|
||||
<v-layout row>
|
||||
<v-flex xs3 class="pa-0 ma-0">
|
||||
<v-container fluid>
|
||||
<v-row>
|
||||
<v-col cols="3">
|
||||
<v-btn color="primary"
|
||||
class="black--text"
|
||||
href="/catalog/new">New Catalog</v-btn>
|
||||
</v-flex>
|
||||
<v-flex xs9>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
href="/catalog/new"
|
||||
>New Catalog</v-btn>
|
||||
</v-col>
|
||||
<v-col cols="9"/>
|
||||
</v-row>
|
||||
|
||||
<v-layout row>
|
||||
<v-flex xs8>
|
||||
<v-row>
|
||||
<v-col cols="8">
|
||||
|
||||
<v-card class="pa-0">
|
||||
<v-tabs v-model="activeTab" color="keen_light_grey" slider-color="keen_dark_grey">
|
||||
<v-card>
|
||||
<v-tabs v-model="activeTab"
|
||||
color="black"
|
||||
background-color="keen_light_grey"
|
||||
slider-color="keen_dark_grey">
|
||||
<v-tab key="mine">My Catalogs</v-tab>
|
||||
<v-tab key="public">Public Catalogs</v-tab>
|
||||
|
||||
<!-- my catalogs -->
|
||||
<v-tab-item key="mine">
|
||||
<v-card flat>
|
||||
<v-card text>
|
||||
|
||||
<v-card-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-text-field
|
||||
v-model="search"
|
||||
append-icon="search"
|
||||
label="Search"
|
||||
single-line
|
||||
hide-details
|
||||
></v-text-field>
|
||||
/>
|
||||
</v-card-title>
|
||||
|
||||
<v-data-table
|
||||
:headers="myHeaders"
|
||||
:items="myCatalogs"
|
||||
:items-per-page="15"
|
||||
:search="search"
|
||||
:loading="loadingMyCatalogs"
|
||||
disable-initial-sort
|
||||
class="scroll-area"
|
||||
@click:row="selectCatalog"
|
||||
>
|
||||
<template v-slot:items="cats">
|
||||
<tr @click="selectCatalog(cats.item.id)">
|
||||
<td v-if="cats.item.master" class="px-2 py-0">
|
||||
<v-tooltip top>
|
||||
<template v-slot:item.master="{ item }">
|
||||
<v-tooltip v-if="item.master" top>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-icon small color="red" v-on="on">stars</v-icon>
|
||||
</template>
|
||||
<span>Season master</span>
|
||||
</v-tooltip>
|
||||
</td>
|
||||
<td v-else class="pa-0"></td>
|
||||
<td class="px-2 py-0">{{ cats.item.seasonCode }}</td>
|
||||
<td class="px-2 py-0">{{ cats.item.name }}</td>
|
||||
<td class="px-2 py-0">{{ cats.item.updatedPretty }}</td>
|
||||
<td class="px-2 py-0">
|
||||
<PDFProgress :percentDone="cats.item.build_progress" />
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.updated="{ item }">
|
||||
{{ item.updatedPretty }}
|
||||
</template>
|
||||
|
||||
<template v-slot:item.build_progress="{ item }">
|
||||
<PDFProgress :percent-done="item.build_progress" />
|
||||
</template>
|
||||
|
||||
<template v-slot:no-results>
|
||||
@ -72,47 +74,45 @@
|
||||
</v-card>
|
||||
</v-tab-item>
|
||||
|
||||
<!-- public catalogs -->
|
||||
<v-tab-item key="public">
|
||||
<v-card flat>
|
||||
<v-card text>
|
||||
|
||||
<v-card-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-text-field
|
||||
v-model="search"
|
||||
append-icon="search"
|
||||
label="Search"
|
||||
single-line
|
||||
hide-details
|
||||
></v-text-field>
|
||||
/>
|
||||
</v-card-title>
|
||||
|
||||
<v-data-table
|
||||
:headers="pubHeaders"
|
||||
:items="publicCatalogs"
|
||||
:items-per-page="15"
|
||||
:search="search"
|
||||
:loading="loadingPublicCatalogs"
|
||||
disable-initial-sort
|
||||
class="scroll-area"
|
||||
@click:row="selectCatalog"
|
||||
>
|
||||
<template v-slot:items="cats">
|
||||
<tr @click="selectCatalog(cats.item.id)">
|
||||
<td v-if="cats.item.master" class="px-2 py-0">
|
||||
<v-tooltip top>
|
||||
<template v-slot:item.master="{ item }">
|
||||
<v-tooltip v-if="item.master" top>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-icon small color="red" v-on="on">stars</v-icon>
|
||||
</template>
|
||||
<span>Season master</span>
|
||||
</v-tooltip>
|
||||
</td>
|
||||
<td v-else class="pa-0"></td>
|
||||
<td class="px-2 py-0">{{ cats.item.seasonCode }}</td>
|
||||
<td class="px-2 py-0">{{ cats.item.ownerName }}</td>
|
||||
<td class="px-2 py-0">{{ cats.item.name }}</td>
|
||||
<td class="px-2 py-0">{{ cats.item.updatedPretty }}</td>
|
||||
<td class="px-2 py-0">
|
||||
<PDFProgress :percentDone="cats.item.build_progress" />
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.updated="{ item }">
|
||||
{{ item.updatedPretty }}
|
||||
</template>
|
||||
|
||||
<template v-slot:item.build_progress="{ item }">
|
||||
<PDFProgress :percent-done="item.build_progress" />
|
||||
</template>
|
||||
|
||||
<template v-slot:no-results>
|
||||
@ -129,16 +129,16 @@
|
||||
</v-tabs>
|
||||
</v-card>
|
||||
|
||||
</v-flex>
|
||||
</v-col>
|
||||
|
||||
<v-flex xs4>
|
||||
<v-col cols="4">
|
||||
<v-card v-if="selectedCatalog">
|
||||
<v-toolbar dense color="keen_light_grey" class="elevation-0">
|
||||
<v-toolbar-title color="primary" class="headline">
|
||||
{{ selectedCatalog.name }}
|
||||
</v-toolbar-title>
|
||||
</v-toolbar>
|
||||
<v-divider></v-divider>
|
||||
<v-divider/>
|
||||
<table class="details">
|
||||
<tr v-if="selectedCatalog.master">
|
||||
<td class="grey--text">Season master</td>
|
||||
@ -166,15 +166,15 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="grey--text">Pages</td>
|
||||
<td>{{ selectedCatalog.pages}}</td>
|
||||
<td>{{ selectedCatalog.pages }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="grey--text">Sections</td>
|
||||
<td>{{ selectedCatalog.sections}}</td>
|
||||
<td>{{ selectedCatalog.sections }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="grey--text">Materials</td>
|
||||
<td>{{ selectedCatalog.materials}}</td>
|
||||
<td>{{ selectedCatalog.materials }}</td>
|
||||
</tr>
|
||||
<tr v-if="selectedCatalog.public">
|
||||
<td class="grey--text">Public</td>
|
||||
@ -189,27 +189,27 @@
|
||||
<tr v-if="selectedCatalog.build_progress < 100">
|
||||
<td class="grey--text">PDF Build</td>
|
||||
<td>
|
||||
<PDFProgress :percentDone="selectedCatalog.build_progress" />
|
||||
<PDFProgress :percent-done="selectedCatalog.build_progress" />
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<v-divider></v-divider>
|
||||
<v-card-text>
|
||||
<v-btn class="ma-0" small flat :href="'/catalog/edit/' + selectedCatalog.id">Edit</v-btn>
|
||||
<v-btn
|
||||
class="ma-0"
|
||||
small flat
|
||||
<v-btn small outlined class="ma-2"
|
||||
:href="'/catalog/edit/' + selectedCatalog.id"
|
||||
>Edit</v-btn>
|
||||
<v-btn small outlined class="ma-2"
|
||||
:disabled="selectedCatalog.build_progress < 100"
|
||||
:href="selectedCatalog.pdf">Download</v-btn>
|
||||
<!-- <v-btn class="ma-0" small flat>Share</v-btn> -->
|
||||
:href="selectedCatalog.pdf"
|
||||
>Download</v-btn>
|
||||
<!-- <v-btn class="ma-0" small text>Share</v-btn> -->
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
<v-card v-else>
|
||||
<v-card-text class="grey--text">No catalog selected</v-card-text>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
</v-container>
|
||||
</template>
|
||||
@ -310,16 +310,6 @@ export default {
|
||||
'selectedCatalog',
|
||||
]),
|
||||
},
|
||||
methods: {
|
||||
...mapActions([
|
||||
'setSelectedCatalog',
|
||||
'loadMyCatalogs',
|
||||
'loadPublicCatalogs',
|
||||
]),
|
||||
selectCatalog(id) {
|
||||
this.setSelectedCatalog(id)
|
||||
},
|
||||
},
|
||||
mounted: function() {
|
||||
this.loadMyCatalogs()
|
||||
this.loadPublicCatalogs()
|
||||
@ -327,7 +317,17 @@ export default {
|
||||
this.loadMyCatalogs()
|
||||
this.loadPublicCatalogs()
|
||||
}, 10000)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions([
|
||||
'setSelectedCatalog',
|
||||
'loadMyCatalogs',
|
||||
'loadPublicCatalogs',
|
||||
]),
|
||||
selectCatalog(cat) {
|
||||
this.setSelectedCatalog(cat.id)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
<v-card class="subheading font-weight-bold ma-0 pa-0 white--text" color="keen_dark_grey">
|
||||
<v-card-title class="ma-0 pa-0 pl-1">
|
||||
<span class="pa-2">{{ title }}</span>
|
||||
<v-spacer></v-spacer>
|
||||
<slot></slot>
|
||||
<v-spacer/>
|
||||
<slot/>
|
||||
</v-card-title>
|
||||
</v-card>
|
||||
</template>
|
||||
@ -11,7 +11,10 @@
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: String,
|
||||
title: {
|
||||
type: String,
|
||||
default: 'Title',
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -2,18 +2,21 @@
|
||||
<v-card class="subheading font-weight-bold ma-0 pl-2" color="grey lighten-2">
|
||||
<v-card-title class="ma-0 pa-0">
|
||||
<span class="pa-2">{{ title }}</span>
|
||||
<v-spacer></v-spacer>
|
||||
<slot></slot>
|
||||
<v-spacer/>
|
||||
<slot/>
|
||||
</v-card-title>
|
||||
</v-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: 'Title',
|
||||
},
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
title: String,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-row justify="center">
|
||||
<v-dialog v-model="show" max-width="280">
|
||||
<v-card>
|
||||
|
||||
<DialogHeading title="Quit Editor">
|
||||
<v-btn @click="show = false" icon class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
@ -14,13 +14,13 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn flat @click="show = false">Back to editing</v-btn>
|
||||
<v-btn flat href="/catalogs">Quit</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -31,11 +31,11 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -11,11 +11,14 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
text: String,
|
||||
text: {
|
||||
type: String,
|
||||
default: 'Loading...',
|
||||
},
|
||||
show: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-row justify="center">
|
||||
<v-dialog v-model="show" max-width="250">
|
||||
<v-card>
|
||||
<DialogHeading title="Remove Material">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
@ -17,14 +17,14 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn flat @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" flat @click="doDelete()">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn text @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" text @click="doDelete()">OK</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -35,11 +35,11 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'selectedSection',
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-row justify="center">
|
||||
<v-dialog v-model="show" max-width="250">
|
||||
<v-card>
|
||||
<DialogHeading title="Remove Model">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
@ -16,14 +16,14 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn flat @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" flat @click="doDelete()">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn text @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" text @click="doDelete()">OK</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -34,11 +34,11 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
<template>
|
||||
<div class="text-xs-center">
|
||||
<div class="text-center">
|
||||
<v-dialog v-model="show" width="250">
|
||||
<v-card>
|
||||
<DialogHeading title="Model Info">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
|
||||
<v-card-text>
|
||||
<v-text-field v-model="name" label="Name" required></v-text-field>
|
||||
{{modelMaterialCount}} {{modelMaterialCount | pluralize('material') }}
|
||||
<v-text-field v-model="name" label="Name" required/>
|
||||
{{ modelMaterialCount }} {{ modelMaterialCount | pluralize('material') }}
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="primary" flat @click="show = false">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn color="primary" text @click="show = false">OK</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
@ -31,11 +31,11 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,49 +1,54 @@
|
||||
<template>
|
||||
<v-toolbar dark dense absolute app color="keen_dark_grey">
|
||||
<v-app-bar dark dense absolute app color="keen_dark_grey">
|
||||
<!-- <v-toolbar-side-icon></v-toolbar-side-icon> -->
|
||||
<img src="/static/img/keen_logo.svg" width="85"/>
|
||||
<img class="pr-4" src="/static/img/keen_logo.svg" width="100">
|
||||
<v-toolbar-title color="primary" class="headline">
|
||||
<span>ProCatalog</span>
|
||||
<span class="font-weight-light"> {{ pageTitle }}</span>
|
||||
</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-toolbar-items class="hidden-sm-and-down">
|
||||
<v-btn flat small href="/">Dashboard</v-btn>
|
||||
<v-btn text small href="/">Dashboard</v-btn>
|
||||
|
||||
<v-menu open-on-hover bottom offset-y>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn flat small v-on="on">Support</v-btn>
|
||||
<v-btn text small v-on="on">Support</v-btn>
|
||||
</template>
|
||||
<v-list class="navbar-menu ma-0 pa-0">
|
||||
<v-list-tile dense class="navbar-menu-item">
|
||||
<v-btn flat small href="mailto:support@procatalog.io?Subject=Keen%20ProCatalog%20support%20request" class="navbar-menu-button">Email Support</v-btn>
|
||||
</v-list-tile>
|
||||
<v-list-item dense class="navbar-menu-item">
|
||||
<v-btn text small href="mailto:support@procatalog.io?Subject=Keen%20ProCatalog%20support%20request" class="navbar-menu-button">Email Support</v-btn>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
|
||||
<v-menu open-on-hover bottom offset-y>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn flat small v-on="on">
|
||||
<v-btn text small v-on="on">
|
||||
Account
|
||||
</v-btn>
|
||||
</template>
|
||||
<v-list class="navbar-menu ma-0 pa-0">
|
||||
<v-list-tile dense class="navbar-menu-item">
|
||||
<v-btn flat small href="/account/settings" class="navbar-menu-button">Profile</v-btn>
|
||||
</v-list-tile>
|
||||
<v-list-tile dense class="navbar-menu-item">
|
||||
<v-btn flat small href="/account/logout" class="navbar-menu-button">Log Out</v-btn>
|
||||
</v-list-tile>
|
||||
<v-list-item dense class="navbar-menu-item">
|
||||
<v-btn text small href="/account/settings" class="navbar-menu-button">Profile</v-btn>
|
||||
</v-list-item>
|
||||
<v-list-item dense class="navbar-menu-item">
|
||||
<v-btn text small href="/account/logout" class="navbar-menu-button">Log Out</v-btn>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
</v-app-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['pageTitle'],
|
||||
props: {
|
||||
pageTitle: {
|
||||
type: String,
|
||||
default: 'Title',
|
||||
},
|
||||
},
|
||||
data: () => ({
|
||||
foo: true
|
||||
})
|
||||
|
||||
@ -4,9 +4,9 @@
|
||||
<v-progress-linear
|
||||
v-if="percentDone < 100"
|
||||
v-model="percentDone"
|
||||
v-on="on"
|
||||
color="accent"
|
||||
></v-progress-linear>
|
||||
v-on="on"
|
||||
/>
|
||||
</template>
|
||||
<span>{{ percentDone }}% complete</span>
|
||||
</v-tooltip>
|
||||
@ -15,7 +15,10 @@
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
percentDone: Number,
|
||||
percentDone: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<v-layout row justify-center>
|
||||
<v-row justify="center">
|
||||
<v-dialog v-model="show" max-width="250">
|
||||
<v-card>
|
||||
<DialogHeading title="Delete Section">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
@ -16,14 +16,14 @@
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn flat @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" flat @click="doDelete()">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn text @click="show = false">Cancel</v-btn>
|
||||
<v-btn color="primary" text @click="doDelete()">OK</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-layout>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -34,15 +34,16 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
section: {
|
||||
type: Number,
|
||||
required: false
|
||||
required: false,
|
||||
default: null,
|
||||
}
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,23 +1,23 @@
|
||||
<template>
|
||||
<div class="text-xs-center">
|
||||
<div class="text-center">
|
||||
<v-dialog v-model="show" width="250">
|
||||
<v-card>
|
||||
<DialogHeading title="Section Info">
|
||||
<v-btn icon @click="show = false" class="ma-0 pa-0">
|
||||
<v-btn icon class="ma-0 pa-0" @click="show = false">
|
||||
<v-icon color="white">clear</v-icon>
|
||||
</v-btn>
|
||||
</DialogHeading>
|
||||
|
||||
<v-card-text>
|
||||
<v-text-field v-model="name" label="Name" required></v-text-field>
|
||||
{{sectionModelCount}} {{sectionModelCount | pluralize('model') }}<br/>
|
||||
{{sectionMaterialCount}} {{sectionMaterialCount | pluralize('material') }}
|
||||
<v-text-field v-model="name" label="Name" required/>
|
||||
{{ sectionModelCount }} {{ sectionModelCount | pluralize('model') }}<br>
|
||||
{{ sectionMaterialCount }} {{ sectionMaterialCount | pluralize('material') }}
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="primary" flat @click="show = false">OK</v-btn>
|
||||
<v-spacer></v-spacer>
|
||||
<v-spacer/>
|
||||
<v-btn color="primary" text @click="show = false">OK</v-btn>
|
||||
<v-spacer/>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
@ -32,11 +32,11 @@ export default {
|
||||
components: {
|
||||
DialogHeading,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
props: {
|
||||
value: Boolean,
|
||||
},
|
||||
data: () => ({
|
||||
}),
|
||||
computed: {
|
||||
show: {
|
||||
get() {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import Vue from 'vue'
|
||||
import './../../plugins/vuetify'
|
||||
import Vuetify from 'vuetify/lib'
|
||||
import Vue2Filters from 'vue2-filters'
|
||||
import App from './App.vue'
|
||||
import { store } from './store'
|
||||
@ -7,8 +7,35 @@ import 'material-design-icons-iconfont/dist/material-design-icons.css' // Ensure
|
||||
|
||||
Vue.config.productionTip = false
|
||||
Vue.use(Vue2Filters)
|
||||
Vue.use(Vuetify)
|
||||
|
||||
const opts = {
|
||||
theme: {
|
||||
themes: {
|
||||
light: {
|
||||
primary: '#fdd02f',
|
||||
keen_yellow: '#fddd04',
|
||||
keen_dark_grey: '#373737',
|
||||
keen_light_grey: '#bababa',
|
||||
secondary: '#424242',
|
||||
accent: '#82B1FF',
|
||||
error: '#FF5252',
|
||||
info: '#2196F3',
|
||||
success: '#4CAF50',
|
||||
warning: '#FFC107'
|
||||
},
|
||||
},
|
||||
},
|
||||
options: {
|
||||
customProperties: true
|
||||
},
|
||||
// icons: {
|
||||
// iconfont: 'md',
|
||||
// },
|
||||
}
|
||||
|
||||
new Vue({
|
||||
store,
|
||||
render: h => h(App)
|
||||
render: h => h(App),
|
||||
vuetify: new Vuetify(opts)
|
||||
}).$mount('#app')
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import Vue from 'vue'
|
||||
import '../../plugins/vuetify'
|
||||
import Vuetify from 'vuetify/lib'
|
||||
|
||||
import Vue2Filters from 'vue2-filters'
|
||||
import App from './App.vue'
|
||||
import { store } from './store'
|
||||
@ -7,8 +8,35 @@ import 'material-design-icons-iconfont/dist/material-design-icons.css' // Ensure
|
||||
|
||||
Vue.config.productionTip = false
|
||||
Vue.use(Vue2Filters)
|
||||
Vue.use(Vuetify)
|
||||
|
||||
const opts = {
|
||||
theme: {
|
||||
themes: {
|
||||
light: {
|
||||
primary: '#fdd02f',
|
||||
keen_yellow: '#fddd04',
|
||||
keen_dark_grey: '#373737',
|
||||
keen_light_grey: '#bababa',
|
||||
secondary: '#424242',
|
||||
accent: '#82B1FF',
|
||||
error: '#FF5252',
|
||||
info: '#2196F3',
|
||||
success: '#4CAF50',
|
||||
warning: '#FFC107'
|
||||
},
|
||||
},
|
||||
},
|
||||
options: {
|
||||
customProperties: true
|
||||
},
|
||||
// icons: {
|
||||
// iconfont: 'md',
|
||||
// },
|
||||
}
|
||||
|
||||
new Vue({
|
||||
store,
|
||||
render: h => h(App)
|
||||
render: h => h(App),
|
||||
vuetify: new Vuetify(opts)
|
||||
}).$mount('#app')
|
||||
|
||||
@ -57,7 +57,9 @@ export const store = new Vuex.Store({
|
||||
commit('setSelectedCatalog', response.data.catalogs[0])
|
||||
} else {
|
||||
let cat = response.data.catalogs.find(c => c.id === state.selectedCatalog.id)
|
||||
if (cat) {
|
||||
commit('setSelectedCatalog', cat)
|
||||
} // otherwise might be a public catalog
|
||||
}
|
||||
}
|
||||
} else {
|
||||
|
||||
@ -1,22 +1,33 @@
|
||||
import Vue from 'vue'
|
||||
import Vuetify from 'vuetify/lib'
|
||||
import 'vuetify/src/stylus/app.styl'
|
||||
//
|
||||
// NOTE: appears to be unused. it's also out of date.
|
||||
//
|
||||
|
||||
Vue.use(Vuetify, {
|
||||
theme: {
|
||||
primary: '#fdd02f',
|
||||
keen_yellow: '#fddd04',
|
||||
keen_dark_grey: '#373737',
|
||||
keen_light_grey: '#bababa',
|
||||
secondary: '#424242',
|
||||
accent: '#82B1FF',
|
||||
error: '#FF5252',
|
||||
info: '#2196F3',
|
||||
success: '#4CAF50',
|
||||
warning: '#FFC107'
|
||||
},
|
||||
options: {
|
||||
customProperties: true
|
||||
},
|
||||
iconfont: 'md'
|
||||
})
|
||||
// import Vue from 'vue'
|
||||
// import Vuetify from 'vuetify/lib'
|
||||
|
||||
// const opts = {
|
||||
// theme: {
|
||||
// primary: '#fdd02f',
|
||||
// keen_yellow: '#fddd04',
|
||||
// keen_dark_grey: '#373737',
|
||||
// keen_light_grey: '#bababa',
|
||||
// secondary: '#424242',
|
||||
// accent: '#82B1FF',
|
||||
// error: '#FF5252',
|
||||
// info: '#2196F3',
|
||||
// success: '#4CAF50',
|
||||
// warning: '#FFC107'
|
||||
// },
|
||||
// options: {
|
||||
// customProperties: true
|
||||
// },
|
||||
// icons: {
|
||||
// iconfont: 'md',
|
||||
// },
|
||||
// }
|
||||
|
||||
// Vue.use(Vuetify)
|
||||
|
||||
// new Vue({
|
||||
// vuetify: new Vuetify(opts)
|
||||
// }).$mount('#app')
|
||||
|
||||
Reference in New Issue
Block a user