<template>
	<div flex>
		<base-layout title="菜单权限" ref="layout" :bodyHight="treeHight" :mainHight="mainHight" :operateButtonSwitch="false">
			<div slot="main">
				<base-tree ref="menuTree" :isCenter="false" :showCheckbox="true" :menuData="menuData" :setting="true"
					@checkChange="checkChange">
				</base-tree>
			</div>
		</base-layout>
	</div>
</template>

<script>
import baseLayout from "@/components/base/baseLayout";
import baseTable from "@/components/base/baseTable";
import baseTree from "@/components/base/BaseMenuTree/index.vue";
import configData from "./configData";
import {
	GetPppedomSet,
	GetAllButton,
} from '@/api/apis/jurisdiction'

export default {
	name: "jurisdictionSetting",
	components: {
		baseLayout,
		baseTable,
		baseTree
	},
	props: {
		objectID: {
			type: [Number, String, Boolean],
			default: false
		},
		menuData: {
			type: Array,
			default: []
		},

	},
	data() {
		return {
			treeHight: '444px',
			mainHight: 'calc(100% - 80px)',
			classifyButtonList: [],
			buttonArray: [],
			colorsKey: false,
			menuPopedom: [],
			buttonPopedom: []
		}
	},
	computed: {

	},
	watch: {

	},
	created() {

	},
	onShow() { },
	mounted() {
		this.initPage()
	},
	filters: {

	},
	methods: {
		// 初始化页面
		initPage() {
		},
		checkChange(ids, checkdata) {
			this.menuPopedom = ids
			this.checkdata = checkdata
		},

		typeChange(item) {
			item.type = !item.type
			this.$forceUpdate()
		},

	},
}
</script>
<style scoped lang='scss'>
.buttonSetting {
	margin: 10px 0;
}
</style>
<style lang="scss">
$activeColor: var(--bg-color, "#00aaff");

.el-icon-star-on {
	/* color: #00aa00; */
	color: $activeColor;
}

.buttonSetting {
	.recordText {
		border: 1px solid #fff;
		width: 100px;
		padding: 10px 0;
		text-align: center;
		font-size: 12px;
		cursor: pointer;
		background: #f2f2f2;
		color: #e0e0e0;
		margin: 0px 3px;
	}

	.recordText.active {
		background: $activeColor;
		color: #fff;
	}
}
</style>
