MoModalUser

This library was generated with Angular CLI version 13.3.0.

安装

npm i -S mo-modal-user -registry https://registry.npmjs.org

修改 SharedModule

import { MoModalUser } from 'mo-modal-user';

const MODULES = [MoModalUser]


@NgModule({
  exports: [
    ...MODULES,
  ]
})
export class SharedModule {}

全局定义接口 CommonService

  get userApiOptions() {
    return {
      url: '',// 用户列表接口
    };
  }

  get userAndDeptApiOptions() {
    return {
      url: '',// 用户列表接口
      departmentUrl: '' // 部门列表接口
    };
  }

使用

import { CommonService } from '@core';

export class SearchBarComponent {

  userApiOptions = this.commonSrv.userAndDeptApiOptions; // 接口地址

  constructor(private commonSrv: CommonService,) {}
}

<mo-modal-user
  title="选择成员"
  mValue="accountId"
  [(isVisible)]="isVisible"
  [apiOptions]="userApiOptions"
  [queryOptions]="{ status: 1 }"
  (moOnSubmit)="onSubmitRoleUser($event)"
></mo-modal-user>

属性说明

• isVisible 是否显示

• apiOptions 接口地址，传入部门列表接口，自动显示部门筛选

• mode 多选：multiple，单选：default，默认单选

• queryOptions 用户列表默认的筛选条件

• mValue 用户value的key值，不填写为：id

• mLabel 用户名称的key值，默认：label

• title title

• departmentId 默认选中的部门ID

• switchDept 部门是否可以切换

• disabled 是否禁用

• moOnSubmit 确定回掉