- {{ stats.totalOperations }}
- 总操作次数
+ {{ stats.totalOperations || 0 }}
+ 总日志数
- {{ stats.successfulOperations }}
- 成功操作
+ {{ stats.successfulOperations || 0 }}
+ 用户操作
- {{ stats.failedOperations }}
- 失败操作
+ {{ stats.failedOperations || 0 }}
+ 错误日志
- {{ stats.activeConnections }}
- 活动连接
+ {{ stats.activeConnections || 0 }}
+ 系统操作
@@ -201,7 +201,8 @@
diff --git a/src/config/cad.js b/src/config/cad.js
index 6f81ec0..59675fc 100644
--- a/src/config/cad.js
+++ b/src/config/cad.js
@@ -6,6 +6,17 @@ const API_CONFIG = {
BASE_URL: import.meta.env.MODE === 'production' ? 'https://api.miany.com' : 'http://localhost',
TIMEOUT: 30000, // 30秒超时
+ // WebSocket配置
+ WEBSOCKET: {
+ BASE_URL: 'ws://localhost:8000',
+ ENDPOINT: '/api/v1/ws/connect',
+ CLIENT_ID: 'web_client',
+ USER_ID: 'admin',
+ RECONNECT_ATTEMPTS: 5,
+ RECONNECT_DELAY: 1000, // 1秒
+ HEARTBEAT_INTERVAL: 30000 // 30秒
+ },
+
// 通用API端点
COMMON_ENDPOINTS: {
health: '/health',
@@ -240,6 +251,11 @@ export const getGeometryOptimizationDefaults = () => {
return API_CONFIG.GEOMETRY_OPTIMIZATION
}
+// 获取WebSocket配置
+export const getWebSocketConfig = () => {
+ return API_CONFIG.WEBSOCKET
+}
+
// HTTP请求头配置
export const getRequestHeaders = () => {
return {
diff --git a/src/main.js b/src/main.js
index b2e2d2f..496bf4d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -6,6 +6,7 @@ import 'element-plus/dist/index.css'
import App from './App.vue'
import router from './router'
import { useAuthStore } from './stores/auth'
+import websocketService from './services/websocketService'
const app = createApp(App)
@@ -17,4 +18,7 @@ app.use(ElementPlus)
const authStore = useAuthStore()
authStore.initAuth()
+// 启动WebSocket连接
+websocketService.connect()
+
app.mount('#app')
diff --git a/src/services/websocketService.js b/src/services/websocketService.js
new file mode 100644
index 0000000..28dfca0
--- /dev/null
+++ b/src/services/websocketService.js
@@ -0,0 +1,392 @@
+// WebSocket服务类 - 统一管理后台WebSocket连接
+// 基于参考项目接口格式实现
+
+import { getWebSocketConfig } from '@/config/cad'
+
+class WebSocketService {
+ constructor() {
+ this.config = getWebSocketConfig()
+ this.ws = null
+ this.connectionState = 'DISCONNECTED' // CONNECTING, CONNECTED, DISCONNECTED, ERROR
+ this.reconnectAttempts = 0
+ this.heartbeatTimer = null
+
+ // 状态数据
+ this.softwareList = []
+ this.logs = []
+ this.logStats = null
+ this.operationTypes = []
+ this.connectedUsers = []
+
+ // 事件监听器
+ this.listeners = {
+ onOpen: [],
+ onMessage: [],
+ onClose: [],
+ onError: [],
+ onStateChange: [],
+ onSoftwareUpdate: [],
+ onLogUpdate: [],
+ onStatsUpdate: [],
+ onOperationTypesUpdate: []
+ }
+
+ console.log('WebSocketService 初始化完成')
+ }
+
+ // 获取WebSocket连接URL
+ getConnectionUrl() {
+ const { BASE_URL, ENDPOINT, CLIENT_ID, USER_ID } = this.config
+ return `${BASE_URL}${ENDPOINT}?client_id=${CLIENT_ID}&user_id=${USER_ID}`
+ }
+
+ // 连接WebSocket
+ connect() {
+ if (this.connectionState === 'CONNECTING' || this.connectionState === 'CONNECTED') {
+ return
+ }
+
+ const url = this.getConnectionUrl()
+ console.log('开始连接统一管理后台:', url)
+ this.setState('CONNECTING')
+ this.ws = new WebSocket(url)
+
+ this.ws.onopen = (event) => {
+ console.log('统一管理后台连接成功')
+ this.setState('CONNECTED')
+ this.reconnectAttempts = 0
+ this.startHeartbeat()
+ this.emit('onOpen', event)
+
+ // 连接成功后立即获取初始数据
+ setTimeout(() => {
+ this.getSoftwareList()
+ this.getLogStats()
+ this.getOperationTypes()
+ }, 500)
+ }
+
+ this.ws.onmessage = (event) => {
+ try {
+ const message = JSON.parse(event.data)
+ console.log('收到管理后台消息:', message)
+ this.handleMessage(message)
+ this.emit('onMessage', message)
+ } catch (error) {
+ console.error('解析管理后台消息失败:', error, event.data)
+ }
+ }
+
+ this.ws.onclose = (event) => {
+ console.log('统一管理后台连接关闭:', event)
+ this.setState('DISCONNECTED')
+ this.stopHeartbeat()
+ this.emit('onClose', event)
+
+ // 自动重连
+ if (!event.wasClean && this.reconnectAttempts < this.config.RECONNECT_ATTEMPTS) {
+ const delay = this.config.RECONNECT_DELAY * Math.pow(2, this.reconnectAttempts)
+ console.log(`统一管理后台将在 ${delay}ms 后重连，第 ${this.reconnectAttempts + 1} 次尝试`)
+ setTimeout(() => {
+ this.reconnectAttempts++
+ this.connect()
+ }, delay)
+ }
+ }
+
+ this.ws.onerror = (event) => {
+ console.error('统一管理后台连接错误:', event)
+ this.setState('ERROR')
+ this.emit('onError', event)
+ }
+ }
+
+ // 断开连接
+ disconnect() {
+ console.log('主动断开统一管理后台连接')
+ if (this.ws) {
+ this.ws.close(1000, 'Client disconnect')
+ this.ws = null
+ }
+ this.stopHeartbeat()
+ this.setState('DISCONNECTED')
+ }
+
+ // 发送消息
+ send(message) {
+ if (this.connectionState === 'CONNECTED' && this.ws) {
+ const jsonMessage = JSON.stringify(message)
+ console.log('发送管理后台消息:', message)
+ this.ws.send(jsonMessage)
+ return true
+ } else {
+ console.warn('统一管理后台未连接，消息发送失败:', message)
+ return false
+ }
+ }
+
+ // 处理收到的消息
+ handleMessage(message) {
+ switch (message.type) {
+ case 'info':
+ this.handleInfoMessage(message)
+ break
+ case 'heartbeat':
+ console.log('收到心跳响应')
+ break
+ case 'software_list_update':
+ this.handleSoftwareListUpdate(message)
+ break
+ case 'log_recorded':
+ console.log('操作日志已记录:', message.data)
+ break
+ case 'error':
+ console.error('管理后台错误:', message.message)
+ break
+ default:
+ console.log('未处理的消息类型:', message.type, message)
+ }
+ }
+
+ // 处理info类型消息
+ handleInfoMessage(message) {
+ if (message.data) {
+ if (message.data.software_list) {
+ this.softwareList = message.data.software_list
+ this.emit('onSoftwareUpdate', this.softwareList)
+ }
+
+ if (message.data.logs) {
+ this.logs = message.data.logs
+ this.emit('onLogUpdate', this.logs)
+ }
+
+ if (message.data.stats) {
+ this.logStats = message.data.stats
+ this.emit('onStatsUpdate', this.logStats)
+ }
+
+ if (message.data.operations) {
+ this.operationTypes = message.data.operations
+ this.emit('onOperationTypesUpdate', this.operationTypes)
+ }
+
+ if (message.data.connected_users) {
+ this.connectedUsers = message.data.connected_users
+ }
+ }
+ }
+
+ // 处理软件列表更新
+ handleSoftwareListUpdate(message) {
+ if (message.data && message.data.software_list) {
+ this.softwareList = message.data.software_list
+ console.log('软件列表已更新:', this.softwareList)
+ this.emit('onSoftwareUpdate', this.softwareList)
+ }
+ }
+
+ // API方法 - 心跳检测
+ ping() {
+ return this.send({ type: 'ping' })
+ }
+
+ // API方法 - 获取服务状态
+ getStatus() {
+ return this.send({ type: 'get_status' })
+ }
+
+ // API方法 - 获取软件列表
+ getSoftwareList() {
+ return this.send({ type: 'get_software_list' })
+ }
+
+ // API方法 - 启动软件
+ startSoftware(softwareId) {
+ if (!softwareId || typeof softwareId !== 'string' || softwareId.length === 0) {
+ console.error('启动软件失败: 无效的软件ID', softwareId)
+ return false
+ }
+
+ console.log('启动软件:', softwareId)
+ return this.send({
+ type: 'start_software',
+ software_id: softwareId
+ })
+ }
+
+ // API方法 - 停止软件
+ stopSoftware(softwareId) {
+ if (!softwareId || typeof softwareId !== 'string' || softwareId.length === 0) {
+ console.error('停止软件失败: 无效的软件ID', softwareId)
+ return false
+ }
+
+ console.log('停止软件:', softwareId)
+ return this.send({
+ type: 'stop_software',
+ software_id: softwareId
+ })
+ }
+
+ // API方法 - 重启软件
+ restartSoftware(softwareId) {
+ if (!softwareId || typeof softwareId !== 'string' || softwareId.length === 0) {
+ console.error('重启软件失败: 无效的软件ID', softwareId)
+ return false
+ }
+
+ console.log('重启软件:', softwareId)
+ return this.send({
+ type: 'restart_software',
+ software_id: softwareId
+ })
+ }
+
+ // API方法 - 记录操作日志
+ logOperation(operation, details = '', options = {}) {
+ if (!operation || typeof operation !== 'string' || operation.length === 0) {
+ console.error('记录日志失败: 操作名称不能为空')
+ return false
+ }
+
+ const logData = {
+ type: 'log_operation',
+ operation: operation.substring(0, 100), // 限制长度
+ details: details ? details.substring(0, 1000) : '', // 限制长度
+ action_type: options.action_type || 'execute',
+ target_object: options.target_object || '',
+ status: options.status || 'success',
+ duration: options.duration || 0,
+ operation_category: options.operation_category || '软件控制'
+ }
+
+ console.log('记录操作日志:', logData)
+ return this.send(logData)
+ }
+
+ // API方法 - 查询操作日志
+ queryLogs(filters = {}) {
+ const queryData = {
+ type: 'query_logs',
+ limit: filters.limit || 100,
+ offset: filters.offset || 0
+ }
+
+ // 添加可选的筛选条件
+ if (filters.log_type) queryData.log_type = filters.log_type
+ if (filters.operation) queryData.operation = filters.operation
+ if (filters.user_id_filter) queryData.user_id_filter = filters.user_id_filter
+ if (filters.level) queryData.level = filters.level
+ if (filters.start_time) queryData.start_time = filters.start_time
+ if (filters.end_time) queryData.end_time = filters.end_time
+
+ console.log('查询操作日志:', queryData)
+ return this.send(queryData)
+ }
+
+ // API方法 - 根据ID获取日志
+ getLogById(logId) {
+ if (!logId || typeof logId !== 'string' || logId.length === 0) {
+ console.error('获取日志失败: 无效的日志ID', logId)
+ return false
+ }
+
+ return this.send({
+ type: 'get_log_by_id',
+ log_id: logId
+ })
+ }
+
+ // API方法 - 获取日志统计信息
+ getLogStats() {
+ console.log('获取日志统计信息')
+ return this.send({ type: 'get_log_stats' })
+ }
+
+ // API方法 - 清理过期日志
+ cleanupLogs() {
+ console.log('清理过期日志')
+ return this.send({ type: 'cleanup_logs' })
+ }
+
+ // API方法 - 获取操作类型列表
+ getOperationTypes() {
+ console.log('获取操作类型列表')
+ return this.send({ type: 'get_operation_types' })
+ }
+
+ // 心跳检测
+ startHeartbeat() {
+ this.heartbeatTimer = setInterval(() => {
+ if (this.connectionState === 'CONNECTED') {
+ this.ping()
+ }
+ }, this.config.HEARTBEAT_INTERVAL)
+ }
+
+ stopHeartbeat() {
+ if (this.heartbeatTimer) {
+ clearInterval(this.heartbeatTimer)
+ this.heartbeatTimer = null
+ }
+ }
+
+ // 状态管理
+ setState(newState) {
+ if (this.connectionState !== newState) {
+ const oldState = this.connectionState
+ this.connectionState = newState
+ console.log(`统一管理后台状态变化: ${oldState} -> ${newState}`)
+ this.emit('onStateChange', { oldState, newState })
+ }
+ }
+
+ // 事件系统
+ on(event, callback) {
+ if (this.listeners[event]) {
+ this.listeners[event].push(callback)
+ } else {
+ console.warn('未知事件类型:', event)
+ }
+ }
+
+ off(event, callback) {
+ if (this.listeners[event]) {
+ const index = this.listeners[event].indexOf(callback)
+ if (index > -1) {
+ this.listeners[event].splice(index, 1)
+ }
+ }
+ }
+
+ emit(event, data) {
+ if (this.listeners[event]) {
+ this.listeners[event].forEach(callback => {
+ try {
+ callback(data)
+ } catch (error) {
+ console.error('事件回调执行失败:', event, error)
+ }
+ })
+ }
+ }
+
+ // 获取当前状态
+ getState() {
+ return {
+ connectionState: this.connectionState,
+ softwareList: this.softwareList,
+ logs: this.logs,
+ logStats: this.logStats,
+ operationTypes: this.operationTypes,
+ connectedUsers: this.connectedUsers
+ }
+ }
+}
+
+// 导出单例实例
+export const websocketService = new WebSocketService()
+
+// 默认导出
+export default websocketService
\ No newline at end of file