Files
mcu-benchmark/frontend/src/views/CompareView.vue
2025-08-02 21:05:35 +08:00

74 lines
2.0 KiB
Vue

<template>
<div style="padding:20px;">
<h2>MCU 对比</h2>
<table border="1" cellpadding="6">
<thead>
<tr>
<th>字段</th>
<th v-for="m in mcus" :key="m.id">{{ m.name }}</th>
</tr>
</thead>
<tbody>
<tr v-for="key in fieldKeys" :key="key">
<td><strong>{{ FIELD_LABELS[key] || key }}</strong></td>
<td v-for="m in mcus" :key="m.id">{{ m[key] }}</td>
</tr>
</tbody>
</table>
<button @click="$router.push('/')">返回</button>
</div>
</template>
<script setup>
import { ref, onMounted } from "vue";
import { useRoute } from "vue-router";
const route = useRoute();
const mcus = ref([]);
const fieldKeys = ref([]);
const FIELD_LABELS = {
name: "Name",
core_num: "Number of Cores",
core_type: "Core Architecture",
instruction_set: "Instruction Set",
coremark: "CoreMark Score",
coremark_per_mhz: "CoreMark per MHz",
frequency: "Frequency (MHz)",
flash: "Flash (KB)",
rom: "ROM (KB)",
ram: "RAM (KB)",
sram: "SRAM (KB)",
sram_in_rtc: "RTC SRAM (KB)",
bus_width: "Bus Width (bit)",
cache_type: "Cache Type",
l1_cache_size: "L1 Cache (KB)",
l2_cache_size: "L2 Cache (KB)",
l3_cache_size: "L3 Cache (KB)",
pipeline_depth: "Pipeline Depth",
simd_support: "SIMD Support (1 = Yes, 0 = No)",
fpu: "FPU Support (Single/Double Precision)",
package: "Package",
gpios: "Number of GPIOs",
uarts: "Number of UARTs",
i2cs: "Number of I2C Interfaces",
i2ses: "Number of I2S Interfaces",
spis: "Number of SPI Interfaces",
spi_protocols: "Supported SPI Protocols",
systems: "Supported Systems",
manufacturer: "Manufacturer",
link: "Product Link"
};
onMounted(async () => {
const ids = route.query.ids.split(",");
for (let id of ids) {
const res = await fetch(`/api/mcus/${id}`);
mcus.value.push(await res.json());
}
// Don't compare the "link" field
fieldKeys.value = Object.keys(FIELD_LABELS).filter(k => k !== "link");
});
</script>