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:
caozehui
2024-12-18 18:53:55 +08:00
parent 2715871017
commit 4fd2f10ec6
3 changed files with 1278 additions and 1285 deletions
Download Patch File Download Diff File Expand all files Collapse all files

254
frontend/src/views/home/components/dataCheckSingleChannelSingleTestPopup.vue
View File

@@ -1,107 +1,112 @@
<template>
<el-dialog title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig">
<div class="data-check-dialog">
<div class="data-check-title">
<el-dialog title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig" draggable style="height: 100%;">
<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">
<el-option v-for="item in monitorIdxList" :key="item.value" :label="item.value"
:value="item.value"/>
</el-select>
</el-form-item>
</el-form>
</div>
<!-- <el-form-item label='通道号:'>
<el-select v-model="monitorIdx">
<el-option
v-for="item in monitorIdxList"
:key="item.value"
:label="item.value"
:value="item.value"
/>
</el-select>
</el-form-item> -->
</div>
<div class="data-check-content">
<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 class="data-check-body">
<div class="content-left-tree">
<div class="content-left-tree-switch">
<el-radio-group v-model="scriptSwitch">
<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-1', '0-2', '0-3', '1']" node-key="id" :data="treeData"
:props="defaultProps" @node-click="handleNodeClick"/>
</div>
</div>
</el-dialog>
<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 IPAddress from '@/components/IpAddress/index.vue'
import {dialogBig, dialogMiddle} from '@/utils/elementBind'
import { type Device } from '@/api/device/interface/device'
import { ElMessage, type FormItemRule } from 'element-plus'
import { addPqDev, updatePqDev } from '@/api/device/device'
import { computed, reactive, type Ref, ref } from 'vue'
import { useDictStore } from '@/stores/modules/dict'
import { CirclePlus, Delete, EditPen } from '@element-plus/icons-vue'
// 使用 dayjs 库格式化
import dayjs from 'dayjs'
import { getPqMonList } from '@/api/device/monitor'
import { type ColumnProps } from '@/components/ProTable/interface'
import { type Monitor } from '@/api/device/interface/monitor'
import { data } from "@/api/plan/autoTest.json";
import {dialogBig} from '@/utils/elementBind'
import {reactive, ref} from 'vue'
import DataCheckResultTable from './dataCheckResultTable.vue'
import DataCheckRawDataTable from './dataCheckRawDataTable.vue'
import type {CheckResult, RawData} from "@/api/check/interface";
const activeName = ref('rawDataTab')
import type {CheckResult, DataCheck, RawData} from "@/api/check/interface";
import {data as treeData} from "@/api/plan/autoTest.json";
const deviceName = ref('被检设备1');
const monitorIdx = ref('1');
const testScriptName = ref('Q/GDW 10650.4-2021 模拟式');
const errorSysName = ref('Q/GDW 10650.2-2021');
const dataRule = ref('所有值');
const scriptSwitch = ref(true);
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 = {
const formContent = reactive<DataCheck>({
testScriptName: 'Q/GDW 10650.4-2021 模拟式',
errorSysName: 'Q/GDW 10650.2-2021',
dataRule: '所有值',
deviceName: '被检设备1',
monitorIdx: '1',
})
const activeName = ref('resultTab')
const scriptSwitch = 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 monitorIdxList = [
{
value: '1',
},
{
value: '2 （不合格）',
},
{
value: '3',
},
{
value: '4 （不合格）',
},
]
// const handleNodeClick = (data) => {
// console.log(data);
// };
// const MonIsShow = ref(false)
// const DevIsShow = ref(false)
// const IsPasswordShow = ref(false)
// const dictStore = useDictStore()
// 定义弹出组件元信息
// const dialogFormRef = ref()
// const disabledDate = (time: Date) => {
// return time.getTime() > Date.now()
// }
// 点击左侧树节点触发事件
const handleNodeClick = (data) => {
console.log(data);
};
const checkResultTableData = reactive<CheckResult[]>([
{
@@ -129,6 +134,7 @@ const checkResultTableData = reactive<CheckResult[]>([
result: '合格',
}
])
const rawTableData = reactive<RawData[]>([
{
chnNum: '1',
@@ -507,7 +513,7 @@ const rawTableData = reactive<RawData[]>([
}
])
const resultTableRef=ref()
const resultTableRef = ref()
const rawDataTableRef = ref()
const visible = ref(false)
@@ -521,13 +527,13 @@ const close = () => {
visible.value = false;
};
const open = (deviceItem:any,chnNum:number) => {
const open = (deviceItem: any, chnNum: number) => {
// 发起后端请求，查询详细信息
// const deviceItem = await getDetail(planId,checkItemId,deviceItem.id, chnNum)
// 数据处理
// checkResultTableData=[];
//formContent.value = ...
visible.value = true;
}
@@ -536,39 +542,57 @@ defineExpose({
open
})
</script>
<style scoped>
.data-check-dialog{
display: flex;
flex-direction: column;
width: 100%;
}
<style lang="scss" scoped>
.data-check-title{
.data-check-dialog {
display: flex;
flex-direction: column;
width: 100%;
.data-check-head {
display: flex;
flex-direction: row;
margin-top: 5px;
width: 100%;
}
margin-top: 10px;
}
.data-check-content{
.data-check-body {
display: flex;
flex-direction: row;
width: 100%;
}
.content-right{
width: 100%;
}
.content-left-tree {
width: 240px;
max-height: 445px;
padding: 10px 0;
border: 1px solid #ccc;
.content-right-title{
margin-bottom: 10px;
}
.content-left-tree-switch {
text-align: right;
margin-right: 10px;
}
}
.content-right-Tabs{
box-sizing: border-box;
margin-top: 20px;
margin-bottom: 10px;
max-height: 400px;
.content-right {
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>