pqs-9100_client/frontend/src/views/home/components/dataCheckSingleChannelSingleTestPopup.vue

<template>
    <el-dialog  title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig">
        <div class="data-check-dialog">
            <div class="data-check-title">

 
                
                

                <!-- <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>
    </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 DataCheckResultTable from './dataCheckResultTable.vue'
import DataCheckRawDataTable from './dataCheckRawDataTable.vue'
import type {CheckResult, RawData} from "@/api/check/interface";
  
const activeName = ref('rawDataTab')

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 = {
  children: "children",
  label: "name",
  pid: "pid",
};

// 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 checkResultTableData = reactive<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: '合格',
  },
  {
    chnNum: '2',
    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<RawData[]>([
  {
    chnNum: '1',
    rawDataItems: [
      {
        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,
      }
    ]
  },
  {
    chnNum: '2',
    rawDataItems: [
      {
        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,
      }
    ]
  },
  {
    chnNum: '3',
    rawDataItems: [
      {
        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'
  rawDataTableRef.value?.clear()

  visible.value = false;
};

const open = (deviceItem:any,chnNum:number) => {
  // 发起后端请求，查询详细信息
  // const deviceItem = await getDetail(planId,checkItemId,deviceItem.id, chnNum)

  // 数据处理
  // checkResultTableData=[];


  visible.value = true;
}

defineExpose({
  open
})
</script>
<style scoped>

.data-check-dialog{
    display: flex;
    flex-direction: column;
    width: 100%;
}

.data-check-title{
    display: flex;
    flex-direction: row;
    margin-top: 5px;
    width: 100%;
}

.data-check-content{
    display: flex;
    flex-direction: row;
    width: 100%;
}

.content-right{
    width: 100%;
}

.content-right-title{
    margin-bottom: 10px;
}

.content-right-Tabs{
    box-sizing: border-box;
    margin-top: 20px;
    margin-bottom: 10px;
    max-height: 400px;
}
</style>