Merge pull request #981 from XiaoMi/feature/#613

feat: #613
XiaoMi · Mar 10, 2020 · 23b9f6a · 23b9f6a
2 parents ad53b04 + 8db7955
commit 23b9f6a
Show file tree

Hide file tree

Showing 17 changed files with 117 additions and 85 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,10 +1,18 @@
 # 更新日志
 
+## 2.10.0
+
+- 新增 `<Upload />` onDownload 点击上传成功文件的回调 [#613](https://github.com/XiaoMi/hiui/issues/613)
+- 优化 `<Select />` 可搜索模式下自动获取输入框焦点 [#925](https://github.com/XiaoMi/hiui/issues/925)
+- 优化 `<Carousel />` 轮播定位交互，并新增 showPages 是否显示页码指示器 [#925](https://github.com/XiaoMi/hiui/issues/925)
+- 修复 `<Select />` 异步模式下有默认值不能正常使用的问题 [#962](https://github.com/XiaoMi/hiui/issues/962)
+- 优化若干视觉还原问题：[#952](https://github.com/XiaoMi/hiui/issues/952) [#958](https://github.com/XiaoMi/hiui/issues/958) [#971](https://github.com/XiaoMi/hiui/issues/971) [#973](https://github.com/XiaoMi/hiui/issues/973) [#975](https://github.com/XiaoMi/hiui/issues/975) [#976](https://github.com/XiaoMi/hiui/issues/976) [#977](https://github.com/XiaoMi/hiui/issues/977) [#983](https://github.com/XiaoMi/hiui/issues/983)[#987](https://github.com/XiaoMi/hiui/issues/987)
+
 ## 2.9.0
 
 - 新增 `<Progress />` active 属性展示加载动效 [#941](https://github.com/XiaoMi/hiui/issues/941)
 - 新增 `<Upload />` 拖拽用法支持多选上传 [#942](https://github.com/XiaoMi/hiui/issues/942)
-- 新增 `<DatePicker />`  disabledDate 属性自定义日期禁选 [#943](https://github.com/XiaoMi/hiui/issues/943)
+- 新增 `<DatePicker />` disabledDate 属性自定义日期禁选 [#943](https://github.com/XiaoMi/hiui/issues/943)
 - 优化 `<Collapse />` 视觉效果 [#937](https://github.com/XiaoMi/hiui/issues/937)
 - 修复 `<Dropdown />` 点击外部区域不能正常隐藏菜单的问题 [#947](https://github.com/XiaoMi/hiui/issues/947)
 - 修复`<Upload />`同时上传多个文件的展示问题 [#948](https://github.com/XiaoMi/hiui/issues/948)
@@ -17,8 +25,8 @@
 - 新增 `<Table />` withCredentials 属性 [#922](https://github.com/XiaoMi/hiui/issues/922)
 - 修复 `<Transfer />` 单选模式下 targetLimit 无效的问题 [#919](https://github.com/XiaoMi/hiui/issues/919)
 - 修复 `<Select />` 多选出现双滚动条的样式问题 [#920](https://github.com/XiaoMi/hiui/issues/920)
-- 修复 `<Button />`  链接用法样式问题 [#923](https://github.com/XiaoMi/hiui/issues/923)
-- 修复 `<Dropdown />`  按钮样式 icon 边距问题 [#927](https://github.com/XiaoMi/hiui/issues/927)
+- 修复 `<Button />` 链接用法样式问题 [#923](https://github.com/XiaoMi/hiui/issues/923)
+- 修复 `<Dropdown />` 按钮样式 icon 边距问题 [#927](https://github.com/XiaoMi/hiui/issues/927)
 - 修复主题配色适配组件不完全的问题 [#733](https://github.com/XiaoMi/hiui/issues/733)
 
 ## 2.7.0

diff --git a/components/breadcrumb/style/index.scss b/components/breadcrumb/style/index.scss
@@ -17,7 +17,7 @@
   }
 
   &__separator {
-    margin: 0 10px;
+    margin: 0 8px;
     color: #ccc;
   }
 

diff --git a/components/carousel/style/index.scss b/components/carousel/style/index.scss
@@ -17,6 +17,7 @@
     left: 50%;
     transform: translateX(-50%);
     max-width: 50%;
+    display: flex;
   }
 
   &__dot {

diff --git a/components/checkbox/style/index.scss b/components/checkbox/style/index.scss
@@ -70,11 +70,11 @@ $prefixCls: '.hi-checkbox' !default;
         content: '';
         border: none;
         border-bottom: 2px solid #fff;
-        height: 6px;
-        left: 5px;
+        height: 8px;
+        left: 6px;
         position: absolute;
-        top: 3px;
-        width: 4px;
+        top: 2px;
+        width: 2px;
         transform-origin: center;
       }
     }

diff --git a/components/dropdown/DropdownButton.jsx b/components/dropdown/DropdownButton.jsx
@@ -20,8 +20,7 @@ export default class DropdownButton extends React.Component {
     const isGroup = type === 'group'
     const buttonCls = classNames(
       `${prefixCls}__button`,
-      isButton || `${prefixCls}__button--text`,
-      visible && `${prefixCls}__button--active`
+      isButton || `${prefixCls}__button--text`
     )
     const iconGroupCls = classNames(
       `${prefixCls}__icon`,

diff --git a/components/dropdown/DropdownMenu.jsx b/components/dropdown/DropdownMenu.jsx
@@ -30,6 +30,7 @@ class DropdownMenu extends React.Component {
         placement={placement}
         width={width}
         onMouseEnter={onMouseEnter}
+        leftGap={1}
         onMouseLeave={onMouseLeave}
       >
         <ul className={menuCls}>

diff --git a/components/dropdown/style/index.scss b/components/dropdown/style/index.scss
@@ -24,10 +24,6 @@ $prefixCls: 'hi-dropdown' !default;
     .#{$prefixCls}__button {
       color: #ccc;
       cursor: not-allowed;
-
-      &:hover {
-        color: #ccc !important;
-      }
     }
   }
 
@@ -47,10 +43,6 @@ $prefixCls: 'hi-dropdown' !default;
       padding-left: 0;
       padding-right: 0;
     }
-
-    &--active {
-      color: get-color($palette-primary, 'hiui-blue') !important;
-    }
   }
 
   &__icon {
@@ -117,20 +109,16 @@ $prefixCls: 'hi-dropdown' !default;
         width: 100%;
       }
 
-      &:not(#{&}--disabled):hover {
+      &:not(.hi-dropdown__menu-item--disabled):hover {
         background-color: #ecf2fe;
       }
     }
   }
 }
 
 @each $key, $value in $palette-primary {
-  .theme__#{$key}.#{$prefixCls}__button--active {
-    color: $value !important;
-  }
-
   .theme__#{$key}.#{$prefixCls}__menu {
-    .#{$prefixCls}__menu-item:not(.hi-dropdown__menu-item----disabled):hover {
+    .#{$prefixCls}__menu-item:not(.hi-dropdown__menu-item--disabled):hover {
       background-color: rgba($value, 0.15);
     }
   }

diff --git a/components/tag/style/index.scss b/components/tag/style/index.scss
@@ -5,11 +5,14 @@ $primary: get-color($palette-primary, 'hiui-blue') !default;
 
 .#{$prefix} {
   &__container {
+    height: $line-height-size-normal;
     display: inline-block;
     vertical-align: middle;
-    padding: 0 4px;
+    padding: 0 6px;
     font-size: $font-size-small;
-    line-height: $line-height-size-x-small;
+    box-sizing: border-box;
+    text-align: center;
+    line-height: $line-height-size-normal;
     -webkit-font-smoothing: antialiased;
     border-radius: 2px;
 
@@ -34,7 +37,8 @@ $primary: get-color($palette-primary, 'hiui-blue') !default;
       background: transparent;
       border: 1px solid $primary;
       color: $primary;
-      line-height: $line-height-size-x-small - 2;
+      padding: 0 5px;
+      line-height: $line-height-size-normal - 2;
 
       @each $key in 'success', 'danger', 'warning' {
         &.#{$prefix}__container--#{$key} {

diff --git a/components/upload/UploadClick.js b/components/upload/UploadClick.js
@@ -21,7 +21,8 @@ class UploadClick extends Upload {
       accept,
       loading,
       localeDatas,
-      theme
+      theme,
+      onDownload
     } = this.props
     const {
       fileList,
@@ -64,7 +65,14 @@ class UploadClick extends Upload {
                 >
                   <span className={classNames(`Ficon-${file.fileType}`)} />
                   <div className='hi-upload__right-content'>
-                    <span className={fileNameCls} title={file.name}>{file.name}</span>
+                    <a target='_blank' href={file.url || null} className={fileNameCls} title={file.name} onClick={e => {
+                      if (onDownload) {
+                        e.preventDefault()
+                        onDownload(file)
+                      }
+                    }}>
+                      {file.name}
+                    </a>
                     <span
                     >
                       { onRemove &&

diff --git a/components/upload/UploadDrag.js b/components/upload/UploadDrag.js
@@ -48,7 +48,8 @@ class UploadDrag extends Upload {
       tips,
       localeDatas,
       onRemove,
-      theme
+      theme,
+      onDownload
     } = this.props
     const {
       overEvent,
@@ -125,7 +126,7 @@ class UploadDrag extends Upload {
           }
           {fileList.map((file, index) => {
             const fileNameCls = classNames(
-              'file-name',
+              'hi-upload__filename',
               'upload-list__item-name',
               file.uploadState === 'error' && 'hi-upload__filename--error'
             )
@@ -138,7 +139,14 @@ class UploadDrag extends Upload {
               >
                 <span className={`Ficon-${file.fileType}`} />
                 <div className='hi-upload__right-content'>
-                  <span className={fileNameCls}>{file.name}</span>
+                  <a target='_blank' href={file.url || null} className={fileNameCls} title={file.name} onClick={e => {
+                    if (onDownload) {
+                      e.preventDefault()
+                      onDownload(file)
+                    }
+                  }}>
+                    {file.name}
+                  </a>
                   {
                     onRemove && <span
                       className='hi-upload__operate-icon'

diff --git a/components/upload/UploadPictureCard.js b/components/upload/UploadPictureCard.js
@@ -18,7 +18,8 @@ class UploadPictureCard extends Upload {
       accept,
       onRemove,
       localeDatas,
-      theme
+      theme,
+      onDownload
     } = this.props
     const {
       fileList,
@@ -64,7 +65,14 @@ class UploadPictureCard extends Upload {
                     <img src={file.url} />
                   </div>
                   <div className='hi-upload__right-content'>
-                    <span className={fileNameCls} title={file.name}>{file.name}</span>
+                    <a target='_blank' href={file.url || null} className={fileNameCls} title={file.name} onClick={e => {
+                      if (onDownload) {
+                        e.preventDefault()
+                        onDownload(file)
+                      }
+                    }}>
+                      {file.name}
+                    </a>
                     <span>
                       { onRemove &&
                         <Icon

diff --git a/components/upload/style/index.scss b/components/upload/style/index.scss
@@ -9,7 +9,6 @@
     font-size: 12px;
     color: rgb(153, 153, 153);
     line-height: 20px;
-    // padding-top: 12px !important;
 
     &--single-line {
       display: block;
@@ -37,6 +36,24 @@
     overflow: hidden;
     position: relative;
 
+    a.hi-upload__filename {
+      flex: 1;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+      font-size: 14px;
+      cursor: pointer;
+      color: #666;
+
+      &--error {
+        color: rgb(255, 0, 0);
+
+        &:not([href]) {
+          color: rgb(255, 0, 0);
+        }
+      }
+    }
+
     &-tips {
       color: #428ef5;
       background: #edf2fc;
@@ -68,18 +85,6 @@
     overflow: hidden;
   }
 
-  &__filename {
-    flex: 1;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    font-size: 14px;
-
-    &--error {
-      color: rgb(255, 0, 0);
-    }
-  }
-
   &__upstatus {
     width: calc(100% - 30px);
     margin-left: 30px;
@@ -151,7 +156,7 @@
     }
 
     .hi-upload__item {
-      &:not(:first-child):not(:last-child) {
+      &:not(:first-child) {
         border-bottom: 1px solid rgba(230, 230, 230, 1);
       }
     }

diff --git a/docs/demo/breadcrumb/section-base.jsx b/docs/demo/breadcrumb/section-base.jsx
@@ -11,18 +11,11 @@ class Demo extends React.Component {
       content: '首页',
       path: '/home'
     }, {
-      content: '产品类',
-      icon: 'document',
-      path: '/product'
+      content: '列表',
+      path: '/list'
     }, {
-      icon: 'component',
+      content: '手机详情',
       path: '/phone'
-    }, {
-      content: '红米系列',
-      path: '/redmi'
-    }, {
-      content: 'Note7',
-      path: '/note7'
     }]
     return (
       <div>

diff --git a/docs/demo/dropdown/section-trigger.jsx b/docs/demo/dropdown/section-trigger.jsx
@@ -73,7 +73,7 @@ class Demo extends React.Component {
         data={list}
         type='button'
         trigger='click'
-        title='单击'
+        title='左键单击'
       />
     )
   }

diff --git a/docs/zh-CN/components/changelog.mdx b/docs/zh-CN/components/changelog.mdx
@@ -1,10 +1,18 @@
 # 更新日志
 
+## 2.10.0
+
+- 新增 `<Upload />` onDownload 点击上传成功文件的回调 [#613](https://github.com/XiaoMi/hiui/issues/613)
+- 优化 `<Select />` 可搜索模式下自动获取输入框焦点 [#925](https://github.com/XiaoMi/hiui/issues/925)
+- 优化 `<Carousel />` 轮播定位交互，并新增 showPages 是否显示页码指示器 [#925](https://github.com/XiaoMi/hiui/issues/925)
+- 修复 `<Select />` 异步模式下有默认值不能正常使用的问题 [#962](https://github.com/XiaoMi/hiui/issues/962)
+- 优化若干视觉还原问题：[#952](https://github.com/XiaoMi/hiui/issues/952) [#958](https://github.com/XiaoMi/hiui/issues/958) [#971](https://github.com/XiaoMi/hiui/issues/971) [#973](https://github.com/XiaoMi/hiui/issues/973) [#975](https://github.com/XiaoMi/hiui/issues/975) [#976](https://github.com/XiaoMi/hiui/issues/976) [#977](https://github.com/XiaoMi/hiui/issues/977) [#983](https://github.com/XiaoMi/hiui/issues/983)[#987](https://github.com/XiaoMi/hiui/issues/987)
+
 ## 2.9.0
 
 - 新增 `<Progress />` active 属性展示加载动效 [#941](https://github.com/XiaoMi/hiui/issues/941)
 - 新增 `<Upload />` 拖拽用法支持多选上传 [#942](https://github.com/XiaoMi/hiui/issues/942)
-- 新增 `<DatePicker />`  disabledDate 属性自定义日期禁选 [#943](https://github.com/XiaoMi/hiui/issues/943)
+- 新增 `<DatePicker />` disabledDate 属性自定义日期禁选 [#943](https://github.com/XiaoMi/hiui/issues/943)
 - 优化 `<Collapse />` 视觉效果 [#937](https://github.com/XiaoMi/hiui/issues/937)
 - 修复 `<Dropdown />` 点击外部区域不能正常隐藏菜单的问题 [#947](https://github.com/XiaoMi/hiui/issues/947)
 - 修复`<Upload />`同时上传多个文件的展示问题 [#948](https://github.com/XiaoMi/hiui/issues/948)
@@ -17,8 +25,8 @@
 - 新增 `<Table />` withCredentials 属性 [#922](https://github.com/XiaoMi/hiui/issues/922)
 - 修复 `<Transfer />` 单选模式下 targetLimit 无效的问题 [#919](https://github.com/XiaoMi/hiui/issues/919)
 - 修复 `<Select />` 多选出现双滚动条的样式问题 [#920](https://github.com/XiaoMi/hiui/issues/920)
-- 修复 `<Button />`  链接用法样式问题 [#923](https://github.com/XiaoMi/hiui/issues/923)
-- 修复 `<Dropdown />`  按钮样式 icon 边距问题 [#927](https://github.com/XiaoMi/hiui/issues/927)
+- 修复 `<Button />` 链接用法样式问题 [#923](https://github.com/XiaoMi/hiui/issues/923)
+- 修复 `<Dropdown />` 按钮样式 icon 边距问题 [#927](https://github.com/XiaoMi/hiui/issues/927)
 - 修复主题配色适配组件不完全的问题 [#733](https://github.com/XiaoMi/hiui/issues/733)
 
 ## 2.7.0