cloud-web-corejs 1.0.245 → 1.0.246

package/src/components/xform/utils/sfc-generator.js

@@ -389,12 +389,12 @@ export function buildFieldWidget(widget, formConfig) {
   let customLabelDom =
 `<template #label><span class="custom-label">${wop.labelIconPosition === 'front' ?
   (!!wop.labelTooltip ?
-      `<el-tooltip content="${wop.labelTooltip}" effect="light"><i class="${wop.labelIconClass}"></i></el-tooltip>${wop.label}` :
+      `<el-tooltip content="${wop.labelTooltip}" effect="light" popper-class="label-tooltip-pre-line"><i class="${wop.labelIconClass}"></i></el-tooltip>${wop.label}` :
       `<i class="${wop.labelIconClass}"></i>${wop.label}`
   )
   :
   (!!wop.labelTooltip ?
-      `${wop.label}<el-tooltip content="${wop.labelTooltip}" effect="light"><i class="${wop.labelIconClass}"></i></el-tooltip>` :
+      `${wop.label}<el-tooltip content="${wop.labelTooltip}" effect="light" popper-class="label-tooltip-pre-line"><i class="${wop.labelIconClass}"></i></el-tooltip>` :
       `${wop.label}<i class="${wop.labelIconClass}"></i>`
   )
 }

package/src/components/xform/utils/tableColumnHelper.js

@@ -0,0 +1,156 @@
+function buildColumnConfigMap(tableColumns, map = {}) {
+  if (!tableColumns || !tableColumns.length) {
+    return map;
+  }
+  tableColumns.forEach((col) => {
+    if (col.prop) {
+      map[col.prop] = col;
+    }
+    if (col.columnId) {
+      map[`__id__${col.columnId}`] = col;
+    }
+    if (col.children && col.children.length) {
+      buildColumnConfigMap(col.children, map);
+    }
+  });
+  return map;
+}
+
+function enrichColumnList(columns, configMap) {
+  if (!columns || !columns.length) {
+    return columns;
+  }
+  return columns.map((col) => {
+    const newCol = Object.assign({}, col);
+    if (col.slots) {
+      newCol.slots = Object.assign({}, col.slots);
+    }
+    const field = col.field;
+    const columnId = col.params && col.params.columnId;
+    const config =
+      (field && configMap[field]) ||
+      (columnId && configMap[`__id__${columnId}`]);
+    if (config) {
+      applyColumnLabelIcon(newCol, config);
+    }
+    if (col.children && col.children.length) {
+      newCol.children = enrichColumnList(col.children, configMap);
+    }
+    return newCol;
+  });
+}
+
+/**
+ * Apply data-table column header icon config to vxe-table column definition.
+ */
+export function resolveColumnRequiredFlag(columnConfig) {
+  if (!columnConfig) {
+    return false;
+  }
+  if (columnConfig.required) {
+    return true;
+  }
+  if (columnConfig.editWidget?.options?.required) {
+    return true;
+  }
+  if (columnConfig.widget?.options?.required) {
+    return true;
+  }
+  const widgetOptions =
+    columnConfig.widgetOptions ?? columnConfig.columnOption;
+  const editWidgetOptions =
+    columnConfig.editWidgetOptions ?? columnConfig.editColumnOption;
+  return !!(widgetOptions?.required || editWidgetOptions?.required);
+}
+
+function buildVxeTitlePrefixTooltip(tooltip) {
+  if (!tooltip) {
+    return {};
+  }
+  if (/\r?\n/.test(tooltip)) {
+    return {
+      content: tooltip
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/\r\n/g, "\n")
+        .replace(/\n/g, "<br/>"),
+      useHTML: true,
+    };
+  }
+  return { content: tooltip };
+}
+
+export function applyColumnLabelIcon(col, columnConfig) {
+  if (!col || !columnConfig) {
+    return col;
+  }
+
+  const iconClass = columnConfig.labelIconClass;
+  const position = columnConfig.labelIconPosition || "rear";
+  const tooltip = columnConfig.labelTooltip;
+  const required = resolveColumnRequiredFlag(columnConfig);
+  const title = col.title;
+  const displayIconClass = iconClass || (tooltip ? "el-icon-info" : null);
+
+  if (!displayIconClass && !required) {
+    return col;
+  }
+
+  const buildIcon = (h) => {
+    const icon = h("i", { class: ["vxe-cell-help-icon", displayIconClass] });
+    if (!tooltip) {
+      return icon;
+    }
+    return h(
+      "el-tooltip",
+      {
+        props: {
+          content: tooltip,
+          effect: "dark",
+          placement: "top",
+          popperClass: "label-tooltip-pre-line",
+        },
+      },
+      [icon]
+    );
+  };
+
+  if (displayIconClass && position === "front" && !required) {
+    col.titlePrefix = {
+      icon: displayIconClass,
+      ...buildVxeTitlePrefixTooltip(tooltip),
+    };
+    return col;
+  }
+
+  if (required && !displayIconClass) {
+    col.titlePrefix = { icon: "vxe-cell--required-icon" };
+    return col;
+  }
+
+  col.slots = col.slots || {};
+  delete col.titlePrefix;
+
+  col.slots.header = (params, h) => {
+    const nodes = [];
+    if (required) {
+      nodes.push(h("i", { class: "vxe-cell--required-icon" }));
+    }
+    if (displayIconClass && position === "front") {
+      nodes.push(buildIcon(h));
+    }
+    nodes.push(h("span", { class: "vxe-cell--title" }, title));
+    if (displayIconClass && position === "rear") {
+      nodes.push(buildIcon(h));
+    }
+    return nodes;
+  };
+
+  return col;
+}
+
+export function enrichTableColumnsWithLabelIcon(columns, tableColumns) {
+  const configMap = buildColumnConfigMap(tableColumns || []);
+  return enrichColumnList(columns, configMap);
+}