super-page-runtime 2.3.17 → 2.3.18-tmp1

package/dist/lib/components/runtime/views/assemblys/chart/table/table-runtime.vue2.js

@@ -0,0 +1,631 @@
+"use strict";
+const Vue = require("vue");
+const commonChartHeader_vue_vue_type_script_setup_true_lang = require("../common/common-chart-header.vue.js");
+const pageHelperUtil = require("../../../../utils/page-helper-util.js");
+const eventUtil = require("../../../../utils/events/event-util.js");
+const groupColumn_vue_vue_type_script_setup_true_lang = require("./group-column.vue.js");
+const normalColumn_vue_vue_type_script_setup_true_lang = require("./normal-column.vue.js");
+const tablePageination_vue_vue_type_script_setup_true_lang = require("./table-pageination.vue.js");
+const chartTableUtil = require("./chart-table-util.js");
+const commonUtil = require("../../../../utils/common-util.js");
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "table-runtime",
+  props: {
+    configure: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    pageContext: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    }
+  },
+  setup(__props, { expose: __expose }) {
+    var _a;
+    const props = __props;
+    const runtimeInfo = props.configure.runtime ? props.configure.runtime : {};
+    const runtimeStyle = runtimeInfo.style;
+    const runtimeClass = runtimeInfo.class;
+    const dataConfig = runtimeInfo.dataConfig;
+    const headerInfo = runtimeInfo.headerInfo ? runtimeInfo.headerInfo : {};
+    const headerRef = Vue.ref(null);
+    const isEnableGroupHeader = Vue.ref(runtimeInfo.props.isEnableGroupHeader);
+    const tableData = Vue.ref([]);
+    const tableColumnsConfig = Vue.ref([]);
+    const groupColumnsConfig = Vue.ref([]);
+    const columnsConfigKeyValues = Vue.ref({});
+    const showSummary = Vue.ref(false);
+    const tableSummaryTitle = Vue.ref({});
+    const tableSummaryColumns = Vue.ref({});
+    const groupSummaryColumns = Vue.ref({});
+    const groupSummaryDataRowIndex = [];
+    const columnStyleSourceConfig = Vue.ref({});
+    const dataFormulaMapping = Vue.ref({});
+    const gridRef = Vue.ref(null);
+    const visibleColumns = Vue.computed(() => {
+      if (isEnableGroupHeader.value) {
+        return groupColumnsConfig.value.filter((column) => {
+          if (!column.isLeaf) {
+            return true;
+          }
+          return calacShowColumn(columnsConfigKeyValues[column.columnUuid]);
+        });
+      } else {
+        return tableColumnsConfig.value.filter((column) => {
+          return calacShowColumn(column);
+        });
+      }
+    });
+    const total = Vue.ref(0);
+    let tmpTableData = [];
+    if (!props.configure.props.modelCustom) {
+      if (!isEnableGroupHeader.value) {
+        tableColumnsConfig.value = props.configure.items;
+      } else {
+        const tempGroupHeaders = [];
+        props.configure.props.groupHeaders.forEach((item) => {
+          if (!item.parentUuid) {
+            tempGroupHeaders.push(item);
+          }
+        });
+        tempGroupHeaders.sort((a, b) => a.displayOrder - b.displayOrder);
+        groupColumnsConfig.value = tempGroupHeaders;
+        pushIdnexColumnToGroupHeaders();
+      }
+      (_a = props.configure.items) == null ? void 0 : _a.forEach((item) => {
+        columnsConfigKeyValues.value[item.uuid] = item;
+        if (Object.keys(item.style).length > 0) {
+          columnStyleSourceConfig.value[item.props.base.prop] = {
+            cellStyle: item.style,
+            titleStyle: item.titleStyle
+          };
+        }
+        if (item.formula && item.formula.trim() !== "") {
+          dataFormulaMapping.value[item.props.base.prop] = item.formula;
+        }
+      });
+    }
+    showSummary.value = props.configure.props.base.showSummary;
+    if (showSummary.value || props.configure.props.highOrder.groupField && props.configure.props.highOrder.groupField.length > 0) {
+      tableSummaryTitle.value = chartTableUtil.getSummaryTitleColumn(props.configure);
+      if (showSummary.value) {
+        tableSummaryColumns.value = chartTableUtil.getSummaryDataColumn(props.configure, "table");
+      }
+      if (props.configure.props.highOrder.groupField && props.configure.props.highOrder.groupField.length > 0) {
+        groupSummaryColumns.value = chartTableUtil.getSummaryDataColumn(props.configure, "group");
+      }
+    }
+    let maxHeight = 300;
+    let sizeConfig = pageHelperUtil.getSizeConfig(props.pageContext, props.configure);
+    if (sizeConfig && sizeConfig.fixHeight) {
+      maxHeight = sizeConfig.fixHeight;
+    }
+    if (sizeConfig && sizeConfig.maxHeight) {
+      maxHeight = sizeConfig.maxHeight;
+    }
+    if (maxHeight) {
+      maxHeight = Number(maxHeight + "");
+    }
+    Vue.onMounted(() => {
+      const resultData = pageHelperUtil.getChartDatasFromPage(props.pageContext, props.configure);
+      if (resultData) {
+        updateChartDatas(resultData);
+      } else {
+        if (props.configure.props.dataOrigin.dataSource === "variable") {
+          watchVariableDataChange();
+          const tmpTableData2 = pageHelperUtil.getValueFromVariable(props.pageContext.entity, props.configure.props.dataOrigin.variable);
+          if (tmpTableData2) {
+            loadTable(tmpTableData2, resultData);
+          }
+        }
+      }
+    });
+    function watchVariableDataChange() {
+      const match = props.configure.props.dataOrigin.variable.match(/\${(.*?)}/);
+      const path = match ? match[1].split(".") : [];
+      Vue.watch(
+        () => path.reduce((obj, key) => obj[key], props.pageContext.entity),
+        (newVal) => {
+          console.log("统计表格监听数据变量的变化 newVal：", newVal);
+          if (newVal) {
+            updateChartDatas(JSON.parse(JSON.stringify(newVal)));
+          } else {
+            tableData.value = [];
+            resetTableColumns();
+          }
+        }
+      );
+    }
+    function updateChartDatas(resultData) {
+      if (!resultData) {
+        resultData = [];
+      }
+      if (Array.isArray(resultData)) {
+        resultData = resultData.length > 0 ? resultData[0] : {};
+      }
+      if (!resultData) {
+        resultData = {};
+      }
+      if (resultData.hasRender) {
+        resultData.hasRender = true;
+        console.log("重复更新!", resultData);
+        return;
+      }
+      updateTable(resultData);
+      resultData.hasRender = true;
+      if (dataConfig) {
+        dataConfig.autoRefresh = false;
+      }
+    }
+    function updateTable(resultData) {
+      var _a2;
+      setCustomColumns(resultData);
+      if (props.configure.props.dataOrigin.dataSource === "service" && resultData.result) {
+        tmpTableData = resultData.result[props.configure.props.dataOrigin.service.serviceDataField];
+      } else if (props.configure.props.dataOrigin.dataSource === "variable") {
+        tmpTableData = pageHelperUtil.getValueFromVariable(props.pageContext.entity, props.configure.props.dataOrigin.variable);
+      }
+      if (tmpTableData) {
+        if (((_a2 = props.configure.props) == null ? void 0 : _a2.dataOrigin.limitEnable) && props.configure.props.dataOrigin.itemNumSource) {
+          let limitNum = 10;
+          if (props.configure.props.dataOrigin.itemNumSource === "fix") {
+            limitNum = props.configure.props.dataOrigin.itemNumFix;
+          } else if (props.configure.props.dataOrigin.itemNumSource === "variable") {
+            limitNum = Number(
+              pageHelperUtil.getValueFromVariable(props.pageContext.entity, props.configure.props.dataOrigin.itemNumVariable)
+            );
+            const match = props.configure.props.dataOrigin.itemNumVariable.match(/\${(.*?)}/);
+            const path = match ? match[1].split(".") : [];
+            const sourceData = JSON.parse(JSON.stringify(tmpTableData));
+            Vue.watch(
+              () => path.reduce((obj, key) => obj[key], props.pageContext.entity),
+              (newVal) => {
+                console.log("统计表格监听数据变量的变化 newVal：", newVal);
+                limitTableData(newVal, sourceData, resultData);
+              }
+            );
+          }
+          limitTableData(limitNum, tmpTableData, resultData);
+        } else {
+          loadTable(tmpTableData, resultData);
+        }
+      }
+    }
+    function limitTableData(limitNum, tmpTableData2, resultData) {
+      var _a2;
+      if (limitNum && limitNum < tmpTableData2.length) {
+        let limitCountColumns = [];
+        if (((_a2 = props.configure.props.dataOrigin.limitCountColumns) == null ? void 0 : _a2.length) > 0) {
+          limitCountColumns = props.configure.props.dataOrigin.limitCountColumns;
+        } else {
+          const numberColumns = tableColumnsConfig.value.filter((item) => item.props.base.dataType === "number");
+          numberColumns.forEach((item) => {
+            limitCountColumns.push(item.props.base.prop);
+          });
+        }
+        if ((limitCountColumns == null ? void 0 : limitCountColumns.length) > 0) {
+          const overItemData = tmpTableData2.slice(limitNum - 1, tmpTableData2.length);
+          const newItemData = {};
+          let overItemNameProp = tableColumnsConfig.value[0].props.base.prop;
+          if (overItemNameProp === "$index") {
+            overItemNameProp = tableColumnsConfig.value[1].props.base.prop;
+          }
+          overItemData.forEach((item) => {
+            limitCountColumns.forEach((col) => {
+              if (newItemData[col] === void 0) {
+                newItemData[col] = 0;
+              }
+              newItemData[col] = newItemData[col] + item[col];
+            });
+          });
+          if (tmpTableData2.length > limitNum) {
+            tmpTableData2 = tmpTableData2.slice(0, limitNum - 1);
+          }
+          newItemData[overItemNameProp] = props.configure.props.dataOrigin.overItemAlias;
+          tmpTableData2.push(newItemData);
+        }
+        loadTable(tmpTableData2, resultData);
+      } else {
+        loadTable(tmpTableData2, resultData);
+      }
+    }
+    function loadTable(tmpTableData2, resultData) {
+      var _a2, _b, _c, _d, _e, _f, _g;
+      if (enableTransition("rowToColumn")) {
+        tmpTableData2 = chartTableUtil.rowDataToColumn(tmpTableData2, props.configure, tableColumnsConfig.value);
+        if (!isEnableGroupHeader.value) {
+          const updatedColumnConfig = updateColumnConfig(props.configure, tableColumnsConfig.value, tmpTableData2);
+          tableColumnsConfig.value = updatedColumnConfig;
+        }
+      } else if (enableTransition("columnToRow")) {
+        if (!isEnableGroupHeader.value) {
+          tableColumnsConfig.value = chartTableUtil.getColumnToRowTableConfig(props.configure);
+        }
+        tmpTableData2 = chartTableUtil.colDataToRow(tmpTableData2, props.configure);
+      }
+      if ((_b = (_a2 = props.configure.props) == null ? void 0 : _a2.dataOrigin) == null ? void 0 : _b.dataFormatting) {
+        const func = eventUtil.getCustomFunc(props.pageContext, props.configure.props.dataOrigin.dataFormatting);
+        if (func) {
+          const resultValue = func.apply(func, [{ tableData: tmpTableData2 }]);
+          if (resultValue) {
+            tmpTableData2 = resultValue;
+          }
+        }
+      }
+      if (Object.keys(dataFormulaMapping.value).length > 0 && tmpTableData2 && tmpTableData2.length > 0) {
+        chartTableUtil.computeFormula(dataFormulaMapping.value, tmpTableData2, props.pageContext.entity);
+      }
+      if ((_c = props.configure.pageination) == null ? void 0 : _c.enable) {
+        tableDataPageination(resultData);
+      } else {
+        tableData.value = tmpTableData2;
+      }
+      if (((_e = (_d = props.configure.props) == null ? void 0 : _d.highOrder) == null ? void 0 : _e.groupField) && ((_g = (_f = props.configure.props) == null ? void 0 : _f.highOrder) == null ? void 0 : _g.groupField.length) > 0) {
+        const groupField = props.configure.props.highOrder.groupField;
+        tableData.value = groupAndAddTotals(tableData.value, groupField);
+      }
+      pushTableIndexColumn(tableColumnsConfig.value);
+    }
+    function enableTransition(type) {
+      return props.configure.props.dataOrigin.transition === type && // props.configure.props.dataOrigin.groupField &&
+      // props.configure.props.dataOrigin.groupField.length > 0 &&
+      props.configure.props.dataOrigin[type].titleColumns && props.configure.props.dataOrigin[type].titleColumns.length > 0 && props.configure.props.dataOrigin[type].dataColumns && props.configure.props.dataOrigin[type].dataColumns.length > 0;
+    }
+    function getHeaderCellStyle(data) {
+      const cellTitleStyle = columnStyleSourceConfig.value[data.column.property] ? columnStyleSourceConfig.value[data.column.property].titleStyle : null;
+      const rowTitleStyle = runtimeStyle == null ? void 0 : runtimeStyle.titleStyle;
+      return chartTableUtil.getHeaderCellStyleUtil(data, { cellTitleStyle, titleStyle: rowTitleStyle }, props);
+    }
+    function getRowStyle(data) {
+      return chartTableUtil.getRowStyleUtil(data, groupSummaryDataRowIndex, props);
+    }
+    function getCellStyle(data) {
+      const cellStyles = columnStyleSourceConfig.value[data.column.property] ? columnStyleSourceConfig.value[data.column.property].cellStyle : null;
+      return chartTableUtil.getCellStyleUtil(data, cellStyles, props);
+    }
+    const getSummaries = (param) => {
+      const { columns, data } = param;
+      const sums = [];
+      columns.forEach((column, index) => {
+        if (tableSummaryTitle.value[column.property]) {
+          const label = tableSummaryTitle.value[column.property].label;
+          sums[index] = Vue.h("div", {}, [chartTableUtil.replacePlaceholders(label, data)]);
+          return;
+        }
+        if (tableSummaryColumns.value[column.property]) {
+          const scientificData = data.filter((item, index2) => !groupSummaryDataRowIndex.includes(index2));
+          sums[index] = chartTableUtil.summaryStatistics(
+            tableSummaryColumns.value[column.property],
+            scientificData,
+            column.property,
+            props.pageContext
+          );
+        }
+      });
+      return sums;
+    };
+    function spanMethod({ row, column, rowIndex, columnIndex }) {
+      const property = column.property;
+      const highOrder = props.configure.props.highOrder;
+      if (highOrder.scopeFunc) {
+        const func = eventUtil.getCustomFunc(props.pageContext, highOrder.scopeFunc);
+        if (func) {
+          const resultValue = func.apply(func, [{ tableData: tableData.value, row, column, rowIndex, columnIndex }]);
+          if (resultValue) {
+            return resultValue;
+          }
+        }
+      } else {
+        if (highOrder && highOrder.mergeColumn) ;
+        if (highOrder && highOrder.mergeRow && highOrder.mergeRow.includes(property)) {
+          return chartTableUtil.mergeRowByProperty(row, column, rowIndex, property, tableData.value);
+        }
+      }
+    }
+    function updateColumnConfig(configure, columnConfigs, pivotedData) {
+      const columnFields = props.configure.props.dataOrigin.rowToColumn.titleColumns;
+      const valueFields = props.configure.props.dataOrigin.rowToColumn.dataColumns;
+      const groupByFields = configure.props.dataOrigin.groupField;
+      if ((!groupByFields || groupByFields.length === 0) && pivotedData.length > 0) {
+        const newConfig = [];
+        newConfig.push(
+          chartTableUtil.getNewColumnConfig("$GroupColumn", props.configure.props.dataOrigin.rowToColumn.firstColumnTitle, 0, "string")
+        );
+        Object.keys(pivotedData[0]).forEach((key, index) => {
+          if (key === "$GroupColumn") {
+            return;
+          }
+          const newConfigItem = chartTableUtil.getNewColumnConfig(key, key, index + 1, "string");
+          newConfig.push(newConfigItem);
+        });
+        return newConfig;
+      } else {
+        const updatedConfig = [...columnConfigs].filter(
+          (item) => !columnFields.includes(item.props.base.prop) && !valueFields.includes(item.props.base.prop)
+        );
+        const valueFieldsRegex = new RegExp(`(${valueFields.join("|")})$`);
+        const columnCombinations = /* @__PURE__ */ new Set();
+        pivotedData.forEach((record) => {
+          Object.keys(record).forEach((key) => {
+            if (valueFields.some((valueField) => key.includes(valueField))) {
+              const parts = key.split(valueFieldsRegex);
+              const combination = parts[0];
+              columnCombinations.add(combination);
+            }
+          });
+        });
+        columnCombinations.forEach((combination) => {
+          valueFields.forEach((valueField) => {
+            var _a2;
+            const name = (_a2 = tableColumnsConfig.value.find((item) => item.props.base.prop === valueField)) == null ? void 0 : _a2.props.base.name;
+            const newConfigItem = chartTableUtil.getNewColumnConfig(
+              `${combination}${valueField}`,
+              `${combination}${name}`,
+              updatedConfig.length + 1,
+              typeof pivotedData[0][`${combination}${valueField}`] === "number" ? "number" : "string"
+            );
+            updatedConfig.push(newConfigItem);
+          });
+        });
+        return updatedConfig;
+      }
+    }
+    function groupAndAddTotals(data, groupFields) {
+      var _a2, _b;
+      if (groupSummaryColumns.value.length === 0) {
+        return data;
+      }
+      const result = [];
+      const groupColumns = (_a2 = props.configure.items) == null ? void 0 : _a2.filter((item) => groupFields.includes(item.props.base.prop));
+      const summaryColumns = (_b = props.configure.items) == null ? void 0 : _b.filter((item) => item.props.base.groupSummary === true);
+      const groupedData = {};
+      data.forEach((item) => {
+        const key = groupFields.map((field) => item[field]).join("|");
+        if (!groupedData[key]) {
+          groupedData[key] = [];
+        }
+        groupedData[key].push(item);
+      });
+      const groupResult = Object.values(groupedData);
+      for (let i = 0; i < groupResult.length; i++) {
+        const group = groupResult[i];
+        const total2 = {};
+        summaryColumns == null ? void 0 : summaryColumns.forEach((column) => {
+          const prop = column.props.base.prop;
+          const res = chartTableUtil.summaryStatistics(groupSummaryColumns.value[prop], group, prop, props.pageContext);
+          total2[prop] = res;
+        });
+        result.push(...group);
+        groupColumns == null ? void 0 : groupColumns.forEach((column) => {
+          const prop = column.props.base.prop;
+          total2[prop] = chartTableUtil.replacePlaceholders(column.props.base.summaryTitle, group[0]);
+        });
+        result.push(total2);
+        groupSummaryDataRowIndex.push(result.length - 1);
+      }
+      return result;
+    }
+    function pushTableIndexColumn(tableColumnsConfig2) {
+      if (props.configure.props.base.showIndex && tableColumnsConfig2.findIndex((item) => item.props.base.prop === "$index") === -1) {
+        const indexColumn = chartTableUtil.getIndexColumn();
+        if (indexColumn) {
+          tableColumnsConfig2.unshift(indexColumn);
+        }
+      }
+    }
+    function tableDataPageination(resultData) {
+      if (props.configure.pageination.type === "frontend") {
+        total.value = tmpTableData.length;
+        frontendPageination(1, props.configure.pageination.pageSize);
+      } else if (props.configure.pageination.type === "backend") {
+        tableData.value = tmpTableData;
+        if (props.configure.pageination.totalFrom) {
+          total.value = resultData.result[props.configure.pageination.totalFrom];
+        }
+      }
+    }
+    function pageChange(currentPage, pageSize) {
+      if (props.configure.pageination.type === "frontend") {
+        frontendPageination(currentPage, pageSize);
+      } else {
+        backendPageination(currentPage, pageSize);
+      }
+    }
+    function pageSizeChange(currentPage, pageSize) {
+      if (props.configure.pageination.type === "frontend") {
+        frontendPageination(currentPage, pageSize);
+      } else {
+        backendPageination(currentPage, pageSize);
+      }
+    }
+    function frontendPageination(currentPage, pageSize) {
+      if (tmpTableData) {
+        tableData.value = tmpTableData.slice((currentPage - 1) * pageSize, currentPage * pageSize);
+      }
+    }
+    function backendPageination(currentPage, pageSize) {
+      if (props.configure.pageination.currentPageSet) {
+        pageHelperUtil.setValueForVariableName(props.pageContext.entity, props.configure.pageination.currentPageSet, currentPage);
+      }
+      if (props.configure.pageination.pageSizeSet) {
+        pageHelperUtil.setValueForVariableName(props.pageContext.entity, props.configure.pageination.pageSizeSet, pageSize);
+      }
+      pageHelperUtil.updateChartDatasourcesByComponent(props.pageContext, props.configure.uuid);
+    }
+    function calacShowColumn(column) {
+      const showCondition = column.showCondition;
+      return pageHelperUtil.caculateShowCondition(props.pageContext, showCondition);
+    }
+    function resetTableColumns() {
+      console.log("重置统计表格列配置");
+      if (!props.configure.props.modelCustom) {
+        if (!isEnableGroupHeader.value) {
+          tableColumnsConfig.value = props.configure.items;
+        } else {
+          groupColumnsConfig.value = props.configure.props.groupHeaders;
+        }
+      } else {
+        setCustomColumns(null);
+      }
+    }
+    function setCustomColumns(resultData) {
+      if (props.configure.props.modelCustom) {
+        const func = eventUtil.getCustomFunc(props.pageContext, props.configure.props.modelCustom);
+        if (func) {
+          const resultValue = func.apply(func, [
+            {
+              pageContext: props.pageContext,
+              configureObj: props.configure,
+              value: resultData
+            }
+          ]);
+          if (pageHelperUtil.isPromise(resultValue)) {
+            resultValue.then((res) => {
+              tableColumnsConfig.value = res.columns;
+            });
+          } else {
+            tableColumnsConfig.value = resultValue.columns;
+          }
+        }
+      }
+    }
+    function exportChart() {
+      let tableColumns = [];
+      let columns = [];
+      if (!isEnableGroupHeader.value) {
+        columns = visibleColumns.value;
+      } else {
+        columns = props.configure.props.groupHeaders;
+      }
+      let formatColumns = [];
+      pakcageExportColumn(columns, tableColumns, formatColumns);
+      const exportData = formatTableData(formatColumns);
+      return {
+        isTable: true,
+        dataArr: exportData,
+        columns: tableColumns
+      };
+    }
+    function pakcageExportColumn(columns, tableColumns, formatColumns) {
+      columns.forEach((col) => {
+        const propName = col.props.base.prop;
+        const label = col.props.base.name;
+        const i18nKey = label;
+        let tableCol = { name: propName, label, i18nKey };
+        if (col.children && col.children.length > 0) {
+          tableCol.children = [];
+          pakcageExportColumn(col.children, tableCol.children, formatColumns);
+        }
+        if (col.props.format && col.props.format.type) {
+          formatColumns.push(col);
+        }
+        tableColumns.push(tableCol);
+      });
+    }
+    function formatTableData(formatColumns) {
+      let exportTableData = [];
+      if (tableData.value) {
+        exportTableData = commonUtil.deepCopy(tableData.value);
+        exportTableData.forEach((row) => {
+          formatColumns.forEach((col) => {
+            const label = chartTableUtil.formatColContent(row, col.props.format, col, props.pageContext, props.configure);
+            row[col.props.base.prop] = label;
+          });
+        });
+      }
+      return exportTableData;
+    }
+    function pushIdnexColumnToGroupHeaders() {
+      if (props.configure.props.base.showIndex) {
+        groupColumnsConfig.value.unshift({
+          columnUuid: "$index",
+          displayOrder: 0,
+          isLeaf: true,
+          prop: "$index",
+          titleText: "序号",
+          uuid: "$index"
+        });
+        const indexColumn = chartTableUtil.getIndexColumn();
+        if (indexColumn) {
+          columnsConfigKeyValues.value["$index"] = indexColumn;
+        }
+      }
+    }
+    __expose({
+      updateChartDatas,
+      exportChart
+    });
+    return (_ctx, _cache) => {
+      const _component_el_table = Vue.resolveComponent("el-table");
+      return Vue.openBlock(), Vue.createElementBlock("div", {
+        style: Vue.normalizeStyle(Vue.unref(runtimeStyle)),
+        class: Vue.normalizeClass([Vue.unref(runtimeClass), "amb-widget-chart amb-widget-flex"]),
+        ref: "thisRef"
+      }, [
+        Vue.withDirectives(Vue.createVNode(commonChartHeader_vue_vue_type_script_setup_true_lang, {
+          ref_key: "headerRef",
+          ref: headerRef,
+          headerInfo: Vue.unref(headerInfo),
+          configure: __props.configure,
+          pageContext: __props.pageContext
+        }, null, 8, ["headerInfo", "configure", "pageContext"]), [
+          [Vue.vShow, Vue.unref(headerInfo).showHeader || __props.pageContext.showHomepageSearch]
+        ]),
+        Vue.createVNode(_component_el_table, {
+          ref_key: "gridRef",
+          ref: gridRef,
+          data: tableData.value,
+          style: { "width": "100%" },
+          "max-height": Vue.unref(maxHeight),
+          "header-cell-style": getHeaderCellStyle,
+          "row-style": getRowStyle,
+          "cell-style": getCellStyle,
+          "show-summary": showSummary.value,
+          stripe: __props.configure.props.base.stripe,
+          "summary-method": getSummaries,
+          "span-method": spanMethod
+        }, {
+          default: Vue.withCtx(() => [
+            isEnableGroupHeader.value ? (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, { key: 0 }, Vue.renderList(groupColumnsConfig.value, (item, index) => {
+              return Vue.openBlock(), Vue.createElementBlock(Vue.Fragment, { key: index }, [
+                !item.isLeaf ? (Vue.openBlock(), Vue.createBlock(groupColumn_vue_vue_type_script_setup_true_lang, {
+                  key: 0,
+                  configure: __props.configure,
+                  pageContext: __props.pageContext,
+                  groupColumn: item,
+                  columnsConfigKeyValues: columnsConfigKeyValues.value
+                }, null, 8, ["configure", "pageContext", "groupColumn", "columnsConfigKeyValues"])) : (Vue.openBlock(), Vue.createBlock(normalColumn_vue_vue_type_script_setup_true_lang, {
+                  key: 1,
+                  configure: __props.configure,
+                  pageContext: __props.pageContext,
+                  column: columnsConfigKeyValues.value[item.columnUuid]
+                }, null, 8, ["configure", "pageContext", "column"]))
+              ], 64);
+            }), 128)) : (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, { key: 1 }, Vue.renderList(visibleColumns.value, (column, index) => {
+              return Vue.openBlock(), Vue.createBlock(normalColumn_vue_vue_type_script_setup_true_lang, {
+                key: index,
+                column,
+                configure: __props.configure,
+                pageContext: __props.pageContext
+              }, null, 8, ["column", "configure", "pageContext"]);
+            }), 128))
+          ]),
+          _: 1
+        }, 8, ["data", "max-height", "show-summary", "stripe"]),
+        __props.configure.pageination && __props.configure.pageination.enable ? (Vue.openBlock(), Vue.createBlock(tablePageination_vue_vue_type_script_setup_true_lang, {
+          key: 0,
+          configure: __props.configure,
+          "table-data": tableData.value,
+          total: total.value,
+          onPageChange: pageChange,
+          onPageSizeChange: pageSizeChange
+        }, null, 8, ["configure", "table-data", "total"])) : Vue.createCommentVNode("", true)
+      ], 6);
+    };
+  }
+});
+module.exports = _sfc_main;

package/dist/lib/components/runtime/views/assemblys/common/export-form-report-dialog.vue.d.ts

@@ -0,0 +1,28 @@
+import { Component, PageContext } from '../../../utils/interfaces/page-design-types';
+
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    configure: {
+        type: () => Component;
+        required: true;
+    };
+    pageContext: {
+        type: () => PageContext;
+        required: true;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: (...args: any[]) => void;
+    export: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    configure: {
+        type: () => Component;
+        required: true;
+    };
+    pageContext: {
+        type: () => PageContext;
+        required: true;
+    };
+}>> & Readonly<{
+    onClose?: (...args: any[]) => any;
+    onExport?: (...args: any[]) => any;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;