feat: 测试

src/views/test/index.vue

@@ -28,7 +28,10 @@
       <div class="table-header">
         <div class="header-button-lf">
           <el-button type="primary" icon="CirclePlus" @click="openDialog('新增')"> 新增 </el-button>
+          <el-button type="primary" icon="CirclePlus" @click="saveData()"> 保存 </el-button>
           <el-button type="danger" icon="Delete" plain> 删除 </el-button>
+          <p>当前状态: {{ wsStatus }}</p>
+          <p>最后消息: {{ lastMessage }}</p>
         </div>
       </div>
       <el-table :data="tableData" border ref="tableRef" show-overflow-tooltip>
@@ -68,7 +71,47 @@
 <script setup lang="ts">
 import { CaseVO } from '@/api/interface/case'
 import AddDialog from './components/index.vue'
-import data from '../data'
+import caseData from '../data'
+import { wsClient, wsStatus, lastMessage, useWebSocketManager } from '@/utils/webSocket'
+const { sendMessage } = useWebSocketManager()
+// 组件加载完成后发送初始消息
+onMounted(() => {
+  console.log('组件已加载，发送初始消息')
+  nextTick(() => {
+    if (wsClient.value && wsStatus.value === '已连接') {
+      sendMessage({
+        type: 'fetchList'
+      })
+    } else {
+      console.log('WebSocket 未连接，无法发送初始消息')
+    }
+  })
+})
+
+// 发送普通消息
+const sendData = () => {
+  if (wsClient.value) {
+    console.log('正在发送测试消息...')
+    sendMessage({
+      type: 'fetchList'
+    })
+  } else {
+    console.log('WebSocket 未连接，无法发送消息')
+  }
+}
+
+// 保存数据时发送消息
+const saveData = () => {
+  if (wsClient.value) {
+    console.log('正在保存数据并发送消息...')
+    sendMessage({
+      type: 'save'
+    })
+  } else {
+    console.log('WebSocket 未连接，无法保存数据')
+  }
+}
+
 const router = useRouter()
 const tableRef = ref()
 const pageable = {
@@ -101,7 +144,7 @@ const handleCurrentChange = (_val: number) => {}
 const onSubmit = () => {
   console.log('submit!')
 }
-const tableData: CaseVO[] = data.list
+const tableData: CaseVO[] = caseData.list
 
 // 打开 dialog(新增、查看、编辑)
 const dialogRef = ref<InstanceType<typeof AddDialog> | null>(null)