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

frontend/src/views/home/components/test.vue

Browse Source 
frontend/src/views/home/components/timeTest.vue
This commit is contained in:
sjl
2024-12-20 10:43:43 +08:00
parent d11e4822ed 93b67fe845
commit f0b75eae2f
8 changed files with 2601 additions and 2556 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
frontend/src/api/check/interface/index.ts
View File

@@ -1,3 +1,11 @@
export interface DataCheck {
testScriptName: string,
errorSysName: string,
dataRule: string,
deviceName: string,
monitorIdx: string,
}
/** /**
* 用于定义 查看（设备）通道检测结果 类型 * 用于定义 查看（设备）通道检测结果 类型
*/ */
@@ -24,10 +32,65 @@ export interface RawDataItem {
L3: number L3: number
} }
// 用来描述检测脚本类型
export interface ScriptItem {
id: string,
scriptItemName: string,
children?: ScriptItem[]
}
// 用来描述 通道检测结果
export enum ChnCheckResultEnum {
UNKNOWN = -1,
FAIL = 0,
SUCCESS = 1,
}
//用来描述 某个脚本测试项对所有通道的检测结果
export interface ScriptChnItem {
scriptID: string
scriptItemName: string
// 设备
devices: Array<{
deviceID: string,
deviceName: string,
chnResult: ChnCheckResultEnum[] //通道检测结果
}>
}
/** /**
* 用于定义 （设备）通道的原始数据 * 用于描述 （设备）通道检测结果展示的按钮类型
*/ */
export interface RawData { export interface ButtonResult {
chnNum: string, resultType: 'info' | 'success' | 'danger',
rawDataItems: RawDataItem[] resultValue: '-' | '√' | '×'
} }
/**
* 用于描述 脚本检测结果展示的按钮类型
*/
export interface ScriptChnViewItem {
scriptID: string,
scriptItemName: string //脚本项名称
// 设备
devices:Array<{
deviceID: string,
deviceName: string,
chnResult: ButtonResult[],
}>
}
/**
* 定义检测日志类型
*/
export interface LogItem {
type: 'info' | 'error'
log: string
}

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

@@ -456,6 +456,7 @@ const currentStepStatus = ref<'error' | 'finish' | 'wait' | 'success' | 'process
total.value = 0; total.value = 0;
activeIndex.value = 0 activeIndex.value = 0
qualified.value = 0 qualified.value = 0
active.value = 0
dialogVisible.value = false dialogVisible.value = false
} }

36
frontend/src/views/home/components/dataCheckRawDataTable.vue
View File

@@ -1,42 +1,28 @@
<template> <template>
<div class="table-main"> <div class="table-main">
<el-collapse v-model="activeName" accordion style="width: 100%;height:335px"> <el-table :data="tableData" stripe border :header-cell-style="{ textAlign: 'center' } "
<el-collapse-item v-for="(item, index) in tableData" :key="index+1" :title="'通道'+ (index+1)" :name="'通道'+ (index+1)"> :cell-style="{ textAlign: 'center' }" height="335px"
style="width: 100%;">
<el-table :data="item.rawDataItems" stripe border :header-cell-style="{ textAlign: 'center' } " <el-table-column type="index" label="序号" width="70" fixed="left"/>
:cell-style="{ textAlign: 'center' }" height="335px" style="width: 100%;max-height: 250px;overflow-y: auto;"> <el-table-column prop="updateTime" label="数据时间"/>
<el-table-column type="index" fixed="left" label="序号" width="70"/> <el-table-column prop="L1" label="L1（V）"/>
<el-table-column prop="updateTime" label="数据时间"/> <el-table-column prop="L2" label="L2（V）"/>
<el-table-column prop="L1" label="L1（V）"/> <el-table-column prop="L3" label="L3（V）"/>
<el-table-column prop="L2" label="L2（V）"/> </el-table>
<el-table-column prop="L3" label="L3（V）"/>
</el-table>
</el-collapse-item>
</el-collapse>
</div> </div>
</template> </template>
<script lang="tsx" setup> <script lang="tsx" setup>
import type {RawData} from "@/api/check/interface"; import type {RawDataItem} from "@/api/check/interface";
const {tableData} = defineProps<{ const {tableData} = defineProps<{
tableData:RawData[] tableData: RawDataItem[]
}>() }>()
const activeName = ref('通道1')
// 清空数据
const clear = () => {
activeName.value = '通道1'
}
defineExpose({
clear
})
</script> </script>
<style scoped> <style scoped>

9
frontend/src/views/home/components/dataCheckResultTable.vue
View File

@@ -3,7 +3,11 @@
<div class="table-main"> <div class="table-main">
<el-table :data="tableData" height="335px" :header-cell-style="{ textAlign: 'center' } " <el-table :data="tableData" height="335px" :header-cell-style="{ textAlign: 'center' } "
:cell-style="{ textAlign: 'center' }"> :cell-style="{ textAlign: 'center' }">
<el-table-column prop="chnNum" label="序号" width="70"/> <el-table-column prop="chnNum" label="通道号" width="80">
<template #default="{row}">
{{ '通道' + row.chnNum }}
</template>
</el-table-column>
<el-table-column prop="standardValue" label="标准值（V）"/> <el-table-column prop="standardValue" label="标准值（V）"/>
<el-table-column label="L1（V）"> <el-table-column label="L1（V）">
<el-table-column prop="L1" width="80" label="被检值"> <el-table-column prop="L1" width="80" label="被检值">
@@ -33,9 +37,6 @@
</el-table-column> </el-table-column>
<el-table-column prop="result" label="检测结果"> <el-table-column prop="result" label="检测结果">
<!-- <template #default="scope">
<el-tag :type="scope.row.Result === '合格' ? 'success' : 'danger'">{{ scope.row.Result }}</el-tag>
</template> -->
<template #default="scope"> <template #default="scope">
<el-tag type="danger" v-if="scope.row.result === '不合格'">{{ scope.row.result }}</el-tag> <el-tag type="danger" v-if="scope.row.result === '不合格'">{{ scope.row.result }}</el-tag>
<span v-if="scope.row.result != '不合格'">{{ scope.row.result }}</span> <span v-if="scope.row.result != '不合格'">{{ scope.row.result }}</span>

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

@@ -1,107 +1,132 @@
<template> <template>
<el-dialog title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig"> <el-dialog :append-to-body="appendToBody" class="dialog" title="数据查询" :model-value='visible' @close="close"
<div class="data-check-dialog"> v-bind="dialogBig" :draggable="false" style="margin-left: 20%;">
<div class="data-check-title"> <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-form-item label='通道号:'> <el-radio-button label="不合格测试项" :value="0"/>
<el-select v-model="monitorIdx"> <el-radio-button label="全部测试项" :value="1"/>
<el-option </el-radio-group>
v-for="item in monitorIdxList" </div>
:key="item.value" <div class="content-tree">
:label="item.value" <el-tree :default-expanded-keys="['0', '0-1', '0-2', '0-3', '1']" node-key="id" :data="treeData"
:value="item.value" :props="defaultProps" @node-click="handleNodeClick"/>
/> </div>
</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> </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> </template>
<script setup lang='ts'> <script setup lang='ts'>
import {dialogBig} from '@/utils/elementBind'
import IPAddress from '@/components/IpAddress/index.vue' import {reactive, ref} from '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 DataCheckResultTable from './dataCheckResultTable.vue'
import DataCheckRawDataTable from './dataCheckRawDataTable.vue' import DataCheckRawDataTable from './dataCheckRawDataTable.vue'
import type {CheckResult, RawData} from "@/api/check/interface"; import type {CheckResult, DataCheck, RawDataItem} from "@/api/check/interface";
import {data as treeData} from "@/api/plan/autoTest.json";
const activeName = ref('rawDataTab')
const deviceName = ref('被检设备1'); const {appendToBody} = withDefaults(defineProps<{
const monitorIdx = ref('1'); appendToBody: boolean
const testScriptName = ref('Q/GDW 10650.4-2021 模拟式'); }>(), {appendToBody: false})
const errorSysName = ref('Q/GDW 10650.2-2021');
const dataRule = ref('所有值');
const scriptSwitch = ref(true); const formContent = reactive<DataCheck>({
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°'); testScriptName: 'Q/GDW 10650.4-2021 模拟式',
const defaultProps = { 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", children: "children",
label: "name", label: "name",
pid: "pid", pid: "pid",
}; };
// const monitorIdxList = [ const monitorIdxList = [
// { {
// value: '1', value: '1',
// }, },
// { {
// value: '2', value: '2 （不合格）',
// }, },
// { {
// value: '3', value: '3',
// }, },
// { {
// value: '4', value: '4 （不合格）',
// }, },
// ] ]
// const handleNodeClick = (data) => { // 改变通道号下拉框触发事件
// console.log(data); const handleChnNumChange = (data: any) => {
// }; console.log(data);
// const MonIsShow = ref(false) }
// const DevIsShow = ref(false)
// const IsPasswordShow = ref(false) // 切换不合格测试项、全部测试项 触发事件
// const dictStore = useDictStore() const handleCheckItemSwitch = (data: any) => {
// 定义弹出组件元信息 // 0 不合格测试项、1 全部测试项
// const dialogFormRef = ref() if (data === 0) {
// const disabledDate = (time: Date) => {
// return time.getTime() > Date.now() } else {
// }
}
}
// 点击左侧树节点触发事件
const handleNodeClick = (data: any) => {
console.log(data);
};
const checkResultTableData = reactive<CheckResult[]>([ const checkResultTableData = reactive<CheckResult[]>([
{ {
@@ -115,399 +140,133 @@ const checkResultTableData = reactive<CheckResult[]>([
L3_errValue: 0.01, L3_errValue: 0.01,
maxErrVaule: 0.05774, maxErrVaule: 0.05774,
result: '合格', 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 rawTableData = reactive<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 rawDataTableRef = ref()
const visible = ref(false) const visible = ref(false)
@@ -516,18 +275,17 @@ const close = () => {
//数据清空 //数据清空
activeName.value = 'rawDataTab' activeName.value = 'rawDataTab'
rawDataTableRef.value?.clear()
visible.value = false; visible.value = false;
}; };
const open = (deviceItem:any,chnNum:number) => { const open = (deviceItem: any, chnNum?: number) => {
// 发起后端请求，查询详细信息 // 发起后端请求，查询详细信息
// const deviceItem = await getDetail(planId,checkItemId,deviceItem.id, chnNum) // const deviceItem = await getDetail(planId,checkItemId,deviceItem.id, chnNum)
// 数据处理 // 数据处理
// checkResultTableData=[]; // checkResultTableData=[];
//formContent.value = ...
visible.value = true; visible.value = true;
} }
@@ -536,39 +294,70 @@ defineExpose({
open open
}) })
</script> </script>
<style scoped>
.data-check-dialog{ <style lang="scss" scoped>
.dialog {
display: flex;
flex-direction: column;
overflow-y: hidden;
overflow-x: hidden;
width: 100%;
.data-check-dialog {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%;
}
.data-check-title{ .data-check-head {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-top: 5px; width: 100%;
width: 100%; }
}
.data-check-content{ .data-check-body {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width: 100%; width: 100%;
}
.content-right{ .content-left-tree {
width: 100%; display: flex;
} flex-direction: column;
align-items: center;
.content-right-title{ padding: 10px 0;
margin-bottom: 10px; border: 1px solid #ccc;
}
.content-right-Tabs{ .content-tree {
box-sizing: border-box; width: 250px;
margin-top: 20px; max-width: 250px;
margin-bottom: 10px; height: 450px;
max-height: 400px; max-height: 450px;
overflow-x: auto;
overflow-y: auto;
margin-top: 10px;
}
}
.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> </style>

48
frontend/src/views/home/components/table.vue
View File

@@ -25,7 +25,7 @@
v-for="(item, index) in checkStatus" v-for="(item, index) in checkStatus"
:label="item.label" :label="item.label"
:value="item.id" :value="item.id"
:key="index" :key="index"
v-show="shouldShowOption(item)" v-show="shouldShowOption(item)"
></el-option> ></el-option>
@@ -37,7 +37,7 @@
v-for="(item, index) in checkResult" v-for="(item, index) in checkResult"
:label="item.label" :label="item.label"
:value="item.id" :value="item.id"
:key="index" :key="index"
v-show="shouldShowOption(item)" v-show="shouldShowOption(item)"
></el-option> ></el-option>
@@ -49,7 +49,7 @@
v-for="(item, index) in checkReportStatus" v-for="(item, index) in checkReportStatus"
:label="item.label" :label="item.label"
:value="item.id" :value="item.id"
:key="index" :key="index"
v-show="shouldShowOption(item)" v-show="shouldShowOption(item)"
></el-option> ></el-option>
@@ -100,7 +100,7 @@
>归档</el-button> >归档</el-button>
<!-- <el-button type="primary" :icon="CirclePlus" @click="addDevice('设备新增')" v-if="form.activeTabs === 0" <!-- <el-button type="primary" :icon="CirclePlus" @click="addDevice('设备新增')" v-if="form.activeTabs === 0"
>设备新增</el-button> --> >设备新增</el-button> -->
<el-button type="primary" :icon="Odometer" @click="handleTest('系数校准')" v-if="form.activeTabs === 0" <el-button type="primary" :icon="Odometer" @click="handleTest('系数校准')" v-if="form.activeTabs === 0"
>系数校准</el-button> >系数校准</el-button>
</el-form-item> </el-form-item>
@@ -114,8 +114,7 @@
:icon="View" :icon="View"
@click="openDrawer('查看', scope.row)" @click="openDrawer('查看', scope.row)"
v-if="form.activeTabs === 3 && form.activeChildTabs === 1" v-if="form.activeTabs === 3 && form.activeChildTabs === 1"
>查看</el-button >查看</el-button>
>
<el-button <el-button
type="primary" type="primary"
@@ -123,8 +122,7 @@
:icon="Download" :icon="Download"
@click="openDrawer('报告下载', scope.row)" @click="openDrawer('报告下载', scope.row)"
v-if="form.activeTabs === 3 && form.activeChildTabs === 0 && scope.row.reportState === 1" v-if="form.activeTabs === 3 && form.activeChildTabs === 0 && scope.row.reportState === 1"
>报告下载</el-button >报告下载</el-button>
>
<!-- <div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0"> <!-- <div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0">
<el-dropdown trigger='click'> <el-dropdown trigger='click'>
@@ -147,8 +145,7 @@
:icon="Postcard" :icon="Postcard"
@click="openDrawer('生成', scope.row)" @click="openDrawer('生成', scope.row)"
v-if="form.activeTabs === 3" v-if="form.activeTabs === 3"
>报告生成</el-button >报告生成</el-button>
>
<!-- <el-button <!-- <el-button
type="primary" type="primary"
link link
@@ -164,24 +161,23 @@
@click="openDrawer('归档', scope.row)" @click="openDrawer('归档', scope.row)"
v-if="form.activeTabs === 4" v-if="form.activeTabs === 4"
:disabled = "scope.row.checkState != 2" :disabled = "scope.row.checkState != 2"
>归档</el-button >归档</el-button>
>
<el-button <el-button
type="primary" type="primary"
link link
:icon="PieChart" :icon="PieChart"
@click="openDrawer('检测数据查询', scope.row)" @click="openDrawer('检测数据查询', scope.row)"
v-if="form.activeTabs === 5" v-if="form.activeTabs === 5"
>检测数据查询</el-button >检测数据查询</el-button>
>
<el-button <el-button
type="primary" type="primary"
link link
:icon="Switch" :icon="Switch"
@click="openDrawer('误差体系更换', scope.row)" @click="openDrawer('误差体系更换', scope.row)"
v-if="form.activeTabs === 5 && scope.row.documentState === 1" v-if="form.activeTabs === 5 && scope.row.documentState === 1"
>误差体系更换</el-button >误差体系更换</el-button>
>
<div class='cn-render-buttons' v-if="form.activeTabs === 5 && scope.row.documentState === 1"> <div class='cn-render-buttons' v-if="form.activeTabs === 5 && scope.row.documentState === 1">
<el-dropdown trigger='click'> <el-dropdown trigger='click'>
@@ -208,23 +204,20 @@
</ProTable> </ProTable>
<!-- 检测过程对话框 --> <!-- 检测过程对话框 -->
<!-- <testPopup <!-- <testPopup
:visible="dialogFormVisible" :visible="dialogFormVisible"
:formData="dialogForm" :formData="dialogForm"
:dialogTitle="dialogTitle" :dialogTitle="dialogTitle"
@update:visible="dialogFormVisible = $event" @update:visible="dialogFormVisible = $event"
/> --> /> -->
<TestPopup ref="testPopup"></TestPopup> <TestPopup ref="testPopup"></TestPopup>
<reportPopup <reportPopup
:visible="reportDialogVisible" :visible="reportDialogVisible"
@update:visible="reportDialogVisible = $event" @update:visible="reportDialogVisible = $event"
></reportPopup> ></reportPopup>
<dataCheckPopup <dataCheckPopup ref="dataCheckPopupRef"/>
:visible="dataCheckDialogVisible"
@update:visible="dataCheckDialogVisible = $event"
></dataCheckPopup>
<dataCheckChangeErrSysPopup <dataCheckChangeErrSysPopup
:visible="dataCheckChangeErrSysDialogVisible" :visible="dataCheckChangeErrSysDialogVisible"
@@ -255,7 +248,7 @@ import { getPlanList } from "@/api/plan/planList";
import deviceDataList from '@/api/device/device/deviceData' import deviceDataList from '@/api/device/device/deviceData'
import TestPopup from "./testPopup.vue"; import TestPopup from "./testPopup.vue";
import reportPopup from "./reportPopup.vue"; import reportPopup from "./reportPopup.vue";
import dataCheckPopup from "./dataCheckPopup.vue"; import dataCheckPopup from "./dataCheckSingleChannelSingleTestPopup.vue";
import dataCheckChangeErrSysPopup from "./dataCheckChangeErrSysPopup.vue"; import dataCheckChangeErrSysPopup from "./dataCheckChangeErrSysPopup.vue";
import { getBoundPqDevList } from '@/api/plan/plan.ts' import { getBoundPqDevList } from '@/api/plan/plan.ts'
import { onMounted, reactive, ref, watch } from "vue"; import { onMounted, reactive, ref, watch } from "vue";
@@ -273,7 +266,9 @@ const value1 = ref("");
const value2 = ref(""); const value2 = ref("");
const tableHeight = ref(0); const tableHeight = ref(0);
const reportDialogVisible = ref(false) const reportDialogVisible = ref(false)
const dataCheckDialogVisible = ref(false)
const dataCheckPopupRef=ref<InstanceType<typeof dataCheckPopup>>()
const dataCheckChangeErrSysDialogVisible = ref(false) const dataCheckChangeErrSysDialogVisible = ref(false)
const matchDialogVisible = ref(false) const matchDialogVisible = ref(false)
const dialogTitle = ref('手动检测') const dialogTitle = ref('手动检测')
@@ -405,7 +400,7 @@ const getTableList = async (params: any) => {
}else{ }else{
checkStateList.value = checkStateTable.value checkStateList.value = checkStateTable.value
} }
return getBoundPqDevList({'planId': props.id,  return getBoundPqDevList({'planId': props.id,
'checkStateList': checkStateList.value, 'checkStateList': checkStateList.value,
'checkResult': form.value.checkResult, 'checkResult': form.value.checkResult,
'reportState': form.value.checkReportStatus, 'reportState': form.value.checkReportStatus,
@@ -867,7 +862,8 @@ const openDrawer = (title: string, row: any) => {
if(title === '检测数据查询') if(title === '检测数据查询')
{ {
dataCheckDialogVisible.value = true; let device={}
dataCheckPopupRef.value?.open(device)
} }
if (title === '误差体系更换') if (title === '误差体系更换')
{ {

3816
frontend/src/views/home/components/test.vue
View File

File diff suppressed because it is too large Load Diff

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

@@ -2,23 +2,23 @@
<template> <template>
<div class="static"> <div class="static">
<div class="left_tree"> <div class="left_tree">
<tree ref="treeRef" :updateSelectedTreeNode="getPieData || (() => {})" /> <tree ref="treeRef" :updateSelectedTreeNode="getPieData || (() => {})"/>
</div> </div>
<!-- <span class="new_span">测试scss颜色</span> --> <!-- <span class="new_span">测试scss颜色</span> -->
<div class="right_container"> <div class="right_container">
<!-- 功能选择 --> <!-- 功能选择 -->
<div class="container_function"> <div class="container_function">
<div <div
class="function_item" class="function_item"
:class=" :class="
item.checked ? 'function_item checked_function' : 'function_item' item.checked ? 'function_item checked_function' : 'function_item'
" "
v-for="(item, index) in tabsList" v-for="(item, index) in tabsList"
:key="index" :key="index"
@click="handleCheckFunction(item.value)" @click="handleCheckFunction(item.value)"
> >
<div class="item_img"> <div class="item_img">
<img :src="item.img" alt="" /> <img :src="item.img" alt=""/>
</div> </div>
<div class="item_text"> <div class="item_text">
<p>{{ item.label }}</p> <p>{{ item.label }}</p>
@@ -26,46 +26,46 @@
</div> </div>
</div> </div>
<!-- <el-collapse v-model="activeNames" @change="handleChange"> <!-- <el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item title="检测进度展示" name="1"> --> <el-collapse-item title="检测进度展示" name="1"> -->
<div class="container_pieShow"> <div class="container_pieShow">
<el-collapse model-value="1" accordion @change="handleCollapseChange"> <el-collapse model-value="1" accordion @change="handleCollapseChange">
<el-collapse-item title="&nbsp&nbsp&nbsp&nbsp&nbsp检测计划统计" name="1"> <el-collapse-item title="&nbsp&nbsp&nbsp&nbsp&nbsp检测计划统计" name="1">
<!-- 饼图 --> <!-- 饼图 -->
<div class="container_charts"> <div class="container_charts">
<div class="charts_info" ref="chartsInfoRef"> <div class="charts_info" ref="chartsInfoRef">
<pie <pie
:customData="{ :customData="{
title: '设备检测状态', title: '设备检测状态',
textAlign: 'left', textAlign: 'left',
}" }"
:legendData="{ :legendData="{
icon: 'circle', icon: 'circle',
left: 'left', left: 'left',
top: 'bottom', top: 'bottom',
}" }"
:chartsData="chartsData1" :chartsData="chartsData1"
ref="pieRef1" ref="pieRef1"
></pie> ></pie>
</div> </div>
<div class="charts_info"> <div class="charts_info">
<pie <pie
:customData="{ :customData="{
title: '设备检测结果', title: '设备检测结果',
textAlign: 'left', textAlign: 'left',
}" }"
:legendData="{ :legendData="{
icon: 'circle', icon: 'circle',
left: 'left', left: 'left',
top: 'bottom', top: 'bottom',
}" }"
:chartsData="chartsData2" :chartsData="chartsData2"
ref="pieRef2" ref="pieRef2"
></pie> ></pie>
</div> </div>
<div class="charts_info"> <div class="charts_info">
<pie <pie
:customData="{ :customData="{
title: '设备报告状态', title: '设备报告状态',
textAlign: 'left', textAlign: 'left',
label: { label: {
@@ -74,56 +74,52 @@
}, },
}, },
}" }"
:legendData="{ :legendData="{
icon: 'circle', icon: 'circle',
left: 'left', left: 'left',
top: 'bottom', top: 'bottom',
}" }"
:chartsData="chartsData3" :chartsData="chartsData3"
ref="pieRef3" ref="pieRef3"
></pie> ></pie>
</div> </div>
</div> </div>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>
</div>
<el-tabs class="tabs-menu" type="border-card" @tab-change="handleTabsChange" v-model="editableTabsValue" :style="{ height: tabsHeight }">
<el-tab-pane :label="tabLabel1" :style="{ height: tabPaneHeight }">
<!-- 列表数据 -->
<div class="container_table" :style="{ height: tableHeight }">
<Table ref="tableRef1" :id='currentId' :isTimeCheck = 'isTimeCheck'></Table>
</div>
</el-tab-pane>
<!-- <el-tab-pane label="已检设备" v-if="tabShow" :style="{ height: tabPaneHeight }">-->
<!-- &lt;!&ndash; 列表数据 &ndash;&gt;-->
<!-- <div class="container_table" :style="{ height: tableHeight }">-->
<!-- <Table ref="tableRef2" :id='currentId'></Table>-->
<!-- </div>-->
<!-- </el-tab-pane>-->
</el-tabs>
</div> </div>
<el-tabs class="tabs-menu" type="border-card" @tab-change="handleTabsChange" v-model="editableTabsValue" :style="{ height: tabsHeight }">
<el-tab-pane :label="tabLabel1" :style="{ height: tabPaneHeight }">
<!-- 列表数据 -->
<div class="container_table" :style="{ height: tableHeight }">
<Table ref="tableRef1" :id='currentId' :isTimeCheck='isTimeCheck'></Table>
</div>
</el-tab-pane>
<!-- <el-tab-pane label="已检设备" v-if="tabShow" :style="{ height: tabPaneHeight }">-->
<!-- &lt;!&ndash; 列表数据 &ndash;&gt;-->
<!-- <div class="container_table" :style="{ height: tableHeight }">-->
<!-- <Table ref="tableRef2" :id='currentId'></Table>-->
<!-- </div>-->
<!-- </el-tab-pane>-->
</el-tabs>
</div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { getStaticTreeData } from "@/api/plan/static";
import pie from "@/components/echarts/pie/default.vue"; import pie from "@/components/echarts/pie/default.vue";
import { useRouter } from "vue-router"; import {useRouter} from "vue-router";
import tree from "../components/tree.vue"; import tree from "../components/tree.vue";
import Table from "../components/table.vue"; import Table from "../components/table.vue";
//import { data } from "@/api/plan/static.json"; //import { data } from "@/api/plan/static.json";
import deviceDataList from '@/api/device/device/deviceData' import deviceDataList from '@/api/device/device/deviceData'
import {getPlanListByPattern } from '@/api/plan/plan.ts' import {getBoundPqDevList, getPlanListByPattern} from '@/api/plan/plan.ts'
import { onBeforeMount, onMounted, onUnmounted, ref, watch } from "vue"; import {onBeforeMount, onUnmounted, ref, watch} from "vue";
import { useModeStore } from '@/stores/modules/mode'; // 引入模式 store import {useModeStore} from '@/stores/modules/mode'; // 引入模式 store
import { useDictStore } from '@/stores/modules/dict' import {useDictStore} from '@/stores/modules/dict'
import { type Plan } from "@/api/plan/interface"; import {type Plan} from "@/api/plan/interface";
import type { CollapseModelValue } from "element-plus/es/components/collapse/src/collapse.mjs"; import type {CollapseModelValue} from "element-plus/es/components/collapse/src/collapse.mjs";
import { type Device } from "@/api/device/interface/device"; import {type Device} from "@/api/device/interface/device";
import { getBoundPqDevList } from '@/api/plan/plan.ts' import {ResultData} from "@/api/interface";
import { CENTERED_ALIGNMENT } from "element-plus/es/components/virtual-list/src/defaults";
import { ResultData } from "@/api/interface";
const dictStore = useDictStore() const dictStore = useDictStore()
const modeStore = useModeStore(); const modeStore = useModeStore();
@@ -143,10 +139,10 @@ const form: any = ref({
}); });
const router = useRouter(); const router = useRouter();
const activeNames = ref(['2']) const activeNames = ref(['2'])
const tabShow= ref(false); const tabShow = ref(false);
const tabLabel1 = ref('设备检测') const tabLabel1 = ref('设备检测')
const editableTabsValue = ref('0') const editableTabsValue = ref('0')
const checkStateTable = ref<number[]>([0,1,2]) const checkStateTable = ref<number[]>([0, 1, 2])
const tabsHeight = ref('calc(100vh - 538px)'); // 初始高度 const tabsHeight = ref('calc(100vh - 538px)'); // 初始高度
const tabPaneHeight = ref('calc(100% - 5px)'); // 初始高度 const tabPaneHeight = ref('calc(100% - 5px)'); // 初始高度
@@ -166,8 +162,8 @@ const handleCollapseChange = (val: CollapseModelValue) => {
} }
//const newtableHeight= val.length > 0 ? 'calc(100vh - 638px)' : 'calc(100vh - 433px)'; //const newtableHeight= val.length > 0 ? 'calc(100vh - 638px)' : 'calc(100vh - 433px)';
tabsHeight.value = newHeight; tabsHeight.value = newHeight;
tabPaneHeight.value = `calc(100% - 5px)`; tabPaneHeight.value = `calc(100% - 5px)`;
tableHeight.value = `calc(100% - 5px)`; tableHeight.value = `calc(100% - 5px)`;
// tableRef1.value.resize(); // tableRef1.value.resize();
// tableRef2.value.resize(); // tableRef2.value.resize();
@@ -220,53 +216,51 @@ const tableRef2 = ref();
const currentId = ref(''); const currentId = ref('');
watch( watch(
() => form.value, () => form.value,
(val, oldVal) => { (val, oldVal) => {
if (val) { if (val) {
if(form.value.activeTabs === 0 )//设备检测 if (form.value.activeTabs === 0)//设备检测
{
const tabledata = deviceData.filter((item) => item.document_State === "未归档")
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs, form.value.activeChildTabs, tabledata);
} else if (form.value.activeTabs === 4)//设备归档
{
const tabledata = deviceData.filter((item) => item.check_State === "检测完成" && item.document_State === "未归档")
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs, form.value.activeChildTabs, tabledata);
} else if (form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
{
const tabledata = deviceData.filter((item) => item.check_State === "检测完成");
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs, form.value.activeChildTabs, tabledata);
}
}
},
{ {
const tabledata = deviceData.filter((item) => item.document_State === "未归档") immediate: true,
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs,form.value.activeChildTabs,tabledata); deep: true,
} }
else if(form.value.activeTabs === 4)//设备归档
{
const tabledata = deviceData.filter((item) => item.check_State === "检测完成" && item.document_State === "未归档")
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs,form.value.activeChildTabs,tabledata);
}
else if(form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
{
const tabledata = deviceData.filter((item) => item.check_State === "检测完成");
tableRef1.value && tableRef1.value.changeActiveTabs(form.value.activeTabs,form.value.activeChildTabs,tabledata);
}
}
},
{
immediate: true,
deep: true,
}
); );
watch( watch(
() => form.value, () => form.value,
(val, oldVal) => { (val, oldVal) => {
if (val) { if (val) {
tableRef2.value && tableRef2.value.changeActiveTabs(form.value.activeTabs,form.value.activeChildTabs); tableRef2.value && tableRef2.value.changeActiveTabs(form.value.activeTabs, form.value.activeChildTabs);
}
},
{
immediate: true,
deep: true,
} }
},
{
immediate: true,
deep: true,
}
); );
const pieRef1 = ref(), const pieRef1 = ref(),
pieRef2 = ref(), pieRef2 = ref(),
pieRef3 = ref(); pieRef3 = ref();
const chartsData1: any = ref([]), const chartsData1: any = ref([]),
chartsData2: any = ref([]), chartsData2: any = ref([]),
chartsData3: any = ref([]); chartsData3: any = ref([]);
const findPlanById = (plans: Plan.ReqPlan[], id: string): Plan.ReqPlan | undefined => { const findPlanById = (plans: Plan.ReqPlan[], id: string): Plan.ReqPlan | undefined => {
for (const plan of plans) { for (const plan of plans) {
if (plan.id === id) { if (plan.id === id) {
return plan; return plan;
@@ -286,14 +280,14 @@ const getPieData = async (id: string) => {
//handleCheckFunction(0)//切换左侧树，默认css功能是设备检测 //handleCheckFunction(0)//切换左侧树，默认css功能是设备检测
// 初始化计数对象 // 初始化计数对象
const checkStateCount: { [key: number]: number } = { 0: 0, 1: 0, 2: 0, 3: 0 }; const checkStateCount: { [key: number]: number } = {0: 0, 1: 0, 2: 0, 3: 0};
const checkResultCount: { [key: number]: number } = { 0: 0, 1: 0, 2: 0 }; const checkResultCount: { [key: number]: number } = {0: 0, 1: 0, 2: 0};
const reportStateCount: { [key: number]: number } = { 0: 0, 1: 0, 2: 0 }; const reportStateCount: { [key: number]: number } = {0: 0, 1: 0, 2: 0};
if (id) { if (id) {
const boundPqDevList = ref<Device.ResPqDev[]>([])//根据检测计划id查询出所有已绑定的设备 const boundPqDevList = ref<Device.ResPqDev[]>([])//根据检测计划id查询出所有已绑定的设备
const plan = findPlanById(planList.value?.data || [], id); const plan = findPlanById(planList.value?.data || [], id);
if (plan) { if (plan) {
isTimeCheck.value = plan.timeCheck ===1; // 将 1 转换为 true，0 转换为 false isTimeCheck.value = plan.timeCheck === 1; // 将 1 转换为 true，0 转换为 false
} else { } else {
// 处理未找到计划的情况 // 处理未找到计划的情况
isTimeCheck.value = false; // 或者其他默认值 isTimeCheck.value = false; // 或者其他默认值
@@ -319,20 +313,20 @@ const getPieData = async (id: string) => {
} }
chartsData1.value = [ chartsData1.value = [
{ value: checkStateCount[0], name: "未检", itemStyle: { color: '#fac858' } }, {value: checkStateCount[0], name: "未检", itemStyle: {color: '#fac858'}},
{ value: checkStateCount[1], name: "检测中", itemStyle: { color: '#ee6666' } }, {value: checkStateCount[1], name: "检测中", itemStyle: {color: '#ee6666'}},
{ value: checkStateCount[2], name: "检测完成", itemStyle: { color: '#91cc75' } }, {value: checkStateCount[2], name: "检测完成", itemStyle: {color: '#91cc75'}},
{ value: checkStateCount[3], name: "归档", itemStyle: { color: '#5470c6' } }, {value: checkStateCount[3], name: "归档", itemStyle: {color: '#5470c6'}},
]; ];
chartsData2.value = [ chartsData2.value = [
{ value: checkResultCount[2], name: "未检" , itemStyle: { color: '#fac858' } }, {value: checkResultCount[2], name: "未检", itemStyle: {color: '#fac858'}},
{ value: checkResultCount[0], name: "不符合" , itemStyle: { color: '#ee6666' } }, {value: checkResultCount[0], name: "不符合", itemStyle: {color: '#ee6666'}},
{ value: checkResultCount[1], name: "符合", itemStyle: { color: '#91cc75' } }, {value: checkResultCount[1], name: "符合", itemStyle: {color: '#91cc75'}},
]; ];
chartsData3.value = [ chartsData3.value = [
{ value: reportStateCount[2], name: "未检" , itemStyle: { color: '#fac858' } }, {value: reportStateCount[2], name: "未检", itemStyle: {color: '#fac858'}},
{ value: reportStateCount[0], name: "未生成" , itemStyle: { color: '#ee6666' } }, {value: reportStateCount[0], name: "未生成", itemStyle: {color: '#ee6666'}},
{ value: reportStateCount[1], name: "已生成", itemStyle: { color: '#91cc75' } }, {value: reportStateCount[1], name: "已生成", itemStyle: {color: '#91cc75'}},
]; ];
pieRef1.value.init(); pieRef1.value.init();
@@ -343,7 +337,7 @@ const getPieData = async (id: string) => {
// pieRef3.value.reSize(470,145,true); // pieRef3.value.reSize(470,145,true);
}; };
const getTree = (data?: any) => { const getTree = (data?: any) => {
treeRef.value.getTreeData(data); treeRef.value.getTreeData(data);
}; };
//前往检测 //前往检测
const handleDetection = () => { const handleDetection = () => {
@@ -373,76 +367,75 @@ const handleCheckFunction = (val: any) => {
switch (val) { switch (val) {
case 0://自动检测 case 0://自动检测
checkStateTable.value = [0,1,2] checkStateTable.value = [0, 1, 2]
tabLabel1.value = "设备检测"; tabLabel1.value = "设备检测";
break; break;
case 1://手动检测 case 1://手动检测
tabLabel1.value = "手动检测"; tabLabel1.value = "手动检测";
break; break;
case 2://设备复检 case 2://设备复检
tabLabel1.value = "设备复检"; tabLabel1.value = "设备复检";
break; break;
case 3://报告生成 case 3://报告生成
checkStateTable.value = [2,3] checkStateTable.value = [2, 3]
tabLabel1.value = "报告生成"; tabLabel1.value = "报告生成";
//tabShow.value = true; //tabShow.value = true;
break; break;
case 4://设备归档 case 4://设备归档
checkStateTable.value = [2] checkStateTable.value = [2]
tabLabel1.value = "设备归档"; tabLabel1.value = "设备归档";
break; break;
case 5://数据查询 case 5://数据查询
checkStateTable.value = [2,3] checkStateTable.value = [2, 3]
tabLabel1.value = "数据查询"; tabLabel1.value = "数据查询";
break; break;
} }
form.value.activeTabs = val; form.value.activeTabs = val;
}; };
const resizeObserver = new ResizeObserver(entries => { const resizeObserver = new ResizeObserver(entries => {
for (let entry of entries) { for (let entry of entries) {
chartsWidth.value = entry.contentRect.width; chartsWidth.value = entry.contentRect.width;
//console.log('Charts Info Width:', chartsWidth.value); //console.log('Charts Info Width:', chartsWidth.value);
pieRef1.value.reSize(chartsWidth.value * 0.95,180,true); pieRef1.value.reSize(chartsWidth.value * 0.95, 180, true);
pieRef2.value.reSize(chartsWidth.value * 0.95,180,true); pieRef2.value.reSize(chartsWidth.value * 0.95, 180, true);
pieRef3.value.reSize(chartsWidth.value * 0.95,180,true); pieRef3.value.reSize(chartsWidth.value * 0.95, 180, true);
} }
}); });
onBeforeMount(async () => { onBeforeMount(async () => {
const patternId = dictStore.getDictData('Pattern').find(item=>item.name=== modeStore.currentMode)?.id ?? ''//获取数据字典中对应的id const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id ?? ''//获取数据字典中对应的id
const reqPlan: Plan.ReqPlan = { const reqPlan: Plan.ReqPlan = {
pattern: patternId, pattern: patternId,
datasourceIds: "", datasourceIds: "",
sourceIds: "", sourceIds: "",
planId: "", planId: "",
scriptName: "", scriptName: "",
errorSysName: "", errorSysName: "",
sourceName: "", sourceName: "",
devIds: [], devIds: [],
id: "", id: "",
name: "", name: "",
dataSourceId: "", dataSourceId: "",
scriptId: "", scriptId: "",
errorSysId: "", errorSysId: "",
timeCheck: 0, timeCheck: 0,
testState: 0, testState: 0,
reportState: 0, reportState: 0,
result: 0, result: 0,
code: 0, code: 0,
state: 0 state: 0
}; };
planList.value = (await getPlanListByPattern(reqPlan)) as ResultData<Plan.ReqPlan[]>; planList.value = (await getPlanListByPattern(reqPlan)) as ResultData<Plan.ReqPlan[]>;
console.log('qqq',planList.value) console.log('qqq', planList.value)
if (planList.value.data[0].children[0]) { if (planList.value.data[0].children[0]) {
currentId.value = planList.value.data[0].children[0].id; currentId.value = planList.value.data[0].children[0].id;
} }
if (chartsInfoRef.value) { if (chartsInfoRef.value) {
resizeObserver.observe(chartsInfoRef.value); resizeObserver.observe(chartsInfoRef.value);
} }
getTree(planList.value.data); getTree(planList.value.data);
@@ -457,7 +450,6 @@ onUnmounted(() => {
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.static { .static {
@@ -466,7 +458,7 @@ onUnmounted(() => {
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
//background-color: #eee; //background-color: #eee;
.left_tree { .left_tree {
width: 14% !important; width: 14% !important;
@@ -486,7 +478,7 @@ onUnmounted(() => {
//align-items: center; //align-items: center;
//box-sizing: border-box; //box-sizing: border-box;
.container_function { .container_function {
width: 100%; width: 100%;
height: auto; height: auto;
@@ -512,6 +504,7 @@ onUnmounted(() => {
border-radius: 8px; border-radius: 8px;
padding: 0px 30px; padding: 0px 30px;
margin-right: 50px;; margin-right: 50px;;
.item_img { .item_img {
width: 60px; width: 60px;
height: 60px; height: 60px;
@@ -541,7 +534,7 @@ onUnmounted(() => {
p { p {
margin: 0; margin: 0;
font-weight: 800; font-weight: 800;
color:#fff; color: #fff;
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei", "微软雅黑", "Arial", sans-serif; font-family: "Microsoft YaHei", "微软雅黑", "Arial", sans-serif;
} }
@@ -564,6 +557,7 @@ onUnmounted(() => {
} }
} }
} }
// .container_function { // .container_function {
// width: 100%; // width: 100%;
// height: auto; // height: auto;
@@ -645,20 +639,21 @@ onUnmounted(() => {
// } // }
// } // }
.container_pieShow{ .container_pieShow {
width: 100% !important; width: 100% !important;
//min-height: 200px !important; //min-height: 200px !important;
height:auto; height: auto;
background-color: #eee; background-color: #eee;
// display: flex; // display: flex;
// justify-content: space-between; // justify-content: space-between;
// padding-left: 2ch; // padding-left: 2ch;
margin-bottom: 10px; margin-bottom: 10px;
} }
.el-collapse { .el-collapse {
width: 100% !important; width: 100% !important;
// min-height: 200px !important; // min-height: 200px !important;
height:100% !important; height: 100% !important;
background-color: #eee; background-color: #eee;
// display: flex; // display: flex;
// justify-content: space-between; // justify-content: space-between;
@@ -666,10 +661,10 @@ onUnmounted(() => {
// margin-bottom: 10px; // margin-bottom: 10px;
} }
.el-collapse-item{ .el-collapse-item {
width: 100% !important; width: 100% !important;
// min-height: 200px !important; // min-height: 200px !important;
height:100% !important; height: 100% !important;
background-color: #eee; background-color: #eee;
// display: flex !important; // display: flex !important;
} }
@@ -677,7 +672,7 @@ onUnmounted(() => {
.container_charts { .container_charts {
width: 100%; width: 100%;
//min-height: 180px !important; //min-height: 180px !important;
height:100%; height: 100%;
background-color: #eee; background-color: #eee;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -694,14 +689,15 @@ onUnmounted(() => {
} }
} }
.el-tabs{ .el-tabs {
width: 100% !important; width: 100% !important;
border-radius: 4px; border-radius: 4px;
} }
.tabs-menu{ .tabs-menu {
height: 100%; height: 100%;
} }
.container_table { .container_table {
// width: 100%; // width: 100%;
flex: 1 !important; flex: 1 !important;
@@ -717,16 +713,19 @@ onUnmounted(() => {
} }
} }
} }
:deep(.el-collapse-item__header){
:deep(.el-collapse-item__header) {
color: var(--el-color-primary); color: var(--el-color-primary);
font-size: 14px; font-size: 14px;
font-family: "Microsoft YaHei", "微软雅黑", "Arial", sans-serif; font-family: "Microsoft YaHei", "微软雅黑", "Arial", sans-serif;
} }
:deep(.el-collapse-item__conten){
:deep(.el-collapse-item__conten) {
// background-color:#f6f6f6; // background-color:#f6f6f6;
padding-bottom: 0px !important; padding-bottom: 0px !important;
} }
:deep(.el-collapse-item__content ){
:deep(.el-collapse-item__content ) {
// background-color:#f6f6f6; // background-color:#f6f6f6;
padding-bottom: 0px !important; padding-bottom: 0px !important;
} }