@hjxz/pharos-organization-pc

安装

该组件依赖了ant-design-vue(V3.2.20) 和 pinyin.js。所以在使用之前，请确保你的项目里面有这两个依赖。

pnpm i ant-design-vue pinyin

pnpm i @hjxz/pharos-organization-pc

<template>
  <div>
    {{ checked }}
    <br>
    <PharosOrganizationPc :data-sources="dataSource"  v-model:checked="checked"/>
  </div>
</template>
<script setup lang="ts">
  import { PharosOrganizationPc, OrganizationItem } from "@hjxz/pharos-organization-pc"
  import {data} from "./mockData.json"
  import { onMounted, ref } from "vue";
  const checked = ref([])
  const dataSource = ref<OrganizationItem[]>([])
  onMounted(() => {
    setTimeout(() => {
      dataSource.value = data as unknown as OrganizationItem[]
    },3000)
  })
</script>

组件属性

属性	说明	类型	默认值
headFlag	用于判断是否是头部,及没有上级的组织架构	string	0
dataSources	组织架构数据源	OrganizationItem[]	[]
v-model:checked	选中的组织架构	string[]	[]
single	是否单选	boolean	false
mode	组织架构模式	string	user / dept / default
disabledList	禁用	Array	[]
beforeOk	点击OK 回调函数	(list: OrganizationItem[]) => Promise(boolean)
beforeCancel	点击Cancel 回调函数	(list: OrganizationItem[]) => Promise(boolean)