zartui 2.0.81 → 2.0.82

package/lib/index.js

@@ -298,6 +298,10 @@ var _tag = _interopRequireDefault(require("./tag"));
 
 exports.Tag = _tag.default;
 
+var _textEllipsis = _interopRequireDefault(require("./text-ellipsis"));
+
+exports.TextEllipsis = _textEllipsis.default;
+
 var _timeline = _interopRequireDefault(require("./timeline"));
 
 exports.Timeline = _timeline.default;
@@ -309,11 +313,11 @@ exports.Toast = _toast.default;
 var _uploader = _interopRequireDefault(require("./uploader"));
 
 exports.Uploader = _uploader.default;
-var version = '2.0.81';
+var version = '2.0.82';
 exports.version = version;
 
 function install(Vue) {
-  var components = [_actionSheet.default, _area.default, _avatar.default, _backTop.default, _badge.default, _button.default, _calendar.default, _cascader.default, _cell.default, _cellGroup.default, _checkbox.default, _checkboxGroup.default, _col.default, _collapse.default, _collapseItem.default, _countDown.default, _datetimePicker.default, _dialog.default, _divider.default, _dropdownItem.default, _dropdownMenu.default, _empty.default, _field.default, _foldDialog.default, _form.default, _grid.default, _gridItem.default, _hierarchySelect.default, _icon.default, _image.default, _imagePreview.default, _indexAnchor.default, _indexBar.default, _info.default, _lazyload.default, _list.default, _loading.default, _locale.default, _mediaPicker.default, _mediaPlayer.default, _multiplePicker.default, _navBar.default, _noticeBar.default, _numberKeyboard.default, _overlay.default, _passwordInput.default, _picker.default, _popover.default, _popup.default, _pullRefresh.default, _radio.default, _radioGroup.default, _rate.default, _row.default, _search.default, _signature.default, _skeleton.default, _slider.default, _step.default, _stepper.default, _steps.default, _sticky.default, _swipe.default, _swipeCell.default, _swipeItem.default, _switch.default, _switchCell.default, _tab.default, _tabbar.default, _tabbarItem.default, _table.default, _tabs.default, _tag.default, _timeline.default, _toast.default, _uploader.default];
+  var components = [_actionSheet.default, _area.default, _avatar.default, _backTop.default, _badge.default, _button.default, _calendar.default, _cascader.default, _cell.default, _cellGroup.default, _checkbox.default, _checkboxGroup.default, _col.default, _collapse.default, _collapseItem.default, _countDown.default, _datetimePicker.default, _dialog.default, _divider.default, _dropdownItem.default, _dropdownMenu.default, _empty.default, _field.default, _foldDialog.default, _form.default, _grid.default, _gridItem.default, _hierarchySelect.default, _icon.default, _image.default, _imagePreview.default, _indexAnchor.default, _indexBar.default, _info.default, _lazyload.default, _list.default, _loading.default, _locale.default, _mediaPicker.default, _mediaPlayer.default, _multiplePicker.default, _navBar.default, _noticeBar.default, _numberKeyboard.default, _overlay.default, _passwordInput.default, _picker.default, _popover.default, _popup.default, _pullRefresh.default, _radio.default, _radioGroup.default, _rate.default, _row.default, _search.default, _signature.default, _skeleton.default, _slider.default, _step.default, _stepper.default, _steps.default, _sticky.default, _swipe.default, _swipeCell.default, _swipeItem.default, _switch.default, _switchCell.default, _tab.default, _tabbar.default, _tabbarItem.default, _table.default, _tabs.default, _tag.default, _textEllipsis.default, _timeline.default, _toast.default, _uploader.default];
   components.forEach(function (item) {
     if (item.install) {
       Vue.use(item);

package/lib/index.less

@@ -3,7 +3,6 @@
 @import "./info/index.less";
 @import "./icon/index.less";
 @import "./tag/index.less";
-@import "./table/index.less";
 @import "./tabbar-item/index.less";
 @import "./step/index.less";
 @import "./rate/index.less";
@@ -28,6 +27,8 @@
 @import "./signature/index.less";
 @import "./multiple-picker/index.less";
 @import "./dialog/index.less";
+@import "./text-ellipsis/index.less";
+@import "./table/index.less";
 @import "./calendar/index.less";
 @import "./picker/index.less";
 @import "./action-sheet/index.less";

package/lib/table/index.js

@@ -11,6 +11,8 @@ var _utils = require("../utils");
 
 var _index = _interopRequireDefault(require("../icon/index"));
 
+var _index2 = _interopRequireDefault(require("../text-ellipsis/index"));
+
 var _type = require("./type");
 
 var _createNamespace = (0, _utils.createNamespace)('table'),
@@ -134,7 +136,12 @@ var _default = createComponent({
               return _this2.onHeaderClick(colData);
             }
           }
-        }, [h("span", [colData.label]), colData.sorter ? h("span", {
+        }, [colData.ellipsis ? h(_index2.default, {
+          "attrs": {
+            "content": colData.label,
+            "expandType": "dialog"
+          }
+        }) : colData.label, colData.sorter ? h("span", {
           "class": bem('head-sort')
         }, [h(_index.default, {
           "class": [colData.key === this.sortKey && this.sortOrder === _type.SortOrderEnum.ASCEND ? bem('sort-active') : ''],
@@ -188,7 +195,12 @@ var _default = createComponent({
             "rowspan": ((_additionalCellProps5 = additionalCellProps) == null ? void 0 : _additionalCellProps5.rowSpan) !== 1 ? (_additionalCellProps6 = additionalCellProps) == null ? void 0 : _additionalCellProps6.rowSpan : null
           },
           "style": style
-        }, [rowData[colData.key]]);
+        }, [colData.ellipsis ? h(_index2.default, {
+          "attrs": {
+            "content": rowData[colData.key],
+            "expandType": "dialog"
+          }
+        }) : rowData[colData.key]]);
       })]);
     }
   },

package/lib/table/style/index.js

@@ -1,4 +1,10 @@
 require('../../style/base.css');
+require('../../overlay/index.css');
 require('../../info/index.css');
 require('../../icon/index.css');
+require('../../popup/index.css');
+require('../../loading/index.css');
+require('../../button/index.css');
+require('../../dialog/index.css');
+require('../../text-ellipsis/index.css');
 require('../index.css');

package/lib/table/style/less.js

@@ -1,4 +1,10 @@
 require('../../style/base.less');
+require('../../overlay/index.less');
 require('../../info/index.less');
 require('../../icon/index.less');
+require('../../popup/index.less');
+require('../../loading/index.less');
+require('../../button/index.less');
+require('../../dialog/index.less');
+require('../../text-ellipsis/index.less');
 require('../index.less');

package/lib/text-ellipsis/index.css

@@ -0,0 +1 @@
+.zt2-text-ellipsis{width:100%;line-height:calc(200% - 8px);white-space:pre-wrap;word-break:break-all}.zt2-text-ellipsis__action{cursor:pointer;color:#0091fa}

package/lib/text-ellipsis/index.js

@@ -0,0 +1,223 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _utils = require("../utils");
+
+var _index = _interopRequireDefault(require("../dialog/index"));
+
+var _createNamespace = (0, _utils.createNamespace)('text-ellipsis'),
+    createComponent = _createNamespace[0],
+    bem = _createNamespace[1];
+
+var _default = createComponent({
+  props: {
+    rows: {
+      type: Number,
+      default: 1
+    },
+    dots: {
+      type: String,
+      default: '...'
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+    expandText: {
+      type: String,
+      default: '展开'
+    },
+    expandType: {
+      type: String,
+      default: 'flat'
+    },
+    collapseText: {
+      type: String,
+      default: '收起'
+    },
+    position: {
+      type: String,
+      default: 'end'
+    }
+  },
+  data: function data() {
+    return {
+      expanded: false,
+      ellipsis: false,
+      text: ''
+    };
+  },
+  computed: {
+    actionText: function actionText() {
+      return this.expanded ? this.collapseText : this.expandText;
+    },
+    propsData: function propsData() {
+      return {
+        content: this.content,
+        rows: this.rows,
+        position: this.position
+      };
+    }
+  },
+  watch: {
+    propsData: function propsData() {
+      this.calcEllipsised();
+    }
+  },
+  methods: {
+    pxToNum: function pxToNum(value) {
+      if (!value) return 0;
+      var match = value.match(/^\d*(\.\d*)?/);
+      return match ? Number(match[0]) : 0;
+    },
+    calcEllipsised: function calcEllipsised() {
+      var _this = this;
+
+      var root = this.$refs.root;
+
+      var cloneContainer = function cloneContainer() {
+        if (!root) return;
+        var originStyle = window.getComputedStyle(root);
+        var container = document.createElement('div');
+        var styleNames = Array.prototype.slice.apply(originStyle);
+        styleNames.forEach(function (name) {
+          container.style.setProperty(name, originStyle.getPropertyValue(name));
+        });
+        container.style.position = 'fixed';
+        container.style.zIndex = '-9999';
+        container.style.top = '-9999px';
+        container.style.height = 'auto';
+        container.style.minHeight = 'auto';
+        container.style.maxHeight = 'auto';
+        container.innerText = _this.content;
+        document.body.appendChild(container);
+        return container;
+      };
+
+      var calcEllipsisText = function calcEllipsisText(container, maxHeight) {
+        var content = _this.content,
+            position = _this.position,
+            dots = _this.dots;
+        var end = content.length;
+
+        var calcEllipse = function calcEllipse() {
+          // calculate the former or later content
+          var tail = function tail(left, right) {
+            if (right - left <= 1) {
+              if (position === 'end') {
+                return content.slice(0, left) + dots;
+              }
+
+              return dots + content.slice(right, end);
+            }
+
+            var middle = Math.round((left + right) / 2); // Set the interception location
+
+            if (position === 'end') {
+              container.innerText = content.slice(0, middle) + dots + _this.actionText;
+            } else {
+              container.innerText = dots + content.slice(middle, end) + _this.actionText;
+            } // The height after interception still does not match the required height
+
+
+            if (container.offsetHeight > maxHeight) {
+              if (position === 'end') {
+                return tail(left, middle);
+              }
+
+              return tail(middle, right);
+            }
+
+            if (position === 'end') {
+              return tail(middle, right);
+            }
+
+            return tail(left, middle);
+          };
+
+          container.innerText = tail(0, end);
+        };
+
+        var middleTail = function middleTail(leftPart, rightPart) {
+          if (leftPart[1] - leftPart[0] <= 1 && rightPart[1] - rightPart[0] <= 1) {
+            return content.slice(0, leftPart[0]) + dots + content.slice(rightPart[1], end);
+          }
+
+          var leftMiddle = Math.floor((leftPart[0] + leftPart[1]) / 2);
+          var rightMiddle = Math.ceil((rightPart[0] + rightPart[1]) / 2);
+          container.innerText = _this.content.slice(0, leftMiddle) + _this.dots + _this.content.slice(rightMiddle, end) + _this.expandText;
+
+          if (container.offsetHeight >= maxHeight) {
+            return middleTail([leftPart[0], leftMiddle], [rightMiddle, rightPart[1]]);
+          }
+
+          return middleTail([leftMiddle, leftPart[1]], [rightPart[0], rightMiddle]);
+        };
+
+        var middle = 0 + end >> 1;
+        _this.position === 'middle' ? container.innerText = middleTail([0, middle], [middle, end]) : calcEllipse();
+        return container.innerText;
+      }; // Calculate the interceptional text
+
+
+      var container = cloneContainer();
+      if (!container) return;
+      var _container$style = container.style,
+          paddingBottom = _container$style.paddingBottom,
+          paddingTop = _container$style.paddingTop,
+          lineHeight = _container$style.lineHeight;
+      var maxHeight = Math.ceil((Number(this.rows) + 0.5) * this.pxToNum(lineHeight) + this.pxToNum(paddingTop) + this.pxToNum(paddingBottom));
+
+      if (maxHeight < container.offsetHeight) {
+        this.ellipsis = true;
+        this.text = calcEllipsisText(container, maxHeight);
+      } else {
+        this.text = this.content;
+        this.ellipsis = false;
+      }
+
+      document.body.removeChild(container);
+    },
+    onClickAction: function onClickAction(event) {
+      event.stopPropagation();
+      event.preventDefault();
+      this.expanded = !this.expanded; // emit('clickAction', event);
+    },
+    renderAction: function renderAction() {
+      var h = this.$createElement;
+      return h("span", {
+        "class": bem('action'),
+        "on": {
+          "click": this.onClickAction
+        }
+      }, [this.actionText]);
+    },
+    onClick: function onClick() {
+      if (this.ellipsis && this.expandType === 'dialog') {
+        _index.default.alert({
+          message: this.content
+        }).then(function () {});
+      }
+    }
+  },
+  mounted: function mounted() {
+    this.calcEllipsised();
+    window.addEventListener("resize", this.calcEllipsised);
+  },
+  render: function render() {
+    var h = arguments[0];
+    return h("div", {
+      "ref": "root",
+      "class": bem(),
+      "on": {
+        "click": this.onClick
+      }
+    }, [this.expanded ? this.content : this.text, this.expandType !== 'dialog' && this.ellipsis ? this.renderAction() : null]);
+  }
+});
+
+exports.default = _default;

package/lib/text-ellipsis/index.less

@@ -0,0 +1,13 @@
+@import '../style/var';
+
+.@{base-prefix}-text-ellipsis {
+  width: 100%;
+  line-height: calc(200% - 8px);
+  white-space: pre-wrap;
+  word-break: break-all;
+
+  &__action {
+    cursor: pointer;
+    color: #0091FA;
+  }
+}

package/lib/text-ellipsis/style/index.js

@@ -0,0 +1,9 @@
+require('../../style/base.css');
+require('../../overlay/index.css');
+require('../../info/index.css');
+require('../../icon/index.css');
+require('../../popup/index.css');
+require('../../loading/index.css');
+require('../../button/index.css');
+require('../../dialog/index.css');
+require('../index.css');

package/lib/text-ellipsis/style/less.js

@@ -0,0 +1,9 @@
+require('../../style/base.less');
+require('../../overlay/index.less');
+require('../../info/index.less');
+require('../../icon/index.less');
+require('../../popup/index.less');
+require('../../loading/index.less');
+require('../../button/index.less');
+require('../../dialog/index.less');
+require('../index.less');

package/lib/utils/router.js

@@ -9,8 +9,7 @@ exports.routeProps = void 0;
  * Vue Router support
  */
 function isRedundantNavigation(err) {
-  return err.name === 'NavigationDuplicated' || // compatible with vue-router@3.3
-  err.message && err.message.indexOf('redundant navigation') !== -1;
+  return err.name === 'NavigationDuplicated' || err.message && err.message.indexOf('redundant navigation') !== -1;
 }
 
 function route(router, config) {