样式调整

This commit is contained in:
GYYM
2024-11-29 13:45:48 +08:00
parent a1d3485ba7
commit b39c076879
17 changed files with 871 additions and 939 deletions

View File

@@ -1,5 +1,5 @@
<template>
<el-dialog title="数据查询" :model-value='visible' @close="handleCancel" v-bind="dialogBig">
<el-dialog title="数据查询" :model-value='visible' @close="handleCancel" draggable height="650px" width="1165px">
<div class="change-errsys-dialog">
<div class="change-errsys-title">
<el-form :model='formContent'>
@@ -32,7 +32,6 @@
:disabled = "plan.label === errorSysName"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
@@ -305,8 +304,7 @@ const props = defineProps<{
//clearInterval(timer.value);
activeIndex.value = 0;
tableData.value.length = 0;
tableData.value = operatorTableData.value;
tableData.value = JSON.parse(JSON.stringify(operatorTableData.value));
};
const openReportDlg = () => {

View File

@@ -1,6 +1,6 @@
<template>
<div class="table_info">
<!-- :request-api="getTableList" -->
<!-- :request-api="getTableList" -->
<ProTable
ref="proTable"
:columns="columns"
@@ -18,9 +18,9 @@
<template #tableHeader="scope">
<el-form :model="form" label-width="80px" :inline="true">
<el-form-item label="模糊搜索">
<el-input v-model="form.search" placeholder="请输入搜索内容" clearable></el-input>
<el-input v-model="form.search" placeholder="请输入搜索内容"></el-input>
</el-form-item>
<el-form-item label="检测状态">
<el-form-item label="检测状态" v-if="form.activeTabs != 3 && form.activeTabs != 5">
<el-select v-model="form.checkStatus" clearable>
<el-option
v-for="(item, index) in checkStatusList"
@@ -31,17 +31,6 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="报告状态">
<el-select v-model="form.checkReportStatus" clearable>
<el-option
v-for="(item, index) in checkReportStatusList"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="检测结果">
<el-select v-model="form.checkResult" clearable>
<el-option
@@ -53,10 +42,35 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="报告状态" v-if="form.activeTabs != 0 && form.activeTabs != 4">
<el-select v-model="form.checkReportStatus" clearable>
<el-option
v-for="(item, index) in checkReportStatusList"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:key="index"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="检测结果">
<el-select v-model="form.checkResult" clearable>
<el-option
v-for="(item, index) in checkResultList"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
:key="index"
></el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button type="primary" :icon="Search" @click="handleSearch"
>查询</el-button
>
<el-button :icon="Delete" @click="handleRefresh"
>重置</el-button
>
<el-button
type="primary"
:icon="Clock"
@@ -78,10 +92,13 @@
>全部复检</el-button
>
<el-button type="primary" :icon="Postcard" @click="handleTest('批量生成')" v-if="form.activeTabs === 3"
<el-button type="primary" :icon="Download" :disabled='!scope.isSelected' @click="handleTest('批量下载')" v-if="form.activeTabs === 3"
>批量下载</el-button
>
<el-button type="primary" :icon="Postcard" :disabled='!scope.isSelected' @click="handleTest('批量生成')" v-if="form.activeTabs === 3"
>批量生成</el-button
>
<el-button type="primary" :icon="Notebook" @click="handleTest('批量归档')" v-if="form.activeTabs === 4"
>批量归档</el-button
>
@@ -100,8 +117,8 @@
>
<div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0">
<el-dropdown trigger='click'>
<el-button link type='primary' :icon="View" class='table-operate'>
<div class='table-operate-text'>查看</div>
<el-button link type='primary' :icon="Download" class='table-operate'>
<div class='table-operate-text'>下载</div>
</el-button>
<template #dropdown>
<el-dropdown-menu>
@@ -134,7 +151,7 @@
link
:icon="Notebook"
@click="openDrawer('归档', scope.row)"
v-if="form.activeTabs === 4"
v-if="form.activeTabs === 0"
>归档</el-button
>
<el-button
@@ -201,7 +218,7 @@ import { ElMessage, ElMessageBox, ElLoading} from "element-plus";
import ProTable from "@/components/ProTable/index.vue";
import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
import {
Search,View,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart
Search,View,Delete,Download,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart
} from "@element-plus/icons-vue";
import { getPlanList } from "@/api/plan/planList";
import deviceDataList from '@/api/device/device/deviceData'
@@ -209,7 +226,7 @@ import testPopup from "./testPopup.vue";
import reportPopup from "./reportPopup.vue";
import dataCheckPopup from "./dataCheckPopup.vue";
import dataCheckChangeErrSysPopup from "./dataCheckChangeErrSysPopup.vue";
import { isVisible } from "element-plus/es/utils";
import { reactive, ref } from "vue";
const tableKey = ref(0);
@@ -234,9 +251,12 @@ const dialogForm = ref<any>({
});
//console.log(window.innerHeight, "+++++++++");
tableHeight.value = window.innerHeight - 600;
const deviceData = deviceDataList.plan_devicedata
//const deviceData = deviceDataList.plan_devicedata
const deviceData = ref([]);
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
const operationShow = ref(false);
const operationMinWidth = ref(200);
//下拉框数据
//检测状态数据
let checkStatusList = reactive([
@@ -263,31 +283,36 @@ let checkStatusList = reactive([
]);
//检测报告状态数据
let checkReportStatusList = reactive([
{
label: "未生成报告",
{
label: "未检测",
value: 0,
disabled: false,
},
{
label: "生成报告",
label: "生成",
value: 1,
disabled: false,
},
{
label: "已生成",
value: 2,
disabled: false,
},
]);
//检测结果数组
let checkResultList = reactive([
{
label: "未出结果",
label: "未检测",
value: 0,
disabled: false,
},
{
label: "不合格",
label: "不合格",
value: 1,
disabled: false,
},
{
label: "合格",
label: "全部合格",
value: 2,
disabled: false,
},
@@ -350,10 +375,11 @@ let checkResultList = reactive([
//查询条件
const form: any = ref({
activeTabs: 0, //功能选择
search: "",//搜索内容
activeChildTabs: 0,//子功能选择
checkStatus: 0, //检测状态
checkReportStatus: 0, //检测报告状态
checkResult: 0, //检测结果
checkStatus: null, //检测状态
checkResult: null, //检测结果
checkReportStatus: null, //检测报告状态
deviceBindStatus: 0, //绑定状态
deviceType: 0, //设备类型
manufacturer: 0, //制造厂商
@@ -416,8 +442,8 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
minWidth: 100,
},
{
prop: 'report_State',
label: '报告状态',
prop: 'check_State',
label: '检测状态',
minWidth: 100,
},
{
@@ -426,8 +452,8 @@ const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
minWidth: 100,
},
{
prop: 'check_State',
label: '检测状态',
prop: 'report_State',
label: '报告状态',
minWidth: 100,
},
{
@@ -599,17 +625,51 @@ const resetSearchForm = () => {
checkResult: 0,
};
};
let testType = "test";//检测还是复检
const handleSelectionChange = (selection: any[]) => {
const result = selection.filter((item) => item.check_Result != "有不合格项")
if(result.length > 0)
{
testType= "test";
}
else
{
testType= "reTest";
}
console.log(selection);
}
//查询
const handleSearch = () => {
matchDialogVisible.value = true;
if(form.value.activeTabs === 0 || form.value.activeTabs === 4)//设备检测、设备归档
{
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
}
else if(form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
{
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.check_State === "检测完成");
}
//matchDialogVisible.value = true;
//proTable.value?.getTableList();
};
//重置
const handleRefresh = () => {
proTable.value?.getTableList();
form.value.search = "";
form.value.checkStatus = null;
form.value.checkResult = null;
form.value.checkReportStatus = null;
if(form.value.activeTabs === 0 || form.value.activeTabs === 4)//设备检测、设备归档
{
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
}
else if(form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
{
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.check_State === "检测完成");
}
};
// 表格拖拽排序
const sortTable = ({
@@ -661,75 +721,77 @@ const changeStatus = async (row: User.ResUserList) => {
proTable.value?.getTableList();
};
//顶部功能切换时修改activeTabs
const changeActiveTabs = (val: number,val2: number) => {
const changeActiveTabs = (val: number,val2: number,tabledata:any[]) => {
form.value.activeTabs = val;
form.value.activeChildTabs= val2;
deviceData.value = tabledata;
tableHeaderInit(val)
console.log(form,val,val2,666)
};
//根据当前功能,初始化表头下拉框中的默认值和禁用值
function tableHeaderInit(val: number) {
refreshStatusList()
switch (val) {
case 0://自动检测
case 0://设备检测
case 1://手动检测
form.value.checkStatus = 0;//检测状态默认为未检
form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
form.value.checkResult = 0;//检测结果默认为未出结果
disableCheckStatus("检测中")
//disableCheckStatus("检测中")
disableCheckStatus("归档")
operationShow.value = false;
// operationShow.value = false;
columns[columns.length - 1].minWidth = 100;
tableKey.value ++;
operationShow.value = true;
break;
case 2://设备复检
form.value.checkStatus = 2;//检测状态默认为检测完成
form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
form.value.checkResult = 1;//检测结果默认为不合格
disableCheckStatus("未检测")
disableCheckStatus("检测中")
disableCheckStatus("归档")
disablecheckResultList("未出结果")
operationShow.value = false;
// form.value.checkStatus = 2;//检测状态默认为检测完成
// form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
// form.value.checkResult = 1;//检测结果默认为不合格
// disableCheckStatus("未检测")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
// disablecheckResultList("未出结果")
// operationShow.value = false;
break;
case 3://报告生成
form.value.checkStatus = 2;//检测状态默认为检测完成
form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
form.value.checkResult = 2;//检测结果默认为合格
disableCheckStatus("未检测")
disableCheckStatus("检测中")
disableCheckStatus("归档")
disablecheckResultList("未出结果")
// form.value.checkStatus = 2;//检测状态默认为检测完成
// form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
// form.value.checkResult = 2;//检测结果默认为合格
// disableCheckStatus("未检测")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
disablecheckResultList("未检测")
disableCheckReportStatus("未检测")
columns[columns.length - 1].minWidth = 150;
tableKey.value += 1;
operationShow.value = true;
break;
case 4://设备归档
form.value.checkStatus = 2;//检测状态默认为检测完成
form.value.checkReportStatus = 1;//检测报告状态默认为已生成报告
form.value.checkResult = 2;//检测结果默认为合格
disableCheckStatus("未检测")
disableCheckStatus("检测中")
disableCheckStatus("归档")
// form.value.checkStatus = 2;//检测状态默认为检测完成
// form.value.checkReportStatus = 1;//检测报告状态默认为已生成报告
// form.value.checkResult = 2;//检测结果默认为合格
// disableCheckStatus("未检测")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
disableCheckReportStatus("未生成报告")
disablecheckResultList("未出结果")
columns[columns.length - 1].minWidth = 100;
tableKey.value ++;
operationShow.value = true;
break;
case 5://数据查询
disablecheckResultList("未检测")
disableCheckReportStatus("未检测")
columns[columns.length - 1].minWidth = 250;
tableKey.value += 1;
operationShow.value = true;
break;
}
console.log("test",columns);
}
tableHeaderInit(0)
function refreshStatusList(){
checkStatusList.map((item: any, index: any) => {
if (item.disabled) {
@@ -746,6 +808,10 @@ function refreshStatusList(){
item.disabled = false;
}
});
form.value.checkStatus = null;//检测状态默认为未检
form.value.checkReportStatus = null;//检测报告状态默认为未生成报告
form.value.checkResult = null;//检测结果默认为未出结果
}
function disableCheckStatus(val: string){
@@ -775,9 +841,41 @@ const handleTest = (val:string) => {
if(val==='手动检测'||val==='自动检测'||val==='不合格项复检'||val==='全部复检' )
{
ElMessage.success(val);
if(testType === "reTest")
{
ElMessageBox.confirm(
'请选择复检检测方式',
'设备复检',
{
distinguishCancelAndClose: true,
confirmButtonText: '不合格项复检',
cancelButtonText: '全部复检',
type: 'warning',
},
)
.then(() => {
ElMessage.success(val);
dialogTitle.value = val;
dialogFormVisible.value = true; // 打开对话框
})
// .catch((action: Action) => {
// ElMessage({
// type: 'info',
// message:
// action === 'cancel'
// ? '以当前数据为主完成数据覆盖'
// : '取消本次导入操作',
// })
// })
}
else
{
ElMessage.success(val);
dialogTitle.value = val;
dialogFormVisible.value = true; // 打开对话框
}
}
if(val==='批量生成')

View File

@@ -227,7 +227,7 @@
</el-table>
</div>
<div >
<el-collapse model-value="1" accordion>
<el-collapse model-value="0" accordion>
<el-collapse-item title="检测日志:" name="1">
<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)'}">
@@ -451,22 +451,19 @@ function traverseTableData(data: any[],id: string): void {
}
const updateTableData = (id: string) => {
traverseTableData(tableData.value,id);
console.log(id)
};
const handleReCheck = () => {
console.log(tableData.value,operatorTableData.value)
activeIndex.value = 0;
percentage.value = 0;
tableData.value.length = 0;
testLogList.value.length = 0;
tableData.value = operatorTableData.value;
console.log(tableData.value,operatorTableData.value)
resumeTimer()
console.log(tableData.value,operatorTableData.value)
tableData.value = JSON.parse(JSON.stringify(operatorTableData.value));
resumeTimer()
};
let timer: any = ref("");
const handlePauseTest = () => {
@@ -1849,7 +1846,8 @@ const startTimer = () => {
} else {
percentage.value = 100;
clearInterval(timer.value)
timer.value = null;
ts.value = 'success'
ElMessageBox.alert('检测全部结束,你可以停留在此页面查看检测结果,或返回首页进行复检、报告生成和归档等操作', '检测完成', {
// if you want to disable its autofocus
@@ -1863,6 +1861,7 @@ const startTimer = () => {
else
{
clearInterval(timer.value)
timer.value = null;
ts.value = 'success'
}
@@ -1878,6 +1877,7 @@ const pauseTimer = () => {
const resumeTimer = () => {
if (timer.value === null) {
console.log('startTimer')
startTimer();
}
};

View File

@@ -1,5 +1,5 @@
<template>
<el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogBig" width="1200px" height="1200px">
<el-dialog :title="dialogTitle" :model-value="visible" :before-close="beforeClose" @close="handleCancel" width="1200px" height="1000px" draggable>
<div class="steps-container">
<!-- simple -->
@@ -193,26 +193,41 @@ const getIcon = (index: number) => {
TestStatus.value = "waiting"
nextStepText.value = "下一步"
}
const beforeClose = (done: () => void) => {
console.log(stepsActiveIndex.value,stepsTotalNum.value)
if(stepsActiveIndex.value < stepsTotalNum.value)
{
ElMessageBox.confirm(
'检测未完成,是否退出当前检测流程?',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
clearData()
emit('update:visible', false); // 关闭对话框
})
}
else
{
clearData()
emit('update:visible', false); // 关闭对话框
}
// ElMessageBox.confirm('Are you sure to close this dialog?')
// .then(() => {
// done()
// })
// .catch(() => {
// // catch error
// })
}
const handleCancel = () => {
// if(stepsActiveIndex.value < stepsTotalNum.value)
// {
// ElMessageBox.confirm(
// '是否退出当前检测流程?',
// '提示',
// {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning',
// }
// )
// .then(() => {
// // clearData()
// // emit('update:visible', false); // 关闭对话框
//
// })
// }
clearData()
emit('update:visible', false); // 关闭对话框
// clearData()
// emit('update:visible', false); // 关闭对话框
};
const handleSubmit = () => {