test：点击按钮添加表格显示相关性能设备性能数据

frontend/src/components/DevicePerformanceTabel.vue

@@ -14,7 +14,8 @@ type propsType = {
 const props = defineProps<propsType>()
 
 type tableDataType = Record<string, string>[]
-const tableData = ref<tableDataType>([{}]);
+// const tableData = ref<tableDataType>([{}]);
+const tableData = ref<tableDataType>([{}])
 
 onMounted(() => {
   let table_websocket = new WebSocket(

frontend/src/views/Chat.vue

 <script setup lang="ts">
 import { ref, onMounted, watch } from 'vue';
 import { ElScrollbar, ElInput, ElButton } from 'element-plus';
+import { ElMessage, ElMessageBox } from 'element-plus'
 import  DevicePerformanceTable  from '@/components/DevicePerformanceTabel'
 
 const innerRef = ref<HTMLDivElement>();
@@ -58,6 +59,27 @@ onMounted(() => {
   };
 })
 
+const deviceTableParams = ref<string[]>([]);
+const addDeviceTable = () => {
+  ElMessageBox.prompt('Please input WebSocket group name', 'Tip', {
+    confirmButtonText: 'OK',
+    cancelButtonText: 'Cancel',
+  })
+    .then(({ value }) => {
+      ElMessage({
+        type: 'success',
+        message: `new websocket group name is chat_${value}`,
+      })
+      deviceTableParams.value.push(value);
+    })
+    .catch(() => {
+      ElMessage({
+        type: 'info',
+        message: 'Input canceled',
+      })
+    })
+}
+
 </script>
 
 <template>
@@ -73,8 +95,8 @@ onMounted(() => {
   <el-input v-model="input" placeholder="Please input" @keyup.enter="send"></el-input>
   <el-button @click="send">Send</el-button>
 
-  <device-performance-table group-name="acu7m5" mt-5 />
-  <device-performance-table group-name="hwf" mt-5/>
+  <device-performance-table v-for="param in deviceTableParams" mt-5 :group-name="param" :key="param" />
+  <el-button @click="addDeviceTable" class="mt-5" >Add table</el-button>
 </template>
 
 <style scoped>