eoss-ui 0.6.54 → 0.6.56

package/lib/menu.js

@@ -87,7 +87,7 @@ module.exports =
 /************************************************************************/
 /******/ ({
 
-/***/ 12:
+/***/ 13:
 /***/ (function(module, exports) {
 
 module.exports = require("throttle-debounce");
@@ -207,7 +207,7 @@ function normalizeComponent(
 __webpack_require__.r(__webpack_exports__);
 
 // EXTERNAL MODULE: external "throttle-debounce"
-var external_throttle_debounce_ = __webpack_require__(12);
+var external_throttle_debounce_ = __webpack_require__(13);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./packages/menu/src/main.vue?vue&type=script&lang=js&
 var _extends = Object.assign || 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; };
@@ -261,6 +261,13 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
     subIcon: {
       type: Boolean,
       default: true
+    },
+    menuClass: String,
+    color: [String, Array],
+    backgroundColor: [String, Array],
+    showTitle: {
+      type: Boolean,
+      default: true
     }
   },
   computed: {
@@ -307,6 +314,25 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
   },
 
   methods: {
+    setStyle: function setStyle(num) {
+      var obj = {};
+      if (this.color) {
+        obj.color = this.color;
+        if (Array.isArray(this.color)) {
+          obj.color = this.color[num % this.color.length];
+        } else {
+          obj.color = this.color;
+        }
+      }
+      if (this.backgroundColor) {
+        if (Array.isArray(this.backgroundColor)) {
+          obj.backgroundColor = this.backgroundColor[num % this.backgroundColor.length];
+        } else {
+          obj.backgroundColor = this.backgroundColor;
+        }
+      }
+      return obj;
+    },
     getWidth: function getWidth() {
       var _this2 = this;
 
@@ -439,13 +465,13 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
         mode: this.mode
       });
     },
-    getSub: function getSub(item, h, popper, fourthTabs, subIcon) {
+    getSub: function getSub(item, h, popper, fourthTabs, subIcon, index, directives) {
       var _this5 = this;
 
       if (popper) {
-        popper += this.popperClass !== undefined ? ' ' + this.popperClass : ' es-menu-popper-' + this.mode;
+        popper += this.popperClass ? ' ' + this.popperClass + (' es-menu-popper-' + this.mode) : ' es-menu-popper-' + this.mode;
       } else {
-        popper = this.popperClass !== undefined ? this.popperClass : ' es-menu-popper-' + this.mode;
+        popper = this.popperClass ? ' ' + this.popperClass + (' es-menu-popper-' + this.mode) : ' es-menu-popper-' + this.mode;
       }
       var title = [];
       if (subIcon) {
@@ -453,11 +479,16 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
           props: {
             contents: item.icons || this.menuIcon
           },
+          style: this.setStyle(index),
           class: ['es-menu-item-icon']
         }));
       }
       title.push(h('div', {
-        class: ['es-menu-title-text es-menu-title-' + this.mode]
+        class: ['es-menu-title-text es-menu-title-' + this.mode],
+        directives: directives ? [{
+          name: 'show',
+          value: this.showTitle ? true : !this.collapse
+        }] : []
       }, [h('el-badge', {
         class: ['es-badge', {
           'es-badge-right': item.tips && typeof item.tips !== 'boolean',
@@ -481,7 +512,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
           if (!ele) {
             console.error('\u5BF9\u8C61\u5B50\u6570\u636E\u4E2D\u7B2C[' + index + ']\u6761\u6570\u636E\u9519\u8BEF', item);
           } else {
-            return _this5.getSub(ele, h, popper, false, _this5.subIcon);
+            return _this5.getSub(ele, h, popper, false, _this5.subIcon, index);
           }
         }));
         return [h('el-submenu', {
@@ -499,7 +530,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
           if (!ele) {
             console.error('\u5BF9\u8C61\u5B50\u6570\u636E\u4E2D\u7B2C[' + index + ']\u6761\u6570\u636E\u9519\u8BEF', item);
           } else {
-            return _this5.getSub(ele, h, popper, true, _this5.subIcon);
+            return _this5.getSub(ele, h, popper, true, _this5.subIcon, index);
           }
         }));
         return [h('el-submenu', {
@@ -533,17 +564,22 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
     var _this6 = this;
 
     var doms = [];
-    this.data.forEach(function (item) {
+    this.data.forEach(function (item, index) {
       if (item.children && item.children.length && (!item.extendData || item.extendData.businessStatus != 0)) {
-        doms = doms.concat(_this6.getSub(item, h, 'es-sub-menu', false, true));
+        doms = doms.concat(_this6.getSub(item, h, 'es-sub-menu', false, true, index, true));
       } else {
         var title = [h('es-icon', {
           props: {
             contents: item.icons || _this6.menuIcon
           },
+          style: _this6.setStyle(index),
           class: ['es-menu-item-icon']
         }), h('div', {
-          class: ['es-menu-title-text es-menu-title-' + _this6.mode]
+          class: ['es-menu-title-text es-menu-title-' + _this6.mode],
+          directives: [{
+            name: 'show',
+            value: _this6.showTitle ? true : !_this6.collapse
+          }]
         }, [h('el-badge', {
           class: ['es-badge', {
             'es-badge-right': item.tips && typeof item.tips !== 'boolean',
@@ -580,7 +616,7 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
       },
       class: 'es-menu-' + this.mode + '-scrollbar'
     }, [h('el-menu', {
-      class: ['es-menu', 'es-menu-' + this.mode, { 'es-menu-collapse': this.collapse }, { 'es-menu-nav': this.subNav }],
+      class: ['es-menu', this.menuClass, 'es-menu-' + this.mode, { 'es-menu-collapse': this.collapse }, { 'es-menu-nav': this.subNav }],
       ref: 'menu',
       props: {
         defaultOpeneds: this.defaultOpeneds,