@ibiz-template/runtime 0.0.1-beta.1 → 0.0.1-beta.17

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

@@ -0,0 +1,375 @@
+import { isNilOrEmpty } from 'qx-util';
+import { IBizContext } from '@ibiz-template/core';
+import { FormItemModel } from '@ibiz-template/model';
+import Schema from 'async-validator';
+import dayjs from 'dayjs';
+import { Srfuf } from '../../../service';
+import {
+  EditFormController,
+  FormDetailController,
+  FormController,
+  FormContainerController,
+} from '.';
+import { EditorController } from '../../editor';
+import { generateRules } from '../../utils';
+import { FormNotifyState } from '../../constant';
+import { IEditorProvider } from '../../interface';
+
+export class FormItemController extends FormDetailController<FormItemModel> {
+  /**
+   * 上下文
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:55
+   * @type {IBizContext}
+   */
+  readonly context: IBizContext;
+
+  /**
+   * 视图参数
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:52
+   * @type {IParams}
+   */
+  readonly params: IParams;
+
+  /**
+   * 编辑器控制器
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:42
+   * @type {EditorController}
+   */
+  editor: EditorController | null = null;
+
+  /**
+   * 编辑器适配器
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:42
+   * @type {EditorController}
+   */
+  editorProvider?: IEditorProvider;
+
+  /**
+   * 表单项校验器实例
+   *
+   * @author lxm
+   * @date 2022-09-04 18:09:56
+   * @private
+   * @type {Schema}
+   */
+  private validator!: Schema;
+
+  /**
+   * 值规则
+   *
+   * @author lxm
+   * @date 2022-09-01 22:09:49
+   * @type {IData}
+   */
+  rules: IData = [];
+
+  /**
+   * 值规则校验错误信息
+   *
+   * @author lxm
+   * @date 2022-09-01 22:09:02
+   * @type {string}
+   */
+  error: string | null = null;
+
+  /**
+   * 表单项名称
+   *
+   * @author lxm
+   * @date 2022-09-04 18:09:32
+   * @readonly
+   */
+  get name() {
+    return this.model.source.name;
+  }
+
+  /**
+   * 表单项对应属性的值
+   *
+   * @author lxm
+   * @date 2022-08-24 22:08:25
+   * @readonly
+   * @type {unknown}
+   */
+  get value(): unknown {
+    return this.form.data[this.name];
+  }
+
+  /**
+   * 表单数据
+   *
+   * @author lxm
+   * @date 2022-09-01 22:09:48
+   * @readonly
+   */
+  get data() {
+    return this.form.data;
+  }
+
+  /**
+   * 启用条件的禁用状态
+   *
+   * @author lxm
+   * @date 2022-09-19 16:09:18
+   * @private
+   */
+  private enableCondDisabled = false;
+
+  /**
+   * 是否禁用
+   *
+   * @author lxm
+   * @date 2022-09-01 21:09:44
+   * @type {boolean}
+   */
+  get disabled() {
+    if (this.enableCondDisabled) {
+      return true;
+    }
+    return this.$disabled;
+  }
+
+  set disabled(val) {
+    this.$disabled = val;
+  }
+
+  /**
+   * Creates an instance of FormItemController.
+   * @author lxm
+   * @date 2022-08-24 20:08:24
+   * @param {FormItemModel} model 表单项模型
+   * @param {IBizContext} context 上下对象
+   * @param {IParams} [params={}] 视图参数
+   */
+  constructor(
+    model: FormItemModel,
+    form: FormController,
+    parent?: FormContainerController,
+  ) {
+    super(model, form, parent);
+    this.context = form.context;
+    this.params = form.params;
+  }
+
+  /**
+   * 初始化
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:42
+   * @protected
+   * @returns {*}  {Promise<void>}
+   */
+  protected async onInit(): Promise<void> {
+    await super.onInit();
+    // 空输入默认值
+    this.required = !this.model.source.allowEmpty;
+    // 初始化编辑器控制器
+    if (this.model.editor && this.model.editor.editorType !== 'HIDDEN') {
+      this.editorProvider = await ibiz.register.editor.get(this.model.editor);
+      if (this.editorProvider) {
+        this.editor = await this.editorProvider.createController(
+          this.model.editor,
+          this,
+        );
+        await this.editor.init();
+        await this.initRules();
+      }
+    }
+  }
+
+  /**
+   * 初始化值规则
+   *
+   * @author lxm
+   * @date 2022-09-02 09:09:27
+   * @protected
+   * @returns {*}
+   */
+  protected async initRules() {
+    const formItemsVRs = this.form.model.formItemVRs.get(this.name);
+
+    if (!formItemsVRs) {
+      return;
+    }
+    this.rules = generateRules(
+      formItemsVRs,
+      this.name,
+      this.model.source.valueItemName,
+    );
+    // 初始化async-validator实例
+    this.validator = new Schema({ [this.name]: this.rules });
+  }
+
+  /**
+   * 计算启用条件的禁用
+   *
+   * @author lxm
+   * @date 2022-09-20 00:09:57
+   * @param {(string | FormNotifyState)} name
+   * @returns {*}
+   */
+  calcEnableCond() {
+    const { enableCond } = this.model.source;
+    const isNew = this.data.srfuf === Srfuf.CREATE;
+    if (enableCond === 0) {
+      this.enableCondDisabled = true;
+    } else if ((isNew && enableCond === 2) || (!isNew && enableCond === 1)) {
+      this.enableCondDisabled = true;
+    }
+  }
+
+  dataChangeNotify(name: string[]): void {
+    super.dataChangeNotify(name);
+    const { resetItemName } = this.model;
+    const { valueItemName } = this.model.source;
+
+    // 重置项，变更时自己的值置空
+    if (name.includes(resetItemName!)) {
+      this.setDataValue(null, this.name);
+    }
+
+    // 刚加载初始化时的值不校验,只校验值项和自身值变更
+    if (name.includes(this.name) || name.includes(valueItemName)) {
+      this.validate();
+    }
+
+    // 有表单项更新，且是自身变更时，触发表单项更新
+    if (name.includes(this.name) && this.model.formItemUpdate) {
+      const { methodName, itemNames } = this.model.formItemUpdate;
+      (this.form as EditFormController).updateFormItem(methodName, itemNames);
+    }
+  }
+
+  formStateNotify(state: FormNotifyState): void {
+    super.formStateNotify(state);
+
+    // 计算启用条件
+    this.calcEnableCond();
+
+    // 触发默认值
+    if (state === FormNotifyState.DRAFT || state === FormNotifyState.LOAD) {
+      this.setDefaultValue(state === FormNotifyState.DRAFT);
+    }
+  }
+
+  protected calcDynamicLogic(names: string[], state?: FormNotifyState): void {
+    // 隐藏表单项不计算动态逻辑
+    if (!this.model.source.hidden) {
+      super.calcDynamicLogic(names, state);
+    }
+  }
+
+  /**
+   * 表单项值规则校验
+   * 如果表单项不显示则不校验直接返回true
+   *
+   * @author lxm
+   * @date 2022-09-01 22:09:29
+   */
+  async validate(): Promise<boolean> {
+    if (!this.visible) {
+      this.error = null;
+      return true;
+    }
+
+    // 必填校验
+    if (this.required && isNilOrEmpty(this.data[this.name])) {
+      this.error = `请填写${this.model.source.caption}`;
+      return false;
+    }
+
+    if (this.validator) {
+      try {
+        await this.validator.validate(this.data);
+      } catch ({ errors, _fields }) {
+        this.error = (errors as IData[])[0].message;
+        return false;
+      }
+    }
+    this.error = null;
+    return true;
+  }
+
+  /**
+   * 设置表单数据的值
+   *
+   * @author lxm
+   * @date 2022-08-24 10:08:40
+   * @param {unknown} value 要设置的值
+   * @param {string} name 要设置的表单数据的属性名称
+   */
+  async setDataValue(value: unknown, name?: string): Promise<void> {
+    name = name || this.name;
+    await this.form.setDataValue(name, value);
+  }
+
+  /**
+   * 设置默认值
+   *
+   * @author lxm
+   * @date 2022-09-15 22:09:52
+   * @param {boolean} isCreate 新建默认值还是更新默认值
+   */
+  setDefaultValue(isCreate: boolean) {
+    const { createDVT, createDV, updateDVT, updateDV } = this.model.source;
+    const valueType = isCreate ? createDVT : updateDVT;
+    const defaultValue = isCreate ? createDV : updateDV;
+    // 置空
+    if (valueType === 'RESET') {
+      this.data[this.name] = null;
+      return;
+    }
+
+    // 除置空之外的默认值类型，有值的时候不走
+    if (this.value) {
+      return;
+    }
+    // 没有配置默认值
+    if (isNilOrEmpty(valueType) && isNilOrEmpty(defaultValue)) {
+      return;
+    }
+    // 没有配类型，配了默认值的直接赋值默认值
+    if (!valueType && defaultValue) {
+      this.data[this.name] = defaultValue;
+      return;
+    }
+    switch (valueType) {
+      // 当前应用数据，优先取视图参数，视图参数没有取上下文
+      case 'APPDATA':
+        if (Object.prototype.hasOwnProperty.call(this.context, defaultValue)) {
+          this.data[this.name] = this.context[defaultValue];
+        }
+        if (Object.prototype.hasOwnProperty.call(this.params, defaultValue)) {
+          this.data[this.name] = this.params[defaultValue];
+        }
+        break;
+      // 当前操作用户(名称)
+      case 'OPERATORNAME':
+        this.data[this.name] = this.context.srfusername;
+        break;
+      // 当前操作用户(编号)
+      case 'OPERATOR':
+        this.data[this.name] = this.context.srfuserid;
+        break;
+      // 当前时间
+      case 'CURTIME':
+        this.data[this.name] = dayjs().format(this.model.valueFormat);
+        break;
+      // 数据对象属性
+      case 'PARAM':
+        this.data[this.name] = this.data[defaultValue];
+        break;
+      default:
+        ibiz.message.error(`[${valueType}]类型默认值未支持`);
+        break;
+    }
+  }
+}

package/src/controller/control/form/form-page.ts

@@ -0,0 +1,35 @@
+import { FormPageModel, FormTabPageModel } from '@ibiz-template/model';
+import { FormContainerController, FormController } from '.';
+
+/**
+ * 表单分页控制器
+ *
+ * @author lxm
+ * @date 2022-09-04 15:09:52
+ * @export
+ * @class FormPageController
+ * @extends {FormContainerController}
+ */
+export class FormPageController extends FormContainerController<FormPageModel> {
+  /**
+   * 构造函数
+   * @author lxm
+   * @date 2022-09-04 17:09:27
+   * @param {FormTabPageModel} model
+   * @param {FormController} form
+   */
+  constructor(model: FormTabPageModel, form: FormController) {
+    super(model, form);
+  }
+
+  /**
+   * 表单分页只看自身的，他的上层是表单
+   *
+   * @author lxm
+   * @date 2022-09-04 17:09:17
+   * @readonly
+   */
+  get visible(): boolean {
+    return this.$visible;
+  }
+}

package/src/controller/control/form/form-raw-item.ts

@@ -0,0 +1,13 @@
+import { FormRawItemModel } from '@ibiz-template/model';
+import { FormDetailController } from '.';
+
+/**
+ * 表单直接内容控制器
+ *
+ * @author lxm
+ * @date 2022-09-04 15:09:52
+ * @export
+ * @class FormRawItemController
+ * @extends {FormDetailController}
+ */
+export class FormRawItemController extends FormDetailController<FormRawItemModel> {}

package/src/controller/control/form/form-tab-page.ts

@@ -0,0 +1,13 @@
+import { FormTabPageModel } from '@ibiz-template/model';
+import { FormContainerController } from '.';
+
+/**
+ * 表单分页面板控制器
+ *
+ * @author lxm
+ * @date 2022-09-04 15:09:52
+ * @export
+ * @class FormTabPageController
+ * @extends {FormContainerController}
+ */
+export class FormTabPageController extends FormContainerController<FormTabPageModel> {}

package/src/controller/control/form/form-tab-panel.ts

@@ -0,0 +1,13 @@
+import { FormTabPanelModel } from '@ibiz-template/model';
+import { FormDetailController } from '.';
+
+/**
+ * 表单分页部件控制器
+ *
+ * @author lxm
+ * @date 2022-09-04 15:09:52
+ * @export
+ * @class FormTabPanelController
+ * @extends {FormDetailController}
+ */
+export class FormTabPanelController extends FormDetailController<FormTabPanelModel> {}

package/src/controller/control/form/form.ts

@@ -0,0 +1,233 @@
+import {
+  FormDetailModel,
+  FormGroupPanelModel,
+  FormModel,
+} from '@ibiz-template/model';
+import { debounceAndMerge, RuntimeError } from '@ibiz-template/core';
+import { ControlVO } from '../../../service';
+import {
+  FormItemController,
+  FormDetailController,
+  FormContainerController,
+} from '.';
+import { MainController } from '../main';
+import { FormNotifyState } from '../../constant';
+import { FormNerve } from '../../neuron';
+import { IFormDetailProvider } from '../../interface';
+
+/**
+ * 表单控制器
+ *
+ * @author chitanda
+ * @date 2022-08-03 11:08:29
+ * @export
+ * @class FormController
+ * @extends {ControlController<T>}
+ * @template T
+ */
+export abstract class FormController<
+  T extends FormModel = FormModel,
+> extends MainController<T> {
+  declare nerve: FormNerve;
+
+  /**
+   * 是否加载完数据
+   *
+   * @author lxm
+   * @date 2022-10-24 19:10:04
+   * @type {boolean}
+   */
+  isLoaded: boolean = false;
+
+  /**
+   * 表单数据
+   *
+   * @author lxm
+   * @date 2022-08-22 22:08:19
+   * @type {ControlVO}
+   */
+  data: ControlVO = new ControlVO();
+
+  /**
+   * 所有表单项成员的控制器
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:07
+   * @type {{ [key: string]: FormDetailController }}
+   */
+  details: { [key: string]: FormDetailController } = {};
+
+  /**
+   * 所有表单项成员的适配器
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:07
+   * @type {{ [key: string]: IFormDetailProvider }}
+   */
+  providers: { [key: string]: IFormDetailProvider } = {};
+
+  /**
+   * 表单项控制器的集合
+   *
+   * @author lxm
+   * @date 2022-09-05 00:09:52
+   * @type {FormItemController[]}
+   */
+  formItems: FormItemController[] = [];
+
+  /**
+   * 通知所有表单成员表单操作过程中的数据变更
+   *
+   * @author lxm
+   * @date 2022-09-20 18:09:40
+   * @param {string[]} names
+   */
+  dataChangeNotify(names: string[]): void {
+    Object.values(this.details).forEach(detail => {
+      detail.dataChangeNotify(names);
+    });
+  }
+
+  /**
+   * 表单状态变更通知
+   *
+   * @author lxm
+   * @date 2022-09-20 18:09:07
+   */
+  formStateNotify(state: FormNotifyState): void {
+    Object.values(this.details).forEach(detail => {
+      detail.formStateNotify(state);
+    });
+  }
+
+  /**
+   * 初始化
+   *
+   * @author lxm
+   * @date 2022-08-24 20:08:59
+   * @protected
+   * @returns {*}  {Promise<void>}
+   */
+  protected async onInit(): Promise<void> {
+    await super.onInit();
+    await this.initDetailControllers();
+
+    // vue响应式优化
+    this.details = { ...this.details };
+    this.providers = { ...this.providers };
+
+    // 数据变更通知防抖，且合并参数
+    this.dataChangeNotify = debounceAndMerge(
+      this.dataChangeNotify.bind(this),
+      (arr1, arr2): [string[]] => {
+        return [Array.from(new Set([...arr1[0], ...arr2[0]]))];
+      },
+      200,
+    );
+  }
+
+  /**
+   * 初始化表单成员控制器
+   *
+   * @author lxm
+   * @date 2022-08-24 21:08:48
+   * @protected
+   */
+  protected async initDetailControllers(
+    details: FormDetailModel[] = this.model.children,
+    form: FormController = this,
+    parent: FormContainerController | undefined = undefined,
+  ) {
+    const { formDetail } = ibiz.register;
+    if (!formDetail) {
+      throw new RuntimeError('formDetail注册器不存在');
+    }
+    await Promise.all(
+      details.map(async detail => {
+        // 生成表单成员控制器
+        const detailProvider = await ibiz.register.formDetail.get(detail);
+        if (!detailProvider) {
+          throw new RuntimeError('找不到对应的适配器');
+        }
+        form.providers[detail.source.name] = detailProvider;
+        const detailController = await detailProvider.createController(
+          detail,
+          form,
+          parent,
+        );
+        form.details[detail.source.name] = detailController;
+        if (detail.source.detailType === 'FORMITEM') {
+          form.formItems.push(detailController as FormItemController);
+        }
+        // 有子成员的生成子控制器
+        if ((detail as FormGroupPanelModel).children?.length) {
+          await this.initDetailControllers(
+            (detail as FormGroupPanelModel).children,
+            form,
+            detailController as FormContainerController,
+          );
+        }
+      }),
+    );
+  }
+
+  /**
+   * 加载
+   *
+   * @author lxm
+   * @date 2022-09-22 17:09:04
+   * @returns {*}  {Promise<IData>}
+   */
+  abstract load(): Promise<IData>;
+
+  /**
+   * 获取表单数据
+   *
+   * @author lxm
+   * @date 2022-08-30 19:08:11
+   * @returns {*}
+   */
+  getData(): IData[] {
+    return [this.data];
+  }
+
+  /**
+   * 设置表单数据的值
+   *
+   * @author lxm
+   * @date 2022-08-24 10:08:40
+   * @param {string} name 要设置的表单数据的属性名称
+   * @param {unknown} value 要设置的值
+   */
+  async setDataValue(name: string, value: unknown) {
+    if (
+      Object.prototype.hasOwnProperty.call(this.data, name) &&
+      this.data[name] === value
+    ) {
+      // *`表单里没有属性${name}或者${name}的值未发生改变`
+      return;
+    }
+
+    // 改变值
+    this.data[name] = value;
+    this.dataChangeNotify([name]);
+
+    this.force();
+  }
+
+  /**
+   * 校验表单的全部表单项
+   *
+   * @author lxm
+   * @date 2022-09-05 00:09:53
+   * @returns {*}  {Promise<boolean>}
+   */
+  async validate(): Promise<boolean> {
+    const values = await Promise.all(
+      this.formItems.map(formItem => formItem.validate()),
+    );
+
+    // 找不到value为false即全部是true
+    return values.findIndex(value => !value) === -1;
+  }
+}

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

@@ -0,0 +1,13 @@
+export * from './form';
+export * from './edit-form';
+export * from './search-form';
+export * from './form-detail';
+export * from './form-container';
+export * from './form-group-panel';
+export * from './form-page';
+export * from './form-tab-page';
+export * from './form-tab-panel';
+export * from './form-item';
+export * from './form-button';
+export * from './form-raw-item';
+export * from './form-druipart';