365 lines
8.0 KiB
Vue
365 lines
8.0 KiB
Vue
<template>
|
||
<el-dialog :append-to-body="appendToBody" class="dialog" title="数据查询" :model-value='visible' @close="close"
|
||
v-bind="dialogBig" :draggable="false" style="margin-left: 20%;">
|
||
<div class="data-check-dialog">
|
||
<div class="data-check-head">
|
||
<el-form :model='formContent' label-width="auto" class="form-three ">
|
||
<el-form-item label="检测脚本">
|
||
<el-input v-model='formContent.testScriptName' :disabled="true"/>
|
||
</el-form-item>
|
||
<el-form-item label="误差体系">
|
||
<el-input v-model='formContent.errorSysName' :disabled="true"/>
|
||
</el-form-item>
|
||
<el-form-item label="数据原则">
|
||
<el-input v-model='formContent.dataRule' :disabled="true"/>
|
||
</el-form-item>
|
||
<el-form-item label="设备名称">
|
||
<el-input v-model='formContent.deviceName' :disabled="true"/>
|
||
</el-form-item>
|
||
<el-form-item label='通道号'>
|
||
<el-select v-model="formContent.monitorIdx" @change="handleChnNumChange">
|
||
<el-option v-for="item in monitorIdxList" :key="item.value" :label="item.value"
|
||
:value="item.value"/>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
|
||
<div class="data-check-body">
|
||
<div class="content-left-tree">
|
||
<div>
|
||
<el-radio-group v-model="checkItemSwitch" @change="handleCheckItemSwitch">
|
||
<el-radio-button label="不合格测试项" :value="0"/>
|
||
<el-radio-button label="全部测试项" :value="1"/>
|
||
</el-radio-group>
|
||
</div>
|
||
<div class="content-tree">
|
||
<el-tree :default-expanded-keys="['0', '0-2']" node-key="id" :data="treeData"
|
||
:props="defaultProps" @node-click="handleNodeClick"/>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="content-right">
|
||
<div class="content-right-title">
|
||
<el-divider>当前检测项目</el-divider>
|
||
<span>{{ currentScriptDsc }}</span>
|
||
</div>
|
||
<div class="content-right-Tabs">
|
||
<el-tabs type="border-card" v-model="activeName">
|
||
<el-tab-pane label="检测结果" name="resultTab">
|
||
<DataCheckResultTable :tableData="checkResultTableData" ref="resultTableRef"/>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="原始数据" name="rawDataTab">
|
||
<DataCheckRawDataTable :tableData="rawTableData" ref="rawDataTableRef"/>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
</template>
|
||
<script setup lang='ts'>
|
||
import {dialogBig} from '@/utils/elementBind'
|
||
import {reactive, ref} from 'vue'
|
||
import DataCheckResultTable from './dataCheckResultTable.vue'
|
||
import DataCheckRawDataTable from './dataCheckRawDataTable.vue'
|
||
import {CheckData} from "@/api/check/interface";
|
||
import {data as treeData} from "@/api/plan/autoTest.json";
|
||
|
||
const {appendToBody} = withDefaults(defineProps<{
|
||
appendToBody: boolean
|
||
}>(), {appendToBody: false})
|
||
|
||
|
||
const formContent = reactive<CheckData.DataCheck>({
|
||
testScriptName: 'Q/GDW 10650.4-2021 模拟式',
|
||
errorSysName: 'Q/GDW 10650.2-2021',
|
||
dataRule: '所有值',
|
||
deviceName: '被检设备1',
|
||
monitorIdx: '1',
|
||
})
|
||
|
||
const activeName = ref('resultTab')
|
||
|
||
const checkItemSwitch = ref(0)
|
||
|
||
const currentScriptDsc = ref('电压准确度检测：频率：42.5Hz Ua=46.192V 0° Ub=46.192V -120° Uc=46.192V 120° Ia=1A 0° Ib=1A -120° Ic=1A 120°');
|
||
|
||
const defaultProps = {
|
||
children: "children",
|
||
label: "name",
|
||
pid: "pid",
|
||
};
|
||
|
||
const monitorIdxList = [
|
||
{
|
||
value: '1',
|
||
},
|
||
{
|
||
value: '2 （不合格）',
|
||
},
|
||
{
|
||
value: '3',
|
||
},
|
||
{
|
||
value: '4 （不合格）',
|
||
},
|
||
]
|
||
|
||
// 改变通道号下拉框触发事件
|
||
const handleChnNumChange = (data: any) => {
|
||
console.log(data);
|
||
}
|
||
|
||
// 切换不合格测试项、全部测试项 触发事件
|
||
const handleCheckItemSwitch = (data: any) => {
|
||
// 0 不合格测试项、1 全部测试项
|
||
if (data === 0) {
|
||
|
||
} else {
|
||
|
||
}
|
||
}
|
||
|
||
// 点击左侧树节点触发事件
|
||
const handleNodeClick = (data: any) => {
|
||
console.log(data);
|
||
};
|
||
|
||
const checkResultTableData = reactive<CheckData.CheckResult[]>([
|
||
{
|
||
chnNum: '1',
|
||
standardValue: 57.74,
|
||
L1: 57.73,
|
||
L1_errValue: 0.01,
|
||
L2: 57.73,
|
||
L2_errValue: 0.01,
|
||
L3: 57.73,
|
||
L3_errValue: 0.01,
|
||
maxErrVaule: 0.05774,
|
||
result: '合格',
|
||
}
|
||
])
|
||
|
||
const rawTableData = reactive<CheckData.RawDataItem[]>([
|
||
{
|
||
updateTime: "2024-10-10 09:30:00",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:03",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:06",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:09",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:12",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:15",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:18",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:21",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:24",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:27",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:30",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:33",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:36",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:39",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:42",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:45",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:48",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:51",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:54",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
},
|
||
{
|
||
updateTime: "2024-10-10 09:30:57",
|
||
L1: 57.73,
|
||
L2: 57.73,
|
||
L3: 57.73,
|
||
}
|
||
])
|
||
|
||
const resultTableRef = ref()
|
||
const rawDataTableRef = ref()
|
||
|
||
const visible = ref(false)
|
||
|
||
const close = () => {
|
||
//数据清空
|
||
|
||
activeName.value = 'rawDataTab'
|
||
|
||
visible.value = false;
|
||
};
|
||
|
||
const open = (checkItemId: string, deviceId: string, chnNum?: number) => {
|
||
console.log(checkItemId, deviceId, chnNum);
|
||
// 发起后端请求，查询详细信息
|
||
//const result = await getCheckItemDetail({checkItemId,deviceId, chnNum})
|
||
|
||
// 数据处理
|
||
// checkResultTableData=[];
|
||
//formContent.value = ...
|
||
|
||
visible.value = true;
|
||
}
|
||
|
||
defineExpose({
|
||
open
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
|
||
.dialog {
|
||
display: flex;
|
||
flex-direction: column;
|
||
overflow-y: hidden;
|
||
overflow-x: hidden;
|
||
|
||
|
||
.data-check-dialog {
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.data-check-head {
|
||
display: flex;
|
||
flex-direction: row;
|
||
width: 100%;
|
||
}
|
||
|
||
.data-check-body {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-direction: row;
|
||
|
||
.content-left-tree {
|
||
width: 25%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
max-height: 473px;
|
||
|
||
padding: 10px 0;
|
||
border: 1px solid #ccc;
|
||
overflow: auto;
|
||
.content-tree {
|
||
min-width: 100%;
|
||
height: 100%;
|
||
max-height: 100%;
|
||
margin-top: 10px;
|
||
}
|
||
}
|
||
|
||
.content-right {
|
||
width: 75%;
|
||
margin-left: 10px;
|
||
flex: 1;
|
||
|
||
.content-right-title {
|
||
/*margin-bottom: 10px;*/
|
||
div {
|
||
font-size: 16px;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
|
||
.content-right-Tabs {
|
||
box-sizing: border-box;
|
||
margin-top: 20px;
|
||
margin-bottom: 10px;
|
||
max-height: 400px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
</style> |