跑通查重部分

src/views/FileView.vue

@@ -35,7 +35,7 @@
         <el-form class="form" :model="form" label-width="150px" style="max-width: 720px">
             <el-form-item label="查重算法">
                 <el-radio-group v-model="form.algo">
-                    <el-radio :label="-1">JPLAG</el-radio>
+                    <el-radio :label="1">JPLAG</el-radio>
                 </el-radio-group>
             </el-form-item>
             <el-form-item label="语言类型">
@@ -66,7 +66,7 @@
 <script lang="ts">
 import { ref, computed, onMounted, reactive } from "vue";
 import Title from "@/components/Title.vue";
-import { ElTable } from 'element-plus'
+import { ElTable, ElMessage } from 'element-plus'
 import { JPLAG_info } from "@/utils/someText";
 import { useRouter } from "vue-router";
 import Layout from "@/components/Layout.vue";
@@ -146,10 +146,45 @@ export default {
         onMounted(() => {
             console.log("getting tables");
             updateTables();
-
+            initWebSocket();
             // 返回值    
         })
 
+      const WebSocketMessage = ref("");
+      const url = ref("ws://localhost:8889/plag");
+      let ws: WebSocket;
+      let sessionId = ref("0");
+
+    // websocket
+      const initWebSocket = function () {
+        ws = new WebSocket(url.value);
+        ws.onopen = function () {
+          console.log("websocket is opened");
+        };
+        ws.onmessage = function (evt) {
+          console.log("websocket receive message:", evt.data);
+          WebSocketMessage.value = evt.data;
+          if (evt.data.startsWith("sessionId:")) {
+            sessionId.value = evt.data.split(":")[1];
+            console.log("sessionId:", sessionId.value);
+          }
+          if (evt.data === "查重成功") {
+            updateTables();
+            ElMessage.success({
+              message: '查重成功！'
+            });
+          } else if (evt.data === "查重失败"){
+            updateTables();
+            ElMessage.error({
+              message: '查重失败！'
+            });
+          }
+        };
+        ws.onclose = function () {
+          console.log("websocket is closed");
+        };
+      };
+
         // axios请求数据
         const updateTables = function () {
             let params = "pageNo=" + (currentPage.value) + "&pageSize=" + PageSize.value + "&param=" + param.value;
@@ -180,11 +215,8 @@ export default {
         // 查重表单
         const form = reactive({
             selectZip: "",
-            name: "",
-            algo: -1,
+            algo: 1,
             fileType: 1,
-            hasParams: true,
-            // baseFile: baseFileList,
             params: ""
         })
         // 文件类型选项
@@ -199,8 +231,22 @@ export default {
             }
         ]);
         // 表单提交/取消
+      let jPlagForm = ref({
+        fileId: 1,
+        baseFileId: 1,
+        fileType: 1,
+        algorithmId: 1,
+        params: "",
+        sessionId: "0",
+      })
         const onSubmit = () => {
-            console.log("提交form", form)
+          jPlagForm.value.sessionId = sessionId.value;
+          jPlagForm.value.fileId = tableData.value[0].id;
+          jPlagForm.value.baseFileId = parseInt(tableData.value[0].baseFile);
+          jPlagForm.value.fileType = form.fileType;
+          jPlagForm.value.algorithmId = form.algo;
+          jPlagForm.value.params = form.params;
+          ws.send("plag:" + JSON.stringify(jPlagForm.value));
         }
         const onClear = () => {
             console.log("清空")
@@ -212,6 +258,9 @@ export default {
             pageSizes,
             PageSize,
             param,
+            url,
+            WebSocketMessage,
+            initWebSocket,
             handleSizeChange,
             handleCurrentChange,
             // 搜索栏
@@ -223,6 +272,7 @@ export default {
             updateTables,
             fileTypeOptions,
             form,
+            jPlagForm,
             // 提交表单
             onSubmit,
             onClear,