部门调整为树结构

src/components/AiTreePath.vue

@@ -0,0 +1,38 @@
+<template>
+  <section class="AiTreePath">
+    <AiTreePath v-if="parent" v-bind="$props" :current="parent" v-on="$listeners"/>
+    <div v-else v-text="`全部`" @click="$emit('click','all')"/>
+    <u-icon v-if="label" name="arrow-right" size="32" color="#ccc"/>
+    <div v-text="label" @click="$emit('click',current)"/>
+  </section>
+</template>
+<script>
+export default {
+  name: "AiTreePath",
+  props: {
+    current: {default: null},
+    prop: {default: () => ({})},
+    paths: {default: () => []}
+  },
+  computed: {
+    options: v => ({
+      id: 'id',
+      label: 'name',
+      parent: 'parentId',
+      ...v.prop
+    }),
+    label: v => v.current?.[v.options.label] || "",
+    parent: v => v.paths?.[v.current?.[v.options.parent]]
+  }
+}
+</script>
+<style scoped lang="scss">
+.AiTreePath {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 36px;
+  line-height: 40px;
+  font-family: PingFang-SC;
+}
+</style>