124 lines
4.5 KiB
Vue
124 lines
4.5 KiB
Vue
<template>
|
||
<!-- 主渲染区 -->
|
||
<MainRender></MainRender>
|
||
|
||
<!-- 左上角的 sidebar，用于显示 -->
|
||
<Sidebar></Sidebar>
|
||
|
||
<!-- 工具栏 -->
|
||
<div class="vcd-toolbar">
|
||
</div>
|
||
|
||
<!-- 显示当前信号树形关系 -->
|
||
<!-- 右侧工具合集 -->
|
||
<RightNav :topModules="VcdInfo.topModules"></RightNav>
|
||
</template>
|
||
|
||
<script>
|
||
import { onMounted, reactive } from 'vue';
|
||
import { getVcdStream, readVcdFile } from '@/hook/utils';
|
||
import { emitter, globalLookup, globalSetting, signalValues } from '@/hook/global';
|
||
|
||
import Sidebar from '@/components/sidebar.vue';
|
||
import RightNav from '@/components/right-nav.vue';
|
||
import MainRender from '@/components/render';
|
||
|
||
export default {
|
||
components: {
|
||
RightNav,
|
||
Sidebar,
|
||
MainRender
|
||
},
|
||
setup() {
|
||
|
||
const VcdInfo = reactive({
|
||
topModules: [],
|
||
values: [],
|
||
});
|
||
|
||
onMounted(async () => {
|
||
// 改变默认颜色
|
||
document.body.style.setProperty('--el-color-primary', 'var(--main-color)');
|
||
document.body.style.setProperty('--el-color-primary-light-9', 'var(--main-color)');
|
||
document.body.style.setProperty('--el-color-primary-light-3', 'var(--main-color)');
|
||
document.body.style.setProperty('--el-text-color-secondary', 'var(--foreground)');
|
||
document.body.style.setProperty('--el-text-color-regular', 'var(--foreground)');
|
||
document.body.style.setProperty('--el-border-color', 'var(--vscode-focusBorder)');
|
||
document.body.style.setProperty('--el-fill-color-blank', 'var(--sidebar)');
|
||
document.body.style.setProperty('--el-fill-color-light', 'var(--vscode-button-hoverBackground)');
|
||
document.body.style.setProperty('--el-switch-on-color', 'var(--main-color)');
|
||
document.body.style.setProperty('--el-border', 'var(--sidebar)');
|
||
document.body.style.setProperty('--el-border-color-light', 'var(--sidebar)');
|
||
document.body.style.setProperty('--el-border-color-lighter', 'var(--sidebar)');
|
||
document.body.style.setProperty('--el-bg-color-overlay', 'transplant');
|
||
document.body.style.setProperty('--el-color-info-light-9', 'var(--vscode-focusBorder)');
|
||
document.body.style.setProperty('--el-color-info', 'var(--foreground)');
|
||
document.body.style.setProperty('--el-color-info-light-8', 'var(--vscode-focusBorder)');
|
||
document.body.style.setProperty('--el-bg-color-overlay', 'transplant');
|
||
|
||
|
||
// signal height
|
||
document.body.style.setProperty('--display-signal-info-height', globalSetting.displaySignalHeight + 'px');
|
||
|
||
|
||
const uint8array = await readVcdFile();
|
||
const vcdstream = await getVcdStream();
|
||
|
||
vcdstream.change.any((id, time, cmd, value, mask) => {
|
||
if (signalValues[id] === undefined) {
|
||
signalValues[id] = [];
|
||
}
|
||
|
||
signalValues[id].push({time, cmd, value, mask});
|
||
});
|
||
|
||
const maxChunkLength = 1 << 17;
|
||
for (let i = 0; i < uint8array.length; i += maxChunkLength) {
|
||
const piece = uint8array.slice(i, i + maxChunkLength);
|
||
vcdstream.write(piece);
|
||
}
|
||
|
||
for (const topModule of vcdstream.info.wires.body) {
|
||
VcdInfo.topModules.push(topModule);
|
||
}
|
||
|
||
|
||
globalLookup.status = vcdstream.info.status;
|
||
globalLookup.version = vcdstream.info.version;
|
||
globalLookup.timescale = vcdstream.info.timescale;
|
||
globalLookup.date = vcdstream.info.date;
|
||
globalLookup.t0 = vcdstream.info.t0;
|
||
|
||
emitter.emit('meta-ready', null);
|
||
|
||
// 这一步时，已经加载完成
|
||
// 默认第一个模块被选中
|
||
if (VcdInfo.topModules.length > 0) {
|
||
const defaultMod = VcdInfo.topModules[0];
|
||
const wires = defaultMod.body.filter(mod => mod.link);
|
||
emitter.emit('tree-view', wires);
|
||
// 将顶层模块存储进全局对象，以便后续的搜索服务
|
||
for (const mod of VcdInfo.topModules) {
|
||
globalLookup.topModules.push(mod);
|
||
}
|
||
}
|
||
});
|
||
|
||
return {
|
||
VcdInfo
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
<style>
|
||
#app {
|
||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
}
|
||
|
||
</style>
|