diff --git a/src/models/_/base.js b/src/models/_/base.js index c3c044b..3a8c716 100644 --- a/src/models/_/base.js +++ b/src/models/_/base.js @@ -5,10 +5,12 @@ import apiurl from '../apiurl'; export const BouaPromise = new CachePromise( - () => fetch('./data/boua.geojson').then(res => res.json()).catch(() => null), 0); + // () => fetch('./data/boua.geojson').then(res => res.json()).catch(() => null), 0); + () => fetch(`${process.env.PUBLIC_URL}/data/boua.geojson`).then(res => res.json()).catch(() => null), 0); export const WataPromise = new CachePromise( - () => fetch('./data/wata.geojson').then(res => res.json()).catch(() => null), 0); + // () => fetch('./data/wata.geojson').then(res => res.json()).catch(() => null), 0); + () => fetch(`${process.env.PUBLIC_URL}/data/wata.geojson`).then(res => res.json()).catch(() => null), 0); function _watau(level) { return new CachePromise( diff --git a/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js b/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js index 377a344..9bde37e 100644 --- a/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js +++ b/src/views/Home/InfoDlg/EditFaDlg/ScheduleCharts.js @@ -52,24 +52,66 @@ const ScheduleCharts = () => { // 生成测试数据 useEffect(() => { const generateData = () => { - const timePoints = []; - const openingData = []; - const inflowData = []; - const outflowData = []; - const levelData = []; + // const timePoints = []; + // const openingData = []; + // const inflowData = []; + // const outflowData = []; + // const levelData = []; - for (let i = 0; i < 96; i++) { // 24小时,每15分钟一个点 - const time = new Date('2025-05-18'); - time.setMinutes(time.getMinutes() + i * 15); - const timeStr = time.toLocaleTimeString('zh-CN', { hour12: false }); - timePoints.push(timeStr); - // 模拟数据 - openingData.push(i < 32 ? 1.5 : i < 80 ? 2 : 1.2); - inflowData.push(Math.sin(i / 10) * 300 + 400); - outflowData.push(Math.max(0, Math.sin((i - 10) / 10) * 100 + 150)); - levelData.push(Math.min(68.04, 40 + Math.sin(i / 30) * 10 + 20)); - } + const timePoints = [ + "05-28 07:00", "05-28 10:00", "05-28 13:00", "05-28 16:00", "05-28 19:00", "05-28 22:00", + "05-29 01:00", "05-29 04:00", "05-29 07:00", "05-29 10:00", "05-29 13:00", "05-29 16:00", "05-29 19:00", "05-29 22:00", + "05-30 01:00", "05-30 04:00", "05-30 07:00", "05-30 10:00", "05-30 13:00", "05-30 16:00", "05-30 19:00", "05-30 22:00", + "05-31 01:00", "05-31 04:00", "05-31 07:00", "05-31 10:00", "05-31 13:00", "05-31 16:00", "05-31 19:00", "05-31 22:00", + "06-01 01:00", "06-01 04:00", "06-01 07:00", "06-01 10:00", "06-01 13:00", "06-01 16:00", "06-01 19:00", "06-01 22:00", + "06-02 01:00", "06-02 04:00", "06-02 06:00" + ]; + + const openingData = [ + 0.5, 0.5, 0.5, 0.5, 1.0, 1.0, // 05-28 + 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, // 05-29 + 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, // 05-30 + 2.0, 2.0, 2.0, 2.0, 2.0, 2.0, 1.8, 1.8, // 05-31 + 1.8, 1.8, 1.5, 1.5, 1.5, 1.5, 1.5, 1.5, // 06-01 + 1.5, 1.5, 1.5 // 06-02 + ]; + const inflowData = [ + 100, 150, 200, 250, 350, 450, // 05-28 + 650, 750, 700, 600, 500, 400, 300, 250, // 05-29 + 200, 180, 170, 160, 150, 140, 130, 120, // 05-30 + 110, 100, 100, 100, 100, 100, 100, 100, // 05-31 + 100, 100, 100, 100, 100, 100, 100, 100, // 06-01 + 100, 100, 100 // 06-02 + ]; + const outflowData = [ + 50, 80, 100, 120, 140, 160, // 05-28 + 180, 190, 200, 200, 200, 190, 180, 170, // 05-29 + 160, 150, 140, 130, 120, 110, 100, 100, // 05-30 + 100, 100, 100, 100, 100, 100, 100, 100, // 05-31 + 100, 100, 100, 100, 100, 100, 100, 100, // 06-01 + 100, 100, 100 // 06-02 + ]; + const levelData = [ + 30, 30, 32, 35, 40, 45, // 05-28 + 50, 55, 60, 65, 68, 68, 68, 68, // 05-29 + 67, 66, 65, 64, 63, 62, 60, 58, // 05-30 + 56, 54, 52, 50, 48, 46, 44, 42, // 05-31 + 40, 38, 36, 35, 34, 33, 32, 32, // 06-01 + 32, 32, 32 // 06-02 + ]; + // for (let i = 0; i < 96; i++) { // 24小时,每15分钟一个点 + // const time = new Date('2025-05-18'); + // time.setMinutes(time.getMinutes() + i * 15); + // const timeStr = time.toLocaleTimeString('zh-CN', { hour12: false }); + // timePoints.push(timeStr); + + // // 模拟数据 + // openingData.push(i < 32 ? 1.5 : i < 80 ? 2 : 1.2); + // inflowData.push(Math.sin(i / 10) * 300 + 400); + // outflowData.push(Math.max(0, Math.sin((i - 10) / 10) * 100 + 150)); + // levelData.push(Math.min(68.04, 40 + Math.sin(i / 30) * 10 + 20)); + // } return { timePoints, openingData, inflowData, outflowData, levelData }; }; @@ -89,24 +131,24 @@ const ScheduleCharts = () => { const handleChartEvents = { click: (params) => { - if (params.componentType === 'markPoint') { - if (params.seriesIndex === 1) { - setFlowDialogOpen(true); - } else{ - setLevelDialogOpen(true); + if (params.componentType === 'markPoint') { + if (params.seriesIndex === 1) { + setFlowDialogOpen(true); + } else { + setLevelDialogOpen(true); + } } } - } -}; + }; const getOpeningOption = () => ({ grid: { top: 30, right: 20, bottom: 30, left: 50 }, tooltip: { trigger: 'axis' }, - legend: { - data: ['开度'], - textStyle: { color: '#fff' }, - top: 0 - }, + legend: { + data: ['开度'], + textStyle: { color: '#fff' }, + top: 0 + }, xAxis: { type: 'category', data: chartData?.timePoints, @@ -126,7 +168,7 @@ const ScheduleCharts = () => { data: chartData?.openingData?.map(item => item.toFixed(2)), type: 'line', smooth: true, - symbol:'none', + symbol: 'none', lineStyle: { color: '#4a90e2' }, areaStyle: { color: '#4a90e2', opacity: 0.1 }, itemStyle: { color: '#4a90e2' }, @@ -136,11 +178,11 @@ const ScheduleCharts = () => { const getFlowOption = () => ({ grid: { top: 30, right: 20, bottom: 30, left: 50 }, tooltip: { trigger: 'axis' }, - legend: { - data: ['入库流量', '出库流量'], - textStyle: { color: '#fff' }, - top: 0 - }, + legend: { + data: ['入库流量', '出库流量'], + textStyle: { color: '#fff' }, + top: 0 + }, xAxis: { type: 'category', data: chartData?.timePoints, @@ -160,7 +202,7 @@ const ScheduleCharts = () => { name: '入库流量', data: chartData?.inflowData?.map(item => item.toFixed(2)), type: 'line', - symbol:'none', + symbol: 'none', smooth: true, lineStyle: { color: '#ffd700' }, areaStyle: { color: '#ffd700', opacity: 0.1 }, @@ -170,7 +212,7 @@ const ScheduleCharts = () => { name: '出库流量', data: chartData?.outflowData?.map(item => item.toFixed(2)), type: 'line', - symbol:'none', + symbol: 'none', smooth: true, lineStyle: { color: '#4a90e2' }, areaStyle: { color: '#4a90e2', opacity: 0.1 }, @@ -180,7 +222,8 @@ const ScheduleCharts = () => { itemStyle: { color: '#4a90e2' }, label: { color: '#fff' }, symbolSize: 40, - onClick: () => { setFlowDialogOpen(true); console.log(1111111111111); + onClick: () => { + setFlowDialogOpen(true); console.log(1111111111111); }, }, }, @@ -191,10 +234,10 @@ const ScheduleCharts = () => { grid: { top: 30, right: 20, bottom: 30, left: 50 }, tooltip: { trigger: 'axis' }, legend: { - data: ['水位', '校核洪水位'], - textStyle: { color: '#fff' }, - top: 0 - }, + data: ['水位', '校核洪水位'], + textStyle: { color: '#fff' }, + top: 0 + }, xAxis: { type: 'category', data: chartData?.timePoints, @@ -210,10 +253,10 @@ const ScheduleCharts = () => { splitLine: { lineStyle: { color: '#2a2b2f' } }, }, series: [{ - name: '水位', + name: '水位', data: chartData?.levelData?.map(item => item.toFixed(2)), type: 'line', - symbol:'none', + symbol: 'none', smooth: true, lineStyle: { color: '#4a90e2' }, areaStyle: { color: '#4a90e2', opacity: 0.1 }, @@ -238,9 +281,9 @@ const ScheduleCharts = () => { return (