暂存

src/components/photoWall/index.vue

@@ -24,44 +24,33 @@
         <a-popover v-else :open="hovered == index" @openChange="handleHoverChange($event, index)">
           <template #content>
             <div style="width: 200px; padding: 8px;">
-              <div style="font-weight: bold; margin-bottom: 4px;">{{ item.document || '文件' }}</div>
-              <div style="color: #999; font-size: 12px;">{{ getFileSize(item.filesize) }}</div>
+              <div style="font-weight: bold; margin-bottom: 4px; word-break: break-word;">{{ item.document || '文件' }}
+              </div>
+              <div style="color: #999; font-size: 12px;">{{ getFileSize(item.contentlength) }}</div>
             </div>
           </template>
-          <!-- 图片文件：使用图片预览 -->
-          <div v-if="isImageFile(item)" style="width: 100%; height: 100%; position: relative;"
-            @click="openImagePreview(index)">
-            <a-image :src="item.cover" :style="{
+          <div
+            style="display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; position: relative; cursor: pointer; overflow: hidden;">
+            <a-image v-if="isImageFile(item)" :preview="false" :src="item.cover" :style="{
               width: '100%',
               height: '100%',
               objectFit: 'cover',
             }" />
-            <!-- 删除按钮 -->
-            <div v-if="!props.disabled && isDeletable" style="position: absolute; top: 4px; right: 4px;" @click.stop>
-              <a-popconfirm :open="linksid == item.linksid" title="确定删除当前资源吗?" @confirm="confirmDeleteImage"
-                @cancel="linksid = null">
-                <DeleteOutlined class="previewMaskIcon" :style="{ fontSize: '18px', color: '#ff4d4f' }"
-                  @click.stop="linksid = item.linksid" />
-              </a-popconfirm>
-            </div>
-          </div>
-          <!-- 非图片文件：显示文件图标和点击下载 -->
-          <div v-else
-            style="display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; position: relative; cursor: pointer;"
-            @click.stop="handleFileClick(item)">
             <!-- 视频且有封面图：显示封面图 -->
-            <template v-if="item.fileType && item.fileType.toLowerCase() === 'video' && hasCoverImage(item)">
-              <a-image v-if="getCoverImage(item).url" :preview="false" :src="getCoverImage(item).url" :style="{
-                width: '100%',
-                height: '100%',
-                objectFit: 'cover',
-              }" />
-              <!-- 播放图标 -->
-              <div
-                style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; pointer-events: none;">
+            <template v-else-if="item.fileType && item.fileType.toLowerCase() === 'video' && hasCoverImage(item)">
+              <div @click.stop="handleFileClick(item)">
+                <a-image v-if="getCoverImage(item).url" :preview="false" :src="getCoverImage(item).url" :style="{
+                  width: '100%',
+                  height: '100%',
+                  objectFit: 'cover',
+                }" />
+                <!-- 播放图标 -->
                 <div
-                  style="width: 100%; height: 100%; background: rgba(0,0,0,0.5); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
-                  <component :is="PlayCircleOutlined" :style="{ fontSize: '36px', color: '#fff' }" />
+                  style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; pointer-events: none;">
+                  <div
+                    style="width: 100%; height: 100%; background: rgba(0,0,0,0.5); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
+                    <component :is="PlayCircleOutlined" :style="{ fontSize: '36px', color: '#fff' }" />
+                  </div>
                 </div>
               </div>
             </template>
@@ -69,7 +58,7 @@
             <template v-else>
               <component :is="getFileIcon(item)"
                 :style="{ fontSize: (baseSize > 100 ? '48px' : '36px'), color: '#1890ff' }" />
-              <div
+              <div @click.stop="handleFileClick(item)"
                 style="font-size: 12px; color: #666; margin-top: 8px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 90%;">
                 {{ item.document || '文件' }}
               </div>
@@ -95,7 +84,8 @@
     <a-modal v-model:open="videoVisible" :title="videoTitle" :footer="null" width="800px" centered>
       <div style="padding: 20px 0 20px 0;">
         <div style="display: flex; justify-content: center; background: #000; padding: 20px; border-radius: 8px;">
-          <video :src="videoUrl" controls autoplay style="max-width: 100%; max-height: 60vh;" @ended="onVideoEnded" />
+          <video :src="videoUrl" controls autoplay style="max-width: 100%; max-height: 60vh; max-width: 60vh;"
+            @ended="onVideoEnded" />
         </div>
       </div>
       <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;">
@@ -110,24 +100,6 @@
         </a-button>
       </div>
     </a-modal>
-
-    <!-- 图片预览对话框 -->
-    <a-modal v-model:open="imagePreviewVisible" :footer="null" width="90%" centered :closable="true">
-      <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;">
-        <a-button @click="switchImage(-1)" :disabled="currentImageIndex <= 0">
-          <template #icon><left-outlined /></template>
-          上一个
-        </a-button>
-        <span style="font-size: 14px; color: #666;">{{ currentImageIndex + 1 }} / {{ imageList.length }}</span>
-        <a-button @click="switchImage(1)" :disabled="currentImageIndex >= imageList.length - 1">
-          下一个
-          <template #icon><right-outlined /></template>
-        </a-button>
-      </div>
-      <div style="display: flex; justify-content: center;">
-        <a-image :src="currentImageUrl" style="max-width: 100%; max-height: 80vh;" />
-      </div>
-    </a-modal>
   </div>
 </template>
 
@@ -327,29 +299,6 @@ function onVideoEnded() {
   // 播放结束自动切换到下一个
   switchVideo(1);
 }
-
-// 图片预览相关
-let imagePreviewVisible = ref(false);
-let currentImageUrl = ref('');
-let currentImageIndex = ref(0);
-let imageList = ref([]);
-
-function openImagePreview(index) {
-  // 获取所有图片列表
-  imageList.value = list.value.filter(v => isImageFile(v));
-  currentImageIndex.value = index;
-  currentImageUrl.value = imageList.value[index].url;
-  imagePreviewVisible.value = true;
-}
-
-function switchImage(direction) {
-  const newIndex = currentImageIndex.value + direction;
-  if (newIndex >= 0 && newIndex < imageList.value.length) {
-    currentImageIndex.value = newIndex;
-    currentImageUrl.value = imageList.value[newIndex].url;
-  }
-}
-
 function beforeUpload(file) {
   // 文档类型（type === 4）：禁止上传图片和视频
   const type = Number(props.fileType);
@@ -381,16 +330,13 @@ function beforeUpload(file) {
   }).then((res) => {
     if (res.code != 1)
       return (list.value[file.sequence].exception = "exception");
-    console.log("获取上传链接", res);
     const { uploadurl, serialfilename } = res.data;
-    console.log("uploadurl:", uploadurl, "serialfilename:", serialfilename);
     // 根据文件扩展名获取正确的 MIME 类型
     const ext = file.name.toLowerCase().split('.').pop();
     const mimeTypes = {
       pdf: 'application/pdf',
     };
     const contentType = mimeTypes[ext] || 'application/octet-stream';
-    console.log("文件类型:", contentType);
     Up.upload(uploadurl, file, {
       headers: {
         "Content-Type": contentType,
@@ -400,7 +346,6 @@ function beforeUpload(file) {
         console.log(list.value[file.sequence]);
       },
     }).then((upload) => {
-      console.log("上传结果", upload);
       if (upload.status != 200)
         return (list.value[file.sequence].exception = "exception");
       Api.requested({
@@ -413,10 +358,11 @@ function beforeUpload(file) {
           usetype: "file",
         },
       }).then((feedback) => {
-        console.log("feedback", feedback);
+        console.log("上传成功反馈", feedback);
         if (feedback.code != 1)
           return (list.value[file.sequence].exception = "exception");
         const attachmentid = feedback.data.attachmentids[0];
+        return
         Api.requested({
           id: 20240407135802,
           content: {
@@ -426,35 +372,38 @@ function beforeUpload(file) {
             sequence: file.sequence,
           },
         }).then((binding) => {
-          console.log(binding, "binding");
+          console.log("绑定", binding);
           if (binding.code != 1)
             return (list.value[file.sequence].exception = "exception");
-          Api.requested({
-            id: "20240407140002",
-            content: {
-              ownerid: props.ownerid,
-              ownertable: props.ownertable,
-              pageNumber: 1,
-              pageSize: 100,
-              where: {
-                // condition: serialfilename,
-              },
-            },
-          }).then((getList) => {
-            if (getList.code != 1)
-              return (list.value[file.sequence].exception = "exception");
-            list.value[file.sequence] = getList.data
-              .filter((v) => v.attachmentid == attachmentid)
-              .map((v) => {
-                if (v.attinfos && v.attinfos.length) {
-                  v = Object.assign(v, v.attinfos[0]);
-                  delete v.attinfos;
-                }
-                const subfile = v.subfiles && v.subfiles.length ? v.subfiles.find((s) => s.type == props.coverType) : null;
-                v.cover = props.coverType && subfile ? subfile.url : v.url;
-                return v;
-              })[0];
-          });
+
+
+          // Api.requested({
+          //   id: "20240407140002",
+          //   content: {
+          //     ownerid: props.ownerid,
+          //     ownertable: props.ownertable,
+          //     pageNumber: 1,
+          //     pageSize: 100,
+          //     where: {
+          //       // condition: serialfilename,
+          //     },
+          //   },
+          // })
+          // .then((getList) => {
+          //   if (getList.code != 1)
+          //     return (list.value[file.sequence].exception = "exception");
+          //   list.value[file.sequence] = getList.data
+          //     .filter((v) => v.attachmentid == attachmentid)
+          //     .map((v) => {
+          //       if (v.attinfos && v.attinfos.length) {
+          //         v = Object.assign(v, v.attinfos[0]);
+          //         delete v.attinfos;
+          //       }
+          //       const subfile = v.subfiles && v.subfiles.length ? v.subfiles.find((s) => s.type == props.coverType) : null;
+          //       v.cover = props.coverType && subfile ? subfile.url : v.url;
+          //       return v;
+          //     })[0];
+          // });
         });
       });
     });