add bga mock vue

This commit is contained in:
Asoka 2025-06-05 16:17:25 +08:00
parent df35c72dae
commit 73e633f686
2 changed files with 65 additions and 0 deletions

View File

@ -0,0 +1,51 @@
<template>
<div class="bio-bga-container">
<h1 class="page-title">{{ pageTitle }}</h1>
<el-card class="content-card" shadow="hover">
<template #header>
<div class="card-header">
<span>BGA 模拟数据</span>
</div>
</template>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="id" label="ID" width="80" />
<el-table-column prop="sample" label="样本" />
<el-table-column prop="value" label="测量值" />
<el-table-column prop="status" label="状态" />
</el-table>
</el-card>
</div>
</template>
<script setup lang="ts" name="BioTestBga">
import { ref } from 'vue'
import { bgaDataList, BgaDataItem } from './mock'
const pageTitle = 'BGA 测试界面'
const tableData = ref<BgaDataItem[]>(bgaDataList)
</script>
<style scoped lang="scss">
.bio-bga-container {
padding: 20px;
background-color: #f0f2f5;
min-height: calc(100vh - 50px);
}
.page-title {
font-size: 24px;
font-weight: bold;
color: #303133;
margin-bottom: 20px;
}
.content-card {
.card-header {
font-size: 18px;
font-weight: 500;
}
.el-table {
margin-top: 10px;
}
}
</style>

View File

@ -0,0 +1,14 @@
// Mock data for BGA test page
export interface BgaDataItem {
id: number
sample: string
value: number
status: string
}
export const bgaDataList: BgaDataItem[] = [
{ id: 1, sample: 'Sample A', value: 42, status: 'OK' },
{ id: 2, sample: 'Sample B', value: 37, status: 'OK' },
{ id: 3, sample: 'Sample C', value: 50, status: 'Warning' },
{ id: 4, sample: 'Sample D', value: 28, status: 'Fail' },
]