Browse Source

部分接口数据修改

develop
fuguobin 9 months ago
parent
commit
09b1a238b2
  1. 64
      src/App.vue
  2. 9
      src/api/table/types.ts
  3. 12
      src/permission.ts
  4. 6
      src/store/modules/date.js
  5. 16
      src/store/modules/user.ts
  6. 2
      src/types/auto-imports.d.ts
  7. 11
      src/utils/request.ts
  8. 4
      src/utils/socket.ts
  9. 3
      src/views/dashboard/components/BarChart.vue
  10. 14
      src/views/dashboard/components/LineChart.vue
  11. 13
      src/views/dashboard/index.scss
  12. 67
      src/views/dashboard/index.vue
  13. 8
      src/views/data-visual/components/hxPress.vue
  14. 8
      src/views/data-visual/components/hxTemp.vue
  15. 16
      src/views/data-visual/components/table.vue
  16. 6
      src/views/data-visual/index.scss
  17. 4
      src/views/data-visual/index.vue
  18. 14
      src/views/monitoring/screen/components/main.vue
  19. 16
      src/views/monitoring/screen/index.vue

64
src/App.vue

@ -8,33 +8,43 @@
import { ElConfigProvider } from 'element-plus';
import { useAppStore } from '@/store/modules/app';
import { userVersionRelation } from '@/api/user/index';
import mitt from '@/plugins/bus';
const appStore = useAppStore();
//
// const notice = ref({});
// const webVersion = sessionStorage.getItem('webVersion');
// if (webVersion != '' && webVersion != null) {
// const version = JSON.parse(webVersion);
// notice.value = ElNotification({
// title: version.noticeTitle,
// dangerouslyUseHTMLString: true,
// customClass: 'notice',
// duration: 0,
// message: version.noticeContent.replace(/\n/g, '<br>'),
// onClose: () => {
// noticeCloce(version.noticeId);
// }
// });
// }
// function noticeCloce(id: any) {
// //
// const params = {
// noticeId: id
// };
// userVersionRelation(params).then((res: any) => {
// if (res.code === 200) {
// console.log('');
// }
// });
// }
mitt.on('noticeMessage', (res: any) => {
//
console.log('noticeMessage:', res);
noticeFn(res);
});
function noticeFn(data: any) {
//
const notice = ref({});
const webVersion = data.data;
console.log('webVersion:', webVersion);
if (Object.keys(webVersion).length != 0 && webVersion != null) {
const version = JSON.parse(webVersion);
notice.value = ElNotification({
title: version.noticeTitle,
dangerouslyUseHTMLString: true,
customClass: 'notice',
duration: 0,
message: version.noticeContent.replace(/\n/g, '<br>'),
onClose: () => {
noticeCloce(version.noticeId);
}
});
}
}
function noticeCloce(id: any) {
//
const params = {
noticeId: id
};
userVersionRelation(params).then((res: any) => {
if (res.code === 200) {
console.log('更新日志关闭!');
}
});
}
</script>

9
src/api/table/types.ts

@ -3,7 +3,7 @@
*/
export interface TableVo {
id: string;
deviceuuid: string;
assetInfo: assetInfoVo;
areaid: string;
C018: object;
C019: object;
@ -57,6 +57,13 @@ export interface TableVo {
C048: object;
}
export interface assetInfoVo {
assetStatus: string;
id: number;
title: string;
assetCode: string;
}
/**
*
*/

12
src/permission.ts

@ -9,7 +9,7 @@
import router from '@/router';
import { useUserStoreHook } from '@/store/modules/user';
import { usePermissionStoreHook } from '@/store/modules/permission';
// import socket from '@/utils/socket';
import socket from '@/utils/socket';
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
NProgress.configure({ showSpinner: false }); // 进度条
@ -35,11 +35,11 @@ router.beforeEach(async (to, from, next) => {
if (to.matched.length === 0) {
from.name ? next({ name: from.name }) : next('/404');
} else {
// console.log('切换页面发送websocket信息');
console.log('切换页面发送websocket信息');
const exitStatu = {
code: 'exitDataMonitor'
};
// socket.onSend(exitStatu);
socket.onSend(exitStatu);
next();
}
} else {
@ -50,13 +50,13 @@ router.beforeEach(async (to, from, next) => {
router.addRoute(route);
});
// console.log('登录后链接websocket');
console.log('登录后链接websocket');
//登录后连接webSocket
const userStorageInfo = sessionStorage.getItem('userInfo');
const userInfo = JSON.parse(userStorageInfo === null ? '' : userStorageInfo);
// const wsUrl = `ws://${window.location.host}/ws/websocket/${userInfo.userName}`; //websocket地址
// const wsUrl = `ws://10.10.10.56:9010/websocket/${userInfo.userName}`; //websocket地址
// socket.initialize(wsUrl);
const wsUrl = `ws://10.10.10.56:9010/websocket/${userInfo.userName}`; //websocket地址
socket.initialize(wsUrl);
next({ ...to, replace: true });
} catch (error) {
// 移除 token 并跳转登录页

6
src/store/modules/date.js

@ -7,9 +7,10 @@ const useCounter = defineStore('date', {
state: () => ({
deptIdStr: '',
dateStr: '',
noticeStr: {},
orgStr: {
title: '',
uuid: ''
assetCode: ''
}
}),
@ -28,6 +29,9 @@ const useCounter = defineStore('date', {
dateStore(val) {
this.dateStr = val;
},
noticeStore(val) {
this.noticeStr = val;
},
orgStore(val) {
this.orgStr = val;
}

16
src/store/modules/user.ts

@ -16,7 +16,7 @@ export const useUserStore = defineStore('user', () => {
const userInfo = useSessionStorage('userInfo', {});
const nickname = ref('');
const avatar = ref('');
const webVersion = useSessionStorage('webVersion', '');
// const webVersion = useSessionStorage('webVersion', '');
const roles = ref<Array<string>>([]); // 用户角色编码集合 → 判断路由权限
const perms = ref<Array<string>>([]); // 用户权限编码集合 → 判断按钮权限
@ -57,11 +57,11 @@ export const useUserStore = defineStore('user', () => {
roles.value = data.roles;
perms.value = data.permissions;
userInfo.value = user;
if (data.notice === null) {
webVersion.value = '';
} else {
webVersion.value = JSON.stringify(data.notice);
}
// if (data.notice === null) {
// webVersion.value = '';
// } else {
// webVersion.value = JSON.stringify(data.notice);
// }
// useStorage('userInfo', user);
resolve(data);
})
@ -88,12 +88,16 @@ export const useUserStore = defineStore('user', () => {
// 重置
function resetToken() {
return new Promise<void>(resolve => {
token.value = '';
userInfo.value = {};
nickname.value = '';
avatar.value = '';
roles.value = [];
perms.value = [];
resetRouter();
resolve();
});
}
return {
token,

2
src/types/auto-imports.d.ts

@ -6,6 +6,7 @@ declare global {
const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const ElNotification: typeof import('element-plus/es')['ElNotification']
const NEllipsis: typeof import('naive-ui')['NEllipsis']
const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
const computed: typeof import('vue')['computed']
@ -276,6 +277,7 @@ declare module 'vue' {
readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
readonly NEllipsis: UnwrapRef<typeof import('naive-ui')['NEllipsis']>
readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>
readonly computed: UnwrapRef<typeof import('vue')['computed']>

11
src/utils/request.ts

@ -8,7 +8,7 @@
*/
import axios, { InternalAxiosRequestConfig, AxiosResponse } from 'axios';
import { useUserStoreHook } from '@/store/modules/user';
import { getUrlRouter } from '@/utils/index';
// import { getUrlRouter } from '@/utils/index';
import { useDateFormat } from '@vueuse/core';
// 创建 axios 实例
@ -48,11 +48,10 @@ service.interceptors.response.use(
confirmButtonText: '确定',
type: 'warning'
}).then(() => {
localStorage.clear();
sessionStorage.clear();
if (getUrlRouter()[0] != 'login') {
window.location.href = '/';
}
const userStore = useUserStoreHook();
userStore.resetToken().then(() => {
location.reload();
});
});
} else if (code === 500) {
ElMessage({ message: msg || '未知错误', type: 'error' });

4
src/utils/socket.ts

@ -7,8 +7,8 @@
* Description:websocket方法封装
*/
import type { Action } from 'element-plus';
import { useSessionStorage } from '@vueuse/core';
import mitt from '@/plugins/bus';
class WebSocketService {
url: string;
websocket: WebSocket | null;
@ -94,6 +94,8 @@ class WebSocketService {
});
}
console.log(response.msg);
} else if (response.code === 'notice') {
mitt.emit('noticeMessage', response);
}
}
}

3
src/views/dashboard/components/BarChart.vue

@ -1,9 +1,6 @@
<!-- 线 + 柱混合图 -->
<template>
<el-card>
<template #header> 一网均温排行 </template>
<div :id="id" :class="className" :style="{ height, width }" />
</el-card>
</template>
<script setup>

14
src/views/dashboard/components/LineChart.vue

@ -1,9 +1,6 @@
<!-- 线 + 柱混合图 -->
<template>
<el-card>
<template #header> 一网温度 </template>
<div :id="id" :class="className" :style="{ height, width }" />
</el-card>
</template>
<script lang="ts" setup>
@ -58,7 +55,8 @@ const options = {
['product', '2024-01-01', '2024-01-02', '2024-01-03', '2024-01-04', '2024-01-05', '2024-01-06', '2024-01-07'],
['进温', 59.2, 78.9, 87.8, 79.5, 52.4, 90.7, 55],
['回温', 42.0, 60.1, 62.8, 55.9, 30.2, 79.2, 20],
['均温', 52, 77, 75, 70.1, 53.4, 50, 40]
['进温均温', 52, 77, 75, 70.1, 53.4, 50, 40],
['回温均温', 40, 52, 61, 49, 20.4, 61.8, 10]
]
},
xAxis: {
@ -115,6 +113,14 @@ const options = {
focus: 'series'
}
},
{
type: 'line',
smooth: true,
seriesLayoutBy: 'row',
emphasis: {
focus: 'series'
}
},
{
type: 'line',
smooth: true,

13
src/views/dashboard/index.scss

@ -11,9 +11,9 @@
margin-right: 10px;
}
.info {
.name{
.name {
font-size: 1.4rem;
span{
span {
font-size: 1.2rem;
}
}
@ -57,7 +57,7 @@
}
span {
font-size: 28px;
i{
i {
font-style: normal;
}
}
@ -84,9 +84,10 @@
// }
// }
}
.statistics{
:deep(.el-card){
.el-card__header{
.statistics {
margin-bottom: 15px;
:deep(.el-card) {
.el-card__header {
font-size: 1.4rem;
}
}

67
src/views/dashboard/index.vue

@ -62,13 +62,22 @@
<section class="statistics">
<el-row :gutter="20">
<el-col :span="8">
<el-card>
<template #header> 一网温度 </template>
<LineChart id="lineChart" height="300px" width="100%" />
</el-card>
</el-col>
<el-col :span="8">
<el-card>
<template #header> 一网进温排行 </template>
<BarChart id="barChart" height="300px" width="100%" />
</el-card>
</el-col>
<el-col :span="8">
<PieChart id="pieChart" height="300px" width="100%" />
<el-card>
<template #header> 一网回温排行 </template>
<BarChart id="barCharts" height="300px" width="100%" />
</el-card>
</el-col>
</el-row>
</section>
@ -98,7 +107,7 @@ const isCurrentRoute = ref(true);
const userStore = useUserStore();
const duration = 5000;
const userNumber = ref(2800);
const notice = ref({});
// const notice = ref({});
// const vsitsNumber = transitionNum(720, 5000);
const currentTime = useDateFormat(useNow(), 'YYYY-MM-DD HH:mm:ss');
const hoursNow = useNow().value.getHours();
@ -122,7 +131,7 @@ interface CardData {
const cardData: CardData[] = [
{
id: '1',
title: '供热面积',
title: '正在报警数量/报警总数量',
value: 50000,
time: 5000,
colors: ['#ec4786', '#b955a4'],
@ -131,7 +140,7 @@ const cardData: CardData[] = [
},
{
id: '2',
title: '产热量',
title: '产热量',
value: 200,
time: 5000,
colors: ['#865ec0', '#5144b4'],
@ -177,32 +186,32 @@ const timePeriod = computed(() => {
onMounted(() => {
getWeatherData();
// socket.initialize(wsUrl);
const webVersion = sessionStorage.getItem('webVersion');
if (webVersion != '' && webVersion != null) {
const version = JSON.parse(webVersion);
notice.value = ElNotification({
title: version.noticeTitle,
dangerouslyUseHTMLString: true,
customClass: 'notice',
duration: 0,
message: version.noticeContent.replace(/\n/g, '<br>'),
onClose: () => {
noticeCloce(version.noticeId);
}
});
}
// const webVersion = sessionStorage.getItem('webVersion');
// if (webVersion != '' && webVersion != null) {
// const version = JSON.parse(webVersion);
// notice.value = ElNotification({
// title: version.noticeTitle,
// dangerouslyUseHTMLString: true,
// customClass: 'notice',
// duration: 0,
// message: version.noticeContent.replace(/\n/g, '<br>'),
// onClose: () => {
// noticeCloce(version.noticeId);
// }
// });
// }
});
function noticeCloce(id: any) {
//
const params = {
versionId: id
};
userVersionRelation(params).then((res: any) => {
if (res.code === 200) {
console.log('更新日志关闭!');
}
});
}
// function noticeCloce(id: any) {
// //
// const params = {
// versionId: id
// };
// userVersionRelation(params).then((res: any) => {
// if (res.code === 200) {
// console.log('');
// }
// });
// }
function getWeatherData() {
//
getWeather().then((res: any) => {

8
src/views/data-visual/components/hxPress.vue

@ -1067,15 +1067,15 @@ onMounted(() => {
});
watchEffect(() => {
const dataStr = counterStore.orgStr;
if (dataStr.uuid != '') {
deviceUuid.value = dataStr.uuid;
if (dataStr.assetCode != '') {
deviceUuid.value = dataStr.assetCode;
getDeviceInfo();
}
});
function getDeviceInfo() {
//线
const params = {
deviceUuid: deviceUuid.value
assetCode: deviceUuid.value
};
getPressChart(params).then((res: any) => {
if (res.code === 200) {
@ -1096,7 +1096,7 @@ const debounceClick = debounce(() => {
function getDevicePolling() {
//线
const params = {
deviceUuid: deviceUuid.value
assetCode: deviceUuid.value
};
getPressChartPolling(params).then((res: any) => {
if (res.code === 200) {

8
src/views/data-visual/components/hxTemp.vue

@ -561,15 +561,15 @@ onMounted(() => {
});
watchEffect(() => {
const dataStr = counterStore.orgStr;
if (dataStr.uuid != '') {
deviceUuid.value = dataStr.uuid;
if (dataStr.assetCode != '') {
deviceUuid.value = dataStr.assetCode;
getDeviceInfo();
}
});
function getDeviceInfo() {
//线
const params = {
deviceUuid: deviceUuid.value
assetCode: deviceUuid.value
};
getTempChart(params).then((res: any) => {
if (res.code === 200) {
@ -590,7 +590,7 @@ const debounceClick = debounce(() => {
function getDevicePolling() {
//线
const params = {
deviceUuid: deviceUuid.value
assetCode: deviceUuid.value
};
getTempChartPolling(params).then((res: any) => {
if (res.code === 200) {

16
src/views/data-visual/components/table.vue

@ -22,17 +22,17 @@
show-overflow
@cell-dblclick="cellDBLClickEvent"
>
<template #deviceuuid_default="{ row }">
<template #assetInfo_default="{ row }">
<div class="title">
<svg-icon
icon-class="warning_lights"
style="fill: currentColor; width: 15px; height: 15px; color: green"
v-if="row.deviceuuid.deviceStatus === 0"
v-if="row.assetInfo.assetStatus === '0'"
/>
<svg-icon
icon-class="warning_lights"
style="fill: currentColor; width: 15px; height: 15px; color: red"
v-if="row.deviceuuid.deviceStatus === 2"
v-if="row.assetInfo.assetStatus === '2'"
/>
</div>
</template>
@ -162,18 +162,18 @@ function tableDatas() {
// tableData.value=oldData
tableData.value = res.rows;
if (res.rows.length != 0) {
counterStore.orgStore(res.rows[0].deviceuuid);
counterStore.orgStore(res.rows[0].assetInfo);
} else {
counterStore.orgStore({
title: '',
uuid: ''
assetCode: ''
});
}
tableStoreCounter.tableDataAction(res.rows);
tablePage.total = res.total;
// gridOptions.data = res.data;
loadingShow.value = false;
tableDataClick();
// tableDataClick();
// console.log(':', useDateFormat(new Date(), 'YYYY-MM-DD HH:mm:ss').value);
}
});
@ -208,7 +208,7 @@ function tableDataPolling() {
const cellDBLClickEvent: VxeTableEvents.CellDblclick<TableVo> = ({ row, column }) => {
//
console.log('cellData--', row, column);
counterStore.orgStore(row.deviceuuid);
counterStore.orgStore(row.assetInfo);
};
const formatRole: VxeColumnPropTypes.Formatter<HeaderVo> = ({ cellValue }) => {
//
@ -222,7 +222,7 @@ const formatRole: VxeColumnPropTypes.Formatter<HeaderVo> = ({ cellValue }) => {
};
function urvesClick(row: any) {
//线
counterStore.orgStore(row.deviceuuid);
counterStore.orgStore(row.assetInfo);
}
onUnmounted(() => {

6
src/views/data-visual/index.scss

@ -1,8 +1,8 @@
@import url('@/assets/fonts/font.css');
.screenContainer {
position: fixed;
left: 50%;
top: 50%;
// position: fixed;
// left: 50%;
// top: 50%;
transform-origin: 0 0;
transition: 0.3s;
color: #fff;

4
src/views/data-visual/index.vue

@ -32,11 +32,11 @@ const baseHeight = 1440;
// * 32:9
const baseProportion = parseFloat((baseWidth / baseHeight).toFixed(5));
onMounted(() => {
calcRate();
// calcRate();
});
window.addEventListener('resize', () => {
//
resize();
// resize();
});
function calcRate() {
const appRef = screenRef.value;

14
src/views/monitoring/screen/components/main.vue

@ -36,19 +36,19 @@
show-overflow
@cell-dblclick="cellDBLClickEvent"
>
<template #deviceuuid_default="{ row }">
<template #assetInfo_default="{ row }">
<div class="title">
<svg-icon
icon-class="warning_lights"
style="fill: currentColor; width: 15px; height: 15px; color: green"
v-if="row.deviceuuid.deviceStatus === 0"
v-if="row.assetInfo.assetStatus === '0'"
/>
<svg-icon
icon-class="warning_lights"
style="fill: currentColor; width: 15px; height: 15px; color: red"
v-if="row.deviceuuid.deviceStatus === 2"
v-if="row.assetInfo.assetStatus === '2'"
/>
<span class="name" @click.native="nameClick(row.deviceuuid)">{{ row.gTitle }}</span>
<span class="name" @click.native="nameClick(row.assetInfo)">{{ row.gTitle }}</span>
</div>
</template>
<template #pager>
@ -211,7 +211,7 @@ const userInfo = JSON.parse(userStorageInfo === null ? '' : userStorageInfo);
// const baseApi = "http://board.heatiot.cn:8001/prod-api"//websocket
//const baseApi = import.meta.env.VITE_APP_BASE_API
//const apiUrl = baseApi.replace(/https?:/, '');
const wsUrl = `ws://${window.location.host}/ws/websocket/${userInfo.userName}`; //websocket
// const wsUrl = `ws://${window.location.host}/ws/websocket/${userInfo.userName}`; //websocket
// const wsUrl = `ws://10.10.10.56:9010/websocket/${userInfo.userName}`; //websocket
const emit = defineEmits(['tableHeaderData']);
@ -259,12 +259,12 @@ onMounted(() => {
// stationInfo();
// tableHeader();
// console.log(':', useDateFormat(new Date(), 'YYYY-MM-DD HH:mm:ss').value);
console.log('aaaa', sessionStorage.getItem('currentPage'));
// console.log('aaaa', sessionStorage.getItem('currentPage'));
tablePage.currentPage =
sessionStorage.getItem('currentPage') === null ? 1 : Number(sessionStorage.getItem('currentPage'));
console.log(Number(sessionStorage.getItem('currentPage')));
tablePage.pageSize = sessionStorage.getItem('pageSize') === null ? 10 : Number(sessionStorage.getItem('pageSize'));
socket.initialize(wsUrl); //websocket http://
// socket.initialize(wsUrl); //websocket http://
});
mitt.on('currentPageEmit', (res: any) => {

16
src/views/monitoring/screen/index.vue

@ -137,14 +137,14 @@ window.addEventListener('resize', () => {
console.log('监听sidebar:', sidebar.value?.offsetHeight);
});
onBeforeRouteLeave((to, from) => {
//
console.log('onBeforeRouteLeave--', to.path, from.path);
if (to.path != from.path) {
console.log('离开页面');
socket.close(false);
}
});
// onBeforeRouteLeave((to, from) => {
// //
// console.log('onBeforeRouteLeave--', to.path, from.path);
// if (to.path != from.path) {
// console.log('');
// socket.close(false);
// }
// });
function tableMenuData(data: any) {
//

Loading…
Cancel
Save