feat: restore upload jtag bitstream

This commit is contained in:
SikongJueluo 2025-05-13 21:52:58 +08:00
parent eea03f5bc8
commit 9657aacf83
No known key found for this signature in database
7 changed files with 198 additions and 93 deletions

1
src/assets/doc.svg Normal file
View File

@ -0,0 +1 @@
<svg t="1747137150839" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5910" width="200" height="200"><path d="M224 831.936V192.096L223.808 192H576v159.936c0 35.328 28.736 64.064 64.064 64.064h159.712c0.032 0.512 0.224 1.184 0.224 1.664L800.256 832 224 831.936zM757.664 352L640 351.936V224.128L757.664 352z m76.064-11.872l-163.872-178.08C651.712 142.336 619.264 128 592.672 128H223.808A64.032 64.032 0 0 0 160 192.096v639.84A64 64 0 0 0 223.744 896h576.512A64 64 0 0 0 864 831.872V417.664c0-25.856-12.736-58.464-30.272-77.536z" fill="#3E3A39" p-id="5911"></path><path d="M640 512h-256a32 32 0 0 0 0 64h256a32 32 0 0 0 0-64M640 672h-256a32 32 0 0 0 0 64h256a32 32 0 0 0 0-64" fill="#3E3A39" p-id="5912"></path></svg>

After

Width:  |  Height:  |  Size: 759 B

1
src/assets/refresh.svg Normal file
View File

@ -0,0 +1 @@
<svg t="1747136937808" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4865" width="200" height="200"><path d="M894.481158 505.727133c0 49.589418-9.711176 97.705276-28.867468 143.007041-18.501376 43.74634-44.98454 83.031065-78.712713 116.759237-33.728172 33.728172-73.012897 60.211337-116.759237 78.712713-45.311998 19.156292-93.417623 28.877701-143.007041 28.877701s-97.695043-9.721409-142.996808-28.877701c-43.756573-18.501376-83.031065-44.98454-116.76947-78.712713-33.728172-33.728172-60.211337-73.012897-78.712713-116.759237-19.156292-45.301765-28.867468-93.417623-28.867468-143.007041 0-49.579185 9.711176-97.695043 28.867468-142.996808 18.501376-43.74634 44.98454-83.031065 78.712713-116.759237 33.738405-33.728172 73.012897-60.211337 116.76947-78.712713 45.301765-19.166525 93.40739-28.877701 142.996808-28.877701 52.925397 0 104.008842 11.010775 151.827941 32.745798 46.192042 20.977777 86.909395 50.79692 121.016191 88.608084 4.389984 4.860704 8.646937 9.854439 12.781094 14.97097l0-136.263453c0-11.307533 9.168824-20.466124 20.466124-20.466124 11.307533 0 20.466124 9.15859 20.466124 20.466124l0 183.64253c0 5.433756-2.148943 10.632151-5.986341 14.46955-3.847631 3.837398-9.046027 5.996574-14.479783 5.996574l-183.64253-0.020466c-11.307533 0-20.466124-9.168824-20.466124-20.466124 0-11.307533 9.168824-20.466124 20.466124-20.466124l132.293025 0.020466c-3.960195-4.952802-8.063653-9.782807-12.289907-14.479783-30.320563-33.605376-66.514903-60.098773-107.549481-78.753645-42.467207-19.289322-87.850837-29.072129-134.902456-29.072129-87.195921 0-169.172981 33.9533-230.816946 95.597265-61.654198 61.654198-95.597265 143.621025-95.597265 230.816946s33.943067 169.172981 95.597265 230.816946c61.643965 61.654198 143.621025 95.607498 230.816946 95.607498s169.172981-33.9533 230.816946-95.607498c61.654198-61.643965 95.597265-143.621025 95.597265-230.816946 0-11.2973 9.168824-20.466124 20.466124-20.466124C885.322567 485.261009 894.481158 494.429833 894.481158 505.727133z" p-id="4866"></path></svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -45,7 +45,11 @@
<CollapsibleSection title="组件功能" v-model:isExpanded="componentCapsExpanded" status="default" class="mt-4">
<div v-if="componentData && componentData.type">
<component v-if="capabilityComponent" :is="capabilityComponent" />
<component
v-if="capabilityComponent"
:is="capabilityComponent"
v-bind="componentData.attrs"
/>
<div v-else class="text-gray-400">
该组件没有提供特殊功能
</div>
@ -248,14 +252,14 @@ async function getExposedCapabilities(componentType: string) {
// getCapabilities
if (exposedMethods && typeof exposedMethods.getCapabilities === 'function') {
// JSX
const capsComponent = exposedMethods.getCapabilities();
//
const CapabilityComponent = exposedMethods.getCapabilities();
// DOM
app.unmount();
tempDiv.remove();
return capsComponent;
return CapabilityComponent;
}
// DOM

View File

@ -6,7 +6,7 @@
<!-- Input File -->
<fieldset class="fieldset w-full">
<legend class="fieldset-legend text-sm">选择或拖拽上传文件</legend>
<input type="file" class="file-input w-full" @change="handleFileChange" />
<input type="file" class="file-input w-full" :value="fileInput" @change="handleFileChange" />
<label class="fieldset-label">文件最大容量: {{ maxMemory }}MB</label>
</fieldset>
@ -20,17 +20,27 @@
</template>
<script lang="ts" setup>
import { computed } from "vue";
import { computed, ref } from "vue";
import { useEquipments } from "@/stores/equipments";
import { useDialogStore } from "@/stores/dialog";
import { isNull, isUndefined } from "lodash";
const emits = defineEmits<{
finishedUpload: [file: File];
}>();
const dialog = useDialogStore();
const eqps = useEquipments();
const buttonText = computed(() => {
return isUndefined(props.downloadEvent) ? "上传" : "上传并下载";
});
var bitstream: File | null = null;
// var bitstream: File | null = null;
const bitstream = defineModel<File | undefined>();
const fileInput = computed(() => {
return !isUndefined(bitstream.value) ? bitstream.value.name : "";
});
function handleFileChange(event: Event): void {
const target = event.target as HTMLInputElement;
@ -40,15 +50,10 @@ function handleFileChange(event: Event): void {
return;
}
bitstream = file;
}
function checkFile(file: File | null): boolean {
if (isNull(file)) {
dialog.error(`未选择文件`);
return false;
bitstream.value = file;
}
function checkFile(file: File): boolean {
const maxBytes = props.maxMemory! * 1024 * 1024; // MB
if (file.size > maxBytes) {
dialog.error(`文件大小超过最大限制: ${props.maxMemory}MB`);
@ -58,18 +63,25 @@ function checkFile(file: File | null): boolean {
}
async function handleClick(event: Event): Promise<void> {
if (!checkFile(bitstream)) return;
if (isNull(bitstream.value) || isUndefined(bitstream.value)) {
dialog.error(`未选择文件`);
return;
}
if (!checkFile(bitstream.value)) return;
if (isUndefined(props.uploadEvent)) {
dialog.error("无法上传");
return;
}
// Upload
// Upload - bitstream.valuebitstream
try {
const ret = await props.uploadEvent(event, bitstream);
const ret = await props.uploadEvent(event, bitstream.value);
if (isUndefined(props.downloadEvent)) {
if (ret) dialog.info("上传成功");
else dialog.error("上传失败");
if (ret) {
dialog.info("上传成功");
emits("finishedUpload", bitstream.value);
} else dialog.error("上传失败");
return;
}
} catch (e) {
@ -93,6 +105,7 @@ interface Props {
uploadEvent?: Function;
downloadEvent?: Function;
maxMemory?: number;
defaultFile?: File;
}
const props = withDefaults(defineProps<Props>(), {

View File

@ -13,10 +13,12 @@
<script setup lang="tsx">
import { JtagClient, type FileParameter } from "@/APIClient";
import z from "zod";
import { useEquipments } from "@/stores/equipments";
import UploadCard from "@/components/UploadCard.vue";
import { useDialogStore } from "@/stores/dialog";
import { toNumber } from "lodash";
import { computed, ref } from "vue";
import { toNumber, toString } from "lodash";
import { computed, ref, defineComponent, watch } from "vue";
//
interface MotherBoardProps {
@ -30,16 +32,46 @@ const props = withDefaults(defineProps<MotherBoardProps>(), getDefaultProps());
//
const width = computed(() => 800 * props.size);
const height = computed(() => 600 * props.size);
const eqps = useEquipments();
//
watch([props.jtagAddr, props.jtagPort], () => {
eqps.jtagIPAddr = props.jtagAddr;
eqps.jtagPort = props.jtagPort;
});
//
defineExpose({
getInfo: () => ({
size: props.size,
type: "motherboard",
}),
// getPinPosition
getPinPosition: () => null,
getCapabilities: () => {
// JSX
return defineComponent({
name: "MotherBoardCapabilities",
props: {
jtagAddr: {
type: String,
default: props.jtagAddr,
},
jtagPort: {
type: String,
default: props.jtagPort,
},
},
setup(props) {
const jtagController = new JtagClient();
const dialog = useDialogStore();
async function uploadBitstream(event: Event, bitstream: File) {
const boardAddress = "127.0.0.1"; //
const boardPort = "1234"; //
// 使
const jtagIDCode = ref("");
const boardAddress = computed(() => props.jtagAddr);
const boardPort = computed(() => toNumber(props.jtagPort));
if (!boardAddress || !boardPort) {
async function uploadBitstream(event: Event, bitstream: File) {
if (!boardAddress.value || !boardPort.value) {
dialog.error("开发板地址或端口空缺");
return;
}
@ -50,7 +82,10 @@ async function uploadBitstream(event: Event, bitstream: File) {
};
try {
const resp = await jtagController.uploadBitstream(boardAddress, fileParam);
const resp = await jtagController.uploadBitstream(
boardAddress.value,
fileParam,
);
return resp;
} catch (e) {
dialog.error("上传错误");
@ -58,18 +93,15 @@ async function uploadBitstream(event: Event, bitstream: File) {
}
async function downloadBitstream() {
const boardAddress = "127.0.0.1"; //
const boardPort = "1234"; //
if (!boardAddress || !boardPort) {
if (!boardAddress.value || !boardPort.value) {
dialog.error("开发板地址或端口空缺");
return;
}
try {
const resp = await jtagController.downloadBitstream(
boardAddress,
parseInt(boardPort),
boardAddress.value,
boardPort.value,
);
return resp;
} catch (e) {
@ -78,25 +110,70 @@ async function downloadBitstream() {
}
}
//
defineExpose({
getInfo: () => ({
size: props.size,
type: "motherboard",
}),
// getPinPosition
getPinPosition: () => null,
getCapabilities: () => (
watch([boardAddress, boardPort], () => {
if (
z.string().ip().safeParse(boardAddress).success &&
z.number().positive().safeParse(boardPort).success
)
getIDCode();
});
async function getIDCode() {
if (!boardAddress.value || !boardPort.value) {
dialog.error("开发板地址或端口空缺");
return;
}
try {
const resp = await jtagController.getDeviceIDCode(
boardAddress.value,
boardPort.value,
);
jtagIDCode.value = toString(resp);
} catch (e) {
dialog.error("获取IDCode错误");
console.error(e);
}
}
return () => (
<div>
<h1 class="font-bold text-center text-2xl">Jtag</h1>
<div class="flex">
<p class="grow">IDCode: {jtagIDCode.value}</p>
<button class="btn btn-circle w-8 h-8" onClick={getIDCode}>
<svg
class="icon opacity-70"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="4865"
width="200"
height="200"
>
<path
d="M894.481158 505.727133c0 49.589418-9.711176 97.705276-28.867468 143.007041-18.501376 43.74634-44.98454 83.031065-78.712713 116.759237-33.728172 33.728172-73.012897 60.211337-116.759237 78.712713-45.311998 19.156292-93.417623 28.877701-143.007041 28.877701s-97.695043-9.721409-142.996808-28.877701c-43.756573-18.501376-83.031065-44.98454-116.76947-78.712713-33.728172-33.728172-60.211337-73.012897-78.712713-116.759237-19.156292-45.301765-28.867468-93.417623-28.867468-143.007041 0-49.579185 9.711176-97.695043 28.867468-142.996808 18.501376-43.74634 44.98454-83.031065 78.712713-116.759237 33.738405-33.728172 73.012897-60.211337 116.76947-78.712713 45.301765-19.166525 93.40739-28.877701 142.996808-28.877701 52.925397 0 104.008842 11.010775 151.827941 32.745798 46.192042 20.977777 86.909395 50.79692 121.016191 88.608084 4.389984 4.860704 8.646937 9.854439 12.781094 14.97097l0-136.263453c0-11.307533 9.168824-20.466124 20.466124-20.466124 11.307533 0 20.466124 9.15859 20.466124 20.466124l0 183.64253c0 5.433756-2.148943 10.632151-5.986341 14.46955-3.847631 3.837398-9.046027 5.996574-14.479783 5.996574l-183.64253-0.020466c-11.307533 0-20.466124-9.168824-20.466124-20.466124 0-11.307533 9.168824-20.466124 20.466124-20.466124l132.293025 0.020466c-3.960195-4.952802-8.063653-9.782807-12.289907-14.479783-30.320563-33.605376-66.514903-60.098773-107.549481-78.753645-42.467207-19.289322-87.850837-29.072129-134.902456-29.072129-87.195921 0-169.172981 33.9533-230.816946 95.597265-61.654198 61.654198-95.597265 143.621025-95.597265 230.816946s33.943067 169.172981 95.597265 230.816946c61.643965 61.654198 143.621025 95.607498 230.816946 95.607498s169.172981-33.9533 230.816946-95.607498c61.654198-61.643965 95.597265-143.621025 95.597265-230.816946 0-11.2973 9.168824-20.466124 20.466124-20.466124C885.322567 485.261009 894.481158 494.429833 894.481158 505.727133z"
p-id="4866"
></path>
</svg>
</button>
</div>
<div class="divider"></div>
<UploadCard
class={"bg-base-200"}
class="bg-base-200"
upload-event={uploadBitstream}
download-event={downloadBitstream}
onFinishedUpload={(file: File) => {
eqps.jtagBitstream = file;
}}
>
{" "}
</UploadCard>
</div>
),
);
},
});
},
});
</script>
@ -105,22 +182,10 @@ defineExpose({
export function getDefaultProps() {
return {
size: 1,
jtagAddr: "127.0.0.1",
jtagPort: "1234",
};
}
//
// export function getCapabilities() {
// return (
// <div>
// <UploadCard
// class={"bg-base-200"}
// upload-event={uploadBitstream}
// download-event={downloadBitstream}
// >
// {" "}
// </UploadCard>
// </div>
// );
// }
</script>
<style scoped>

View File

@ -1,5 +1,4 @@
import { ref, reactive } from 'vue';
// 约束电平状态类型
export type ConstraintLevel = 'high' | 'low' | 'undefined';

22
src/stores/equipments.ts Normal file
View File

@ -0,0 +1,22 @@
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import { isUndefined } from 'lodash';
export const useEquipments = defineStore('equipments', () => {
const jtagIPAddr = ref("127.0.0.1")
const jtagPort = ref("1234")
const jtagBitstream = ref<File | undefined>()
const remoteUpdateIPAddr = ref("127.0.0.1")
const remoteUpdatePort = ref("1234")
const remoteUpdateBitstream = ref<File | undefined>()
return {
jtagIPAddr,
jtagPort,
jtagBitstream,
remoteUpdateIPAddr,
remoteUpdatePort,
remoteUpdateBitstream,
}
})