alx/procat2
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

cat editor: updates for vuetify 2

Browse Source
This commit is contained in:
Seth Ladygo
2019-10-01 22:40:07 -07:00
parent a6052d69d4
commit e6e060da80
12 changed files with 120 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
cateditor/src/components/CatalogContents.vue
View File

@ -1,12 +1,12 @@
<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">
@ -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-html="item.name"></v-list-item-title>
<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>
</v-list-item-subtitle>
<v-list-item-subtitle class="section-drop" :section-id="item.id"></v-list-item-subtitle>
</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-html="item.name"></v-list-item-title>
<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>
</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
<v-list-item
@click="selectMaterial(item.id)"
slot-scope="{ hover }"
:class="materialListItemClasses(item.id, hover)"
>
<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-html="item.color"></v-list-item-subtitle>
</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"/>