Merge pull request #30 from iview/2.0

update

README.md

@@ -31,7 +31,7 @@ iView
           </td>
           <td align="center" valign="middle">
             <a href="https://e.coding.net/?utm_source=iview" target="_blank">
-              <img width="300" src="https://file.iviewui.com/asd/asd-coding3.png">
+              <img width="300" src="https://file.iviewui.com/asd/asd-coding4.png">
             </a>
           </td>
             <td align="center" valign="middle">

package.json

@@ -1,6 +1,6 @@
 {
     "name": "iview",
-    "version": "3.4.0-rc.2",
+    "version": "3.4.1",
     "title": "iView",
     "description": "A high quality UI components Library with Vue.js",
     "homepage": "http://www.iviewui.com",

src/components/anchor/anchor.vue

@@ -168,7 +168,9 @@ export default {
                 this.handleScrollTo();
                 this.handleSetInkTop();
                 this.updateTitleOffset();
-                this.upperFirstTitle = this.scrollElement.scrollTop < this.titlesOffsetArr[0].offset;
+                if (this.titlesOffsetArr[0]) {
+                    this.upperFirstTitle = this.scrollElement.scrollTop < this.titlesOffsetArr[0].offset;
+                }
                 on(this.scrollContainer, 'scroll', this.handleScroll);
                 on(window, 'hashchange', this.handleHashChange);
             });

src/components/cascader/casitem.vue

@@ -2,7 +2,7 @@
     <li :class="classes">
         {{ data.label }}
         <Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" v-if="showArrow" />
-        <i v-if="showLoading" class="ivu-icon ivu-icon-ios-loading ivu-load-loop"></i>
+        <i v-if="showLoading" class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-cascader-menu-item-loading"></i>
     </li>
 </template>
 <script>

src/components/input-number/input-number.vue

@@ -292,7 +292,7 @@
                 }
             },
             change (event) {
-                if (event.type == 'change') return;
+                if (event.type == 'change' && this.activeChange) return;
 
                 if (event.type == 'input' && !this.activeChange) return;
                 let val = event.target.value.trim();

src/styles/components/cascader.less

@@ -137,6 +137,9 @@
                 //margin-top: -6px;
                 transform: translateY(-50%);
             }
+            &-loading{
+                margin-top: -6px;
+            }
 
             &-active{
                 background-color: @background-color-select-hover;

src/styles/components/index.less

@@ -49,4 +49,5 @@
 @import "anchor";
 @import "time";
 @import "cell";
-@import "drawer";
+@import "drawer";
+@import "breadcrumb";

src/styles/mixins/index.less

@@ -7,7 +7,6 @@
 @import "close";
 @import "checkbox";
 @import "input";
-@import "breadcrumb";
 @import "mask";
 @import "content";  // card、modal
 @import "tooltip";

src/styles/mixins/layout.less

@@ -57,9 +57,15 @@
     .@{col-prefix-cls}@{class}-pull-@{index} {
         right: auto;
     }
+    .@{col-prefix-cls}@{class}-offset-@{index} {
+        margin-left: 0;
+    }
+    .@{col-prefix-cls}@{class}-order-@{index} {
+        order: 0;
+    }
 }
 
 .make-grid(@class: ~'') {
     .float-grid-columns(@class);
     .loop-grid-columns(@grid-columns, @class);
-}
+}

types/breadcrumb.d.ts

@@ -27,4 +27,9 @@ export declare interface BreadcrumbItem extends Vue {
      * @default _self
    */
   target?: '_blank' | '_self' | '_parent' | '_top';
+  /**
+   * 同 vue-router append
+   * @default false
+   */
+  append?: boolean;
 }

types/button.d.ts

@@ -66,6 +66,11 @@ export declare interface Button extends Vue {
    * @default _self
    */
   target?: '_blank' | '_self' | '_parent' | '_top';
+  /**
+   * 同 vue-router append
+   * @default false
+   */
+  append?: boolean;
 }
 
 export declare interface ButtonGroup extends Vue {

types/cell.d.ts

@@ -45,6 +45,11 @@ export declare interface Cell extends Vue {
      * @default _self
    */
   target?: '_blank' | '_self' | '_parent' | '_top';
+  /**
+   * 同 vue-router append
+   * @default false
+   */
+  append?: boolean;
   /**
    * slot插槽对象
    */

types/date-picker.d.ts

@@ -131,6 +131,10 @@ export declare interface DatePicker extends Vue {
    * 在 confirm 模式或 clearable = true 时有效，在清空日期时触发
    */
   $emit(eventName: 'on-clear'): this;
+  /**
+   * 点击外部关闭下拉菜单时触发
+   */
+  $emit(eventName: 'on-clickoutside',event: MouseEvent): this;
   /**
    * slot插槽对象
    */

types/dropdown.d.ts

@@ -32,6 +32,11 @@ export declare interface Dropdown extends Vue {
    * 开启 transfer 时，给浮层添加额外的 class 名称
    */
   'transfer-class-name'?: string;
+  /**
+   * 是否开启 stop-propagation
+   * @default false
+   */
+  'stop-propagation'?: boolean;
   /**
    * 点击菜单项时触发
    * 

types/input.d.ts

@@ -140,6 +140,10 @@ export declare interface Input extends Vue {
    * 开启 search 时可用，点击搜索或按下回车键时触发
    */
   $emit(eventName: 'on-search', value: string): this;
+  /**
+   * 开启 clearable 时可用，点击清空按钮时触发
+   */
+  $emit(eventName: 'on-clear'): this;
   /**
    * 手动聚焦输入框
    */

types/iview.components.d.ts

@@ -63,18 +63,74 @@ export { Transfer } from './transfer';
 export { Tree, TreeChild } from './tree';
 export { Upload } from './upload';
 
+interface IViewGlobalOptions{
+    size?: string;
+    transfer?: boolean | string;
+    select: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+    };
+    cell: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+    };
+    menu: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+    };
+    tree: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+    };
+    cascader: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+        itemArrow: string;
+        customItemArrow: string;
+        itemArrowSize: number | string;
+    };
+    colorPicker: {
+        arrow: string;
+        customArrow: string;
+        arrowSize: number | string;
+    };
+    datePicker: {
+        icon: string;
+        customIcon: string;
+        iconSize: number | string;
+    };
+    timePicker: {
+        icon: string;
+        customIcon: string;
+        iconSize: number | string;
+    };
+    tabs: {
+        closeIcon: string;
+        customCloseIcon: string;
+        closeIconSize: number | string;
+    };
+    modal: {
+        maskClosable: boolean | string;
+    };
+}
+
+interface IViewInstallOptions extends IViewGlobalOptions{
+    locale?: any;
+    i18n?: any;
+}
+
 declare const API: {
     version: string;
-    locale: (l:any) => void;
+    locale: (l: any) => void;
-    i18n: (fn:any) => void;
+    i18n: (fn: any) => void;
     install: (
         Vue: Vue,
-        opts: {
+        opts: IViewInstallOptions
-            locale?: any;
-            i18n?: any;
-            size?: any;
-            transfer?: any;
-        }
     ) => void;
     lang: (code: string) => void;
 };
@@ -83,9 +139,6 @@ export default API;
 
 declare module 'vue/types/vue' {
     interface Vue {
-        $IVIEW: {
+        $IVIEW: IViewGlobalOptions;
-            size?: string;
-            transfer?: string;
-        };
     }
 }

types/loading-bar.d.ts

@@ -41,11 +41,6 @@ export declare interface LoadingBarConfig {
    * @default primary
    */
   color?: string;
-  /**
-   * 自动消失的延时, 默认为800ms
-   * @default 800
-   */
-  duration?: number;
   /**
    * 失败时的进度条颜色，默认为 iView 主色 
    * @default error
@@ -56,6 +51,11 @@ export declare interface LoadingBarConfig {
    * @default 2
    */
   height?: number;
+  /**
+   * 自动消失的延时, 默认为800ms
+   * @default 800
+   */
+  duration?: number;
 }
 
 declare module 'vue/types/vue' {

types/menu.d.ts

@@ -71,6 +71,11 @@ export declare interface MenuItem extends Vue {
    * @default _self
    */
   target?: '_blank' | '_self' | '_parent' | '_top';
+  /**
+   * 同 vue-router append
+   * @default false
+   */
+  append?: boolean;
 }
 
 export declare interface MenuSub extends Vue {

types/poptip.d.ts

@@ -37,6 +37,11 @@ export declare interface Poptip extends Vue {
    * @default false
    */
   confirm?: boolean;
+  /**
+   * 是否禁用
+   * @default false
+   */
+  disabled?: boolean;
   /**
    * 确定按钮的文字，只在 confirm 模式下有效
    * @default 确定

types/select.d.ts

@@ -92,6 +92,18 @@ export declare interface Select extends Vue {
    * 开启 transfer 时，给浮层添加额外的 class 名称
    */
   'transfer-class-name'?: string;
+  /**
+   * 在 Select 内显示图标
+   */
+  prefix?: string;
+  /**
+   * 多选时最多显示多少个 tag
+   */
+  'max-tag-count'?: number;
+  /**
+   * 隐藏 tag 时显示的内容，参数是剩余项数量
+   */
+  'max-tag-placeholder'?: () => any;
   /**
    * 选中的Option变化时触发，默认返回 value，如需返回 label，详见 label-in-value 属性	当前选中项
    */
@@ -116,6 +128,15 @@ export declare interface Select extends Vue {
    * 清空单选项，仅在 clearable="true" 时有效
    */
   clearSingleSelect(): void;
+  /**
+   * slot插槽对象
+   */
+  $slots: {
+    /**
+     * 自定义 Select 内头部图标
+     */
+    prefix: VNode[];
+  };
 }
 
 export declare interface Option extends Vue {

types/slider.d.ts

@@ -59,6 +59,11 @@ export declare interface Slider extends Vue {
    * 数字输入框的尺寸，可选值为large、small、default或者不填，仅在开启 show-input 时有效
    */
   'input-size'?: '' | 'large' | 'small' | 'default';
+  /**
+   * 同 InputNumber 的 active-change
+   * @default true
+   */
+  'active-change'?: boolean;
   /**
    * 在松开滑动时触发，返回当前的选值，在滑动过程中不会触发
    */

types/table.d.ts

@@ -40,6 +40,10 @@ export declare interface Table extends Vue {
      * 表格高度，单位 px，设置后，如果表格内容大于此值，会固定表头
      */
     height?: number | string;
+    /**
+     * 表格最大高度，单位 px，设置后，如果表格内容大于此值，会固定表头
+     */
+    'max-height'?: number | string;
     /**
      * 表格是否加载中
      * @default false
@@ -85,6 +89,11 @@ export declare interface Table extends Vue {
      * @default dark
      */
     "tooltip-theme"?: string;
+    /**
+     * 是否强制使用内置的 row-key，开启后可能会影响性能
+     * @default false
+     */
+    "row-key"?: boolean;
     /**
      * 开启 highlight-row 后有效，当表格的当前行发生变化的时候会触发
      * currentRow：当前高亮行的数据
@@ -423,7 +432,7 @@ export declare interface TableExportCsvParams {
     /**
      * 添加此函数后，不会下载，而是返回数据
      */
-    callback?: () => void;
+    callback?: (data?: any) => void;
     /**
      * 数据分隔符，默认是逗号(,)
      * @default ,