fix bugs

imzlh · Jul 8, 2024 · 50a83f3 · 50a83f3
1 parent 197d1a9
commit 50a83f3
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 34 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -252,10 +252,10 @@
 			>.right {
 				position: relative;
 				overflow: hidden;
-			}
 
-			> .mobile-tool{
-				display: none;
+				> .mobile-tool{
+					display: none;
+				}
 			}
 
 			> .left-overflow{
@@ -291,23 +291,22 @@
 			>.right {
 				position: fixed;
 				width: 100% !important;
-			}
-
-			> .mobile-tool{
-				position: absolute;
-				bottom: 40%;
-				right: 0;
-				transform: translateY(-50%);
-
-				background-color: rgba(230, 222, 222, 0.6);
-				border-radius: .2rem 0 0 .2rem;
-
-				> *{
-					display: block;
-					padding: .25rem;
-					width: 1.2rem;
-					height: 1.2rem;
-					border-radius: .2rem;
+				> .mobile-tool{
+					position: absolute;
+					bottom: 40%;
+					right: 0;
+					transform: translateY(-50%);
+
+					background-color: rgba(230, 222, 222, 0.6);
+					border-radius: .2rem 0 0 .2rem;
+
+					> *{
+						display: block;
+						padding: .25rem;
+						width: 1.2rem;
+						height: 1.2rem;
+						border-radius: .2rem;
+					}
 				}
 			}
 		}

diff --git a/src/module/chooser.vue b/src/module/chooser.vue
@@ -127,8 +127,8 @@
         border-radius: .25rem;
         overflow: hidden;
         
-        width: 60vw;
-        height: 60vh;
+        width: 100vw;
+        height: 80vh;
         max-width: 35rem;
         max-height: 25rem;
         background-color: #f3f3f3;

diff --git a/src/module/tree.vue b/src/module/tree.vue
@@ -21,6 +21,14 @@
     let marked = [] as Array<FileOrDir>;
     const markmap = ref<Array<string>>([]);
 
+    let touch = {
+        x: 0,
+        y: 0,
+        mx: 0,
+        my: 0,
+        time: 0
+    }
+
     export default {
         name: 'tree',
         props: {
@@ -52,6 +60,24 @@
             };
         },
         methods: {
+            touch_start(ev:TouchEvent){
+                touch = {
+                    x: ev.touches[0].clientX, 
+                    y: ev.touches[0].clientY,
+                    mx: ev.touches[0].clientX,
+                    my: ev.touches[0].clientY,
+                    time: new Date().getTime()
+                };
+            },
+            touch_move(ev: TouchEvent){
+                touch.mx = ev.touches[0].clientX,
+                touch.my = ev.touches[0].clientY;
+            },
+            touch_end(){
+                return Math.abs(touch.mx - touch.x) < 10
+                    && Math.abs(touch.my - touch.y) < 10
+                    && new Date().getTime() - touch.time <= 600;
+            },
             desc(data:FileOrDir){
                 var tmp = data.dispName || data.name;
                 if(data.ctime > 0) tmp += '\n创建日期: ' + (new Date(data.ctime).toDateString());
@@ -283,7 +309,8 @@
 
                 <div v-else :class="['item',child.type]" :title="desc(child)"
                     @click="markup($event,child)"
-                    @touchstart.stop="openFile(child as vFile)"
+                    @touchstart="touch_start" @touchmove="touch_move"
+                    @touchend.stop="touch_end() && openFile(child as vFile)"
                     @dblclick.stop="openFile(child as vFile)"
                     :selected="markmap.includes(child.path)"
                 >
@@ -315,7 +342,8 @@
                 <div v-else :class="['item',child.type]" :title="desc(child)"
                     @click="markup($event,child)"
                     @dblclick.stop="openFile(child as vFile)"
-                    @touchstart.stop="openFile(child as vFile)"
+                    @touchstart="touch_start" @touchmove="touch_move"
+                    @touchend.stop="touch_end() && openFile(child as vFile)"
                     :selected="markmap.includes(child.path)"
                 >
                     <img :src="child.icon || DEFAULT_FILE_ICON">

diff --git a/src/opener/vlite.vue b/src/opener/vlite.vue
@@ -493,9 +493,13 @@
                 display: block;
                 max-width: none !important;
                 width: unset !important;
+                z-index: 0;
 
                 > .cover{
-                    display: none;
+                    position: fixed;
+                    inset: 0;
+                    z-index: -1;
+                    filter: brightness(0.6);
                 }
 
                 > .time{
@@ -703,8 +707,12 @@
             scroll-behavior: smooth;
 
             @media screen and (max-width: 30rem) {
-                width: 100%;
-                padding: 0 1rem;
+                width: unset;height: unset;
+                z-index: 0;
+                position: fixed;
+                margin: 0;
+                top: 0;left: .75rem;
+                right: .75rem;bottom: 7rem;
             }
 
             &::-webkit-scrollbar{

diff --git a/src/opener/vplayer.vue b/src/opener/vplayer.vue
@@ -28,7 +28,7 @@
             // 总计时长
             timetotal: '-:-',
             // 当前videoID
-            current: 0,
+            current: -1,
             // 是否循环播放
             loop: false,
             // 播放列表
@@ -122,7 +122,7 @@
     watch(() => config.current,function(n){
         if(!video.value) return;
         // 最后一个了
-        if(n >= config.playlist.length) return config.current = 1;
+        if(n >= config.playlist.length) return config.current = 0;
         // 第一个了
         else if(n < 0) return config.current = config.playlist.length -1;
         // 刷新播放状态
@@ -261,7 +261,8 @@
                 config.playing ? video.value.pause() : video.value.play()
             else mouse();
 
-            this.moved.lastClick = now;
+            this.moved.lastClick = now,
+            config.action = '';
         }
     }
 
@@ -415,7 +416,7 @@
         @pointermove="mouse" @click="mouse"
         @keydown="keyev"
     >
-        <div class="video"
+        <div class="video" :width="config.vid_state"
             @touchstart.stop.prevent="touch.start" @touchmove.stop.prevent="touch.move" @touchend.stop.prevent="touch.end"
         >
             <video ref="video">
@@ -643,6 +644,36 @@
             display: inline-block;
             max-width: 100%;max-height: 100%;
             width: auto !important;height: auto !important;
+
+            // 'auto' | 'width' | 'height' | 'full'
+            &[width=width]{
+                width: 100% !important;
+                height: auto !important;
+                max-height: unset !important;
+
+                > video{
+                    object-fit: contain;
+                }
+            }
+
+            &[width=height]{
+                max-width: auto !important;
+                width: auto !important;
+                height: 100% !important;
+
+                > video{
+                    object-fit: cover
+                }
+            }
+
+            &[width=full]{
+                width: 100% !important;
+                height: 100% !important;
+
+                > video{
+                    object-fit: fill;
+                }
+            }
        
             > *{
                 pointer-events: none;
@@ -652,7 +683,6 @@
             > video{
                 position: static;
                 width: 100%;height: 100%;
-                min-width: 30rem;
             }
         }
 

diff --git a/src/utils.ts b/src/utils.ts
@@ -8,11 +8,12 @@ import I_DIR from '/icon/dir.webp';
 import I_SETTING from '/app/settings.webp';
 import I_DESKTOP from '/icon/desktop.webp';
 
-export const APP_API = 'http://192.168.1.1:81/@api/';
 export const APP_NAME = 'izCloud';
 export const DEFAULT_FILE_ICON = I_File;
 export const DEFAULT_DIR_ICON = I_DIR;
-export const FILE_PROXY_SERVER = 'http://192.168.1.1:81/';
+
+export const APP_API = import.meta.env.DEV ? 'http://192.168.1.1:81/@api/' : '/@api/';
+export const FILE_PROXY_SERVER = import.meta.env.DEV ? 'http://192.168.1.1:81/' : '';
 
 const pool = {};