cui-print 1.0.28

package/dist/print-designer-api/use-create-html/use-complex-table-helper/use-auto-height.js

@@ -0,0 +1,379 @@
+import { deepCopy, camelToKebab } from "../../print-designer-utils";
+import printDesignerStyleHelper from "../../print-designer-style-helper";
+import complexTableTools from "./complex-table-tools";
+import createTableHeader from "./create-table-header";
+export default ({ printData, printConfig, formConfig, layoutConfig, createHtmlByComponentItem, errorLogs } = {}) => {
+  const createComplexTableHtml = (complexTableDetails) => {
+    if (!complexTableDetails._continueConfig) {
+      return "";
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "auto_default") {
+      return _createHtml({ complexTableDetails });
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "auto_continuingContent") {
+      // 添加续打表格
+      return _createContinueContentHtml({ complexTableDetails });
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "auto_afterBlankRow") {
+      // 添加表格含空白内容
+      return _createHtmlHasBlankContent({ complexTableDetails });
+    }
+  };
+  function _createHtml({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="${_formatContentTrClass({
+        complexTableDetails,
+        rowData: tableData[rowIndex]
+      })}" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    let tableClassList = ["print-complex-table"];
+    if (!_isAutoHeightSpanCell({ complexTableDetails })) {
+      tableClassList.push("print-complex-table--auto-continue-not-span");
+    } else {
+      tableClassList.push("print-complex-table--auto-continue-span");
+    }
+    let tableClass = tableClassList.join(" ");
+    complexTableHtml = `<table class="${tableClass}" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    let isPaginationEnabled = complexTableDetails.props.isPaginationEnabled;
+    if (!!isPaginationEnabled) {
+      complexTableHtml += _getPaginationHtml({ complexTableDetails });
+    }
+    return complexTableHtml;
+  }
+  function _createContinueContentHtml({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    let continueConfig = complexTableDetails._continueConfig;
+    let perPageMaxRow = complexTableDetails.props.perPageMaxRow;
+    let hasEndTr = false;
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    //判断是否包含打印页的最后一行
+    if (tableData.length + continueConfig.continueBeforeRowCount == perPageMaxRow) {
+      hasEndTr = true;
+    }
+    for (let rowIndex = 0; rowIndex < continueConfig.continueBeforeRowCount; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getBlankContentCellHtml({ rowIndex, colIndex, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-blank-tr complex-table-blank-tr--before" blank-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContinueContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let trClass = _formatContentTrClass({
+        complexTableDetails,
+        rowData: tableData[rowIndex]
+      });
+      if (!!hasEndTr && rowIndex == tableData.length - 1) {
+        trClass += " complex-table-content-tr--page-end";
+      }
+      let rowHtml = `<tr class="${trClass}" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    let tableClassList = ["print-complex-table"];
+    if (!_isAutoHeightSpanCell({ complexTableDetails })) {
+      tableClassList.push("print-complex-table--auto-continue-not-span");
+      tableClassList.push("print-complex-table--auto-continue-not-span_continue-content");
+    } else {
+      tableClassList.push("print-complex-table--auto-continue-span");
+      tableClassList.push("print-complex-table--auto-continue-span_continue-content");
+    }
+    let tableClass = tableClassList.join(" ");
+    complexTableHtml = `<table class="${tableClass}" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    return complexTableHtml;
+  }
+  function _createHtmlHasBlankContent({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    let continueConfig = complexTableDetails._continueConfig;
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="${_formatContentTrClass({
+        complexTableDetails,
+        rowData: tableData[rowIndex]
+      })}" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < continueConfig.blankRowCount; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getBlankContentCellHtml({ rowIndex, colIndex, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-blank-tr complex-table-blank-tr--after" blank-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    let tableClassList = ["print-complex-table"];
+    if (!_isAutoHeightSpanCell({ complexTableDetails })) {
+      tableClassList.push("print-complex-table--auto-continue-not-span");
+    } else {
+      tableClassList.push("print-complex-table--auto-continue-span");
+    }
+    let tableClass = tableClassList.join(" ");
+    complexTableHtml = `<table class="${tableClass}" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    let isPaginationEnabled = complexTableDetails.props.isPaginationEnabled;
+    if (!!isPaginationEnabled) {
+      complexTableHtml += _getPaginationHtml({ complexTableDetails });
+    }
+    return complexTableHtml;
+  }
+  function _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    let rowData = tableData[rowIndex];
+    if (!!rowData._autoHeightMode_type && rowData._autoHeightMode_type == "excessBlankRow" && rowIndex > 0) {
+      // 超出的空白行
+      contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+        complexTablePropsConfig: propsConfig,
+        complexTableStyleConfig: styleConfig
+      })}"><div></div></td>`;
+      return contentCellHtml;
+    }
+    if (!!rowData._autoHeightMode_type && rowData._autoHeightMode_type == "excessBlankRow" && rowIndex === 0) {
+      // 超出的空白行 跨页
+      contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+        complexTablePropsConfig: propsConfig,
+        complexTableStyleConfig: styleConfig
+      })}"><div class="excess-td-container" style="${_createExcessBlankRowTdContainerStyle({
+        rowIndex,
+        colIndex,
+        tableData,
+        complexTableDetails
+      })}"><div  style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+        complexTablePropsConfig: propsConfig,
+        complexTableStyleConfig: styleConfig
+      })}${_createExcessBlankRowTdContainerContentStyle({
+        rowIndex,
+        colIndex,
+        tableData,
+        complexTableDetails
+      })}">${_createContentTdText({
+        rowIndex,
+        colIndex,
+        tableData,
+        complexTableDetails
+      })}</div></div></td>`;
+      return contentCellHtml;
+    }
+    // 其他情况
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}">${_createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails })}</div></td>`;
+    return contentCellHtml;
+  }
+  function _getContinueContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    let rowData = tableData[rowIndex];
+    if (!!rowData._autoHeightMode_type && rowData._autoHeightMode_type == "excessBlankRow") {
+      // 超出的空白行
+      contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+        complexTablePropsConfig: propsConfig,
+        complexTableStyleConfig: styleConfig
+      })}"><div></div></td>`;
+      return contentCellHtml;
+    }
+    // 其他情况
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}">${_createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails })}</div></td>`;
+    return contentCellHtml;
+  }
+  function _createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    if (!propsConfig.columnsField || !propsConfig.columnsField[colIndex]) {
+      return "";
+    }
+    if (!tableData[rowIndex]) {
+      return "";
+    }
+    let columnField = propsConfig.columnsField[colIndex].field;
+    let columnFieldList = columnField.split("&#");
+    let nowContentTdText = "";
+    columnFieldList.forEach((filed) => {
+      let columnItemText = tableData[rowIndex][filed];
+      if (!columnItemText && columnItemText !== 0) {
+        return;
+      }
+      columnItemText = `${columnItemText}`;
+      columnItemText = columnItemText
+        .replace(/[\s\n]+$/, "")
+        .replace(/ /g, "&nbsp;")
+        .replace(/\n/g, "<br>");
+      nowContentTdText += columnItemText;
+    });
+    return nowContentTdText;
+  }
+  function _getBlankContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"></div></td>`;
+    return contentCellHtml;
+  }
+  function _getPaginationHtml({ complexTableDetails } = {}) {
+    let paginationHtml = `<div class="print-complex-table_pagination">第${complexTableDetails._continueConfig.currentPage}页</div>`;
+    return paginationHtml;
+  }
+  function _createExcessBlankRowTdContainerStyle({ rowIndex, colIndex, tableData, complexTableDetails }) {
+    let propsConfig = complexTableDetails.props;
+    if (!propsConfig.columnsField || !propsConfig.columnsField[colIndex]) {
+      return "";
+    }
+    let nowRow = tableData[rowIndex];
+    if (!nowRow) {
+      return "";
+    }
+    let styleText = "";
+    let styleObj = {};
+    let containerHeight =
+      (nowRow._autoHeightMode_excessRowsLength - nowRow._autoHeightMode_excessIndex) * propsConfig.contentRowHeight;
+    styleObj.height = `${containerHeight}px`;
+    Object.keys(styleObj).forEach((key, index) => {
+      styleText += `${camelToKebab(key)}:${styleObj[key]};`;
+    });
+    return styleText;
+  }
+  function _createExcessBlankRowTdContainerContentStyle({ rowIndex, colIndex, tableData, complexTableDetails }) {
+    let propsConfig = complexTableDetails.props;
+    if (!propsConfig.columnsField || !propsConfig.columnsField[colIndex]) {
+      return "";
+    }
+    let nowRow = tableData[rowIndex];
+    if (!nowRow) {
+      return "";
+    }
+    let styleText = "";
+    let styleObj = {
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0
+    };
+    let topSpace = (nowRow._autoHeightMode_excessIndex + 1) * propsConfig.contentRowHeight;
+    styleObj.top = `-${topSpace}px`;
+    Object.keys(styleObj).forEach((key, index) => {
+      styleText += `${camelToKebab(key)}:${styleObj[key]};`;
+    });
+    return styleText;
+  }
+  function _isAutoHeightSpanCell({ complexTableDetails }) {
+    let propsConfig = complexTableDetails.props;
+    if (!printConfig) {
+      return false;
+    }
+    return !!propsConfig.autoHeightSpanCell;
+  }
+  function _formatContentTrClass({ complexTableDetails, rowData }) {
+    let classList = ["complex-table-content-tr"];
+    if (
+      !!rowData._autoHeightMode_type &&
+      rowData._autoHeightMode_type == "notExcess" &&
+      rowData._autoHeightMode_excessRowsLength >= 1
+    ) {
+      classList.push("complex-table-content-tr--excess-blank-begin");
+    } else if (
+      !!rowData._autoHeightMode_type &&
+      rowData._autoHeightMode_type == "excessBlankRow" &&
+      rowData._autoHeightMode_excessIndex == rowData._autoHeightMode_excessRowsLength - 1
+    ) {
+      classList.push("complex-table-content-tr--excess-blank-end");
+    } else if (!!rowData._autoHeightMode_type && rowData._autoHeightMode_type == "excessBlankRow") {
+      classList.push("complex-table-content-tr--excess-blank");
+    }
+    return classList.join(" ");
+  }
+  return {
+    createComplexTableHtml
+  };
+};

package/dist/print-designer-api/use-create-html/use-complex-table-helper/use-default.js

@@ -0,0 +1,75 @@
+import { deepCopy } from "../../print-designer-utils";
+import printDesignerStyleHelper from "../../print-designer-style-helper";
+import complexTableTools from "./complex-table-tools";
+import createTableHeader from "./create-table-header";
+export default ({ printData, printConfig, formConfig, layoutConfig, createHtmlByComponentItem, errorLogs } = {}) => {
+  const createComplexTableHtml = (complexTableDetails) => {
+    return _createHtml({ complexTableDetails });
+  };
+  function _createHtml({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-content-tr" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    complexTableHtml = `<table 
+      class="print-complex-table" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    return complexTableHtml;
+  }
+  function _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}">${_createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails })}</div></td>`;
+    return contentCellHtml;
+  }
+  function _createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    if (!propsConfig.columnsField || !propsConfig.columnsField[colIndex]) {
+      return "";
+    }
+    let columnField = propsConfig.columnsField[colIndex].field;
+    if (!tableData[rowIndex]) {
+      return "";
+    }
+    let nowContentTdText = tableData[rowIndex][columnField];
+    if (!!nowContentTdText || nowContentTdText === 0) {
+      return nowContentTdText;
+    }
+    return "";
+  }
+  return {
+    createComplexTableHtml
+  };
+};

package/dist/print-designer-api/use-create-html/use-complex-table-helper/use-fixed-height.js

@@ -0,0 +1,220 @@
+import { deepCopy } from "../../print-designer-utils";
+import printDesignerStyleHelper from "../../print-designer-style-helper";
+import complexTableTools from "./complex-table-tools";
+import createTableHeader from "./create-table-header";
+export default ({ printData, printConfig, formConfig, layoutConfig, createHtmlByComponentItem, errorLogs } = {}) => {
+  const createComplexTableHtml = (complexTableDetails) => {
+    if (!complexTableDetails._continueConfig) {
+      return "";
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "fixed_default") {
+      return _createHtml({ complexTableDetails });
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "fixed_continuingContent") {
+      // 添加续打表格
+      return _createContinueContentHtml({ complexTableDetails });
+    }
+    if (!!complexTableDetails._continueConfig && complexTableDetails._continueConfig.type == "fixed_afterBlankRow") {
+      // 添加表格含空白内容
+      return _createHtmlHasBlankContent({ complexTableDetails });
+    }
+  };
+  function _createHtml({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-content-tr" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    complexTableHtml = `<table 
+      class="print-complex-table print-complex-table--fixed-continue" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    let isPaginationEnabled = complexTableDetails.props.isPaginationEnabled;
+    if (!!isPaginationEnabled) {
+      complexTableHtml += _getPaginationHtml({ complexTableDetails });
+    }
+    return complexTableHtml;
+  }
+  function _createContinueContentHtml({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    let continueConfig = complexTableDetails._continueConfig;
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < continueConfig.continueBeforeRowCount; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getBlankContentCellHtml({ rowIndex, colIndex, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-blank-tr complex-table-blank-tr--before" blank-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContinueContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-content-tr" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    complexTableHtml = `<table 
+      class="print-complex-table print-complex-table--fixed-continue print-complex-table--fixed-continue_continue-content" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    return complexTableHtml;
+  }
+  function _createHtmlHasBlankContent({ complexTableDetails } = {}) {
+    let complexTableHtml = "";
+    let { spanHeaderCellDict, spanHeaderCellList } = complexTableTools.createHeaderSpanDetails({ complexTableDetails });
+    let headerRowLength = complexTableDetails.props.headerRow;
+    let colLength = complexTableDetails.props.col;
+    let tableData = complexTableTools.getTableData({ complexTableDetails, printData });
+    let continueConfig = complexTableDetails._continueConfig;
+    for (let rowIndex = 0; rowIndex < headerRowLength; rowIndex++) {
+      let headerCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = createTableHeader.getHeaderCellHtml({ rowIndex, colIndex, spanHeaderCellList, complexTableDetails });
+        headerCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-header-tr" header-index="${rowIndex}">${headerCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < tableData.length; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-content-tr" content-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    for (let rowIndex = 0; rowIndex < continueConfig.blankRowCount; rowIndex++) {
+      let contentCellHtml = ``;
+      for (let colIndex = 0; colIndex < colLength; colIndex++) {
+        let nowCellHtml = _getBlankContentCellHtml({ rowIndex, colIndex, complexTableDetails });
+        contentCellHtml += nowCellHtml;
+      }
+      let rowHtml = `<tr class="complex-table-blank-tr complex-table-blank-tr--after" blank-index="${rowIndex}">${contentCellHtml}</tr>`;
+      complexTableHtml += rowHtml;
+    }
+    complexTableHtml = `<table 
+      class="print-complex-table print-complex-table--fixed-continue" 
+      style="${printDesignerStyleHelper.createComplexTableStyle({
+        propsConfig: complexTableDetails.props,
+        styleConfig: complexTableDetails.style
+      })}" 
+      cellspacing="0" 
+      cellpadding="0">${complexTableHtml}
+    </table>`;
+    let isPaginationEnabled = complexTableDetails.props.isPaginationEnabled;
+    if (!!isPaginationEnabled) {
+      complexTableHtml += _getPaginationHtml({ complexTableDetails });
+    }
+    return complexTableHtml;
+  }
+  function _getContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}">${_createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails })}</div></td>`;
+    return contentCellHtml;
+  }
+  function _getContinueContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let headerRules = complexTableDetails.headerRules;
+    let contentCellHtml = "";
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig,
+      complexTableHeaderRules: headerRules,
+      rowIndex,
+      colIndex
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}">${_createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails })}</div></td>`;
+    return contentCellHtml;
+  }
+  function _createContentTdText({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    if (!propsConfig.columnsField || !propsConfig.columnsField[colIndex]) {
+      return "";
+    }
+    let columnField = propsConfig.columnsField[colIndex].field;
+    if (!tableData[rowIndex]) {
+      return "";
+    }
+    let nowContentTdText = tableData[rowIndex][columnField];
+    if (!!nowContentTdText || nowContentTdText === 0) {
+      return nowContentTdText;
+    }
+    return "";
+  }
+  function _getBlankContentCellHtml({ rowIndex, colIndex, tableData, complexTableDetails } = {}) {
+    let propsConfig = complexTableDetails.props;
+    let styleConfig = complexTableDetails.style;
+    let contentCellHtml = "";
+    contentCellHtml = `<td style="${printDesignerStyleHelper.createComplexTableContentTdStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"><div style="${printDesignerStyleHelper.createComplexTableContentTdContainerStyle({
+      complexTablePropsConfig: propsConfig,
+      complexTableStyleConfig: styleConfig
+    })}"></div></td>`;
+    return contentCellHtml;
+  }
+  function _getPaginationHtml({ complexTableDetails } = {}) {
+    let paginationHtml = `<div class="print-complex-table_pagination">第${complexTableDetails._continueConfig.currentPage}页</div>`;
+    return paginationHtml;
+  }
+  return {
+    createComplexTableHtml
+  };
+};