Files
pqs-9100_client/frontend/src/views/home/components/table.vue
2025-01-06 09:21:24 +08:00

993 lines
28 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="table_info">
<!-- :request-api="getTableList" -->
<ProTable
ref="proTable"
:columns="columns"
@drag-sort="sortTable"
:default-sort="{ prop: 'check_State', order: 'ascending' }"
:stripe="true"
:pagination = "false"
:key="tableKey"
@selection-change='handleSelectionChange'
:request-api='getTableList'
:toolButton = 'false'
>
<!-- :height="tableHeight" -->
<!-- 表格 header 按钮 -->
<template #tableHeader="">
<el-form :model="form" :inline="true">
<el-form-item label="关键字">
<el-input v-model="form.search" placeholder="请输入设备名称" clearable></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 checkStatus"
:label="item.label"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></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 checkResult"
:label="item.label"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="报告状态" v-if="form.activeTabs != 0">
<el-select v-model="form.checkReportStatus" clearable>
<el-option
v-for="(item, index) in checkReportStatus"
:label="item.label"
:value="item.id"
:key="index"
v-show="shouldShowOption(item)"
></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
>
<!-- :disabled='!scope.isSelected' -->
<el-button
type="primary"
:icon="Clock"
@click="handleTest('手动检测')"
v-if="form.activeTabs === 0"
>手动检测</el-button
>
<!-- :disabled='!scope.isSelected' -->
<el-button
type="primary"
:icon="ChatLineRound"
@click="handleTest('自动检测')"
v-if="form.activeTabs === 0"
>自动检测</el-button
>
<el-button type="primary" :icon="ChatLineSquare" @click="handleTest('不合格项复检')" v-if="form.activeTabs === 2"
>不合格项复检</el-button
>
<el-button type="primary" :icon="ChatDotSquare" @click="handleTest('全部复检')" v-if="form.activeTabs === 2"
>全部复检</el-button
>
<!-- :disabled='!scope.isSelected' -->
<el-button type="primary" :icon="Download" @click="handleTest('批量下载')" v-if="form.activeTabs === 3"
>报告下载</el-button
>
<!-- :disabled='!scope.isSelected' -->
<el-button type="primary" :icon="Postcard" @click="handleTest('批量生成')" v-if="form.activeTabs === 3"
>报告生成</el-button
>
<!-- :disabled="!scope.isSelected || scope.selectedList.filter((item) => item.check_State === '检测完成').length === 0" -->
<el-button type="primary" :icon="Notebook" @click="handleTest('批量归档')" v-if="form.activeTabs === 4"
>归档</el-button>
<!-- <el-button type="primary" :icon="CirclePlus" @click="addDevice('设备新增')" v-if="form.activeTabs === 0"
>设备新增</el-button> -->
<el-button type="primary" :icon="Odometer" @click="handleTest('系数校准')" v-if="form.activeTabs === 0"
>系数校准</el-button>
</el-form-item>
</el-form>
</template>
<!-- 表格操作 -->
<template #operation="scope">
<el-button
type="primary"
link
:icon="View"
@click="openDrawer('查看', scope.row)"
v-if="form.activeTabs === 3 && form.activeChildTabs === 1"
>查看</el-button>
<el-button
type="primary"
link
:icon="Download"
@click="openDrawer('报告下载', scope.row)"
v-if="form.activeTabs === 3 && form.activeChildTabs === 0 && scope.row.reportState === 1"
>报告下载</el-button>
<!-- <div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0">
<el-dropdown trigger='click'>
<el-button link type='primary' :icon="Download" class='table-operate'>
<div class='table-operate-text'>报告下载</div>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>Q/GDW 10650.2-2021 报告</el-dropdown-item>
<el-dropdown-item>Q/GDW 1650.2-2016 报告</el-dropdown-item>
<el-dropdown-item>GBT 19862-2016 报告</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div> -->
<el-button
type="primary"
link
:icon="Postcard"
@click="openDrawer('生成', scope.row)"
v-if="form.activeTabs === 3"
>报告生成</el-button>
<!-- <el-button
type="primary"
link
:icon="View"
@click="openDrawer('数据查看', scope.row)"
v-if="form.activeTabs === 4"
>数据查看</el-button
> -->
<el-button
:type="scope.row.check_State === '检测完成' ? 'primary' : 'info'"
link
:icon="Notebook"
@click="openDrawer('归档', scope.row)"
v-if="form.activeTabs === 4"
:disabled = "scope.row.checkState != 2"
>归档</el-button>
<el-button
type="primary"
link
:icon="PieChart"
@click="openDrawer('检测数据查询', scope.row)"
v-if="form.activeTabs === 5"
>检测数据查询</el-button>
<el-button
type="primary"
link
:icon="Switch"
@click="openDrawer('误差体系更换', scope.row)"
v-if="form.activeTabs === 5"
>误差体系更换</el-button>
<div class='cn-render-buttons' v-if="form.activeTabs === 5 ">
<el-dropdown trigger='click'>
<el-button link type='primary' :icon="Download" class='table-operate'>
<div class='table-operate-text'>报告下载</div>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<!-- <el-dropdown-item>Q/GDW 10650.2-2021 报告</el-dropdown-item> -->
<el-dropdown-item>Q/GDW 1650.2-2016 报告</el-dropdown-item>
<el-dropdown-item>GBT 19862-2016 报告</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
<!-- <el-button
dictType="primary"
link
:icon="Delete"
@click="deleteAccount(scope.row)"
>删除</el-button
> -->
</template>
</ProTable>
<!-- 检测过程对话框 -->
<!-- <testPopup
:visible="dialogFormVisible"
:formData="dialogForm"
:dialogTitle="dialogTitle"
@update:visible="dialogFormVisible = $event"
/> -->
<TestPopup ref="testPopup"></TestPopup>
<reportPopup
:visible="reportDialogVisible"
@update:visible="reportDialogVisible = $event"
></reportPopup>
<dataCheckPopup ref="dataCheckPopupRef"/>
<dataCheckChangeErrSysPopup
:visible="dataCheckChangeErrSysDialogVisible"
@update:visible="dataCheckChangeErrSysDialogVisible = $event"
></dataCheckChangeErrSysPopup>
<matchPopup
:visible="matchDialogVisible"
@update:visible="matchDialogVisible = $event"
></matchPopup>
<!--系数校准-->
<ChannelsTest ref="channelsTest" :webMsgSend="webMsgSend"></ChannelsTest>
</div>
</template>
<script setup lang="tsx" name="useProTable">
import { useRouter } from "vue-router";
import type { Device } from '@/api/device/interface/device'
import { useHandleData } from "@/hooks/useHandleData";
import { ElMessage, ElMessageBox, ElLoading, Action} from "element-plus";
import ProTable from "@/components/ProTable/index.vue";
import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
import {
Search,View,Delete,Download,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart,CirclePlus,Odometer
} from "@element-plus/icons-vue";
import { getPlanList } from "@/api/plan/planList";
import deviceDataList from '@/api/device/device/deviceData'
import TestPopup from "./testPopup.vue";
import reportPopup from "./reportPopup.vue";
import dataCheckPopup from "./dataCheckSingleChannelSingleTestPopup.vue";
import dataCheckChangeErrSysPopup from "./dataCheckChangeErrSysPopup.vue";
import { getBoundPqDevList } from '@/api/plan/plan.ts'
import { onMounted, reactive, ref, watch } from "vue";
import { useDictStore } from '@/stores/modules/dict'
import ChannelsTest from './channelsTest.vue'
import { useModeStore } from '@/stores/modules/mode'; // 引入模式 store
import {useCheckStore} from '@/stores/modules/check'
import {CheckData} from '@/api/check/interface'
import socketClient from '@/utils/webSocketClient';
const dictStore = useDictStore()
const checkStore = useCheckStore()
const webMsgSend = ref();//webSocket推送的数据
let devNum = 0;//当前选取的被检设备数量
let devChannelsNum = 0;//当前选择的被检设备通道总数
let devTestedNum = 0;//当前选择的已完成检测的被检设备数量
const tableKey = ref(0);
const router = useRouter();
const value1 = ref("");
const value2 = ref("");
const tableHeight = ref(0);
const reportDialogVisible = ref(false)
const dataCheckPopupRef=ref<InstanceType<typeof dataCheckPopup>>()
const dataCheckChangeErrSysDialogVisible = ref(false)
const matchDialogVisible = ref(false)
const dialogTitle = ref('手动检测')
const checkStateTable = ref<number[]>([0,1,2])
const dialogForm = ref<any>({
id: '',
name: '',
standard_Name:'',
standard_Time:'',
dev_Level:'',
enable:1,
state:1,
});
const modeStore = useModeStore();
const shouldShowOption = (item) => {
// 检查 weiJianTab 是否不等于 0
if (weiJianTab.value !== 0) {
// 排除 label 为“归档”和“未检”的项
return item.label !== '归档' && item.label !== '未检';
} else {
// 只排除 label 为“归档”的项
return item.label !== '归档';
}
};
tableHeight.value = window.innerHeight - 600;
const deviceData = ref<Device.ResPqDev[]>([]);
const operationShow = ref(false);
const documentStateShow = ref(false);
const checkStateShow = ref(true);
const operationMinWidth = ref(200);
const selectionShow = ref(true);
const channelsTest = ref()
const testPopup = ref()
const weiJianTab = ref(0)//除设备检测外,检测结果不显示'未检'
const channelsSelection = ref<Device.ResPqDev[]>([])
const props = defineProps({
id: {
type: String,
required: true,
},
isTimeCheck: {
type: Boolean,
required: true,
},
})
//下拉框数据
interface Dict {
id: string;
label: string;
}
//检测状态数据
const checkStatus: Dict[] = [
{
id: "0",
label: '未检',
},
{
id: "1",
label: '检测中',
},
{
id: "2",
label: '检测完成',
},
{
id: "3",
label: '归档',
},
]
//检测报告状态数据
const checkReportStatus: Dict[] = [
{
id: "0",
label: '未生成',
},
{
id: "1",
label: '已生成',
},
{
id: "2",
label: '未检',
},
]
//检测结果数组
const checkResult: Dict[] = [
{
id: "0",
label: '不符合',
},
{
id: "1",
label: '符合',
},
{
id: "2",
label: '未检',
},
]
//查询条件
const form: any = ref({
activeTabs: 0, //功能选择
search: null,//搜索内容
activeChildTabs: 0,//子功能选择
checkStatus: null, //检测状态
checkResult: null, //检测结果
checkReportStatus: null, //检测报告状态
deviceBindStatus: 0, //绑定状态
deviceType: 0, //设备类型
manufacturer: 0, //制造厂商
});
const searchForm = ref({
intervalType: 0,
time: ["2024-08-20", "2024-08-27"],
searchBeginTime: "",
searchEndTime: "",
checkStatus: 0,
checkReportStatus: 0,
checkResult: 0,
});
// ProTable 实例
const proTable = ref<ProTableInstance>();
const getTableList = async (params: any) => {
// 调用 ProTable 的 clearSelection 方法清空选择
if (proTable.value) {
proTable.value.clearSelection();
}
if(props.id){
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
});
}
};
// 表格配置项
const columns = reactive<ColumnProps<Device.ResPqDev>[]>([
{ type: 'selection', fixed: 'left', width: 70, isShow:selectionShow },
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
{
prop: 'name',
label: '设备名称',
minWidth: 220,
//search: { el: 'input' },
},
{
prop: 'devType',
label: '设备类型',
minWidth: 100,
enum: dictStore.getDictData('Dev_Type'),
fieldNames: { label: 'name', value: 'id' },
},
{
prop: 'devChns',
label: '通道数',
minWidth: 100,
sortable:true,
},
{
prop: 'reCheckNum',
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: 'checkState',
label: '检测状态',
minWidth: 100,
sortable:true,
isShow:checkStateShow,
render: scope => {
return (
scope.row.checkState === 0 ? '未检' : scope.row.checkState === 1 ? '检测中' : '检测完成'
)
},
},
{
prop: 'checkResult',
label: '检测结果',
minWidth: 100,
sortable:true,
render: (scope) => {
if (scope.row.checkResult === 0)
{
return <el-tag type='danger'>不符合</el-tag>
}
else if (scope.row.checkResult === 1)
{
return '符合';
}
else if (scope.row.checkResult === 2)
{
return '未检';
}
return '';
},
},
{
prop: 'reportState',
label: '报告状态',
minWidth: 100,
sortable:true,
render: scope => {
if (scope.row.reportState === 0)
{
return '未生成';
}
else if (scope.row.reportState === 1)
{
return '已生成';
}
else if (scope.row.reportState === 2)
{
return '未检';
}
return '';
}
},
{ prop: 'operation', label: '操作', fixed: 'right', minWidth: 200 ,isShow: operationShow},
])
// 跳转详情页
const toDetail = () => {
router.push(
`/proTable/useProTable/detail/${Math.random().toFixed(3)}?params=detail-page`
);
};
//重置查询条件
const resetSearchForm = () => {
searchForm.value = {
intervalType: 0,
time: ["2024-08-20", "2024-08-27"],
searchBeginTime: "",
searchEndTime: "",
checkStatus: 0,
checkReportStatus: 0,
checkResult: 0,
};
};
let testType = "test";//检测还是复检
const handleSelectionChange = (selection: any[]) => {
channelsSelection.value = selection
devNum = selection.length;
devChannelsNum = 0;
for (let i = 0; i < selection.length; i++) {
devChannelsNum += selection[i].dev_Chns;
}
devTestedNum = selection.filter((item) => item.checkState === 2).length;
const result = selection.filter((item) => item.checkResult != 0)
if(result.length > 0)
{
testType= "test";
}
else
{
testType= "reTest";
}
let devices: CheckData.Device[] = selection.map((item: any) => {
return {
deviceId: item.id,
deviceName: item.name,
deviceType: item.devType,
chnNum: item.devChns,
}
});
if(selection.length > 0){
checkStore.clearDevices()
checkStore.addDevices(devices)
}else{
checkStore.clearDevices()
}
}
//查询
const handleSearch = () => {
proTable.value?.getTableList();
};
//重置
const handleRefresh = () => {
form.value.search = null;
form.value.checkStatus = null;
form.value.checkResult = null;
form.value.checkReportStatus = null;
proTable.value?.getTableList();
};
// 表格拖拽排序
const sortTable = ({
newIndex,
oldIndex,
}: {
newIndex?: number;
oldIndex?: number;
}) => {
//console.log(newIndex, oldIndex);
//console.log(proTable.value?.tableData);
ElMessage.success("修改列表排序成功");
};
//顶部功能切换时修改activeTabs
const changeActiveTabs = (val: number,val2: number,tabledata:any[]) => {
form.value.activeTabs = val;
form.value.activeChildTabs= val2;
deviceData.value = tabledata;
tableHeaderInit(val)
};
//根据当前功能,初始化表头下拉框中的默认值和禁用值
function tableHeaderInit(val: number) {
refreshStatusList()
weiJianTab.value = val;
switch (val) {
case 0://设备检测
case 1://手动检测
//disableCheckStatus("检测中")
disableCheckStatus("归档")
// operationShow.value = false;
// columns[columns.length - 1].minWidth = 100;
checkStateTable.value = [0,1,2]
tableKey.value ++;
operationShow.value = false;
documentStateShow.value = false;
checkStateShow.value = true;
selectionShow.value = true;
break;
case 2://设备复检
// 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("归档")
checkStateTable.value = [2,3]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 180;
tableKey.value += 1;
operationShow.value = true;
documentStateShow.value = true;
checkStateShow.value = false;
selectionShow.value = true;
break;
case 4://设备归档
// form.value.checkStatus = 2;//检测状态默认为检测完成
// form.value.checkReportStatus = 1;//检测报告状态默认为已生成报告
// form.value.checkResult = 2;//检测结果默认为合格
// disableCheckStatus("未检")
// disableCheckStatus("检测中")
// disableCheckStatus("归档")
checkStateTable.value = [2]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 100;
tableKey.value += 1;
operationShow.value = true;
documentStateShow.value = false;
checkStateShow.value = false;
selectionShow.value = true;
break;
case 5://数据查询
checkStateTable.value = [2,3]
disablecheckResultList("未检")
disableCheckReportStatus("未检")
columns[columns.length - 1].minWidth = 290;
operationShow.value = true;
documentStateShow.value = true;
checkStateShow.value = false;
selectionShow.value = false;
columns[0].isShow = false;
tableKey.value += 1;
break;
}
//console.log("test",columns);
}
function refreshStatusList(){
// devNum = 0;
// devChannelsNum = 0;
// devTestedNum = 0;
devNum = 0;
devChannelsNum = 0;
devTestedNum = 0;
checkStatus.map((item: any, index: any) => {
if (item.disabled) {
item.disabled = false;
}
});
checkReportStatus.map((item: any, index: any) => {
if (item.disabled) {
item.disabled = false;
}
});
checkResult.map((item: any, index: any) => {
if (item.disabled) {
item.disabled = false;
}
});
form.value.checkStatus = null;//检测状态默认为未检
form.value.checkReportStatus = null;//检测报告状态默认为未生成报告
form.value.checkResult = null;//检测结果默认为未出结果
}
function disableCheckStatus(val: string){
checkStatus.map((item: any, index: any) => {
if (val == item.label) {
item.disabled = true;
}
});
}
function disableCheckReportStatus(val: string){
checkReportStatus.map((item: any, index: any) => {
if (val == item.label) {
item.disabled = true;
}
});
}
function disablecheckResultList(val: string){
checkResult.map((item: any, index: any) => {
if (val == item.label) {
item.disabled = true;
}
});
}
const addDevice = (val:string) => {
router.push({
path: "/machine/device",
});
};
const handleTest = async (val:string) => {
if(devNum == 0)
{
ElMessageBox.confirm(
'请先选择被检设备',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
const checkDevVolt = channelsSelection.value.map(item => item.devVolt);
const isDevVoltConsistent = new Set(checkDevVolt).size === 1;
if (!isDevVoltConsistent) {
ElMessageBox.confirm(
'所勾选设备额定电压不一致,请重新选择',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
const checkDevCurr = channelsSelection.value.map(item => item.devCurr);
const isDevCurrConsistent = new Set(checkDevCurr).size === 1;
if (!isDevCurrConsistent) {
ElMessageBox.confirm(
'所勾选设备额定电流不一致,请重新选择',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
if(val==='手动检测'||val==='自动检测'||val==='不合格项复检'||val==='全部复检' )
{
if(devNum > 6)
{
ElMessageBox.confirm(
'每次检测最多只能选择6台设备请重新选择',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
if(devChannelsNum > 20)
{
ElMessageBox.confirm(
'每次检测最多只能检测20个设备通道请重新选择',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
if(testType === "reTest")
{
ElMessageBox.confirm(
'请选择复检检测方式',
'设备复检',
{
distinguishCancelAndClose: true,
confirmButtonText: '不合格项复检',
cancelButtonText: '全部复检',
type: 'warning',
},
)
.then(() => {
ElMessage.success('不合格项复检');
dialogTitle.value = val;
testPopup.value?.open(channelsSelection.value,dialogTitle.value,props.isTimeCheck)// 打开对话框
})
.catch((action: Action) => {
ElMessage.success('全部复检');
dialogTitle.value = val;
testPopup.value?.open(channelsSelection.value,dialogTitle.value,props.isTimeCheck) // 打开对话框
})
}
else
{
dialogTitle.value = val;
testPopup.value?.open(channelsSelection.value,dialogTitle.value,props.isTimeCheck)
}
return
}
if(val === '系数校准') {
// //开始创建webSocket客户端
// const data = reactive({
// socketServe: socketClient.Instance,
// });
// const url = 'ws://localhost:7777/hello?name=cdf';
// socketClient.Instance.connect(url);
// data.socketServe = socketClient.Instance;
// data.socketServe.registerCallBack('aaa', (res: { code: number; }) => {
// // 处理来自服务器的消息
// console.log('Received message:', res);
// // 根据需要在这里添加更多的处理逻辑
// if(res.code === 20000){
// ElMessage.error(message.message)
// loading.close()
// }else {
// webMsgSend.value = res
// }
// });
channelsTest.value?.open(channelsSelection.value);
return;
}
if(devTestedNum == 0)
{
ElMessageBox.confirm(
'请先选择检测完成状态的被检设备',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
return
}
if(val==='批量生成')
{
reportDialogVisible.value = true;
return
}
if(val==='批量归档')
{
const loading = ElLoading.service({
lock: true,
text: '归档中...',
background: 'rgba(0, 0, 0, 0.7)',
})
setTimeout(() => {
loading.close()
ElMessage.success("归档成功");
}, 2000)
}
};
// 打开 drawer(新增、查看、编辑)
const openDrawer = (title: string, row: any) => {
if (title === '查看')
{
const link = document.createElement('a');
const fileUrl = 'G:/南网数研院非结构化数据生成程序MMS_JSON修改记录.docx'; // 文件路径
link.href = fileUrl;
link.target = '_blank'; // 在新标签页中打开
link.download = 'file.docx'; // 设置下载文件的名称
link.click();
}
if(title === '生成')
{
reportDialogVisible.value = true;
}
if(title === '检测数据查询')
{
dataCheckPopupRef.value?.open(row.id,'-1',null)
}
if (title === '误差体系更换')
{
dataCheckChangeErrSysDialogVisible.value = true;
}
if (title === '归档')
{
const loading = ElLoading.service({
lock: true,
text: '归档中...',
background: 'rgba(0, 0, 0, 0.7)',
})
setTimeout(() => {
loading.close()
ElMessage.success("归档成功");
}, 2000)
}
}
// 监听 props.id 的变化
watch(
() => props.id,
(newId) => {
// 调用获取数据的方法
handleSearch();
},
{ immediate: true } // 立即执行一次
);
defineExpose({ changeActiveTabs });
</script>
<style lang="scss" scoped>
/* 当屏幕宽度小于或等于1300像素时 */
@media screen and (max-width: 1300px) {
.el-select {
width: 130px !important;
}
}
@media screen and (min-width: 1300px) {
.el-select {
width: 150px !important;
}
}
.el-form {
width: 100%;
display: flex;
flex-wrap: wrap;
.el-form-item {
display: flex;
align-items: center;
justify-content: space-between;
.el-button {
margin: 0 !important;
margin-right: 10px !important;
}
}
}
</style>