npmapps 1.0.1 → 1.0.2

package/README.md

@@ -1,2 +1,3 @@
 1.0.0 VSCodeUserSetup-x64-1.96.4.exe
-1.0.1 HeidiSQL_12.10.0.7000_Setup.7z
+1.0.1 HeidiSQL_12.10.0.7000_Setup.7z
+1.0.2 v-fullScreen.browser.text

package/app/v-fullScreen.browser.txt

@@ -0,0 +1,114 @@
+ {
+    bind(el, binding) {
+        el.style.position = 'relative';
+        let originalBgColor = window.getComputedStyle(el).backgroundColor || '#fff';
+        let isMaximized = false;
+        let originalStyles = {};
+        
+        // 创建按钮
+        const btn = document.createElement('i');
+        btn.style.cssText = `
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            cursor: pointer;
+            font-size: 20px;
+            color: #409EFF;
+            z-index: 1000;
+        `;
+        
+        if (binding.modifiers.browser) {
+            // 浏览器内全屏模式
+            btn.className = 'el-icon-full-screen';
+            
+            // 退出全屏的函数
+            const exitFullScreen = () => {
+                if (isMaximized) {
+                    // 恢复原始样式
+                    Object.assign(el.style, originalStyles);
+                    btn.className = 'el-icon-full-screen';
+                    isMaximized = false;
+                }
+            };
+            
+            // 监听ESC键
+            document.addEventListener('keydown', (e) => {
+                if (e.key === 'Escape' && isMaximized) {
+                    exitFullScreen();
+                }
+            });
+            
+            btn.addEventListener('click', () => {
+                if (!isMaximized) {
+                ElementUI.Message.info('全屏模式下部分弹窗可能无法正常显示。');
+
+                    // 保存原始样式
+                    originalStyles = {
+                        position: el.style.position,
+                        top: el.style.top,
+                        left: el.style.left,
+                        width: el.style.width,
+                        height: el.style.height,
+                        zIndex: el.style.zIndex
+                    };
+                    
+                    // 设置最大化样式
+                    el.style.position = 'fixed';
+                    el.style.top = '0';
+                    el.style.left = '0';
+                    el.style.width = '100%';
+                    el.style.height = '100vh';
+                    // 设置合适的z-index值，确保在el-dialog遮罩层(2000)之下
+                    el.style.zIndex = '2000';
+                    el.style.backgroundColor = originalBgColor;
+                    
+                    btn.className = 'el-icon-close';
+                    isMaximized = true;
+                } else {
+                    exitFullScreen();
+                }
+            });
+        } else {
+            // 原生全屏模式
+            btn.className = 'el-icon-full-screen';
+            btn.addEventListener('click', () => {
+                if (!document.fullscreenElement) {
+                    ElementUI.Message.info('全屏模式下部分弹窗可能无法正常显示。');
+
+                    // 先设置页面全屏样式
+                    el.style.position = 'fixed';
+                    el.style.top = '0';
+                    el.style.left = '0';
+                    el.style.width = '100%';
+                    el.style.height = '100vh';
+                    el.style.zIndex = '2000';
+                    el.style.backgroundColor = originalBgColor;
+
+                    // 然后调用浏览器原生全屏
+                    document.body.requestFullscreen();
+                    btn.className = 'el-icon-close';
+                } else {
+                    // 退出全屏时恢复样式
+                    el.style.position = 'relative';
+                    el.style.top = 'auto';
+                    el.style.left = 'auto';
+                    el.style.width = 'auto';
+                    el.style.height = 'auto';
+                    el.style.zIndex = 'auto';
+                    document.exitFullscreen();
+                    btn.className = 'el-icon-full-screen';
+                }
+            });
+            
+            // 监听全屏变化
+            document.addEventListener('fullscreenchange', () => {
+                if (!document.fullscreenElement) {
+                    btn.className = 'el-icon-full-screen';
+                    el.style.backgroundColor = originalBgColor;
+                }
+            });
+        }
+        
+        el.appendChild(btn);
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "npmapps",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"