Skip to content
目录

organization 机构选择组件

注意

organization 组件基于 element-ui 的 cascader 的组件二次封装,继承大部分的属性配置,props 属性请使用 defaultProps。

organization 组件内部默认会通过local/selectOrgOption请求数据,并且会自动区分三种用户体系,如果数据不满足,通过 defaultProps 中的 lazyLoad 动态请求即可。

如果需要修改默认数据的请求地址,可以在.env 文件中配置 VUE_APP_ORG_API

用法

vue
<template>
	<ws-organization
		:data="options"
		v-model="organization"
		:defaultProps="props"
	></ws-organization>
</template>

<script>
const options = [
	{
		relationId: 'zhinan',
		orgName: '指南',
		children: [
			{
				relationId: 'relationId',
				orgName: '设计原则',
				children: [
					{
						relationId: 'yizhi',
						orgName: '一致',
					},
				],
			},
			{
				relationId: 'daohang',
				orgName: '导航',
				children: [
					{
						relationId: 'cexiangdaohang',
						orgName: '侧向导航',
					},
					{
						relationId: 'dingbudaohang',
						orgName: '顶部导航',
					},
				],
			},
		],
	},
	{
		relationId: 'zujian',
		orgName: '组件',
		children: [
			{
				relationId: 'basic',
				orgName: 'Basic',
				children: [
					{
						relationId: 'layout',
						orgName: 'Layout 布局',
					},
				],
			},
			{
				relationId: 'form',
				orgName: 'Form',
				children: [
					{
						relationId: 'radio',
						orgName: 'Radio 单选框',
					},
				],
			},
		],
	},
	{
		relationId: 'ziyuan',
		orgName: '资源',
		children: [
			{
				relationId: 'axure',
				orgName: 'Axure Components',
			},
		],
	},
]
export default {
	data() {
		return {
			organization: '',
			props: {
				lazy: false,
			},
			options,
		}
	},
}
</script>

Attributes

参数说明类型默认值
value / v-model绑定值String/Number/Array-
data数据源,不传则取组件内部数据Array[]
valueKey获取字段,默认为 relationId,可选 agencyNumberStringrelationId
level显示级别 1 大区,2 分公司,3 服务中心,4 服务站String4
defaultProps参考 el-cascader 的 props 配置项Object-

Events

方法名说明
change获取选中项