ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

系数校准

Browse Source
This commit is contained in:
sjl
2024-12-30 14:43:13 +08:00
parent 6ce58e86ad
commit d76b055730
13 changed files with 1208 additions and 424 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
.vscode/settings.json vendored
View File

@@ -7,13 +7,18 @@
"devicedata",
"errordata",
"errordetail",
"Interharmonic",
"IRMS",
"logdata",
"MSQI",
"Pids",
"plandata",
"PQDIF",
"resourcedata",
"resourcename",
"rmark",
"showtest"
"showtest",
"UNBAN",
"VRMS"
]
}

722
frontend/src/views/home/components/channelsTest.vue
View File

@@ -1,5 +1,5 @@
<template>
<el-dialog v-model='dialogVisible' title="系数校准" v-bind="dialogBig" width="1400px" @close="handleCancel">
<el-dialog v-model='dialogVisible' title="系数校准" v-bind="dialogBig" width="1500px" @close="handleCancel">
<div class="test-dialog" >
<div class="dialog-content">
<div class="right-title">
@@ -19,20 +19,36 @@
<div class="dialog-left">
<el-steps direction="vertical" :active="active" :process-status="currentStepStatus" finish-status="success">
<el-step title="开始" />
<el-step title="大电压/电流下装"/>
<el-step>
<template #title>
<span>大电压/电流系数下装</span><br/>
<span>源输出为：</span><br/>
<span>Ua=Ub=Uc=57.74V</span><br/>
<span>Ia=Ib=Ic=1A</span>
<span v-if="active > 0">Ua=Ub=Uc=57.74V</span><br/>
<span v-if="active > 0">Ia=Ib=Ic=10A</span>
</template>
</el-step>
<el-step title="小电压/电流下装"/>
<el-step>
<template #title>
<span>小电压/电流系数下装</span><br/>
<span>源输出为：</span><br/>
<span>Ua=Ub=Uc=57.74V</span><br/>
<span>Ia=Ib=Ic=1A</span>
<span v-if="active > 1">Ua=Ub=Uc=5.774V</span><br/>
<span v-if="active > 1">Ia=Ib=Ic=1A</span>
</template>
</el-step>
<el-step>
<template #title>
<span>大电压/电流校准</span><br/>
<span>源输出为：</span><br/>
<span v-if="active > 2">Ua=Ub=Uc=57.74V</span><br/>
<span v-if="active > 2">Ia=Ib=Ic=10A</span>
</template>
</el-step>
<el-step>
<template #title>
<span>小电压/电流校准</span><br/>
<span>源输出为：</span><br/>
<span v-if="active > 3">Ua=Ub=Uc=5.774V</span><br/>
<span v-if="active > 3">Ia=Ib=Ic=1A</span>
</template>
</el-step>
<el-step title="结束"/>
@@ -41,8 +57,8 @@
<div class="right-content">
<el-tabs type="border-card">
<div v-if="activeIndex > 0">
<el-tab-pane v-for="(device, index) in name.slice(0, activeIndex )" :key="index" :label="device">
<div >
<el-tab-pane v-for="(device, index) in name" :key="index" :label="device">
<template #label>
<span class="custom-tabs-label">
<span>{{ device }}</span>
@@ -51,7 +67,7 @@
</el-icon>
</span>
</template>
<channelsTestTable :tableData="getTableDataForChannel(index)"></channelsTestTable>
<channelsTestTable :tableData="getTableDataForChannel(index)" :loading="loadingStates[index]"></channelsTestTable>
</el-tab-pane>
</div>
<el-empty description="暂无数据，等待检测开始" v-if="activeIndex === 0" />
@@ -106,6 +122,7 @@ import { SuccessFilled, Failed, Message, MessageBox } from '@element-plus/icons-
import { type Ref, ref, toRef, watch } from 'vue'
import {dialogBig} from '@/utils/elementBind'
import { ElMessage, ElMessageBox } from 'element-plus';
import { el } from 'element-plus/es/locale';
const activeIndex = ref(0)
const activeTotalNum = ref(4)
const qualified = ref(0)
@@ -118,6 +135,7 @@ let intervalId: NodeJS.Timeout | null = null;
const channel = ref<number[]>([])//系数校准所选设备通道数组
// 在 setup 函数中
const errorStates = ref(new Array(name.value.length).fill(false));
const loadingStates = ref(new Array(name.value.length).fill(false)); // 初始化 loading 状态
// 定义 TableDataItem 接口
@@ -142,130 +160,257 @@ interface TableDataItem {
}
// 定义每种状态的数据模板
const dataTemplates = [
const dataTemplates3 = [
{
deviceName: '大电压大电流1',
deviceName: '系数下装',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
{
deviceName: '系数下装',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
{
deviceName: '系数校准',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
{
deviceName: '系数校准',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
];
const dataTemplates4 = [
{
deviceName: '系数下装',
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaData: 10,
IaChannel: 1.0001,
IbData: 5,
IbData: 10,
IbChannel: 1.0001,
IcData: 5,
IcData: 10,
IcChannel: 1.0001,
},
{
deviceName: '小电压小电流1',
UaData: 57.74,
deviceName: '系数下装',
UaData: 5.774,
UaChannel: 1.0003,
UbData: 57.74,
UbData: 5.774,
UbChannel: 1.0003,
UcData: 57.74,
UcData: 5.774,
UcChannel: 1.0003,
IaData: 5,
IaData: 1,
IaChannel: 1.0001,
IbData: 5,
IbData: 1,
IbChannel: 1.0001,
IcData: 5,
IcData: 1,
IcChannel: 1.0001,
},
{
deviceName: '大电压大电流2',
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
deviceName: '系数校准',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
{
deviceName: '小电压小电流2',
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
deviceName: '系数校准',
UaData: '—',
UaChannel:'—',
UbData: '—',
UbChannel: '—',
UcData: '—',
UcChannel: '—',
IaData: '—',
IaChannel: '—',
IbData: '—',
IbChannel: '—',
IcData: '—',
IcChannel: '—',
},
];
// 定义每种状态的数据模板
const dataTemplates2 = [
const dataTemplates5 = [
{
deviceName: '大电压大电流1',
deviceName: '系数下装',
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaData: 10,
IaChannel: 1.0001,
IbData: 5,
IbData: 10,
IbChannel: 1.0001,
IcData: 5,
IcData: 10,
IcChannel: 1.0001,
},
{
deviceName: '小电压小电流1',
UaData: 57.74,
deviceName: '系数下装',
UaData: 5.774,
UaChannel: 1.0003,
UbData: 57.74,
UbData: 5.774,
UbChannel: 1.0003,
UcData: 57.74,
UcData: 5.774,
UcChannel: 1.0003,
IaData: 5,
IaData: 1,
IaChannel: 1.0001,
IbData: 5,
IbData: 1,
IbChannel: 1.0001,
IcData: 5,
IcData: 1,
IcChannel: 1.0001,
},
{
deviceName: '大电压大电流2',
deviceName: '系数校准',
UaData: 57.74,
UaChannel: '不合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaData: 10,
IaChannel: '合格',
IbData: 5,
IbData: 10,
IbChannel: '合格',
IcData: 5,
IcData: 10,
IcChannel: '合格',
},
{
deviceName: '小电压小电流2',
deviceName: '系数校准',
UaData: 5.774,
UaChannel: '不合格',
UbData: 5.774,
UbChannel: '合格',
UcData: 5.774,
UcChannel: '合格',
IaData: 1,
IaChannel: '合格',
IbData: 1,
IbChannel: '合格',
IcData: 1,
IcChannel: '合格',
},
];
const dataTemplates6 = [
{
deviceName: '系数下装',
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 10,
IaChannel: 1.0001,
IbData: 10,
IbChannel: 1.0001,
IcData: 10,
IcChannel: 1.0001,
},
{
deviceName: '系数下装',
UaData: 5.774,
UaChannel: 1.0003,
UbData: 5.774,
UbChannel: 1.0003,
UcData: 5.774,
UcChannel: 1.0003,
IaData: 1,
IaChannel: 1.0001,
IbData: 1,
IbChannel: 1.0001,
IcData: 1,
IcChannel: 1.0001,
},
{
deviceName: '系数校准',
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '不合格',
IbData: 5,
IaData: 10,
IaChannel: '合格',
IbData: 10,
IbChannel: '合格',
IcData: 5,
IcData: 10,
IcChannel: '合格',
},
{
deviceName: '系数校准',
UaData: 5.774,
UaChannel: '合格',
UbData: 5.774,
UbChannel: '合格',
UcData: 5.774,
UcChannel: '合格',
IaData: 1,
IaChannel: '合格',
IbData: 1,
IbChannel: '合格',
IcData: 1,
IcChannel: '合格',
},
];
@@ -305,292 +450,6 @@ const activities = [
},
]
const tableData1 = ref<TableDataItem[]>([
{
id: '1',
deviceName: '大电压大电流1',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '1',
deviceName: '大电压大电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '1',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
},
{
id: '1',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: "合格",
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
},
{
id: '2',
deviceName: '240001',
MonitorIdx: 2,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '2',
deviceName: '240001',
MonitorIdx: 2,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '2',
deviceName: '240001',
MonitorIdx: 2,
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
},
{
id: '2',
deviceName: '240001',
MonitorIdx: 2,
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel:'合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
},
])
const tableData2 = ref<TableDataItem[]>([
{
id: '1',
deviceName: '大电压大电流2',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '1',
deviceName: '大电压大电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
},
{
id: '1',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '不合格',
IcData: 5,
IcChannel: '合格',
},
{
id: '1',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: "合格",
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
},
])
const tableData3 = ref<TableDataItem[]>([
{
id: '1',
updateTime: '2024-10-10 10:30:00',
deviceName: '大电压大电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
Result: '合格',
},
{
id: '1',
updateTime: '2024-10-10 10:30:00',
deviceName: '大电压大电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: 1.0003,
UbData: 57.74,
UbChannel: 1.0003,
UcData: 57.74,
UcChannel: 1.0003,
IaData: 5,
IaChannel: 1.0001,
IbData: 5,
IbChannel: 1.0001,
IcData: 5,
IcChannel: 1.0001,
Result: '合格',
},
{
id: '1',
updateTime: '2024-10-10 10:30:00',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: '合格',
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
Result: '合格',
},
{
id: '1',
updateTime: '2024-10-10 10:30:00',
deviceName: '小电压小电流',
MonitorIdx: 1,
UaData: 57.74,
UaChannel: "合格",
UbData: 57.74,
UbChannel: '合格',
UcData: 57.74,
UcChannel: '不合格',
IaData: 5,
IaChannel: '合格',
IbData: 5,
IbChannel: '合格',
IcData: 5,
IcChannel: '合格',
Result: '合格',
},
])
const tableDataMap = new Map<number, Ref<TableDataItem[]>>([
@@ -611,6 +470,7 @@ const currentStepStatus = ref<'error' | 'finish' | 'wait' | 'success' | 'process
const checkStates = selection.map(item => item.checkState);
const allCheckStatesEqual = new Set(checkStates).size <= 1;
if (!allCheckStatesEqual) {
ElMessageBox.confirm(
'所勾选设备检测状态不一致，请重新选择',
@@ -630,13 +490,14 @@ const currentStepStatus = ref<'error' | 'finish' | 'wait' | 'success' | 'process
total.value = name.value.length
// 循环生成数据
// 初始化 loadingStates 为 false
loadingStates.value = new Array(selection.length).fill(false);
errorStates.value = new Array(selection.length).fill(false);
for (let i = 0; i < channel.value.length; i++) {
const currentTableData = ref<TableDataItem[]>([]);
// 随机选择 dataTemplates 或 dataTemplates2
const selectedTemplates = Math.random() < 0.5 ? dataTemplates : dataTemplates2;
const selectedTemplates = dataTemplates3;
for(let j = 0; j < channel.value[i]; j++){
const id = (j + 1).toString();
@@ -651,6 +512,25 @@ const currentStepStatus = ref<'error' | 'finish' | 'wait' | 'success' | 'process
tableDataMap.set(i,currentTableData)
}
// // 循环生成数据
// for (let i = 0; i < channel.value.length; i++) {
// const currentTableData = ref<TableDataItem[]>([]);
// // 随机选择 dataTemplates 或 dataTemplates2
// const selectedTemplates = Math.random() < 0.5 ? dataTemplates : dataTemplates2;
// for(let j = 0; j < channel.value[i]; j++){
// const id = (j + 1).toString();
// selectedTemplates.forEach((template) => {
// currentTableData.value.push({
// id: id,
// MonitorIdx: j + 1,
// ...template,
// });
// });
// }
// tableDataMap.set(i,currentTableData)
// }
}
const handleCancel=() => {
@@ -666,6 +546,8 @@ const currentStepStatus = ref<'error' | 'finish' | 'wait' | 'success' | 'process
const getTableDataForChannel = (index: number): any[] => {
const data = tableDataMap.get(index);
// console.log('index',index)
// console.log('data',data)
return data ? data.value : [];
}
// const props = defineProps({
@@ -736,7 +618,119 @@ const checkForErrors = (data: TableDataItem[]): boolean => {
);
};
const handleSubmit = () => {
const handleSubmit = async () => {
if (intervalId !== null) {
clearInterval(intervalId);
}
// 初始化 currentTableData
let isTimer2Completed = false;
// 设置 loading 状态为 true
// 初始化 loadingStates 为 true
loadingStates.value = new Array(name.value.length).fill(true);
for (let i = 0; i < channel.value.length; i++) {
console.log('channel', channel.value[i]);
console.log('activeIndex', activeIndex.value);
const currentTableData = ref<TableDataItem[]>([]);
const selectedTemplates = dataTemplates4;
for (let j = 0; j < channel.value[i]; j++) {
const id = (j + 1).toString();
selectedTemplates.forEach((template) => {
currentTableData.value.push({
id: id,
MonitorIdx: j + 1,
...template,
});
});
}
tableDataMap.set(i, currentTableData);
console.log('tableDataMap after set', tableDataMap);
activeIndex.value++;
// 启动 timer2
let timer2 = setInterval(() => {
// 初始化 currentTableData
const currentTableData = ref<TableDataItem[]>([]);
if(i > 0){
const selectedTemplates = dataTemplates6;
for (let j = 0; j < channel.value[i]; j++) {
const id = (j + 1).toString();
selectedTemplates.forEach((template) => {
currentTableData.value.push({
id: id,
MonitorIdx: j + 1,
...template,
});
});
}
}else{
const selectedTemplates = dataTemplates5;
for (let j = 0; j < channel.value[i]; j++) {
const id = (j + 1).toString();
selectedTemplates.forEach((template) => {
currentTableData.value.push({
id: id,
MonitorIdx: j + 1,
...template,
});
});
}
}
tableDataMap.set(i, currentTableData);
clearInterval(timer2);
const currentDataRef = tableDataMap.get(activeIndex.value - 1);
console.log('activeIndex.value',activeIndex.value);
console.log('tableDataMap',tableDataMap);
console.log('currentDataRef',currentDataRef);
if (currentDataRef) {
const currentData = currentDataRef.value;
// 检查当前数据中有无不合格字段
const hasError = checkForErrors(currentData);
if (hasError) {
} else {
qualified.value++;
}
updateErrorState(activeIndex.value - 1, hasError);
}
activeIndex.value++;
// 设置标志变量为 true，表示 timer2 已经完成
isTimer2Completed = true;
}, 3000);
// 等待 timer2 完成
while (!isTimer2Completed) {
// 这里可以添加一个短暂的等待，避免死循环
await new Promise(resolve => setTimeout(resolve, 100));
}
// 重置标志变量
isTimer2Completed = false;
}
// 启动 timer1
let timer1 = setInterval(() => {
active.value++;
if (active.value > 5) {
clearInterval(timer1);
}
}, 1000);
};
const handleSubmit2 = () => {
if (intervalId !== null) {
clearInterval(intervalId);
}
@@ -783,7 +777,7 @@ const handleSubmit = () => {
let timer2 = setInterval(() => {
active.value++
if (active.value++ > 4) {
if (active.value++ > 5) {
clearInterval(timer2)
}
}, 1000);
@@ -813,7 +807,7 @@ const handleSubmit = () => {
}
.dialog-content {
height: 500px;
height: 510px;
}
.el-tabs--border-card {

191
frontend/src/views/home/components/channelsTestTable.vue
View File

@@ -6,57 +6,160 @@
style="width: 100%"
max-height="400px"
:span-method="objectSpanMethod">
<el-table-column prop="MonitorIdx" label="监测点序号"/>
<el-table-column prop="MonitorIdx" label="监测点序号" width="80"/>
<!-- <el-table-column prop="updateTime" label="上送时刻" width="180"/> -->
<!-- <el-table-column prop="deviceName" label="描述" /> -->
<el-table-column prop="deviceName" label="描述" width="90"/>
<el-table-column label="电压通道" >
<el-table-column prop="Ua" label="L1">
<el-table-column prop="UaData" label="数据(V)"/>
<el-table-column prop="UaData" label="数据(V)">
<template #default="scope">
<el-icon v-if="scope.row.UaData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UaData }}
</span>
</template>
</el-table-column>
<el-table-column prop="UaChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.UaChannel === '不合格'">{{ scope.row.UaChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.UaChannel === '不合格'">
{{ scope.row.UaChannel }}
</el-tag>
<el-icon v-else-if="scope.row.UaChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UaChannel }}
</span>
<!-- <el-tag type="danger" v-if="scope.row.UaChannel === '不合格'">{{ scope.row.UaChannel }}</el-tag> -->
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="Ub" label="L2">
<el-table-column prop="UbData" label="数据(V)"/>
<el-table-column prop="UbData" label="数据(V)">
<template #default="scope">
<el-icon v-if="scope.row.UbData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UbData }}
</span>
</template>
</el-table-column>
<el-table-column prop="UbChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.UbChannel === '不合格'">{{ scope.row.UbChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.UbChannel === '不合格'">
{{ scope.row.UbChannel }}
</el-tag>
<el-icon v-else-if="scope.row.UbChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UbChannel }}
</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="Uc" label="L3">
<el-table-column prop="UcData" label="数据(V)"/>
<el-table-column prop="UcData" label="数据(V)">
<template #default="scope">
<el-icon v-if="scope.row.UcData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UcData }}
</span>
</template>
</el-table-column>
<el-table-column prop="UcChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.UcChannel === '不合格'">{{ scope.row.UcChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.UcChannel === '不合格'">
{{ scope.row.UcChannel }}
</el-tag>
<el-icon v-else-if="scope.row.UcChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.UcChannel }}
</span>
</template>
</el-table-column>
</el-table-column>
</el-table-column>
<el-table-column label="电流通道" >
<el-table-column prop="Ia" label="L1">
<el-table-column prop="IaData" label="数据(A)"/>
<el-table-column prop="IaData" label="数据(A)">
<template #default="scope">
<el-icon v-if="scope.row.IaData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IaData }}
</span>
</template>
</el-table-column>
<el-table-column prop="IaChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.IaChannel === '不合格'">{{ scope.row.IaChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.IaChannel === '不合格'">
{{ scope.row.IaChannel }}
</el-tag>
<el-icon v-else-if="scope.row.IaChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IaChannel }}
</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="Ib" label="L2">
<el-table-column prop="IbData" label="数据(A)"/>
<el-table-column prop="IbData" label="数据(A)">
<template #default="scope">
<el-icon v-if="scope.row.IbData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IbData }}
</span>
</template>
</el-table-column>
<el-table-column prop="IbChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.IbChannel === '不合格'">{{ scope.row.IbChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.IbChannel === '不合格'">
{{ scope.row.IbChannel }}
</el-tag>
<el-icon v-else-if="scope.row.IbChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IbChannel }}
</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="Ic" label="L3">
<el-table-column prop="IcData" label="数据(A)"/>
<el-table-column prop="IcData" label="数据(A)">
<template #default="scope">
<el-icon v-if="scope.row.IcData === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IcData }}
</span>
</template>
</el-table-column>
<el-table-column prop="IcChannel" label="系数">
<template #default="scope">
<el-tag type="danger" v-if="scope.row.IcChannel === '不合格'">{{ scope.row.IcChannel }}</el-tag>
<el-tag type="danger" v-if="scope.row.IcChannel === '不合格'">
{{ scope.row.IcChannel }}
</el-tag>
<el-icon v-else-if="scope.row.IcChannel === '—'&& loading">
<el-icon-loading />
</el-icon>
<span v-else>
{{ scope.row.IcChannel }}
</span>
</template>
</el-table-column>
</el-table-column>
@@ -74,35 +177,35 @@
<script lang="ts" setup name="ErrorSystemDialog">
import { defineProps, defineEmits, reactive,watch,ref, Ref } from 'vue';
import { ElIcon, ElLoading, ElTag } from 'element-plus';
//import IndicatorTypeDialog from "@/views/machine/errorSystem/components/IndicatorTypeDialog.vue"; // 导入子组件
import {CirclePlus, Delete, EditPen,FolderOpened,CopyDocument} from '@element-plus/icons-vue'
import { useDictStore } from '@/stores/modules/dict'
const dictStore = useDictStore()
const props = defineProps<{
tableData: Array<{
id: string;
updateTime: string;
deviceName:string;
MonitorIdx:number;
UaData:number;
UaChannel:string;
UbData:number;
UbChannel:string;
UcData:number;
UcChannel:string;
IaData:number;
IaChannel:string;
IbData:number;
IbChannel:string;
IcData:number;
IcChannel:string;
Result: string;
deviceName?: string;
MonitorIdx: number;
UaData?: number | string;
UaChannel?: number | string;
UbData?: number | string;
UbChannel?: number | string;
UcData?: number | string;
UcChannel?: number | string;
IaData?: number | string;
IaChannel?: number | string;
IbData?: number | string;
IbChannel?: number | string;
IcData?: number | string;
IcChannel?: number | string;
Result?: string | string;
updateTime?: string;
}>
loading: boolean; // 定义 loading 属性
}>();
function objectSpanMethod({ row, column, rowIndex, columnIndex }: { row: any, column: any, rowIndex: number, columnIndex: number }) {
if (columnIndex === 0) {
if (rowIndex === 0 || rowIndex === 4 || rowIndex === 8 || rowIndex === 12) {
if (rowIndex % 4 === 0) {
return {
rowspan: 4,
colspan: 1,
@@ -114,6 +217,19 @@
};
}
}
if (columnIndex === 1) {
if (rowIndex % 2 === 0) {
return {
rowspan: 2,
colspan: 1,
};
} else {
return {
rowspan: 0,
colspan: 0,
};
}
}
}
// const tableData = ref([
@@ -171,6 +287,11 @@
// },
// ])
// 监听 tableData 的变化
</script>
<style scoped>
@@ -205,4 +326,6 @@
overflow-y: auto; /* 允许垂直滚动 */
overflow-x: hidden; /* 隐藏水平滚动条 */
}
</style>

13
frontend/src/views/home/tabs/dashboard.vue
View File

@@ -30,7 +30,13 @@
<el-collapse-item title="检测进度展示" name="1"> -->
<div class="container_pieShow">
<el-collapse model-value="1" accordion @change="handleCollapseChange">
<el-collapse-item title="&nbsp&nbsp&nbsp&nbsp&nbsp检测计划统计" name="1">
<el-collapse-item name="1">
<template #title>
<div style="display: flex; justify-content: space-between; width: 100%;">
<span style="font-weight: bold;margin-left: 15px;">检测计划统计</span>
<span style="font-weight: bold;margin-right: 15px;">{{ planName }}</span>
</div>
</template>
<!-- 饼图 -->
<div class="container_charts">
<div class="charts_info" ref="chartsInfoRef">
@@ -121,6 +127,7 @@ import type {CollapseModelValue} from "element-plus/es/components/collapse/src/c
import {type Device} from "@/api/device/interface/device";
import {ResultData} from "@/api/interface";
const planName = ref('')
const dictStore = useDictStore()
const modeStore = useModeStore();
const chartsInfoRef = ref<HTMLElement | null>(null);
@@ -286,8 +293,10 @@ const getPieData = async (id: string) => {
if (id) {
const boundPqDevList = ref<Device.ResPqDev[]>([])//根据检测计划id查询出所有已绑定的设备
const plan = findPlanById(planList.value?.data || [], id);
planName.value = '所选计划:' + plan.name
if (plan) {
isTimeCheck.value = plan.timeCheck === 1; // 将 1 转换为 true，0 转换为 false
//isTimeCheck.value = plan.timeCheck === 1; // 将 1 转换为 true，0 转换为 false
isTimeCheck.value = false; // 将 1 转换为 true，0 转换为 false ----目前不用守时检测，先去除
} else {
// 处理未找到计划的情况
isTimeCheck.value = false; // 或者其他默认值

62
frontend/src/views/machine/errorSystem/components/errorSystemDetailTable.vue
View File

@@ -113,6 +113,7 @@
import { useDictStore, } from '@/stores/modules/dict'
import {CirclePlus, Delete, EditPen,CopyDocument} from '@element-plus/icons-vue'
import { type CascaderOption, type FormItemRule } from 'element-plus';
import { el } from 'element-plus/es/locale';
import { type PropType, type Ref, ref, watch } from 'vue';
import { defineEmits } from 'vue';
const emit = defineEmits(['updateTableData']);
@@ -138,15 +139,47 @@
});
// const aaa = 'Freq_Deviation_Freq''FREQ' -
// 定义一个 Map 来存储误差和脚本系统信息
const errSysAndScriptMap = new Map<string, string>([
['Freq_Deviation_Freq','FREQ'],//频率偏差/频率---频率
['Vol_Deviation_Vol','VRMS'],//电压偏差/电压---电压/相电压有效值
['MSQI_V','V_UNBAN'],//三相不平衡/电压---电压/三相电压负序不平衡度
['MSQI_CUR','I_UNBAN'],//三相不平衡/电流---电流/三相电流负序不平衡度
['Voltage Fluctuation_Voltage Amplitude',''],//电压波动/电压幅值---
['Voltage Fluctuation_Duration',''],//电压波动/持续时间---
['Short Time Flicker Item','PST'],//闪变/短时间闪变---闪变/短时间闪变
['Harmonic_Voltage','V2-50'],//谐波/电压---谐波/谐波电压含有率
['Harmonic_Current','I2-50'],//谐波/电流---谐波/谐波电流幅值
['Harmonic_Angle','VA2-50'],//谐波/相角---谐波/谐波电压相角
['Harmonic_Angle','IA2-50'],//谐波/相角---谐波/谐波电流相角
['Harmonic_Power','P2-50'],//谐波/功率---谐波/谐波有功功率
['Interharmonic_Voltage','SV_1-49'],//间谐波/电压---谐波/间谐波电压含有率
['Interharmonic_Current','SI_1-49'],//间谐波/电流---谐波/间谐波电流幅值
['High Frequency Harmonic_Voltage',''],//高频次谐波/电压
['High Frequency Harmonic_Current',''],//高频次谐波/电流
['Power Item','P'],//功率/功率---功率
['Current Item','IRMS'],//电流/电流---电流/电流有效值
['Dip & Swell & Short duration interruption_Voltage','MAG'],//暂态/电压幅值/电压---暂态/电压幅值
['Dip & Swell & Short duration interruption_Duration','DUR'],//暂态/持续时间/时间---暂态/持续时间
]);
const handleErrorTypeChange = (value: any, row: any) =>{
// 使用示例
const matchedRow = findRowById(row, props.errorOptions);
row.scriptType = value;
// const matchedRow = findRowById(row.errorType, props.errorOptions);//选中误差id找对应结构中的含chilren的code
// console.log('matchedRow.code',matchedRow.code)
// const code = errSysAndScriptMap.get(matchedRow?.code || '') || ''; // 确保 code 不为 undefined
// console.log('code',code)
// if (code) {
// const matchedRow2 = findRowByCode(code, props.scriptOptions);//误差code映射脚本code，找对应脚本结构中含children的id
// console.log('matchedRow2',matchedRow2)
// if (matchedRow2) {
// row.scriptType = matchedRow2.value;
// }else{
// row.scriptType = '';//如果没有找到匹配的脚本，置空
// }
// }else{
// row.scriptType = '';//如果没有找到匹配的脚本，置空
// }
}
@@ -167,6 +200,23 @@ const findRowById = (id: string, options: any[]): any | null => {
};
// 假设 props.errorOptions 是一个数组，每个元素可能包含 children 属性
const findRowByCode = (code: string, options: any[]): any | null => {
for (const option of options) {
if (option.code === code) {
return option;
}
if (option.children && option.children.length > 0) {
const result = findRowByCode(code, option.children);
if (result) {
return result;
}
}
}
return null;
};
// 监听 props.tableData 的变化，确保每次数据变化时都重新设置 sort
watch(() => props.tableData, async (newTableData) => {
for (let i = 0; i < newTableData.length; i++) {

88
frontend/src/views/machine/testScript/components/setValueTable.vue
View File

@@ -1,11 +1,93 @@
<template>
<div>
import { ref } from "vue"
<template>
<el-dialog :title="dialogTitle" v-model='dialogVisible' @close="close" v-bind="dialogBig" >
<div class='table-box'>
<ProTable
ref='proTable'
:columns='columns'
:request-api="getTableList"
:pagination="false"
:toolButton ='false'
:style="{ height: '250px',maxHeight: '400px',overflow:'hidden'}"
>
<!-- :data='testScriptData' 如果要显示静态数据，就切换该配置 -->
<!-- 表格 header 按钮 -->
<template #tableHeader='scope'>
<el-button v-auth.testScript="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
<el-button v-auth.testScript="'delete'" type='danger' :icon='Delete' plain :disabled='!scope.isSelected'
@click='batchDelete(scope.selectedListIds)'>
删除
</el-button>
</template>
<!-- 表格操作 -->
<template #operation='scope'>
<el-button v-auth.testScript="'upgrade'" type='primary' v-if="scope.row.type !== 1" link :icon='Share' @click='updateType(scope.row)'>复制</el-button>
<el-button v-auth.testScript="'edit'" type='primary' link :icon='EditPen' :model-value="false" @click="openDialog('edit', scope.row)">编辑</el-button>
<el-button v-auth.testScript="'delete'" type='primary' link :icon='Delete' @click='handleDelete(scope.row)'>删除</el-button>
</template>
</ProTable>
</div>
</template>
<template #footer>
<div >
<el-button @click='close()'>取 消</el-button>
<el-button type="primary" @click='save()'>保存</el-button>
</div>
</template>
</el-dialog>
<SetValuePopup ref='setValuePopup' />
</template>
<script setup lang="ts">
import type { TestScript } from '@/api/device/interface/testScript'
import type { ColumnProps } from '@/components/ProTable/interface'
import {reactive, ref } from 'vue'
import { dialogBig } from '@/utils/elementBind'
const dialogVisible = ref(false)
const dialogTitle = ref('')
// 表格配置项
const columns = reactive<ColumnProps<TestScript.ResTestScript>[]>([
{ type: 'selection', fixed: 'left', width: 70 },
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
{
prop: 'name',
label: '参考设定值类型',
minWidth: 350,
},
{
prop: 'standardName',
label: '参考设定值子类型',
minWidth: 150,
},
{
prop: 'standardTime',
label: '参考设定值',
minWidth: 150,
},
{ prop: 'operation', label: '操作', fixed: 'right', width: 250 },
])
// 打开弹窗，可能是新增，也可能是编辑
const open = (sign: string,row: any) => {
dialogVisible.value = true
dialogTitle.value = sign === 'add'? '新增检测项目信息' : '编辑检测项目信息'
}
// 关闭弹窗
const close = () => {
dialogVisible.value = false
}
// 对外映射
defineExpose({ open })
</script>
<style scoped>

180
frontend/src/views/machine/testScript/components/testProjectPopup.vue
View File

@@ -1,15 +1,72 @@
<template>
<el-dialog :title="dialogTitle" v-model='dialogVisible' @close="close" v-bind="dialogBig">
<el-dialog :title="dialogTitle" v-model='dialogVisible' @close="close" v-bind="dialogBig" width="1400px">
<div class="dialog-content" >
<el-tabs type="border-card" style="height: 100%;">
<el-tab-pane >
<el-tabs type="border-card" class="left-tabs" style="height: 100%;">
<el-tab-pane label="输出菜单">
<!-- 输出菜单内容 -->
<el-table :data="tableData"
:header-cell-style="{ textAlign: 'center',backgroundColor: '#003078',color: '#fff' } "
:cell-style="{ textAlign: 'center' }"
style="width: 100%"
:style="{ height: '295px',overflow:'hidden'}"
:show-header="false"
:span-method="arraySpanMethod">
<el-table-column prop="sort" label="相别" width="60" />
<el-table-column prop="frequency" label="电压/电流" width="90" />
<el-table-column prop="L1" label="值" width="180"/>
<el-table-column label="操作" width="80">
<template #default="{ }">
<el-button type="info" :icon="Bottom"></el-button>
</template>
</el-table-column>
<el-table-column label="操作">
<template #default="{ row, $index }">
<el-button :type="buttonTypes[$index].channel || 'info'" @click="toggleType(row, $index,'channel')">通道使能</el-button>
<el-button :type="buttonTypes[$index]?.harmonic || 'info'" @click="toggleType(row, $index, 'harmonic')">谐波使能</el-button>
<el-button :type="buttonTypes[$index]?.interHarmonic || 'info'" @click="toggleType(row, $index, 'interHarmonic')">间谐波使能</el-button>
<el-button :type="buttonTypes[$index]?.flicker || 'info'" @click="toggleType(row, $index, 'flicker')">闪变使能</el-button>
<el-button :type="buttonTypes[$index]?.transient || 'info'" @click="toggleType(row, $index, 'transient')">暂态使能</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
<el-tabs type="border-card" class="right-tabs" style="height: 100%;">
<el-tab-pane label="全局设置菜单">
<!-- 全局设置菜单内容 -->
<div class="form-item-container">
<el-form-item label="频率(Hz)" prop='name'>
<el-input />
</el-form-item>
</div>
<div class="button-label-container">
<label>参考设定值列表:</label>
<el-button type="primary" :icon='EditPen' @click="openDialog">编辑</el-button>
</div>
</el-tab-pane>
</el-tabs>
</div>
<div style="margin-top: 20px;">
<el-tabs type="border-card" class="custom-tabs">
<el-tab-pane label="电压/电流编辑">
<TestScriptVolCurTab/>
</el-tab-pane>
<el-tab-pane label="谐波编辑">
<TestScriptHarmTab/>
</el-tab-pane>
<el-tab-pane label="间谐波编辑">
<TestScriptInHarmTab/>
</el-tab-pane>
<el-tab-pane label="闪变编辑">
<TestScriptFlickerTab/>
</el-tab-pane>
<el-tab-pane label="暂态编辑">
<TestScriptDipTab/>
</el-tab-pane>
</el-tabs>
</div>
<!-- <SetValueTable ref="setValueTable"/> -->
<SetValueTable ref="setValueTable"/>
<template #footer>
<div >
@@ -19,19 +76,65 @@
</template>
</el-dialog>
</template>
</template>
<script setup lang="ts">
import { dialogBig } from '@/utils/elementBind'
import { ref } from 'vue'
import { onMounted, reactive, ref } from 'vue'
import SetValueTable from '@/views/machine/testScript/components/setValueTable.vue';
import {EditPen,ArrowDown, Bottom} from '@element-plus/icons-vue'
import { type TabsInstance } from 'element-plus';
import TestScriptVolCurTab from '@/views/machine/testScript/components/testScriptVolCurTab.vue';
import TestScriptHarmTab from '@/views/machine/testScript/components/testScriptHarmTab.vue';
import TestScriptInHarmTab from '@/views/machine/testScript/components/testScriptInHarmTab.vue';
import TestScriptFlickerTab from '@/views/machine/testScript/components/testScriptFlickerTab.vue';
import TestScriptDipTab from '@/views/machine/testScript/components/testScriptDipTab.vue';
const dialogVisible = ref(false)
const dialogTitle = ref()
const setValueTable = ref()
const buttonTypeOptions = ['default', 'text', 'success', 'warning', 'info', 'primary', 'danger'] as const;
type ButtonType = typeof buttonTypeOptions[number];
// 初始化按钮类型
const buttonTypes = reactive<{ [key: number]: { channel: ButtonType, harmonic: ButtonType, interHarmonic: ButtonType, flicker: ButtonType, transient: ButtonType } }>({});
const tableData= [
{ sort: 'L1', frequency: 'V', L1: '电压:57.75V 相角:0°'},
{ sort: 'L1', frequency: 'I', L1: '电压:57.75V 相角:0°'},
{ sort: 'L2', frequency: 'V', L1: '电压:57.75V 相角:0°'},
{ sort: 'L2', frequency: 'I', L1: '电压:57.75V 相角:0°'},
{ sort: 'L3', frequency: 'V', L1: '电压:57.75V 相角:0°'},
{ sort: 'L3', frequency: 'I', L1: '电压:57.75V 相角:0°'},
]
// 定义 span-method 逻辑
const arraySpanMethod = ({ rowIndex, columnIndex }: { rowIndex: number; columnIndex: number }) => {
if (columnIndex === 0 || columnIndex === 3) { // 第一列
if (rowIndex % 2 === 0) {
return {
rowspan: 2,
colspan: 1
};
} else {
return {
rowspan: 0,
colspan: 0
};
}
}
};
// 切换按钮类型
const toggleType = (row: any, $index: number, buttonType: 'channel' | 'harmonic' | 'interHarmonic' | 'flicker' | 'transient') => {
if ($index !== undefined) {
const currentType = buttonTypes[$index][buttonType];
buttonTypes[$index][buttonType] = currentType === 'info' ? 'primary' : 'info';
}
};
// 关闭弹窗
const close = () => {
dialogVisible.value = false
@@ -42,11 +145,29 @@ const save = () => {
}
// 打开弹窗，可能是新增，也可能是编辑
const open = (sign: string,row: any) => {
dialogVisible.value = true
dialogTitle.value = sign === 'create'? '新增测试脚本' : '编辑测试脚本'
dialogTitle.value = sign === 'add'? '新增检测项目信息' : '编辑检测项目信息'
// 初始化按钮类型
tableData.forEach((_, index) => {
buttonTypes[index] = {
channel: 'info',
harmonic: 'info',
interHarmonic: 'info',
flicker: 'info',
transient: 'info'
};
});
}
// 打开 drawer(新增、编辑)
const openDialog = () => {
setValueTable.value?.open()
}
@@ -55,5 +176,44 @@ defineExpose({ open })
</script>
<style scoped>
.dialog-content {
display: flex;
justify-content: flex-start;
align-items: stretch;
height: 100%;
}
.tabs-container {
display: flex;
flex-direction: row;
height: 100%;
width: 100%;
}
.left-tabs {
flex: 3; /* 左侧 tab 占据 3/4 的宽度 */
margin-right: 10px; /* 可选：添加间距 */
}
.right-tabs {
flex: 1; /* 右侧 tab 占据 1/4 的宽度 */
}
.form-item-container {
display: flex;
justify-content: center; /* 水平居中 */
margin-bottom: 10px; /* 可选：添加间距 */
}
.button-label-container {
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
}
.button-label-container label {
margin-right: 10px; /* 按钮和文字之间的距离 */
}
</style>

2
frontend/src/views/machine/testScript/components/testScriptDetail.vue
View File

@@ -18,7 +18,7 @@
<el-tab-pane
v-for="tab in props.options"
:key="tab.name"
:label="tab.label"
:label="tab.label.replace(/准确度|检测/g, '')"
:name="tab.name">
<!-- 频率tab -->
<el-tabs type="border-card" style="height: 400px;">

41
frontend/src/views/machine/testScript/components/testScriptDipTab.vue Normal file
View File

@@ -0,0 +1,41 @@
<template>
<div class="editor-container">
<div class="left-editor">
<!-- 左侧编辑区域内容 -->
<canvas ref="canvas" width="600" height="165"></canvas>
</div>
<div class="right-editor">
<!-- 右侧编辑区域内容 -->
<el-form-item label="设定幅度(%)">
<el-input v-model="input1" />
</el-form-item>
<el-form-item label="持续时间(周波)">
<el-input v-model="input2" />
</el-form-item>
</div>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
canvas {
border: 1px solid #ccc;
}
.editor-container {
display: flex;
height: 100%;
}
.left-editor {
flex: 3; /* 左侧区域占据 3/4 的宽度 */
margin-right: 10px; /* 可选：添加间距 */
}
.right-editor {
flex: 1; /* 右侧区域占据 1/4 的宽度 */
}
</style>

75
frontend/src/views/machine/testScript/components/testScriptFlickerTab.vue Normal file
View File

@@ -0,0 +1,75 @@
<template>
<div class="tabs-container">
<el-tabs type="border-card" class="fixed-width-tabs" style="height: 100%;">
<el-tab-pane label="Modulation">
<!-- 全局设置菜单内容 -->
<div>
<el-form-item label="电压变动幅度(%)" prop='name'>
<el-input style="width: 200px;" />
</el-form-item>
</div>
<div class="form-container">
<el-form-item label="波动频度(/min/Hz)" prop='name'>
<el-input />
</el-form-item>
<el-form-item label="波动类型" prop='name'>
<el-input />
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
<el-tabs type="border-card" class="fixed-width-tabs" style="height: 100%;">
<el-tab-pane label="WaveForm">
<!-- 全局设置菜单内容 -->
<div >
<el-form-item label="波类型" prop='name'>
<el-input />
</el-form-item>
</div>
<div >
<el-form-item label="占空比(%)" prop='name'>
<el-input />
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
.form-container {
display: flex;
justify-content: space-between; /* 使两个 el-form-item 之间有间距 */
align-items: center; /* 使两个 el-form-item 垂直居中对齐 */
}
.tabs-container {
display: flex;
justify-content: center; /* 使两个 el-tabs 居中对齐 */
align-items: stretch; /* 使两个 el-tabs 高度拉伸 */
height: 100%;
padding: 0 20px; /* 可选：添加左右间距 */
}
.fixed-width-tabs {
margin-right: 100px; /* 可选：添加右侧间距 */
}
.fixed-width-tabs:last-child {
margin-right: 0; /* 最后一个 el-tabs 不需要右侧间距 */
}
.el-tab-pane {
display: flex;
flex-direction: column; /* 确保内容上下排列 */
}
.el-form-item {
margin-bottom: 20px; /* 可选：添加表单项之间的间距 */
}
</style>

135
frontend/src/views/machine/testScript/components/testScriptHarmTab.vue Normal file
View File

@@ -0,0 +1,135 @@
<template>
<div class="tabs-container">
<el-tabs type="border-card" class="right-tabs" style="height: 100%;">
<el-tab-pane label="电压通道">
<!-- 电压通道内容 -->
<div class="table-container">
<el-table :data="tableData1" border class="half-width-table">
<el-table-column prop="date" label="次数" width="60"/>
<el-table-column prop="date" label="谐波含有率" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
<el-table-column prop="name" label="谐波相角" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
</el-table>
<el-table :data="tableData2" border class="half-width-table">
<el-table-column prop="date" label="次数" width="60"/>
<el-table-column prop="date" label="谐波含有率" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
<el-table-column prop="name" label="谐波相角" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
<el-tabs type="border-card" style="height: 100%;">
<el-tab-pane label="电流通道">
<!-- 电流通道内容 -->
<div class="table-container">
<el-table :data="tableData1" border class="half-width-table">
<el-table-column prop="date" label="次数" width="60"/>
<el-table-column prop="date" label="谐波含有率" width="125">
<template #default="scope">
<el-input />
<label>123%</label>
</template>
</el-table-column>
<el-table-column prop="name" label="谐波相角" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
</el-table>
<el-table :data="tableData2" border class="half-width-table">
<el-table-column prop="date" label="次数" width="60"/>
<el-table-column prop="date" label="谐波含有率" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
<el-table-column prop="name" label="谐波相角" width="125">
<template #default="scope">
<el-input />
</template>
</el-table-column>
</el-table>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { ref } from "vue";
// 定义表格数据项的类型
interface TableItem {
date: string;
harmonicRate?: string;
harmonicPhase?: string;
name?: string;
}
// 定义并初始化 tableData
const tableData1 = ref<TableItem[]>([]);
const tableData2 = ref<TableItem[]>([]);
for (let i = 1; i <= 25; i++) {
tableData1.value.push({
date: i.toString(),
harmonicRate: `谐波含有率${i}`,
harmonicPhase: `谐波相角${i}`
});
}
for (let i = 26; i <= 50; i++) {
tableData2.value.push({
date: i.toString(),
harmonicRate: `谐波含有率${i}`,
harmonicPhase: `谐波相角${i}`
});
}
</script>
<style scoped>
.tabs-container {
display: flex;
justify-content: space-between; /* 使两个 el-tabs 之间有间距 */
height: 100%;
}
.right-tabs {
flex: 1; /* 使两个 el-tabs 占据相同的空间 */
margin-right: 10px; /* 可选：添加右侧间距 */
}
.el-tabs {
flex: 1; /* 使两个 el-tabs 占据相同的空间 */
}
.table-container {
display: flex;
justify-content: space-between; /* 使两个表格之间有间距 */
width: 100%;
}
.half-width-table {
flex: 1; /* 使两个表格占据相同的空间 */
margin-right: 10px; /* 可选：添加表格之间的间距 */
}
.half-width-table:last-child {
margin-right: 0; /* 最后一个表格不需要右侧间距 */
}
</style>

66
frontend/src/views/machine/testScript/components/testScriptInHarmTab.vue Normal file
View File

@@ -0,0 +1,66 @@
<template>
<div class="tabs-container">
<el-tabs type="border-card" class="fixed-width-tabs" style="height: 100%;">
<el-tab-pane label="间谐波A">
<!-- 全局设置菜单内容 -->
<div>
<el-form-item label="含有率(%)" prop='name'>
<el-input />
</el-form-item>
</div>
<div>
<el-form-item label="间谐波次数" prop='name'>
<el-input />
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
<el-tabs type="border-card" class="fixed-width-tabs" style="height: 100%;">
<el-tab-pane label="间谐波B">
<!-- 全局设置菜单内容 -->
<div>
<el-form-item label="含有率(%)" prop='name'>
<el-input />
</el-form-item>
</div>
<div>
<el-form-item label="间谐波次数" prop='name'>
<el-input />
</el-form-item>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
.tabs-container {
display: flex;
justify-content: center; /* 使两个 el-tabs 居中对齐 */
align-items: stretch; /* 使两个 el-tabs 高度拉伸 */
height: 100%;
padding: 0 20px; /* 可选：添加左右间距 */
}
.fixed-width-tabs {
width: 400px; /* 设置固定的宽度 */
margin-right: 100px; /* 可选：添加右侧间距 */
}
.fixed-width-tabs:last-child {
margin-right: 0; /* 最后一个 el-tabs 不需要右侧间距 */
}
.el-tab-pane {
display: flex;
flex-direction: column; /* 确保内容上下排列 */
}
.el-form-item {
margin-bottom: 20px; /* 可选：添加表单项之间的间距 */
}
</style>

44
frontend/src/views/machine/testScript/components/testScriptVolCurTab.vue Normal file
View File

@@ -0,0 +1,44 @@
<template>
<div class="editor-container">
<div class="left-editor">
<!-- 左侧编辑区域内容 -->
<canvas ref="canvas" width="600" height="165"></canvas>
</div>
<div class="right-editor">
<!-- 右侧编辑区域内容 -->
<el-form-item label="电压有效值(V)">
<el-input v-model="input1" />
</el-form-item>
<el-form-item label="电流有效值(A)">
<el-input v-model="input1" />
</el-form-item>
<el-form-item label="相角(°)">
<el-input v-model="input2" />
</el-form-item>
</div>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
canvas {
border: 1px solid #ccc;
}
.editor-container {
display: flex;
height: 100%;
}
.left-editor {
flex: 3; /* 左侧区域占据 3/4 的宽度 */
margin-right: 10px; /* 可选：添加间距 */
}
.right-editor {
flex: 1; /* 右侧区域占据 1/4 的宽度 */
}
</style>