修复文件bug

ruoyi-ui/src/views/oa/task/allocation/index.vue

@@ -42,8 +42,8 @@
       <span @click="gotoPurchase" style="cursor: pointer;">如要发放采购相关需求请移步采购需求管理(点击此处快速跳转)</span>
     </el-alert>
 
-    <el-row :gutter="20" v-loading="loading">
-      <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" v-for="item in taskList" :key="item.taskId">
+    <el-row :gutter="10" v-loading="loading">
+      <el-col class="task-col" v-for="item in taskList" :key="item.taskId">
         <el-card class="task-card" shadow="hover" @click.native="handleLookTask(item)">
           <!-- 卡片头部 -->
           <template slot="header">
@@ -99,6 +99,11 @@
               </div>
               <span v-else>{{ item.workerNickName }}</span>
             </div>
+            <div class="info-item attachment-row" @click.stop>
+              <span class="info-label">附件：</span>
+              <file-preview v-if="item.accessory" :value="item.accessory" class="card-attachment" />
+              <el-tag v-else type="info" size="mini">无附件</el-tag>
+            </div>
           </div>
 
           <!-- 卡片底部操作按钮 -->
@@ -352,11 +357,7 @@
               附件
             </template>
             <div class="attachment-box">
-              <div v-if="form.accessory" class="attachment-item">
-                <el-link :href="form.accessory" :underline="false" target="_blank">
-                  <i class="el-icon-document"></i> 查看附件
-                </el-link>
-              </div>
+              <file-preview v-if="form.accessory" v-model="form.accessory" />
               <div v-else class="no-attachment">暂无附件...</div>
             </div>
           </el-descriptions-item>
@@ -374,6 +375,7 @@ import { addTask, delTask, getTask, listTask, updateTask } from "@/api/oa/task";
 import { deptTreeSelect, selectUser } from "@/api/system/user";
 import UserSelect from "@/components/UserSelect";
 import ProjectSelect from "@/components/fad-service/ProjectSelect";
+import FilePreview from "@/components/FilePreview";
 import OperationLogDrawer from "@/views/oa/project/operationLog/OperationLogDrawer.vue";
 
 
@@ -382,6 +384,7 @@ export default {
   components: {
     UserSelect,
     ProjectSelect,
+    FilePreview,
     OperationLogDrawer
   },
   dicts: ['sys_project_type', 'sys_project_status', 'sys_work_type', 'sys_sort_grade'],
@@ -426,7 +429,7 @@ export default {
       // 查询参数
       queryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 20,
         searchTime: [],
       },
       userList: [],
@@ -765,12 +768,116 @@ export default {
 </script>
 
 <style scoped>
+.task-col {
+  flex: 0 0 20%;
+  max-width: 20%;
+}
+
 .task-card {
-  margin-bottom: 20px;
-  height: 320px;
+  margin-bottom: 12px;
+  height: 300px;
   /* 固定卡片高度 */
   display: flex;
   flex-direction: column;
+  font-size: 12px;
+}
+
+.task-card >>> .el-card__header {
+  padding: 10px 12px;
+}
+
+.task-card >>> .el-card__body {
+  padding: 10px 12px;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+}
+
+.task-card .task-title {
+  font-size: 13px;
+}
+
+.task-card .info-label {
+  font-size: 12px;
+  min-width: 56px;
+}
+
+.task-card .info-item {
+  margin-bottom: 6px;
+}
+
+.task-card .card-footer .el-button {
+  margin-right: 4px;
+  padding: 4px 2px;
+  font-size: 12px;
+}
+
+@media (max-width: 1366px) {
+  .task-col {
+    flex: 0 0 25%;
+    max-width: 25%;
+  }
+}
+
+@media (max-width: 992px) {
+  .task-col {
+    flex: 0 0 33.3333%;
+    max-width: 33.3333%;
+  }
+}
+
+@media (max-width: 768px) {
+  .task-col {
+    flex: 0 0 50%;
+    max-width: 50%;
+  }
+}
+
+@media (max-width: 480px) {
+  .task-col {
+    flex: 0 0 100%;
+    max-width: 100%;
+  }
+}
+
+.attachment-row {
+  align-items: flex-start;
+}
+
+.card-attachment {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+}
+
+.card-attachment >>> .el-upload-list__item {
+  margin: 0;
+  border: none;
+  padding: 0;
+  background: transparent;
+  line-height: 1.4;
+}
+
+.card-attachment >>> .el-upload-list__item:hover {
+  background: transparent;
+}
+
+.card-attachment >>> .ele-upload-list__item-content-action {
+  display: none;
+}
+
+.card-attachment >>> .el-upload-list__item:hover .ele-upload-list__item-content-action {
+  display: flex;
+  gap: 4px;
+}
+
+.card-attachment >>> .el-icon-document {
+  color: #409eff;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 100%;
 }
 
 .card-header {
@@ -817,6 +924,7 @@ export default {
   padding: 10px 0;
   flex: 1;
   overflow-y: auto;
+  min-height: 0;
 }
 
 .info-item {