只读用户只显示权限目录

README.md

@@ -469,3 +469,8 @@ GUEST=public/
     - 确认已先复制文件到剪贴板
     - 检查用户权限是否允许写操作
     - 移动端查看底部是否显示粘贴工具栏
+
+---
+
++ **当前版本修复了只读用户显示所有目录的bug，只显示权限目录**
++ **文件名高度不够，已修复**

assets/App.vue

@@ -226,7 +226,28 @@
             <div class="file-icon">
               <svg  viewBox="0 0 576 512"
                 xmlns="http://www.w3.org/2000/svg" width="36" height="36">
-                <path d="M384 480l48 0c11.4 0 21.9-6 27.6-15.9l112-192c5.8-9.9 5.8-22.1 .1-32.1S555.5 224 544 224l-400 0c-11.4 0-21.9 6-27.6 15.9L48 357.1 48 96c0-8.8 7.2-16 16-16l117.5 0c4.2 0 8.3 1.7 11.3 4.7l26.5 26.5c21 21 49.5 32.8 79.2 32.8L416 144c8.8 0 16 7.2 16 16l0 32 48 0 0-32c0-35.3-28.7-64-64-64L298.5 96c-17 0-33.3-6.7-45.3-18.7L226.7 50.7c-12-12-28.3-18.7-45.3-18.7L64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l23.7 0L384 480z"/>
+                <defs>
+                  <!-- Blue Gradient for the main body -->
+                  <linearGradient id="mainGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+                    <stop offset="0%" stop-color="#4A90E2"/>>
+                    <stop offset="100%" stop-color="#007AFF"/>>
+                  </linearGradient>
+                  <!-- Lighter Gradient for the folder flap/tab -->
+                  <linearGradient id="flapGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+                    <stop offset="0%" stop-color="#74B9FF"/>>
+                    <stop offset="100%" stop-color="#4A90E2"/>>
+                  </linearGradient>
+                  <!-- Filter for subtle outer glow/shadow -->
+                  <filter id="shadow" x="-5%" y="-5%" width="110%" height="110%">
+                    <feGaussianBlur in="SourceAlpha" stdDeviation="4"/>>
+                    <feOffset dx="0" dy="2"/>>
+                    <feMerge>
+                        <feMergeNode/>
+                        <feMergeNode in="SourceGraphic"/>>
+                    </feMerge>
+                  </filter>
+                </defs>
+                <path fill="url(#flapGradient)" d="M384 480l48 0c11.4 0 21.9-6 27.6-15.9l112-192c5.8-9.9 5.8-22.1 .1-32.1S555.5 224 544 224l-400 0c-11.4 0-21.9 6-27.6 15.9L48 357.1 48 96c0-8.8 7.2-16 16-16l117.5 0c4.2 0 8.3 1.7 11.3 4.7l26.5 26.5c21 21 49.5 32.8 79.2 32.8L416 144c8.8 0 16 7.2 16 16l0 32 48 0 0-32c0-35.3-28.7-64-64-64L298.5 96c-17 0-33.3-6.7-45.3-18.7L226.7 50.7c-12-12-28.3-18.7-45.3-18.7L64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l23.7 0L384 480z"/>
               </svg>
             </div>
             <div class="file-info-container"><span class="file-name">返回上级目录</span></div>
@@ -239,9 +260,36 @@
           focusedItem = folder;
           ">
             <div class="file-icon">
-              <svg  viewBox="0 0 576 512"
-                xmlns="http://www.w3.org/2000/svg" width="36" height="36">
-                <path d="M384 480l48 0c11.4 0 21.9-6 27.6-15.9l112-192c5.8-9.9 5.8-22.1 .1-32.1S555.5 224 544 224l-400 0c-11.4 0-21.9 6-27.6 15.9L48 357.1 48 96c0-8.8 7.2-16 16-16l117.5 0c4.2 0 8.3 1.7 11.3 4.7l26.5 26.5c21 21 49.5 32.8 79.2 32.8L416 144c8.8 0 16 7.2 16 16l0 32 48 0 0-32c0-35.3-28.7-64-64-64L298.5 96c-17 0-33.3-6.7-45.3-18.7L226.7 50.7c-12-12-28.3-18.7-45.3-18.7L64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l23.7 0L384 480z"/>
+              <svg xmlns="www.w3.org" viewBox="0 0 576 512">
+                <defs v-if="cwd === ''">
+                  <!-- Blue Gradient for the main body -->
+                  <linearGradient id="mainGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+                    <stop offset="0%" stop-color="#4A90E2"/>>
+                    <stop offset="100%" stop-color="#007AFF"/>>
+                  </linearGradient>
+                  <!-- Lighter Gradient for the folder flap/tab -->
+                  <linearGradient id="flapGradient" x1="0%" y1="0%" x2="0%" y2="100%">
+                    <stop offset="0%" stop-color="#74B9FF"/>>
+                    <stop offset="100%" stop-color="#4A90E2"/>>
+                  </linearGradient>
+                  <!-- Filter for subtle outer glow/shadow -->
+                  <filter id="shadow" x="-5%" y="-5%" width="110%" height="110%">
+                    <feGaussianBlur in="SourceAlpha" stdDeviation="4"/>>
+                    <feOffset dx="0" dy="2"/>>
+                    <feMerge>
+                        <feMergeNode/>
+                        <feMergeNode in="SourceGraphic"/>>
+                    </feMerge>
+                  </filter>
+                </defs>
+                <!-- The main back part of the folder (has the glow filter) -->
+                <rect x="16" y="160" width="512" height="320" rx="32" fill="url(#mainGradient)" filter="url(#shadow)"/>>
+
+                <!-- The folder flap/tab - Adjusted path to start at a rounded corner on the left -->
+                <path fill="url(#flapGradient)" d="M16 192V128c0-35.3 28.7-64 64-64H176c17 0 33.3 6.7 45.3 18.7L253.3 112c12 12 28.3 18.7 45.3 18.7H496c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H48c-17.6 0-32-14.4-32-32V192z"/>>
+
+                <!-- A subtle highlight for the flap -->
+                <path fill="#ffffff" opacity="0.2" d="M80 64H176c17 0 33.3 6.7 45.3 18.7L253.3 112c12 12 28.3 18.7 45.3 18.7H496c35.3 0 64 28.7 64 64v16H16V128c0-35.3 28.7-64 64-64z"/>>
               </svg>
             </div>
             <div class="file-info-container"><span class="file-name" v-text="folder.match(/.*?([^/]*)\/?$/)[1]"></span>
@@ -310,7 +358,7 @@
       <div
         style="height: 50px;display: flex; justify-content: center; align-items: center; padding:10px; background: #ddd; margin: 0 0 10px 0; border-radius: 8px;">
         <div v-text="focusedItem.key || focusedItem" class="contextmenu-filename" @click.stop.prevent
-          style="height:20px;width: 100%; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"></div>
+          style="width: 100%; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"></div>
       </div>
       <ul v-if="typeof focusedItem === 'string'" class="contextmenu-list">
         <li>
@@ -341,9 +389,9 @@
           </button>
         </li>
         <li>
-          <a :href="`/raw/${focusedItem.key}`" target="_blank" download>
+          <button @click="singleDownload(focusedItem.key)">
             <span>下载</span>
-          </a>
+          </button>
         </li>
         <li>
           <button @click="copyFile(focusedItem.key)">
@@ -582,7 +630,7 @@ export default {
     showUploadPopup: false,
     uploadProgress: null,
     uploadQueue: [],
-    backgroundImageUrl: "/assets/bg-light.webp",
+    backgroundImageUrl: "/assets/bg-cat.webp",
     needLogin: false,
     isGuest: true, // 默认为游客状态
     isLoggedIn: false,
@@ -766,7 +814,7 @@ export default {
 
       // 设置新的定时器，防抖处理
       this.searchTimeout = setTimeout(() => {
-        this.performSearch();
+        this.performGlobalSearch(this.search.trim());
       }, 300);
     },
 
@@ -816,6 +864,10 @@ export default {
     copyLink(link) {
       const url = new URL(link, window.location.origin);
       navigator.clipboard.writeText(url.toString());
+
+      this.showCustomToast('文件链接已复制到剪贴板', 'success');
+      // 关闭右键菜单
+      this.showContextMenu = false;
     },
 
     // 复制单个文件到剪贴板
@@ -1762,7 +1814,8 @@ export default {
       mediaList = mediaList.map(file => ({
         ...file,
         url: `/raw/${file.key}`,
-        name: file.key.split('/').pop()
+        name: file.key.split('/').pop(),
+        size: file.size
       }));
 
       // 找到点击文件的索引
@@ -1791,6 +1844,9 @@ export default {
         return;
       }
 
+      // 关闭右键菜单
+      this.showContextMenu = false;
+
       try {
         // 检查是否是多文件粘贴
         if (Array.isArray(this.clipboard)) {
@@ -1949,6 +2005,9 @@ export default {
         this.showPermissionDialog('删除文件');
         return;
       }
+
+      // 关闭右键菜单
+      this.showContextMenu = false;
 
       try {
         const fileName = key.split('/').pop();
@@ -1975,13 +2034,32 @@ export default {
       }
     },
 
+    async singleDownload(key){
+      // 关闭右键菜单
+      this.showContextMenu = false;
+
+      try {
+        const link = document.createElement('a');
+        link.href = `/raw/${key}`;
+        link.download = key.split('/').pop();
+        link.click();
+        this.showCustomToast(`开始下载文件`, 'success');
+      }catch (error) {
+        this.showCustomToast('文件下载失败: ' + error.message, 'error');
+      }
+
+    },
+
     async renameFile(key) {
       // 检查写权限
       if (!this.canWrite) {
         this.showPermissionDialog('重命名文件');
         return;
       }
 
+      // 关闭右键菜单
+      this.showContextMenu = false;
+
       try {
         const currentName = key.split('/').pop();
         const newName = await this.showInputPrompt("重命名文件", "新名称:", currentName);
@@ -2010,6 +2088,9 @@ export default {
         return;
       }
 
+      // 关闭右键菜单
+      this.showContextMenu = false;
+
       let targetPath = null; // 声明在外层作用域，以便错误处理时使用
 
       console.log('🚀 开始移动文件:', key);

assets/Footer.vue

@@ -20,6 +20,8 @@
     </div>
 
     <div class="project-links">
+      <strong>到这已经是第四开了:</strong><a href="https://github.com/marktube/FlareDrive-R2" target="_blank"
+        rel="noopener noreferrer">FlareDrive-R2增强优化版</a>
       <strong>到这已经是第三开了:</strong><a href="https://github.com/52op/FlareDrive-R2" target="_blank"
         rel="noopener noreferrer">FlareDrive-R2增强版</a>
       <strong>感谢:</strong><a href="https://github.com/willow-god/FlareDrive-R2" target="_blank"
@@ -40,10 +42,10 @@ export default {
   name: "Footer",
   data() {
     return {
-      homeUrl: "https://www.sztcrs.com/",
-      blogUrl: "https://blog.sztcrs.com/",
-      githubUrl: "https://github.com/52op",
-      emailUrl: "mailto:admin@sztcrs.com"
+      homeUrl: "https://blog.liuyc.uk/about.html",
+      blogUrl: "https://blog.liuyc.uk/",
+      githubUrl: "https://github.com/marktube",
+      emailUrl: "mailto:liuyc@sem.tsinghua.edu.cn"
     };
   }
 };
@@ -117,4 +119,4 @@ export default {
 .powered a:hover {
   color: #222;
 }
-</style>
+</style>

assets/MediaPreview.vue

@@ -15,7 +15,7 @@
       </div>
 
       <!-- 图片预览 -->
-      <div v-else-if="isImage" class="image-viewer">
+      <div v-else-if="isImage" class="image-viewer" id="pr-img-view">
         <img
           :src="currentMedia.url"
           :alt="currentMedia.name"
@@ -154,7 +154,7 @@
         </div>
 
         <!-- 底部控制栏 - 仅显示图片控制按钮 -->
-        <div v-if="isImage" class="bottom-controls">
+        <div v-if="isImage && isShowBottom" class="bottom-controls">
           <!-- 图片控制按钮 -->
           <div class="image-controls">
             <button class="control-btn" @click="zoomOut" title="缩小">
@@ -182,6 +182,14 @@
                 <path d="M12,3A9,9 0 0,1 21,12A9,9 0 0,1 12,21A9,9 0 0,1 3,12A9,9 0 0,1 12,3M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7M12,9A3,3 0 0,1 15,12A3,3 0 0,1 12,15A3,3 0 0,1 9,12A3,3 0 0,1 12,9Z" />
               </svg>
             </button>
+
+            <button v-if="this.currentMedia.size > 30 * 1024 * 1024" class="control-btn" @click="panoImage" title="全景模式">
+              <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor">
+                <path
+                  d="M11.447 8.894a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm0 1.789a1 1 0 1 0 .894-1.789l-.894 1.789zM7.447 7.106a1 1 0 1 0-.894 1.789l.894-1.789zM10 9a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0H8zm9.447-5.606a1 1 0 1 0-.894-1.789l.894 1.789zm-2.894-.789a1 1 0 1 0 .894 1.789l-.894-1.789zm2 .789a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zM18 5a1 1 0 1 0-2 0h2zm-2 2.5a1 1 0 1 0 2 0h-2zm-5.447-4.606a1 1 0 1 0 .894-1.789l-.894 1.789zM9 1l.447-.894a1 1 0 0 0-.894 0L9 1zm-2.447.106a1 1 0 1 0 .894 1.789l-.894-1.789zm-6 3a1 1 0 1 0 .894 1.789L.553 4.106zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zm-2-.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 2.789a1 1 0 1 0 .894-1.789l-.894 1.789zM2 5a1 1 0 1 0-2 0h2zM0 7.5a1 1 0 1 0 2 0H0zm8.553 12.394a1 1 0 1 0 .894-1.789l-.894 1.789zm-1.106-2.789a1 1 0 1 0-.894 1.789l.894-1.789zm1.106 1a1 1 0 1 0 .894 1.789l-.894-1.789zm2.894.789a1 1 0 1 0-.894-1.789l.894 1.789zM8 19a1 1 0 1 0 2 0H8zm2-2.5a1 1 0 1 0-2 0h2zm-7.447.394a1 1 0 1 0 .894-1.789l-.894 1.789zM1 15H0a1 1 0 0 0 .553.894L1 15zm1-2.5a1 1 0 1 0-2 0h2zm12.553 2.606a1 1 0 1 0 .894 1.789l-.894-1.789zM17 15l.447.894A1 1 0 0 0 18 15h-1zm1-2.5a1 1 0 1 0-2 0h2zm-7.447-5.394l-2 1 .894 1.789 2-1-.894-1.789zm-1.106 1l-2-1-.894 1.789 2 1 .894-1.789zM8 9v2.5h2V9H8zm8.553-4.894l-2 1 .894 1.789 2-1-.894-1.789zm.894 0l-2-1-.894 1.789 2 1 .894-1.789zM16 5v2.5h2V5h-2zm-4.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zm-2.894-1l-2 1 .894 1.789 2-1L8.553.106zM1.447 5.894l2-1-.894-1.789-2 1 .894 1.789zm-.894 0l2 1 .894-1.789-2-1-.894 1.789zM0 5v2.5h2V5H0zm9.447 13.106l-2-1-.894 1.789 2 1 .894-1.789zm0 1.789l2-1-.894-1.789-2 1 .894 1.789zM10 19v-2.5H8V19h2zm-6.553-3.894l-2-1-.894 1.789 2 1 .894-1.789zM2 15v-2.5H0V15h2zm13.447 1.894l2-1-.894-1.789-2 1 .894 1.789zM18 15v-2.5h-2V15h2z"
+                />
+              </svg>
+            </button>
           </div>
         </div>
 
@@ -274,7 +282,10 @@ export default {
 
       // 控制栏自动隐藏
       controlsAutoHide: false,
-      controlsHideTimer: null
+      controlsHideTimer: null,
+
+      // 是否显示底部控制栏
+      isShowBottom: true
     }
   },
   computed: {
@@ -345,6 +356,7 @@ export default {
         // 计算在过滤后列表中的正确索引
         this.currentIndex = this.filteredCurrentIndex;
         this.loading = true; // 显示时开始加载
+        this.isShowBottom = true;
         this.error = false;
         this.resetImage();
         this.detectMobile();
@@ -416,11 +428,13 @@ export default {
     // 导航控制
     previousMedia() {
       if (this.currentIndex > 0) {
+        this.isShowBottom = true;
         this.currentIndex--;
       }
     },
     nextMedia() {
       if (this.currentIndex < this.filteredMediaList.length - 1) {
+        this.isShowBottom = true;
         this.currentIndex++;
       }
     },
@@ -441,6 +455,16 @@ export default {
       this.translateX = 0;
       this.translateY = 0;
     },
+    panoImage() {
+      document.getElementById("pr-img-view").innerHTML = "";
+      this.isShowBottom = false;
+      pannellum.viewer('pr-img-view', {
+        "type": "equirectangular",
+        "panorama": this.currentMedia.url,
+        "showFullscreenCtrl": true,
+        "autoLoad": true
+      });
+    },
 
     // 双击放大
     onDoubleClick() {

assets/main.css

@@ -103,7 +103,7 @@ input[type="search"] {
 .file-name,
 .contextmenu-filename {
   display: block;
-  height: 20px;
+  height: 23px;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
@@ -508,6 +508,7 @@ button {
   color: #333;
   font-weight: 500;
   overflow: hidden;
+  padding-bottom: 2px;
   text-overflow: ellipsis;
 }
 

functions/api/children/[[path]].ts

@@ -77,6 +77,34 @@ export async function onRequestGet(context) {
               return false;
             });
           }
+        }else if(account && context.env[account + ':r']){
+          // 处理只读用户
+          const allow = context.env[account + ':r'].split(",");
+
+          // 获取游客权限，已登录用户也应该能访问游客目录
+          const guestEnv = context.env["GUEST"] || context.env["guest"];
+          const allow_guest = guestEnv ? guestEnv.split(",") : [];
+
+          // 合并用户权限和游客权限
+          const combinedPermissions = [...allow, ...allow_guest];
+
+          // 过滤文件：显示用户有权限的文件 + 游客可访问的文件
+          objKeys = objKeys.filter(file => {
+            for (var a of combinedPermissions) {
+              if (a == "*") return true;
+              if (file.key.startsWith(a)) return true;
+            }
+            return false;
+          });
+
+          // 过滤文件夹：显示用户有权限的文件夹 + 游客可访问的文件夹
+          folders = folders.filter(folder => {
+            for (var a of combinedPermissions) {
+              if (a == "*") return true;
+              if (folder.startsWith(a)) return true;
+            }
+            return false;
+          });
         }
       }
     } else {

index.html

@@ -13,6 +13,8 @@
     <link rel="stylesheet" href="/assets/main.css" />
     <link rel="manifest" href="/assets/manifest.json" />
     <link rel="icon" type="image/png" href="/favicon.ico" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.css"/>
+    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pannellum@2.5.6/build/pannellum.js"></script>
   </head>
   <body>
     <div id="app"></div>