更新代码

src/utils/devMode.js

+import VConsole from 'vconsole'
+
+class DevModeManager {
+  constructor() {
+    this.vConsole = null
+    this.clickCount = 0
+    this.clickTimer = null
+    this.maxClicks = 7 // 连续点击7次开启
+    this.resetTime = 3000 // 3秒内无点击则重置
+    this.isDevMode = this.getDevModeFromStorage()
+    
+    // 如果已经开启过开发模式，自动初始化
+    if (this.isDevMode) {
+      this.enableDevMode()
+    }
+  }
+
+  // 从 localStorage 获取开发模式状态
+  getDevModeFromStorage() {
+    return localStorage.getItem('dev_mode_enabled') === 'true'
+  }
+
+  // 保存开发模式状态到 localStorage
+  saveDevModeToStorage(enabled) {
+    localStorage.setItem('dev_mode_enabled', enabled.toString())
+  }
+
+  // 处理点击事件
+  handleClick() {
+    this.clickCount++
+    console.log(`开发模式激活进度: ${this.clickCount}/${this.maxClicks}`)
+
+    // 清除之前的定时器
+    if (this.clickTimer) {
+      clearTimeout(this.clickTimer)
+    }
+
+    // 如果达到指定次数，切换开发模式
+    if (this.clickCount >= this.maxClicks) {
+      this.toggleDevMode()
+      this.resetClickCount()
+      return
+    }
+
+    // 设置重置定时器
+    this.clickTimer = setTimeout(() => {
+      if (this.clickCount > 0) {
+        console.log('开发模式激活超时，重置计数')
+        this.resetClickCount()
+      }
+    }, this.resetTime)
+  }
+
+  // 重置点击计数
+  resetClickCount() {
+    this.clickCount = 0
+    if (this.clickTimer) {
+      clearTimeout(this.clickTimer)
+      this.clickTimer = null
+    }
+  }
+
+  // 切换开发模式
+  toggleDevMode() {
+    if (this.isDevMode) {
+      this.disableDevMode()
+    } else {
+      this.enableDevMode()
+    }
+  }
+
+  // 开启开发模式
+  enableDevMode() {
+    if (!this.vConsole) {
+      this.vConsole = new VConsole()
+      console.log('🎉 开发模式已开启！')
+      console.log('💡 提示：再次连续点击7次可关闭开发模式')
+    }
+    this.isDevMode = true
+    this.saveDevModeToStorage(true)
+  }
+
+  // 关闭开发模式
+  disableDevMode() {
+    if (this.vConsole) {
+      this.vConsole.destroy()
+      this.vConsole = null
+      console.log('👋 开发模式已关闭！')
+    }
+    this.isDevMode = false
+    this.saveDevModeToStorage(false)
+  }
+
+  // 检查是否为开发环境
+  isDevEnvironment() {
+    return process.env.NODE_ENV === 'development'
+  }
+
+  // 获取当前开发模式状态
+  getDevModeStatus() {
+    return {
+      enabled: this.isDevMode,
+      environment: process.env.NODE_ENV,
+      clickCount: this.clickCount,
+      maxClicks: this.maxClicks
+    }
+  }
+}
+
+// 创建全局实例
+const devModeManager = new DevModeManager()
+
+// 添加到 window 对象，方便控制台操作
+if (typeof window !== 'undefined') {
+  window.devMode = {
+    toggle: () => devModeManager.toggleDevMode(),
+    enable: () => devModeManager.enableDevMode(),
+    disable: () => devModeManager.disableDevMode(),
+    status: () => devModeManager.getDevModeStatus(),
+    reset: () => devModeManager.resetClickCount()
+  }
+}
+
+export default devModeManager 
\ No newline at end of file

src/views/login.vue

@@ -20,6 +20,12 @@
           <span class="loading-spinner"></span>
         </div>
       </div>
+       <!-- 开发模式触发区域 - 隐藏的点击区域 -->
+       <div 
+         class="dev-mode-trigger" 
+         @click="handleDevModeClick"
+         title="开发模式触发区域"
+       ></div>
       <!-- 组织切换弹窗 -->
       <el-dialog :visible.sync="showOrgDialog"  width="300px" title="选择组织">
         <ul style="list-style:none;padding:0;margin-top: -20px;">
@@ -55,6 +61,7 @@ import { getParams } from '@/utils/index'
 import { mapMutations,mapState } from 'vuex'
 import { getToken,setToken } from '@/utils/auth'
 import jsApiList from '@/utils/jsApiList'
+import devModeManager from '@/utils/devMode'
 export default {
   data() {
     return {
@@ -111,6 +118,10 @@ export default {
         this.cacheCorp_id(urlParams.corp_id) // 缓存 corp_id
       }
     },
+    // 处理开发模式点击
+    handleDevModeClick() {
+      devModeManager.handleClick()
+    },
     // 设置缓存
     cacheCorp_id(corp_id){
       Cookies.set('corp_id',corp_id, { expires: 7 })
@@ -349,6 +360,25 @@ export default {
   justify-content: center;
 }
 
+/* 开发模式触发区域 */
+.dev-mode-trigger {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  width: 50px;
+  height: 50px;
+  background: transparent;
+  cursor: pointer;
+  z-index: 999;
+  user-select: none;
+}
+
+/* 开发环境下显示边框提示 */
+.dev-mode-trigger:hover {
+  background: rgba(0, 191, 138, 0.1);
+  border-radius: 4px;
+}
+
 .qr-contain {
         margin: 0 auto;
         /*  margin-top: 20px; */