优化代码
This commit is contained in:
parent
cfb9f0ab6c
commit
a6e3db4d8b
|
|
@ -113,7 +113,7 @@ const transform: AxiosTransform = {
|
|||
config.url = `${apiUrl}${config.url}`;
|
||||
}
|
||||
//update-end---author:scott ---date::2024-02-20 for：以http开头的请求url，不拼加前缀--
|
||||
|
||||
|
||||
const params = config.params || {};
|
||||
const data = config.data || false;
|
||||
formatDate && data && !isString(data) && formatRequestDate(data);
|
||||
|
|
@ -165,7 +165,7 @@ const transform: AxiosTransform = {
|
|||
// 请求之前处理config
|
||||
const token = getToken();
|
||||
let tenantId: string | number = getTenantId();
|
||||
|
||||
|
||||
//update-begin---author:wangshuai---date:2024-04-16---for:【QQYUN-9005】发送短信加签。解决没有token无法加签---
|
||||
// 将签名和时间戳，添加在请求接口 Header
|
||||
config.headers[ConfigEnum.TIMESTAMP] = signMd5Utils.getTimestamp();
|
||||
|
|
@ -182,7 +182,7 @@ const transform: AxiosTransform = {
|
|||
// jwt token
|
||||
config.headers.Authorization = options.authenticationScheme ? `${options.authenticationScheme} ${token}` : token;
|
||||
config.headers[ConfigEnum.TOKEN] = token;
|
||||
|
||||
|
||||
// 将签名和时间戳，添加在请求接口 Header
|
||||
//config.headers[ConfigEnum.TIMESTAMP] = signMd5Utils.getTimestamp();
|
||||
//config.headers[ConfigEnum.Sign] = signMd5Utils.getSign(config.url, config.params);
|
||||
|
|
@ -276,7 +276,7 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
|
|||
// authenticationScheme: 'Bearer',
|
||||
authenticationScheme: '',
|
||||
//接口超时设置
|
||||
timeout: 10 * 1000,
|
||||
timeout: 60 * 1000,
|
||||
// 基础接口地址
|
||||
// baseURL: globSetting.apiUrl,
|
||||
headers: { 'Content-Type': ContentTypeEnum.JSON },
|
||||
|
|
|
|||
|
|
@ -33,13 +33,13 @@
|
|||
<a-row :gutter="20" class="third-row">
|
||||
<a-col :xs="24" :md="12">
|
||||
<a-card bordered class="mini-card">
|
||||
<div class="mini-title">乡镇瞬时热量【实时】</div>
|
||||
<div class="mini-title">乡镇累积热量【GJ】</div>
|
||||
<div ref="countyPowerChartRef" class="chart-medium"></div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :xs="24" :md="12">
|
||||
<a-card bordered class="mini-card" style="margin-left: 8px;">
|
||||
<div class="mini-title">乡镇瞬时流量【实时】</div>
|
||||
<div class="mini-title">乡镇累积流量【m³】</div>
|
||||
<div ref="countyFlowChartRef" class="chart-medium"></div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
|
|
@ -95,7 +95,7 @@ function sortByTime(arr: any[]) {
|
|||
}
|
||||
function splitByRegion(data: any[]) {
|
||||
const city = data.filter(d => String(d.regionType).includes('城区'));
|
||||
const county = data.filter(d => String(d.regionType).includes('乡镇'));
|
||||
let county = data.filter(d => String(d.regionType).includes('乡镇'));
|
||||
return { city: sortByTime(city), county: sortByTime(county) };
|
||||
}
|
||||
function buildXAxis(records: any[], key = 'view028') {
|
||||
|
|
@ -142,25 +142,25 @@ function prepareOptions(records: any[]) {
|
|||
color: ['#D64545', '#12A0A6']
|
||||
};
|
||||
|
||||
const powerY = county.map((r: any) => safeNum(r.view041));
|
||||
const powerY = county.map((r: any) => safeNum(r.view044));
|
||||
countyPowerOption = {
|
||||
title: { text: '', left: 'center', top: 8 },
|
||||
tooltip: { trigger: 'axis' },
|
||||
grid: { left: '6%', right: '6%', bottom: 60, top: 50, containLabel: true },
|
||||
xAxis: { type: 'category', data: countyX, axisLabel: { rotate: 20 } },
|
||||
yAxis: { type: 'value', name: '瞬时热量' },
|
||||
series: [{ name: '瞬时热量', type: 'line', data: powerY, smooth: false, areaStyle: {}, showSymbol: false, lineStyle: { type: 'solid' } }],
|
||||
yAxis: { type: 'value', name: '累积热量' },
|
||||
series: [{ name: '累积热量', type: 'line', data: powerY, smooth: false, areaStyle: {}, showSymbol: false, lineStyle: { type: 'solid' } }],
|
||||
color: ['#E89B3B']
|
||||
};
|
||||
|
||||
const flowY = county.map((r: any) => safeNum(r.view037));
|
||||
const flowY = county.map((r: any) => safeNum(r.view040));
|
||||
countyFlowOption = {
|
||||
title: { text: '', left: 'center', top: 8 },
|
||||
tooltip: { trigger: 'axis' },
|
||||
grid: { left: '6%', right: '6%', bottom: 60, top: 50, containLabel: true },
|
||||
xAxis: { type: 'category', data: countyX, axisLabel: { rotate: 20 } },
|
||||
yAxis: { type: 'value', name: '瞬时流量' },
|
||||
series: [{ name: '瞬时流量', type: 'line', data: flowY, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }],
|
||||
yAxis: { type: 'value', name: '累积流量' },
|
||||
series: [{ name: '累积流量', type: 'line', data: flowY, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } }],
|
||||
color: ['#7C55FF']
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -127,13 +127,13 @@ export const jxcolumns: BasicColumn[] = [
|
|||
title: '供水温度',
|
||||
align: "center",
|
||||
width: 90,
|
||||
dataIndex: 'view005',
|
||||
dataIndex: 'view035',
|
||||
},
|
||||
{
|
||||
title: '回水温度',
|
||||
align: "center",
|
||||
width: 90,
|
||||
dataIndex: 'view006'
|
||||
dataIndex: 'view036'
|
||||
},
|
||||
{
|
||||
title: '供水压力',
|
||||
|
|
|
|||
|
|
@ -46,13 +46,13 @@
|
|||
</a-col>
|
||||
<a-col :lg="5">
|
||||
<a-form-item label="开始时间">
|
||||
<a-date-picker placeholder="请选择开始时间" v-model:value="queryParam.SDate" :disabledDate="startDisabledDate"
|
||||
<a-date-picker placeholder="请选择开始时间" v-model:value="queryParam.SDateStr" value-format="YYYY-MM-DD HH:mm:ss" :disabledDate="startDisabledDate"
|
||||
@change="handleStartChange" show-time style="width: 100%" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="5">
|
||||
<a-form-item label="结束时间">
|
||||
<a-date-picker placeholder="请选择结束时间" v-model:value="queryParam.EDate" :disabledDate="endDisabledDate"
|
||||
<a-date-picker placeholder="请选择结束时间" v-model:value="queryParam.EDateStr" value-format="YYYY-MM-DD HH:mm:ss" :disabledDate="endDisabledDate"
|
||||
@change="handleEndChange" show-time style="width: 100%" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
|
@ -77,6 +77,7 @@ import {
|
|||
heatsourcestationlist,
|
||||
page
|
||||
} from './HeatanalysisHistory.api';
|
||||
import dayjs from "dayjs";
|
||||
|
||||
const queryParam = ref<any>({});
|
||||
const toggleSearchStatus = ref<boolean>(false);
|
||||
|
|
@ -92,6 +93,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
|||
clickToRowSelect: false,
|
||||
showActionColumn: false,
|
||||
showIndexColumn: false,
|
||||
immediate: false,
|
||||
tableSetting: {
|
||||
// 是否显示刷新按钮
|
||||
redo: false,
|
||||
|
|
@ -136,23 +138,26 @@ function searchQuery() {
|
|||
/**
|
||||
* 重置
|
||||
*/
|
||||
function searchReset() {
|
||||
async function searchReset() {
|
||||
queryParam.value = {};
|
||||
selectedRowKeys.value = [];
|
||||
getHeatsource();
|
||||
getHeatsourcestation();
|
||||
await getHeatsource();
|
||||
await getHeatsourcestation();
|
||||
let list = thermalcompany.value;
|
||||
queryParam.value.view001 = list[0].id;
|
||||
queryParam.value.SDateStr = dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
//刷新数据
|
||||
reload();
|
||||
}
|
||||
|
||||
const thermalcompany = ref();
|
||||
async function getThermalcompany() {
|
||||
thermalcompany.value = await companylist();
|
||||
thermalcompany.value = await companylist({regionType: '城区'});
|
||||
}
|
||||
|
||||
const heatsource = ref();
|
||||
async function getHeatsource() {
|
||||
heatsource.value = await heatsourcelist();
|
||||
heatsource.value = await heatsourcelist({regionType: '城区'});
|
||||
}
|
||||
|
||||
const heatsourcestation = ref();
|
||||
|
|
@ -175,57 +180,59 @@ function handleChange3(record) {
|
|||
// 禁用开始日期的规则
|
||||
function startDisabledDate(current) {
|
||||
// 结束日期未选时不做限制
|
||||
if (!queryParam.value.EDate) return false;
|
||||
return !current.isSame(queryParam.value.EDate, 'month') ||
|
||||
current.isAfter(queryParam.value.EDate, 'day');
|
||||
if (!queryParam.value.EDateStr) return false;
|
||||
return !current.isSame(queryParam.value.EDateStr, 'month') ||
|
||||
current.isAfter(queryParam.value.EDateStr, 'day');
|
||||
}
|
||||
|
||||
// 禁用结束日期的规则
|
||||
function endDisabledDate(current) {
|
||||
// 开始日期未选时禁用所有
|
||||
if (!queryParam.value.SDate) return true;
|
||||
return !current.isSame(queryParam.value.SDate, 'month') ||
|
||||
current.isBefore(queryParam.value.SDate, 'day');
|
||||
if (!queryParam.value.SDateStr) return true;
|
||||
return !current.isSame(queryParam.value.SDateStr, 'month') ||
|
||||
current.isBefore(queryParam.value.SDateStr, 'day');
|
||||
}
|
||||
|
||||
// 开始日期变化时处理
|
||||
function handleStartChange(momentObj) {
|
||||
if (momentObj && queryParam.value.EDate &&
|
||||
!momentObj.isSame(queryParam.value.EDate, 'month')) {
|
||||
queryParam.value.EDate = null;
|
||||
if (momentObj && queryParam.value.EDateStr &&
|
||||
!momentObj.isSame(queryParam.value.EDateStr, 'month')) {
|
||||
queryParam.value.EDateStr = null;
|
||||
}
|
||||
}
|
||||
|
||||
// 结束日期变化时处理
|
||||
function handleEndChange(momentObj) {
|
||||
if (momentObj && queryParam.value.SDate &&
|
||||
!momentObj.isSame(queryParam.value.SDate, 'month')) {
|
||||
queryParam.value.SDate = null;
|
||||
if (momentObj && queryParam.value.SDateStr &&
|
||||
!momentObj.isSame(queryParam.value.SDateStr, 'month')) {
|
||||
queryParam.value.SDateStr = null;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getThermalcompany();
|
||||
getHeatsource();
|
||||
getHeatsourcestation();
|
||||
|
||||
onMounted(async() => {
|
||||
await getThermalcompany();
|
||||
await getHeatsource();
|
||||
await getHeatsourcestation();
|
||||
let list = thermalcompany.value;
|
||||
queryParam.value.view001 = list[0].id;
|
||||
queryParam.value.SDateStr = dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
watch(
|
||||
() => queryParam.value.SDate,
|
||||
() => queryParam.value.SDateStr,
|
||||
async (newVal) => {
|
||||
if (newVal && queryParam.value.EDate &&
|
||||
(!newVal.isSame(queryParam.value.EDate, 'month') || newVal > queryParam.value.EDate)) {
|
||||
queryParam.value.EDate = null;
|
||||
if (newVal && queryParam.value.EDateStr &&
|
||||
(!newVal.isSame(queryParam.value.EDateStr, 'month') || newVal > queryParam.value.EDateStr)) {
|
||||
queryParam.value.EDateStr = null;
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
// 更新 父部门 选项
|
||||
watch(
|
||||
() => queryParam.value.EDate,
|
||||
() => queryParam.value.EDateStr,
|
||||
async (newVal) => {
|
||||
if (newVal && queryParam.value.SDate &&
|
||||
(!newVal.isSame(queryParam.value.SDate, 'month') || newVal < queryParam.value.SDate)) {
|
||||
queryParam.value.SDate = null;
|
||||
if (newVal && queryParam.value.SDateStr &&
|
||||
(!newVal.isSame(queryParam.value.SDateStr, 'month') || newVal < queryParam.value.SDateStr)) {
|
||||
queryParam.value.SDateStr = null;
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
|
|
|
|||
|
|
@ -46,13 +46,13 @@
|
|||
</a-col>
|
||||
<a-col :lg="5">
|
||||
<a-form-item label="开始时间">
|
||||
<a-date-picker placeholder="请选择开始时间" v-model:value="queryParam.SDate" :disabledDate="startDisabledDate"
|
||||
<a-date-picker placeholder="请选择开始时间" v-model:value="queryParam.SDateStr" value-format="YYYY-MM-DD HH:mm:ss" :disabledDate="startDisabledDate"
|
||||
@change="handleStartChange" show-time style="width: 100%" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :lg="5">
|
||||
<a-form-item label="结束时间">
|
||||
<a-date-picker placeholder="请选择结束时间" v-model:value="queryParam.EDate" :disabledDate="endDisabledDate"
|
||||
<a-date-picker placeholder="请选择结束时间" v-model:value="queryParam.EDateStr" value-format="YYYY-MM-DD HH:mm:ss" :disabledDate="endDisabledDate"
|
||||
@change="handleEndChange" show-time style="width: 100%" allow-clear />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
|
@ -76,6 +76,7 @@ import {
|
|||
heatsourcestationlist,
|
||||
jxpage
|
||||
} from './HeatanalysisHistory.api';
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
const queryParam = ref<any>({});
|
||||
const toggleSearchStatus = ref<boolean>(false);
|
||||
|
|
@ -91,6 +92,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
|||
clickToRowSelect: false,
|
||||
showActionColumn: false,
|
||||
showIndexColumn: false,
|
||||
immediate: false,
|
||||
tableSetting: {
|
||||
// 是否显示刷新按钮
|
||||
redo: false,
|
||||
|
|
@ -135,23 +137,26 @@ function searchQuery() {
|
|||
/**
|
||||
* 重置
|
||||
*/
|
||||
function searchReset() {
|
||||
async function searchReset() {
|
||||
queryParam.value = {};
|
||||
selectedRowKeys.value = [];
|
||||
getHeatsource();
|
||||
getHeatsourcestation();
|
||||
await getHeatsource();
|
||||
await getHeatsourcestation();
|
||||
let list = thermalcompany.value;
|
||||
queryParam.value.view001 = list[0].id;
|
||||
queryParam.value.SDateStr = dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
//刷新数据
|
||||
reload();
|
||||
}
|
||||
|
||||
const thermalcompany = ref();
|
||||
async function getThermalcompany() {
|
||||
thermalcompany.value = await companylist();
|
||||
thermalcompany.value = await companylist({regionType: '乡镇'});
|
||||
}
|
||||
|
||||
const heatsource = ref();
|
||||
async function getHeatsource() {
|
||||
heatsource.value = await heatsourcelist();
|
||||
heatsource.value = await heatsourcelist({regionType: '乡镇'});
|
||||
}
|
||||
|
||||
const heatsourcestation = ref();
|
||||
|
|
@ -174,57 +179,59 @@ function handleChange3(record) {
|
|||
// 禁用开始日期的规则
|
||||
function startDisabledDate(current) {
|
||||
// 结束日期未选时不做限制
|
||||
if (!queryParam.value.EDate) return false;
|
||||
return !current.isSame(queryParam.value.EDate, 'month') ||
|
||||
current.isAfter(queryParam.value.EDate, 'day');
|
||||
if (!queryParam.value.EDateStr) return false;
|
||||
return !current.isSame(queryParam.value.EDateStr, 'month') ||
|
||||
current.isAfter(queryParam.value.EDateStr, 'day');
|
||||
}
|
||||
|
||||
// 禁用结束日期的规则
|
||||
function endDisabledDate(current) {
|
||||
// 开始日期未选时禁用所有
|
||||
if (!queryParam.value.SDate) return true;
|
||||
return !current.isSame(queryParam.value.SDate, 'month') ||
|
||||
current.isBefore(queryParam.value.SDate, 'day');
|
||||
if (!queryParam.value.SDateStr) return true;
|
||||
return !current.isSame(queryParam.value.SDateStr, 'month') ||
|
||||
current.isBefore(queryParam.value.SDateStr, 'day');
|
||||
}
|
||||
|
||||
// 开始日期变化时处理
|
||||
function handleStartChange(momentObj) {
|
||||
if (momentObj && queryParam.value.EDate &&
|
||||
!momentObj.isSame(queryParam.value.EDate, 'month')) {
|
||||
queryParam.value.EDate = null;
|
||||
if (momentObj && queryParam.value.EDateStr &&
|
||||
!momentObj.isSame(queryParam.value.EDateStr, 'month')) {
|
||||
queryParam.value.EDateStr = null;
|
||||
}
|
||||
}
|
||||
|
||||
// 结束日期变化时处理
|
||||
function handleEndChange(momentObj) {
|
||||
if (momentObj && queryParam.value.SDate &&
|
||||
!momentObj.isSame(queryParam.value.SDate, 'month')) {
|
||||
queryParam.value.SDate = null;
|
||||
if (momentObj && queryParam.value.SDateStr &&
|
||||
!momentObj.isSame(queryParam.value.SDateStr, 'month')) {
|
||||
queryParam.value.SDateStr = null;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getThermalcompany();
|
||||
getHeatsource();
|
||||
getHeatsourcestation();
|
||||
|
||||
onMounted(async() => {
|
||||
await getThermalcompany();
|
||||
await getHeatsource();
|
||||
await getHeatsourcestation();
|
||||
let list = thermalcompany.value;
|
||||
queryParam.value.view001 = list[0].id;
|
||||
queryParam.value.SDateStr = dayjs().format('YYYY-MM-DD HH:mm:ss');
|
||||
watch(
|
||||
() => queryParam.value.SDate,
|
||||
() => queryParam.value.SDateStr,
|
||||
async (newVal) => {
|
||||
if (newVal && queryParam.value.EDate &&
|
||||
(!newVal.isSame(queryParam.value.EDate, 'month') || newVal > queryParam.value.EDate)) {
|
||||
queryParam.value.EDate = null;
|
||||
if (newVal && queryParam.value.EDateStr &&
|
||||
(!newVal.isSame(queryParam.value.EDateStr, 'month') || newVal > queryParam.value.EDateStr)) {
|
||||
queryParam.value.EDateStr = null;
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
// 更新 父部门 选项
|
||||
watch(
|
||||
() => queryParam.value.EDate,
|
||||
() => queryParam.value.EDateStr,
|
||||
async (newVal) => {
|
||||
if (newVal && queryParam.value.SDate &&
|
||||
(!newVal.isSame(queryParam.value.SDate, 'month') || newVal < queryParam.value.SDate)) {
|
||||
queryParam.value.SDate = null;
|
||||
if (newVal && queryParam.value.SDateStr &&
|
||||
(!newVal.isSame(queryParam.value.SDateStr, 'month') || newVal < queryParam.value.SDateStr)) {
|
||||
queryParam.value.SDateStr = null;
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
|
|
|
|||
|
|
@ -9,8 +9,13 @@ enum Api {
|
|||
companylist = '/heating/thermalcompany/list',
|
||||
heatsourcelist = '/heating/heatsource/list',
|
||||
heatsourcestationlist = '/heating/heatsourcestation/list',
|
||||
exportXls = '/heating/heatanalysis/exportYunweiXls',
|
||||
}
|
||||
|
||||
/**
|
||||
* 导出api
|
||||
* @param params
|
||||
*/
|
||||
export const getExportUrl = Api.exportXls;
|
||||
/**
|
||||
* 列表接口
|
||||
* @param params
|
||||
|
|
|
|||
|
|
@ -122,13 +122,13 @@ export const columns: BasicColumn[] = [
|
|||
title: '热量',
|
||||
align:"center",
|
||||
width:120,
|
||||
dataIndex: 'view041',
|
||||
dataIndex: 'view044',
|
||||
},
|
||||
{
|
||||
title: '水流量',
|
||||
align:"center",
|
||||
width:120,
|
||||
dataIndex: 'view037'
|
||||
dataIndex: 'view040'
|
||||
},
|
||||
];
|
||||
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@
|
|||
<a-col :lg="6">
|
||||
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
|
||||
<a-button preIcon="ant-design:sync-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
|
||||
<a-button danger preIcon="ant-design:export-outlined" @click="onExportXls" style="margin-left: 8px">导出</a-button>
|
||||
</a-col>
|
||||
</span>
|
||||
</a-col>
|
||||
|
|
@ -102,7 +103,7 @@ import { ref, reactive, onMounted } from 'vue';
|
|||
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { columns } from './Heatanalysis.data';
|
||||
import { list, companylist, heatsourcelist, heatsourcestationlist } from './Heatanalysis.api';
|
||||
import { list, companylist, heatsourcelist, heatsourcestationlist, getExportUrl } from './Heatanalysis.api';
|
||||
import HeatanalysisReamrksListModal from './components/HeatanalysisReamrksListModal.vue'
|
||||
import ChangeLevelModal from './components/ChangeLevelModal.vue'
|
||||
|
||||
|
|
@ -139,6 +140,10 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
|||
return Object.assign(params, queryParam.value);
|
||||
},
|
||||
},
|
||||
exportConfig: {
|
||||
name: '运维数据列表',
|
||||
url: getExportUrl,
|
||||
},
|
||||
});
|
||||
const [registerTable, { reload, collapseAll, updateTableDataRecord, findTableDataRecord, getDataSource }, { rowSelection, selectedRowKeys }] = tableContext;
|
||||
const labelCol = reactive({
|
||||
|
|
@ -244,7 +249,6 @@ onMounted(() => {
|
|||
getHeatsourcestation();
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
|
|
|||
|
|
@ -218,7 +218,7 @@
|
|||
<div>
|
||||
<a-row style="line-height: 50px;margin-bottom: 20px;">
|
||||
<a-col :span="6" style="text-align: center;">
|
||||
<span style="color:white;font-size:16px;">供热公司： </span>
|
||||
<span style="color:white;font-size:16px;">供热公司： </span>
|
||||
<a-select placeholder="请选择供热公司" v-model:value="queryParam.view001" style="width: 150px"
|
||||
@focus="focus" @change="handleChange1">
|
||||
<a-select-option value="">全部</a-select-option>
|
||||
|
|
@ -227,7 +227,7 @@
|
|||
</a-select>
|
||||
</a-col>
|
||||
<a-col :span="6" style="text-align: center;">
|
||||
<span style="color:white;font-size:16px;">锅炉房： </span>
|
||||
<span style="color:white;font-size:16px;">锅炉房： </span>
|
||||
<a-select placeholder="请选择锅炉房" v-model:value="queryParam.view002" style="width: 150px"
|
||||
@focus="focus" @change="handleChange2">
|
||||
<a-select-option value="">全部</a-select-option>
|
||||
|
|
@ -236,7 +236,7 @@
|
|||
</a-select>
|
||||
</a-col>
|
||||
<a-col :span="6" style="text-align: center;">
|
||||
<span style="color:white;font-size:16px;">换热站： </span>
|
||||
<span style="color:white;font-size:16px;">换热站： </span>
|
||||
<a-select ref="select" placeholder="请选择换热站" v-model:value="queryParam.view004" style="width: 250px"
|
||||
@focus="focus" >
|
||||
<a-select-option value="">全部</a-select-option>
|
||||
|
|
@ -429,7 +429,7 @@ async function handleChange2(record) {
|
|||
function handleChange3(record) {
|
||||
}
|
||||
|
||||
function searchGrgsQuery() {
|
||||
function searchGrgsQuery() {
|
||||
queryParam.value.pageSize = -1;
|
||||
defHttp.get({url: '/heating/heatanalysis/page', params: queryParam.value}).then(res => {
|
||||
modalCqData.value = res.records;
|
||||
|
|
@ -509,7 +509,7 @@ function updateChartMain() {
|
|||
handleChange2(data.view002);
|
||||
searchGrgsQuery();
|
||||
},200)
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
|
@ -624,12 +624,12 @@ function updateChartCounty() {
|
|||
const maxVal = values1.length ? Math.max(...values1) : 100;
|
||||
|
||||
chartCounty.setOption({
|
||||
grid: {
|
||||
left: 10,
|
||||
grid: {
|
||||
left: 10,
|
||||
right: 120, // 增加右侧空间以容纳两个标签
|
||||
bottom: 8,
|
||||
top: 18,
|
||||
containLabel: true
|
||||
bottom: 8,
|
||||
top: 18,
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
|
|
@ -661,9 +661,9 @@ function updateChartCounty() {
|
|||
yAxis: {
|
||||
type: 'category',
|
||||
data: names,
|
||||
axisLabel: {
|
||||
color: jbztys.value,
|
||||
interval: 0,
|
||||
axisLabel: {
|
||||
color: jbztys.value,
|
||||
interval: 0,
|
||||
fontSize: 12, // 稍微减小字体以适应更多内容
|
||||
margin: 0 // 减少边距
|
||||
},
|
||||
|
|
@ -672,86 +672,86 @@ function updateChartCounty() {
|
|||
},
|
||||
series: [
|
||||
// 背景条
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 10,
|
||||
data: names.map(() => maxVal),
|
||||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
colorStops: [{ offset: 0, color: 'rgba(106,211,255,0.06)' }, { offset: 1, color: 'rgba(106,211,255,0.01)' }]
|
||||
}
|
||||
},
|
||||
z: 1,
|
||||
silent: true
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 10,
|
||||
data: names.map(() => maxVal),
|
||||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
colorStops: [{ offset: 0, color: 'rgba(106,211,255,0.06)' }, { offset: 1, color: 'rgba(106,211,255,0.01)' }]
|
||||
}
|
||||
},
|
||||
z: 1,
|
||||
silent: true
|
||||
},
|
||||
|
||||
|
||||
// 第一个主体条（供水温度）- 左侧柱子
|
||||
{
|
||||
type: 'bar',
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 8, // 减小宽度
|
||||
barGap: '30%', // 设置柱子间距
|
||||
data: values1.map((val, index) => ({
|
||||
value: val,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
colorStops: [{ offset: 0, color: '#ECA924' }, { offset: 1, color: '#0D9FD8' }]
|
||||
}
|
||||
}
|
||||
})),
|
||||
itemStyle: {
|
||||
opacity: 0.95
|
||||
},
|
||||
z: 2
|
||||
})),
|
||||
itemStyle: {
|
||||
opacity: 0.95
|
||||
},
|
||||
z: 2
|
||||
},
|
||||
|
||||
|
||||
// 第二个主体条（回水温度）- 右侧柱子
|
||||
{
|
||||
type: 'bar',
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 8, // 减小宽度
|
||||
barGap: '30%', // 设置柱子间距
|
||||
data: values2.map((val, index) => ({
|
||||
value: val,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
type: 'linear',
|
||||
x: 0, y: 0, x2: 1, y2: 0,
|
||||
colorStops: [{ offset: 0, color: '#FF6B6B' }, { offset: 1, color: '#4ECDC4' }]
|
||||
}
|
||||
}
|
||||
})),
|
||||
itemStyle: {
|
||||
opacity: 0.95
|
||||
},
|
||||
z: 3
|
||||
})),
|
||||
itemStyle: {
|
||||
opacity: 0.95
|
||||
},
|
||||
z: 3
|
||||
},
|
||||
|
||||
|
||||
// // 第一个顶部小图片（供水温度）
|
||||
{
|
||||
type: 'pictorialBar',
|
||||
symbol: `image://${lqImg}`,
|
||||
{
|
||||
type: 'pictorialBar',
|
||||
symbol: `image://${lqImg}`,
|
||||
symbolSize: [25, 25], // 减小图标大小
|
||||
symbolOffset: [11, -4], // 向左偏移，放在左侧柱子顶部
|
||||
symbolPosition: 'end',
|
||||
data: values1,
|
||||
z: 4,
|
||||
silent: true
|
||||
symbolPosition: 'end',
|
||||
data: values1,
|
||||
z: 4,
|
||||
silent: true
|
||||
},
|
||||
|
||||
|
||||
// 第二个顶部小图片（回水温度）
|
||||
{
|
||||
type: 'pictorialBar',
|
||||
symbol: `image://${lqImg}`,
|
||||
{
|
||||
type: 'pictorialBar',
|
||||
symbol: `image://${lqImg}`,
|
||||
symbolSize: [25, 25], // 减小图标大小
|
||||
symbolOffset: [13, 6], // 向右偏移，放在右侧柱子顶部
|
||||
symbolPosition: 'end',
|
||||
data: values2,
|
||||
z: 5,
|
||||
silent: true
|
||||
symbolPosition: 'end',
|
||||
data: values2,
|
||||
z: 5,
|
||||
silent: true
|
||||
},
|
||||
|
||||
// 第一个标签（供水温度）- 左侧标签
|
||||
|
|
@ -790,7 +790,7 @@ function updateChartCounty() {
|
|||
z: 6,
|
||||
silent: true
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
}, true);
|
||||
|
||||
|
|
@ -802,12 +802,12 @@ function updateChartCounty() {
|
|||
// area-7 的雷达图更新函数
|
||||
function updateRadarChart() {
|
||||
if (!chartRadar) return;
|
||||
|
||||
|
||||
// 获取数据
|
||||
const names = countyList.value.map(i => i.raw?.view028.replace('锅炉房', '') + '\n' + i.raw?.view007+"-"+i.raw?.view008);
|
||||
const values1 = countyList.value.map(i => (i.raw?.view007 ? Number(i.raw.view007) : 0));
|
||||
const values2 = countyList.value.map(i => (i.raw?.view008 ? Number(i.raw.view008) : 0)); // 假设 view038 是第二个数据集
|
||||
|
||||
|
||||
// 计算最大值
|
||||
const maxVal = Math.max(...values1, ...values2) * 1.15 || 100;
|
||||
|
||||
|
|
@ -884,15 +884,15 @@ function updateRadarChart() {
|
|||
}
|
||||
},
|
||||
itemStyle: { color: 'rgba(0,255,255,0.8)' },
|
||||
data: [{
|
||||
value: values1,
|
||||
name: '供水压力',
|
||||
symbol: 'none',
|
||||
symbolSize: 6,
|
||||
lineStyle: { width: 2, color: 'rgba(9,147,149,0.8)' }
|
||||
data: [{
|
||||
value: values1,
|
||||
name: '供水压力',
|
||||
symbol: 'none',
|
||||
symbolSize: 6,
|
||||
lineStyle: { width: 2, color: 'rgba(9,147,149,0.8)' }
|
||||
}]
|
||||
},
|
||||
|
||||
|
||||
// 第二个雷达图（累计流量）
|
||||
{
|
||||
name: '回水压力',
|
||||
|
|
@ -913,12 +913,12 @@ function updateRadarChart() {
|
|||
}
|
||||
},
|
||||
itemStyle: { color: 'rgba(255,165,0,0.8)' },
|
||||
data: [{
|
||||
value: values2,
|
||||
name: '回水压力',
|
||||
symbol: 'none',
|
||||
symbolSize: 6,
|
||||
lineStyle: { width: 2, color: 'rgba(255,165,0,0.8)' }
|
||||
data: [{
|
||||
value: values2,
|
||||
name: '回水压力',
|
||||
symbol: 'none',
|
||||
symbolSize: 6,
|
||||
lineStyle: { width: 2, color: 'rgba(255,165,0,0.8)' }
|
||||
}]
|
||||
}
|
||||
]
|
||||
|
|
@ -1102,7 +1102,7 @@ function updateChartArea82() {
|
|||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '焦耳',
|
||||
name: 'GJ',
|
||||
nameLocation: 'end',
|
||||
nameTextStyle: {
|
||||
color: '#ffffff',
|
||||
|
|
@ -1311,16 +1311,16 @@ function filterSongshanData(data) {
|
|||
// 分离松山数据和其他数据
|
||||
const songshanData = data.filter(item => item.raw.view027 === "松山");
|
||||
const otherData = data.filter(item => item.raw.view027 !== "松山");
|
||||
|
||||
|
||||
// 对松山数据按 view035 降序排序，取最大值的那条
|
||||
if (songshanData.length > 0) {
|
||||
songshanData.sort((a, b) => Number(b.raw.view035) - Number(a.raw.view035));
|
||||
const maxSongshan = songshanData[0];
|
||||
|
||||
|
||||
// 返回其他数据 + 松山最大值数据
|
||||
return [...otherData, maxSongshan];
|
||||
}
|
||||
|
||||
|
||||
// 如果没有松山数据，直接返回原数据
|
||||
return data;
|
||||
}
|
||||
|
|
@ -1329,7 +1329,7 @@ function sumSongshanData(data) {
|
|||
// 分离松山数据和其他数据
|
||||
const songshanData = data.filter(item => item.raw.view027 === "松山");
|
||||
const otherData = data.filter(item => item.raw.view027 !== "松山");
|
||||
|
||||
|
||||
// 对松山数据按 view035 降序排序，取最大值的那条
|
||||
if (songshanData.length > 0) {
|
||||
songshanData.sort((a, b) => Number(b.raw.view035) - Number(a.raw.view035));
|
||||
|
|
@ -1343,11 +1343,11 @@ function sumSongshanData(data) {
|
|||
}
|
||||
maxSongshan.view038 = sumView038;
|
||||
maxSongshan.view042 = sumView042;
|
||||
|
||||
|
||||
// 返回其他数据 + 松山最大值数据
|
||||
return [...otherData, maxSongshan];
|
||||
}
|
||||
|
||||
|
||||
// 如果没有松山数据，直接返回原数据
|
||||
return data;
|
||||
}
|
||||
|
|
@ -1386,8 +1386,10 @@ async function loadData() {
|
|||
});
|
||||
|
||||
cityList.value = cities;
|
||||
countyList.value = filterSongshanData(countys);
|
||||
countyAddList.value = sumSongshanData(countys);
|
||||
// countyList.value = filterSongshanData(countys);
|
||||
countyList.value = countys;
|
||||
// countyAddList.value = sumSongshanData(countys);
|
||||
countyAddList.value = countys;
|
||||
//
|
||||
const arr2 = (z_ && z_.data) ? z_.data : [];
|
||||
const cities2: { name: string; value: number; raw: any }[] = [];
|
||||
|
|
|
|||
|
|
@ -70,10 +70,9 @@ function buildXAxis(records: any[], key = 'view028') {
|
|||
/* ---- build options（折线改为直线 smooth: false） ---- */
|
||||
function prepareOptions(records: any[]) {
|
||||
const { city } = splitByRegion(records);
|
||||
|
||||
const cityX = buildXAxis(city, 'datatime');
|
||||
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' },
|
||||
|
|
|
|||
|
|
@ -72,16 +72,16 @@ function prepareOptions(records: any[]) {
|
|||
const { city } = splitByRegion(records);
|
||||
|
||||
const cityX = buildXAxis(city, 'datatime');
|
||||
const citySW = city.map((r: any) => safeNum(r.view037));
|
||||
const citySW = city.map((r: any) => safeNum(r.view041));
|
||||
cityOption = {
|
||||
title: { text: '乡镇锅炉房历史热流量', left: 'center', top: 10 },
|
||||
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: 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' } },
|
||||
{ name: '热量', type: 'line', data: citySW, smooth: false, showSymbol: false, lineStyle: { type: 'solid' } },
|
||||
],
|
||||
color: ['#176AB3', '#2F9E8A'] // 更稳重的直线配色
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue