浏览代码

feat: 优化 sse 的多个页面,当页面切换时候关闭 sse。修复告警配置数据不能复现的 bug。优化通知配置管理的卡片纵向间距等。

yanglzh 1 年之前
父节点
当前提交
d51c550e0f

+ 11 - 1
src/layout/navBars/breadcrumb/userNews.vue

@@ -47,7 +47,7 @@ const es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + '/subscri
 es.addEventListener('lastUnRead', ({ data }) => {
 	if (!data || data === 'null') return;
 	const list = JSON.parse(data);
-	newsList.value = list.concat(newsList.value).slice(0,5)
+	newsList.value = list.concat(newsList.value).slice(0, 5)
 	list.forEach((item: any) => {
 		setTimeout(() => {
 			ElNotification({
@@ -80,33 +80,41 @@ const onGoToGiteeClick = () => {
 		justify-content: space-between;
 		height: 35px;
 		align-items: center;
+
 		.head-box-btn {
 			color: var(--el-color-primary);
 			font-size: 13px;
 			cursor: pointer;
 			opacity: 0.8;
+
 			&:hover {
 				opacity: 1;
 			}
 		}
 	}
+
 	.content-box {
 		font-size: 13px;
+
 		.content-box-item {
 			padding-top: 12px;
+
 			&:last-of-type {
 				padding-bottom: 12px;
 			}
+
 			.content-box-msg {
 				color: var(--el-text-color-secondary);
 				margin-top: 5px;
 				margin-bottom: 5px;
 			}
+
 			.content-box-time {
 				color: var(--el-text-color-secondary);
 			}
 		}
 	}
+
 	.foot-box {
 		height: 35px;
 		color: var(--el-color-primary);
@@ -117,10 +125,12 @@ const onGoToGiteeClick = () => {
 		align-items: center;
 		justify-content: center;
 		border-top: 1px solid var(--el-border-color-lighter);
+
 		&:hover {
 			opacity: 1;
 		}
 	}
+
 	:deep(.el-empty__description p) {
 		font-size: 13px;
 	}

+ 2 - 1
src/views/iot/alarm/setting/component/edit.vue

@@ -311,7 +311,6 @@ export default defineComponent({
 			getDevData();
 			if (row) {
 				alarm.common.detail(row.id).then((res: any) => {
-					state.requestParams = res.data.condition.triggerCondition;
 					let product_key = res.data.productKey;
 					res.data.performAction.action.forEach(function (value: { sendGateway: any; noticeConfig: number; }, index: string | number) {
 						notice.config.getList({ sendGateway: value.sendGateway }).then((res: any) => {
@@ -342,6 +341,8 @@ export default defineComponent({
 						});
 					}
 					setType(true);
+					// 重置表单之后进行参数设置的赋值 
+					state.requestParams = res.data.condition.triggerCondition;
 				});
 			}
 			state.isShowDialog = true;

+ 1 - 1
src/views/iot/iotmanager/dashboard.vue

@@ -210,7 +210,7 @@ export default defineComponent({
 					icoimg: 'dashboard-icon4.svg',
 					title1: '本月',
 					title2: '今日',
-					title1_bgcolor: '#5ECCFF',
+					title1_bgcolor: '#4285F4',
 					title2_bgcolor: '#FFBB73',
 				},
 			],

+ 47 - 45
src/views/iot/noticeservices/config/setting.vue

@@ -27,59 +27,61 @@
 				</el-form-item>
 			</el-form>
 		</div>
-		<el-row class="flex1">
-			<el-col :span="8" v-for="(item, index) in tableData.data" :key="index">
-				<div class="grid-content card">
-					<div class="ant-card">
-						<div class="ant-card-body">
-							<div class="pro-table-card-item">
-								<div class="card-item-avatar">
-									<img width="88" height="88" :src="'/imgs/notice/' + tableData.param.sendGateway + '.svg'" alt="" />
-								</div>
-								<div class="card-item-body">
-									<div class="card-item-header">
-										<div class="ellipsis">
-											<div class="ellipsis card-item-header-name" style="width: 100%; height: 45px">{{ item.title }}</div>
-											<div class="card-item-header-name" style="display: none"></div>
-										</div>
+		<div class="flex1">
+			<el-row>
+				<el-col :span="8" v-for="(item, index) in tableData.data" :key="index">
+					<div class="grid-content card">
+						<div class="ant-card">
+							<div class="ant-card-body">
+								<div class="pro-table-card-item">
+									<div class="card-item-avatar">
+										<img width="88" height="88" :src="'/imgs/notice/' + tableData.param.sendGateway + '.svg'" alt="" />
 									</div>
-									<div class="card-item-content">
-										通知方式:<el-tag>{{ item.types == 1 ? '即时发送' : '预约发送' }}</el-tag>
+									<div class="card-item-body">
+										<div class="card-item-header" style="width: 100%;">
+											<div class="ellipsis">
+												<div class="ellipsis card-item-header-name" style="width: 100%; height: 45px">{{ item.title }}</div>
+												<div class="card-item-header-name" style="display: none"></div>
+											</div>
+										</div>
+										<div class="card-item-content">
+											通知方式:<el-tag>{{ item.types == 1 ? '即时发送' : '预约发送' }}</el-tag>
+										</div>
 									</div>
 								</div>
 							</div>
 						</div>
-					</div>
-					<div class="card-tools">
-						<div class="card-button" @click="onOpenEdit(item)">
-							<el-button type="primary" class="ml10" text bg>
-								<el-icon>
-									<ele-Edit />
-								</el-icon>
-								修改
-							</el-button>
-						</div>
-						<div class="card-button" @click="onOpenEditTem(item)">
-							<el-button type="primary" text bg>
-								<el-icon>
-									<ele-Wallet />
-								</el-icon>
-								模板配置
-							</el-button>
-						</div>
+						<div class="card-tools">
+							<div class="card-button" @click="onOpenEdit(item)">
+								<el-button type="primary" class="ml10" text bg>
+									<el-icon>
+										<ele-Edit />
+									</el-icon>
+									修改
+								</el-button>
+							</div>
+							<div class="card-button" @click="onOpenEditTem(item)">
+								<el-button type="primary" text bg>
+									<el-icon>
+										<ele-Wallet />
+									</el-icon>
+									模板配置
+								</el-button>
+							</div>
 
-						<div class="card-button" @click="onRowDel(item)">
-							<el-button type="danger" text bg>
-								<el-icon>
-									<ele-Delete />
-								</el-icon>
-								删除
-							</el-button>
+							<div class="card-button" @click="onRowDel(item)">
+								<el-button type="danger" text bg>
+									<el-icon>
+										<ele-Delete />
+									</el-icon>
+									删除
+								</el-button>
+							</div>
 						</div>
 					</div>
-				</div>
-			</el-col>
-		</el-row>
+				</el-col>
+			</el-row>
+		</div>
 		<div style="text-align: center;padding: 28px;" v-if="(tableData.total == 0)">暂无数据</div>
 		<pagination v-show="tableData.total > 0" :total="tableData.total" v-model:page="tableData.param.pageNum" v-model:limit="tableData.param.pageSize" @pagination="dataList" />
 		<EditDic ref="editDicRef" @dataList="dataList" />

+ 7 - 2
src/views/system/monitor/cache/index.vue

@@ -327,6 +327,7 @@ import { toRefs, reactive, defineComponent } from 'vue';
 import 'echarts-wordcloud';
 import getOrigin from '/@/utils/origin'
 let interval: any = null;
+let es: any = null;
 export default defineComponent({
   name: 'monitor',
   components: {},
@@ -337,7 +338,7 @@ export default defineComponent({
     });
 
     function startWs() {
-      const es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/redisinfo"));
+      es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/redisinfo"));
 
       es.addEventListener("stats", statsInfoMsg);
       es.addEventListener("clients", clientsInfoMsg);
@@ -391,6 +392,9 @@ export default defineComponent({
       clearInterval(interval);
       interval = null;
     }
+    if (es) {
+      es.close()
+    }
   },
   data() {
     return {};
@@ -486,7 +490,8 @@ export default defineComponent({
 
   min-height: 180px;
 }
-.el-form-item{
+
+.el-form-item {
   margin-bottom: 5px;
 }
 </style>

+ 10 - 2
src/views/system/monitor/lastLinesLog/index.vue

@@ -57,7 +57,7 @@ import api from '/@/api/system';
 import { useSearch } from '/@/hooks/useCommon';
 import getOrigin from '/@/utils/origin'
 import downloadFile from '/@/utils/download';
-import { ref, getCurrentInstance, nextTick, onMounted } from 'vue';
+import { ref, nextTick, onMounted, onUnmounted } from 'vue';
 import { ElMessage, ElMessageBox } from "element-plus";
 
 const dialogVisible = ref(false);
@@ -74,6 +74,14 @@ const runLogName = ref('');
 
 const { params, tableData, getList, loading } = useSearch<any[]>(api.lastLinesLog.getList, 'list', { types: types.value });
 
+let es: any = null;
+
+onUnmounted(() => {
+  if (es) {
+    es.close();
+  }
+})
+
 getList();
 
 onMounted(() => {
@@ -96,7 +104,7 @@ const view = (row: any) => {
   if (types.value == 'run') {
     row.name = row.value;
   }
-  const es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/logInfo?name=" + row.name + '&types=' + types.value));
+  es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/logInfo?name=" + row.name + '&types=' + types.value));
   es.addEventListener('log', ({ data }) => {
     topMsg.value.unshift(data);
   });

+ 5 - 1
src/views/system/monitor/server/index.vue

@@ -225,6 +225,7 @@ import 'echarts-wordcloud';
 import dayjs from 'dayjs';
 import getOrigin from '/@/utils/origin'
 let interval: any = null;
+let es: any = null;
 export default defineComponent({
   name: 'monitor',
   components: {},
@@ -684,7 +685,7 @@ export default defineComponent({
     });
 
     function startWs() {
-      const es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/sysenv"));
+      es = new EventSource(getOrigin(import.meta.env.VITE_SERVER_URL + "/subscribe/sysenv"));
 
       es.addEventListener("host", displayHost);
       es.addEventListener("mem", displayMem);
@@ -788,6 +789,9 @@ export default defineComponent({
       clearInterval(interval);
       interval = null;
     }
+    if (es) {
+      es.close()
+    }
   },
   data() {
     return {};