<template>
    <view>
      <view class="department_item"
            :class="deptLabelId == item.id ? 'department_active' : ''"
            v-for="(item, index) in chatAssistants"
            :key="index"
            @click.stop="click_department(item, index)">
        <text>{{ item.title }}</text>
        <!-- 递归显示子菜单 -->
        <view v-if="item.children && item.children.length > 0">
          <department-menu :chat-assistants="item.children" @item-click="click_department"></department-menu>
        </view>
      </view>
    </view>
  </template>
  
  <script>
  import DepartmentMenu from "../commonComponents/DepartmentMenu.vue";

  export default {
    components: {
      DepartmentMenu
    },
    props: {
      chatAssistants: {
        type: Array,
        required: true
      }
    },
    methods: {
      click_department(item, index) {
        this.$emit('item-click', item, index); // 向父组件传递点击事件
      }
    }
  };
  </script>
  
  <style scoped>
  .department_item {
    padding-left: 10px; /* 左侧缩进 */
  }
  
  .department_active {
    color: #ff4500; /* 选中的菜单项颜色 */
  }
  
  .department_item > .department_item {
    padding-left: 20px; /* 子菜单项的缩进 */
  }
  </style>
  