fix: upload file style

Author: wangdan-fit2cloud

ui/src/components/ai-chat/component/chat-input-operate/index.vue

@@ -31,23 +31,25 @@
                 class="file cursor"
               >
                 <div
-                  class="flex align-center"
+                  class="flex-between align-center"
                   @mouseenter.stop="mouseenter(item)"
                   @mouseleave.stop="mouseleave()"
                 >
+                  <div class="flex align-center">
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
+                    <div class="ml-4 ellipsis-1" :title="item && item?.name">
+                      {{ item && item?.name }}
+                    </div>
+                  </div>
                   <div
                     @click="deleteFile(index, 'document')"
                     class="delete-icon color-secondary"
                     v-if="showDelete === item.url"
                   >
-                    <el-icon>
+                    <el-icon style="font-size: 16px; top: 2px">
                       <CircleCloseFilled />
                     </el-icon>
                   </div>
-                  <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
-                  <div class="ml-4 ellipsis-1" :title="item && item?.name">
-                    {{ item && item?.name }}
-                  </div>
                 </div>
               </el-card>
             </el-col>
@@ -67,23 +69,25 @@
                 class="file cursor"
               >
                 <div
-                  class="flex align-center"
+                  class="flex-between align-center"
                   @mouseenter.stop="mouseenter(item)"
                   @mouseleave.stop="mouseleave()"
                 >
+                  <div class="flex align-center">
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
+                    <div class="ml-4 ellipsis-1" :title="item && item?.name">
+                      {{ item && item?.name }}
+                    </div>
+                  </div>
                   <div
                     @click="deleteFile(index, 'document')"
                     class="delete-icon color-secondary"
                     v-if="showDelete === item.url"
                   >
-                    <el-icon>
+                    <el-icon style="font-size: 16px; top: 2px">
                       <CircleCloseFilled />
                     </el-icon>
                   </div>
-                  <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
-                  <div class="ml-4 ellipsis-1" :title="item && item?.name">
-                    {{ item && item?.name }}
-                  </div>
                 </div>
               </el-card>
             </el-col>
@@ -100,31 +104,33 @@
             >
               <el-card shadow="never" style="--el-card-padding: 8px" class="file cursor">
                 <div
-                  class="flex align-center"
+                  class="flex-between align-center"
                   @mouseenter.stop="mouseenter(item)"
                   @mouseleave.stop="mouseleave()"
                 >
+                  <div class="flex align-center">
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
+                    <div class="ml-4 ellipsis-1" :title="item && item?.name">
+                      {{ item && item?.name }}
+                    </div>
+                  </div>
                   <div
                     @click="deleteFile(index, 'audio')"
                     class="delete-icon color-secondary"
                     v-if="showDelete === item.url"
                   >
-                    <el-icon>
+                    <el-icon style="font-size: 16px; top: 2px">
                       <CircleCloseFilled />
                     </el-icon>
                   </div>
-                  <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
-                  <div class="ml-4 ellipsis-1" :title="item && item?.name">
-                    {{ item && item?.name }}
-                  </div>
                 </div>
               </el-card>
             </el-col>
           </el-row>
           <el-space wrap>
             <template v-for="(item, index) in uploadImageList" :key="index">
               <div
-                class="file cursor border border-r-4"
+                class="file file-image cursor border border-r-4"
                 v-if="item.url"
                 @mouseenter.stop="mouseenter(item)"
                 @mouseleave.stop="mouseleave()"
@@ -134,7 +140,7 @@
                   class="delete-icon color-secondary"
                   v-if="showDelete === item.url"
                 >
-                  <el-icon>
+                  <el-icon style="font-size: 16px; top: 2px">
                     <CircleCloseFilled />
                   </el-icon>
                 </div>
@@ -939,7 +945,7 @@ onMounted(() => {
         }
       }
     }
-    .file {
+    .file-image {
       position: relative;
       overflow: inherit;
 

ui/src/workflow/nodes/base-node/component/FileUploadSettingDialog.vue

@@ -136,7 +136,7 @@
         >
           <div class="flex-between">
             <div class="flex align-center">
-              <img class="mr-12" src="@/assets/icon_file-doc.svg" alt="" />
+              <img class="mr-12" :width="32" src="@/assets/fileType/unknown-icon.svg" alt="" />
               <div>
                 <p class="line-height-22 mt-4">
                   {{ $t('common.fileUpload.other') }}