@panpanzhao/component-ui 1.0.0 → 1.0.1

package/lib/components/tree-line.js

@@ -0,0 +1,272 @@
+module.exports =
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "/dist/";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 84);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 84:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// CONCATENATED MODULE: ./src/components/tree-line/src/index.js
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function getComConfig(h) {
+  return {
+    name: 'TreeLine',
+    props: {
+      node: {
+        type: Object,
+        required: true
+      },
+      data: {
+        type: Object
+      },
+      treeData: {
+        type: Array
+      },
+      indent: {
+        type: Number,
+        default: function _default() {
+          return 14;
+        }
+      },
+      showLabelLine: {
+        type: Boolean,
+        default: false
+      }
+    },
+    render: function render(createElement) {
+      debugger;
+      var $createElement = h || createElement;
+      // 自定义整行节点label区域
+      var scopeSlotDefault = this.getScopedSlot('default');
+      // 显示横线时自定义节点label区域
+      var labelSlot = this.getScopedSlot('node-label');
+      // 显示横线时追加在横线右边的内容
+      var afterLabelSlot = this.getScopedSlot('after-node-label');
+      var labelNodes = scopeSlotDefault ? this.getScopedSlotValue(scopeSlotDefault, {
+        node: this.node,
+        data: this.data
+      }) : [labelSlot ? this.getScopedSlotValue(labelSlot, {
+        node: this.node,
+        data: this.data
+      }) : $createElement('span', {
+        class: 'element-tree-node-label'
+      }, this.node.label), this.showLabelLine ? $createElement('span', {
+        class: 'element-tree-node-label-line'
+      }) : null, this.getScopedSlotValue(afterLabelSlot, {
+        node: this.node,
+        data: this.data
+      })];
+      // 取得每一层的当前节点是不是在当前层级列表的最后一个
+      var lastnodeArr = [];
+      var currentNode = this.node;
+      while (currentNode) {
+        var parentNode = currentNode.parent;
+        // 兼容element-plus的 el-tree-v2 (Virtualized Tree 虚拟树)
+        if (currentNode.level === 1 && !currentNode.parent) {
+          // el-tree-v2的第一层node是没有parent的，必需 treeData 创建一个parent
+          if (!this.treeData || !Array.isArray(this.treeData)) {
+            throw Error('if you using el-tree-v2 (Virtualized Tree) of element-plus,element-tree-line required data.');
+          }
+          parentNode = {
+            children: Array.isArray(this.treeData) ? this.treeData.map(function (item) {
+              return _extends({}, item, {
+                key: item.id
+              });
+            }) : [],
+            level: 0,
+            key: 'node-0',
+            parent: null
+          };
+        }
+        if (parentNode) {
+          // element-plus的 el-tree-v2 使用的是children和key， 其他使用的是 childNodes和id
+          var index = (parentNode.children || parentNode.childNodes).findIndex(function (item) {
+            return (item.key || item.id) === (currentNode.key || currentNode.id);
+          });
+          lastnodeArr.unshift(index === (parentNode.children || parentNode.childNodes).length - 1);
+        }
+        currentNode = parentNode;
+      }
+      var lineNodes = [];
+      for (var i = 0; i < this.node.level; i++) {
+        if (lastnodeArr[i] && this.node.level - 1 !== i) {
+          continue;
+        }
+        lineNodes.push($createElement('span', {
+          class: {
+            'element-tree-node-line-ver': true,
+            'last-node-isLeaf-line': lastnodeArr[i] && this.node.level - 1 === i
+          },
+          style: {
+            left: this.indent * i + 'px'
+          }
+        }));
+      }
+      return $createElement('span', {
+        class: 'element-tree-node-label-wrapper'
+      }, [labelNodes].concat(lineNodes).concat([$createElement('span', {
+        class: 'element-tree-node-line-hor',
+        style: {
+          width: (this.node.isLeaf ? 24 : 8) + 'px',
+          left: (this.node.level - 1) * this.indent + 'px'
+        }
+      })]));
+    },
+    methods: {
+      getScopedSlot: function getScopedSlot(slotName) {
+        if (!slotName) {
+          return null;
+        }
+        var slotNameSplits = slotName.split('||');
+        var scopeSlot = null;
+        for (var index = 0; index < slotNameSplits.length; index++) {
+          var name = slotNameSplits[index];
+          var slot = (this.$slots || {})[name];
+          if (slot) {
+            scopeSlot = slot;
+            break;
+          }
+          scopeSlot = (this.$scopedSlots || {})[name];
+          if (scopeSlot) {
+            break;
+          }
+        }
+        return scopeSlot;
+      },
+      getScopedSlotValue: function getScopedSlotValue(scopeSlot, scopedData, defaultNode) {
+        if (defaultNode === void 0) {
+          defaultNode = null;
+        }
+        if (typeof scopeSlot === 'function') {
+          return scopeSlot(scopedData) || defaultNode;
+        }
+        return scopeSlot || defaultNode;
+      }
+    }
+  };
+}
+function getElementLabelLine(h) {
+  debugger;
+  var conf = getComConfig(h);
+  if (h) {
+    conf.methods.getScopedSlot = function getScopedSlot(slotName) {
+      if (!slotName) {
+        return null;
+      }
+      var slotNameSplits = slotName.split('||');
+      var scopeSlot = null;
+      for (var index = 0; index < slotNameSplits.length; index++) {
+        var name = slotNameSplits[index];
+        var slot = (this.$slots || {})[name];
+        if (slot) {
+          scopeSlot = slot;
+          break;
+        }
+      }
+      return scopeSlot;
+    };
+  }
+  return conf;
+}
+var ElementLabelLine = getElementLabelLine();
+/* harmony default export */ var src = (ElementLabelLine);
+// CONCATENATED MODULE: ./src/components/tree-line/index.js
+
+
+/* istanbul ignore next */
+src.install = function (Vue) {
+  Vue.component(src.name, src);
+};
+/* harmony default export */ var tree_line = __webpack_exports__["default"] = (src);
+
+/***/ })
+
+/******/ });