@ibiz-template/runtime 0.0.3-beta.1 → 0.0.3-beta.3

package/src/controller/control/list.ts

@@ -1,7 +1,11 @@
 import { ListModel } from '@ibiz-template/model';
-import { ListService } from '../../service';
+import { clone } from 'ramda';
+import { CodeListItem, ControlVO, ListService } from '../../service';
+import { IControlProvider } from '../interface';
 import { ListNerve } from '../neuron';
-import { MDController } from './md';
+import { ListState } from '../state';
+import { MDItemController } from './md';
+import { MDController } from './md/md';
 
 /**
  * 列表控制器
@@ -13,6 +17,8 @@ import { MDController } from './md';
  * @extends {MDController<ListModel>}
  */
 export class ListController extends MDController<ListModel> {
+  state = new ListState();
+
   declare nerve: ListNerve;
 
   /**
@@ -28,9 +34,241 @@ export class ListController extends MDController<ListModel> {
     return new ListNerve(this);
   }
 
+  /**
+   * 排序查询条件
+   *
+   */
+  sortQuery?: string;
+
+  /**
+   * 面板部件适配器
+   *
+   * @type {IControlProvider}
+   */
+  layoutPanelProvider?: IControlProvider;
+
+  /**
+   * 加载的数据是否附加在items之后
+   *
+   * @type {boolean}
+   */
+  isAddBehind: boolean = false;
+
   protected async onInit(): Promise<void> {
     await super.onInit();
     this.service = new ListService(this.model);
     await this.service.init(this.context);
+
+    // 绑定排序参数，beforeLoad事件
+    this.nerve.self.evt.on('beforeLoad', () => {
+      return this.sortQuery ? { sort: this.sortQuery } : {};
+    });
+
+    // 设置默认排序
+    const { defaultSortField, defaultSortDir } = this.model;
+    if (defaultSortField && defaultSortDir) {
+      this.setSort(defaultSortField, defaultSortDir);
+    }
+
+    if (this.model.layoutPanel) {
+      this.layoutPanelProvider = await ibiz.register.control.get(
+        this.model.layoutPanel,
+      );
+    }
+  }
+
+  /**
+   * 设置排序
+   *
+   * @author lxm
+   * @date 2022-09-28 13:09:44
+   * @param {string} key 排序字段
+   * @param {string} order 排序顺序
+   */
+  setSort(key: string, order: 'asc' | 'desc') {
+    this.sortQuery = `${key},${order}`;
+  }
+
+  /**
+   * 加载更多数据
+   *
+   */
+  async loadMore(e: MouseEvent) {
+    e.stopPropagation();
+    if (this.state.total > this.state.items.length) {
+      this.state.curPage += 1;
+      this.isAddBehind = true;
+      this.load();
+    }
+  }
+
+  /**
+   * 部件加载数据行为
+   *
+   */
+  async load(): Promise<IData[]> {
+    const items = await super.load();
+    this.isAddBehind = false;
+    return items;
+  }
+
+  /**
+   * 部件加载后处理
+   *
+   */
+  async afterLoad(items: ControlVO[]): Promise<ControlVO[]> {
+    // 决定传入父的afterLoad是否为附加items后的数组
+    let resItems: ControlVO[] = [];
+    if (this.isAddBehind) {
+      this.state.items.push(...items);
+      resItems = this.state.items;
+    } else {
+      resItems = items;
+    }
+    await super.afterLoad(resItems);
+    // 处理分组
+    if (this.model.enableGroup) {
+      await this.handleGroup(this.state.items);
+    }
+    // 生成多数据rows对象
+    this.state.rows = this.state.items.map(item => {
+      const row = new MDItemController(item, this);
+      return row;
+    });
+    return this.state.items;
+  }
+
+  /**
+   * 分组方法
+   *
+   */
+  async handleGroup(items: ControlVO[]) {
+    if (Object.is(this.model.groupMode, 'AUTO')) {
+      await this.drawGroup(items);
+    } else if (Object.is(this.model.groupMode, 'CODELIST')) {
+      await this.drawCodeListGroup(items);
+    }
+  }
+
+  /**
+   * 处理自动分组
+   *
+   */
+  public async drawGroup(items: ControlVO[]) {
+    if (!this.model.groupAppField) {
+      ibiz.log.warn('未配置分组属性');
+      return;
+    }
+    const data = [...items];
+    let groups: string[] = [];
+    data.forEach((item: ControlVO) => {
+      if (
+        Object.prototype.hasOwnProperty.call(item, this.model.groupAppField!)
+      ) {
+        groups.push(item[this.model.groupAppField!]);
+      }
+    });
+    groups = [...new Set(groups)];
+    if (groups.length === 0) {
+      ibiz.log.warn('分组数据无效');
+    }
+    const groupTree: IData[] = [];
+    groups.forEach((group: string) => {
+      const children: ControlVO[] = [];
+      data.forEach((item: ControlVO) => {
+        if (Object.is(group, item[this.model.groupAppField!])) {
+          children.push(item);
+        }
+      });
+      group = group || '其他';
+      const tree = {
+        group,
+        children,
+      };
+      groupTree.push(tree);
+    });
+    this.state.groupData = groupTree;
+  }
+
+  /**
+   * 处理分组代码表
+   *
+   */
+  async drawCodeListGroup(items: ControlVO[]) {
+    if (!this.model.groupAppField) {
+      ibiz.log.warn('未配置分组属性');
+      return;
+    }
+    let groups: CodeListItem[] = [];
+    const data = [...items];
+
+    if (this.model.groupCodeList) {
+      const dataItems = await this.app.codeList.get(
+        this.model.groupCodeList.codeName,
+        this.context,
+        this.params,
+      );
+      groups = clone(dataItems) as CodeListItem[];
+    }
+    if (groups.length === 0) {
+      ibiz.log.warn('分组数据无效');
+    }
+    const groupTree: IData[] = [];
+    groups.forEach((group: CodeListItem) => {
+      const children: ControlVO[] = [];
+      data.forEach((item: ControlVO) => {
+        if (Object.is(group.value, item[this.model.groupAppField!])) {
+          children.push(item);
+        }
+      });
+      const tree = {
+        group: group.text,
+        codeListItem: group,
+        children,
+      };
+      groupTree.push(tree);
+    });
+    // 其他
+    const otherChildren: ControlVO[] = [];
+    data.forEach((item: ControlVO) => {
+      const i = groups.findIndex((_group: CodeListItem) =>
+        Object.is(_group.value, item[this.model.groupAppField!]),
+      );
+      if (i < 0) {
+        otherChildren.push(item);
+      }
+    });
+    const otherTree = {
+      group: '其他',
+      children: otherChildren,
+    };
+    if (otherChildren && otherChildren.length > 0) {
+      groupTree.push(otherTree);
+    }
+    this.state.groupData = groupTree;
+  }
+
+  /**
+   * 单击事件
+   * @param {ControlVO} item
+   * @return {*}
+   * @author: zhujiamin
+   */
+  async handleClick(item: ControlVO) {
+    if (this.mdCtrlActiveMode === 1) {
+      await this.nerve.self.evt.asyncEmit('dataActive', item);
+    }
+  }
+
+  /**
+   * 双击事件
+   * @param {ControlVO} item
+   * @return {*}
+   * @author: zhujiamin
+   */
+  async handleDblClick(item: ControlVO) {
+    if (this.mdCtrlActiveMode === 2) {
+      await this.nerve.self.evt.asyncEmit('dataActive', item);
+    }
   }
 }

package/src/controller/control/md/index.ts

@@ -0,0 +1,2 @@
+export * from './md-item';
+export * from './md';

package/src/controller/control/md/md-item.ts

@@ -0,0 +1,30 @@
+import { ControlVO } from '../../../service';
+import { MDController } from './md';
+
+/**
+ * 多数据部件数据项状态管理控制器
+ *
+ * @class MDItemController
+ */
+export class MDItemController {
+  /**
+   * 数据项
+   *
+   */
+  data: ControlVO;
+
+  constructor(data: ControlVO, _mdController: MDController) {
+    this.data = data;
+  }
+
+  /**
+   * 销毁方法
+   *
+   * @author lxm
+   * @date 2022-09-06 19:09:02
+   */
+  destroy() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (this.data as any) = undefined;
+  }
+}

package/src/controller/control/{md.ts → md/md.ts}

@@ -5,9 +5,10 @@ import {
   MDModel,
   UnsupportedModelError,
 } from '@ibiz-template/model';
-import { ControlVO, MDControlService, Srfuf } from '../../service';
-import { MDControlNerve } from '../neuron';
-import { MainController } from './main';
+import { ControlVO, MDControlService, Srfuf } from '../../../service';
+import { MDControlNerve } from '../../neuron';
+import { MDState } from '../../state';
+import { MainController } from '../main';
 
 /**
  * 多数据部件控制器
@@ -22,26 +23,12 @@ import { MainController } from './main';
 export class MDController<
   T extends MDModel = MDModel,
 > extends MainController<T> {
-  /**
-   * 多数据部件数据集合
-   * @author lxm
-   * @date 2022-08-17 19:08:11
-   * @type {ControlVO[]}
-   */
-  items: ControlVO[] = [];
-
-  /**
-   * 多数据部件已选中的数据集合
-   *
-   * @author lxm
-   * @date 2022-08-18 22:08:14
-   * @type {IData[]}
-   */
-  selectedData: IData[] = [];
+  state = new MDState();
 
   /**
    * 是否是单项选择
    *
+   * @deprecated
    * @author lxm
    * @date 2022-08-19 10:08:29
    * @type {boolean}
@@ -49,30 +36,49 @@ export class MDController<
   singleSelect: boolean = false;
 
   /**
-   * 多数据部件服务
+   * 是否默认选中第一条数据
    *
-   * @author lxm
-   * @date 2022-08-19 13:08:51
-   * @type {EntityService}
+   * @type {boolean}
+   * @memberof MDController
    */
-  service!: MDControlService;
+  isSelectFirstDefault: boolean = false;
 
-  declare nerve: MDControlNerve;
+  /**
+   * 默认选中的数据
+   *
+   * @type {Array}
+   * @memberof MDController
+   */
+  defaultSelectKeys: Array<string> = [];
 
   /**
-   * 当前页
+   * 是否默认选中第一条数据
+   *
+   * @type {boolean}
+   * @memberof MDController
    */
-  curPage: number = 1;
+  isExpView: boolean = false;
 
   /**
-   * 分页条数
+   * 数据默认激活模式
+   * - 0 不激活
+   * - 1 单击激活
+   * - 2 双击激活(默认)
+   *
+   * @type {(number | 0 | 1 | 2)}
    */
-  size: number = 20;
+  mdCtrlActiveMode: number | 0 | 1 | 2 = 2;
 
   /**
-   * 总条数
+   * 多数据部件服务
+   *
+   * @author lxm
+   * @date 2022-08-19 13:08:51
+   * @type {EntityService}
    */
-  total: number = 0;
+  service!: MDControlService;
+
+  declare nerve: MDControlNerve;
 
   protected createNerve(): MDControlNerve {
     return new MDControlNerve(this);
@@ -93,6 +99,45 @@ export class MDController<
     // this.singleSelect =
   }
 
+  /**
+   * 设置是否默认选中第一条
+   *
+   */
+  setIsSelectFirstDefault(isSelectFirstDefault?: boolean): void {
+    if (typeof isSelectFirstDefault === 'boolean') {
+      this.isSelectFirstDefault = isSelectFirstDefault;
+    }
+  }
+
+  /**
+   * 设置默认选中数据主键集合
+   *
+   */
+  setDefaultSelectKeys(defaultSelectKeys?: Array<string>): void {
+    if (defaultSelectKeys) {
+      this.defaultSelectKeys = defaultSelectKeys;
+    }
+  }
+
+  /**
+   * 设置数据默认激活模式
+   *
+   * @param {(0 | 1 | 2)} mode 0 不激活 1 单击激活 2 双击激活（默认）
+   */
+  setMdCtrlActiveMode(mode?: number | 0 | 1 | 2): void {
+    this.mdCtrlActiveMode = mode === undefined ? 2 : mode;
+  }
+
+  /**
+   * 设置部件是否包含在导航视图内
+   *
+   */
+  setIsExpView(isExpView?: boolean): void {
+    if (typeof isExpView === 'boolean') {
+      this.isExpView = isExpView;
+    }
+  }
+
   /**
    * 获取请求过滤参数（整合了视图参数，各种过滤条件，排序，分页）
    *
@@ -112,8 +157,8 @@ export class MDController<
     return {
       ...this.params,
       ..._params,
-      page: this.curPage - 1,
-      size: this.size,
+      page: this.state.curPage - 1,
+      size: this.state.size,
     };
   }
 
@@ -138,18 +183,24 @@ export class MDController<
 
     // 更新分页数据总条数
     if (res.total) {
-      this.total = res.total;
+      this.state.total = res.total;
     }
 
     res.data.forEach(item => {
       item.reactiveInit();
     });
 
-    this.items = res.data;
-    await this.afterLoad(this.items);
+    await this.afterLoad(res.data);
+    const isFirstLoad = this.state.hasLoaded === false;
+    this.state.hasLoaded = true;
+    await this.nerve.self.evt.asyncEmit(
+      'afterLoad',
+      this.state.items,
+      isFirstLoad,
+    );
     this.force();
 
-    return this.items;
+    return this.state.items;
   }
 
   /**
@@ -158,8 +209,38 @@ export class MDController<
    * @author lxm
    * @date 2022-08-19 14:08:50
    */
-  async afterLoad(items: IData[]): Promise<IData[]> {
-    return items;
+  async afterLoad(items: ControlVO[]): Promise<IData[]> {
+    this.state.items = items;
+    // 第一次加载并且默认选中第一条数据时
+    if (
+      !this.state.hasLoaded &&
+      this.isSelectFirstDefault &&
+      this.state.items[0]
+    ) {
+      if (this.defaultSelectKeys.length === 0) {
+        // 不存在默认选中的时候，才往外抛第一条
+        await this.nerve.self.evt.asyncEmit('dataActive', this.state.items[0]);
+      } else if (this.defaultSelectKeys.length > 0) {
+        // 存在默认选中
+        // 1 数据中有，抛出该条数据
+        // 2 返回数据里没有该条时，也往外抛第一条
+        let activeIndex = 0;
+        this.state.items.forEach((item: ControlVO, index: number) => {
+          for (let i = 0; i < this.defaultSelectKeys.length; i++) {
+            const select = this.defaultSelectKeys[i];
+            if (select === item.srfkey) {
+              activeIndex = index;
+              break;
+            }
+          }
+        });
+        await this.nerve.self.evt.asyncEmit(
+          'dataActive',
+          this.state.items[activeIndex],
+        );
+      }
+    }
+    return this.state.items;
   }
 
   /**
@@ -170,13 +251,14 @@ export class MDController<
    * @returns {*}  {Promise<void>}
    */
   async remove(): Promise<void> {
-    if (this.selectedData.length === 0) {
+    const selections = this.state.selectedData;
+    if (selections.length === 0) {
       throw new RuntimeError('未选中数据');
     }
     await this.startLoading();
     try {
       await Promise.allSettled(
-        this.selectedData.map(async data => {
+        selections.map(async data => {
           // 新建未保存的数据直接走后续删除处理逻辑
           if (data.srfuf !== Srfuf.CREATE) {
             // 删除后台的数据
@@ -192,8 +274,12 @@ export class MDController<
     } finally {
       await this.endLoading();
     }
-    await this.nerve.self.evt.asyncEmit('afterRemove', this.selectedData);
-    this.selectedData = [];
+    this.state.selectedData = [];
+    if (this.isExpView) {
+      // 在导航视图内，删除后激活第一条
+      await this.nerve.self.evt.asyncEmit('dataActive', this.state.items[0]);
+    }
+    await this.nerve.self.evt.asyncEmit('afterRemove', selections);
     this.force();
   }
 
@@ -206,8 +292,10 @@ export class MDController<
    */
   afterRemove(data: IData) {
     // 删除this.items里的数据
-    const index = this.items.findIndex(item => item.srfkey === data.srfkey);
-    this.items.splice(index, 1);
+    const index = this.state.items.findIndex(
+      item => item.srfkey === data.srfkey,
+    );
+    this.state.items.splice(index, 1);
   }
 
   /**
@@ -218,7 +306,7 @@ export class MDController<
    * @returns {*}  {IData[]}
    */
   getData(): IData[] {
-    return this.selectedData || [];
+    return this.state.selectedData || [];
   }
 
   /**
@@ -229,9 +317,9 @@ export class MDController<
    * @returns {*}  {Promise<IData[]>}
    */
   async selectAll(): Promise<IData[]> {
-    this.selectedData = [...this.items];
-    this.nerve.self.evt.emit('selectionChange', this.selectedData);
-    return this.selectedData;
+    this.state.selectedData = [...this.state.items];
+    this.nerve.self.evt.emit('selectionChange', this.state.selectedData);
+    return this.state.selectedData;
   }
 
   /**
@@ -242,7 +330,7 @@ export class MDController<
    * @param {IData[]} selection 当前选中的项集合
    */
   onSelectionChange(selection: IData[]): void {
-    this.selectedData = selection;
+    this.state.selectedData = selection;
     this.nerve.self.evt.emit('selectionChange', selection);
   }
 
@@ -253,7 +341,7 @@ export class MDController<
    * @date 2022-11-08 15:11:54
    * @returns {*}  {Promise<void>}
    */
-  importData(): Promise<void> {
+  async importData(): Promise<void> {
     const { appEntity, dataImport } = this.model;
     let templateUrl = `${appEntity.deNamePlural}/importtemplate`;
     let importUrl = `${appEntity.deNamePlural}/importdata2`;
@@ -261,16 +349,29 @@ export class MDController<
       templateUrl += `?srfimporttag=${dataImport.codeName}`;
       importUrl += `?srfimporttag=${dataImport.codeName}`;
     }
-    return ibiz.overlay.modal(
+    const modal = ibiz.overlay.createModal(
       'DataImport',
-      { templateUrl, importUrl },
+      {
+        dismiss: () => modal.dismiss(),
+        templateUrl,
+        importUrl,
+      },
       {
         width: 'auto',
         placement: 'center',
       },
     );
+    modal.present();
+    await modal.onWillDismiss();
   }
 
+  /**
+   * 数据导出
+   *
+   * @param {MouseEvent} event 原生js点击事件
+   * @returns {*}  {Promise<void>}
+   * @memberof MDController
+   */
   async exportData(event: MouseEvent): Promise<void> {
     const { dataExport, appEntity } = this.model;
     if (!dataExport) {
@@ -286,7 +387,7 @@ export class MDController<
       {
         dismiss: (result: unknown) => popover.dismiss(result),
         maxRowCount: dataExport.maxRowCount || 1000,
-        pageSize: this.size,
+        pageSize: this.state.size,
       },
       { autoClose: true, placement: 'bottom-end' },
     );

package/src/controller/control/panel/index.ts

@@ -0,0 +1,9 @@
+export * from './layout-panel';
+export * from './view-layout-panel';
+export * from './panel-item';
+export * from './panel-container';
+export * from './panel-field';
+export * from './panel-raw-item';
+export * from './panel-button';
+export * from './panel-tab-page';
+export * from './panel-tab-panel';