<template>
	<div class="tree_box">
		<el-radio-group
			v-model="deptValue"
			class="method_radio_group"
			@change="handleDeptChange"
		>
			<el-radio :label="item.id" v-for="item in deptsList" :key="item.id"
				>{{ item.label }}
			</el-radio>
		</el-radio-group>
	</div>
</template>

<script setup>
import { msg } from '@/utils/lodash/msg.js';
import { ref, toRefs } from 'vue';
const props = defineProps({
	deptsList: {
		type: Array,
	},
	deptValue: {
		type: String,
	},
	handleDeptChange: Function,
});

const state = toRefs(props);
const { deptsList, deptValue } = state;

const emits = defineEmits(['handleDeptChange']);

const handleDeptChange = (e) => {
	if (Array.isArray(deptsList.value) && deptsList.value.length) {
		let item = deptsList.value.filter((item) => {
			return item.id === e;
		});
		if (!item[0].managerId) {
			msg('warning', '该部门暂无负责人,请先设置负责人!');
		}
		emits('handleDeptChange', item[0]);
	}
};
</script>

<style lang="scss" scoped>
@import '../../index.scss';
.tree-item-style {
	font-size: 12px;
	list-style: 1.5px;
}
</style>
