<template> <!-- 运维分析统计 --> <div class="operationAnaly"> <!-- 表格 --> <div class="tableBox animate__animated animate__zoomIn"> <el-table v-loading="tableLoading" :data="tableData"> <el-table-column label="序号" prop="xh" /> <el-table-column label="养护类型" prop="type" /> <el-table-column label="计划养护时间" prop="date1" /> <el-table-column label="实际养护时间" prop="date2" /> <el-table-column label="实施人" prop="user1" /> <el-table-column label="责任人" prop="user2" /> <el-table-column label="养护单位" prop="unit" /> <el-table-column label="行为分析" prop="xwfx"> <template #default="scope"> <span class="red">{{ scope.row.xwfx }}</span> </template> </el-table-column> <el-table-column label="评价" prop="pj" /> <el-table-column label="轨迹" prop="gj"> <template #default="scope"> <el-icon><LocationInformation /></el-icon> </template> </el-table-column> <el-table-column label="报告" prop="report"> <template #default="scope"> <el-icon><Files /></el-icon> </template> </el-table-column> </el-table> <Pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize" @pagination="getList" /> </div> </div> </template> <script setup> import {} from '@/api/dataAnalysis/syntherticData'; const props = defineProps({ searchDate: Array, stationCode: String, }); const { proxy } = getCurrentInstance(); const queryParams = reactive({ pageNo: 1, pageSize: 10, start: props.searchDate ? props.searchDate[0] : '', end: props.searchDate ? props.searchDate[1] : '', }); const total = ref(2); const tableData = ref([ { xh: '1', type: '设备巡查', date1: '2023年3月', date2: '2023年4月', user1: '何庆功', user2: '朱方仁', unit: '新烽光电', xwfx: '定位异常', pj: '4星', }, { xh: '2', type: '设备巡查', date1: '2023年5月', date2: '2023年6月', user1: '明亮', user2: '朱方仁', unit: '新烽光电', xwfx: '运维滞后', pj: '4星', }, ]); const tableLoading = ref(false); // 获取列表数据 function getList(code) { console.log('运维分析统计---', code); } // 初始化 onMounted(() => { getList(props.stationCode); }); defineExpose({ getList, }); onBeforeUnmount(() => {}); </script> <style lang="scss"> .operationAnaly { width: 100%; .el-pagination { right: 25%; } .red { color: #ee6666; } .tableBox { .el-icon { cursor: pointer; font-size: 25px; color: #73c0de; } } } </style>