正式检测页面修改

This commit is contained in:
caozehui
2024-12-18 15:56:59 +08:00
parent 4cfca89895
commit 2715871017
5 changed files with 660 additions and 367 deletions

View File

@@ -1,22 +1,24 @@
<template>
<div class = "dialog">
<div class="dialog-title">
<div class="dialog-title">
<el-progress
style="width: 90%"
:percentage="percentage"
:color="customColors"
/>
<!-- v-if="!isPause && activeIndex < activeTotalNum" -->
<el-button
type="primary"
v-if="!isPause"
:disabled="activeIndex===0 || activeIndex >= activeTotalNum"
v-if="!isPause&&activeIndex < activeTotalNum"
:disabled="activeIndex===0"
:icon="VideoPause"
@click="handlePauseTest"
>暂停检测</el-button
>
<el-button type="success" v-if="activeIndex >= activeTotalNum" :icon="Check" disabled>检测完成</el-button>
<el-button
type="warning"
v-if="isPause && activeIndex < activeTotalNum"
@@ -24,7 +26,7 @@
@click="handlePauseTest"
>继续检测</el-button
>
<el-button type="text" :icon="InfoFilled" @click="showTestLog">检测项进度</el-button>
<!-- <el-button
type="warning"
v-if="activeIndex >= activeTotalNum"
@@ -51,85 +53,61 @@
</template> -->
</el-table-column>
<el-table-column v-for="(item, index) in monitorList" :key="index" :label="item.label" :min-width="minwidth" align="center">
<!-- <template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template> -->
<el-table-column prop="Ua" label="通道1" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
<el-table-column prop="Ub" label="通道2" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
<el-table-column prop="Uc" label="通道3" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
<el-table-column prop="Ux" label="通道4" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
<!-- <el-table-column v-for="(item, index) in monitorList" :key="index" :prop="item.prop" :label="item.label">
</el-table-column> -->
<template v-if="chnSum<=MAX_CHN_SUM">
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth" align="center">
<!-- <template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(scope.row)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template> -->
<el-table-column v-for="(chnItem, index) in item.chnNum" :key="item.deviceID+index" :label="'通道'+(index+1)" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(item,index+1)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
</template>
<template v-else>
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
:disabled = "scope.row.resultType1=='info'"
:type="scope.row.resultType1"
size="small"
@click="handleClick(item,-1)"
>
{{ scope.row.resultValue1 }}
</el-button>
</el-tooltip>
</template>
</el-table-column>
</template>
</el-table>
</div>
<div style="height: 80px;">
<el-collapse model-value="1" accordion>
<el-collapse-item title="检测项进度" name="1">
<div ref="scrollContainer" class="dialog-log">
<div ref="scrollContainer" class="dialog-log">
<p v-for="(item, index) in testLogList" :key="index" :style="{color:item.type==='error'?'#F56C6C':'var(--el-text-color-regular)'}">
{{ item.log }} <br />
</p>
@@ -143,54 +121,70 @@
:visible="resultDialogVisible"
@update:visible="resultDialogVisible = $event"
></resultPopup>
<dataCheckSingleChannelSingleTestPopup
:visible="dataCheckSingleChannelSingleTestDialogVisable"
@update:visible="dataCheckSingleChannelSingleTestDialogVisable = $event"
></dataCheckSingleChannelSingleTestPopup>
<dataCheckSingleChannelSingleTestPopup ref="dialogRef1"/>
</template>
<script lang="tsx" setup name="test">
import { VideoPause,Refresh,Close,InfoFilled } from '@element-plus/icons-vue'
import { VideoPause,Refresh,Close,InfoFilled,Check } from '@element-plus/icons-vue'
import resultPopup from './resultPopup.vue'
import dataCheckSingleChannelSingleTestPopup from './dataCheckSingleChannelSingleTestPopup.vue'
import temptest from './temptest.vue'
import {reactive} from "vue";
const minwidth = ref(110)
const activeIndex = ref(0)
const activeTotalNum = ref(12)
const dialogRef1 = ref();
const currentRow = ref<{ id: number; scriptItemName: string; name: string; address: string; hasChildren?: boolean; children?: User[] } | null>(null);
// const currentRow = ref(null); // 用于存储当前选中的行
const monitorList = ref([
const monitorList = reactive([
{
deviceID: '1',
deviceName: '被检设备1',
chnNum: 2,
monitorIdx: 1,
label:'240001',
prop: 'Result1',
},
{
deviceID: '1',
deviceName: '被检设备1',
deviceID: '2',
deviceName: '被检设备2',
chnNum: 2,
monitorIdx: 2,
label:'240002',
prop: 'Result2',
},
{
deviceID: '2',
deviceName: '被检设备2',
deviceID: '3',
deviceName: '被检设备3',
chnNum: 2,
monitorIdx: 1,
label:'240003',
prop: 'Result3',
},
{
deviceID: '2',
deviceName: '被检设备2',
deviceID: '4',
deviceName: '被检设备4',
chnNum: 4,
monitorIdx: 2,
label:'240004',
prop: 'Result4',
}
])
// 最大通道数
const MAX_CHN_SUM = 10
// 总通道数
const chnSum = computed(() => {
let sum = 0
monitorList.forEach((item) => {
sum += item.chnNum
})
console.log(sum)
return sum
})
const scrollContainer = ref<HTMLElement | null>(null); // 声明 scrollContainer
@@ -500,7 +494,7 @@ const updateLog = () => {
log:currentTime.value + ':闪变准确度检测不合格,用时'+getTimeDifference(FLKtime),
})
}
testLogList.value.push({
type: 'info',
log:currentTime.value + ':检测结束,总用时'+getTimeDifference(timeDifference.value),
@@ -544,7 +538,7 @@ const tableRowClassName = ({
}) => {
if (row.rowIndex === activeIndex.value.toString()) {
return 'warning-row'
}
}
// else if (rowIndex === 3) {
// return 'success-row'
// }
@@ -557,7 +551,6 @@ const customColors = [
//暂停检测
const isPause = ref<boolean>(false);
const resultDialogVisible = ref(false)
const dataCheckSingleChannelSingleTestDialogVisable = ref(false);
function clear() {
}
@@ -641,8 +634,9 @@ const handleFinishTest = () => {
ElMessage.success("完成检测");
};
const handleClick = (row:any) => {
dataCheckSingleChannelSingleTestDialogVisable.value = true;
// 点击查看设备通道检测详情。参数1设备信息参数2通道号-1代表查看全部通道
const handleClick = (deviceItem:any,chnNum:number) => {
dialogRef1.value?.open(deviceItem,chnNum);
};
interface User {
@@ -2017,7 +2011,7 @@ const startTimer = () => {
}
}
else
else
{
clearInterval(timer.value)
timer.value = null;
@@ -2061,6 +2055,7 @@ watch(ts, function (newValue, oldValue) {
</script>
<style scoped lang="scss">
:deep(.el-table .header-row) {
// background-color:var(--el-color-warning-light-9);
background-color:#f5f7fa;