zartui 2.0.67 → 2.0.68

package/es/cell/index.css

@@ -1 +1 @@
-.zt2-cell{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;width:100%;padding:12px 16px;overflow:hidden;color:#2d4b73;font-size:14px;line-height:20px;background-color:transparent}.zt2-cell--noFlex{display:block}.zt2-cell--noFlex .zt2-cell__title{margin-bottom:10px;width:100%;max-width:100%}.zt2-cell--borderless::after,.zt2-cell:last-child::after{display:none}.zt2-cell__label{margin-top:10px;color:#2d4b73;font-size:14px;line-height:18px}.zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18}.zt2-cell__placeholder{color:rgba(45,75,115,.2);-webkit-box-flex:9;-webkit-flex:9;flex:9;text-align:right}.zt2-cell__value{position:relative;overflow:hidden;color:#2d4b73;text-align:right;vertical-align:middle;word-wrap:break-word;border-radius:4px}.zt2-cell__value--alone{text-align:left}.zt2-cell__clear{color:rgba(45,75,115,.6);font-size:20px;width:20px;height:20px;margin:0 4px 0 8px;cursor:pointer;box-sizing:content-box}.zt2-cell__clear:last-child{margin-right:0}.zt2-cell__left-icon,.zt2-cell__right-icon{height:20px;font-size:16px;line-height:20px}.zt2-cell__left-icon{margin-right:4px}.zt2-cell__right-icon{margin:auto 0;margin-left:4px;color:#969799}.zt2-cell--center{-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell--large{padding-top:12px;padding-bottom:12px}.zt2-cell--large .zt2-cell__title{font-size:16px}.zt2-cell--large .zt2-cell__label{font-size:14px}.zt2-cell__direction-row{position:relative;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-row::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:16px;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt2-cell__direction-row .zt2-cell__title{color:rgba(45,75,115,.8)}.zt2-cell__direction-row:last-child::after{display:none}.zt2-cell__direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;font-size:14px;line-height:20px}.zt2-cell__direction-column .zt2-cell__title{margin-bottom:8px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-column .zt2-cell__title-content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zt2-cell__direction-column .zt2-cell__title-subtitle{display:-webkit-box;display:-webkit-flex;display:flex;white-space:nowrap;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-flex:1;-webkit-flex:1;flex:1;opacity:.4}.zt2-cell__direction-column .zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;text-align:left;min-height:44px;padding:12px;box-sizing:border-box;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start}.zt2-cell__direction-column .zt2-cell__value .zt2-icon{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.zt2-cell__direction-column .zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18;word-break:break-all}.zt2-cell__clickable{cursor:pointer}.zt2-cell__clickable:active{background-color:rgba(0,0,0,.04)}
+.zt2-cell{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;width:100%;padding:12px 16px;overflow:hidden;color:#2d4b73;font-size:14px;line-height:20px;background-color:transparent}.zt2-cell--noFlex{display:block}.zt2-cell--noFlex .zt2-cell__title{margin-bottom:10px;width:100%;max-width:100%}.zt2-cell--borderless::after,.zt2-cell:last-child::after{display:none}.zt2-cell__label{margin-top:10px;color:#2d4b73;font-size:14px;line-height:18px}.zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18}.zt2-cell__placeholder{color:rgba(45,75,115,.2);-webkit-box-flex:9;-webkit-flex:9;flex:9;text-align:right}.zt2-cell__value{position:relative;overflow:hidden;color:#2d4b73;text-align:right;vertical-align:middle;word-wrap:break-word;border-radius:4px}.zt2-cell__value--alone{text-align:left}.zt2-cell__clear{color:rgba(45,75,115,.6);font-size:20px;width:20px;height:20px;margin:0 4px 0 8px;cursor:pointer;box-sizing:content-box}.zt2-cell__clear:last-child{margin-right:0}.zt2-cell__left-icon,.zt2-cell__right-icon{height:20px;font-size:16px;line-height:20px}.zt2-cell__left-icon{margin-right:4px}.zt2-cell__right-icon{margin:auto 0;margin-left:4px;color:#969799}.zt2-cell--center{-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell--large{padding-top:12px;padding-bottom:12px}.zt2-cell--large .zt2-cell__title{font-size:16px}.zt2-cell--large .zt2-cell__label{font-size:14px}.zt2-cell__direction-row{position:relative;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-row::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:16px;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt2-cell__direction-row:last-child::after{display:none}.zt2-cell__direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;font-size:14px;line-height:20px}.zt2-cell__direction-column .zt2-cell__title{margin-bottom:8px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-column .zt2-cell__title-content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zt2-cell__direction-column .zt2-cell__title-subtitle{display:-webkit-box;display:-webkit-flex;display:flex;white-space:nowrap;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-flex:1;-webkit-flex:1;flex:1;opacity:.4}.zt2-cell__direction-column .zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;text-align:left;min-height:44px;padding:12px;box-sizing:border-box;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start}.zt2-cell__direction-column .zt2-cell__value .zt2-icon{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.zt2-cell__direction-column .zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18;word-break:break-all}.zt2-cell__clickable{cursor:pointer}.zt2-cell__clickable:active{background-color:rgba(0,0,0,.04)}

package/es/cell/index.less

@@ -125,9 +125,6 @@
   &::after {
     .hairline-bottom(@cell-border-color, @padding-md);
   }
-  .@{base-prefix}-cell__title {
-    color: rgba(45, 75, 115, 0.8);
-  }
 
   &:last-child::after {
     display: none;

package/es/dropdown-item/index.css

@@ -1 +1 @@
-.zt2-dropdown-item{position:fixed;right:0;left:0;z-index:10;overflow:hidden}.zt2-dropdown-item__icon{display:block;line-height:inherit;font-size:24px}.zt2-dropdown-item .zt2-cell::after{border:none}.zt2-dropdown-item__option{text-align:left;font-size:14px;padding-left:0}.zt2-dropdown-item__option--active{color:#0091fa}.zt2-dropdown-item__option--active .zt2-dropdown-item__icon{color:#0091fa}.zt2-dropdown-item--up{top:0}.zt2-dropdown-item--down{bottom:0}.zt2-dropdown-item__content,.zt2-dropdown-item__content.zt2-popup{position:absolute;max-height:80%;padding-left:16px;box-sizing:border-box}.zt2-dropdown-item__options{position:absolute;top:0;width:100%;overflow-y:scroll}.zt2-dropdown-item__button{position:absolute;z-index:1;width:100%;height:44px;display:-webkit-box;display:-webkit-flex;display:flex;border-top:1px solid rgba(0,0,0,.05)}.zt2-dropdown-item__button-reset{width:50%;font-family:PingFangSC-Regular;font-weight:400;font-size:16px;color:#ff9623;text-align:center;padding-top:11px}.zt2-dropdown-item__button-confirm{width:50%;background-color:#0091fa;font-weight:600;font-size:16px;color:#f5f5fa;text-align:center;padding-top:11px}
+.zt2-dropdown-item{position:fixed;right:0;left:0;z-index:10;overflow:hidden}.zt2-dropdown-item__icon{display:block;line-height:inherit;font-size:24px}.zt2-dropdown-item .zt2-cell::after{border:none}.zt2-dropdown-item__option{text-align:left;font-size:14px;padding-left:0}.zt2-dropdown-item__option:last-child::before{display:none}.zt2-dropdown-item__option .zt2-cell__value{height:20px}.zt2-dropdown-item__option--active{color:#0091fa}.zt2-dropdown-item__option--active .zt2-dropdown-item__icon{color:#0091fa}.zt2-dropdown-item--up{top:0}.zt2-dropdown-item--down{bottom:0}.zt2-dropdown-item__content,.zt2-dropdown-item__content.zt2-popup{position:absolute;max-height:80%;padding-left:16px;box-sizing:border-box}.zt2-dropdown-item__options{position:absolute;top:0;width:100%;overflow-y:scroll}.zt2-dropdown-item__button{position:absolute;z-index:1;width:100%;height:68px;display:-webkit-box;display:-webkit-flex;display:flex;border-top:1px solid rgba(0,0,0,.05)}.zt2-dropdown-item__button-reset{width:50%;font-family:PingFangSC-Regular;font-weight:400;color:#ff9623;border-color:#ff9623;text-align:center;margin-top:12px;margin-left:16px;margin-right:4px;background:#fff}.zt2-dropdown-item__button-confirm{width:50%;background-color:#0091fa;font-weight:600;color:#f5f5fa;text-align:center;margin-top:12px;margin-left:4px;margin-right:16px}

package/es/dropdown-item/index.js

@@ -9,6 +9,7 @@ import Cell from '../cell';
 import Checkbox from '../checkbox';
 import Icon from '../icon';
 import Popup from '../popup';
+import Button from '../button';
 
 var _createNamespace = createNamespace('dropdown-item'),
     createComponent = _createNamespace[0],
@@ -71,15 +72,15 @@ export default createComponent({
           });
           value = value.substr(0, value.length - 1);
           return value;
-        } else {
-          return this.placeholder;
         }
-      } else {
-        var match = this.options.filter(function (option) {
-          return option.value === _this.value;
-        });
-        return match.length ? match[0].text : '';
+
+        return this.placeholder;
       }
+
+      var match = this.options.filter(function (option) {
+        return option.value === _this.value;
+      });
+      return match.length ? match[0].text : '';
     }
   },
   watch: {
@@ -152,9 +153,9 @@ export default createComponent({
     isSelect: function isSelect(value) {
       if (this.value.indexOf(value) >= 0) {
         return true;
-      } else {
-        return false;
       }
+
+      return false;
     },
     reset: function reset() {
       this.showPopup = false;
@@ -240,26 +241,33 @@ export default createComponent({
           "class": bem('icon'),
           "attrs": {
             "color": activeColor,
-            "name": "correct-checked"
+            "name": "checkBox-select",
+            "size": "20px"
           }
         })]);
       });
     }
 
-    var buttonStyle;
-    var optionStyle;
-    var popupStyle;
+    var buttonStyle = {};
+    var optionStyle = {};
+    var popupStyle = {};
 
-    if (this.options.length < 7) {
-      var height = this.options.length * 44;
-      var popupHeight = this.options.length * 44 + 44;
-      buttonStyle = 'top:' + (height + "px");
-      optionStyle = 'height:' + (height + "px");
-      popupStyle = "padding-left: 0px;height:" + (popupHeight + "px");
-    } else {
-      buttonStyle = 'top: 308px';
-      optionStyle = 'height: 308px';
-      popupStyle = "padding-left: 0px;height: 352px";
+    if (this.multiSelect) {
+      var optionsLength = this.options.length;
+
+      if (this.options.length < 4) {
+        var height = optionsLength * 44;
+        var popupHeight = optionsLength * 44 + 68;
+        buttonStyle.top = height + "px";
+        optionStyle.height = height + "px";
+        popupStyle.height = popupHeight + "px";
+        popupStyle.paddingLeft = "0px";
+      } else {
+        buttonStyle.top = '176px';
+        optionStyle.height = '174px';
+        popupStyle.paddingLeft = "0px";
+        popupStyle.height = "244px";
+      }
     }
 
     var style = {
@@ -268,8 +276,10 @@ export default createComponent({
 
     if (direction === 'down') {
       style.top = offset + "px";
+      popupStyle.borderRadius = "0 0 16px 16px";
     } else {
       style.bottom = offset + "px";
+      popupStyle.borderRadius = "16px 16px 0 0";
     }
 
     return h("div", [h("div", {
@@ -295,7 +305,7 @@ export default createComponent({
         "closeOnClickOverlay": closeOnClickOverlay
       },
       "class": bem('content'),
-      "style": this.multiSelect ? popupStyle : "",
+      "style": popupStyle,
       "on": {
         "open": this.onOpen,
         "close": this.onClose,
@@ -331,12 +341,15 @@ export default createComponent({
         name: "show",
         value: this.multiSelect
       }]
-    }, [h("div", {
+    }, [h(Button, {
       "class": bem('button-reset'),
       "on": {
         "click": this.reset
       }
-    }, ["\u91CD\u7F6E"]), h("div", {
+    }, ["\u91CD\u7F6E"]), h(Button, {
+      "attrs": {
+        "type": "primary"
+      },
       "class": bem('button-confirm'),
       "on": {
         "click": this.confirm

package/es/dropdown-item/index.less

@@ -22,6 +22,14 @@
     font-size: @dropdown-menu-option-font-size;
     padding-left: 0;
 
+    &:last-child::before {
+      display: none;
+    }
+
+    .@{base-prefix}-cell__value {
+      height: 20px;
+    }
+
     &--active {
       color: @dropdown-menu-option-active-color;
 
@@ -57,7 +65,7 @@
     position: absolute;
     z-index: 1;
     width: 100%;
-    height: 44px;
+    height: 68px;
     display: flex;
     border-top: 1px solid rgba(0, 0, 0, 0.05);
 
@@ -65,19 +73,23 @@
       width: 50%;
       font-family: PingFangSC-Regular;
       font-weight: 400;
-      font-size: 16px;
       color: #ff9623;
+      border-color: #ff9623;
       text-align: center;
-      padding-top: 11px;
+      margin-top: 12px;
+      margin-left: 16px;
+      margin-right: 4px;
+      background: #fff;
     }
     &-confirm {
       width: 50%;
       background-color: #0091fa;
       font-weight: 600;
-      font-size: 16px;
       color: #f5f5fa;
       text-align: center;
-      padding-top: 11px;
+      margin-top: 12px;
+      margin-left: 4px;
+      margin-right: 16px;
     }
   }
 }

package/es/dropdown-item/style/index.js

@@ -4,6 +4,8 @@ import '../../info/index.css';
 import '../../icon/index.css';
 import '../../checkbox/index.css';
 import '../../popup/index.css';
+import '../../loading/index.css';
+import '../../button/index.css';
 import '../../cell/index.css';
 import '../../field/index.css';
 import '../index.css';

package/es/dropdown-item/style/less.js

@@ -4,6 +4,8 @@ import '../../info/index.less';
 import '../../icon/index.less';
 import '../../checkbox/index.less';
 import '../../popup/index.less';
+import '../../loading/index.less';
+import '../../button/index.less';
 import '../../cell/index.less';
 import '../../field/index.less';
 import '../index.less';

package/es/dropdown-menu/index.css

@@ -1 +1 @@
-.zt2-dropdown-menu{-webkit-user-select:none;user-select:none;font-family:PingFangSC-Regular}.zt2-dropdown-menu__bar{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;height:44px;background-color:#fff;padding:0 16px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-dropdown-menu__bar--opened{z-index:11}.zt2-dropdown-menu__item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;min-width:0;cursor:pointer;height:28px;margin-right:8px}.zt2-dropdown-menu__item:last-child{margin-right:0}.zt2-dropdown-menu__item:active{opacity:.7}.zt2-dropdown-menu__item--disabled:active{opacity:1}.zt2-dropdown-menu__item--disabled .zt2-dropdown-menu__title{color:#969799}.zt2-dropdown-menu__title{position:relative;box-sizing:border-box;width:100%;padding:0 8px;color:#000;font-size:14px;line-height:22px}.zt2-dropdown-menu__title .zt2-icon{position:absolute;top:50%;right:8px;margin-top:-6px;color:#dcdee0}.zt2-dropdown-menu__title .zt2-dropdown-menu__icon{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.zt2-dropdown-menu__title--active{color:#0091fa}.zt2-dropdown-menu__title--active .zt2-icon{color:currentColor}.zt2-dropdown-menu__title--active .zt2-dropdown-menu__icon{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.zt2-dropdown-menu__title--down::after{margin-top:-1px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}
+.zt2-dropdown-menu{-webkit-user-select:none;user-select:none;font-family:PingFangSC-Regular}.zt2-dropdown-menu__bar{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;padding:0 12px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-dropdown-menu__bar--opened{z-index:11}.zt2-dropdown-menu__item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;min-width:0;cursor:pointer;height:36px;margin:12px 4px;background-color:#fff;border-radius:calc(36px / 2);padding:0 12px}.zt2-dropdown-menu__item:last-child{margin-right:0}.zt2-dropdown-menu__item:active{opacity:.7}.zt2-dropdown-menu__item--disabled:active{opacity:1}.zt2-dropdown-menu__item--disabled .zt2-dropdown-menu__title{color:#969799}.zt2-dropdown-menu__title{position:relative;box-sizing:border-box;width:100%;color:#2d4b73;font-size:14px;line-height:22px}.zt2-dropdown-menu__title .zt2-icon{position:absolute;top:50%;right:8px;margin-top:-6px;color:#dcdee0}.zt2-dropdown-menu__title--active{color:#0091fa}.zt2-dropdown-menu__title--active .zt2-icon{color:currentColor}.zt2-dropdown-menu__title--active .zt2-dropdown-menu__icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.zt2-dropdown-menu__title--down::after{margin-top:-1px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}

package/es/dropdown-menu/index.js

@@ -93,12 +93,16 @@ export default createComponent({
 
     var h = arguments[0];
     var Titles = this.children.map(function (item, index) {
+      if (item.slots('header')) {
+        return item.slots('header', item != null ? item : {});
+      }
+
       return h("div", {
         "attrs": {
           "role": "button",
           "tabindex": item.disabled ? -1 : 0
         },
-        "class": 'half-border ' + bem('item', {
+        "class": bem('item', {
           disabled: item.disabled
         }),
         "on": {
@@ -118,11 +122,12 @@ export default createComponent({
         }
       }, [h("div", {
         "class": "zt2-ellipsis",
-        "style": 'padding-right: 18px'
+        "style": 'padding-right: 20px'
       }, [item.slots('title') || item.displayTitle, item.slots('icon') || h(Icon, {
         "class": bem('icon'),
         "attrs": {
-          "name": "play"
+          "name": "spinner-expand",
+          "size": "14px"
         }
       })])])]);
     });

package/es/dropdown-menu/index.less

@@ -7,8 +7,6 @@
   &__bar {
     position: relative;
     display: flex;
-    height: @dropdown-menu-height;
-    background-color: @dropdown-menu-background-color;
     padding: @dropdown-menu-padding;
     align-items: center;
 
@@ -25,7 +23,11 @@
     min-width: 0; // hack for flex ellipsis
     cursor: pointer;
     height: @dropdown-menu-item-height;
-    margin-right: @dropdown-menu-item-margin-right;
+    margin: @dropdown-menu-item-margin;
+    background-color: @dropdown-menu-background-color;
+    border-radius: calc(@dropdown-menu-item-height / 2);
+    padding: @dropdown-menu-item-padding;
+
     &:last-child {
       margin-right: 0;
     }
@@ -48,7 +50,6 @@
     position: relative;
     box-sizing: border-box;
     width: 100%;
-    padding: @dropdown-menu-title-padding;
     color: @dropdown-menu-title-text-color;
     font-size: @dropdown-menu-title-font-size;
     line-height: @dropdown-menu-title-line-height;
@@ -60,9 +61,6 @@
       margin-top: -6px;
       color: @gray-4;
     }
-    .@{base-prefix}-dropdown-menu__icon {
-      transform: rotate(90deg);
-    }
 
     &--active {
       color: @dropdown-menu-title-active-text-color;
@@ -71,7 +69,7 @@
         color: currentColor;
       }
       .@{base-prefix}-dropdown-menu__icon {
-        transform: rotate(-90deg);
+        transform: rotate(180deg);
       }
     }
 

package/es/style/var.less

@@ -432,15 +432,15 @@
 
 // DropdownMenu
 @dropdown-menu-height: 44px;
-@dropdown-menu-padding: 0 16px;
-@dropdown-menu-item-height: 28px;
-@dropdown-menu-item-margin-right: 8px;
+@dropdown-menu-padding: 0 @padding-sm;
+@dropdown-menu-item-height: 36px;
+@dropdown-menu-item-margin: 12px 4px;
+@dropdown-menu-item-padding: 0 @padding-sm;
 @dropdown-menu-background-color: @white;
 @dropdown-menu-title-font-size: 14px;
-@dropdown-menu-title-text-color: @black;
+@dropdown-menu-title-text-color: @text-color-default;
 @dropdown-menu-title-active-text-color: @blue;
 @dropdown-menu-title-disabled-text-color: @gray-6;
-@dropdown-menu-title-padding: 0 @padding-xs;
 @dropdown-menu-title-line-height: @line-height-lg;
 @dropdown-menu-option-active-color: @blue;
 @dropdown-menu-option-font-size: @font-size-md;

package/lib/cell/index.css

@@ -1 +1 @@
-.zt2-cell{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;width:100%;padding:12px 16px;overflow:hidden;color:#2d4b73;font-size:14px;line-height:20px;background-color:transparent}.zt2-cell--noFlex{display:block}.zt2-cell--noFlex .zt2-cell__title{margin-bottom:10px;width:100%;max-width:100%}.zt2-cell--borderless::after,.zt2-cell:last-child::after{display:none}.zt2-cell__label{margin-top:10px;color:#2d4b73;font-size:14px;line-height:18px}.zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18}.zt2-cell__placeholder{color:rgba(45,75,115,.2);-webkit-box-flex:9;-webkit-flex:9;flex:9;text-align:right}.zt2-cell__value{position:relative;overflow:hidden;color:#2d4b73;text-align:right;vertical-align:middle;word-wrap:break-word;border-radius:4px}.zt2-cell__value--alone{text-align:left}.zt2-cell__clear{color:rgba(45,75,115,.6);font-size:20px;width:20px;height:20px;margin:0 4px 0 8px;cursor:pointer;box-sizing:content-box}.zt2-cell__clear:last-child{margin-right:0}.zt2-cell__left-icon,.zt2-cell__right-icon{height:20px;font-size:16px;line-height:20px}.zt2-cell__left-icon{margin-right:4px}.zt2-cell__right-icon{margin:auto 0;margin-left:4px;color:#969799}.zt2-cell--center{-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell--large{padding-top:12px;padding-bottom:12px}.zt2-cell--large .zt2-cell__title{font-size:16px}.zt2-cell--large .zt2-cell__label{font-size:14px}.zt2-cell__direction-row{position:relative;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-row::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:16px;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt2-cell__direction-row .zt2-cell__title{color:rgba(45,75,115,.8)}.zt2-cell__direction-row:last-child::after{display:none}.zt2-cell__direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;font-size:14px;line-height:20px}.zt2-cell__direction-column .zt2-cell__title{margin-bottom:8px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-column .zt2-cell__title-content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zt2-cell__direction-column .zt2-cell__title-subtitle{display:-webkit-box;display:-webkit-flex;display:flex;white-space:nowrap;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-flex:1;-webkit-flex:1;flex:1;opacity:.4}.zt2-cell__direction-column .zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;text-align:left;min-height:44px;padding:12px;box-sizing:border-box;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start}.zt2-cell__direction-column .zt2-cell__value .zt2-icon{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.zt2-cell__direction-column .zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18;word-break:break-all}.zt2-cell__clickable{cursor:pointer}.zt2-cell__clickable:active{background-color:rgba(0,0,0,.04)}
+.zt2-cell{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;box-sizing:border-box;width:100%;padding:12px 16px;overflow:hidden;color:#2d4b73;font-size:14px;line-height:20px;background-color:transparent}.zt2-cell--noFlex{display:block}.zt2-cell--noFlex .zt2-cell__title{margin-bottom:10px;width:100%;max-width:100%}.zt2-cell--borderless::after,.zt2-cell:last-child::after{display:none}.zt2-cell__label{margin-top:10px;color:#2d4b73;font-size:14px;line-height:18px}.zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18}.zt2-cell__placeholder{color:rgba(45,75,115,.2);-webkit-box-flex:9;-webkit-flex:9;flex:9;text-align:right}.zt2-cell__value{position:relative;overflow:hidden;color:#2d4b73;text-align:right;vertical-align:middle;word-wrap:break-word;border-radius:4px}.zt2-cell__value--alone{text-align:left}.zt2-cell__clear{color:rgba(45,75,115,.6);font-size:20px;width:20px;height:20px;margin:0 4px 0 8px;cursor:pointer;box-sizing:content-box}.zt2-cell__clear:last-child{margin-right:0}.zt2-cell__left-icon,.zt2-cell__right-icon{height:20px;font-size:16px;line-height:20px}.zt2-cell__left-icon{margin-right:4px}.zt2-cell__right-icon{margin:auto 0;margin-left:4px;color:#969799}.zt2-cell--center{-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell--large{padding-top:12px;padding-bottom:12px}.zt2-cell--large .zt2-cell__title{font-size:16px}.zt2-cell--large .zt2-cell__label{font-size:14px}.zt2-cell__direction-row{position:relative;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-row::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:16px;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt2-cell__direction-row:last-child::after{display:none}.zt2-cell__direction-column{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;font-size:14px;line-height:20px}.zt2-cell__direction-column .zt2-cell__title{margin-bottom:8px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-cell__direction-column .zt2-cell__title-content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zt2-cell__direction-column .zt2-cell__title-subtitle{display:-webkit-box;display:-webkit-flex;display:flex;white-space:nowrap;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-box-flex:1;-webkit-flex:1;flex:1;opacity:.4}.zt2-cell__direction-column .zt2-cell__value{display:-webkit-box;display:-webkit-flex;display:flex;text-align:left;min-height:44px;padding:12px;box-sizing:border-box;background-color:#fff;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start}.zt2-cell__direction-column .zt2-cell__value .zt2-icon{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end}.zt2-cell__direction-column .zt2-cell__value-content{-webkit-box-flex:18;-webkit-flex:18;flex:18;word-break:break-all}.zt2-cell__clickable{cursor:pointer}.zt2-cell__clickable:active{background-color:rgba(0,0,0,.04)}

package/lib/cell/index.less

@@ -125,9 +125,6 @@
   &::after {
     .hairline-bottom(@cell-border-color, @padding-md);
   }
-  .@{base-prefix}-cell__title {
-    color: rgba(45, 75, 115, 0.8);
-  }
 
   &:last-child::after {
     display: none;

package/lib/dropdown-item/index.css

@@ -1 +1 @@
-.zt2-dropdown-item{position:fixed;right:0;left:0;z-index:10;overflow:hidden}.zt2-dropdown-item__icon{display:block;line-height:inherit;font-size:24px}.zt2-dropdown-item .zt2-cell::after{border:none}.zt2-dropdown-item__option{text-align:left;font-size:14px;padding-left:0}.zt2-dropdown-item__option--active{color:#0091fa}.zt2-dropdown-item__option--active .zt2-dropdown-item__icon{color:#0091fa}.zt2-dropdown-item--up{top:0}.zt2-dropdown-item--down{bottom:0}.zt2-dropdown-item__content,.zt2-dropdown-item__content.zt2-popup{position:absolute;max-height:80%;padding-left:16px;box-sizing:border-box}.zt2-dropdown-item__options{position:absolute;top:0;width:100%;overflow-y:scroll}.zt2-dropdown-item__button{position:absolute;z-index:1;width:100%;height:44px;display:-webkit-box;display:-webkit-flex;display:flex;border-top:1px solid rgba(0,0,0,.05)}.zt2-dropdown-item__button-reset{width:50%;font-family:PingFangSC-Regular;font-weight:400;font-size:16px;color:#ff9623;text-align:center;padding-top:11px}.zt2-dropdown-item__button-confirm{width:50%;background-color:#0091fa;font-weight:600;font-size:16px;color:#f5f5fa;text-align:center;padding-top:11px}
+.zt2-dropdown-item{position:fixed;right:0;left:0;z-index:10;overflow:hidden}.zt2-dropdown-item__icon{display:block;line-height:inherit;font-size:24px}.zt2-dropdown-item .zt2-cell::after{border:none}.zt2-dropdown-item__option{text-align:left;font-size:14px;padding-left:0}.zt2-dropdown-item__option:last-child::before{display:none}.zt2-dropdown-item__option .zt2-cell__value{height:20px}.zt2-dropdown-item__option--active{color:#0091fa}.zt2-dropdown-item__option--active .zt2-dropdown-item__icon{color:#0091fa}.zt2-dropdown-item--up{top:0}.zt2-dropdown-item--down{bottom:0}.zt2-dropdown-item__content,.zt2-dropdown-item__content.zt2-popup{position:absolute;max-height:80%;padding-left:16px;box-sizing:border-box}.zt2-dropdown-item__options{position:absolute;top:0;width:100%;overflow-y:scroll}.zt2-dropdown-item__button{position:absolute;z-index:1;width:100%;height:68px;display:-webkit-box;display:-webkit-flex;display:flex;border-top:1px solid rgba(0,0,0,.05)}.zt2-dropdown-item__button-reset{width:50%;font-family:PingFangSC-Regular;font-weight:400;color:#ff9623;border-color:#ff9623;text-align:center;margin-top:12px;margin-left:16px;margin-right:4px;background:#fff}.zt2-dropdown-item__button-confirm{width:50%;background-color:#0091fa;font-weight:600;color:#f5f5fa;text-align:center;margin-top:12px;margin-left:4px;margin-right:16px}

package/lib/dropdown-item/index.js

@@ -21,6 +21,8 @@ var _icon = _interopRequireDefault(require("../icon"));
 
 var _popup = _interopRequireDefault(require("../popup"));
 
+var _button = _interopRequireDefault(require("../button"));
+
 // Utils
 // Mixins
 // Components
@@ -85,15 +87,15 @@ var _default2 = createComponent({
           });
           value = value.substr(0, value.length - 1);
           return value;
-        } else {
-          return this.placeholder;
         }
-      } else {
-        var match = this.options.filter(function (option) {
-          return option.value === _this.value;
-        });
-        return match.length ? match[0].text : '';
+
+        return this.placeholder;
       }
+
+      var match = this.options.filter(function (option) {
+        return option.value === _this.value;
+      });
+      return match.length ? match[0].text : '';
     }
   },
   watch: {
@@ -166,9 +168,9 @@ var _default2 = createComponent({
     isSelect: function isSelect(value) {
       if (this.value.indexOf(value) >= 0) {
         return true;
-      } else {
-        return false;
       }
+
+      return false;
     },
     reset: function reset() {
       this.showPopup = false;
@@ -254,26 +256,33 @@ var _default2 = createComponent({
           "class": bem('icon'),
           "attrs": {
             "color": activeColor,
-            "name": "correct-checked"
+            "name": "checkBox-select",
+            "size": "20px"
           }
         })]);
       });
     }
 
-    var buttonStyle;
-    var optionStyle;
-    var popupStyle;
+    var buttonStyle = {};
+    var optionStyle = {};
+    var popupStyle = {};
 
-    if (this.options.length < 7) {
-      var height = this.options.length * 44;
-      var popupHeight = this.options.length * 44 + 44;
-      buttonStyle = 'top:' + (height + "px");
-      optionStyle = 'height:' + (height + "px");
-      popupStyle = "padding-left: 0px;height:" + (popupHeight + "px");
-    } else {
-      buttonStyle = 'top: 308px';
-      optionStyle = 'height: 308px';
-      popupStyle = "padding-left: 0px;height: 352px";
+    if (this.multiSelect) {
+      var optionsLength = this.options.length;
+
+      if (this.options.length < 4) {
+        var height = optionsLength * 44;
+        var popupHeight = optionsLength * 44 + 68;
+        buttonStyle.top = height + "px";
+        optionStyle.height = height + "px";
+        popupStyle.height = popupHeight + "px";
+        popupStyle.paddingLeft = "0px";
+      } else {
+        buttonStyle.top = '176px';
+        optionStyle.height = '174px';
+        popupStyle.paddingLeft = "0px";
+        popupStyle.height = "244px";
+      }
     }
 
     var style = {
@@ -282,8 +291,10 @@ var _default2 = createComponent({
 
     if (direction === 'down') {
       style.top = offset + "px";
+      popupStyle.borderRadius = "0 0 16px 16px";
     } else {
       style.bottom = offset + "px";
+      popupStyle.borderRadius = "16px 16px 0 0";
     }
 
     return h("div", [h("div", {
@@ -309,7 +320,7 @@ var _default2 = createComponent({
         "closeOnClickOverlay": closeOnClickOverlay
       },
       "class": bem('content'),
-      "style": this.multiSelect ? popupStyle : "",
+      "style": popupStyle,
       "on": {
         "open": this.onOpen,
         "close": this.onClose,
@@ -345,12 +356,15 @@ var _default2 = createComponent({
         name: "show",
         value: this.multiSelect
       }]
-    }, [h("div", {
+    }, [h(_button.default, {
       "class": bem('button-reset'),
       "on": {
         "click": this.reset
       }
-    }, ["\u91CD\u7F6E"]), h("div", {
+    }, ["\u91CD\u7F6E"]), h(_button.default, {
+      "attrs": {
+        "type": "primary"
+      },
       "class": bem('button-confirm'),
       "on": {
         "click": this.confirm

package/lib/dropdown-item/index.less

@@ -22,6 +22,14 @@
     font-size: @dropdown-menu-option-font-size;
     padding-left: 0;
 
+    &:last-child::before {
+      display: none;
+    }
+
+    .@{base-prefix}-cell__value {
+      height: 20px;
+    }
+
     &--active {
       color: @dropdown-menu-option-active-color;
 
@@ -57,7 +65,7 @@
     position: absolute;
     z-index: 1;
     width: 100%;
-    height: 44px;
+    height: 68px;
     display: flex;
     border-top: 1px solid rgba(0, 0, 0, 0.05);
 
@@ -65,19 +73,23 @@
       width: 50%;
       font-family: PingFangSC-Regular;
       font-weight: 400;
-      font-size: 16px;
       color: #ff9623;
+      border-color: #ff9623;
       text-align: center;
-      padding-top: 11px;
+      margin-top: 12px;
+      margin-left: 16px;
+      margin-right: 4px;
+      background: #fff;
     }
     &-confirm {
       width: 50%;
       background-color: #0091fa;
       font-weight: 600;
-      font-size: 16px;
       color: #f5f5fa;
       text-align: center;
-      padding-top: 11px;
+      margin-top: 12px;
+      margin-left: 4px;
+      margin-right: 16px;
     }
   }
 }

package/lib/dropdown-item/style/index.js

@@ -4,6 +4,8 @@ require('../../info/index.css');
 require('../../icon/index.css');
 require('../../checkbox/index.css');
 require('../../popup/index.css');
+require('../../loading/index.css');
+require('../../button/index.css');
 require('../../cell/index.css');
 require('../../field/index.css');
 require('../index.css');

package/lib/dropdown-item/style/less.js

@@ -4,6 +4,8 @@ require('../../info/index.less');
 require('../../icon/index.less');
 require('../../checkbox/index.less');
 require('../../popup/index.less');
+require('../../loading/index.less');
+require('../../button/index.less');
 require('../../cell/index.less');
 require('../../field/index.less');
 require('../index.less');

package/lib/dropdown-menu/index.css

@@ -1 +1 @@
-.zt2-dropdown-menu{-webkit-user-select:none;user-select:none;font-family:PingFangSC-Regular}.zt2-dropdown-menu__bar{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;height:44px;background-color:#fff;padding:0 16px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-dropdown-menu__bar--opened{z-index:11}.zt2-dropdown-menu__item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;min-width:0;cursor:pointer;height:28px;margin-right:8px}.zt2-dropdown-menu__item:last-child{margin-right:0}.zt2-dropdown-menu__item:active{opacity:.7}.zt2-dropdown-menu__item--disabled:active{opacity:1}.zt2-dropdown-menu__item--disabled .zt2-dropdown-menu__title{color:#969799}.zt2-dropdown-menu__title{position:relative;box-sizing:border-box;width:100%;padding:0 8px;color:#000;font-size:14px;line-height:22px}.zt2-dropdown-menu__title .zt2-icon{position:absolute;top:50%;right:8px;margin-top:-6px;color:#dcdee0}.zt2-dropdown-menu__title .zt2-dropdown-menu__icon{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.zt2-dropdown-menu__title--active{color:#0091fa}.zt2-dropdown-menu__title--active .zt2-icon{color:currentColor}.zt2-dropdown-menu__title--active .zt2-dropdown-menu__icon{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.zt2-dropdown-menu__title--down::after{margin-top:-1px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}
+.zt2-dropdown-menu{-webkit-user-select:none;user-select:none;font-family:PingFangSC-Regular}.zt2-dropdown-menu__bar{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;padding:0 12px;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-dropdown-menu__bar--opened{z-index:11}.zt2-dropdown-menu__item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;min-width:0;cursor:pointer;height:36px;margin:12px 4px;background-color:#fff;border-radius:calc(36px / 2);padding:0 12px}.zt2-dropdown-menu__item:last-child{margin-right:0}.zt2-dropdown-menu__item:active{opacity:.7}.zt2-dropdown-menu__item--disabled:active{opacity:1}.zt2-dropdown-menu__item--disabled .zt2-dropdown-menu__title{color:#969799}.zt2-dropdown-menu__title{position:relative;box-sizing:border-box;width:100%;color:#2d4b73;font-size:14px;line-height:22px}.zt2-dropdown-menu__title .zt2-icon{position:absolute;top:50%;right:8px;margin-top:-6px;color:#dcdee0}.zt2-dropdown-menu__title--active{color:#0091fa}.zt2-dropdown-menu__title--active .zt2-icon{color:currentColor}.zt2-dropdown-menu__title--active .zt2-dropdown-menu__icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.zt2-dropdown-menu__title--down::after{margin-top:-1px;-webkit-transform:rotate(135deg);transform:rotate(135deg)}

package/lib/dropdown-menu/index.js

@@ -104,12 +104,16 @@ var _default = createComponent({
 
     var h = arguments[0];
     var Titles = this.children.map(function (item, index) {
+      if (item.slots('header')) {
+        return item.slots('header', item != null ? item : {});
+      }
+
       return h("div", {
         "attrs": {
           "role": "button",
           "tabindex": item.disabled ? -1 : 0
         },
-        "class": 'half-border ' + bem('item', {
+        "class": bem('item', {
           disabled: item.disabled
         }),
         "on": {
@@ -129,11 +133,12 @@ var _default = createComponent({
         }
       }, [h("div", {
         "class": "zt2-ellipsis",
-        "style": 'padding-right: 18px'
+        "style": 'padding-right: 20px'
       }, [item.slots('title') || item.displayTitle, item.slots('icon') || h(_icon.default, {
         "class": bem('icon'),
         "attrs": {
-          "name": "play"
+          "name": "spinner-expand",
+          "size": "14px"
         }
       })])])]);
     });