zartui 2.0.80-beta.2 → 2.0.81

package/lib/zart.js

@@ -29376,18 +29376,23 @@ var tabbar_item_createNamespace = Object(utils["b" /* createNamespace */])('tabb
     })])]);
   }
 }));
+// CONCATENATED MODULE: ./es/table/type.js
+var SortOrderEnum;
+
+(function (SortOrderEnum) {
+  SortOrderEnum["ASCEND"] = "ascend";
+  SortOrderEnum["DESCEND"] = "descend";
+})(SortOrderEnum || (SortOrderEnum = {}));
 // CONCATENATED MODULE: ./es/table/index.js
 
 
 
+
+
 var table_createNamespace = Object(utils["b" /* createNamespace */])('table'),
     table_createComponent = table_createNamespace[0],
     table_bem = table_createNamespace[1];
 
-var defaultData = function defaultData() {
-  return {};
-};
-
 /* harmony default export */ var table = (table_createComponent({
   props: {
     headList: {
@@ -29398,269 +29403,199 @@ var defaultData = function defaultData() {
       type: Array,
       default: []
     },
-    outline: {
+    bordered: {
       type: Boolean,
       default: true
     },
-    headColor: {
-      type: String,
-      default: "#000"
-    },
-    headBackground: {
-      type: String,
-      default: "#fafafa"
-    },
-    dataColor: {
-      type: String,
-      default: "#000"
-    },
-    dataBackground: {
-      type: String,
-      default: "#fff"
-    },
-    hideTableHead: {
+    striped: {
       type: Boolean,
       default: false
     }
   },
   data: function data() {
-    return defaultData();
+    return {
+      pingedLeft: false,
+      sortOrder: '',
+      sortKey: ''
+    };
   },
   computed: {
-    fixedColumnLeft: function fixedColumnLeft() {
+    fixedColumn: function fixedColumn() {
       return this.headList.filter(function (v) {
-        return v.fixedLeft;
+        return v.fixed;
       });
     },
-    fixedColumnRight: function fixedColumnRight() {
-      return this.headList.filter(function (v) {
-        return v.fixedRight;
-      });
+    fixed: function fixed() {
+      return this.fixedColumn.length > 0;
     },
-    resortHeadList: function resortHeadList() {
-      // 对表头数组重新排序，需要固定的表头向左对齐
-      return this.fixedColumnLeft.concat(this.headList.filter(function (v) {
-        return !v.fixedLeft && !v.fixedRight;
-      })).concat(this.fixedColumnRight);
-    },
-    hasSummary: function hasSummary() {
-      return this.headList.filter(function (v) {
-        return v.showSummary;
-      }).length > 0;
-    }
-  },
-  mounted: function mounted() {
-    var columnTotalWidth = 0;
-    this.headList.forEach(function (v, i) {
-      var dom = document.getElementById("tableHead" + i);
-
-      if (dom) {
-        columnTotalWidth += dom.clientWidth || 0;
-      }
-    });
-    var box = document.getElementById("normalBoxID");
-    var boxWidth = 0;
-
-    if (box) {
-      boxWidth = box.clientWidth;
-    }
-
-    if (this.fixedColumnLeft && this.fixedColumnLeft.length || this.fixedColumnRight && this.fixedColumnRight.length) {
-      // 当表格横向出现滚动时，给固定列加一个box-shadow
-      var fixedBoxRight = document.getElementById("fixedRightBoxID");
-
-      if (fixedBoxRight && columnTotalWidth > boxWidth) {
-        fixedBoxRight.classList.add("shadow");
-      }
-
-      if (box) {
-        box.addEventListener("scroll", function (e) {
-          var fixedBoxLeft = document.getElementById("fixedLeftBoxID");
-
-          if (fixedBoxLeft) {
-            if (e && e.target && e.target.scrollLeft > 0) {
-              fixedBoxLeft.classList.add("shadow");
-            } else {
-              fixedBoxLeft.classList.remove("shadow");
-            }
-          }
-
-          if (fixedBoxRight) {
-            if (e && e.target && e.target.scrollLeft + e.target.clientWidth >= columnTotalWidth - 1) {
-              fixedBoxRight.classList.remove("shadow");
-            } else {
-              fixedBoxRight.classList.add("shadow");
-            }
-          }
-        });
-      }
-    } // 获取需固定列的实际宽度，用于设置绝对定位元素的宽度
-
-
-    var fixedLeftIndexList = this.headList.map(function (v, i) {
-      if (v.fixedLeft) {
-        return "tableHead" + i;
-      } else {
-        return "";
-      }
-    }).filter(function (v) {
-      return v !== "";
-    });
+    formatColumns: function formatColumns() {
+      var _this = this;
 
-    if (fixedLeftIndexList.length > 0) {
-      fixedLeftIndexList.forEach(function (current, index) {
-        var fixedDom = document.getElementById("fixedHeadLeft" + index);
-        var normalDom = document.getElementById(current);
+      var columns = [];
+      var left = 0;
+      this.headList.forEach(function (element, index) {
+        var column = {};
+        var preColumn = _this.headList[index - 1];
+        var nextColumn = _this.headList[index + 1];
 
-        if (fixedDom && normalDom) {
-          fixedDom.style.width = normalDom.offsetWidth + "px";
+        if (element.sorter && element.defaultSortOrder) {
+          _this.sortOrder = element.defaultSortOrder || '';
+          _this.sortKey = element.key;
         }
-      }, 0);
-    } // 获取需固定列的实际宽度，用于设置绝对定位元素的宽度
-
 
-    var fixedRightIndexList = this.headList.map(function (v, i) {
-      if (v.fixedRight) {
-        return "tableHead" + i;
-      } else {
-        return "";
-      }
-    }).filter(function (v) {
-      return v !== "";
-    });
-
-    if (fixedRightIndexList.length > 0) {
-      fixedRightIndexList.forEach(function (current, index) {
-        var fixedDom = document.getElementById("fixedHeadRight" + index);
-        var normalDom = document.getElementById(current);
-
-        if (fixedDom && normalDom) {
-          fixedDom.style.width = normalDom.offsetWidth + "px";
+        if (preColumn) {
+          left += Number(preColumn.width.split('px')[0]);
+          column.left = left + "px";
+        } else {
+          column.left = 0;
         }
-      }, 0); // 当存在右侧固定列，且列宽度不足以撑满容器时，将最后一列宽度拉长到填满
 
-      if (columnTotalWidth < boxWidth) {
-        var lastColumn = document.getElementById("tableHead" + (this.headList.length - 1));
-
-        if (lastColumn) {
-          lastColumn.classList.add("widen");
-          lastColumn.style.width = "unset";
-          lastColumn.style.flex = "1";
+        if (element.fixed && !nextColumn.fixed) {
+          column.lastFixLeft = true;
         }
-      }
+
+        columns.push(_extends({}, element, column));
+      });
+      return columns;
     }
   },
-  watch: {},
   methods: {
-    genColumn: function genColumn(headObj, index, isFixed) {
-      var h = this.$createElement;
-
-      var _ref = this,
-          slots = _ref.slots,
-          hideTableHead = _ref.hideTableHead;
-
-      var headItemStyle = {
-        color: this.headColor,
-        background: this.headBackground
-      };
-      var dataStyle = {
-        color: this.dataColor,
-        background: this.dataBackground
-      };
-      var idName = "tableHead" + index;
-
-      if (isFixed === "left") {
-        idName = "fixedHeadLeft" + index;
+    onScroll: function onScroll(_ref) {
+      var currentTarget = _ref.currentTarget,
+          scrollLeft = _ref.scrollLeft;
+      var mergedScrollLeft = typeof scrollLeft === 'number' ? scrollLeft : currentTarget.scrollLeft;
+      this.pingedLeft = mergedScrollLeft > 0;
+    },
+    getNextSortOrder: function getNextSortOrder(type) {
+      if (!type) {
+        return SortOrderEnum.ASCEND;
       }
 
-      if (isFixed === "right") {
-        idName = "fixedHeadRight" + index;
+      if (type === SortOrderEnum.ASCEND) {
+        return SortOrderEnum.DESCEND;
       }
 
-      var headRender = slots("head" + headObj.id) || headObj.label;
+      return '';
+    },
+    onHeaderClick: function onHeaderClick(data) {
+      if (!data.sorter) return;
+      this.sortOrder = this.getNextSortOrder(data.key === this.sortKey ? this.sortOrder : '');
+      this.sortKey = data.key;
+      this.$emit('sort', {
+        order: this.sortOrder,
+        key: data.key
+      });
+    },
+    getHead: function getHead(colData) {
+      var _this2 = this;
+
+      var h = this.$createElement;
 
-      if ((headObj.fixedLeft || headObj.fixedRight) && !isFixed) {
-        // 被固定列遮住的列不显示内容
-        headRender = "";
+      if ((colData == null ? void 0 : colData.colSpan) !== 0) {
+        return h("th", {
+          "class": table_bem({
+            'fix-left': colData.fixed,
+            'left-last': colData.lastFixLeft && this.pingedLeft
+          }),
+          "style": {
+            left: colData.fixed ? colData.left : ''
+          },
+          "attrs": {
+            "colspan": (colData == null ? void 0 : colData.colSpan) !== 1 ? colData == null ? void 0 : colData.colSpan : null
+          }
+        }, [h("div", {
+          "class": table_bem('head'),
+          "on": {
+            "click": function click() {
+              return _this2.onHeaderClick(colData);
+            }
+          }
+        }, [h("span", [colData.label]), colData.sorter ? h("span", {
+          "class": table_bem('head-sort')
+        }, [h(es_icon, {
+          "class": [colData.key === this.sortKey && this.sortOrder === SortOrderEnum.ASCEND ? table_bem('sort-active') : ''],
+          "attrs": {
+            "name": "spinner-shrink",
+            "size": "12"
+          },
+          "style": {
+            marginBottom: '-3px'
+          }
+        }), h(es_icon, {
+          "class": [colData.key === this.sortKey && this.sortOrder === SortOrderEnum.DESCEND ? table_bem('sort-active') : ''],
+          "attrs": {
+            "name": "spinner-expand",
+            "size": "12"
+          },
+          "style": {
+            marginTop: '-3px'
+          }
+        })]) : ''])]);
       }
+    },
+    onClick: function onClick() {},
+    getBody: function getBody(rowData, rowIndex) {
+      var _this3 = this;
 
-      return h("div", {
-        "class": [table_bem(isFixed ? "fixed-head" : "head"), isFixed ? BORDER_SURROUND : BORDER_RIGHT],
-        "attrs": {
-          "id": idName
-        },
-        "style": isFixed ? "" : headObj.width ? "width:" + headObj.width + ";" : ""
-      }, [h("div", {
-        "directives": [{
-          name: "show",
-          value: !hideTableHead
-        }],
-        "class": [table_bem("head-item"), BORDER_TOP_BOTTOM],
-        "style": headItemStyle
-      }, [headRender]), this.dataList.map(function (data) {
-        var hide = (headObj.fixedLeft || headObj.fixedRight) && !isFixed;
+      var h = this.$createElement;
+      return h("tr", [this.formatColumns.map(function (colData) {
+        var _additionalCellProps, _additionalCellProps2, _additionalCellProps3, _additionalCellProps4, _additionalCellProps5, _additionalCellProps6;
 
-        if (hide) {
-          // 被固定列遮住的列不显示内容
-          return h("div", {
-            "class": [table_bem("table-data"), BORDER_BOTTOM],
-            "style": dataStyle
-          });
-        } else if (data[headObj.key] && data[headObj.key].id && slots("data" + data[headObj.key].id)) {
-          return slots("data" + data[headObj.key].id);
-        } else {
-          return h("div", {
-            "class": [table_bem("table-data"), BORDER_BOTTOM],
-            "style": dataStyle
-          }, [data[headObj.key]]);
+        var additionalCellProps;
+
+        if (colData.customCell) {
+          additionalCellProps = colData.customCell(rowData, rowIndex);
         }
-      }), this.hasSummary ? headObj.showSummary ? h("div", {
-        "class": [table_bem("head-item"), BORDER_BOTTOM],
-        "style": headItemStyle
-      }, [this.dataList.reduce(function (prev, curr) {
-        return prev + curr[headObj.key];
-      }, 0)]) : h("div", {
-        "class": [table_bem("head-item"), BORDER_BOTTOM],
-        "style": headItemStyle
-      }, [headObj.summaryLabel || ""]) : ""]);
+
+        var style = _extends({}, colData.style);
+
+        style.left = colData.fixed ? colData.left : '';
+        return ((_additionalCellProps = additionalCellProps) == null ? void 0 : _additionalCellProps.rowSpan) !== 0 && ((_additionalCellProps2 = additionalCellProps) == null ? void 0 : _additionalCellProps2.colSpan) !== 0 && h("td", {
+          "on": {
+            "click": function click() {
+              return colData.onClick && colData.onClick(rowData, rowIndex);
+            }
+          },
+          "class": table_bem({
+            'fix-left': colData.fixed,
+            'left-last': colData.lastFixLeft && _this3.pingedLeft
+          }),
+          "attrs": {
+            "colspan": ((_additionalCellProps3 = additionalCellProps) == null ? void 0 : _additionalCellProps3.colSpan) !== 1 ? (_additionalCellProps4 = additionalCellProps) == null ? void 0 : _additionalCellProps4.colSpan : null,
+            "rowspan": ((_additionalCellProps5 = additionalCellProps) == null ? void 0 : _additionalCellProps5.rowSpan) !== 1 ? (_additionalCellProps6 = additionalCellProps) == null ? void 0 : _additionalCellProps6.rowSpan : null
+          },
+          "style": style
+        }, [rowData[colData.key]]);
+      })]);
     }
   },
   render: function render(h) {
-    var _this = this;
+    var _this4 = this;
 
-    var showFixed = this.dataList && this.dataList.length;
     return h("div", {
-      "class": table_bem(["", this.outline ? "" : "no-border"])
-    }, [h("div", {
-      "attrs": {
-        "id": "normalBoxID"
-      },
-      "class": [table_bem("normal-box"), BORDER_LEFT]
-    }, [this.resortHeadList.map(function (x, i) {
-      return _this.genColumn(x, i);
-    })]), h("div", {
-      "directives": [{
-        name: "show",
-        value: showFixed
-      }],
-      "attrs": {
-        "id": "fixedLeftBoxID"
-      },
-      "class": table_bem("fixed-left-box")
-    }, [this.fixedColumnLeft.map(function (x, i) {
-      return _this.genColumn(x, i, "left");
-    })]), h("div", {
-      "directives": [{
-        name: "show",
-        value: showFixed
-      }],
-      "attrs": {
-        "id": "fixedRightBoxID"
-      },
-      "class": table_bem("fixed-right-box")
-    }, [this.fixedColumnRight.map(function (x, i) {
-      return _this.genColumn(x, i, "right");
-    })])]);
+      "class": table_bem({
+        fixed: this.fixed,
+        bordered: this.bordered,
+        striped: this.striped
+      }),
+      "on": {
+        "scroll": this.onScroll
+      }
+    }, [h("table", [h("colgroup", [this.headList.map(function (item) {
+      return h("col", {
+        "style": {
+          width: item.width
+        }
+      });
+    })]), h("thead", {
+      "class": table_bem('thead')
+    }, [h("tr", [this.formatColumns.map(function (colData) {
+      return _this4.getHead(colData);
+    })])]), h("tbody", {
+      "class": table_bem('tbody')
+    }, [this.dataList.map(function (rowData, rowIndex) {
+      return _this4.getBody(rowData, rowIndex);
+    })])])]);
   }
 }));
 // CONCATENATED MODULE: ./es/tag/index.js
@@ -29754,7 +29689,7 @@ var timeline_createNamespace = Object(utils["b" /* createNamespace */])('timelin
     timeline_createComponent = timeline_createNamespace[0],
     timeline_bem = timeline_createNamespace[1];
 
-var timeline_defaultData = function defaultData() {
+var defaultData = function defaultData() {
   return {
     isFold: false,
     computedProcesses: []
@@ -29805,7 +29740,7 @@ var timeline_defaultData = function defaultData() {
     }
   },
   data: function data() {
-    return timeline_defaultData();
+    return defaultData();
   },
   computed: {},
   watch: {
@@ -30780,7 +30715,7 @@ var uploader_createNamespace = Object(utils["b" /* createNamespace */])('uploade
 
 
 
-var version = '2.0.80-beta.2';
+var version = '2.0.81';
 
 function install(Vue) {
   var components = [action_sheet, es_area, avatar, back_top, badge, es_button, calendar, cascader, cell, cell_group, es_checkbox, checkbox_group, col, collapse, collapse_item, count_down, datetime_picker, dialog, divider, dropdown_item, dropdown_menu, empty, es_field, fold_dialog, es_form, grid, grid_item, hierarchy_select, es_icon, es_image, image_preview, index_anchor, index_bar, es_info, lazyload, es_list, es_loading, locale["a" /* default */], media_picker, media_player, multiple_picker, nav_bar, notice_bar, number_keyboard, es_overlay, password_input, es_picker, popover, popup, pull_refresh, es_radio, radio_group, rate, row, search, signature, skeleton, slider, es_step, stepper, es_steps, es_sticky, swipe, swipe_cell, swipe_item, es_switch, switch_cell, tab, tabbar, tabbar_item, table, tabs, es_tag, timeline, es_toast, uploader];