cnhis-design-vue 3.1.17 → 3.1.18-beta.4

package/es/components/big-table/src/hooks/useNestTable.js

@@ -0,0 +1,86 @@
+import { computed } from 'vue';
+import XEUtils from 'xe-utils';
+import 'moment';
+
+const useNestTable = (props, state, emit) => {
+  const isAboutNestTable = computed(() => {
+    return props.showNestTable || props.isNestTable;
+  });
+  const isExpandTable = computed(() => {
+    const { isBatchSelect } = props.columnConfig || {};
+    return !props.isNestTable && isBatchSelect == 1;
+  });
+  const handleRowId = computed(() => {
+    if (state.isTree == 2 || state.isTree == 3) {
+      return "theUniqueKey";
+    }
+    return props.primaryKey || "theUniqueKey";
+  });
+  const toggleExpandMethod = ({ expanded, row }) => {
+    return true;
+  };
+  const loadExpandMethod = async ({ row, rowIndex }) => {
+    var _a, _b, _c, _d;
+    try {
+      if ((_a = row.expandList) == null ? void 0 : _a.length) {
+        return Promise.resolve();
+      }
+      let res = await props.nestTableDataRequest(rowIndex);
+      console.log(res, "loadExpandMethod---res");
+      if (!res || !res.status) {
+        row.expandList = [];
+        row.__emptyItems__ = { noDataTip: ((_b = res == null ? void 0 : res.data) == null ? void 0 : _b.resultMsg) || "\u6682\u65E0\u6570\u636E" };
+        return Promise.reject([]);
+      }
+      let data = res.data || {};
+      console.log(data, "loadExpandMethod---data");
+      if (!data) {
+        row.expandList = [];
+        row.__emptyItems__ = { noDataTip: ((_c = res == null ? void 0 : res.data) == null ? void 0 : _c.resultMsg) || "\u6682\u65E0\u6570\u636E" };
+        return Promise.reject([]);
+      }
+      let list, oldtableData;
+      if (XEUtils.isArray(data)) {
+        list = data;
+        oldtableData = data;
+      } else {
+        list = data.list;
+        oldtableData = data.oldtableData || data.list;
+      }
+      row.expandList = list;
+      row.oldtableData = oldtableData;
+      let key = row[handleRowId.value];
+      emit("setNestOriginTableMap", key, oldtableData);
+      return Promise.resolve();
+    } catch (err) {
+      console.log(err, "loadExpandMethod---err");
+      row.expandList = [];
+      row.__emptyItems__ = { noDataTip: ((_d = err == null ? void 0 : err.data) == null ? void 0 : _d.resultMsg) || "\u8BF7\u6C42\u9519\u8BEF" };
+      return Promise.reject([]);
+    }
+  };
+  const nestHandleClickRow = (table, data) => {
+    let checked = table.isCheckedByCheckboxRow(data.row);
+    checked = !checked;
+    state.checkedRows = [];
+    table == null ? void 0 : table.setCheckboxRow([data.row], checked);
+    emit("setNestTableClick", checked);
+    emit("nestSetSelectRowObj", data.row[handleRowId.value], checked);
+    let clickObj = {
+      isNestTableTrigger: true,
+      checked,
+      primaryValue: data.row[handleRowId.value]
+    };
+    emit("handlerClickRow", data == null ? void 0 : data.row, data.$rowIndex, clickObj);
+  };
+  return {
+    isAboutNestTable,
+    isExpandTable,
+    handleRowId,
+    toggleExpandMethod,
+    loadExpandMethod,
+    nestHandleClickRow
+  };
+};
+
+export { useNestTable };

package/es/components/big-table/src/hooks/useSeparateRow.d.ts

@@ -0,0 +1,30 @@
+import { AnyObject, Func } from '../../../../../es/shared/types';
+import { Ref } from 'vue';
+import { VxeTableEvents, VxeTableInstance } from 'vxe-table';
+export declare class SeparateHandle {
+    callbacks: Set<Func<any[], any>>;
+    add(cb: Func): void;
+    remove(cb: Func): void;
+    clear(): void;
+    trigger(): void;
+}
+export declare function useSeparateMap(): {
+    separateDataMap: Ref<WeakMap<AnyObject, {
+        separateData: Record<string, string>;
+        index: number;
+        rawRow: AnyObject;
+        row: AnyObject;
+    }>>;
+    getRowData: (row: AnyObject) => {
+        separateData: Record<string, string>;
+        index: number;
+        rawRow: AnyObject;
+        row: AnyObject;
+    } | undefined;
+};
+export declare function useSeparateRow(getColumnConfig: () => AnyObject[], getFieldItem: (columnName: string) => AnyObject, $VXETable: Ref<undefined | VxeTableInstance>): {
+    onColumnResize: VxeTableEvents.ResizableChange;
+    needSeparateColumn: import("vue").ComputedRef<AnyObject[]>;
+    separate: (data: AnyObject[], rawData: AnyObject[]) => Promise<AnyObject[]>;
+    separateHandle: SeparateHandle;
+};

package/es/components/big-table/src/hooks/useSeparateRow.js

@@ -0,0 +1,164 @@
+import { useMemoize } from '@vueuse/core';
+import { isNumber, isArray, cloneDeep, isString } from 'lodash-es';
+import { ref, computed, provide, watch, nextTick } from 'vue';
+import { InjectionSeparateHandle } from '../constants/index.js';
+
+class SeparateHandle {
+  constructor() {
+    this.callbacks = /* @__PURE__ */ new Set();
+  }
+  add(cb) {
+    this.callbacks.add(cb);
+  }
+  remove(cb) {
+    this.callbacks.delete(cb);
+  }
+  clear() {
+    this.callbacks.clear();
+  }
+  trigger() {
+    this.callbacks.forEach((cb) => cb());
+  }
+}
+const getStringWidth = /* @__PURE__ */ useMemoize(function(str) {
+  if (!str)
+    return 0;
+  return [...str].reduce((width, char) => {
+    if (/[a-z]/.test(char)) {
+      return width + 8;
+    }
+    if (/[A-Z]/.test(char)) {
+      return width + 12;
+    }
+    if (/\d/.test(char)) {
+      return width + 9;
+    }
+    if (/\./.test(char)) {
+      return width + 4;
+    }
+    if (/[\u4e00-\u9fa5]/.test(char)) {
+      return width + 15;
+    }
+    if (/-/.test(char)) {
+      return width + 4;
+    }
+    if (/[（）]/.test(char)) {
+      return width + 14;
+    }
+    if (/[)(]/.test(char)) {
+      return width + 5;
+    }
+    if (/-/.test(char)) {
+      return width + 10;
+    }
+    if (/%/.test(char)) {
+      return width + 14;
+    }
+    if (/‰/.test(char)) {
+      return width + 16;
+    }
+    return width + 6;
+  }, 0);
+});
+const separateDataMap = ref(/* @__PURE__ */ new WeakMap());
+function useSeparateMap() {
+  function getRowData(row) {
+    return separateDataMap.value.get(row);
+  }
+  return { separateDataMap, getRowData };
+}
+function useSeparateRow(getColumnConfig, getFieldItem, $VXETable) {
+  const needSeparateColumn = computed(() => {
+    return getColumnConfig().filter((column) => column.formType === "separate");
+  });
+  async function separate(data, rawData) {
+    if (!needSeparateColumn.value.length) {
+      return data;
+    }
+    return data.reduce(async (res, row, dataIndex) => {
+      const parsedRowData = [];
+      for (const column of needSeparateColumn.value) {
+        parsedRowData.push({
+          columnName: column.columnName,
+          data: contentSeparate(row[column.columnName], column.columnName, await getColumnRenderWidth(column))
+        });
+      }
+      (await res).push(...Array.from({ length: getColumnInfoMaxLength(parsedRowData) }).map((_, index) => {
+        const separateData = getSeparateRowData(parsedRowData, index);
+        if (index === 0) {
+          separateDataMap.value.set(row, {
+            row,
+            rawRow: rawData[dataIndex],
+            index: dataIndex,
+            separateData
+          });
+          row.$__SEPARATE_DATA = [separateData];
+          return row;
+        }
+        const data2 = { $__SEPARATE: true };
+        separateDataMap.value.set(data2, {
+          row: data2,
+          rawRow: rawData[dataIndex],
+          index: dataIndex,
+          separateData
+        });
+        row.$__SEPARATE_DATA.push(separateData);
+        return data2;
+      }));
+      return res;
+    }, Promise.resolve([]));
+    function getSeparateRowData(parsedRowData, index) {
+      return parsedRowData.reduce((res, info) => {
+        res[info.columnName] = info.data[index];
+        return res;
+      }, {});
+    }
+    function getColumnInfoMaxLength(parsedRowData) {
+      return Math.max(...parsedRowData.map((r) => r.data.length));
+    }
+    async function getColumnRenderWidth(column) {
+      const prev = getRenderWidth();
+      if (!prev) {
+        await nextTick();
+      }
+      return getRenderWidth() || getColumnWidth();
+      function getRenderWidth() {
+        var _a, _b;
+        return (_b = (_a = $VXETable.value) == null ? void 0 : _a.getColumnByField(column.columnName)) == null ? void 0 : _b.renderWidth;
+      }
+      function getColumnWidth() {
+        return isNumber(column.width) ? column.width : 64;
+      }
+    }
+  }
+  function contentSeparate(value, columnName, width) {
+    if (isArray(value))
+      return value.map((row) => {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = getFieldItem(columnName)) == null ? void 0 : _a.separateFormatter) == null ? void 0 : _b.call(_a, cloneDeep(row))) != null ? _c : row;
+      });
+    if (!isString(value) || !isNumber(width))
+      return [value];
+    width -= 24;
+    return [...value].reduce((res, char) => {
+      const latestString = res[res.length - 1];
+      if (getStringWidth(latestString + char) > width) {
+        res.push(char);
+      } else {
+        res[res.length - 1] = latestString + char;
+      }
+      return res;
+    }, [""]);
+  }
+  const onColumnResize = ({ column }) => {
+    if (needSeparateColumn.value.some((separateColumn) => separateColumn.columnName === column.field)) {
+      separateHandle.trigger();
+    }
+  };
+  const separateHandle = new SeparateHandle();
+  provide(InjectionSeparateHandle, separateHandle);
+  watch(needSeparateColumn, separateHandle.trigger.bind(separateHandle));
+  return { onColumnResize, needSeparateColumn, separate, separateHandle };
+}
+
+export { SeparateHandle, useSeparateMap, useSeparateRow };

package/es/components/big-table/src/hooks/useTableParse.js

@@ -0,0 +1,136 @@
+import XEUtils from 'xe-utils';
+import 'moment';
+
+const useTableParse = (formatData) => {
+  const parseDurationValue = (v, duration) => {
+    if (!v && v !== 0)
+      return;
+    const unitList = {
+      day: 86400,
+      minute: 60,
+      hour: 3600,
+      second: 1
+    };
+    const unit = duration && unitList[duration] || 1;
+    const value = v * unit || 0;
+    const mu = 60;
+    if (value < mu) {
+      return `${value}\u79D2`;
+    }
+    const hu = mu * 60;
+    if (value < hu) {
+      return `${Math.floor(value / 60)}\u5206`;
+    }
+    const du = hu * 24;
+    if (value < du) {
+      const v2 = Math.floor(value / 60) % 60;
+      return `${Math.floor(value / hu)}\u5C0F\u65F6${v2 ? v2 + "\u5206" : ""}`;
+    }
+    const MU = du * 30;
+    if (value < MU) {
+      const v2 = Math.floor(value / hu) % 24;
+      return `${Math.floor(value / du)}\u5929${v2 ? v2 + "\u5C0F\u65F6" : ""}`;
+    }
+    const yu = du * 365;
+    if (value < yu) {
+      const unit2 = 30;
+      const v1 = Math.floor(value / du / unit2);
+      const v2 = Math.floor((value - v1 * unit2 * du) / du);
+      return `${v1}\u4E2A\u6708${v2 ? v2 + "\u5929" : ""}`;
+    }
+    return `${Math.floor(value / du / 365)}\u5E74`;
+  };
+  const parseCombinationValue = (value, setting) => {
+    let data = value ? JSON.parse(value) : [];
+    if (!Array.isArray(data)) {
+      data = [data];
+    }
+    const { combinationField: key } = setting;
+    if (!key)
+      return value;
+    return data.reduce((str, item) => {
+      const v = item[key];
+      typeof v !== "undefined" && (str += `,${v}`);
+      return str;
+    }, "").slice(1);
+  };
+  const formatFieldText = (row, field, fieldList, fieldListOriginal, isTimeAxisRenderNew, isTimeAxisExpand) => {
+    var _a, _b;
+    if (isTimeAxisRenderNew && field.fieldType.includes("DATE")) {
+      let key = field.columnName;
+      if (!isTimeAxisExpand) {
+        key = field.columnName + "_fold";
+      }
+      const text = row[key];
+      return text;
+    }
+    const formatText = (text) => text ? text : String(text) === "0" ? "0" : "";
+    const haveValue = (val) => {
+      return val !== void 0 && val !== "";
+    };
+    const findField = (columnName, fieldList2) => {
+      return fieldList2.find((item) => item.columnName === columnName);
+    };
+    const html = formatText(row[field.columnName]);
+    if (!haveValue(html)) {
+      return "";
+    }
+    if ((_a = field.settingObj) == null ? void 0 : _a.mergedFeildExpression) {
+      const { mergedFeildExpression } = field.settingObj;
+      const passList = [];
+      const regexp = /#{(.+?)\}/g;
+      let formatHtml = mergedFeildExpression.replace(regexp, (match, p1) => {
+        const findFieldItem = findField(p1, fieldListOriginal);
+        passList.push(haveValue(row[p1]) && findFieldItem);
+        if (findFieldItem && formatData) {
+          const cloneRow = JSON.parse(JSON.stringify(row));
+          const tableData = formatData({
+            tableList: [cloneRow],
+            fieldList: [findFieldItem],
+            btnList: []
+          })[0];
+          return formatText(tableData[p1]);
+        }
+        return formatText(row[p1]);
+      });
+      const pass = passList.every((b) => b);
+      if (!pass) {
+        return html;
+      }
+      const originColumnNameColorList = ((_b = findField(field.columnName, fieldList)) == null ? void 0 : _b.colorAndIcon) || [];
+      const findC = originColumnNameColorList.find((c) => XEUtils.parseCondition(c.condition, {
+        form: {},
+        table: {
+          ...row
+        },
+        sys: {}
+      }, fieldList));
+      const originColumnNameColor = (findC == null ? void 0 : findC.color) || "inherit";
+      const regexp2 = /color(:|;)(.+?)(;|")/g;
+      formatHtml = formatHtml.replace(regexp2, (match, p1, p2, p3 = "") => {
+        return p3;
+      });
+      formatHtml = `<span style="color: ${originColumnNameColor};">${formatHtml}</span>`;
+      return formatHtml;
+    }
+    if (XEUtils.isString(html) && (html == null ? void 0 : html.startsWith("###{")) && (html == null ? void 0 : html.includes("change_text"))) {
+      return XEUtils.stringToValue(html, "change_text");
+    }
+    return html;
+  };
+  const imgs2imgArr = (imgs) => {
+    if (!imgs)
+      return [];
+    return imgs.replace(/(,)(data|http)/g, (match, p1, p2) => {
+      return `|${p2}`;
+    }).split("|");
+  };
+  return {
+    parseDurationValue,
+    parseCombinationValue,
+    formatFieldText,
+    imgs2imgArr
+  };
+};
+
+export { useTableParse };