forked from HANYANG/HANYANG_MES
42 lines
1000 B
JavaScript
42 lines
1000 B
JavaScript
export default {
|
|
name: 'TreeItem',
|
|
props: {
|
|
itemdata: Object,
|
|
},
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
computed: {
|
|
isFolder() {
|
|
return this.itemdata.children && this.itemdata.children.length
|
|
}
|
|
},
|
|
methods: {
|
|
toggle() {
|
|
if (this.isFolder) {
|
|
this.itemdata.isOpen = !this.itemdata.isOpen
|
|
}
|
|
},
|
|
changeType() {
|
|
if (!this.isFolder) {
|
|
this.itemdata.children = []
|
|
this.addChild()
|
|
this.itemdata.isOpen = true
|
|
}
|
|
},
|
|
addChild() {
|
|
this.itemdata.children.push({
|
|
name: '새 카테고리'
|
|
})
|
|
}
|
|
},
|
|
template: `
|
|
<li>
|
|
<div :class="{ bold: isFolder }" @click="toggle" @dblclick="changeType"> {{ itemdata.name }} <span v-if="isFolder && itemdata.name">[{{ itemdata.isOpen ? '-' : '+' }}]</span> </div>
|
|
<ul v-show="itemdata.isOpen" v-if="isFolder">
|
|
<TreeItem class="item" v-for="itemdata in itemdata.children" :itemdata="itemdata"></TreeItem>
|
|
</ul>
|
|
</li>
|
|
`
|
|
} |