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:
sjl
2024-12-17 11:34:54 +08:00
parent a027dc75c3
commit 8984bc577e
3 changed files with 63 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -17,15 +17,15 @@
<template #tableHeader="">
<el-form :model="form" :inline="true">
<el-form-item label="关键字">
<el-input v-model="form.search" placeholder="请输入设备名称、类型"></el-input>
<el-input v-model="form.search" placeholder="请输入设备名称"></el-input>
</el-form-item>
<el-form-item label="检测状态" v-if="form.activeTabs != 3 && form.activeTabs != 4 && form.activeTabs != 5">
<el-select v-model="form.checkStatus" clearable>
<el-option
v-for="(item, index) in checkStatusList"
v-for="(item, index) in checkStatus"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></el-option>
@@ -34,10 +34,10 @@
<el-form-item label="检测结果">
<el-select v-model="form.checkResult" clearable>
<el-option
v-for="(item, index) in checkResultList"
v-for="(item, index) in checkResult"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></el-option>
@@ -46,10 +46,10 @@
<el-form-item label="报告状态" v-if="form.activeTabs != 0">
<el-select v-model="form.checkReportStatus" clearable>
<el-option
v-for="(item, index) in checkReportStatusList"
v-for="(item, index) in checkReportStatus"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></el-option>
@@ -270,6 +270,7 @@ const dataCheckDialogVisible = ref(false)
const dataCheckChangeErrSysDialogVisible = ref(false)
const matchDialogVisible = ref(false)
const dialogTitle = ref('手动检测')
const checkStateTable = ref<number[]>([0,1,2])
const dialogForm = ref<any>({
id: '',
name: '',
@@ -280,12 +281,12 @@ const dialogForm = ref<any>({
state:1,
});
const shouldShowOption = (item) => {
return !item.disabled;
//return !item.disabled;
return item;
};
tableHeight.value = window.innerHeight - 600;
const deviceData = ref<Device.ResPqDev[]>([]);
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
const operationShow = ref(false);
const documentStateShow = ref(false);
const checkStateShow = ref(true);
@@ -354,7 +355,7 @@ const checkResult: Dict[] = [
//查询条件
const form: any = ref({
activeTabs: 0, //功能选择
search: "",//搜索内容
search: null,//搜索内容
activeChildTabs: 0,//子功能选择
checkStatus: null, //检测状态
checkResult: null, //检测结果
@@ -375,19 +376,21 @@ const searchForm = ref({
// ProTable 实例
const proTable = ref<ProTableInstance>();
// 如果表格需要初始化请求参数，直接定义传给 ProTable (之后每次请求都会自动带上该参数，此参数更改之后也会一直带上，改变此参数会自动刷新表格数据)
const initParam = reactive({ type: 1, pageNum: 1, pageSize: 10 });
// dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total 这些字段，可以在这里进行处理成这些字段
// 或者直接去 hooks/useTable.ts 文件中把字段改为你后端对应的就行
const tableList = ref([]);
const boundPqDevList=ref<Device.ReqPqDevParams[]>([])//根据检测计划id查询出所有已绑定的设备
const getTableList = async (params: any) => {
const pqDevList_Result2 = await getBoundPqDevList({'planId': props.id, 'checkStateList':[0,1,2]});
boundPqDevList.value = pqDevList_Result2.data as Device.ReqPqDevParams[];
return getBoundPqDevList({'planId': props.id, 'checkStateList':[0,1,2]});
const checkStateList = ref<any>()
if(form.value.checkStatus != null){
checkStateList.value = [form.value.checkStatus]
}else{
checkStateList.value = checkStateTable.value
}
return getBoundPqDevList({'planId': props.id, 
'checkStateList': checkStateList.value,
'checkResult': form.value.checkResult,
'reportState ': form.value.checkReportStatus,
'name':form.value.search
});
};
@@ -432,7 +435,6 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
label: '检测状态',
minWidth: 100,
sortable:true,
//enum:checkStatus,
isShow:checkStateShow,
render: scope => {
return (
@@ -444,22 +446,27 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
prop: 'checkResult',
label: '检测结果',
minWidth: 100,
//enum:checkResult,
sortable:true,
render: (scope) => {
if (scope.row.checkResult === 0)
{
return <el-tag type='danger'>不符合</el-tag>
}else{
return scope.row.checkState === 1 ? '符合' : '未检'
}
else if (scope.row.checkResult === 1)
{
return '符合';
}
else if (scope.row.checkResult === 2)
{
return '未检';
}
return '';
},
},
{
prop: 'reportState',
label: '报告状态',
minWidth: 100,
enum:checkReportStatus,
sortable:true,
render: scope => {
return (
@@ -473,86 +480,16 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
minWidth: 100,
sortable:true,
isShow: documentStateShow,
render: scope => {
return (
scope.row.documentState === 0 ? '未归档' : '归档'
)
},
},
{ prop: 'operation', label: '操作', fixed: 'right', minWidth: 200 ,isShow: operationShow},
])
// // 表格配置项
// const columns = reactive([
// { type: 'selection', fixed: 'left', width: 70, isShow:selectionShow },
// { type: 'index', fixed: 'left', width: 70, label: '序号' },
// {
// prop: 'name',
// label: '设备名称',
// minWidth: 220,
// },
// {
// prop: 'dev_Type',
// label: '设备类型',
// minWidth: 100,
// },
// {
// prop: 'dev_Chns',
// label: '通道数',
// minWidth: 100,
// sortable:true,
// },
// {
// prop: 'reCheck_Num',
// label: '检测次数',
// minWidth: 100,
// sortable:true,
// // <template #header>
// // <span>检测次数</span>
// // <el-tooltip content = "最大检测次数为3次，超过会强制归档" placement="top" style="align-items: bottom;">
// // <el-icon><InfoFilled /></el-icon>
// // </el-tooltip>
// // </template>
// },
// {
// prop: 'check_State',
// label: '检测状态',
// minWidth: 100,
// sortable:true,
// isShow:checkStateShow,
// },
// {
// prop: 'check_Result',
// label: '检测结果',
// minWidth: 100,
// sortable:true,
// render: (scope) => {
// if(scope.row.check_Result === '不符合')
// {
// return (
// <el-tag type='danger'>{ scope.row.check_Result }</el-tag>
// )
// }
// else
// {
// return (
// <span>{ scope.row.check_Result }</span>
// )
// }
// },
// },
// {
// prop: 'report_State',
// label: '报告状态',
// minWidth: 100,
// sortable:true,
// },
// {
// prop: 'document_State',
// label: '归档状态',
// minWidth: 100,
// sortable:true,
// isShow: documentStateShow,
// },
// { prop: 'operation', label: '操作', fixed: 'right', minWidth: 200 ,isShow: operationShow},
// ])
// 跳转详情页
const toDetail = () => {
router.push(
@@ -599,11 +536,11 @@ const handleSearch = () => {
};
//重置
const handleRefresh = () => {
form.value.search = "";
form.value.search = null;
form.value.checkStatus = null;
form.value.checkResult = null;
form.value.checkReportStatus = null;
proTable.value?.getTableList();
};
// 表格拖拽排序
const sortTable = ({
@@ -638,6 +575,7 @@ function tableHeaderInit(val: number) {
disableCheckStatus("归档")
// operationShow.value = false;
// columns[columns.length - 1].minWidth = 100;
checkStateTable.value = [0,1,2]
tableKey.value ++;
operationShow.value = false;
documentStateShow.value = false;
@@ -661,6 +599,7 @@ function tableHeaderInit(val: number) {
// disableCheckStatus("未检")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
checkStateTable.value = [2,3]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 180;
@@ -677,6 +616,7 @@ function tableHeaderInit(val: number) {
// disableCheckStatus("未检")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
checkStateTable.value = [2]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 100;
@@ -687,6 +627,7 @@ function tableHeaderInit(val: number) {
selectionShow.value = true;
break;
case 5://数据查询
checkStateTable.value = [2,3]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 290;

3
frontend/src/views/home/index.vue
View File

@@ -81,7 +81,8 @@ const handleSelect = (key: string, keyPath: string[]) => {
//console.log(key, keyPath);
};
onMounted(() => {
//console.log();
//console.log(111);
});
</script>
<style lang="scss" scoped>

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

@@ -145,6 +145,7 @@ const activeNames = ref(['2'])
const tabShow= ref(false);
const tabLabel1 = ref('设备检测')
const editableTabsValue = ref('0')
const checkStateTable = ref<number[]>([0,1,2])
const tabsHeight = ref('calc(100vh - 538px)'); // 初始高度
const tabPaneHeight = ref('calc(100% - 5px)'); // 初始高度
@@ -267,13 +268,13 @@ const chartsData1: any = ref([]),
chartsData2: any = ref([]),
chartsData3: any = ref([]);
const getPieData = async (id: string) => {
console.log('饼图变了');
currentId.value = id; // 设置当前ID
handleCheckFunction(0)//切换左侧树，默认css功能是设备检测
//handleCheckFunction(0)//切换左侧树，默认css功能是设备检测
const boundPqDevList=ref<Device.ResPqDev[]>([])//根据检测计划id查询出所有已绑定的设备
const pqDevList_Result2 = await getBoundPqDevList({'planId': id, 'checkStateList':[0,1,2]});
const pqDevList_Result2 = await getBoundPqDevList({'planId': id,'checkStateList':[0,1,2,3]});
boundPqDevList.value = pqDevList_Result2.data as Device.ResPqDev[];
console.log('饼图列',boundPqDevList)
// 初始化计数对象
const checkStateCount: { [key: number]: number } = { 0: 0, 1: 0, 2: 0, 3: 0 };
// 遍历 boundPqDevList 并更新计数对象
@@ -282,6 +283,7 @@ const getPieData = async (id: string) => {
checkStateCount[t.checkState]++;
}
});
console.log("Check", checkStateCount)
// 统计检测结果的数量
const checkResultCount: { [key: number]: number } = { 0: 0, 1: 0, 2: 0 };
@@ -342,6 +344,7 @@ const planDetail = () => {
};
//功能选择css切换
const handleCheckFunction = (val: any) => {
editableTabsValue.value = '0';
form.value.activeChildTabs = 0;
tabsList.value.map((item: any, index: any) => {
@@ -356,6 +359,7 @@ const handleCheckFunction = (val: any) => {
switch (val) {
case 0://自动检测
checkStateTable.value = [0,1,2]
tabLabel1.value = "设备检测";
break;
case 1://手动检测
@@ -365,17 +369,19 @@ const handleCheckFunction = (val: any) => {
tabLabel1.value = "设备复检";
break;
case 3://报告生成
checkStateTable.value = [2,3]
tabLabel1.value = "报告生成";
//tabShow.value = true;
break;
case 4://设备归档
checkStateTable.value = [2]
tabLabel1.value = "设备归档";
break;
case 5://数据查询
checkStateTable.value = [2,3]
tabLabel1.value = "数据查询";
break;
}
form.value.activeTabs = val;
};
@@ -397,7 +403,7 @@ onMounted(async () => {
const reqPlan: Plan.ReqPlan = {
pattern: patternId,
datasourceIds: "",
sourceIds: [],
sourceIds: "",
planId: "",
scriptName: "",
errorSysName: "",
@@ -420,7 +426,7 @@ onMounted(async () => {
resizeObserver.observe(chartsInfoRef.value);
}
getTree(planList.data);
console.log('挂载')
//getPieData('');
});