| | |
| | | import request from "@/utils/request"; |
| | | |
| | | // 查询储气罐预警列表 |
| | | export const getStockWarningPage = (params) => { |
| | | export const getStockWarningPage = (page, params) => { |
| | | return request({ |
| | | url: "/gasTankWarning/listPage", |
| | | method: "get", |
| | | params, |
| | | params: { |
| | | ...page, |
| | | ...params |
| | | }, |
| | | }); |
| | | }; |
| | | |
| | |
| | | return request({ |
| | | url: "/gasTankWarning/add", |
| | | method: "post", |
| | | data, |
| | | data: data, |
| | | }); |
| | | }; |
| | | |
| | |
| | | export const updateStockWarning = (data) => { |
| | | return request({ |
| | | url: "/gasTankWarning/update", |
| | | method: "put", |
| | | data, |
| | | method: "post", |
| | | data: data, |
| | | }); |
| | | }; |
| | | |
| | |
| | | return request({ |
| | | url: "/gasTankWarning/delete", |
| | | method: "delete", |
| | | data: { ids }, |
| | | data: ids, |
| | | }); |
| | | }; |
| | | |
| | |
| | | <!-- 操作按钮 --> |
| | | <div class="table-operations"> |
| | | <el-button type="primary" @click="handleAdd">新增预警规则</el-button> |
| | | <el-button type="success" @click="handleBatchProcess">批量处理</el-button> |
| | | <!-- <el-button type="success" @click="handleBatchProcess">批量处理</el-button> --> |
| | | <el-button @click="handleExport">导出</el-button> |
| | | </div> |
| | | <el-table |
| | |
| | | import { WarningFilled } from '@element-plus/icons-vue' |
| | | import pagination from '@/components/PIMTable/Pagination.vue' |
| | | // 注释掉API导入,使用假数据 |
| | | // import { |
| | | // getStockWarningPage, |
| | | // addStockWarning, |
| | | // updateStockWarning, |
| | | // deleteStockWarning, |
| | | // batchProcessStockWarning, |
| | | // exportStockWarning, |
| | | // toggleStockWarningStatus |
| | | // } from '@/api/inventoryManagement/stockWarning.js' |
| | | import { |
| | | getStockWarningPage, |
| | | addStockWarning, |
| | | updateStockWarning, |
| | | deleteStockWarning, |
| | | batchProcessStockWarning, |
| | | exportStockWarning, |
| | | toggleStockWarningStatus |
| | | } from '@/api/inventoryManagement/stockWarning.js' |
| | | |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | |
| | | // 分页参数 |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 10 |
| | | size: 10, |
| | | total: 0 |
| | | }) |
| | | |
| | | // 搜索表单 |
| | |
| | | // 这里可以调用处理API |
| | | } |
| | | |
| | | |
| | | |
| | | // 生成假数据 |
| | | const generateMockData = () => { |
| | | const mockData = [ |
| | | { |
| | | id: 1, |
| | | tankCode: 'TANK001', |
| | | tankName: '液化气储罐A', |
| | | tankType: '液化气储罐', |
| | | specificationModel: 'LPG-5000L', |
| | | volume: 5000, |
| | | currentGasLevel: 15, |
| | | safetyGasLevel: 30, |
| | | minGasLevel: 10, |
| | | maxGasLevel: 95, |
| | | currentPressure: 2.5, |
| | | warningType: '气体不足', |
| | | warningLevel: '紧急', |
| | | warningThreshold: 20, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-15 08:30:00', |
| | | warningDuration: 3, |
| | | lastUpdateTime: '2024-01-15 10:00:00', |
| | | expectedRefillTime: '2024-01-16 14:00:00', |
| | | expectedShortageTime: '2024-01-15 18:30:00', // 今天下午6:30缺气 |
| | | warningRule: '当气体量低于20%时触发预警' |
| | | }, |
| | | { |
| | | id: 2, |
| | | tankCode: 'TANK002', |
| | | tankName: '压缩气储罐B', |
| | | tankType: '压缩气储罐', |
| | | specificationModel: 'COMP-3000L', |
| | | volume: 3000, |
| | | currentGasLevel: 45, |
| | | safetyGasLevel: 25, |
| | | minGasLevel: 15, |
| | | maxGasLevel: 90, |
| | | currentPressure: 8.2, |
| | | warningType: '压力异常', |
| | | warningLevel: '重要', |
| | | warningThreshold: 10, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-14 16:20:00', |
| | | warningDuration: 2, |
| | | lastUpdateTime: '2024-01-15 09:15:00', |
| | | expectedRefillTime: '2024-01-17 09:00:00', |
| | | expectedShortageTime: '2024-01-18 12:00:00', // 3天后缺气 |
| | | warningRule: '当压力超过8MPa时触发预警' |
| | | }, |
| | | { |
| | | id: 3, |
| | | tankCode: 'TANK003', |
| | | tankName: '天然气储罐C', |
| | | tankType: '天然气储罐', |
| | | specificationModel: 'NG-8000L', |
| | | volume: 8000, |
| | | currentGasLevel: 75, |
| | | safetyGasLevel: 20, |
| | | minGasLevel: 10, |
| | | maxGasLevel: 95, |
| | | currentPressure: 4.8, |
| | | warningType: '温度异常', |
| | | warningLevel: '一般', |
| | | warningThreshold: 5, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-13 11:45:00', |
| | | warningDuration: 1, |
| | | lastUpdateTime: '2024-01-15 08:45:00', |
| | | expectedRefillTime: '2024-01-20 10:00:00', |
| | | expectedShortageTime: '2024-01-22 15:30:00', // 7天后缺气 |
| | | warningRule: '当温度超过60°C时触发预警' |
| | | }, |
| | | { |
| | | id: 4, |
| | | tankCode: 'TANK004', |
| | | tankName: '氧气储罐D', |
| | | tankType: '氧气储罐', |
| | | specificationModel: 'O2-2000L', |
| | | volume: 2000, |
| | | currentGasLevel: 8, |
| | | safetyGasLevel: 25, |
| | | minGasLevel: 5, |
| | | maxGasLevel: 90, |
| | | currentPressure: 6.5, |
| | | warningType: '泄漏预警', |
| | | warningLevel: '紧急', |
| | | warningThreshold: 15, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-15 07:15:00', |
| | | warningDuration: 4, |
| | | lastUpdateTime: '2024-01-15 11:30:00', |
| | | expectedRefillTime: '2024-01-15 16:00:00', |
| | | expectedShortageTime: '2024-01-15 14:00:00', // 今天下午2点缺气 |
| | | warningRule: '当检测到气体泄漏时触发预警' |
| | | }, |
| | | { |
| | | id: 5, |
| | | tankCode: 'TANK005', |
| | | tankName: '液化气储罐E', |
| | | tankType: '液化气储罐', |
| | | specificationModel: 'LPG-6000L', |
| | | volume: 6000, |
| | | currentGasLevel: 35, |
| | | safetyGasLevel: 30, |
| | | minGasLevel: 15, |
| | | maxGasLevel: 95, |
| | | currentPressure: 3.2, |
| | | warningType: '气体不足', |
| | | warningLevel: '重要', |
| | | warningThreshold: 20, |
| | | isEnabled: false, |
| | | warningTime: '2024-01-14 14:30:00', |
| | | warningDuration: 2, |
| | | lastUpdateTime: '2024-01-15 09:00:00', |
| | | expectedRefillTime: '2024-01-19 08:00:00', |
| | | expectedShortageTime: '2024-01-21 10:00:00', // 6天后缺气 |
| | | warningRule: '当气体量低于20%时触发预警' |
| | | }, |
| | | { |
| | | id: 6, |
| | | tankCode: 'TANK006', |
| | | tankName: '压缩气储罐F', |
| | | tankType: '压缩气储罐', |
| | | specificationModel: 'COMP-4000L', |
| | | volume: 4000, |
| | | currentGasLevel: 85, |
| | | safetyGasLevel: 20, |
| | | minGasLevel: 10, |
| | | maxGasLevel: 90, |
| | | currentPressure: 7.8, |
| | | warningType: '压力异常', |
| | | warningLevel: '一般', |
| | | warningThreshold: 8, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-12 09:20:00', |
| | | warningDuration: 1, |
| | | lastUpdateTime: '2024-01-15 08:30:00', |
| | | expectedRefillTime: '2024-01-25 14:00:00', |
| | | expectedShortageTime: '2024-01-28 16:00:00', // 13天后缺气 |
| | | warningRule: '当压力超过8MPa时触发预警' |
| | | }, |
| | | { |
| | | id: 7, |
| | | tankCode: 'TANK007', |
| | | tankName: '天然气储罐G', |
| | | tankType: '天然气储罐', |
| | | specificationModel: 'NG-10000L', |
| | | volume: 10000, |
| | | currentGasLevel: 92, |
| | | safetyGasLevel: 15, |
| | | minGasLevel: 8, |
| | | maxGasLevel: 95, |
| | | currentPressure: 5.2, |
| | | warningType: '温度异常', |
| | | warningLevel: '重要', |
| | | warningThreshold: 6, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-11 16:45:00', |
| | | warningDuration: 1, |
| | | lastUpdateTime: '2024-01-15 07:45:00', |
| | | expectedRefillTime: '2024-01-30 09:00:00', |
| | | expectedShortageTime: '2024-02-05 12:00:00', // 21天后缺气 |
| | | warningRule: '当温度超过60°C时触发预警' |
| | | }, |
| | | { |
| | | id: 8, |
| | | tankCode: 'TANK008', |
| | | tankName: '氧气储罐H', |
| | | tankType: '氧气储罐', |
| | | specificationModel: 'O2-1500L', |
| | | volume: 1500, |
| | | currentGasLevel: 12, |
| | | safetyGasLevel: 30, |
| | | minGasLevel: 8, |
| | | maxGasLevel: 90, |
| | | currentPressure: 4.5, |
| | | warningType: '泄漏预警', |
| | | warningLevel: '紧急', |
| | | warningThreshold: 12, |
| | | isEnabled: true, |
| | | warningTime: '2024-01-15 06:30:00', |
| | | warningDuration: 5, |
| | | lastUpdateTime: '2024-01-15 12:15:00', |
| | | expectedRefillTime: '2024-01-15 20:00:00', |
| | | expectedShortageTime: '2024-01-15 17:30:00', // 今天下午5:30缺气 |
| | | warningRule: '当检测到气体泄漏时触发预警' |
| | | } |
| | | ] |
| | | |
| | | // 根据搜索条件过滤数据 |
| | | let filteredData = mockData.filter(item => { |
| | | if (searchForm.tankName && !item.tankName.includes(searchForm.tankName)) return false |
| | | if (searchForm.tankType && item.tankType !== searchForm.tankType) return false |
| | | if (searchForm.warningType && item.warningType !== searchForm.warningType) return false |
| | | if (searchForm.warningLevel && item.warningLevel !== searchForm.warningLevel) return false |
| | | return true |
| | | }) |
| | | |
| | | // 分页处理 |
| | | const start = (page.current - 1) * page.size |
| | | const end = start + page.size |
| | | const paginatedData = filteredData.slice(start, end) |
| | | |
| | | return { |
| | | records: paginatedData, |
| | | total: filteredData.length |
| | | } |
| | | } |
| | | |
| | | // 获取列表数据 |
| | | const getList = async () => { |
| | | tableLoading.value = true |
| | | try { |
| | | // 模拟网络延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 500)) |
| | | |
| | | const result = generateMockData() |
| | | tableData.value = result.records |
| | | total.value = result.total |
| | | |
| | | // 检查缺气预警 |
| | | getStockWarningPage(page, searchForm) |
| | | .then(res => { |
| | | |
| | | tableData.value = res.data.records |
| | | page.value.total = res.data.total; |
| | | tableLoading.value = false; |
| | | // 检查缺气预警 |
| | | checkShortageWarnings() |
| | | } catch (error) { |
| | | console.error('获取列表失败:', error) |
| | | ElMessage.error('获取列表失败') |
| | | } finally { |
| | | tableLoading.value = false |
| | | } |
| | | }).catch(err => { |
| | | tableLoading.value = false; |
| | | }) |
| | | } |
| | | |
| | | // 搜索 |
| | |
| | | // 新增 |
| | | const handleAdd = () => { |
| | | operationType.value = 'add' |
| | | resetForm() |
| | | // resetForm() |
| | | dialogFormVisible.value = true |
| | | } |
| | | |
| | |
| | | // 模拟API调用延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 300)) |
| | | ElMessage.success(`正在处理预警:${row.tankName}`) |
| | | getList() |
| | | // getList() |
| | | } catch (error) { |
| | | ElMessage.error('处理预警失败') |
| | | } |
| | |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | |
| | | // 模拟API调用延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 300)) |
| | | ElMessage.success('删除成功') |
| | | getList() |
| | | let ids = []; |
| | | ids.push(row.id); |
| | | deleteStockWarning(ids).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success("删除成功"); |
| | | ids.value = []; |
| | | getList(); |
| | | } |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg); |
| | | }) |
| | | // // 模拟API调用延迟 |
| | | // await new Promise(resolve => setTimeout(resolve, 300)) |
| | | // ElMessage.success('删除成功') |
| | | // getList() |
| | | } catch (error) { |
| | | if (error !== 'cancel') { |
| | | ElMessage.error('删除失败') |
| | |
| | | |
| | | // 导出 |
| | | const handleExport = async () => { |
| | | try { |
| | | // 模拟API调用延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 800)) |
| | | |
| | | // 生成导出数据 |
| | | const exportData = generateMockData().records |
| | | const csvContent = generateCSV(exportData) |
| | | |
| | | // 创建下载链接 |
| | | const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' }) |
| | | const url = window.URL.createObjectURL(blob) |
| | | const link = document.createElement('a') |
| | | link.href = url |
| | | link.download = `储气罐预警数据_${new Date().getTime()}.csv` |
| | | link.click() |
| | | window.URL.revokeObjectURL(url) |
| | | |
| | | ElMessage.success('导出成功') |
| | | } catch (error) { |
| | | ElMessage.error('导出失败') |
| | | } |
| | | // if (selectedRows.value.length === 0) { |
| | | // exportStockWarning().then(res => { |
| | | // // // 创建下载链接 |
| | | // // const blob = new Blob([res.data], { type: 'text/csv;charset=utf-8;' }) |
| | | // // const url = window.URL.createObjectURL(blob) |
| | | // // const link = document.createElement('a') |
| | | // // link.href = url |
| | | // // link.download = `储气罐预警数据_${new Date().getTime()}.csv` |
| | | // // link.click() |
| | | // // window.URL.revokeObjectURL(url) |
| | | // }).catch(err => { |
| | | // ElMessage.error(err.msg); |
| | | // }) |
| | | // }else{ |
| | | // let ids = []; |
| | | // selectedRows.value.forEach(item => { |
| | | // ids.push(item.id); |
| | | // }) |
| | | // exportStockWarning(ids).then(res => { |
| | | // // // 创建下载链接 |
| | | // // const blob = new Blob([res.data], { type: 'text/csv;charset=utf-8;' }) |
| | | // // const url = window.URL.createObjectURL(blob) |
| | | // // const link = document.createElement('a') |
| | | // // link.href = url |
| | | // // link.download = `储气罐预警数据_${new Date().getTime()}.csv` |
| | | // // link.click() |
| | | // // window.URL.revokeObjectURL(url) |
| | | // }).catch(err => { |
| | | // ElMessage.error(err.msg); |
| | | // }) |
| | | // } |
| | | |
| | | ElMessageBox.confirm("选中的内容将被导出,是否确认导出?", "导出", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download("/gasTankWarning/export", {ids: selectedRows.value.map(item => item.id)}, "储气罐预警.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | } |
| | | |
| | | // 生成CSV内容 |
| | | const generateCSV = (data) => { |
| | | const headers = [ |
| | | '储气罐编码', '储气罐名称', '储气罐类型', '规格型号', '容积(m³)', |
| | | '当前气体量(%)', '安全气体量(%)', '最低气体量(%)', '最高气体量(%)', |
| | | '当前压力(MPa)', '预警类型', '预警级别', '预警阈值', '是否启用', |
| | | '预警时间', '预警持续天数', '最后更新时间', '预计充装时间', '预计缺气时间', '预警规则描述' |
| | | ] |
| | | |
| | | const csvRows = [headers.join(',')] |
| | | |
| | | data.forEach(item => { |
| | | const row = [ |
| | | item.tankCode, |
| | | item.tankName, |
| | | item.tankType, |
| | | item.specificationModel, |
| | | item.volume, |
| | | item.currentGasLevel, |
| | | item.safetyGasLevel, |
| | | item.minGasLevel, |
| | | item.maxGasLevel, |
| | | item.currentPressure, |
| | | item.warningType, |
| | | item.warningLevel, |
| | | item.warningThreshold, |
| | | item.isEnabled ? '是' : '否', |
| | | item.warningTime, |
| | | item.warningDuration, |
| | | item.lastUpdateTime, |
| | | item.expectedRefillTime, |
| | | item.expectedShortageTime, |
| | | item.warningRule |
| | | ] |
| | | csvRows.push(row.join(',')) |
| | | }) |
| | | |
| | | return csvRows.join('\n') |
| | | } |
| | | |
| | | // 启用状态变化 |
| | | |
| | | // // 启用状态变化 |
| | | const handleEnableChange = async (row) => { |
| | | |
| | | try { |
| | | // 模拟API调用延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 200)) |
| | | ElMessage.success(`${row.tankName} 的启用状态已更新`) |
| | | updateStockWarning(row).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success(`${row.tankName} 的启用状态已更新`); |
| | | getList(); |
| | | } |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg); |
| | | }) |
| | | } catch (error) { |
| | | ElMessage.error('状态更新失败') |
| | | // 恢复原状态 |
| | |
| | | await proxy.$refs.formRef.validate() |
| | | |
| | | // 模拟API调用延迟 |
| | | await new Promise(resolve => setTimeout(resolve, 500)) |
| | | // await new Promise(resolve => setTimeout(resolve, 500)) |
| | | |
| | | if (operationType.value === 'add') { |
| | | ElMessage.success('新增成功') |
| | | addStockWarning(form).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success("添加成功"); |
| | | dialogFormVisible.value = false |
| | | getList() |
| | | resetForm() |
| | | } |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg); |
| | | }) |
| | | |
| | | // ElMessage.success('新增成功') |
| | | } else { |
| | | ElMessage.success('编辑成功') |
| | | updateStockWarning(form).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success("更新成功"); |
| | | dialogFormVisible.value = false |
| | | getList() |
| | | resetForm() |
| | | } |
| | | }).catch(err => { |
| | | ElMessage.error(err.msg); |
| | | }) |
| | | // ElMessage.success('编辑成功') |
| | | } |
| | | |
| | | closeDialog() |
| | | getList() |
| | | // closeDialog() |
| | | // getList() |
| | | } catch (error) { |
| | | if (!error.errors) { |
| | | ElMessage.error(operationType.value === 'add' ? '新增失败' : '编辑失败') |
| | |
| | | // 关闭弹窗 |
| | | const closeDialog = () => { |
| | | dialogFormVisible.value = false |
| | | resetForm() |
| | | // resetForm() |
| | | } |
| | | |
| | | // 重置表单 |