zhaohy 1 month ago
parent
commit
bb792158d8
  1. 4
      hx-ai-intelligent/src/view/monitor/deviceMonitor/graph/index.vue
  2. 2
      hx-ai-intelligent/src/view/monitor/deviceMonitor/table/index.vue
  3. 33
      hx-ai-intelligent/src/view/monitor/deviceMonitor/tree/index.vue
  4. 7
      hx-ai-intelligent/src/view/monitor/energyMonitor/analysisTable/index.vue
  5. 2
      hx-ai-intelligent/src/view/monitor/energyMonitor/graphTable/index.vue
  6. 59
      hx-ai-intelligent/src/view/monitor/environmentMonitor/aggregateData/index.vue
  7. 7
      hx-ai-intelligent/src/view/monitor/environmentMonitor/averageData/index.vue
  8. 15
      hx-ai-intelligent/src/view/monitor/environmentMonitor/historyData/index.vue
  9. 17
      hx-ai-intelligent/src/view/monitor/environmentMonitor/index.vue

4
hx-ai-intelligent/src/view/monitor/deviceMonitor/graph/index.vue

@ -77,7 +77,7 @@
grid: { grid: {
top: 60, // top: 60, //
bottom: 40, // bottom: 40, //
left: 10, // left: 50, //
right: 60, // right: 60, //
containLabel: true, // grid containLabel: true, // grid
}, },
@ -85,7 +85,7 @@
data: legendList, data: legendList,
orient: 'horizontal', orient: 'horizontal',
top: 30, top: 30,
right: 130, right: 55,
icon: 'rect', icon: 'rect',
}, },
tooltip: { tooltip: {

2
hx-ai-intelligent/src/view/monitor/deviceMonitor/table/index.vue

@ -4,7 +4,7 @@
:data-source="data" :data-source="data"
bordered bordered
:pagination="false" :pagination="false"
style="width: 99%; height: 75%" style="width: 99%; height: 75%; margin-left: 0.5%"
:scroll="{ x: 2000, y: 450 }" /> :scroll="{ x: 2000, y: 450 }" />
<a-pagination <a-pagination
:total="total" :total="total"

33
hx-ai-intelligent/src/view/monitor/deviceMonitor/tree/index.vue

@ -11,7 +11,6 @@
style="width: 100%" style="width: 100%"
:tree-line="treeLine && { showLeafIcon }" :tree-line="treeLine && { showLeafIcon }"
:tree-data="treeData1" :tree-data="treeData1"
allowClear
@change="changeDeviceType" /> @change="changeDeviceType" />
<a-spin :spinning="treeLoading"> <a-spin :spinning="treeLoading">
@ -124,6 +123,18 @@
http.post(device.queryDeviceTree, { orgId: orgId.value }).then((res) => { http.post(device.queryDeviceTree, { orgId: orgId.value }).then((res) => {
treeData1.value = formatTreeData(res.data); treeData1.value = formatTreeData(res.data);
if (treeData1.value && treeData1.value.length > 0) {
if (treeData1.value[0].children) {
value.value = treeData1.value[0].children[0].value;
changeDeviceType(treeData1.value[0].children[0].value, [
treeData1.value[0].children[0].title,
]);
} else {
value.value = treeData1.value[0].value;
changeDeviceType(treeData1.value[0].value, [treeData1.value[0].title]);
}
}
}); });
const formatTreeData = (data: any) => { const formatTreeData = (data: any) => {
@ -207,10 +218,16 @@
throw new Error('pageData is not provided'); throw new Error('pageData is not provided');
} }
const getDianWeiList = () => { const getDianWeiList = () => {
let deviceIds: any[] = [];
if (checkedKeys.value && checkedKeys.value.length > 0) { if (checkedKeys.value && checkedKeys.value.length > 0) {
checkedKeys.value.forEach((element) => {
if (value.value != element) {
deviceIds.push(element);
}
});
http http
.post(deviceMonitor.getDevicePointToMonitor, { .post(deviceMonitor.getDevicePointToMonitor, {
deviceIds: checkedKeys.value, deviceIds: deviceIds,
orgId: orgId.value, orgId: orgId.value,
type: 0, type: 0,
}) })
@ -259,9 +276,17 @@
startDate.value = year + '-' + month + '-' + day; startDate.value = year + '-' + month + '-' + day;
endDate.value = year + '-' + month + '-' + day; endDate.value = year + '-' + month + '-' + day;
} }
let deviceIds: any[] = [];
if (checkedKeys.value && checkedKeys.value.length > 0) {
checkedKeys.value.forEach((element) => {
if (value.value != element) {
deviceIds.push(element);
}
});
}
http http
.post(deviceMonitor.getDeviceGraph, { .post(deviceMonitor.getDeviceGraph, {
deviceIds: checkedKeys.value, deviceIds: deviceIds,
devicePointCode: selectedValue.value, devicePointCode: selectedValue.value,
endDate: endDate.value, endDate: endDate.value,
@ -323,7 +348,7 @@
if (options2.value && options2.value.length > 0) { if (options2.value && options2.value.length > 0) {
frequencyValue.value = options2.value[options2.value.length - 1].value; frequencyValue.value = options2.value[options2.value.length - 1].value;
} }
changeDeviceType(null, null); // changeDeviceType(null, null);
// getSelect(); // getSelect();
}); });
// //

7
hx-ai-intelligent/src/view/monitor/energyMonitor/analysisTable/index.vue

@ -5,7 +5,8 @@
:data-source="data" :data-source="data"
bordered bordered
:pagination="false" :pagination="false"
:row-selection="rowSelection"> :row-selection="rowSelection"
style="width: 99%; margin-left: 0.5%">
<template #bodyCell="{ column, record }"> <template #bodyCell="{ column, record }">
<template v-if="column.title === '操作'"> <template v-if="column.title === '操作'">
<a-button type="link" @click="setStandard(record)" v-if="record.id != selectedKey[0]" <a-button type="link" @click="setStandard(record)" v-if="record.id != selectedKey[0]"
@ -123,7 +124,9 @@
(_newValue, _oldValue) => { (_newValue, _oldValue) => {
// //
data.value = JSON.parse(JSON.stringify(pageData.analysisTableList)); data.value = JSON.parse(JSON.stringify(pageData.analysisTableList));
if (data.value.length != 0) {
setStandard(data.value[0]); setStandard(data.value[0]);
}
}, },
{ deep: true }, { deep: true },
); );
@ -131,7 +134,9 @@
// //
data.value = JSON.parse(JSON.stringify(pageData.analysisTableList)); data.value = JSON.parse(JSON.stringify(pageData.analysisTableList));
// selectedKey.value = [data.value[0]]; // selectedKey.value = [data.value[0]];
if (data.value.length != 0) {
setStandard(data.value[0]); setStandard(data.value[0]);
}
}); });
const setStandard = (record: any) => { const setStandard = (record: any) => {
selectedKey.value = [record.id]; selectedKey.value = [record.id];

2
hx-ai-intelligent/src/view/monitor/energyMonitor/graphTable/index.vue

@ -3,7 +3,7 @@
:columns="columns" :columns="columns"
:data-source="data" :data-source="data"
bordered bordered
style="width: 100%; height: 90%" style="width: 99%; height: 90%; margin-left: 0.5%"
:pagination="false" :pagination="false"
:scroll="{ x: '2000' }" /> :scroll="{ x: '2000' }" />
<a-pagination <a-pagination

59
hx-ai-intelligent/src/view/monitor/environmentMonitor/aggregateData/index.vue

@ -1,12 +1,12 @@
<!-- eslint-disable vue/multi-word-component-names --> <!-- eslint-disable vue/multi-word-component-names -->
<template> <template>
<!-- <a-spin :spinning="loading"> --> <!-- <a-spin :spinning="loading"> -->
<a-row type="flex" style="height: 100%; width: 96%; margin: 2%"> <a-row type="flex" style="height: 100%; width: 96%; margin-left: 1.5%; margin-top: 1%">
<a-col :span="6"> <a-col :span="6">
<!-- <div style="height: 96%; margin: 2%"> --> <!-- <div style="height: 96%; margin: 2%"> -->
<div <div
style=" style="
height: 35%; height: 38%;
width: 100%; width: 100%;
padding: 2%; padding: 2%;
box-shadow: 0 0 15px rgba(69, 123, 234, 0.2); box-shadow: 0 0 15px rgba(69, 123, 234, 0.2);
@ -22,15 +22,17 @@
<!-- <div ref="ringChartRef" style="width: 50%; height: 80%"></div> --> <!-- <div ref="ringChartRef" style="width: 50%; height: 80%"></div> -->
<div <div
style=" style="
height: 40%; height: 35%;
background: #f3fbf9; background: #f3fbf9;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
border-radius: 12px;
margin-bottom: 2%;
"> ">
<ns-icon name="xianshiqi" size="30" style="margin-right: 30px" /> <ns-icon name="xianshiqi" size="30" style="margin-right: 30px" />
<div style="height: 100%; display: flex"> <div style="height: 100%; display: flex">
<div style="display: inline-flex; align-items: flex-end; height: 75%">设备总计</div> <div style="display: inline-flex; align-items: flex-end; height: 80%">设备总计</div>
<div <div
style=" style="
font-size: 46px; font-size: 46px;
@ -38,17 +40,22 @@
letter-spacing: 2.76px; letter-spacing: 2.76px;
color: rgba(22, 178, 136, 1); color: rgba(22, 178, 136, 1);
text-align: center; text-align: center;
height: 75%; display: inline-flex;
align-items: flex-end;
height: 95%;
" "
>{{ sum }}</div >{{ sum }}</div
> >
<div style="display: inline-flex; align-items: flex-end; height: 75%"></div> <div style="display: inline-flex; align-items: flex-end; height: 80%"></div>
</div> </div>
</div> </div>
<div style="width: 100%; height: 60%"> <div style="width: 100%; height: 60%; margin-top: 6%">
<div v-for="(item, index) in ringData" :key="index"> <div v-for="(item, index) in ringData" :key="index">
{{ item.name }} : {{ item.value }} {{ item.unit }} {{ item.name }} : {{ item.value }} {{ item.unit }}
<a-progress :percent="(100 * item.value) / sum" :show-info="false" /> <a-progress
:percent="(100 * item.value) / sum"
:show-info="false"
:strokeWidth="15" />
</div> </div>
</div> </div>
</div> </div>
@ -56,7 +63,7 @@
<div <div
style=" style="
height: 62%; height: 59%;
margin-top: 4%; margin-top: 4%;
padding: 2%; padding: 2%;
box-shadow: 0 0 15px rgba(69, 123, 234, 0.2); box-shadow: 0 0 15px rgba(69, 123, 234, 0.2);
@ -68,15 +75,15 @@
<div style="height: 10%">平均值</div> <div style="height: 10%">平均值</div>
</div> </div>
<div style="display: flex; display: flex; flex-wrap: wrap; width: 100%; height: 100%"> <div style="display: flex; flex-wrap: wrap; width: 100%; height: 92%">
<div v-for="(item, index) in averageData" :key="index" style="width: 33%; height: 45%"> <div v-for="(item, index) in averageData" :key="index" style="width: 33%; height: 49%">
<div <div
style=" style="
height: 90%; height: 97%;
margin: 0 5%; margin: 0 5% 1.5% 5%;
border-radius: 10px; border-radius: 10px;
background-color: rgba(67, 136, 251, 0.09803921568627451); background-color: #f5fafd;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@ -89,6 +96,7 @@
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
font-size: 14px; font-size: 14px;
padding-top: 5px;
" "
>{{ item.name }}</div >{{ item.name }}</div
> >
@ -99,6 +107,7 @@
font-style: normal; font-style: normal;
color: #ea7000; color: #ea7000;
text-align: center; text-align: center;
padding-top: 5px;
" "
>{{ item.value }}</div >{{ item.value }}</div
> >
@ -110,6 +119,7 @@
font-size: 10px; font-size: 10px;
color: #7f7f7f; color: #7f7f7f;
text-align: center; text-align: center;
padding-top: 5px;
" "
>{{ item.unit }}</div >{{ item.unit }}</div
> >
@ -131,8 +141,8 @@
border-radius: 10px; border-radius: 10px;
background: #ffffff; background: #ffffff;
"> ">
<div style="width: 100%; display: flex"> <div style="width: 100%; display: flex; align-items: center">
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px" /> <ns-icon name="zongheshuju" size="30" style="margin-right: 3px; margin-top: 8px" />
<div style="width: 20%">环境指数分析</div> <div style="width: 20%">环境指数分析</div>
<div style="width: 80%; float: right; padding-right: 40px"> <div style="width: 80%; float: right; padding-right: 40px">
<a-select <a-select
@ -143,7 +153,7 @@
<!-- {{ quyuvalue }} {{ defaultValues }} --> <!-- {{ quyuvalue }} {{ defaultValues }} -->
<a-tree-select <a-tree-select
v-model:value="quyuvalue" v-model:value="quyuvalue"
style="width: 35%; margin-left: 10px" style="width: 34%; margin-left: 10px"
:tree-data="treeData2" :tree-data="treeData2"
show-checked-strategy="SHOW_CHILD" show-checked-strategy="SHOW_CHILD"
:default-value="defaultValues" :default-value="defaultValues"
@ -160,7 +170,7 @@
<a-select <a-select
v-model:value="frequencyValue" v-model:value="frequencyValue"
placeholder="请选择采集频率" placeholder="请选择采集频率"
style="width: 10%; margin-left: 10px" style="width: 12%; margin-left: 10px"
:options="frequencyOptions" /> :options="frequencyOptions" />
<a-date-picker style="width: 20%; margin-left: 10px" v-model:value="timeValue" /> <a-date-picker style="width: 20%; margin-left: 10px" v-model:value="timeValue" />
@ -803,4 +813,17 @@
:deep(.ant-spin-nested-loading) { :deep(.ant-spin-nested-loading) {
height: 100% !important; height: 100% !important;
} }
// /* a-progress */
// ::v-deep .ant-progress-bg {
// // border-radius: 1px !important; /* */
// stroke-linecap: butt !important; /* 使 "butt" */
// }
/* 修改 a-progress 进度条的圆角 */
::v-deep .ant-progress-inner {
border-radius: 4px !important; /* 整个进度条容器的圆角 */
}
::v-deep .ant-progress-bg {
border-radius: 4px !important; /* 进度条本身的圆角 */
}
</style> </style>

7
hx-ai-intelligent/src/view/monitor/environmentMonitor/averageData/index.vue

@ -38,7 +38,9 @@
查询 查询
</a-button> </a-button>
</div> </div>
<a-button type="primary"> 导出 </a-button> <a-button type="primary" style="position: absolute; right: 40px; top: -45px">
导出
</a-button>
</div> </div>
</template> </template>
</a-table> </a-table>
@ -228,4 +230,7 @@
td.column-money { td.column-money {
text-align: right !important; text-align: right !important;
} }
::v-deep .ant-table.ant-table-bordered > .ant-table-title {
border: none !important;
}
</style> </style>

15
hx-ai-intelligent/src/view/monitor/environmentMonitor/historyData/index.vue

@ -11,7 +11,13 @@
:scroll="{ x: 3000, y: 440 }"> :scroll="{ x: 3000, y: 440 }">
<template #title> <template #title>
<div <div
style="display: flex; align-items: center; justify-content: space-between; width: 100%"> style="
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
border-top: 0 !important;
">
<div style="display: flex; align-items: center; width: 85%"> <div style="display: flex; align-items: center; width: 85%">
<div style="width: 10%" <div style="width: 10%"
><ns-icon name="title" size="11" style="margin-right: 3px" />数据报表</div ><ns-icon name="title" size="11" style="margin-right: 3px" />数据报表</div
@ -53,7 +59,9 @@
查询 查询
</a-button> </a-button>
</div> </div>
<a-button type="primary"> 导出 </a-button> <a-button type="primary" style="position: absolute; right: 40px; top: -45px">
导出
</a-button>
</div> </div>
</template> </template>
</a-table> </a-table>
@ -370,4 +378,7 @@
td.column-money { td.column-money {
text-align: right !important; text-align: right !important;
} }
::v-deep .ant-table.ant-table-bordered > .ant-table-title {
border: none !important;
}
</style> </style>

17
hx-ai-intelligent/src/view/monitor/environmentMonitor/index.vue

@ -3,7 +3,14 @@
<div style="display: flex"> <div style="display: flex">
<a-tabs <a-tabs
v-model:activeKey="activeKey" v-model:activeKey="activeKey"
style="height: 5%; width: 100%; margin-top: 0.5%; background: #ffffff"> style="
height: 5%;
width: 98.5%;
margin-top: 0.5%;
padding-left: 1.5%;
background: #ffffff;
font-family: 'PingFangSC-Regular', sans-serif;
">
<a-tab-pane key="1" tab="综合数据" /> <a-tab-pane key="1" tab="综合数据" />
<a-tab-pane key="2" tab="历史数据" /> <a-tab-pane key="2" tab="历史数据" />
<a-tab-pane key="3" tab="平均数据" /> <a-tab-pane key="3" tab="平均数据" />
@ -11,7 +18,8 @@
<a-button <a-button
type="primary" type="primary"
style="position: absolute; margin-right: 30px; margin-top: 10px; right: 30px" style="position: absolute; margin-right: 30px; margin-top: 10px; right: 30px"
@click="configurePoint"> @click="configurePoint"
v-if="activeKey == '1'">
配置监测点位 配置监测点位
</a-button> </a-button>
</div> </div>
@ -236,7 +244,6 @@
}; };
// //
const updateShowed = (record: any) => { const updateShowed = (record: any) => {
debugger;
let url = ''; let url = '';
if (record.useFlag == 0) { if (record.useFlag == 0) {
record.useFlag = 1; record.useFlag = 1;
@ -253,7 +260,7 @@
}, },
]; ];
http.post(url, params).then((res) => { http.post(url, params).then((res) => {
debugger; console.log('🚀 ~ http.post ~ res:', res);
}); });
}; };
// //
@ -448,7 +455,7 @@
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
::v-deep .ant-tabs-tab { ::v-deep .ant-tabs-tab {
font-weight: bold; /* 选中标签的加粗 */ font-weight: 700; /* 选中标签的加粗 */
// font-size: 16px; // font-size: 16px;
// letter-spacing: 1.33px; // letter-spacing: 1.33px;
color: #666666 !important; color: #666666 !important;

Loading…
Cancel
Save