style(uploader): 样式优化

src/packages/__VUE/uploader/index.scss

@@ -80,20 +80,28 @@
       display: flex;
       flex-direction: column;
       position: relative;
-      padding-right: 20px;
       .nut-uploader__preview-img__file__name {
-        -webkit-line-clamp: 1;
-        padding: 2px;
-        height: 24px;
+        padding: 2px 4px;
         display: flex;
         align-items: center;
+        height: 100%;
+        .file__name_tips {
+          margin-left: 4px;
+          padding: 0 20px;
+          @include oneline-ellipsis();
+        }
       }
 
       .nut-uploader__preview-img__file__del {
         position: absolute;
-        right: 4px;
+        right: 6px;
         top: 6px;
       }
+      .nut-uploader__preview-img__file__link {
+        position: absolute;
+        left: 6px;
+        top: 8px;
+      }
       .nut-progress {
         position: absolute;
         left: 0;
@@ -148,20 +156,17 @@
           width: 100%;
           font-size: 12px;
           color: $text-color;
+          padding: 10px;
+          height: 100%;
+          overflow: hidden;
+          box-sizing: border-box;
+          align-items: center;
           &.error {
             color: red !important;
           }
           &.success {
             color: #1890ff !important;
           }
-          .nut-icon-link {
-            &::before {
-              margin-left: -25%;
-              margin-top: -25%;
-              transform: none;
-            }
-          }
-          @include moreline-ellipsis();
         }
       }
     }

src/packages/__VUE/uploader/index.taro.vue

@@ -29,16 +29,17 @@
         />
         <view v-else class="nut-uploader__preview-img__file">
           <view class="nut-uploader__preview-img__file__name" @click="fileItemClick(item)">
-            <Link color="#808080" />&nbsp;{{ item.name }}
+            <view class="file__name_tips">{{ item.name }}</view>
           </view>
         </view>
         <view class="tips">{{ item.name }}</view>
       </view>
       <view class="nut-uploader__preview-list" v-else-if="listType == 'list'">
         <view class="nut-uploader__preview-img__file__name" @click="fileItemClick(item)" :class="[item.status]">
-          <Link />&nbsp;{{ item.name }}
+          <Link class="nut-uploader__preview-img__file__link" />
+          <view class="file__name_tips">{{ item.name }}</view>
+          <Del color="#808080" class="nut-uploader__preview-img__file__del" @click="onDelete(item, index)"></Del>
         </view>
-        <Del color="#808080" class="nut-uploader__preview-img__file__del" @click="onDelete(item, index)"></Del>
 
         <nut-progress
           size="small"

src/packages/__VUE/uploader/index.vue

@@ -27,7 +27,7 @@
         />
         <view v-else class="nut-uploader__preview-img__file">
           <view @click="fileItemClick(item)" class="nut-uploader__preview-img__file__name">
-            <Link color="#808080" />&nbsp;{{ item.name }}
+            <view class="file__name_tips">{{ item.name }}</view>
           </view>
         </view>
 
@@ -36,9 +36,10 @@
 
       <view class="nut-uploader__preview-list" v-else-if="listType == 'list'">
         <view @click="fileItemClick(item)" class="nut-uploader__preview-img__file__name" :class="[item.status]">
-          <Link />&nbsp;{{ item.name }}
+          <Link class="nut-uploader__preview-img__file__link" />
+          <view class="file__name_tips">{{ item.name }}</view>
+          <Del color="#808080" class="nut-uploader__preview-img__file__del" @click="onDelete(item, index)"></Del>
         </view>
-        <Del color="#808080" class="nut-uploader__preview-img__file__del" @click="onDelete(item, index)"></Del>
 
         <nut-progress
           size="small"