@ctzy-web-client/data-model 1.0.0 → 1.0.3

package/es/abstract/DataTable.mjs

@@ -0,0 +1,339 @@
+import { cloneDeep } from 'lodash';
+import { DATA_TABLE, DATA_TABLE_COLUMNS, DATA_TABLE_FILTER_COLUMN } from '../decorator/constant.mjs';
+import { sortColumn } from '../utils/index.mjs';
+import DataModel from './DataModel.mjs';
+import './FilterColumn.mjs';
+import TableColumn from './TableColumn.mjs';
+import { FilterPanel } from './FilterPanel.mjs';
+
+class DataTable extends DataModel {
+  get filterColumns() {
+    return this.filterPanel.getColumns();
+  }
+  get locking() {
+    return this._loadingCount > 0;
+  }
+  get searchParams() {
+    return this.filterPanel._filterParams;
+  }
+  set whereForFilter(v) {
+    this._options.whereForFilter = v;
+    if (this.filterPanel) {
+      this.filterPanel.whereForFilter = v;
+    }
+  }
+  get whereForFilter() {
+    return this._options.whereForFilter;
+  }
+  set whereParamName(v) {
+    this.filterPanel.whereParamName = v;
+  }
+  get whereParamName() {
+    return this.filterPanel.whereParamName;
+  }
+  set encryptCondition(v) {
+    this.filterPanel.encryptCondition = v;
+  }
+  get encryptCondition() {
+    return this.filterPanel.encryptCondition;
+  }
+  constructor(option) {
+    super(option);
+    this._userService = null;
+    this._loadingCount = 0;
+    this.totalRecCount = 0;
+    this.pageNum = 1;
+    this.pageSize = 20;
+    this.selection = [];
+    this.data = [];
+    this._defaultColumnSort = [];
+    this.inited = false;
+    this.filterPanel = new FilterPanel(this);
+    this.whereForFilter = this.whereForFilter;
+    this._loadCallbacks = [];
+    this.filterPanel.on("ready", () => {
+      for (let callback of this._loadCallbacks) {
+        callback();
+      }
+    });
+  }
+  getTotalPage() {
+    const totalPage = Math.ceil(this.totalRecCount / this.pageSize);
+    return Number.isNaN(totalPage) ? 0 : totalPage;
+  }
+  setOptions(options) {
+    var _a;
+    if (!options.model) {
+      return;
+    }
+    super.setOptions({
+      ...options.model[DATA_TABLE],
+      model: options.model
+    });
+    this.whereForFilter = (_a = options.model[DATA_TABLE].whereForFilter) != null ? _a : false;
+  }
+  setSelection(selection) {
+    const oldSelection = this.selection;
+    this.selection = selection;
+    this.emit("select-change", selection, oldSelection);
+  }
+  getSelection() {
+    return this.selection;
+  }
+  clearSelection() {
+    this.setSelection([]);
+  }
+  setWhereParamName(whereParamName) {
+    this.whereParamName = whereParamName;
+  }
+  init() {
+    if (this.inited) {
+      return;
+    }
+    super.init();
+    const model = this.model;
+    if (!model) {
+      return;
+    }
+    if (this.extendField) {
+      this._loadingCount++;
+      return;
+    } else {
+      let tableColumnConfigs = model.tableColumns || [];
+      const tableColumns = (model[DATA_TABLE_COLUMNS] || []).map((columnConfig) => new TableColumn({
+        type: columnConfig.formComponent === "BwaRichText" ? "html" : "",
+        ...columnConfig
+      }));
+      tableColumnConfigs = tableColumnConfigs.concat(tableColumns.filter((column) => !tableColumnConfigs.includes(column.name)).map((column) => column.attrName));
+      sortColumn(tableColumns, tableColumnConfigs).forEach((tableColumn) => {
+        this.addColumn(tableColumn);
+      });
+    }
+    this._defaultColumnSort = this.getColumns().map((column) => ({
+      name: column.attrName,
+      visible: column.visible
+    }));
+    this.filterPanel.init([], model[DATA_TABLE_FILTER_COLUMN] || [], model.filterColumns || []);
+    this.inited = true;
+    this.emit("init-completed");
+  }
+  setData(data, append = false) {
+    if (!append) {
+      this.data.length = 0;
+    }
+    this.data.push(...data);
+    this.ready = true;
+  }
+  async setDataBeforeMount(data = []) {
+    if (this.extendFieldInfos.every((a) => a.type !== 0)) {
+      return data;
+    }
+    const colMap = {};
+    let userListResult = {};
+    if (this.extendFieldInfos.some((a) => ["BwaUserSelect", "BwaUserMultiSelect"].includes(a.component))) {
+      if (this._userService) {
+        userListResult = await this._userService({
+          name: ""
+        });
+      }
+    }
+    this.extendFieldInfos.forEach((e) => {
+      var _a;
+      if (e.type === 0) {
+        if (["BwaSelect", "BwaMultiSelect"].includes(e.component)) {
+          colMap[e.name] = (_a = e.extendInfo) == null ? void 0 : _a.options;
+        }
+        if (["BwaUserSelect", "BwaUserMultiSelect"].includes(e.component)) {
+          colMap[e.name] = (userListResult == null ? void 0 : userListResult.data) || [];
+        }
+      }
+    });
+    const getValueByString = (key, value) => {
+      let arr = colMap[key] || [];
+      let find = arr.find((item) => item.value == value);
+      return find ? find.label : value || "-";
+    };
+    const getValueByArray = (key, valueList) => {
+      let list = [];
+      valueList.forEach((v) => {
+        list.push(getValueByString(key, v));
+      });
+      return list;
+    };
+    data.forEach((e) => {
+      let obj = e.columnJson || e.json || {};
+      Object.keys(obj).forEach((key) => {
+        if (["string", "number"].includes(typeof obj[key]))
+          obj[key] = getValueByString(key, obj[key]);
+        if (Array.isArray(obj[key]))
+          obj[key] = getValueByArray(key, obj[key]);
+      });
+    });
+    return data;
+  }
+  async load(params) {
+    if (!this.filterPanel.ready) {
+      return new Promise((resolve, reject) => {
+        this._loadCallbacks.push(() => {
+          this.load(params).then(resolve, reject);
+        });
+      });
+    }
+    this.ready = false;
+    this._loadingCount++;
+    const loadParams = {
+      [this.adapter.pagerNumParamName]: this.pageNum,
+      [this.adapter.recCountParamName]: this.pageSize,
+      ...this.defaultParams,
+      ...this.filterPanel.getAjaxParams(),
+      ...params
+    };
+    this.emit("before-load", loadParams);
+    return this.adapter.loadDataListHandle(this, loadParams).then((res) => {
+      this.totalRecCount = res[this.adapter.totalRecCountNodeName] ? res[this.adapter.totalRecCountNodeName] * 1 : 0;
+      const data = (res[this.adapter.dataNodeName] || []).map(this.formatData.bind(this));
+      this.setDataBeforeMount(data).then((arr) => {
+        this.setData(arr);
+      });
+      this.emit("load-successfully", res);
+      return res;
+    }).catch((e) => {
+      this.emit("load-failed", e);
+      return Promise.reject(e);
+    }).finally(() => {
+      this.emit("load-complete");
+      this._loadingCount--;
+    });
+  }
+  refresh() {
+    return this.load();
+  }
+  pageTo(pageNum) {
+    this.pageNum = pageNum || 1;
+    this.emit("current-page-change", this.pageNum);
+    return this.refresh();
+  }
+  setPageSize(pageSize) {
+    this.pageSize = pageSize;
+    this.emit("page-size-change", this.pageSize);
+    return this.refresh();
+  }
+  async delete(params) {
+    if (this.locking) {
+      return;
+    }
+    this._loadingCount++;
+    if (typeof params !== "object") {
+      params = {
+        [this.primaryKey]: params
+      };
+    }
+    return this.adapter.deleteHandle(this, params).then((res) => {
+      this.emit("delete-successfully", res);
+      return res;
+    }).catch((e) => {
+      this.emit("delete-failed", e);
+      throw e;
+    }).finally(() => {
+      this._loadingCount--;
+      this.emit("delete-complete");
+    });
+  }
+  formatExtendFieldInfo(extendFieldInfo) {
+    return {
+      ...super.formatExtendFieldInfo(extendFieldInfo),
+      component: "",
+      formComponent: extendFieldInfo.component,
+      visible: !!extendFieldInfo.enablePageShow
+    };
+  }
+  mergeTableColumn(formatedExtendFieldInfo, modelFieldInfo) {
+    var _a;
+    return {
+      ...super.mergeTableColumn(formatedExtendFieldInfo, modelFieldInfo),
+      visible: (_a = modelFieldInfo == null ? void 0 : modelFieldInfo.visible) != null ? _a : true
+    };
+  }
+  setExtendFieldInfos(extendFieldInfos) {
+    this.extendFieldInfos = extendFieldInfos;
+    const mergedColumnInfos = this.mergeTableColumns(extendFieldInfos, this.model[DATA_TABLE_COLUMNS]);
+    const tableColumns = mergedColumnInfos.map((columnInfo) => new TableColumn({
+      type: columnInfo.formComponent === "BwaRichText" ? "html" : "",
+      ...columnInfo
+    }));
+    this.setColumns(tableColumns);
+    this._defaultColumnSort = this.getColumns().map((column) => ({
+      name: column.attrName,
+      visible: column.visible
+    }));
+    this.filterPanel.init(extendFieldInfos, this.model[DATA_TABLE_FILTER_COLUMN] || [], this.model.filterColumns || []);
+    this._loadingCount--;
+    this.inited = true;
+    this.emit("init-completed");
+  }
+  async refreshAfterDelete(params) {
+    const deleteResult = await this.delete(params);
+    this.refresh();
+    return deleteResult;
+  }
+  sortColumns(columns) {
+    return sortColumn(columns, this.model.tableColumns || []);
+  }
+  resetColumnSort() {
+    if (this.isDefaultColumnSort()) {
+      return;
+    }
+    this._defaultColumnSort.forEach((item) => {
+      const column = this.getColumn(item.name);
+      if (column) {
+        column.visible = item.visible;
+      }
+    });
+    const displayColumns = this._defaultColumnSort.filter((item) => item.visible).map((item) => {
+      return this.getColumn(item.name);
+    });
+    this.setDisplayColumns(displayColumns);
+  }
+  isDefaultColumnSort() {
+    const displayColumns = this.getDisplayColumns();
+    const defaultVisibleColumnInfos = this._defaultColumnSort.filter((item) => item.visible);
+    if (displayColumns.length !== defaultVisibleColumnInfos.length) {
+      return false;
+    }
+    for (let i = 0; i < displayColumns.length; i++) {
+      if (displayColumns[i].attrName !== defaultVisibleColumnInfos[i].name || displayColumns[i].visible !== defaultVisibleColumnInfos[i].visible) {
+        return false;
+      }
+    }
+    return true;
+  }
+  addFilterColumn(column) {
+    this.filterPanel.addColumn(column);
+  }
+  removeFilterColumn(column) {
+    this.filterPanel.removeColumn(column);
+  }
+  setFilterColumns(columns) {
+    this.filterPanel.setColumns(columns);
+  }
+  getFilterColumns() {
+    return this.filterPanel.getColumns();
+  }
+  getFilterColumn(columnName) {
+    return this.filterPanel.getColumn(columnName);
+  }
+  resetSearchParams() {
+    this.filterPanel.resetFilterParams();
+  }
+  clone() {
+    const cloned = super.clone();
+    cloned.data = cloneDeep(this.data);
+    cloned.filterPanel = cloneDeep(this.filterPanel);
+    cloned.selection = this.selection.map((select) => {
+      return cloned.data.find((item) => item[this.primaryKey] === select[this.primaryKey]);
+    }).filter(Boolean);
+    return cloned;
+  }
+}
+
+export { DataTable as default };

package/es/abstract/FilterColumn.mjs

@@ -0,0 +1,44 @@
+import DataColumn from './DataColumn.mjs';
+
+class FilterColumn extends DataColumn {
+  constructor(filterPanel, options) {
+    var _a, _b, _c, _d;
+    super(options);
+    this.closable = true;
+    this.attrMapping = {
+      start: {
+        name: "${name}",
+        op: ">="
+      },
+      end: {
+        name: "${name}",
+        op: "<="
+      }
+    };
+    this.conditionOper = "AND";
+    this.formComponent = "";
+    this.twoFieldsDatePicker = false;
+    this.closable = (_a = options.closable) != null ? _a : this.closable;
+    this.attrMapping = (_c = (_b = options.attrMapping) != null ? _b : options.whereAttrMapping) != null ? _c : this.attrMapping;
+    this.filterPanel = filterPanel;
+    this.conditionOper = options.conditionOper;
+    this.formComponent = (_d = options.formComponent) != null ? _d : this.formComponent;
+    this.twoFieldsDatePicker = options.twoFieldsDatePicker;
+  }
+  show() {
+    const visible = this.visible;
+    super.show();
+    if (visible !== this.visible) {
+      this.filterPanel.appliedColumn(this);
+    }
+  }
+  hide() {
+    const visible = this.visible;
+    super.hide();
+    if (visible !== this.visible) {
+      this.filterPanel.cancelAppliedColumn(this);
+    }
+  }
+}
+
+export { FilterColumn as default };