Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp
This commit is contained in:
@@ -6,7 +6,7 @@
|
||||
<tree ref="treeRef" />
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="20">
|
||||
<a-col :span="20" style="height: 100%">
|
||||
<div
|
||||
style="
|
||||
width: 98%;
|
||||
@@ -16,14 +16,15 @@
|
||||
margin-left: 1.5%;
|
||||
">
|
||||
<div class="ns-right-title">
|
||||
<span><ns-icon name="title" size="11" style="margin-right: 3px" />历史数据</span>
|
||||
<!-- <span><ns-icon name="title" size="11" style="margin-right: 3px" />历史数据</span> -->
|
||||
<div class="title">历史数据</div>
|
||||
<div class="button">
|
||||
<ns-icon name="xiazai" size="18" style="margin-right: 10px" @click="downloadChart" />
|
||||
<ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
|
||||
</div>
|
||||
</div>
|
||||
<graph ref="graphRef" v-if="isGraph" />
|
||||
<environment-table ref="tableRef" style="width: 100%" v-else />
|
||||
<environment-table ref="tableRef" style="height: 83%" v-else />
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
@@ -89,4 +90,25 @@
|
||||
display: inline-block;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
</style>
|
||||
|
@@ -1,18 +1,27 @@
|
||||
<template>
|
||||
<div style="width: 100%; overflow-y: auto">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
:pagination="false"
|
||||
style="width: 99%; height: 75%; margin-left: 0.5%"
|
||||
:scroll="{ x: x, y: 450 }" />
|
||||
style="width: 99%; margin-left: 0.5%"
|
||||
:scroll="{ x: x }" />
|
||||
<a-pagination
|
||||
:total="total"
|
||||
:show-total="(total, range) => ` 共 ${total} 条`"
|
||||
size="small"
|
||||
:show-total="(total, range) => `显示第${range[0]}到${range[1]}条记录 ,共${total} 条记录`"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
@change="onChange"
|
||||
style="display: flex; justify-content: right; margin-top: 10px; margin-right: 30px" />
|
||||
style="
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
margin-top: 10px;
|
||||
margin-right: 30px;
|
||||
padding-bottom: 10px;
|
||||
" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -268,7 +277,7 @@
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
::v-deep .ant-table-container table > thead > tr:first-child th:last-child {
|
||||
display: none !important;
|
||||
}
|
||||
// ::v-deep .ant-table-container table > thead > tr:first-child th:last-child {
|
||||
// display: none !important;
|
||||
// }
|
||||
</style>
|
||||
|
@@ -2,8 +2,8 @@
|
||||
<template>
|
||||
<div class="parent-container">
|
||||
<div class="ns-tree-title">
|
||||
<ns-icon name="deviceType" size="11" style="margin-right: 3px" />
|
||||
<span>设备列表</span>
|
||||
<ns-icon name="deviceType" size="11" style="margin-top: 10px" />
|
||||
<div class="title">设备列表</div>
|
||||
</div>
|
||||
<a-tree-select
|
||||
ref="select"
|
||||
@@ -83,6 +83,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { message } from 'ant-design-vue';
|
||||
import type { TreeSelectProps, SelectProps } from 'ant-design-vue';
|
||||
import { defineComponent, ref, onMounted, onUnmounted, watch } from 'vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
@@ -228,12 +229,14 @@
|
||||
const getDianWeiList = () => {
|
||||
let deviceIds: any[] = [];
|
||||
if (checkedKeys.value && checkedKeys.value.length > 0) {
|
||||
debugger;
|
||||
checkedKeys.value.forEach((element) => {
|
||||
if (value.value != element && value.value != '999999999') {
|
||||
deviceIds.push(element);
|
||||
}
|
||||
});
|
||||
if (deviceIds.length == 0) {
|
||||
return;
|
||||
}
|
||||
http
|
||||
.post(deviceMonitor.getDevicePointToMonitor, {
|
||||
deviceIds: deviceIds,
|
||||
@@ -275,6 +278,11 @@
|
||||
|
||||
// 查询数据后放入pageData
|
||||
const getSelect = () => {
|
||||
pageData.tableList = [];
|
||||
pageData.tableColumns = [];
|
||||
|
||||
pageData.graphList = [];
|
||||
pageData.XData = [];
|
||||
if (!startDate.value || !endDate.value) {
|
||||
// 获取当天的时间
|
||||
const today = new Date();
|
||||
@@ -293,6 +301,10 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
if (deviceIds.length == 0) {
|
||||
message.warning('请先选择设备!');
|
||||
return;
|
||||
}
|
||||
http
|
||||
.post(deviceMonitor.getDeviceGraph, {
|
||||
deviceIds: deviceIds,
|
||||
@@ -414,8 +426,9 @@
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ns-tree-title {
|
||||
display: flex;
|
||||
user-select: text;
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: 12px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
@@ -444,4 +457,25 @@
|
||||
// width: 100%;
|
||||
// // margin-bottom: 10px;
|
||||
// }
|
||||
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
// .title::before {
|
||||
// content: '';
|
||||
// position: absolute;
|
||||
// left: 10px;
|
||||
// top: 50%;
|
||||
// transform: translateY(-50%);
|
||||
// height: 13px;
|
||||
// width: 3px;
|
||||
// border-radius: 1px;
|
||||
// background-color: #2778ff;
|
||||
// }
|
||||
</style>
|
||||
|
@@ -1,18 +1,21 @@
|
||||
<template>
|
||||
<div style="height: 100%; width: 100%; overflow-y: auto">
|
||||
<a-table
|
||||
:columns="columns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
style="width: 99%; height: 90%; margin-left: 0.5%"
|
||||
style="width: 99%; margin-left: 0.5%"
|
||||
:pagination="false"
|
||||
:scroll="{ x: '2000' }" />
|
||||
<a-pagination
|
||||
:total="total"
|
||||
:show-total="(total, range) => ` 共 ${total} 条`"
|
||||
size="small"
|
||||
:show-total="(total, range) => `显示第${range[0]}到${range[1]}条记录 ,共${total} 条记录`"
|
||||
show-size-changer
|
||||
show-quick-jumper
|
||||
@change="onChange"
|
||||
style="display: flex; justify-content: right; margin-top: 10px; margin-right: 30px" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
@@ -32,12 +32,13 @@
|
||||
<ns-icon :name="iconName" size="18" style="margin-right: 10px" @click="change" />
|
||||
</div>
|
||||
</div>
|
||||
<span style="padding-left: 10px; line-height: 20px">
|
||||
<!-- <span style="padding-left: 10px; line-height: 20px">
|
||||
<ns-icon name="title" size="11" style="margin-right: 3px" />统计数据
|
||||
</span>
|
||||
</span> -->
|
||||
<div class="title">统计数据</div>
|
||||
</div>
|
||||
|
||||
<div v-if="activeKey == '1'" style="height: 72%; width: 100%">
|
||||
<div v-if="activeKey == '1'" style="height: 75%; width: 100%">
|
||||
<graph-graph ref="graphRef" v-if="isGraph" />
|
||||
<environment-table ref="tableRef" v-else style="width: 100%" />
|
||||
</div>
|
||||
@@ -155,4 +156,25 @@
|
||||
::v-deep .ant-tabs-tab:hover {
|
||||
color: #000000; /* 悬停时的文字颜色 */
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
</style>
|
||||
|
@@ -2,8 +2,9 @@
|
||||
<template>
|
||||
<div class="parent-container">
|
||||
<div class="ns-tree-title">
|
||||
<ns-icon name="common" size="11" style="margin-right: 3px" />
|
||||
<span>数据点位</span>
|
||||
<ns-icon name="common" size="11" style="margin-top: 10px" />
|
||||
<!-- <span>数据点位</span> -->
|
||||
<div class="title">数据点位</div>
|
||||
</div>
|
||||
|
||||
<a-select
|
||||
@@ -383,7 +384,7 @@
|
||||
deviceInfoCodes: mode.value == '0' ? checkedKeys.value : [], // 设备需要传 device_info_code
|
||||
energyQueryType: mode.value, // 0 设备 1 节点
|
||||
|
||||
nodeIds: mode.value == '1' ? checkedKeys.value : [],
|
||||
nodeIds: mode.value == '1' ? checkedKeys.value.checked : [],
|
||||
startDate: startTime,
|
||||
endDate: endTime,
|
||||
})
|
||||
@@ -647,8 +648,9 @@
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ns-tree-title {
|
||||
display: flex;
|
||||
user-select: text;
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: 12px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
@@ -690,4 +692,14 @@
|
||||
.ant-radio-button-wrapper:not(:first-child)::before {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
</style>
|
||||
|
@@ -15,7 +15,7 @@
|
||||
">
|
||||
<div style="display: flex">
|
||||
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px" />
|
||||
<span>设备状态</span>
|
||||
<span style="font-weight: bold">设备状态</span>
|
||||
</div>
|
||||
|
||||
<div style="width: 100%; height: 100%; padding-left: 10%; padding-right: 10%">
|
||||
@@ -73,7 +73,7 @@
|
||||
">
|
||||
<div style="display: flex">
|
||||
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px" />
|
||||
<div style="height: 10%">平均值</div>
|
||||
<div style="height: 10%; font-weight: bold">平均值</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; flex-wrap: wrap; width: 100%; height: 92%">
|
||||
@@ -144,7 +144,7 @@
|
||||
">
|
||||
<div style="width: 100%; display: flex; align-items: center">
|
||||
<ns-icon name="zongheshuju" size="30" style="margin-right: 3px; margin-top: 8px" />
|
||||
<div style="width: 20%">环境指数分析</div>
|
||||
<div style="width: 20%; font-weight: bold">环境指数分析</div>
|
||||
<div style="width: 80%; float: right; padding-right: 40px">
|
||||
<a-select
|
||||
v-model:value="typeValue"
|
||||
@@ -812,24 +812,110 @@
|
||||
lineHeight: 20,
|
||||
},
|
||||
},
|
||||
// dataZoom: [
|
||||
// {
|
||||
// show: true,
|
||||
// type: 'slider',
|
||||
// zoomLock: true,
|
||||
// startValue: 0, // 从头开始。
|
||||
// endValue: 23,
|
||||
// bottom: 20,
|
||||
// height: 10,
|
||||
// showDetail: false,
|
||||
// },
|
||||
// {
|
||||
// show: true,
|
||||
// type: 'inside',
|
||||
// xAxisIndex: 0,
|
||||
// zoomOnMouseWheel: false, // 滚轮是否触发缩放
|
||||
// moveOnMouseMove: true, // 鼠标滚轮触发滚动
|
||||
// moveOnMouseWheel: true,
|
||||
// },
|
||||
// ],
|
||||
//滑块样式
|
||||
dataZoom: [
|
||||
{
|
||||
show: true,
|
||||
type: 'slider',
|
||||
zoomLock: true,
|
||||
startValue: 0, // 从头开始。
|
||||
endValue: 23,
|
||||
bottom: 20,
|
||||
height: 10,
|
||||
showDetail: false,
|
||||
// backgroundColor: 'yellow',
|
||||
fillerColor: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(97, 134, 255, 1)',
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
type: 'inside',
|
||||
xAxisIndex: 0,
|
||||
zoomOnMouseWheel: false, // 滚轮是否触发缩放
|
||||
moveOnMouseMove: true, // 鼠标滚轮触发滚动
|
||||
moveOnMouseWheel: true,
|
||||
offset: 1,
|
||||
color: 'rgba(36, 186, 255, 1)',
|
||||
},
|
||||
],
|
||||
false,
|
||||
),
|
||||
height: 12, // 设置slider的高度为15
|
||||
// start: 0,
|
||||
// end: 100,
|
||||
startValue: 0, // 从头开始。
|
||||
endValue: 23,
|
||||
right: 60,
|
||||
left: 60,
|
||||
bottom: 10,
|
||||
handleIcon:
|
||||
'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5M36.9,35.8h-1.3z M27.8,35.8 h-1.3H27L27.8,35.8L27.8,35.8z', // 使用类似 axisPointer 的图标
|
||||
handleSize: '140%', // 放大按钮
|
||||
// borderColor: 'none',
|
||||
handleStyle: {
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(97, 134, 255, 1)',
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(36, 186, 255, 1)',
|
||||
},
|
||||
],
|
||||
false,
|
||||
),
|
||||
borderWidth: 4,
|
||||
borderColor: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(255, 255, 255, 1)',
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(204, 238, 255, 1)',
|
||||
},
|
||||
],
|
||||
false,
|
||||
),
|
||||
shadowOffsetX: 0, // 阴影偏移x轴多少
|
||||
shadowOffsetY: 0, // 阴影偏移y轴多少
|
||||
},
|
||||
// 显示的label的格式化器
|
||||
// 20050101 变为 2005\n0101
|
||||
// labelFormatter: function (index, value) {
|
||||
// const year = value.slice(0, 4);
|
||||
// const date = value.slice(4);
|
||||
// return year + '\n' + date;
|
||||
// },
|
||||
// textStyle: {
|
||||
// fontStyle: 'italic', // 设置字体倾斜
|
||||
// },
|
||||
// showDataShadow: false, // 隐藏数据阴影
|
||||
},
|
||||
],
|
||||
visualMap: {
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<!-- eslint-disable vue/v-on-event-hyphenation -->
|
||||
<template>
|
||||
<!-- <a-spin :spinning="loading"> -->
|
||||
<div style="background: #ffffff; height: 95%; position: relative">
|
||||
<div style="background: #ffffff; height: 95%; position: relative; overflow-y: auto">
|
||||
<a-spin :spinning="loading">
|
||||
<a-table
|
||||
:columns="tableColumns"
|
||||
@@ -13,9 +13,10 @@
|
||||
<div
|
||||
style="display: flex; align-items: center; justify-content: space-between; width: 100%">
|
||||
<div style="display: flex; align-items: center; width: 85%">
|
||||
<div style="width: 10%"
|
||||
><ns-icon name="title" size="11" style="margin-right: 3px" />数据报表</div
|
||||
>
|
||||
<div style="width: 10%">
|
||||
<!-- <ns-icon name="title" size="11" style="margin-right: 3px" /> -->
|
||||
<span class="title">数据报表</span>
|
||||
</div>
|
||||
|
||||
<a-select
|
||||
v-model:value="frequencyValue"
|
||||
@@ -175,6 +176,8 @@
|
||||
startDate.value = year + '-' + month + '-' + day;
|
||||
endDate.value = year + '-' + month + '-' + day;
|
||||
}
|
||||
tableColumns.value = [];
|
||||
tableColumns.value.push(...tableColumnsA);
|
||||
http
|
||||
.post(environmentMonitor.getDeviceAveragesByRate, {
|
||||
orgId: orgId.value,
|
||||
@@ -253,4 +256,25 @@
|
||||
/* ::v-deep .ant-table-title + .ant-table-container table > thead > tr:first-child th:last-child {
|
||||
display: none !important;
|
||||
} */
|
||||
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
</style>
|
||||
|
@@ -19,9 +19,10 @@
|
||||
border-top: 0 !important;
|
||||
">
|
||||
<div style="display: flex; align-items: center; width: 85%">
|
||||
<div style="width: 10%"
|
||||
><ns-icon name="title" size="11" style="margin-right: 3px" />数据报表</div
|
||||
>
|
||||
<div style="width: 10%">
|
||||
<!-- <ns-icon name="title" size="11" style="margin-right: 3px" /> -->
|
||||
<span class="title">数据报表</span>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="typeValue"
|
||||
placeholder="请选择环境参数"
|
||||
@@ -324,7 +325,6 @@
|
||||
});
|
||||
}
|
||||
x.value = 360 + headerList.length * 60;
|
||||
debugger;
|
||||
let columnA: any[] = [...tableColumnsA];
|
||||
columnA.push(...tableColumnsB);
|
||||
tableColumns.value = columnA;
|
||||
@@ -406,4 +406,24 @@
|
||||
/* ::v-deep .ant-table-title + .ant-table-container table > thead > tr:first-child th:last-child {
|
||||
display: none !important;
|
||||
} */
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user