QianNiaoShop/pagesT/goods/goodsclassification.vue

<template>
	<view>
		<ly-tree @edit="editCate" @deldata="delCate" :tree-data="treeData" :props="props" node-key="id"></ly-tree>
		<addBtn @click="goPage(`/pagesT/goods/AddGoodsclassification`)"></addBtn>
		<u-modal v-model="model_show" :show-cancel-button="true" content="确定删除此分类？" @confirm="modelConfirm"
			@cancel="modelCancel"></u-modal>
	</view>
</template>
<script>
	import LyTree from '@/components/ly-tree/ly-tree.vue';
	export default {
		components: {
			LyTree
		},
		onShow() {
			this.treeData = []
			this.getAllCategory();
		},
		data() {
			return {
				treeData: [],
				ready: false,
				props: {
					label: 'title', // label: 'personName', // 指把数据中的‘personName’当做label也就是节点名称
					children: 'children'
				},
				model_show: false,
				id: ''
			};
		},
		methods: {
			// 编辑
			editCate(node) {
				this.goPage(`/pagesT/goods/AddGoodsclassification?id=${node.data.id}`)
			},
			// 删除
			delCate(node) {
				this.id = node.data.id
				this.model_show = true
			},
			// 如果不需要不用到这个方法，需要删除相应代码，打印大量日志会造成性能损耗
			handleNodeClick(obj) {
				console.log('handleNodeClick', JSON.stringify(obj));
			},
			// 获取所有商品分类
			getAllCategory() {
				this.$u.api.getAllCategory().then(res => {
					this.treeData = res.data;
				});
			},
			modelConfirm() {
				this.$u.api.delCategory(this.id).then(res => {
					this.treeData = []
					this.getAllCategory();
					this.$u.toast('删除成功')
				})
			},
			modelCancel() {}
		}
	};
</script>

<style>
	.ly-search {
		margin: 0 30rpx;
		margin-top: 40rpx;
		padding-bottom: 15rpx;
		border-bottom: 1px solid #ededed;
	}
</style>