Compare commits
13 Commits
2025-09
...
7769c8db01
| Author | SHA1 | Date | |
|---|---|---|---|
|
7769c8db01 | ||
|
|
c244b5b137 | ||
|
|
cff1867dae | ||
|
|
d712f683b3 | ||
|
|
98b9bbce0d | ||
|
|
da63aa8abe | ||
|
|
920fecc9a7 | ||
|
|
791893ca38 | ||
|
|
5d4d523111 | ||
|
|
ea14a290b7 | ||
|
|
7c8917a2cd | ||
|
|
72074c65ba | ||
|
|
58c722ab3a |
1
components.d.ts
vendored
1
components.d.ts
vendored
@@ -22,7 +22,6 @@ declare module '@vue/runtime-core' {
|
|||||||
ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
|
ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
|
||||||
ElDialog: typeof import('element-plus/es')['ElDialog']
|
ElDialog: typeof import('element-plus/es')['ElDialog']
|
||||||
ElDivider: typeof import('element-plus/es')['ElDivider']
|
ElDivider: typeof import('element-plus/es')['ElDivider']
|
||||||
ElDrawer: typeof import('element-plus/es')['ElDrawer']
|
|
||||||
ElDropdown: typeof import('element-plus/es')['ElDropdown']
|
ElDropdown: typeof import('element-plus/es')['ElDropdown']
|
||||||
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
|
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
|
||||||
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
|
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
|
<link rel="icon" type="image/svg+xml" href="/favicon.ico" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>电压暂降监测平台</title>
|
<title>无锡电能质量演示平台</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|||||||
@@ -95,8 +95,8 @@ export function getEventList(data) {
|
|||||||
export function clickImage(data) {
|
export function clickImage(data) {
|
||||||
return http.request({
|
return http.request({
|
||||||
url: "/scale/clickImage",
|
url: "/scale/clickImage",
|
||||||
method: "get",
|
method: "post",
|
||||||
params: data,
|
data: data,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -258,7 +258,6 @@ export function rightImportOpenDetail(data: object) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 对象类型
|
// 对象类型
|
||||||
export function getDicTree(data: object) {
|
export function getDicTree(data: object) {
|
||||||
return service({
|
return service({
|
||||||
@@ -295,13 +294,12 @@ export function exportForms(data: object) {
|
|||||||
responseType: "blob",
|
responseType: "blob",
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
// 报表导出
|
||||||
|
export function exportLineData() {
|
||||||
|
return service({
|
||||||
|
url: "/largescreen/exportLineData",
|
||||||
|
method: "post",
|
||||||
|
|
||||||
|
responseType: "blob",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -54,6 +54,12 @@
|
|||||||
<div class="content unicode" style="display: block;">
|
<div class="content unicode" style="display: block;">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">传输设备</div>
|
||||||
|
<div class="code-name">&#xe67a;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont"></span>
|
<span class="icon iconfont"></span>
|
||||||
<div class="name">告警</div>
|
<div class="name">告警</div>
|
||||||
@@ -78,9 +84,9 @@
|
|||||||
<pre><code class="language-css"
|
<pre><code class="language-css"
|
||||||
>@font-face {
|
>@font-face {
|
||||||
font-family: 'iconfont';
|
font-family: 'iconfont';
|
||||||
src: url('iconfont.woff2?t=1752716651599') format('woff2'),
|
src: url('iconfont.woff2?t=1761527493132') format('woff2'),
|
||||||
url('iconfont.woff?t=1752716651599') format('woff'),
|
url('iconfont.woff?t=1761527493132') format('woff'),
|
||||||
url('iconfont.ttf?t=1752716651599') format('truetype');
|
url('iconfont.ttf?t=1761527493132') format('truetype');
|
||||||
}
|
}
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||||
@@ -106,6 +112,15 @@
|
|||||||
<div class="content font-class">
|
<div class="content font-class">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont icon-chuanshushebei"></span>
|
||||||
|
<div class="name">
|
||||||
|
传输设备
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.icon-chuanshushebei
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont icon-gaojing"></span>
|
<span class="icon iconfont icon-gaojing"></span>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
@@ -142,6 +157,14 @@
|
|||||||
<div class="content symbol">
|
<div class="content symbol">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#icon-chuanshushebei"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">传输设备</div>
|
||||||
|
<div class="code-name">#icon-chuanshushebei</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
<use xlink:href="#icon-gaojing"></use>
|
<use xlink:href="#icon-gaojing"></use>
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
@font-face {
|
@font-face {
|
||||||
font-family: "iconfont"; /* Project id 4977098 */
|
font-family: "iconfont"; /* Project id 4977098 */
|
||||||
src: url('iconfont.woff2?t=1752716651599') format('woff2'),
|
src: url('iconfont.woff2?t=1761527493132') format('woff2'),
|
||||||
url('iconfont.woff?t=1752716651599') format('woff'),
|
url('iconfont.woff?t=1761527493132') format('woff'),
|
||||||
url('iconfont.ttf?t=1752716651599') format('truetype');
|
url('iconfont.ttf?t=1761527493132') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont {
|
.iconfont {
|
||||||
@@ -13,6 +13,10 @@
|
|||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.icon-chuanshushebei:before {
|
||||||
|
content: "\e67a";
|
||||||
|
}
|
||||||
|
|
||||||
.icon-gaojing:before {
|
.icon-gaojing:before {
|
||||||
content: "\e60c";
|
content: "\e60c";
|
||||||
}
|
}
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@@ -5,6 +5,13 @@
|
|||||||
"css_prefix_text": "icon-",
|
"css_prefix_text": "icon-",
|
||||||
"description": "",
|
"description": "",
|
||||||
"glyphs": [
|
"glyphs": [
|
||||||
|
{
|
||||||
|
"icon_id": "21053723",
|
||||||
|
"name": "传输设备",
|
||||||
|
"font_class": "chuanshushebei",
|
||||||
|
"unicode": "e67a",
|
||||||
|
"unicode_decimal": 59002
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"icon_id": "36284864",
|
"icon_id": "36284864",
|
||||||
"name": "告警",
|
"name": "告警",
|
||||||
|
|||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
BIN
src/assets/img/txzcwzj.png
Normal file
BIN
src/assets/img/txzcwzj.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 916 B |
@@ -802,7 +802,7 @@ const initWave = (waveDatas: WaveData[] | null, time: string | null, type: strin
|
|||||||
}, 500)
|
}, 500)
|
||||||
|
|
||||||
if (waveDatas && waveDatas.length > 1) {
|
if (waveDatas && waveDatas.length > 1) {
|
||||||
const waveDatasTemp = waveDatas.slice(1).reverse()
|
const waveDatasTemp = waveDatas.slice(1)
|
||||||
for (let step = 0; step < waveDatasTemp.length; step++) {
|
for (let step = 0; step < waveDatasTemp.length; step++) {
|
||||||
drawPics(waveDatasTemp[step], picHeight, step, show, myChartes, rmscm, rmscu, titleText)
|
drawPics(waveDatasTemp[step], picHeight, step, show, myChartes, rmscm, rmscu, titleText)
|
||||||
}
|
}
|
||||||
@@ -881,19 +881,14 @@ const drawPics = (waveDataTemp: WaveData, picHeight: string, step: number, show:
|
|||||||
|
|
||||||
const option = {
|
const option = {
|
||||||
tooltip: {
|
tooltip: {
|
||||||
|
top: '10px',
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
borderColor: 'grey',
|
borderColor: 'grey',
|
||||||
backgroundColor: '#fff',
|
|
||||||
style: {
|
|
||||||
color: '#fff',
|
|
||||||
fontSize: '15px',
|
|
||||||
padding: 10
|
|
||||||
},
|
|
||||||
formatter: function (params: any) {
|
formatter: function (params: any) {
|
||||||
let tips = '时刻:' + params[0].data[0] + '</br/>'
|
let tips = '时刻:' + params[0].data[0] + '</br/>'
|
||||||
for (let i = 0; i < params.length; i++) {
|
for (let i = 0; i < params.length; i++) {
|
||||||
if (params[i].seriesName != '暂降触发点') {
|
if (params[i].seriesName != '暂降触发点') {
|
||||||
tips += params[i].seriesName + ':' + (params[i].value[1] - 0).toFixed(2) + '<br/>'
|
tips += params[i].marker + params[i].seriesName + ':' + (params[i].value[1] - 0).toFixed(2) + '<br/>'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return tips
|
return tips
|
||||||
@@ -904,11 +899,12 @@ const drawPics = (waveDataTemp: WaveData, picHeight: string, step: number, show:
|
|||||||
opacity: 0.35,
|
opacity: 0.35,
|
||||||
fontSize: 14
|
fontSize: 14
|
||||||
},
|
},
|
||||||
|
backgroundColor: 'rgba(0,0,0,0.55)',
|
||||||
borderWidth: 0
|
borderWidth: 0
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
left: 'center',
|
left: 'center',
|
||||||
text: titlename || title,
|
text: '',//titlename || title,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: '0.8rem',
|
fontSize: '0.8rem',
|
||||||
color: props.DColor ? '#fff' : echartsColor.WordColor
|
color: props.DColor ? '#fff' : echartsColor.WordColor
|
||||||
|
|||||||
@@ -530,7 +530,7 @@ const initWave = (waveDatas: WaveData[] | null, time: string | null, type: strin
|
|||||||
}, 400)
|
}, 400)
|
||||||
|
|
||||||
if (waveDatas && waveDatas.length > 1) {
|
if (waveDatas && waveDatas.length > 1) {
|
||||||
const waveDatasTemp = waveDatas.slice(1).reverse()
|
const waveDatasTemp = waveDatas.slice(1)
|
||||||
for (let step = 0; step < waveDatasTemp.length; step++) {
|
for (let step = 0; step < waveDatasTemp.length; step++) {
|
||||||
drawPics(waveDatasTemp[step], picHeight, step, show, myChartes, titleText)
|
drawPics(waveDatasTemp[step], picHeight, step, show, myChartes, titleText)
|
||||||
}
|
}
|
||||||
@@ -638,7 +638,7 @@ const drawPics = (waveDataTemp: WaveData, picHeight: string, step: number, show:
|
|||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
left: 'center',
|
left: 'center',
|
||||||
text: titlename || title,
|
text: '',//titlename || title,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: '0.8rem',
|
fontSize: '0.8rem',
|
||||||
color: props.DColor ? '#fff' : echartsColor.WordColor
|
color: props.DColor ? '#fff' : echartsColor.WordColor
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { createStore, Store, useStore } from "vuex";
|
import { createStore, Store, useStore } from "vuex";
|
||||||
import { login } from "@/api/login/login";
|
import { login } from "@/api/login/login";
|
||||||
import { initLedger, queryConfig } from "@/api/statistics/index";
|
import { initLedger, queryConfig } from "@/api/statistics/index";
|
||||||
|
import { set } from "xe-utils";
|
||||||
// const store = useStore();
|
// const store = useStore();
|
||||||
|
|
||||||
// 定义状态接口
|
// 定义状态接口
|
||||||
@@ -18,6 +19,8 @@ interface State {
|
|||||||
eventValue: number;
|
eventValue: number;
|
||||||
eventDuration: number;
|
eventDuration: number;
|
||||||
realData: []; //实时数据
|
realData: []; //实时数据
|
||||||
|
iframeLoad: boolean;
|
||||||
|
showMap: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 初始状态
|
// 初始状态
|
||||||
@@ -35,11 +38,14 @@ const state: State = {
|
|||||||
eventValue: 0.7,
|
eventValue: 0.7,
|
||||||
eventDuration: 5,
|
eventDuration: 5,
|
||||||
realData: [], //实时数据
|
realData: [], //实时数据
|
||||||
|
iframeLoad: false,//无锡接线图是否加载完成
|
||||||
|
showMap: true,//无锡地图显示
|
||||||
};
|
};
|
||||||
|
|
||||||
// 定义Mutation类型
|
// 定义Mutation类型
|
||||||
enum Mutations {
|
enum Mutations {
|
||||||
INCREMENT = "INCREMENT",
|
INCREMENT = "INCREMENT",
|
||||||
|
SET_STATE= "SET_STATE",
|
||||||
SET_TOKEN = "SET_TOKEN",
|
SET_TOKEN = "SET_TOKEN",
|
||||||
SET_TIME = "SET-TIME",
|
SET_TIME = "SET-TIME",
|
||||||
SET_CONFIG = "SET-CONFIG-TIME",
|
SET_CONFIG = "SET-CONFIG-TIME",
|
||||||
@@ -51,6 +57,10 @@ export default createStore({
|
|||||||
[Mutations.INCREMENT](state: State) {
|
[Mutations.INCREMENT](state: State) {
|
||||||
state.count++;
|
state.count++;
|
||||||
},
|
},
|
||||||
|
[Mutations.SET_STATE](state: State, data: any) {
|
||||||
|
console.log("🚀 ~ data:", data)
|
||||||
|
state[data.key] = data.value;
|
||||||
|
},
|
||||||
[Mutations.SET_TOKEN](state: State, data: any) {
|
[Mutations.SET_TOKEN](state: State, data: any) {
|
||||||
window.sessionStorage.setItem("token", data.token);
|
window.sessionStorage.setItem("token", data.token);
|
||||||
window.sessionStorage.setItem("deptId", data.deptId);
|
window.sessionStorage.setItem("deptId", data.deptId);
|
||||||
@@ -96,6 +106,9 @@ export default createStore({
|
|||||||
increment({ commit }) {
|
increment({ commit }) {
|
||||||
commit(Mutations.INCREMENT);
|
commit(Mutations.INCREMENT);
|
||||||
},
|
},
|
||||||
|
setStateKey({ commit }, data: any) {
|
||||||
|
commit(Mutations.SET_STATE,data);
|
||||||
|
},
|
||||||
setTimeType({ commit }, data: any) {
|
setTimeType({ commit }, data: any) {
|
||||||
commit(Mutations.SET_TIME, data);
|
commit(Mutations.SET_TIME, data);
|
||||||
},
|
},
|
||||||
|
|||||||
459
src/views/SagTraceResult_WX/components/bdMap.vue
Normal file
459
src/views/SagTraceResult_WX/components/bdMap.vue
Normal file
@@ -0,0 +1,459 @@
|
|||||||
|
<template>
|
||||||
|
<div v-loading="loading" element-loading-background="#343849c7">
|
||||||
|
<div class="iconBox">
|
||||||
|
<div class="div">
|
||||||
|
<img src="@/assets/jcd.png" alt="" />
|
||||||
|
<span>变电站</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="div">
|
||||||
|
<img src="@/assets/img/txzcwzj.png" alt="" />
|
||||||
|
<span>监测点</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="bmSelect">
|
||||||
|
<el-select
|
||||||
|
v-model="value"
|
||||||
|
@change="setIcon"
|
||||||
|
placeholder="变电站筛选"
|
||||||
|
filterable
|
||||||
|
clearable
|
||||||
|
size="small"
|
||||||
|
style="width: 150px"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in siteList"
|
||||||
|
:key="item.stationName"
|
||||||
|
:label="item.stationName"
|
||||||
|
:value="item.stationName"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<baidu-map
|
||||||
|
ref="mapRef"
|
||||||
|
class="bm-view"
|
||||||
|
:max-zoom="15"
|
||||||
|
:min-zoom="10"
|
||||||
|
:zoom="zoom"
|
||||||
|
@zoomend="syncCenterAndZoom"
|
||||||
|
@moveend="checkMapData"
|
||||||
|
@ready="handler"
|
||||||
|
:center="center"
|
||||||
|
:scroll-wheel-zoom="false"
|
||||||
|
:double-click-zoom="false"
|
||||||
|
>
|
||||||
|
<!-- 线-->
|
||||||
|
<div v-if="zoom > 13">
|
||||||
|
<bm-polyline
|
||||||
|
:path="path"
|
||||||
|
v-for="(path, index) in polyline"
|
||||||
|
:key="index"
|
||||||
|
></bm-polyline>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 变电站-->
|
||||||
|
<template v-if="zoom > 13">
|
||||||
|
<bm-marker
|
||||||
|
:position="path"
|
||||||
|
v-for="path in siteList"
|
||||||
|
:key="path.subId"
|
||||||
|
:icon="path.icon"
|
||||||
|
@click="markerClick(path)"
|
||||||
|
></bm-marker>
|
||||||
|
</template>
|
||||||
|
<!-- 点 -->
|
||||||
|
<div maxZoom="12">
|
||||||
|
<bm-marker
|
||||||
|
:position="path"
|
||||||
|
v-for="path in areaLineInfo"
|
||||||
|
:key="path.lineId"
|
||||||
|
:icon="path.icon"
|
||||||
|
@click="pointClick(path)"
|
||||||
|
></bm-marker>
|
||||||
|
</div>
|
||||||
|
<bm-marker
|
||||||
|
:position="infoWindowPoint"
|
||||||
|
:icon="{ url: '1', size: { width: 0, height: 0 } }"
|
||||||
|
>
|
||||||
|
<bm-info-window
|
||||||
|
:show="infoWindowPoint.show"
|
||||||
|
@close="infoWindowPoint.show = false"
|
||||||
|
>
|
||||||
|
</bm-info-window>
|
||||||
|
</bm-marker>
|
||||||
|
</baidu-map>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive, nextTick, onMounted } from "vue";
|
||||||
|
import { substationCount } from "@/api/statistics/index";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
// import { BmlMarkerClusterer } from "vue-baidu-map-3x";
|
||||||
|
const emit = defineEmits(["pointClick"]);
|
||||||
|
const store = useStore();
|
||||||
|
const mapRef = ref<any>(null); // 地图容器的ref
|
||||||
|
const mapInstance: any = ref(null); // 百度地图实例
|
||||||
|
const BMapInstance: any = ref(null); // BMap对象
|
||||||
|
const loading = ref(false);
|
||||||
|
const dataList: any = ref([]);
|
||||||
|
const polyline = ref<any>([]);
|
||||||
|
const zoom = ref(11);
|
||||||
|
const areaLineInfo = ref<any>([]);
|
||||||
|
const siteList = ref<any>([]);
|
||||||
|
const infoWindowPoint = ref<any>({
|
||||||
|
lng: 0,
|
||||||
|
lat: 0,
|
||||||
|
show: false,
|
||||||
|
});
|
||||||
|
const center = ref({
|
||||||
|
lng: 120.124367,
|
||||||
|
lat: 31.555421,
|
||||||
|
});
|
||||||
|
const value = ref("");
|
||||||
|
const handler = async ({ BMap, map }: any) => {
|
||||||
|
if (!BMap.MarkerClusterer) {
|
||||||
|
// await import("/offline/libs/MarkerClusterer_min.js");
|
||||||
|
}
|
||||||
|
mapInstance.value = map;
|
||||||
|
BMapInstance.value = BMap;
|
||||||
|
|
||||||
|
// 监听地图容器的鼠标滚轮事件
|
||||||
|
const mapDom = mapRef.value.$el; // 获取地图DOM元素
|
||||||
|
mapDom.addEventListener("mousewheel", handleMapWheel, { passive: false });
|
||||||
|
};
|
||||||
|
|
||||||
|
// 点击变电站\监测点
|
||||||
|
const markerClick = (e: any) => {
|
||||||
|
zoom.value = 15;
|
||||||
|
infoWindowPoint.value = e;
|
||||||
|
infoWindowPoint.value.show = true;
|
||||||
|
center.value.lng = 120.124367;
|
||||||
|
center.value.lat = 31.555421;
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
center.value.lng = e.lng;
|
||||||
|
center.value.lat = e.lat + 0.01;
|
||||||
|
}, 0);
|
||||||
|
};
|
||||||
|
// 点击监测点
|
||||||
|
const pointClick = (e: any) => {
|
||||||
|
emit("pointClick", e);
|
||||||
|
store.dispatch("setStateKey", { key: "showMap", value: false });
|
||||||
|
};
|
||||||
|
|
||||||
|
const init = () => {
|
||||||
|
loading.value = true;
|
||||||
|
siteList.value = [];
|
||||||
|
polyline.value = [];
|
||||||
|
dataList.value = [];
|
||||||
|
areaLineInfo.value = [];
|
||||||
|
// substationCount({
|
||||||
|
// deptId: store.state.deptId,
|
||||||
|
// type: store.state.timeType,
|
||||||
|
// startTime: store.state.timeValue[0],
|
||||||
|
// endTime: store.state.timeValue[1],
|
||||||
|
// }).then((res: any) => {
|
||||||
|
// dataList.value = res.data;
|
||||||
|
dataList.value = [
|
||||||
|
{
|
||||||
|
stationId: 156,
|
||||||
|
stationName: "110kV北京电视台变",
|
||||||
|
gdName: "检修分公司",
|
||||||
|
longitude: 120.33,
|
||||||
|
latitude: 31.52,
|
||||||
|
lineCount: 1,
|
||||||
|
eventCount: 1,
|
||||||
|
lineEventDetails: [
|
||||||
|
{
|
||||||
|
gdName: "检修分公司",
|
||||||
|
pictureId: "5debb8bd0ce26527675eedffd74a3198",
|
||||||
|
pictureName: "无锡线上",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gdName: "检修分公司",
|
||||||
|
pictureId: "35b1301833e3fdfc872b1a27a17c7245",
|
||||||
|
pictureName: "无锡修改1011--工程部",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
let data = dataList.value;
|
||||||
|
let r = 0.0035;
|
||||||
|
let list = data.filter((item: any) => item.latitude != 0);
|
||||||
|
list.forEach((item: any) => {
|
||||||
|
// 变电站图标
|
||||||
|
item.icon = {
|
||||||
|
url: new URL("@/assets/jcd.png", import.meta.url).href,
|
||||||
|
size: {
|
||||||
|
width: 40,
|
||||||
|
height: 40,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if (
|
||||||
|
item.lineEventDetails?.length > 10 &&
|
||||||
|
item.lineEventDetails?.length < 100
|
||||||
|
) {
|
||||||
|
r = 0.0055;
|
||||||
|
} else if (item.lineEventDetails.length >= 100) {
|
||||||
|
r = 0.01055;
|
||||||
|
}
|
||||||
|
item.lng = item.longitude;
|
||||||
|
item.lat = item.latitude;
|
||||||
|
item.lineEventDetails.forEach((val: any, i: number) => {
|
||||||
|
val.lng =
|
||||||
|
item.longitude +
|
||||||
|
r * Math.cos((2 * Math.PI * i) / item.lineEventDetails.length);
|
||||||
|
val.lat =
|
||||||
|
item.latitude +
|
||||||
|
r * Math.sin((2 * Math.PI * i) / item.lineEventDetails.length);
|
||||||
|
// 监测点图标
|
||||||
|
val.icon = {
|
||||||
|
url: new URL("@/assets/img/txzcwzj.png", import.meta.url).href,
|
||||||
|
size: {
|
||||||
|
width: 40,
|
||||||
|
height: 40,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
polyline.value.push([
|
||||||
|
{
|
||||||
|
lng: item.lng,
|
||||||
|
lat: item.lat,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
lng: val.lng,
|
||||||
|
lat: val.lat,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
});
|
||||||
|
|
||||||
|
areaLineInfo.value.push(...item.lineEventDetails);
|
||||||
|
});
|
||||||
|
|
||||||
|
siteList.value = list;
|
||||||
|
|
||||||
|
// zoom.value = 12;
|
||||||
|
setTimeout(() => {
|
||||||
|
loading.value = false;
|
||||||
|
}, 0);
|
||||||
|
// });
|
||||||
|
};
|
||||||
|
const moveenFlag = ref(true);
|
||||||
|
|
||||||
|
const checkMapData = () => {
|
||||||
|
if (!mapInstance.value || !BMapInstance.value || !moveenFlag.value) return;
|
||||||
|
|
||||||
|
// 获取地图容器
|
||||||
|
const container = mapInstance.value.getContainer();
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
try {
|
||||||
|
// 1. 获取所有图片瓦片
|
||||||
|
const tiles = Array.from(container.querySelectorAll("img"));
|
||||||
|
|
||||||
|
// 2. 检查是否有离线地图瓦片
|
||||||
|
const hasOfflineTiles = tiles.some((tile: any) => {
|
||||||
|
// 确保tile是有效的DOM元素
|
||||||
|
if (!tile || !tile.src) return false;
|
||||||
|
|
||||||
|
// 检查是否是离线瓦片
|
||||||
|
return tile.src.includes("/plugin/offline/tiles/");
|
||||||
|
});
|
||||||
|
|
||||||
|
// 3. 如果没有离线瓦片，回到默认位置
|
||||||
|
if (!hasOfflineTiles) {
|
||||||
|
console.warn("当前区域无离线地图数据，将返回默认位置");
|
||||||
|
|
||||||
|
// 使用正确的BMap.Point创建方式
|
||||||
|
const point = new BMapInstance.value.Point(116.404367, 39.915421);
|
||||||
|
|
||||||
|
// 平滑移动并设置合适缩放级别
|
||||||
|
mapInstance.value.panTo(point);
|
||||||
|
mapInstance.value.setZoom(12);
|
||||||
|
// zoom.value = 12;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error("地图检测出错:", error);
|
||||||
|
}
|
||||||
|
}, 1000); // 适当缩短延迟时间
|
||||||
|
};
|
||||||
|
|
||||||
|
// 处理地图滚轮缩放，修正scale导致的坐标偏移
|
||||||
|
const handleMapWheel = (e: WheelEvent) => {
|
||||||
|
e.preventDefault();
|
||||||
|
if (!mapInstance.value || !BMapInstance.value) return;
|
||||||
|
|
||||||
|
// 1. 获取当前缩放比例（假设你通过scale变量控制，需替换为你的实际scale值）
|
||||||
|
const scaleWidth: any = window.sessionStorage.getItem("scaleWidth"); // 你的水平缩放比例
|
||||||
|
const scaleHeight: any = window.sessionStorage.getItem("scaleheight"); // 你的垂直缩放比例
|
||||||
|
|
||||||
|
// 2. 获取地图容器的位置和尺寸（原始DOM尺寸，未被scale影响）
|
||||||
|
const rect = mapRef.value.$el.getBoundingClientRect();
|
||||||
|
|
||||||
|
// 3. 计算鼠标在地图容器内的原始坐标（未修正）
|
||||||
|
const mouseXRaw = e.clientX - rect.left;
|
||||||
|
const mouseYRaw = e.clientY - rect.top;
|
||||||
|
|
||||||
|
// 4. 修正坐标：除以缩放比例，得到scale前的原始坐标（地图实际识别的坐标）
|
||||||
|
const mouseX = mouseXRaw / scaleWidth;
|
||||||
|
const mouseY = mouseYRaw / scaleHeight;
|
||||||
|
|
||||||
|
// 5. 将修正后的坐标转换为百度地图的经纬度
|
||||||
|
const point = new BMapInstance.value.Pixel(mouseX, mouseY);
|
||||||
|
const lngLat = mapInstance.value.pixelToPoint(point); // 像素坐标转经纬度
|
||||||
|
|
||||||
|
// 6. 执行缩放（滚轮向上放大，向下缩小）
|
||||||
|
const zoomDelta = e.deltaY < 0 ? 1 : -1; // 滚轮方向
|
||||||
|
const newZoom = mapInstance.value.getZoom() + zoomDelta;
|
||||||
|
if (newZoom < 10 || newZoom > 15) return; // 限制缩放范围（百度地图默认范围）
|
||||||
|
|
||||||
|
// 7. 缩放时保持鼠标指向的位置不变（核心：先缩放再移中心点）
|
||||||
|
mapInstance.value.setZoom(newZoom);
|
||||||
|
mapInstance.value.setCenter(lngLat); // 让鼠标指向的位置成为新中心
|
||||||
|
};
|
||||||
|
const syncCenterAndZoom = (e: any) => {
|
||||||
|
zoom.value = e.target.getZoom();
|
||||||
|
checkMapData();
|
||||||
|
};
|
||||||
|
//点击过滤位置
|
||||||
|
const setIcon = (e: string) => {
|
||||||
|
moveenFlag.value = false;
|
||||||
|
siteList.value.forEach((item: any) => {
|
||||||
|
if (item.stationName == e) {
|
||||||
|
center.value.lng = 120.124367;
|
||||||
|
center.value.lat = 31.555421;
|
||||||
|
setTimeout(() => {
|
||||||
|
center.value.lng = item.lng;
|
||||||
|
center.value.lat = item.lat + 0.01;
|
||||||
|
infoWindowPoint.value = item;
|
||||||
|
infoWindowPoint.value.show = true;
|
||||||
|
zoom.value = 15;
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
setTimeout(() => {
|
||||||
|
moveenFlag.value = true;
|
||||||
|
}, 1500);
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
init();
|
||||||
|
});
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
setIcon,
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@use "@/assets/scss/index.scss";
|
||||||
|
.flex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 600px;
|
||||||
|
}
|
||||||
|
.bm-view {
|
||||||
|
width: 100%;
|
||||||
|
height: 980px;
|
||||||
|
}
|
||||||
|
.iconBox {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
left: 10px;
|
||||||
|
z-index: 2000;
|
||||||
|
width: 110px;
|
||||||
|
height: 70px;
|
||||||
|
padding: 10px;
|
||||||
|
background: #ffffff10 !important;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
.div {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
:deep(.el-descriptions__title) {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
:deep(.el-descriptions__content) {
|
||||||
|
color: #fff;
|
||||||
|
// width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-descriptions__body) {
|
||||||
|
color: #fff;
|
||||||
|
background-color: rgb(0 0 0 / 0%) !important;
|
||||||
|
}
|
||||||
|
:deep(.el-descriptions__label) {
|
||||||
|
color: #fff;
|
||||||
|
// display: inline-block;
|
||||||
|
width: 80px;
|
||||||
|
text-align: right; /* 右对齐 */
|
||||||
|
}
|
||||||
|
:deep(.BMap_pop .BMap_center) {
|
||||||
|
background-color: #343849c7;
|
||||||
|
}
|
||||||
|
.descriptionsBox {
|
||||||
|
max-height: 100px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style>
|
||||||
|
.BMap_cpyCtrl {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.anchorBL {
|
||||||
|
display: none;
|
||||||
|
} /* 地图容器样式 */
|
||||||
|
.baidu-map-container {
|
||||||
|
/* 消除可能的缝隙 */
|
||||||
|
line-height: 0;
|
||||||
|
font-size: 0;
|
||||||
|
}
|
||||||
|
/* .BMap_pop div {
|
||||||
|
background-color: #343849c7 !important;
|
||||||
|
} */
|
||||||
|
.BMap_top,
|
||||||
|
.BMap_bottom {
|
||||||
|
background-color: #343849c7 !important;
|
||||||
|
}
|
||||||
|
/* .BMap_pop div:nth-child(1) {
|
||||||
|
background-color: #343849c7 !important;
|
||||||
|
} */
|
||||||
|
.BMap_pop > div:nth-child(1) > div,
|
||||||
|
.BMap_pop > div:nth-child(3) > div,
|
||||||
|
.BMap_pop > div:nth-child(5) > div,
|
||||||
|
.BMap_pop > div:nth-child(7) > div {
|
||||||
|
background-color: #343849c7 !important;
|
||||||
|
}
|
||||||
|
.BMap_pop > div:nth-child(8) > img {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.BMap_pop > div:nth-child(8) {
|
||||||
|
/* 设置边框宽度和颜色，上边框为可见颜色，其他边框为透明 */
|
||||||
|
width: 0 !important;
|
||||||
|
height: 0 !important;
|
||||||
|
border-left: 20px solid transparent;
|
||||||
|
border-right: 20px solid transparent;
|
||||||
|
border-top: 20px solid #343849c7; /* 倒三角的颜色 */
|
||||||
|
transform: translateX(-26px) translateY(24px);
|
||||||
|
/* 可选：添加阴影增强视觉效果 */
|
||||||
|
/* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); */
|
||||||
|
}
|
||||||
|
.bmSelect {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 2000;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -74,7 +74,7 @@
|
|||||||
<el-table-column
|
<el-table-column
|
||||||
prop="duration"
|
prop="duration"
|
||||||
align="center"
|
align="center"
|
||||||
label="持续时间(S)"
|
label="持续时间(s)"
|
||||||
width="100"
|
width="100"
|
||||||
/>
|
/>
|
||||||
<el-table-column fixed="right" label="操作" width="80" align="center">
|
<el-table-column fixed="right" label="操作" width="80" align="center">
|
||||||
@@ -203,7 +203,7 @@ const exportTable = async () => {
|
|||||||
"用户",
|
"用户",
|
||||||
"触发类型",
|
"触发类型",
|
||||||
"残余电压(%)",
|
"残余电压(%)",
|
||||||
"持续时间(S)",
|
"持续时间(s)",
|
||||||
],
|
],
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@@ -44,6 +44,7 @@
|
|||||||
<el-form-item label="运维单位">
|
<el-form-item label="运维单位">
|
||||||
<el-tree-select
|
<el-tree-select
|
||||||
v-model="deptsIndex"
|
v-model="deptsIndex"
|
||||||
|
:teleported="false"
|
||||||
:data="deptsList"
|
:data="deptsList"
|
||||||
:render-after-expand="false"
|
:render-after-expand="false"
|
||||||
clearable
|
clearable
|
||||||
@@ -95,8 +96,8 @@
|
|||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
size="small"
|
size="small"
|
||||||
:max="100"
|
:max="100"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventValueMin = 1) : null)
|
(e) => (e == null ? (eventForm.eventValueMin = 1) : null)
|
||||||
"
|
"
|
||||||
@@ -112,8 +113,8 @@
|
|||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
size="small"
|
size="small"
|
||||||
:max="100"
|
:max="100"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventValueMax = 1) : null)
|
(e) => (e == null ? (eventForm.eventValueMax = 1) : null)
|
||||||
"
|
"
|
||||||
@@ -129,13 +130,13 @@
|
|||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
size="small"
|
size="small"
|
||||||
:max="1000000"
|
:max="1000000"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventDurationMin = 1) : null)
|
(e) => (e == null ? (eventForm.eventDurationMin = 1) : null)
|
||||||
"
|
"
|
||||||
><template #suffix>
|
><template #suffix>
|
||||||
<span>ms</span>
|
<span>s</span>
|
||||||
</template></el-input-number
|
</template></el-input-number
|
||||||
>
|
>
|
||||||
<span> < 持续时间 < </span>
|
<span> < 持续时间 < </span>
|
||||||
@@ -146,13 +147,13 @@
|
|||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
size="small"
|
size="small"
|
||||||
:max="1000000"
|
:max="1000000"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventDurationMax = 1) : null)
|
(e) => (e == null ? (eventForm.eventDurationMax = 1) : null)
|
||||||
"
|
"
|
||||||
><template #suffix>
|
><template #suffix>
|
||||||
<span>ms</span>
|
<span>s</span>
|
||||||
</template></el-input-number
|
</template></el-input-number
|
||||||
>
|
>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@@ -261,7 +262,7 @@
|
|||||||
<el-table-column
|
<el-table-column
|
||||||
prop="duration"
|
prop="duration"
|
||||||
align="center"
|
align="center"
|
||||||
label="持续时间(S)"
|
label="持续时间(s)"
|
||||||
width="90"
|
width="90"
|
||||||
/>
|
/>
|
||||||
<el-table-column fixed="right" label="操作" width="80" align="center">
|
<el-table-column fixed="right" label="操作" width="80" align="center">
|
||||||
@@ -489,7 +490,7 @@ const exportTable = async () => {
|
|||||||
"用户",
|
"用户",
|
||||||
"触发类型",
|
"触发类型",
|
||||||
"残余电压(%)",
|
"残余电压(%)",
|
||||||
"持续时间(S)",
|
"持续时间(s)",
|
||||||
],
|
],
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@@ -1,12 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- 配网计算 -->
|
<!-- 配网计算 -->
|
||||||
<splitpanes style="height: 100%" class="default-theme" id="navigation-splitpanes">
|
<splitpanes
|
||||||
|
style="height: 100%"
|
||||||
|
class="default-theme"
|
||||||
|
id="navigation-splitpanes"
|
||||||
|
>
|
||||||
<pane :size="20">
|
<pane :size="20">
|
||||||
<PointTree :showSelect="false" @node-click="handleNodeClick" @init="handleNodeClick"></PointTree>
|
<PointTree
|
||||||
|
:showSelect="false"
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
@init="handleNodeClick"
|
||||||
|
></PointTree>
|
||||||
</pane>
|
</pane>
|
||||||
|
|
||||||
<pane style="background-color: rgba(44, 46, 60, 0.1)" :size="100 - size">
|
<pane style="background-color: rgba(44, 46, 60, 0.1)" :size="100 - size">
|
||||||
|
|
||||||
<el-form :model="form" inline label-width="auto">
|
<el-form :model="form" inline label-width="auto">
|
||||||
<el-form-item label="谐波类型">
|
<el-form-item label="谐波类型">
|
||||||
<el-radio-group v-model="form.type">
|
<el-radio-group v-model="form.type">
|
||||||
@@ -15,86 +22,217 @@
|
|||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="谐波次数">
|
<el-form-item label="谐波次数">
|
||||||
<el-select v-model="form.index" filterable multiple :multiple-limit="5" collapse-tags collapse-tags-tooltip
|
<el-select
|
||||||
clearable placeholder="请选择次数" style="width: 200px" size="small">
|
v-model="form.index"
|
||||||
<el-option v-for="item in 49" :key="item" :label="item + 1 + '次'" :value="item + 1"></el-option>
|
filterable
|
||||||
|
multiple
|
||||||
|
:multiple-limit="5"
|
||||||
|
collapse-tags
|
||||||
|
collapse-tags-tooltip
|
||||||
|
clearable
|
||||||
|
placeholder="请选择次数"
|
||||||
|
style="width: 200px"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in 49"
|
||||||
|
:key="item"
|
||||||
|
:label="item + 1 + '次'"
|
||||||
|
:value="item + 1"
|
||||||
|
></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="负荷数据">
|
<el-form-item label="负荷数据">
|
||||||
<el-select v-model="form.loadDataId" clearable filterable placeholder="请选择负荷数据" style="width: 200px"
|
<el-select
|
||||||
size="small">
|
v-model="form.loadDataId"
|
||||||
<el-option v-for="item in loadDataOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
clearable
|
||||||
|
filterable
|
||||||
|
placeholder="请选择负荷数据"
|
||||||
|
style="width: 200px"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in loadDataOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.id"
|
||||||
|
></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<!-- <el-button type="primary" icon="el-icon-Plus" @click="push('/admin/division/aListOfLoadData')">
|
<!-- <el-button type="primary" icon="el-icon-Plus" @click="push('/admin/division/aListOfLoadData')">
|
||||||
新增
|
新增
|
||||||
</el-button> -->
|
</el-button> -->
|
||||||
<el-button type="primary" :icon="Select" @click="submit" size="small">确定</el-button>
|
<el-button type="primary" :icon="Select" @click="submit" size="small"
|
||||||
|
>确定</el-button
|
||||||
|
>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<el-tabs v-model="activeName" v-if="showTabs" style="height: 740px">
|
<el-tabs v-model="activeName" v-if="showTabs" style="height: 740px">
|
||||||
<el-tab-pane v-for="(item, index) in tabList" :key="item" :label="item.label" :name="index"
|
<el-tab-pane
|
||||||
style="height: 100%">
|
v-for="(item, index) in tabList"
|
||||||
|
:key="item"
|
||||||
|
:label="item.label"
|
||||||
|
:name="index"
|
||||||
|
style="height: 100%"
|
||||||
|
>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<div>
|
||||||
<span style="color: #fff">时间范围</span>
|
<span style="color: #fff">时间范围</span>
|
||||||
<el-date-picker v-model="item.time" class="mr10 ml10" type="daterange" start-placeholder="起始时间"
|
<el-date-picker
|
||||||
end-placeholder="结束时间" format="YYYY-MM-DD" date-format="YYYY-MM-DD" time-format="YYYY-MM-DD"
|
v-model="time"
|
||||||
value-format="YYYY-MM-DD" :disabled-date="handleDisabledDate" size="small" />
|
class="mr10 ml10"
|
||||||
<el-button type="primary" :icon="CaretRight" @click="execute(item, index)" size="small">
|
type="daterange"
|
||||||
|
start-placeholder="起始时间"
|
||||||
|
end-placeholder="结束时间"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
date-format="YYYY-MM-DD"
|
||||||
|
time-format="YYYY-MM-DD"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
:disabled-date="handleDisabledDate"
|
||||||
|
size="small"
|
||||||
|
/>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:icon="CaretRight"
|
||||||
|
@click="execute(item, index)"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
执行
|
执行
|
||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="item.showEcahr == 1" class="harmonicButton">
|
<div v-if="item.showEcahr == 1" class="harmonicButton">
|
||||||
<el-form :inline="true" v-model="item.form">
|
<el-form :inline="true" v-model="item.form">
|
||||||
<el-form-item label="限值" v-if="item.showDynamic">
|
<el-form-item label="限值" v-if="item.showDynamic">
|
||||||
<el-input v-model="item.form.limit" placeholder="请选择限值" disabled style="width: 200px" size="small">
|
<el-input
|
||||||
|
v-model="item.form.limit"
|
||||||
|
placeholder="请选择限值"
|
||||||
|
disabled
|
||||||
|
style="width: 200px"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
<template #append>
|
<template #append>
|
||||||
<el-button :icon="Edit" :class="[code == 0 ? 'frontBox' : '']" @click="setCode(0)" size="small" />
|
<el-button
|
||||||
|
:icon="Edit"
|
||||||
|
:class="[code == 0 ? 'frontBox' : '']"
|
||||||
|
@click="setCode(0)"
|
||||||
|
size="small"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="时间点一" v-if="item.showDynamic">
|
<el-form-item label="时间点一" v-if="item.showDynamic">
|
||||||
<el-input v-model="item.form.time1" placeholder="请选择时间点一" disabled style="width: 200px" size="small">
|
<el-input
|
||||||
|
v-model="item.form.time1"
|
||||||
|
placeholder="请选择时间点一"
|
||||||
|
disabled
|
||||||
|
style="width: 200px"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
<template #append>
|
<template #append>
|
||||||
<el-button :icon="Edit" :class="[code == 1 ? 'frontBox' : '']" @click="setCode(1)" size="small" />
|
<el-button
|
||||||
|
:icon="Edit"
|
||||||
|
:class="[code == 1 ? 'frontBox' : '']"
|
||||||
|
@click="setCode(1)"
|
||||||
|
size="small"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="时间点二" v-if="item.showDynamic">
|
<el-form-item label="时间点二" v-if="item.showDynamic">
|
||||||
<el-input v-model="item.form.time2" placeholder="请选择时间点二" disabled style="width: 200px" size="small">
|
<el-input
|
||||||
|
v-model="item.form.time2"
|
||||||
|
placeholder="请选择时间点二"
|
||||||
|
disabled
|
||||||
|
style="width: 200px"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
<template #append>
|
<template #append>
|
||||||
<el-button :icon="Edit" :class="[code == 2 ? 'frontBox' : '']" @click="setCode(2)" size="small" />
|
<el-button
|
||||||
|
:icon="Edit"
|
||||||
|
:class="[code == 2 ? 'frontBox' : '']"
|
||||||
|
@click="setCode(2)"
|
||||||
|
size="small"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-button type="primary" :icon="Document" @click="generateFn" v-if="!item.showDynamic" size="small">
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:icon="Document"
|
||||||
|
@click="generateFn"
|
||||||
|
v-if="!item.showDynamic"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
生成动态谐波责任数据
|
生成动态谐波责任数据
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button type="primary" :icon="Document" v-else @click="generateMetrics" size="small">
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:icon="Document"
|
||||||
|
v-else
|
||||||
|
@click="generateMetrics"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
生成谐波责任指标
|
生成谐波责任指标
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="box" v-loading="loading" element-loading-background="#343849c7">
|
<div
|
||||||
<MyEChart :options="item.options" v-if="item.showEcahr == 1" @group="group" />
|
class="box"
|
||||||
<el-empty description="时间范围内无谐波数据" v-if="item.showEcahr == 2" />
|
v-loading="loading"
|
||||||
|
element-loading-background="#343849c7"
|
||||||
|
>
|
||||||
|
<MyEChart
|
||||||
|
:options="item.options"
|
||||||
|
v-if="item.showEcahr == 1"
|
||||||
|
@group="group"
|
||||||
|
/>
|
||||||
|
<el-empty
|
||||||
|
description="时间范围内无谐波数据"
|
||||||
|
v-if="item.showEcahr == 2"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<!-- 生成动态谐波责任数据 -->
|
<!-- 生成动态谐波责任数据 -->
|
||||||
<div class="box boxTab" v-loading="loading1" element-loading-background="#343849c7">
|
<div
|
||||||
<MyEChart :options="item.dynamicOptions" style="flex: 1" v-if="item.showDynamic" />
|
class="box boxTab"
|
||||||
<div style="width: 500px" v-if="item.showDynamic" class="tableBox">
|
v-loading="loading1"
|
||||||
<el-table :scrollbar-always-on="true" ref="tableRef" :data="item.dynamicData" height="280px"
|
element-loading-background="#343849c7"
|
||||||
size="small" :header-cell-style="{ textAlign: 'center' }" border>
|
>
|
||||||
<el-table-column prop="customerName" align="center" label="用户名(用户号)" />
|
<MyEChart
|
||||||
<el-table-column prop="responsibilityData" align="center" label="责任数据(%)" width="120">
|
:options="item.dynamicOptions"
|
||||||
|
style="flex: 1"
|
||||||
|
v-if="item.showDynamic"
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
style="width: 500px"
|
||||||
|
v-if="item.showDynamic"
|
||||||
|
class="tableBox"
|
||||||
|
>
|
||||||
|
<el-table
|
||||||
|
:scrollbar-always-on="true"
|
||||||
|
ref="tableRef"
|
||||||
|
:data="item.dynamicData"
|
||||||
|
height="280px"
|
||||||
|
size="small"
|
||||||
|
:header-cell-style="{ textAlign: 'center' }"
|
||||||
|
border
|
||||||
|
>
|
||||||
|
<el-table-column
|
||||||
|
prop="customerName"
|
||||||
|
align="center"
|
||||||
|
label="用户名(用户号)"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
prop="responsibilityData"
|
||||||
|
align="center"
|
||||||
|
label="责任数据(%)"
|
||||||
|
width="120"
|
||||||
|
>
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{
|
{{
|
||||||
Math.floor(scope.row.responsibilityData * 10000) /
|
Math.floor(scope.row.responsibilityData * 10000) / 10000
|
||||||
10000
|
|
||||||
}}
|
}}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@@ -106,7 +244,6 @@
|
|||||||
</el-tabs>
|
</el-tabs>
|
||||||
</pane>
|
</pane>
|
||||||
</splitpanes>
|
</splitpanes>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
@@ -142,6 +279,7 @@ const xAxisData = ref([]);
|
|||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const loading1 = ref(false);
|
const loading1 = ref(false);
|
||||||
const tabList: any = ref([]);
|
const tabList: any = ref([]);
|
||||||
|
const time: any = ref([]);
|
||||||
const activeName = ref(0);
|
const activeName = ref(0);
|
||||||
const xValue = ref("");
|
const xValue = ref("");
|
||||||
const showTabs = ref(false);
|
const showTabs = ref(false);
|
||||||
@@ -158,8 +296,7 @@ const handleNodeClick = (data: any) => {
|
|||||||
dotList.value = data;
|
dotList.value = data;
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
emit("setTitle", data.alias);
|
emit("setTitle", data.alias);
|
||||||
}, 0)
|
}, 0);
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -201,11 +338,12 @@ const submit = () => {
|
|||||||
showTabs.value = true;
|
showTabs.value = true;
|
||||||
let list = JSON.parse(JSON.stringify(form.index)).sort((a, b) => a - b);
|
let list = JSON.parse(JSON.stringify(form.index)).sort((a, b) => a - b);
|
||||||
tabList.value = [];
|
tabList.value = [];
|
||||||
|
time.value = [timeList.startTime, timeList.endTime];
|
||||||
list.forEach((item: any) => {
|
list.forEach((item: any) => {
|
||||||
tabList.value.push({
|
tabList.value.push({
|
||||||
label: item + "次谐波",
|
label: item + "次谐波",
|
||||||
key: item,
|
key: item,
|
||||||
time: [timeList.startTime, timeList.endTime],
|
time: [],
|
||||||
showExecute: false,
|
showExecute: false,
|
||||||
form: {
|
form: {
|
||||||
limit: "",
|
limit: "",
|
||||||
@@ -230,8 +368,8 @@ const execute = async (item: any, index: number) => {
|
|||||||
tabList.value[activeName.value].showDynamic = false;
|
tabList.value[activeName.value].showDynamic = false;
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
await getHistoryHarmData({
|
await getHistoryHarmData({
|
||||||
searchBeginTime: item.time[0],
|
searchBeginTime: time.value[0],
|
||||||
searchEndTime: item.time[1],
|
searchEndTime: time.value[1],
|
||||||
type: form.type,
|
type: form.type,
|
||||||
time: item.key,
|
time: item.key,
|
||||||
lineId: dotList.value.id,
|
lineId: dotList.value.id,
|
||||||
@@ -616,10 +754,6 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
openDialog,
|
openDialog,
|
||||||
});
|
});
|
||||||
@@ -683,7 +817,7 @@ defineExpose({
|
|||||||
}
|
}
|
||||||
|
|
||||||
&:after {
|
&:after {
|
||||||
background-color: #fffFFF80 !important;
|
background-color: #ffffff80 !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -697,6 +831,5 @@ defineExpose({
|
|||||||
right: 10px;
|
right: 10px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -307,7 +307,7 @@ import {
|
|||||||
nextTick,
|
nextTick,
|
||||||
onBeforeUnmount,
|
onBeforeUnmount,
|
||||||
} from "vue";
|
} from "vue";
|
||||||
import { ElMessage,ElMessageBox } from "element-plus";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
import {
|
import {
|
||||||
eventSource,
|
eventSource,
|
||||||
eventAggregation,
|
eventAggregation,
|
||||||
@@ -321,6 +321,7 @@ import {
|
|||||||
harmOneImage,
|
harmOneImage,
|
||||||
hasUpEventList,
|
hasUpEventList,
|
||||||
} from "@/api/manage_wx/index";
|
} from "@/api/manage_wx/index";
|
||||||
|
|
||||||
import { HelpFilled, Aim, Memo } from "@element-plus/icons-vue";
|
import { HelpFilled, Aim, Memo } from "@element-plus/icons-vue";
|
||||||
const flag = ref(0); // 0 for 暂降, 1 for 谐波, 2 for 谐波放大
|
const flag = ref(0); // 0 for 暂降, 1 for 谐波, 2 for 谐波放大
|
||||||
const time = ref(0); // 0 for 周, 1 for 月
|
const time = ref(0); // 0 for 周, 1 for 月
|
||||||
@@ -610,7 +611,11 @@ const handleChartClick = (params: any) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// 定义 emit
|
// 定义 emit
|
||||||
const emit = defineEmits(["flag-changed", "expand-detail"]);
|
const emit = defineEmits([
|
||||||
|
"flag-changed",
|
||||||
|
"expand-detail",
|
||||||
|
"refresh-security-detail",
|
||||||
|
]);
|
||||||
|
|
||||||
watch(flag, (newVal) => {
|
watch(flag, (newVal) => {
|
||||||
// 向父组件发送 flag 变化事件
|
// 向父组件发送 flag 变化事件
|
||||||
@@ -686,13 +691,42 @@ const initialAggregation = () => {
|
|||||||
|
|
||||||
// 提取发送消息到iframe的公共方法
|
// 提取发送消息到iframe的公共方法
|
||||||
const sendMessageToIframe = (type: string, payload: any) => {
|
const sendMessageToIframe = (type: string, payload: any) => {
|
||||||
window.parent.postMessage(
|
// console.log(123,store.state.iframeLoad);
|
||||||
{
|
|
||||||
type,
|
// window.parent.postMessage(
|
||||||
payload,
|
// {
|
||||||
},
|
// type,
|
||||||
"*"
|
// payload,
|
||||||
);
|
// },
|
||||||
|
// "*"
|
||||||
|
// );
|
||||||
|
// 如果 iframe 已加载完成，直接发送消息
|
||||||
|
if (store.state.iframeLoad) {
|
||||||
|
window.parent.postMessage(
|
||||||
|
{
|
||||||
|
type,
|
||||||
|
payload,
|
||||||
|
},
|
||||||
|
"*" // 建议替换为具体域名，如 'https://父页面域名'
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 如果未加载完成，每 1 秒尝试发送一次
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
console.log("等待 iframe 加载，1 秒后重试...");
|
||||||
|
if (store.state.iframeLoad) {
|
||||||
|
// 加载完成后发送消息并清除定时器
|
||||||
|
window.parent.postMessage(
|
||||||
|
{
|
||||||
|
type,
|
||||||
|
payload,
|
||||||
|
},
|
||||||
|
"*" // 建议替换为具体域名
|
||||||
|
);
|
||||||
|
clearInterval(interval);
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
};
|
};
|
||||||
|
|
||||||
// 闪烁点
|
// 闪烁点
|
||||||
@@ -715,7 +749,7 @@ const initHasEventList = () => {
|
|||||||
|
|
||||||
const dataObject = {
|
const dataObject = {
|
||||||
eventList: [...eventList.value],
|
eventList: [...eventList.value],
|
||||||
color: "#7ac1f9",
|
color: "#375db4",
|
||||||
};
|
};
|
||||||
|
|
||||||
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
||||||
@@ -751,8 +785,8 @@ const initHasUpEventList = () => {
|
|||||||
|
|
||||||
const dataObject = {
|
const dataObject = {
|
||||||
eventList: [...eventList.value],
|
eventList: [...eventList.value],
|
||||||
color: "#fcfc57",
|
color: "#f08a0a",
|
||||||
flagValue: '2',
|
flagValue: "2",
|
||||||
};
|
};
|
||||||
|
|
||||||
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
||||||
@@ -819,14 +853,13 @@ const analysisClick = (row: any) => {
|
|||||||
maxResponsibilityMonitorId.value = res.data
|
maxResponsibilityMonitorId.value = res.data
|
||||||
.filter((item) => item.isImport == 1)
|
.filter((item) => item.isImport == 1)
|
||||||
.map((item) => item.lineId); // 筛选 isImport 为 1
|
.map((item) => item.lineId); // 筛选 isImport 为 1
|
||||||
console.log(maxResponsibilityMonitorId.value, "890jhuj");
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const dataObject = {
|
const dataObject = {
|
||||||
eventList: [...eventList.value],
|
eventList: [...eventList.value],
|
||||||
color: "#fcfc57",
|
color: "#03de6d",
|
||||||
maxResponsibilityMonitorId: [...maxResponsibilityMonitorId.value],
|
maxResponsibilityMonitorId: [...maxResponsibilityMonitorId.value],
|
||||||
maxColor: "#ff0000",
|
maxColor: "#f9065b",
|
||||||
};
|
};
|
||||||
|
|
||||||
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
// 发送eventList数据到iframe，注意发送的是.value而不是响应式对象本身
|
||||||
@@ -921,10 +954,13 @@ const initialResponsibilityList = () => {
|
|||||||
}
|
}
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
}
|
}
|
||||||
|
// 通知父组件刷新 manage/securityDetail.vue 中的数据
|
||||||
|
emit("refresh-security-detail");
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
traceabilityTableData.value = [];
|
traceabilityTableData.value = [];
|
||||||
defaultCurrentRowKey.value = null;
|
defaultCurrentRowKey.value = null;
|
||||||
|
loading.value = false;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -1150,11 +1186,11 @@ const callHarmOneImageApi = (row: any, selectedTime: string) => {
|
|||||||
const dataObject = {
|
const dataObject = {
|
||||||
eventListAll: [JSON.parse(JSON.stringify(eventListAll.value))],
|
eventListAll: [JSON.parse(JSON.stringify(eventListAll.value))],
|
||||||
eventList: [...eventList.value],
|
eventList: [...eventList.value],
|
||||||
color: "#fcfc57",
|
color: "#cf552d",
|
||||||
maxResponsibilityMonitorId: [...maxResponsibilityMonitorId.value],
|
maxResponsibilityMonitorId: [...maxResponsibilityMonitorId.value],
|
||||||
maxColor: "#ff0000",
|
maxColor: "#c708fe",
|
||||||
backgroundPointId: [...backgroundPoint.value],
|
backgroundPointId: [...backgroundPoint.value],
|
||||||
backgroundPointColor: "#03df6d",
|
backgroundPointColor: "#0936f4",
|
||||||
};
|
};
|
||||||
// 发送所有 monitorId 数据到 iframe
|
// 发送所有 monitorId 数据到 iframe
|
||||||
sendMessageToIframe("SEND_KEYS_TO_IFRAME", dataObject);
|
sendMessageToIframe("SEND_KEYS_TO_IFRAME", dataObject);
|
||||||
|
|||||||
@@ -89,7 +89,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<span style="color: #fff">时间范围</span>
|
<span style="color: #fff">时间范围</span>
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="item.time"
|
v-model="time"
|
||||||
class="mr10 ml10"
|
class="mr10 ml10"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
start-placeholder="起始时间"
|
start-placeholder="起始时间"
|
||||||
@@ -292,6 +292,7 @@ const xAxisData = ref([]);
|
|||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const loading1 = ref(false);
|
const loading1 = ref(false);
|
||||||
const tabList: any = ref([]);
|
const tabList: any = ref([]);
|
||||||
|
const time: any = ref([]);
|
||||||
const activeName = ref(0);
|
const activeName = ref(0);
|
||||||
const xValue = ref("");
|
const xValue = ref("");
|
||||||
const showTabs = ref(false);
|
const showTabs = ref(false);
|
||||||
@@ -394,6 +395,7 @@ const submit = () => {
|
|||||||
showTabs.value = true;
|
showTabs.value = true;
|
||||||
let list = JSON.parse(JSON.stringify(form.index)).sort((a, b) => a - b);
|
let list = JSON.parse(JSON.stringify(form.index)).sort((a, b) => a - b);
|
||||||
tabList.value = [];
|
tabList.value = [];
|
||||||
|
|
||||||
list.forEach((item: any) => {
|
list.forEach((item: any) => {
|
||||||
tabList.value.push({
|
tabList.value.push({
|
||||||
label: item + "次谐波",
|
label: item + "次谐波",
|
||||||
@@ -418,14 +420,14 @@ const submit = () => {
|
|||||||
|
|
||||||
// 执行
|
// 执行
|
||||||
const execute = async (item: any, index: number) => {
|
const execute = async (item: any, index: number) => {
|
||||||
if (item.time == undefined) {
|
if (time.value == undefined || time.value.length == 0) {
|
||||||
return ElMessage.warning("请选择时间范围");
|
return ElMessage.warning("请选择时间范围");
|
||||||
}
|
}
|
||||||
tabList.value[activeName.value].showDynamic = false;
|
tabList.value[activeName.value].showDynamic = false;
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
await getHistoryHarmData({
|
await getHistoryHarmData({
|
||||||
searchBeginTime: item.time[0],
|
searchBeginTime: time.value[0],
|
||||||
searchEndTime: item.time[1],
|
searchEndTime: time.value[1],
|
||||||
type: form.type,
|
type: form.type,
|
||||||
time: item.key,
|
time: item.key,
|
||||||
lineId: dotList.value.id,
|
lineId: dotList.value.id,
|
||||||
|
|||||||
@@ -1,14 +1,23 @@
|
|||||||
<!-- 谐波放大表格详情 -->
|
<!-- 谐波放大表格详情 -->
|
||||||
<template>
|
<template>
|
||||||
<el-dialog v-model="visible" :close-on-click-modal="false" title="趋势图" draggable width="70%"
|
<el-dialog
|
||||||
@close="handleCloseDialog">
|
v-model="visible"
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
title="趋势图"
|
||||||
|
draggable
|
||||||
|
width="70%"
|
||||||
|
@close="handleCloseDialog"
|
||||||
|
>
|
||||||
<el-radio-group v-model="condition" size="small" @change="init">
|
<el-radio-group v-model="condition" size="small" @change="init">
|
||||||
<el-radio-button label="谐波电压" value="42" />
|
<el-radio-button label="谐波电压" value="42" />
|
||||||
<el-radio-button label="谐波电流" value="43" />
|
<el-radio-button label="谐波电流" value="43" />
|
||||||
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
<MyEChart v-loading="loading" element-loading-background="rgba(122, 122, 122, 0.8)" :options="list[0]?.option"
|
<MyEChart
|
||||||
:style="`height:670px`" />
|
v-loading="loading"
|
||||||
|
element-loading-background="rgba(122, 122, 122, 0.8)"
|
||||||
|
:options="list[0]?.option"
|
||||||
|
:style="`height:670px`"
|
||||||
|
/>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -25,13 +34,13 @@ const options = ref<any>(null);
|
|||||||
const list = ref<any>([]);
|
const list = ref<any>([]);
|
||||||
const traceability = ref<any>([]);
|
const traceability = ref<any>([]);
|
||||||
const rowData: any = ref({});
|
const rowData: any = ref({});
|
||||||
const condition: any = ref('42');
|
const condition: any = ref("42");
|
||||||
|
|
||||||
const open = async (row: any) => {
|
const open = async (row: any) => {
|
||||||
rowData.value = row;
|
rowData.value = row;
|
||||||
condition.value = '42';
|
condition.value = "42";
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
init()
|
init();
|
||||||
};
|
};
|
||||||
const init = async () => {
|
const init = async () => {
|
||||||
list.value = [];
|
list.value = [];
|
||||||
@@ -48,7 +57,7 @@ const init = async () => {
|
|||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
shujuchuli(res);
|
shujuchuli(res);
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
const shujuchuli = (res: any) => {
|
const shujuchuli = (res: any) => {
|
||||||
list.value = [];
|
list.value = [];
|
||||||
let shujuData = res.data;
|
let shujuData = res.data;
|
||||||
@@ -56,9 +65,13 @@ const shujuchuli = (res: any) => {
|
|||||||
//判断是否存在暂降点
|
//判断是否存在暂降点
|
||||||
|
|
||||||
if (item.eventDetail == null) {
|
if (item.eventDetail == null) {
|
||||||
let [min, max] = yMethod([item.minValue, item.maxValue, condition.value == '42' ? rowData.value.vavgValue : rowData.value.vavgValue.iavgValue]
|
let [min, max] = yMethod([
|
||||||
|
item.minValue,
|
||||||
);
|
item.maxValue,
|
||||||
|
condition.value == "42"
|
||||||
|
? rowData.value.vavgValue
|
||||||
|
: rowData.value.vavgValue.iavgValue,
|
||||||
|
]);
|
||||||
//判断是否有限值(有上下限)
|
//判断是否有限值(有上下限)
|
||||||
if (item.topLimit !== 0 && item.lowerLimit !== 0) {
|
if (item.topLimit !== 0 && item.lowerLimit !== 0) {
|
||||||
item.phaiscType.push("上限");
|
item.phaiscType.push("上限");
|
||||||
@@ -107,7 +120,14 @@ const shujuchuli = (res: any) => {
|
|||||||
}
|
}
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -147,7 +167,14 @@ const shujuchuli = (res: any) => {
|
|||||||
}
|
}
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -163,7 +190,14 @@ const shujuchuli = (res: any) => {
|
|||||||
} else {
|
} else {
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -223,7 +257,14 @@ const shujuchuli = (res: any) => {
|
|||||||
}
|
}
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -260,7 +301,14 @@ const shujuchuli = (res: any) => {
|
|||||||
}
|
}
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -274,7 +322,14 @@ const shujuchuli = (res: any) => {
|
|||||||
} else {
|
} else {
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -330,7 +385,14 @@ const shujuchuli = (res: any) => {
|
|||||||
|
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -361,7 +423,14 @@ const shujuchuli = (res: any) => {
|
|||||||
}
|
}
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -374,7 +443,14 @@ const shujuchuli = (res: any) => {
|
|||||||
} else {
|
} else {
|
||||||
let shuju = {
|
let shuju = {
|
||||||
id: "qushifenx" + i,
|
id: "qushifenx" + i,
|
||||||
title: item.lineName + "--" + item.targetName,
|
title:
|
||||||
|
item.lineName +
|
||||||
|
"--" +
|
||||||
|
item.targetName +
|
||||||
|
"--" +
|
||||||
|
"谐波次数_" +
|
||||||
|
item.harmNum +
|
||||||
|
"次",
|
||||||
targetName: item.targetName,
|
targetName: item.targetName,
|
||||||
legend: item.phaiscType,
|
legend: item.phaiscType,
|
||||||
valueName: item.unit[0],
|
valueName: item.unit[0],
|
||||||
@@ -460,31 +536,65 @@ const rendering = () => {
|
|||||||
if (item.valueName == undefined) {
|
if (item.valueName == undefined) {
|
||||||
item.valueName = "无";
|
item.valueName = "无";
|
||||||
}
|
}
|
||||||
opitonserise[0].markLine = {
|
opitonserise = opitonserise.map((item) => {
|
||||||
itemStyle: {
|
item.markLine = {
|
||||||
normal: {
|
itemStyle: {
|
||||||
lineStyle: {
|
normal: {
|
||||||
type: "dashed", //dotted、solid
|
lineStyle: {
|
||||||
color: "#FF33FF",
|
type: "dashed", //dotted、solid
|
||||||
width: 2,
|
color: "#FF33FF",
|
||||||
|
width: 2,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
label: {
|
||||||
label: {
|
normal: {
|
||||||
normal: {
|
color: "#fff",
|
||||||
color: "#fff",
|
formatter: function (params) {
|
||||||
formatter: function (params) {
|
return `标准值`;
|
||||||
return `标准值`;
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
data: [
|
||||||
data: [
|
{
|
||||||
{
|
name: "标准值",
|
||||||
name: "标准值",
|
yAxis:
|
||||||
yAxis: condition.value == '42' ? rowData.value.vavgValue : rowData.value.iavgValue,
|
condition.value == "42"
|
||||||
},
|
? rowData.value.vavgValue
|
||||||
],
|
: rowData.value.iavgValue,
|
||||||
};
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
// opitonserise[0].markLine = {
|
||||||
|
// itemStyle: {
|
||||||
|
// normal: {
|
||||||
|
// lineStyle: {
|
||||||
|
// type: "dashed", //dotted、solid
|
||||||
|
// color: "#FF33FF",
|
||||||
|
// width: 2,
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// label: {
|
||||||
|
// normal: {
|
||||||
|
// color: "#fff",
|
||||||
|
// formatter: function (params) {
|
||||||
|
// return `标准值`;
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// data: [
|
||||||
|
// {
|
||||||
|
// name: "标准值",
|
||||||
|
// yAxis:
|
||||||
|
// condition.value == "42"
|
||||||
|
// ? rowData.value.vavgValue
|
||||||
|
// : rowData.value.iavgValue,
|
||||||
|
// },
|
||||||
|
// ],
|
||||||
|
// };
|
||||||
// console.log("🚀 ~ rendering ~ row.value:", rowData.value);
|
// console.log("🚀 ~ rendering ~ row.value:", rowData.value);
|
||||||
|
|
||||||
// console.log("🚀 ~ rendering ~ opitonserise:", opitonserise);
|
// console.log("🚀 ~ rendering ~ opitonserise:", opitonserise);
|
||||||
@@ -495,7 +605,7 @@ const rendering = () => {
|
|||||||
};
|
};
|
||||||
const getEcharts = () => {
|
const getEcharts = () => {
|
||||||
list.value.forEach((item: any, i: number) => {
|
list.value.forEach((item: any, i: number) => {
|
||||||
console.log("🚀 ~ getEcharts ~ item:", item)
|
console.log("🚀 ~ getEcharts ~ item:", item);
|
||||||
item.option = {
|
item.option = {
|
||||||
backgroundColor: "#fff",
|
backgroundColor: "#fff",
|
||||||
title: {
|
title: {
|
||||||
@@ -596,7 +706,6 @@ const getEcharts = () => {
|
|||||||
max: item.maxValue,
|
max: item.maxValue,
|
||||||
name: item.valueName,
|
name: item.valueName,
|
||||||
|
|
||||||
|
|
||||||
axisLine: {
|
axisLine: {
|
||||||
show: true,
|
show: true,
|
||||||
onZero: false, //-----------重点
|
onZero: false, //-----------重点
|
||||||
|
|||||||
@@ -64,7 +64,7 @@ import { clickImage, realTimeData } from "@/api/manage_wx";
|
|||||||
import { Close } from "@element-plus/icons-vue";
|
import { Close } from "@element-plus/icons-vue";
|
||||||
import socketClient from "@/utils/webSocketClient";
|
import socketClient from "@/utils/webSocketClient";
|
||||||
import DipDetail from "../eventStatistics/dipDetail.vue";
|
import DipDetail from "../eventStatistics/dipDetail.vue";
|
||||||
|
import { useStore } from "vuex";
|
||||||
// 定义接收的 props
|
// 定义接收的 props
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
eventList?: [];
|
eventList?: [];
|
||||||
@@ -111,7 +111,7 @@ const corners = ref([
|
|||||||
// },
|
// },
|
||||||
]);
|
]);
|
||||||
const steadyStateList = ref([]);
|
const steadyStateList = ref([]);
|
||||||
|
const store = useStore();
|
||||||
const selectedId = ref("");
|
const selectedId = ref("");
|
||||||
|
|
||||||
// 内部响应式数据
|
// 内部响应式数据
|
||||||
@@ -128,7 +128,11 @@ const handleClickImage = async (elementId: string) => {
|
|||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
// 发送点击图片请求
|
// 发送点击图片请求
|
||||||
const res = await clickImage({ lineId: elementId });
|
const res = await clickImage({
|
||||||
|
lineId: elementId,
|
||||||
|
searchBeginTime: store.state.timeValue[0],
|
||||||
|
searchEndTime: store.state.timeValue[1],
|
||||||
|
});
|
||||||
|
|
||||||
// 确保返回的数据是数组格式，并且过滤掉 null/undefined 元素
|
// 确保返回的数据是数组格式，并且过滤掉 null/undefined 元素
|
||||||
let dataToStore: any[] = [];
|
let dataToStore: any[] = [];
|
||||||
|
|||||||
@@ -10,7 +10,8 @@
|
|||||||
maxlength="32"
|
maxlength="32"
|
||||||
placeholder="请输入项目名称"
|
placeholder="请输入项目名称"
|
||||||
show-word-limit
|
show-word-limit
|
||||||
style="width: 300px; margin-left: 10px"
|
clearable
|
||||||
|
style="width: 240px; margin-left: 10px"
|
||||||
size="small"
|
size="small"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -35,6 +36,8 @@
|
|||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
height: 660px;
|
height: 660px;
|
||||||
"
|
"
|
||||||
|
v-loading="loading"
|
||||||
|
:element-loading-background="'rgba(122, 122, 122, 0.8)'"
|
||||||
>
|
>
|
||||||
<el-row :gutter="12">
|
<el-row :gutter="12">
|
||||||
<el-col
|
<el-col
|
||||||
@@ -226,6 +229,7 @@ const projectData = ref([]);
|
|||||||
const dialogVisible = ref(false);
|
const dialogVisible = ref(false);
|
||||||
|
|
||||||
const innerVisible = ref(false);
|
const innerVisible = ref(false);
|
||||||
|
const loading = ref(false);
|
||||||
|
|
||||||
const projectName = ref("");
|
const projectName = ref("");
|
||||||
|
|
||||||
@@ -299,6 +303,7 @@ const sendToIframe = (type: string, data: any) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const fetachData = async () => {
|
const fetachData = async () => {
|
||||||
|
loading.value = true;
|
||||||
const res = await projectList({
|
const res = await projectList({
|
||||||
pageNum: params.pageNum,
|
pageNum: params.pageNum,
|
||||||
pageSize: params.pageSize,
|
pageSize: params.pageSize,
|
||||||
@@ -307,7 +312,7 @@ const fetachData = async () => {
|
|||||||
// projectData.splice(0, projectData.length, ...res.records);
|
// projectData.splice(0, projectData.length, ...res.records);
|
||||||
projectData.value = res.data.records;
|
projectData.value = res.data.records;
|
||||||
params.total = res.data.total;
|
params.total = res.data.total;
|
||||||
|
loading.value = false;
|
||||||
if (res.data.records.length > 0) {
|
if (res.data.records.length > 0) {
|
||||||
firstForm.value.id = res.data.records[0].id;
|
firstForm.value.id = res.data.records[0].id;
|
||||||
firstForm.value.name = res.data.records[0].name;
|
firstForm.value.name = res.data.records[0].name;
|
||||||
@@ -421,14 +426,14 @@ const onTableCurrentChange = (page: number) => {
|
|||||||
|
|
||||||
// 设计
|
// 设计
|
||||||
const Aclick = (e: any) => {
|
const Aclick = (e: any) => {
|
||||||
// window.open("http://192.168.1.179:4001" + `/zutai/?id=${e.id}&&name=decodeURI(${e.name})&&flag=false`)
|
// window.open( window.location.origin + `/zutai/?id=${e.id}&&name=decodeURI(${e.name})&&flag=false`)
|
||||||
// window.open(
|
// window.open(
|
||||||
// window.location.origin +
|
// window.location.origin +
|
||||||
// `/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=true`
|
// `/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=true`
|
||||||
// );
|
// );
|
||||||
// 无锡项目进去不展示数据绑定图元
|
// 无锡项目进去不展示数据绑定图元
|
||||||
window.open(
|
window.open(
|
||||||
"http://192.168.1.179:4001" +
|
window.location.origin +
|
||||||
`/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=wx`
|
`/zutai/?id=${e.id}&&name=${e.name}&&preview=false&&graphicDisplay=wx`
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@@ -470,7 +475,7 @@ const imgData = (e: any) => {
|
|||||||
// `/zutai/?id=${e.id}&&name=${e.name}&&preview=true#/preview`
|
// `/zutai/?id=${e.id}&&name=${e.name}&&preview=true#/preview`
|
||||||
// );
|
// );
|
||||||
window.open(
|
window.open(
|
||||||
"http://192.168.1.179:4001" +
|
window.location.origin +
|
||||||
`/zutai/?id=${e.id}&&name=${e.name}&&preview=true&&graphicDisplay=wx#/preview`
|
`/zutai/?id=${e.id}&&name=${e.name}&&preview=true&&graphicDisplay=wx#/preview`
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -85,8 +85,8 @@
|
|||||||
:min="0"
|
:min="0"
|
||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
:max="100"
|
:max="100"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventValueMin = 1) : null)
|
(e) => (e == null ? (eventForm.eventValueMin = 1) : null)
|
||||||
"
|
"
|
||||||
@@ -101,8 +101,8 @@
|
|||||||
:min="0"
|
:min="0"
|
||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
:max="100"
|
:max="100"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventValueMax = 1) : null)
|
(e) => (e == null ? (eventForm.eventValueMax = 1) : null)
|
||||||
"
|
"
|
||||||
@@ -117,13 +117,13 @@
|
|||||||
:min="0"
|
:min="0"
|
||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
:max="1000000"
|
:max="1000000"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventDurationMin = 1) : null)
|
(e) => (e == null ? (eventForm.eventDurationMin = 1) : null)
|
||||||
"
|
"
|
||||||
><template #suffix>
|
><template #suffix>
|
||||||
<span>ms</span>
|
<span>s</span>
|
||||||
</template></el-input-number
|
</template></el-input-number
|
||||||
>
|
>
|
||||||
<span> < 持续时间 < </span>
|
<span> < 持续时间 < </span>
|
||||||
@@ -133,13 +133,13 @@
|
|||||||
:min="0"
|
:min="0"
|
||||||
style="width: 150px"
|
style="width: 150px"
|
||||||
:max="1000000"
|
:max="1000000"
|
||||||
:precision="1"
|
:precision="2"
|
||||||
:step="1"
|
:step="0.1"
|
||||||
@change="
|
@change="
|
||||||
(e) => (e == null ? (eventForm.eventDurationMax = 1) : null)
|
(e) => (e == null ? (eventForm.eventDurationMax = 1) : null)
|
||||||
"
|
"
|
||||||
><template #suffix>
|
><template #suffix>
|
||||||
<span>ms</span>
|
<span>s</span>
|
||||||
</template></el-input-number
|
</template></el-input-number
|
||||||
>
|
>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@@ -225,7 +225,7 @@
|
|||||||
<el-table-column
|
<el-table-column
|
||||||
prop="duration"
|
prop="duration"
|
||||||
align="center"
|
align="center"
|
||||||
label="持续时间(S)"
|
label="持续时间(s)"
|
||||||
width="100"
|
width="100"
|
||||||
/>
|
/>
|
||||||
<el-table-column fixed="right" label="操作" width="100" align="center">
|
<el-table-column fixed="right" label="操作" width="100" align="center">
|
||||||
@@ -526,6 +526,7 @@ const loading = ref(false);
|
|||||||
|
|
||||||
const trendChartRef = ref();
|
const trendChartRef = ref();
|
||||||
|
|
||||||
|
|
||||||
// 页码
|
// 页码
|
||||||
const params = reactive({
|
const params = reactive({
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
@@ -800,7 +801,7 @@ const exportTable_0 = async () => {
|
|||||||
"用户",
|
"用户",
|
||||||
"触发类型",
|
"触发类型",
|
||||||
"残余电压(%)",
|
"残余电压(%)",
|
||||||
"持续时间(S)",
|
"持续时间(s)",
|
||||||
],
|
],
|
||||||
];
|
];
|
||||||
|
|
||||||
@@ -945,9 +946,14 @@ const init = () => {
|
|||||||
eventList();
|
eventList();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const refreshResponsibilityList = () => {
|
||||||
|
initialResponsibilityList();
|
||||||
|
};
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
init,
|
init,
|
||||||
setShowDetail, // 暴露方法给父组件调用
|
setShowDetail, // 暴露方法给父组件调用
|
||||||
|
refreshResponsibilityList
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -1,14 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="plan">
|
<div class="plan">
|
||||||
<!-- src=" http://192.168.1.128:3001/zutai/?id=44368e72a2e594d14ebaf317f0f6ad00&&name=decodeURI(APP测试项目)&&flag=true&&wxqr=true#/" -->
|
<bdMap
|
||||||
<!-- <iframe
|
v-show="store.state.showMap"
|
||||||
src="http://192.168.1.62:8088/zutai/?id=0944fe372e90daeefd040916a105ac8b&&name=测试组态编辑器&&preview=true#/preview"
|
|
||||||
width="100%"
|
width="100%"
|
||||||
height="100%"
|
height="100%"
|
||||||
frameborder="0"
|
@pointClick="pointClick"
|
||||||
></iframe> -->
|
></bdMap>
|
||||||
|
|
||||||
<!-- 添加加载事件监听 -->
|
<!-- 添加加载事件监听 -->
|
||||||
<iframe
|
<iframe
|
||||||
|
v-if="!store.state.showMap"
|
||||||
:src="iframeSrc"
|
:src="iframeSrc"
|
||||||
width="100%"
|
width="100%"
|
||||||
height="100%"
|
height="100%"
|
||||||
@@ -17,12 +18,18 @@
|
|||||||
id="iframeLeft"
|
id="iframeLeft"
|
||||||
@load="onIframeLoad"
|
@load="onIframeLoad"
|
||||||
></iframe>
|
></iframe>
|
||||||
|
<el-button class="backButton" @click="backButton" size="small" :icon="Back"
|
||||||
|
>返回</el-button
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch, onMounted, onUnmounted } from "vue";
|
import { ref, watch, onMounted, onUnmounted } from "vue";
|
||||||
import { getActive } from "@/api/manage_wx/index";
|
import { getActive } from "@/api/manage_wx/index";
|
||||||
|
import { Back } from "@element-plus/icons-vue";
|
||||||
|
import bdMap from "./bdMap.vue";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
const store = useStore();
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
project: { id: string; name: string } | null;
|
project: { id: string; name: string } | null;
|
||||||
}>();
|
}>();
|
||||||
@@ -36,7 +43,8 @@ watch(
|
|||||||
if (newVal && newVal.id && newVal.name) {
|
if (newVal && newVal.id && newVal.name) {
|
||||||
// window.location.origin
|
// window.location.origin
|
||||||
iframeSrc.value =
|
iframeSrc.value =
|
||||||
"http://192.168.1.179:4001" +
|
window.location.origin +
|
||||||
|
// "http://192.168.1.128:4001" +
|
||||||
`/zutai/?id=${newVal.id}&&name=${encodeURIComponent(
|
`/zutai/?id=${newVal.id}&&name=${encodeURIComponent(
|
||||||
newVal.name
|
newVal.name
|
||||||
)}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
|
)}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
|
||||||
@@ -46,22 +54,37 @@ watch(
|
|||||||
},
|
},
|
||||||
{ immediate: true, deep: true }
|
{ immediate: true, deep: true }
|
||||||
);
|
);
|
||||||
|
// 点击监测点传入 接线图id
|
||||||
|
const pointClick = (row: any) => {
|
||||||
|
setUrl(row.pictureId, row.pictureName);
|
||||||
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 监听来自 eventStatistics 组件的消息
|
// 监听来自 eventStatistics 组件的消息
|
||||||
window.addEventListener("message", handleMessage);
|
window.addEventListener("message", handleMessage);
|
||||||
|
|
||||||
getActive({}).then((res: any) => {
|
getActive({}).then((res: any) => {
|
||||||
if (res.code == "A0000") {
|
if (res.code == "A0000") {
|
||||||
// window.location.origin
|
// window.location.origin
|
||||||
iframeSrc.value =
|
setUrl(res.data.id, res.data.name);
|
||||||
"http://192.168.1.179:4001" +
|
|
||||||
`/zutai/?id=${res.data.id}&&name=${encodeURIComponent(
|
|
||||||
res.data.name
|
|
||||||
)}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
const setUrl = (url: string, nam: string) => {
|
||||||
|
iframeSrc.value =
|
||||||
|
// window.location.origin +
|
||||||
|
"http://192.168.1.179:4001" +
|
||||||
|
`/zutai/?id=${url}&&name=${encodeURIComponent(
|
||||||
|
nam
|
||||||
|
)}&&preview=true&&display=true&&graphicDisplay=wx#/preview`;
|
||||||
|
// const iframe = document.getElementById("iframeLeft");
|
||||||
|
// if (iframe) {
|
||||||
|
// // 监听 iframe 加载完成事件
|
||||||
|
// iframe.addEventListener("load", function () {
|
||||||
|
// // 通知父页面：我已加载完毕
|
||||||
|
// store.dispatch("setStateKey", { key: "iframeLoad", value: true });
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
};
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
// 清理事件监听器
|
// 清理事件监听器
|
||||||
@@ -70,6 +93,7 @@ onUnmounted(() => {
|
|||||||
|
|
||||||
// iframe 加载完成回调 添加加载事件监听
|
// iframe 加载完成回调 添加加载事件监听
|
||||||
const onIframeLoad = () => {
|
const onIframeLoad = () => {
|
||||||
|
store.dispatch("setStateKey", { key: "iframeLoad", value: true });
|
||||||
// console.log("iframe 加载完成");
|
// console.log("iframe 加载完成");
|
||||||
// 通知 securityDetail.vue 组件 iframe 已加载完成
|
// 通知 securityDetail.vue 组件 iframe 已加载完成
|
||||||
window.postMessage(
|
window.postMessage(
|
||||||
@@ -107,7 +131,11 @@ const sendKeysToIframe = (keyList: string[]) => {
|
|||||||
); // 在生产环境中应该指定具体的域名而不是 '*'
|
); // 在生产环境中应该指定具体的域名而不是 '*'
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
// 返回地图
|
||||||
|
const backButton = () => {
|
||||||
|
window.removeEventListener("message", handleMessage);
|
||||||
|
store.dispatch("setStateKey", { key: "showMap", value: true });
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.plan {
|
.plan {
|
||||||
@@ -115,4 +143,10 @@ const sendKeysToIframe = (keyList: string[]) => {
|
|||||||
height: 990px;
|
height: 990px;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
.backButton {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -104,11 +104,11 @@
|
|||||||
/>
|
/>
|
||||||
<IframeDia
|
<IframeDia
|
||||||
:event-list="eventListData as []"
|
:event-list="eventListData as []"
|
||||||
style="position: absolute; top: 0px; right: 0px; left: 0px"
|
style="position: absolute; top: 0px; right: 0px; left: 0px;z-index: 10;"
|
||||||
/>
|
/>
|
||||||
<!-- 图元颜色提示框 -->
|
<!-- 图元颜色提示框 -->
|
||||||
<div
|
<div
|
||||||
v-if="!showDetail"
|
v-if="!store.state.showMap && !showDetail"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0px;
|
left: 0px;
|
||||||
@@ -117,36 +117,42 @@
|
|||||||
"
|
"
|
||||||
>
|
>
|
||||||
<div style="display: flex">
|
<div style="display: flex">
|
||||||
<img
|
<span class="iconfont" style="color: #7ac1f9"></span>
|
||||||
src="@/assets/icon/传输设备 (3).png"
|
|
||||||
style="width: 20px; height: 20px"
|
|
||||||
/>
|
|
||||||
<div style="margin-left: 10px; font-size: 12px">监测点</div>
|
<div style="margin-left: 10px; font-size: 12px">监测点</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex" v-if="currentFlag == 0">
|
<div style="display: flex" v-if="currentFlag == 0">
|
||||||
<img
|
<span class="iconfont blink-basic" style="color: #375db4"
|
||||||
src="@/assets/icon/传输设备 (3).png"
|
></span
|
||||||
style="width: 20px; height: 20px"
|
>
|
||||||
class="blink-basic"
|
|
||||||
/>
|
|
||||||
<div style="margin-left: 10px; font-size: 12px">
|
<div style="margin-left: 10px; font-size: 12px">
|
||||||
暂降发生测点
|
暂降发生测点
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex" v-if="currentFlag == 1">
|
<div style="display: flex" v-if="currentFlag == 1">
|
||||||
<img
|
<span class="iconfont blink-basic" style="color: #0936f4"
|
||||||
src="@/assets/icon/传输设备 (4).png"
|
></span
|
||||||
style="width: 20px; height: 20px"
|
>
|
||||||
class="blink-basic"
|
|
||||||
/>
|
|
||||||
<div style="margin-left: 10px; font-size: 12px">背景测点</div>
|
<div style="margin-left: 10px; font-size: 12px">背景测点</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex">
|
<div style="display: flex">
|
||||||
<img
|
<span
|
||||||
src="@/assets/icon/传输设备 (2).png"
|
v-if="currentFlag == 0"
|
||||||
style="width: 20px; height: 20px"
|
class="iconfont blink-basic"
|
||||||
class="blink-basic"
|
style="color: #03de6d"
|
||||||
/>
|
></span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-if="currentFlag == 1"
|
||||||
|
class="iconfont blink-basic"
|
||||||
|
style="color: #cf552d"
|
||||||
|
></span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-if="currentFlag == 2"
|
||||||
|
class="iconfont blink-basic"
|
||||||
|
style="color: #f08a0a"
|
||||||
|
></span
|
||||||
|
>
|
||||||
<div style="margin-left: 10px; font-size: 12px">
|
<div style="margin-left: 10px; font-size: 12px">
|
||||||
<span v-if="currentFlag == 0">暂降溯源关联测点</span>
|
<span v-if="currentFlag == 0">暂降溯源关联测点</span>
|
||||||
<span v-if="currentFlag == 1">责任测点</span>
|
<span v-if="currentFlag == 1">责任测点</span>
|
||||||
@@ -154,15 +160,20 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex" v-if="currentFlag != 2">
|
<div style="display: flex" v-if="currentFlag != 2">
|
||||||
<img
|
<span
|
||||||
src="@/assets/icon/传输设备 (1).png"
|
v-if="currentFlag == 0"
|
||||||
style="width: 20px; height: 20px"
|
class="iconfont blink-basic"
|
||||||
class="blink-basic"
|
style="color: #f9065b"
|
||||||
/>
|
></span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-else
|
||||||
|
class="iconfont blink-basic"
|
||||||
|
style="color: #c708fe"
|
||||||
|
></span
|
||||||
|
>
|
||||||
<div style="margin-left: 10px; font-size: 12px">
|
<div style="margin-left: 10px; font-size: 12px">
|
||||||
{{
|
{{ currentFlag == 0 ? "暂降源测点" : "责任占比最高测点" }}
|
||||||
currentFlag == 0 ? "暂降源测点" : "责任占比最高测点"
|
|
||||||
}}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -182,6 +193,7 @@
|
|||||||
@data-updated="handleDataUpdate"
|
@data-updated="handleDataUpdate"
|
||||||
@flag-changed="handleFlagChange"
|
@flag-changed="handleFlagChange"
|
||||||
@expand-detail="handleExpandDetail"
|
@expand-detail="handleExpandDetail"
|
||||||
|
@refresh-security-detail="refreshSecurityDetail"
|
||||||
/>
|
/>
|
||||||
</dv-border-box-13>
|
</dv-border-box-13>
|
||||||
<!-- <dv-border-box-13 :color="color[0]">
|
<!-- <dv-border-box-13 :color="color[0]">
|
||||||
@@ -211,6 +223,9 @@ import datePicker from "@/components/datePicker/index.vue";
|
|||||||
import Management from "./components/manage/index.vue";
|
import Management from "./components/manage/index.vue";
|
||||||
import SecurityDetail from "./components/manage/securityDetail.vue";
|
import SecurityDetail from "./components/manage/securityDetail.vue";
|
||||||
import IframeDia from "./components/manage/iframeDia.vue";
|
import IframeDia from "./components/manage/iframeDia.vue";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
|
||||||
|
const store = useStore();
|
||||||
|
|
||||||
// 传给iframe页面的参数
|
// 传给iframe页面的参数
|
||||||
const currentProject = ref<{ id: string; name: string } | null>(null);
|
const currentProject = ref<{ id: string; name: string } | null>(null);
|
||||||
@@ -263,6 +278,13 @@ const handleDataUpdate = (data: string[]) => {
|
|||||||
eventListData.value = data;
|
eventListData.value = data;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const refreshSecurityDetail = () => {
|
||||||
|
// 调用 securityDetail 组件的刷新方法
|
||||||
|
if (securityDetail.value) {
|
||||||
|
securityDetail.value.refreshResponsibilityList();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// 初始化并获取数据
|
// 初始化并获取数据
|
||||||
const initComponents = () => {
|
const initComponents = () => {
|
||||||
if (eventStatistics.value) {
|
if (eventStatistics.value) {
|
||||||
@@ -409,7 +431,7 @@ const openDialog = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.iconfont {
|
.iconfont {
|
||||||
font-size: 35px !important;
|
font-size: 20px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 基本闪烁效果 */
|
/* 基本闪烁效果 */
|
||||||
|
|||||||
@@ -43,7 +43,6 @@
|
|||||||
:center="center"
|
:center="center"
|
||||||
:scroll-wheel-zoom="false"
|
:scroll-wheel-zoom="false"
|
||||||
:double-click-zoom="false"
|
:double-click-zoom="false"
|
||||||
|
|
||||||
>
|
>
|
||||||
<!-- 线-->
|
<!-- 线-->
|
||||||
<div v-if="zoom > 13">
|
<div v-if="zoom > 13">
|
||||||
@@ -158,7 +157,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive } from "vue";
|
import { ref, reactive, nextTick } from "vue";
|
||||||
import { substationCount } from "@/api/statistics/index";
|
import { substationCount } from "@/api/statistics/index";
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
// import { BmlMarkerClusterer } from "vue-baidu-map-3x";
|
// import { BmlMarkerClusterer } from "vue-baidu-map-3x";
|
||||||
@@ -196,11 +195,16 @@ const handler = async ({ BMap, map }: any) => {
|
|||||||
|
|
||||||
// 点击变电站\监测点
|
// 点击变电站\监测点
|
||||||
const markerClick = (e: any) => {
|
const markerClick = (e: any) => {
|
||||||
center.value.lng = e.lng;
|
|
||||||
center.value.lat = e.lat + 0.01;
|
|
||||||
zoom.value = 15;
|
zoom.value = 15;
|
||||||
infoWindowPoint.value = e;
|
infoWindowPoint.value = e;
|
||||||
infoWindowPoint.value.show = true;
|
infoWindowPoint.value.show = true;
|
||||||
|
center.value.lng = 116.404367;
|
||||||
|
center.value.lat = 39.915421;
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
center.value.lng = e.lng;
|
||||||
|
center.value.lat = e.lat + 0.01;
|
||||||
|
}, 0);
|
||||||
};
|
};
|
||||||
|
|
||||||
const init = () => {
|
const init = () => {
|
||||||
@@ -360,8 +364,10 @@ const setIcon = (e: string) => {
|
|||||||
moveenFlag.value = false;
|
moveenFlag.value = false;
|
||||||
siteList.value.forEach((item: any) => {
|
siteList.value.forEach((item: any) => {
|
||||||
if (item.stationName == e) {
|
if (item.stationName == e) {
|
||||||
center.value.lng = item.lng;
|
console.log(1);
|
||||||
center.value.lat = item.lat + 0.01;
|
|
||||||
|
// center.value.lng = item.lng;
|
||||||
|
// center.value.lat = item.lat + 0.01;
|
||||||
infoWindowPoint.value = item;
|
infoWindowPoint.value = item;
|
||||||
infoWindowPoint.value.show = true;
|
infoWindowPoint.value.show = true;
|
||||||
zoom.value = 15;
|
zoom.value = 15;
|
||||||
|
|||||||
@@ -5,48 +5,38 @@
|
|||||||
<div class="scroll-content" ref="animatedRef"></div>
|
<div class="scroll-content" ref="animatedRef"></div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 紧急告警 -->
|
<!-- 紧急告警 -->
|
||||||
<el-drawer
|
<!-- <el-drawer
|
||||||
class="urgent"
|
class="urgent"
|
||||||
modal-class="drawer"
|
modal-class="drawer"
|
||||||
v-model="drawer"
|
v-model="drawer"
|
||||||
|
:draggable="true"
|
||||||
:close-on-click-modal="false"
|
:close-on-click-modal="false"
|
||||||
:close-on-press-escape="false"
|
:close-on-press-escape="false"
|
||||||
title="紧急告警"
|
title="紧急告警"
|
||||||
:before-close="handleClose"
|
:before-close="handleClose"
|
||||||
>
|
> -->
|
||||||
|
<el-dialog v-model="drawer" draggable :modal="false" :modal-penetrable="true" :close-on-click-modal="false"
|
||||||
|
:close-on-press-escape="false" title="紧急告警" :before-close="handleClose">
|
||||||
|
|
||||||
|
<template #header>
|
||||||
|
<div style="display: flex; ">
|
||||||
|
<span>紧急告警</span>
|
||||||
|
<Promotion style="width: 15px; margin-left: 10px; " />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
<div :class="urgentList.length > 0 ? 'bg-red' : ''">
|
<div :class="urgentList.length > 0 ? 'bg-red' : ''">
|
||||||
<div class="drawer-but">
|
<div class="drawer-but">
|
||||||
<el-button
|
<el-button size="small" type="primary" @click="totalProcessing(1)" :icon="Check">确认</el-button>
|
||||||
size="small"
|
<el-button size="small" type="primary" @click="totalProcessing(2)" :icon="Check">一键确认</el-button>
|
||||||
type="primary"
|
|
||||||
@click="totalProcessing(1)"
|
|
||||||
:icon="Check"
|
|
||||||
>确认</el-button
|
|
||||||
>
|
|
||||||
<el-button
|
|
||||||
size="small"
|
|
||||||
type="primary"
|
|
||||||
@click="totalProcessing(2)"
|
|
||||||
:icon="Check"
|
|
||||||
>一键确认</el-button
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="messageBox">
|
<div class="messageBox">
|
||||||
<div
|
<div class="mesModule" v-for="(item, index) in urgentList" :key="index">
|
||||||
class="mesModule"
|
|
||||||
v-for="(item, index) in urgentList"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<el-checkbox v-model="item.checked" value="" size="large" />
|
<el-checkbox v-model="item.checked" value="" size="large" />
|
||||||
<span
|
<span class="iconfont icon-gaojing" :class="item.checked ? 'blue' : 'animate-flash-red'"></span>
|
||||||
class="iconfont icon-gaojing"
|
<div :style="{ color: item.checked ? '#0a73ff' : '#ff0000' }" style="font-weight: 650"
|
||||||
:class="item.checked ? 'blue' : 'animate-flash-red'"
|
@click="handleCurrentChange(item)">
|
||||||
></span>
|
|
||||||
<div
|
|
||||||
:style="{ color: item.checked ? '#0a73ff' : '#ff0000' }"
|
|
||||||
style="font-weight: 650"
|
|
||||||
@click="handleCurrentChange(item)"
|
|
||||||
>
|
|
||||||
<div>{{ item.timeid }}.{{ item.ms }}</div>
|
<div>{{ item.timeid }}.{{ item.ms }}</div>
|
||||||
<p class="mt5">
|
<p class="mt5">
|
||||||
{{ item.bdname }} {{ item.pointname }}发生{{
|
{{ item.bdname }} {{ item.pointname }}发生{{
|
||||||
@@ -56,31 +46,19 @@
|
|||||||
}}%,持续时间：{{ item.persisttime }}s;
|
}}%,持续时间：{{ item.persisttime }}s;
|
||||||
</p>
|
</p>
|
||||||
<p class="mt5" style="display: flex; font-size: 14px">
|
<p class="mt5" style="display: flex; font-size: 14px">
|
||||||
<span
|
<span style="width: 75px" :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }">
|
||||||
style="width: 75px"
|
影响范围： </span><span style="flex: 1" :style="{ color: item.checked ? '#0a73ff' : '#ffc107' }">{{
|
||||||
:style="{ color: item.checked ? '#0a73ff' : '#ffc107' }"
|
item.objName
|
||||||
>
|
}}</span>
|
||||||
影响范围： </span
|
|
||||||
><span
|
|
||||||
style="flex: 1"
|
|
||||||
:style="{ color: item.checked ? '#0a73ff' : '#ffc107' }"
|
|
||||||
>{{ item.objName }}</span
|
|
||||||
>
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-drawer>
|
</el-dialog>
|
||||||
|
<!-- </el-drawer> -->
|
||||||
|
|
||||||
<audio
|
<audio ref="audioRef" id="audioId" :src="mp3Src" loop controls hidden="true"></audio>
|
||||||
ref="audioRef"
|
|
||||||
id="audioId"
|
|
||||||
:src="mp3Src"
|
|
||||||
loop
|
|
||||||
controls
|
|
||||||
hidden="true"
|
|
||||||
></audio>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@@ -90,7 +68,7 @@ import { speak } from "@/utils/index";
|
|||||||
import { noDealEventList, lookEvent } from "@/api/statistics/index";
|
import { noDealEventList, lookEvent } from "@/api/statistics/index";
|
||||||
import { ElMessage, ElMessageBox } from "element-plus";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
import { color } from "echarts";
|
import { Promotion } from "@element-plus/icons-vue";
|
||||||
|
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
const emit = defineEmits(["close", "handleCurrentChange"]);
|
const emit = defineEmits(["close", "handleCurrentChange"]);
|
||||||
@@ -107,10 +85,7 @@ const handleSelectionChange = (val: any) => {
|
|||||||
const mp3Src: any = new URL(`@/assets/mp3/9578.mp3`, import.meta.url);
|
const mp3Src: any = new URL(`@/assets/mp3/9578.mp3`, import.meta.url);
|
||||||
const audioRef: any = ref(null);
|
const audioRef: any = ref(null);
|
||||||
const updateData = (row: any) => {
|
const updateData = (row: any) => {
|
||||||
console.log(
|
|
||||||
`🚀 ~ updateData ~ !row.dept.split(",").includes(store.state.deptId:`,
|
|
||||||
!row.dept.split(",").includes(store.state.deptId)
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!row.dept.split(",").includes(store.state.deptId)) return;
|
if (!row.dept.split(",").includes(store.state.deptId)) return;
|
||||||
broadcast.value.push(row);
|
broadcast.value.push(row);
|
||||||
@@ -144,7 +119,7 @@ const updateData = (row: any) => {
|
|||||||
const openDrawer = () => {
|
const openDrawer = () => {
|
||||||
drawer.value = true;
|
drawer.value = true;
|
||||||
};
|
};
|
||||||
const openSignificant = () => {};
|
const openSignificant = () => { };
|
||||||
const animatedRef = ref();
|
const animatedRef = ref();
|
||||||
|
|
||||||
// 语音播报
|
// 语音播报
|
||||||
@@ -158,8 +133,7 @@ const speakBrowser = (item: any) => {
|
|||||||
// audioRef.value.pause() //暂停
|
// audioRef.value.pause() //暂停
|
||||||
} else if (store.state.voiceType == 1) {
|
} else if (store.state.voiceType == 1) {
|
||||||
speak(
|
speak(
|
||||||
` ${item.timeid}${item.bdname}${
|
` ${item.timeid}${item.bdname}${item.pointname
|
||||||
item.pointname
|
|
||||||
}发生${filteWavetype(item.wavetype)}事件,事件特征幅值${Math.floor(
|
}发生${filteWavetype(item.wavetype)}事件,事件特征幅值${Math.floor(
|
||||||
item.eventvalue * 100
|
item.eventvalue * 100
|
||||||
)}%,持续时间：${item.persisttime}秒`,
|
)}%,持续时间：${item.persisttime}秒`,
|
||||||
@@ -221,7 +195,7 @@ const totalProcessing = (number: number, id?: string) => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
.catch(() => {});
|
.catch(() => { });
|
||||||
};
|
};
|
||||||
|
|
||||||
// 过滤数据
|
// 过滤数据
|
||||||
@@ -272,10 +246,9 @@ const handleClose = (done: (cancel?: boolean) => void) => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
setTimeout(() => {
|
||||||
setTimeout(() => {
|
|
||||||
init();
|
init();
|
||||||
}, 1000);
|
}, 1000);
|
||||||
});
|
});
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
@@ -288,6 +261,7 @@ defineExpose({
|
|||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@use "@/assets/scss/index.scss";
|
@use "@/assets/scss/index.scss";
|
||||||
|
|
||||||
.react-right {
|
.react-right {
|
||||||
width: 500px !important;
|
width: 500px !important;
|
||||||
}
|
}
|
||||||
@@ -304,53 +278,68 @@ defineExpose({
|
|||||||
color: #fff;
|
color: #fff;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
:deep(.el-drawer__header) {
|
|
||||||
|
:deep(.el-dialog__header) {
|
||||||
margin-bottom: 0px;
|
margin-bottom: 0px;
|
||||||
border-bottom: 1px solid #fff;
|
border-bottom: 1px solid #fff;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
background: #9f1700;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.el-drawer__body) {
|
:deep(.el-dialog__body) {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.urgent) {
|
:deep(.urgent) {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
height: 910px;
|
height: 910px;
|
||||||
}
|
}
|
||||||
:deep(.drawer) {
|
|
||||||
|
:deep(.el-dialog) {
|
||||||
// border: 1px solid #ff0000;
|
// border: 1px solid #ff0000;
|
||||||
|
|
||||||
width: 25%;
|
width: 25%;
|
||||||
height: 920px;
|
height: 920px;
|
||||||
top: 9%;
|
top: 0%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
left: auto !important;
|
left: 37% !important;
|
||||||
.el-drawer {
|
|
||||||
|
.el-dialog {
|
||||||
border: 1px solid #ff0000;
|
border: 1px solid #ff0000;
|
||||||
height: 910px !important;
|
height: 910px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.messageBox {
|
.messageBox {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
height: 822px;
|
height: 832px;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
|
|
||||||
div {
|
div {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
&::-webkit-scrollbar {
|
&::-webkit-scrollbar {
|
||||||
width: 6px;
|
width: 6px;
|
||||||
height: 8px;
|
height: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&::-webkit-scrollbar-thumb {
|
&::-webkit-scrollbar-thumb {
|
||||||
background: #888; /* 滑块背景颜色 */
|
background: #888;
|
||||||
border-radius: 5px; /* 滑块圆角 */
|
/* 滑块背景颜色 */
|
||||||
|
border-radius: 5px;
|
||||||
|
/* 滑块圆角 */
|
||||||
}
|
}
|
||||||
|
|
||||||
&::-webkit-scrollbar-thumb:hover {
|
&::-webkit-scrollbar-thumb:hover {
|
||||||
background: #555; /* 悬停时滑块背景颜色 */
|
background: #555;
|
||||||
|
/* 悬停时滑块背景颜色 */
|
||||||
}
|
}
|
||||||
|
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
.mesModule {
|
.mesModule {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
background-color: #00000085;
|
background-color: #00000085;
|
||||||
@@ -358,6 +347,7 @@ defineExpose({
|
|||||||
padding: 10px;
|
padding: 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
p {
|
p {
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
}
|
}
|
||||||
@@ -370,6 +360,7 @@ defineExpose({
|
|||||||
color: #ff0000;
|
color: #ff0000;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blue {
|
.blue {
|
||||||
color: #0a73ff;
|
color: #0a73ff;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,14 +9,21 @@
|
|||||||
style="width: 250px; margin-right: 10px" unlink-panels :clearable="false" range-separator="至"
|
style="width: 250px; margin-right: 10px" unlink-panels :clearable="false" range-separator="至"
|
||||||
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD HH:mm:ss" />
|
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD HH:mm:ss" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="部门集合">
|
<el-form-item label="部门集合">
|
||||||
<el-select v-model="form.deptList" placeholder="请选择部门集合" style="width: 250px" size="small" multiple>
|
<el-select v-model="form.deptList" placeholder="请选择部门集合" style="width: 250px" size="small" multiple
|
||||||
|
collapse-tags collapse-tags-tooltip>
|
||||||
|
<template #header>
|
||||||
|
<el-checkbox v-model="checkAll" :indeterminate="indeterminate" @change="handleCheckAll">
|
||||||
|
全部
|
||||||
|
</el-checkbox>
|
||||||
|
</template>
|
||||||
<el-option v-for="item in deptLists" :key="item.deptsIndex" :label="item.deptsname"
|
<el-option v-for="item in deptLists" :key="item.deptsIndex" :label="item.deptsname"
|
||||||
:value="item.deptsIndex" />
|
:value="item.deptsIndex" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<!-- <el-divider />
|
<!-- <el-divider />
|
||||||
<div style="text-align: center">
|
<div style="text-align: center">
|
||||||
|
|
||||||
@@ -30,12 +37,12 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, reactive, inject, onMounted } from "vue";
|
import { ref, watch, inject, onMounted } from "vue";
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
import { Check, Close } from "@element-plus/icons-vue";
|
import { Check, Close } from "@element-plus/icons-vue";
|
||||||
import { getDept, exportForms } from "@/api/statistics/index";
|
import { getDept, exportForms } from "@/api/statistics/index";
|
||||||
|
import type { CheckboxValueType } from 'element-plus'
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
import { log } from "console";
|
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
const machineVisible = ref(false);
|
const machineVisible = ref(false);
|
||||||
const title = ref("报表导出");
|
const title = ref("报表导出");
|
||||||
@@ -43,7 +50,8 @@ const timeValue = ref([]);
|
|||||||
const deptLists = ref();
|
const deptLists = ref();
|
||||||
//form表单校验规则
|
//form表单校验规则
|
||||||
const emit = defineEmits(["flushed"]);
|
const emit = defineEmits(["flushed"]);
|
||||||
|
const checkAll = ref(false)
|
||||||
|
const indeterminate = ref(false)
|
||||||
const form = ref({
|
const form = ref({
|
||||||
searchBeginTime: "",
|
searchBeginTime: "",
|
||||||
searchEndTime: "",
|
searchEndTime: "",
|
||||||
@@ -67,7 +75,41 @@ const init = () => {
|
|||||||
deptLists.value = res.data;
|
deptLists.value = res.data;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
// watch(form.value.deptList, (val) => {
|
||||||
|
// if (val.length == 0) {
|
||||||
|
// checkAll.value = false
|
||||||
|
// indeterminate.value = false
|
||||||
|
// } else if (val.length == deptLists.value.length) {
|
||||||
|
// checkAll.value = true
|
||||||
|
// indeterminate.value = false
|
||||||
|
// } else {
|
||||||
|
|
||||||
|
// indeterminate.value = true
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
watch(
|
||||||
|
() => form.value.deptList, // 使用函数返回值的形式
|
||||||
|
(val) => {
|
||||||
|
if (val.length == 0) {
|
||||||
|
checkAll.value = false
|
||||||
|
indeterminate.value = false
|
||||||
|
} else if (val.length == deptLists.value.length) {
|
||||||
|
checkAll.value = true
|
||||||
|
indeterminate.value = false
|
||||||
|
} else {
|
||||||
|
indeterminate.value = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ deep: true } // 添加深度监听选项
|
||||||
|
)
|
||||||
|
const handleCheckAll = (val: CheckboxValueType) => {
|
||||||
|
indeterminate.value = false
|
||||||
|
if (val) {
|
||||||
|
form.value.deptList = deptLists.value.map((_) => _.deptsIndex)
|
||||||
|
} else {
|
||||||
|
form.value.deptList = []
|
||||||
|
}
|
||||||
|
}
|
||||||
const save = () => {
|
const save = () => {
|
||||||
if (!timeValue.value[0]) {
|
if (!timeValue.value[0]) {
|
||||||
ElMessage.warning("请选择时间！");
|
ElMessage.warning("请选择时间！");
|
||||||
@@ -160,4 +202,8 @@ defineExpose({ open });
|
|||||||
:deep(.el-form-item__label, ) {
|
:deep(.el-form-item__label, ) {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:deep(.el-checkbox__label) {
|
||||||
|
color: var(--el-text-color-regular);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,13 +1,17 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="index" ref="appRef">
|
<div id="index" ref="appRef">
|
||||||
<div class="bg" :class="store.state.screenNotic == 1
|
<div
|
||||||
? pushFlag
|
class="bg"
|
||||||
? bottomTextRef?.urgentList.length > 0
|
:class="
|
||||||
? 'bg-red'
|
store.state.screenNotic == 1
|
||||||
|
? pushFlag
|
||||||
|
? bottomTextRef?.urgentList.length > 0
|
||||||
|
? 'bg-red'
|
||||||
|
: ''
|
||||||
|
: ''
|
||||||
: ''
|
: ''
|
||||||
: ''
|
"
|
||||||
: ''
|
>
|
||||||
">
|
|
||||||
<dv-loading v-if="loading">Loading...</dv-loading>
|
<dv-loading v-if="loading">Loading...</dv-loading>
|
||||||
|
|
||||||
<div v-else class="host-body">
|
<div v-else class="host-body">
|
||||||
@@ -15,7 +19,8 @@
|
|||||||
<div class="react-left">
|
<div class="react-left">
|
||||||
<span class="text fw-b">
|
<span class="text fw-b">
|
||||||
{{ timeInfo.dateYear }} {{ timeInfo.dateWeek }}
|
{{ timeInfo.dateYear }} {{ timeInfo.dateWeek }}
|
||||||
{{ timeInfo.dateDay }}</span>
|
{{ timeInfo.dateDay }}</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<dv-decoration-10 class="dv-dec-10" :color="color[1]" />
|
<dv-decoration-10 class="dv-dec-10" :color="color[1]" />
|
||||||
@@ -24,7 +29,11 @@
|
|||||||
<div class="title">
|
<div class="title">
|
||||||
<span class="title-text">{{ title }}</span>
|
<span class="title-text">{{ title }}</span>
|
||||||
</div>
|
</div>
|
||||||
<dv-decoration-8 class="dv-dec-8" :reverse="true" :color="color[2]" />
|
<dv-decoration-8
|
||||||
|
class="dv-dec-8"
|
||||||
|
:reverse="true"
|
||||||
|
:color="color[2]"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<dv-decoration-10 class="dv-dec-10-s" :color="color[1]" />
|
<dv-decoration-10 class="dv-dec-10-s" :color="color[1]" />
|
||||||
</div>
|
</div>
|
||||||
@@ -32,7 +41,10 @@
|
|||||||
<div class="d-flex secondLine">
|
<div class="d-flex secondLine">
|
||||||
<div class="react-right mr-1">
|
<div class="react-right mr-1">
|
||||||
<span class="text fw-b" style="display: flex">
|
<span class="text fw-b" style="display: flex">
|
||||||
<datePicker ref="datePickerRef" @timeChangeInfo="timeChangeInfo" />
|
<datePicker
|
||||||
|
ref="datePickerRef"
|
||||||
|
@timeChangeInfo="timeChangeInfo"
|
||||||
|
/>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -49,8 +61,15 @@
|
|||||||
<el-dropdown-item @click="handleClick('2')"
|
<el-dropdown-item @click="handleClick('2')"
|
||||||
>模拟短信发送</el-dropdown-item
|
>模拟短信发送</el-dropdown-item
|
||||||
> -->
|
> -->
|
||||||
<el-dropdown-item @click="handleClick('3')">系统配置</el-dropdown-item>
|
<el-dropdown-item @click="handleClick('3')"
|
||||||
<el-dropdown-item @click="handleClick('4')">报表导出</el-dropdown-item>
|
>系统配置</el-dropdown-item
|
||||||
|
>
|
||||||
|
<el-dropdown-item @click="handleClick('4')"
|
||||||
|
>报表导出</el-dropdown-item
|
||||||
|
>
|
||||||
|
<el-dropdown-item @click="handleClick('5')"
|
||||||
|
>台账导出</el-dropdown-item
|
||||||
|
>
|
||||||
</el-dropdown-menu>
|
</el-dropdown-menu>
|
||||||
</template>
|
</template>
|
||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
@@ -72,22 +91,36 @@
|
|||||||
<alarm ref="alarmRef" />
|
<alarm ref="alarmRef" />
|
||||||
<!-- 紧急告警 -->
|
<!-- 紧急告警 -->
|
||||||
|
|
||||||
<div class="icon" v-if="!(bottomTextRef?.urgentList.length == 0)" :color="color[0][1]" :class="bottomTextRef?.urgentList.length > 0
|
<div
|
||||||
? 'animate-flash-red'
|
class="icon"
|
||||||
: ''
|
v-if="!(bottomTextRef?.urgentList.length == 0)"
|
||||||
" @click="drawerClick">
|
:color="color[0][1]"
|
||||||
|
:class="
|
||||||
|
bottomTextRef?.urgentList.length > 0
|
||||||
|
? 'animate-flash-red'
|
||||||
|
: ''
|
||||||
|
"
|
||||||
|
@click="drawerClick"
|
||||||
|
>
|
||||||
<!-- <WarnTriangleFilled /> -->
|
<!-- <WarnTriangleFilled /> -->
|
||||||
<span class="iconfont icon-gaojing" :style="{
|
<span
|
||||||
color:
|
class="iconfont icon-gaojing"
|
||||||
bottomTextRef?.urgentList.length > 0
|
:style="{
|
||||||
? '#ff0000'
|
color:
|
||||||
: color[0][1],
|
bottomTextRef?.urgentList.length > 0
|
||||||
}"></span>
|
? '#ff0000'
|
||||||
<span class="count" v-if="bottomTextRef?.urgentList.length > 0">{{
|
: color[0][1],
|
||||||
bottomTextRef?.urgentList.length > 99
|
}"
|
||||||
? "99+"
|
></span>
|
||||||
: bottomTextRef?.urgentList.length
|
<span
|
||||||
}}</span>
|
class="count"
|
||||||
|
v-if="bottomTextRef?.urgentList.length > 0"
|
||||||
|
>{{
|
||||||
|
bottomTextRef?.urgentList.length > 99
|
||||||
|
? "99+"
|
||||||
|
: bottomTextRef?.urgentList.length
|
||||||
|
}}</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</dv-border-box-13>
|
</dv-border-box-13>
|
||||||
</div>
|
</div>
|
||||||
@@ -100,7 +133,10 @@
|
|||||||
<!-- <bottom-left /> -->
|
<!-- <bottom-left /> -->
|
||||||
</dv-border-box-13>
|
</dv-border-box-13>
|
||||||
<dv-border-box-13 :color="color[0]">
|
<dv-border-box-13 :color="color[0]">
|
||||||
<informationTable ref="informationTableRef" @handleCurrentChange="handleCurrentChange" />
|
<informationTable
|
||||||
|
ref="informationTableRef"
|
||||||
|
@handleCurrentChange="handleCurrentChange"
|
||||||
|
/>
|
||||||
</dv-border-box-13>
|
</dv-border-box-13>
|
||||||
<dv-border-box-13 :color="color[0]">
|
<dv-border-box-13 :color="color[0]">
|
||||||
<sendTrends ref="sendTrendsRef" />
|
<sendTrends ref="sendTrendsRef" />
|
||||||
@@ -110,10 +146,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<bottomText ref="bottomTextRef" @handleCurrentChange="handleCurrentChange" />
|
<bottomText
|
||||||
|
ref="bottomTextRef"
|
||||||
|
@handleCurrentChange="handleCurrentChange"
|
||||||
|
/>
|
||||||
|
|
||||||
<!-- 已发短信查询 -->
|
<!-- 已发短信查询 -->
|
||||||
<smsQueries ref="smsQueriesRef" v-if="smsQueriesFlag" @close="smsQueriesFlag = false" />
|
<smsQueries
|
||||||
|
ref="smsQueriesRef"
|
||||||
|
v-if="smsQueriesFlag"
|
||||||
|
@close="smsQueriesFlag = false"
|
||||||
|
/>
|
||||||
|
|
||||||
<!-- 系统配置 -->
|
<!-- 系统配置 -->
|
||||||
<Config ref="ConfigRef" @flushed="inquire" />
|
<Config ref="ConfigRef" @flushed="inquire" />
|
||||||
@@ -153,7 +196,7 @@ import socketClient from "@/utils/webSocketClient";
|
|||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
import Config from "./components/config.vue";
|
import Config from "./components/config.vue";
|
||||||
import ReportForms from "./components/reportForms.vue";
|
import ReportForms from "./components/reportForms.vue";
|
||||||
|
import { exportLineData } from "@/api/statistics/index";
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
const smsQueriesRef = ref(); // 短信查询组件引用
|
const smsQueriesRef = ref(); // 短信查询组件引用
|
||||||
const endpointStatisticsRef = ref(); // 终端在线统计组件引用
|
const endpointStatisticsRef = ref(); // 终端在线统计组件引用
|
||||||
@@ -255,6 +298,20 @@ const handleClick = (type: string) => {
|
|||||||
if (type === "4") {
|
if (type === "4") {
|
||||||
reportForms.value.open("报表导出");
|
reportForms.value.open("报表导出");
|
||||||
}
|
}
|
||||||
|
if (type === "5") {
|
||||||
|
exportLineData().then((res: any) => {
|
||||||
|
let blob = new Blob([res], {
|
||||||
|
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8",
|
||||||
|
});
|
||||||
|
const url = window.URL.createObjectURL(blob);
|
||||||
|
const link = document.createElement("a"); // 创建a标签
|
||||||
|
link.href = url;
|
||||||
|
link.download = "台账.xlsx"; // 设置下载的文件名
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click(); //执行下载
|
||||||
|
document.body.removeChild(link);
|
||||||
|
});
|
||||||
|
}
|
||||||
}, 100);
|
}, 100);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -41,6 +41,7 @@ export default ({ command, mode }) => {
|
|||||||
base: "./",
|
base: "./",
|
||||||
server: {
|
server: {
|
||||||
host: "127.0.0.1",
|
host: "127.0.0.1",
|
||||||
|
allowedHosts: true,
|
||||||
port: 4000, // 设置服务启动端口号
|
port: 4000, // 设置服务启动端口号
|
||||||
// port: Number(loadEnv(mode, process.cwd()).VITE_APP_PORT),
|
// port: Number(loadEnv(mode, process.cwd()).VITE_APP_PORT),
|
||||||
|
|
||||||
@@ -53,11 +54,10 @@ export default ({ command, mode }) => {
|
|||||||
proxy: {
|
proxy: {
|
||||||
"/api": {
|
"/api": {
|
||||||
// target: "http://192.168.1.63/api/",
|
// target: "http://192.168.1.63/api/",
|
||||||
// target: "http://192.168.1.133:4000/api/",
|
// target: "http://192.168.1.133:18093",
|
||||||
//target: "http://192.168.1.62:10215",
|
//target: "http://192.168.1.62:10215",
|
||||||
target: 'http://192.168.1.127:18093', //cdf
|
// target: 'http://192.168.1.127:18093', //cdf
|
||||||
// target: 'http://192.168.1.63/api', //cdf
|
target: "http://192.168.1.103:19001", //cdf
|
||||||
// target: 'http://192.168.1.130:18093', //cdf
|
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
secure: false,
|
secure: false,
|
||||||
rewrite: (path) => path.replace(/^\/api/, ""),
|
rewrite: (path) => path.replace(/^\/api/, ""),
|
||||||
|
|||||||
Reference in New Issue
Block a user