yangjun
/
grgw_vue_2025
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

页面优化

This commit is contained in:
曹磊 2025-09-03 17:26:21 +08:00
parent d8a3452465
commit ec224975ec
15 changed files with 445 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/views/screen/Dashboard.vue
View File

@ -62,9 +62,9 @@
<span>二次网供压</span>
<span>二次网回压</span>
<div>
<!-- <span v-if="tableCanScroll" @click="stopScroll()">停</span>
<span v-else @click="startScroll()">启</span>-->
<a-switch v-model:checked="checked1" checked-children="启" un-checked-children="停" />
<span v-if="tableCanScroll" @click="stopScroll()">停</span>
<span v-else @click="startScroll()">启</span>
<!-- <a-switch v-model:checked="checked1" checked-children="启" un-checked-children="停" />-->
</div>
<!-- <img src="./dashboard/dp_icon4-right.png" class="left-icon" /> -->
</div>
@ -168,7 +168,7 @@
<span class="close-btn" @click="closeModal">×</span>
</div>
<div class="modal-body list-container">
<div class="list-header" style="color: #81c7e6;">
<div class="list-header" style="color: #fff;">
<img src="./dashboard/dp_icon4-left.png" class="left-icon" />
<span>锅炉房名称</span>
<span v-show="modalType == 1">换热站名称</span>
@ -181,7 +181,7 @@
</div>
<div class="list-body">
<div v-if="!!modalData.length" v-for="item in modalData" :key="item.view028" class="list-row"
style="color: #81c7e6;">
style="color: #fff;">
<span>{{ item.view028 }}</span>
<span v-show="modalType == 1">{{ item.view030 }}</span>
<span v-if="modalType == 0 || modalType == 1">{{ item.view005 }}</span>
@ -192,7 +192,7 @@
<span v-if="modalType == 1">{{ item.view011 }}</span>
<span v-if="modalType == 0 || modalType == 2">{{ item.view008 }}</span>
<span v-if="modalType == 1">{{ item.view012 }}</span>
<span><a-button type="link"><span style="color: white;"
<span><a-button type="link"><span style="color: #81c7e6;"
@click="detailFunc(item)">详情</span></a-button></span>
</div>
<div v-else class="list-row">
@ -208,6 +208,13 @@
<ZxtCQ ref="registerModal" @close="closeModal2" />
</div>
</div>
<div v-if="modalVisible3" class="modal-overlay2" @click.self="closeModal3">
<div class="modal-content2">
<ZxtJx ref="registerModal3" @close="closeModal3" />
</div>
</div>
</div>
</template>
@ -219,11 +226,14 @@ import aImg from './dashboard/c.png';
import lqImg from './dashboard/lq.png';
import ljt from './dashboard/ljt.png';
import ZxtCQ from './components/ZxtCQ.vue'
import ZxtJx from './components/ZxtJx.vue'
const registerModal = ref();
const registerModal3 = ref();
const modalVisible = ref(false);
const modalVisible2 = ref(false)
const modalVisible3 = ref(false)
const modalTitle = ref('');
const modalData = ref<any[]>([]);
@ -256,10 +266,14 @@ let tableTimer = null;
const tableCanScroll = ref(true)
const startScroll = () => {
if (tableTimer) {
clearInterval(tableTimer);
scrollTop.value = 0;
}
tableTimer = null;
tableCanScroll.value = true
const totalHeight = 28 * z.value.length;
tableTimer = setInterval(() => {
scrollTop.value += speed;
if (scrollTop.value >= totalHeight) {
@ -356,7 +370,7 @@ function updateChartMain() {
chartMain.dispatchAction({ type: 'highlight', seriesIndex: 1, dataIndex: idx });
} catch (e) {
// 防止报错中断定时器
console.error(e);
// console.error(e);
}
}, 5000);
@ -725,7 +739,7 @@ function updateChartArea8() {
chartArea8.dispatchAction({ type: 'highlight', seriesIndex: 0, dataIndex: idx });
chartArea8.dispatchAction({ type: 'highlight', seriesIndex: 1, dataIndex: idx });
} catch (e) {
console.error(e);
// console.error(e);
}
}, 5000);
}, 2500);
@ -1008,14 +1022,26 @@ function closeModal() {
}
async function detailFunc(record) {
modalVisible2.value = true;
await nextTick()
registerModal.value.init(record)
console.log(record);
console.log(modalType);
if(modalType.value == 2){
modalVisible3.value = true;
await nextTick()
registerModal3.value.init(record)
}else{
modalVisible2.value = true;
await nextTick()
registerModal.value.init(record)
}
}
function closeModal2() {
modalVisible2.value = false;
}
function closeModal3() {
modalVisible3.value = false;
}
</script>
@ -1531,7 +1557,7 @@ function closeModal2() {
padding: 0 16px;
font-size: 18px;
font-weight: bold;
color: #59accf;
color: #fff;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

88
src/views/screen/components/ZxtCQ.vue
View File

@ -22,7 +22,7 @@
import { ref, nextTick, defineProps, onUnmounted } from 'vue';
import * as echarts from 'echarts';
import { useMessage } from '/@/hooks/web/useMessage';
import {jxlist, list} from '/@/views/heating/history/HeatanalysisHistory.api';
import { list} from '/@/views/heating/history/HeatanalysisHistory.api';
const emit = defineEmits(['close']);
@ -72,29 +72,16 @@ function initChartsOptions(records: any[], record_: any) {
let wdSeries = [];
let ylSeries = [];
if(record_.regionType == '城区'){
records.sort((a: any, b: any) => new Date(a.datatime).getTime() - new Date(b.datatime).getTime());
if(record_.view004){
wdSeries.push({ name: '供水温度', key: 'view009', color: '#ff007f' });
wdSeries.push({ name: '回水温度', key: 'view010', color: '#6a5acd' });
ylSeries.push({ name: '供水压力', key: 'view011', color: '#ff007f' });
ylSeries.push({ name: '回水压力', key: 'view012', color: '#6a5acd' });
}else{
wdSeries.push({ name: '供水温度', key: 'view005', color: '#00c6ff' });
wdSeries.push({ name: '回水温度', key: 'view006', color: '#ff6a00' });
ylSeries.push({ name: '供水压力', key: 'view007', color: '#00c6ff' });
ylSeries.push({ name: '回水压力', key: 'view008', color: '#ff6a00' });
}
}
if(record_.regionType == '郊县'){
records.sort((a: any, b: any) => {
const ta = new Date(a.view032 || a.datatime || '').getTime();
const tb = new Date(b.view032 || b.datatime || '').getTime();
return (isNaN(ta) ? 0 : ta) - (isNaN(tb) ? 0 : tb);
});
wdSeries.push({ name: '供水温度', key: 'view035', color: '#00c6ff' });
wdSeries.push({ name: '回水温度', key: 'view036', color: '#ff6a00' });
records.sort((a: any, b: any) => new Date(a.datatime).getTime() - new Date(b.datatime).getTime());
if(record_.view004){
wdSeries.push({ name: '供水温度', key: 'view009', color: '#ff007f' });
wdSeries.push({ name: '回水温度', key: 'view010', color: '#6a5acd' });
ylSeries.push({ name: '供水压力', key: 'view011', color: '#ff007f' });
ylSeries.push({ name: '回水压力', key: 'view012', color: '#6a5acd' });
}else{
wdSeries.push({ name: '供水温度', key: 'view005', color: '#00c6ff' });
wdSeries.push({ name: '回水温度', key: 'view006', color: '#ff6a00' });
ylSeries.push({ name: '供水压力', key: 'view007', color: '#00c6ff' });
ylSeries.push({ name: '回水压力', key: 'view008', color: '#ff6a00' });
}
@ -146,8 +133,6 @@ function initChartsOptions(records: any[], record_: any) {
pressOption = { ...baseOption, title: { text: '压力指标', left: 'center', top: 8, textStyle: { color: '#ffffff' } }, series: pressSeries };
}
let resizeAdded = false;
function ensureResizeListener() {
if (resizeAdded) return;
@ -166,7 +151,7 @@ function init(record_: any) {
const params = {
pageNo: 1,
pageSize: -1,
regionType: record_.regionType,
regionType: '城区',
view001: record_.view001,
view002: record_.view002,
view004: record_.view004 || -1,
@ -174,43 +159,22 @@ function init(record_: any) {
endDate: formatDateTime(end),
};
if(record_.regionType == '城区'){
list(params).then((res: any) => {
const records = (res && res.list) ? res.list : [];
headerText.value = buildHeader(records, record_);
initChartsOptions(records,record_);
nextTick(() => {
// 初始化温度图表（默认tab）
if (tempChartRef.value) {
tempChart = echarts.init(tempChartRef.value);
tempChart.setOption(tempOption);
}
ensureResizeListener();
});
}).catch(err => {
console.error(err);
createMessage.error('获取数据失败');
list(params).then((res: any) => {
const records = (res && res.list) ? res.list : [];
headerText.value = buildHeader(records, record_);
initChartsOptions(records,record_);
nextTick(() => {
// 初始化温度图表（默认tab）
if (tempChartRef.value) {
tempChart = echarts.init(tempChartRef.value);
tempChart.setOption(tempOption);
}
ensureResizeListener();
});
}
if(record_.regionType == '郊县'){
jxlist(params).then((res: any) => {
const records = (res && res.list) ? res.list : [];
headerText.value = buildHeader(records, record_);
initChartsOptions(records,record_);
nextTick(() => {
// 初始化温度图表（默认tab）
if (tempChartRef.value) {
tempChart = echarts.init(tempChartRef.value);
tempChart.setOption(tempOption);
}
ensureResizeListener();
});
}).catch(err => {
console.error(err);
createMessage.error('获取数据失败');
});
}
}).catch(err => {
console.error(err);
createMessage.error('获取数据失败');
});
}

357
src/views/screen/components/ZxtJX.vue Normal file
View File

@ -0,0 +1,357 @@
<template>
<div>
<span class="close-btn2" @click="closeModal"><span style="color: white;">×</span></span>
</div>
<div class="wrap">
<!-- 页面顶部中间显示 公司/锅炉房/换热站 -->
<div class="title">{{ headerText }}</div>
<!-- Tabs -->
<a-tabs v-model:activeKey="activeTab" centered @change="onTabChange">
<a-tab-pane key="temp" tab="温度指标">
<div ref="tempChartRef" class="chart-box"></div>
</a-tab-pane>
<a-tab-pane key="press" tab="压力指标">
<div ref="pressChartRef" class="chart-box"></div>
</a-tab-pane>
<a-tab-pane key="heat" tab="热量指标">
<div ref="heatChartRef" class="chart-box"></div>
</a-tab-pane>
<a-tab-pane key="flow" tab="流量指标">
<div ref="flowChartRef" class="chart-box"></div>
</a-tab-pane>
</a-tabs>
</div>
</template>
<script lang="ts" setup>
import { ref, nextTick, defineProps, onUnmounted } from 'vue';
import * as echarts from 'echarts';
import { useMessage } from '/@/hooks/web/useMessage';
import {jxlist} from '/@/views/heating/history/HeatanalysisHistory.api';
const emit = defineEmits(['close']);
const props = defineProps({});
const { createMessage } = useMessage();
const activeTab = ref('temp'); // 默认进入温度指标 tab
// 日期：近7天（含今天）
const end = new Date();
end.setHours(23, 59, 59, 999);
const start = new Date(end);
start.setDate(end.getDate() - 6);
start.setHours(0, 0, 0, 0);
const pad = (n: number) => String(n).padStart(2, '0');
function formatDateTime(d: Date) {
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
}
const tempChartRef = ref<HTMLElement | null>(null);
const pressChartRef = ref<HTMLElement | null>(null);
const heatChartRef = ref<HTMLElement | null>(null);
const flowChartRef = ref<HTMLElement | null>(null);
let tempChart: echarts.ECharts | null = null;
let pressChart: echarts.ECharts | null = null;
let heatChart: echarts.ECharts | null = null;
let flowChart: echarts.ECharts | null = null;
let tempOption: any = null;
let pressOption: any = null;
let heatOption: any = null;
let flowOption: any = null;
const headerText = ref(''); // 页面顶部显示文本
function safeNum(v: any) {
if (v === null || v === undefined || v === '') return null;
const n = Number(v);
return Number.isNaN(n) ? null : n;
}
function buildHeader(records: any[], record_: any) {
const r = (records && records.length > 0) ? records[0] : record_;
// 取出名称
const names = [r.view001Name, r.view002Name, r.view004Name].filter(v => v && v !== '');
// 用箭头连接
return names.join(' → ');
}
function initChartsOptions(records: any[], record_: any) {
let wdSeries = [];
let ylSeries = [];
let rlSeries = [];
let llSeries = [];
records.sort((a: any, b: any) => {
const ta = new Date(a.view032 || a.datatime || '').getTime();
const tb = new Date(b.view032 || b.datatime || '').getTime();
return (isNaN(ta) ? 0 : ta) - (isNaN(tb) ? 0 : tb);
});
wdSeries.push({ name: '供水温度', key: 'view035', color: '#00c6ff' });
wdSeries.push({ name: '回水温度', key: 'view036', color: '#ff6a00' });
ylSeries.push({ name: '供水压力', key: 'view007', color: '#00c6ff' });
ylSeries.push({ name: '回水压力', key: 'view008', color: '#ff6a00' });
rlSeries.push({ name: '瞬时热量', key: 'view041', color: '#00c6ff' });
rlSeries.push({ name: '正累积热量', key: 'view042', color: '#ff6a00' });
llSeries.push({ name: '瞬时流量', key: 'view037', color: '#00c6ff' });
llSeries.push({ name: '正累积流量', key: 'view038', color: '#ff6a00' });
const xAxis = records.map((r: any) => r.datatime);
const tempSeries = wdSeries.map(s => ({
name: s.name,
type: 'line',
showSymbol: false,
connectNulls: false,
lineStyle: { width: 2 }, // 设置线条的宽度
itemStyle: {
color: s.color, // 设置折线的颜色
},
data: records.map((r: any) => safeNum(r[s.key])),
}));
const pressSeries = ylSeries.map(s => ({
name: s.name,
type: 'line',
showSymbol: false,
connectNulls: false,
lineStyle: { width: 2 }, // 设置线条的宽度
itemStyle: {
color: s.color, // 设置折线的颜色
},
data: records.map((r: any) => safeNum(r[s.key])),
}));
const heatSeries = rlSeries.map(s => ({
name: s.name,
type: 'line',
showSymbol: false,
connectNulls: false,
lineStyle: { width: 2 }, // 设置线条的宽度
itemStyle: {
color: s.color, // 设置折线的颜色
},
data: records.map((r: any) => safeNum(r[s.key])),
}));
const flowSeries = llSeries.map(s => ({
name: s.name,
type: 'line',
showSymbol: false,
connectNulls: false,
lineStyle: { width: 2 }, // 设置线条的宽度
itemStyle: {
color: s.color, // 设置折线的颜色
},
data: records.map((r: any) => safeNum(r[s.key])),
}));
const baseOption = {
tooltip: { trigger: 'axis', axisPointer: { type: 'cross' } },
legend: { top: 36, left: 'center', textStyle: { color: '#ffffff' } }, // 设置折线图legend文字为白色
grid: { left: '5%', right: '5%', bottom: 70, top: 70, containLabel: true },
xAxis: {
type: 'category',
data: xAxis,
boundaryGap: false,
axisLabel: {
interval: 0,
formatter: (val: string) => val.replace(' ', '\n'),
color: '#ffffff' // 设置x轴文字颜色为白色
},
},
yAxis: { type: 'value', scale: true, axisLabel: { color: '#ffffff' } }, // 设置y轴文字颜色为白色
};
tempOption = { ...baseOption, title: { text: '温度指标', left: 'center', top: 8, textStyle: { color: '#ffffff' } }, series: tempSeries };
pressOption = { ...baseOption, title: { text: '压力指标', left: 'center', top: 8, textStyle: { color: '#ffffff' } }, series: pressSeries };
heatOption = { ...baseOption, title: { text: '热量指标', left: 'center', top: 8 , textStyle: { color: '#ffffff' } }, series: heatSeries };
flowOption = { ...baseOption, title: { text: '流量指标', left: 'center', top: 8 , textStyle: { color: '#ffffff' } }, series: flowSeries };
}
let resizeAdded = false;
function ensureResizeListener() {
if (resizeAdded) return;
const onResize = () => {
tempChart?.resize();
pressChart?.resize();
heatChart?.resize();
flowChart?.resize();
};
window.addEventListener('resize', onResize);
onUnmounted(() => {
window.removeEventListener('resize', onResize);
});
resizeAdded = true;
}
function init(record_: any) {
const params = {
pageNo: 1,
pageSize: -1,
regionType: '郊县',
view001: record_.view001,
view002: record_.view002,
startDate: formatDateTime(start),
endDate: formatDateTime(end),
};
jxlist(params).then((res: any) => {
const records = (res && res.list) ? res.list : [];
headerText.value = buildHeader(records, record_);
initChartsOptions(records,record_);
nextTick(() => {
// 初始化温度图表（默认tab）
if (tempChartRef.value) {
tempChart = echarts.init(tempChartRef.value);
tempChart.setOption(tempOption);
}
ensureResizeListener();
});
}).catch(err => {
console.error(err);
createMessage.error('获取数据失败');
});
}
// tab切换时，第一次进来才 init
function onTabChange(key: string) {
nextTick(() => {
if (key === 'temp') {
if (!tempChart && tempChartRef.value) {
tempChart = echarts.init(tempChartRef.value);
tempChart.setOption(tempOption);
}
tempChart?.resize();
} else if (key === 'press') {
if (!pressChart && pressChartRef.value) {
pressChart = echarts.init(pressChartRef.value);
pressChart.setOption(pressOption);
}
pressChart?.resize();
} else if (key === 'heat') {
if (!heatChart && heatChartRef.value) {
heatChart = echarts.init(heatChartRef.value);
heatChart.setOption(heatOption);
}
heatChart?.resize();
} else if (key === 'flow') {
if (!flowChart && flowChartRef.value) {
flowChart = echarts.init(flowChartRef.value);
flowChart.setOption(flowOption);
}
flowChart?.resize();
}
});
}
function closeModal() {
emit('close')
}
defineExpose({ init });
onUnmounted(() => {
if (tempChart) { tempChart.dispose(); tempChart = null; }
if (pressChart) { pressChart.dispose(); pressChart = null; }
if (heatChart) { heatChart.dispose(); heatChart = null; }
if (flowChart) { flowChart.dispose(); flowChart = null; }
});
</script>
<style lang="less" scoped>
.close-btn2 {
position: absolute;
top: 10px;
right: 10px;
float: right;
color: white;
cursor: pointer;
z-index: 299;
}
.wrap {
width: 100%;
margin: 0 auto;
background: linear-gradient(135deg, rgba(20, 35, 55, 0.85), rgba(0, 20, 40, 0.7));
/* 渐变背景色 */
padding: 20px;
border-radius: 15px;
/* 增加圆角 */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
/* 添加阴影 */
backdrop-filter: blur(10px);
/* 背景模糊效果 */
}
.title {
text-align: center;
font-size: 24px;
font-weight: 700;
margin: 20px 0;
color: #ffffff;
background: linear-gradient(135deg, #66d9ff, #ff8c00);
/* 渐变文字 */
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
/* 增加文字的荧光效果 */
}
.chart-box {
width: 100%;
height: 60vh;
background-color: rgba(0, 0, 0, 0.3);
/* 深色背景让图表突出 */
border-radius: 12px;
/* 圆角效果 */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
/* 给图表增加阴影 */
overflow: hidden;
}
a-tabs {
background-color: rgba(0, 0, 0, 0.5);
/* Tab 背景色 */
border-radius: 8px;
}
a-tab-pane {
background-color: rgba(255, 255, 255, 0.836);
/* Tab 选项卡背景 */
border-radius: 8px;
}
a-tab-pane .ant-tabs-tab {
font-size: 16px;
font-weight: bold;
color: #ffffff;
/* 确保未选中的 Tab 文字为白色 */
padding: 10px 20px;
}
a-tab-pane .ant-tabs-tab-active {
background-color: #ff8c00;
/* 激活的Tab颜色 */
color: #ffffff;
}
a-tab-pane .ant-tabs-tab:hover {
color: #ffffff;
/* hover时也为白色 */
}
:deep .ant-tabs-tab-btn {
color: white;
}
</style>

2
src/views/staticList/GlfghsList.vue
View File

@ -53,7 +53,7 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: '℃' },
series: [
{ name: '供水温度', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },

2
src/views/staticList/GlfghsListHistory.vue
View File

@ -79,7 +79,7 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0,formatter: (val: string) => val.replace(' ', '\n') } },
yAxis: { type: 'value', name: '℃' },
series: [
{ name: '供水温度', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },

6
src/views/staticList/GlfghsjxList.vue
View File

@ -46,14 +46,14 @@ function prepareOptions(records: any[]) {
const cityX = buildXAxis(city, 'view028');
console.log("🚀 ~ prepareOptions ~ cityX:", cityX)
const citySW = city.map((r: any) => safeNum(r.view005));
const cityHW = city.map((r: any) => safeNum(r.view006));
const citySW = city.map((r: any) => safeNum(r.view035));
const cityHW = city.map((r: any) => safeNum(r.view036));
cityOption = {
title: { text: '郊县锅炉房供/回水温度', left: 'center', top: 10 },
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: '℃' },
series: [
{ name: '供水温度', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },

2
src/views/staticList/GlfghsjxListHistory.vue
View File

@ -79,7 +79,7 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0,formatter: (val: string) => val.replace(' ', '\n') } },
yAxis: { type: 'value', name: '℃' },
series: [
{ name: '供水温度', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },

4
src/views/staticList/GlfrlljxList.vue
View File

@ -52,8 +52,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Kj' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: 'kw' },
series: [
{ name: '热流量', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
],

4
src/views/staticList/GlfrlljxListHistory.vue
View File

@ -78,8 +78,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Kj' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0,formatter: (val: string) => val.replace(' ', '\n') } },
yAxis: { type: 'value', name: 'kw' },
series: [
{ name: '热流量', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
],

4
src/views/staticList/GlfslljxList.vue
View File

@ -52,8 +52,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'm³/s' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: 'm³/h' },
series: [
{ name: '水流量', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
],

4
src/views/staticList/GlfslljxListHistory.vue
View File

@ -78,8 +78,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'm³/s' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0,formatter: (val: string) => val.replace(' ', '\n') } },
yAxis: { type: 'value', name: 'm³/h' },
series: [
{ name: '水流量', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
],

4
src/views/staticList/GlfylList.vue
View File

@ -53,8 +53,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Pa' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: 'MPa' },
series: [
{ name: '供水压力', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
{ name: '回水压力', type: 'line', data: cityHW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }

4
src/views/staticList/GlfylListHistory.vue
View File

@ -79,8 +79,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Pa' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 ,formatter: (val: string) => val.replace(' ', '\n')} },
yAxis: { type: 'value', name: 'MPa' },
series: [
{ name: '供水压力', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
{ name: '回水压力', type: 'line', data: cityHW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }

4
src/views/staticList/GlfyljxList.vue
View File

@ -53,8 +53,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Pa' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0 } },
yAxis: { type: 'value', name: 'MPa' },
series: [
{ name: '供水压力', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
{ name: '回水压力', type: 'line', data: cityHW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }

4
src/views/staticList/GlfyljxListHistory.vue
View File

@ -79,8 +79,8 @@ function prepareOptions(records: any[]) {
tooltip: { trigger: 'axis' },
legend: { top: 36, left: 'center' },
grid: { left: '6%', right: '4%', bottom: 70, top: 70, containLabel: true },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 20 } },
yAxis: { type: 'value', name: 'Pa' },
xAxis: { type: 'category', data: cityX, axisLabel: { rotate: 0,formatter: (val: string) => val.replace(' ', '\n') } },
yAxis: { type: 'value', name: 'MPa' },
series: [
{ name: '供水压力', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
{ name: '回水压力', type: 'line', data: cityHW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }