fix: frontend upload bitstream failed

src/components/equipments/MotherBoard.vue

@@ -10,15 +10,15 @@
     </svg>
   </div>
   <Teleport to="#ComponentCapabilities" v-if="selectecComponentID === props.componentId">
-    <MotherBoardCaps :jtagAddr="eqps.boardAddr" :jtagPort="eqps.boardPort.toString()" />
+    <MotherBoardCaps :jtagAddr="props.boardAddr" :jtagPort="toNumber(props.boardPort)" />
   </Teleport>
 </template>
 
 <script setup lang="tsx">
 import MotherBoardCaps from "./MotherBoardCaps.vue";
-import { useEquipments } from "@/stores/equipments";
 import { ref, computed, watchEffect, inject } from "vue";
 import { CanvasCurrentSelectedComponentID } from "../InjectKeys";
+import { toNumber } from "lodash";
 
 // 主板特有属性
 export interface MotherBoardProps {
@@ -39,16 +39,6 @@ const selectecComponentID = inject(CanvasCurrentSelectedComponentID, ref(null));
 const width = computed(() => 800 * props.size);
 const height = computed(() => 600 * props.size);
 
-// Global store
-const eqps = useEquipments();
-
-const bitstreamFile = ref<File | null>();
-
-watchEffect(() => {
-  eqps.setAddr(props.boardAddr);
-  eqps.setPort(props.boardPort);
-});
-
 // 向外暴露方法
 defineExpose({
   getInfo: () => ({

src/components/equipments/MotherBoardCaps.vue

@@ -3,7 +3,7 @@
     <h1 class="font-bold text-center text-2xl">Jtag</h1>
     <div class="flex flex-col">
       <p class="grow">Jtag Addr: {{ props.jtagAddr }}</p>
-      <p class="grow">Jtag Port: {{ props.jtagPort }}</p>
+      <p class="grow">Jtag Port: {{ props.jtagPort?.toString() }}</p>
       <div class="flex justify-between grow">
         <p>IDCode: 0x{{ jtagIDCode.toString(16).padStart(8, "0") }}</p>
         <button class="btn btn-circle w-6 h-6" :onclick="getIDCode">
@@ -17,7 +17,8 @@
       </div>
     </div>
     <div class="divider"></div>
-    <UploadCard class="bg-base-200" :upload-event="uploadBitstream" :download-event="downloadBitstream">
+    <UploadCard class="bg-base-200" :upload-event="uploadBitstream" :download-event="downloadBitstream"
+      :bitstream-file="eqps.jtagBitstream" @update:bitstream-file="handleBitstreamChange">
     </UploadCard>
     <div class="divider"></div>
     <button class="btn w-full btn-primary" :class="isEnableJtagBoundaryScan ? '' : 'btn-soft'"
@@ -32,16 +33,15 @@ import { JtagClient } from "@/APIClient";
 import z from "zod";
 import UploadCard from "@/components/UploadCard.vue";
 import { useDialogStore } from "@/stores/dialog";
-import {
-  useConstraintsStore,
-  type ConstraintLevel,
-} from "@/stores/constraints";
-import { isUndefined, toNumber } from "lodash";
-import { ref, computed, watch } from "vue";
+import { Common } from "@/Common";
+import { useEquipments } from "@/stores/equipments";
+import { useConstraintsStore } from "@/stores/constraints";
+import { isUndefined } from "lodash";
+import { ref, watchEffect } from "vue";
 
 interface CapsProps {
   jtagAddr?: string;
-  jtagPort?: string;
+  jtagPort?: number;
 }
 
 const props = withDefaults(defineProps<CapsProps>(), {});
@@ -49,16 +49,17 @@ const props = withDefaults(defineProps<CapsProps>(), {});
 // Global Stores
 const dialog = useDialogStore();
 const constrainsts = useConstraintsStore();
+const eqps = useEquipments();
 
 const jtagController = new JtagClient();
 const isEnableJtagBoundaryScan = ref(false);
 
 // 使用传入的属性或默认值
 const jtagIDCode = ref(0);
-const boardAddress = computed(() => props.jtagAddr);
-const boardPort = computed(() =>
-  isUndefined(props.jtagPort) ? undefined : toNumber(props.jtagPort),
-);
+
+function handleBitstreamChange(file: File | undefined) {
+  eqps.jtagBitstream = file;
+}
 
 async function toggleJtagBoundaryScan() {
   isEnableJtagBoundaryScan.value = !isEnableJtagBoundaryScan.value;
@@ -68,8 +69,8 @@ async function toggleJtagBoundaryScan() {
 async function jtagBoundaryScan() {
   try {
     const portStates = await jtagController.boundaryScanLogicalPorts(
-      boardAddress.value,
-      boardPort.value,
+      props.jtagAddr,
+      props.jtagPort,
     );
 
     constrainsts.batchSetConstraintStates(portStates);
@@ -78,75 +79,78 @@ async function jtagBoundaryScan() {
     console.error(error);
     isEnableJtagBoundaryScan.value = false;
   } finally {
-    if (isEnableJtagBoundaryScan.value) setTimeout(jtagBoundaryScan, 100);
+    if (isEnableJtagBoundaryScan.value) setTimeout(jtagBoundaryScan, 50);
   }
 }
 
-async function uploadBitstream(event: Event, bitstream: File) {
-  if (!isUndefined(boardAddress.value) || !isUndefined(boardPort.value)) {
+async function uploadBitstream(bitstream: File): Promise<boolean> {
+  if (isUndefined(props.jtagAddr) || isUndefined(props.jtagPort)) {
     dialog.error("开发板地址或端口空缺");
-    return;
+    return false;
   }
 
-  const fileParam = {
-    data: bitstream,
-    fileName: bitstream.name,
-  };
-
   try {
+    console.debug(`Before upload bistream: ${bitstream}`);
     const resp = await jtagController.uploadBitstream(
-      boardAddress.value,
-      fileParam,
-    );
-    return resp;
-  } catch (e) {
-    dialog.error("上传错误");
-  }
-}
-
-async function downloadBitstream() {
-  if (!boardAddress.value || !boardPort.value) {
-    dialog.error("开发板地址或端口空缺");
-    return;
-  }
-
-  try {
-    const resp = await jtagController.downloadBitstream(
-      boardAddress.value,
-      boardPort.value,
+      props.jtagAddr,
+      Common.toFileParameterOrNull(bitstream),
     );
     return resp;
   } catch (e) {
     dialog.error("上传错误");
     console.error(e);
+    return false;
   }
 }
 
-watch([boardAddress, boardPort], () => {
-  if (
-    z.string().ip().safeParse(boardAddress).success &&
-    z.number().positive().safeParse(boardPort).success
-  )
-    getIDCode();
-});
+async function downloadBitstream(): Promise<boolean> {
+  if (isUndefined(props.jtagAddr) || isUndefined(props.jtagPort)) {
+    dialog.error("开发板地址或端口空缺");
+    return false;
+  }
 
-async function getIDCode() {
-  if (!boardAddress.value || !boardPort.value) {
+  try {
+    const resp = await jtagController.downloadBitstream(
+      props.jtagAddr,
+      props.jtagPort,
+    );
+    return resp;
+  } catch (e) {
+    dialog.error("上传错误");
+    console.error(e);
+    return false;
+  }
+}
+
+async function getIDCode(isQuiet: boolean = false) {
+  if (isUndefined(props.jtagAddr) || isUndefined(props.jtagPort)) {
     dialog.error("开发板地址或端口空缺");
     return;
   }
 
   try {
     const resp = await jtagController.getDeviceIDCode(
-      boardAddress.value,
-      boardPort.value,
+      props.jtagAddr,
+      props.jtagPort,
     );
     jtagIDCode.value = resp;
   } catch (e) {
-    dialog.error("获取IDCode错误");
-    console.error(e);
+    if (!isQuiet) dialog.error("获取IDCode错误");
   }
 }
+
+watchEffect(() => {
+  eqps.setAddr(props.jtagAddr);
+  eqps.setPort(props.jtagPort);
+});
+
+watchEffect(() => {
+  if (
+    z.string().ip().safeParse(props.jtagAddr).success &&
+    z.number().positive().safeParse(props.jtagPort).success
+  )
+    getIDCode(true);
+});
 </script>
 
 <style scoped lang="postcss">