feat: 新增linux文件上传成功后websocket通知

This commit is contained in:
meilin.huang
2021-11-11 15:56:02 +08:00
parent f6fb732911
commit 78d6c3d1a4
26 changed files with 379 additions and 150 deletions

View File

@@ -0,0 +1,47 @@
class SocketBuilder {
websocket: WebSocket;
constructor(url: string) {
if (typeof (WebSocket) === "undefined") {
throw new Error('不支持websocket');
}
if (!url) {
throw new Error('websocket url不能为空');
}
console.log(url)
this.websocket = new WebSocket(url);
}
static builder(url: string) {
return new SocketBuilder(url);
}
open(onopen: any) {
this.websocket.onopen = onopen;
return this;
}
error(onerror: any) {
this.websocket.onerror = onerror;
return this;
}
message(onmessage: any) {
this.websocket.onmessage = onmessage;
return this;
}
close(onclose: any) {
this.websocket.onclose = onclose;
return this;
}
build() {
return this.websocket;
}
}
export default SocketBuilder;

View File

@@ -0,0 +1,44 @@
import Config from './config'
import { ElNotification } from 'element-plus'
import SocketBuilder from './SocketBuilder';
import { getSession } from '@/common/utils/storage.ts';
export default {
/**
* 全局系统消息websocket
*/
sysMsgSocket() {
const token = getSession('token');
if (!token) {
return null;
}
return SocketBuilder.builder(`${Config.baseWsUrl}/sysmsg?token=${token}`)
.message((event: { data: string }) => {
const message = JSON.parse(event.data);
let mtype: string;
switch (message.type) {
case 0:
mtype = 'error';
break;
case 2:
mtype = 'info';
break;
case 1:
mtype = 'success';
break;
default:
mtype = 'info';
}
if (mtype == undefined) {
return;
}
ElNotification({
title: message.title,
message: message.msg,
type: mtype as any,
})
})
.open((event: any) => console.log(event)).build();
}
}

View File

@@ -8,6 +8,7 @@ import { NextLoading } from '@/common/utils/loading.ts';
import { dynamicRoutes, staticRoutes, pathMatch } from './route.ts'
import { imports } from './imports';
import openApi from '@/common/openApi';
import sockets from '@/common/sockets';
// 添加静态路由
const router = createRouter({
@@ -203,6 +204,9 @@ if (!isRequestRoutes) {
initBackEndControlRoutesFun();
}
let SysWs: any;
// 路由加载前
router.beforeEach((to, from, next) => {
NProgress.configure({ showSpinner: false });
@@ -223,10 +227,18 @@ router.beforeEach((to, from, next) => {
clearSession();
resetRoute();
NProgress.done();
if (SysWs) {
SysWs.close();
SysWs = null;
}
} else if (token && to.path === '/login') {
next('/');
NProgress.done();
} else {
if (!SysWs) {
SysWs = sockets.sysMsgSocket();
}
if (store.state.routesList.routesList.length > 0) next();
}
}

View File

@@ -93,9 +93,9 @@
</template>
<script lang="ts">
import { toRefs, reactive, onMounted, nextTick, computed, getCurrentInstance } from 'vue';
import { toRefs, reactive, onMounted, nextTick, computed } from 'vue';
import { useStore } from '@/store/index.ts';
import * as echarts from 'echarts';
// import * as echarts from 'echarts';
import { CountUp } from 'countup.js';
import { formatAxis } from '@/common/utils/formatTime.ts';
import { indexApi } from './api';
@@ -103,7 +103,7 @@ import { topCardItemList, environmentList, activitiesList } from './mock.ts';
export default {
name: 'Home',
setup() {
const { proxy } = getCurrentInstance() as any;
// const { proxy } = getCurrentInstance() as any;
const store = useStore();
const state = reactive({
topCardItemList,
@@ -146,104 +146,104 @@ export default {
});
};
// 实验室使用情况
const initHomeLaboratory = () => {
const myChart = echarts.init(proxy.$refs.homeLaboratoryRef);
const option = {
grid: {
top: 50,
right: 20,
bottom: 30,
left: 30,
},
tooltip: {
trigger: 'axis',
},
legend: {
data: ['预购队列', '最新成交价'],
right: 13,
},
xAxis: {
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子'],
},
yAxis: [
{
type: 'value',
name: '价格',
},
],
series: [
{
name: '预购队列',
type: 'bar',
data: [5, 20, 36, 10, 10, 20],
},
{
name: '最新成交价',
type: 'line',
data: [15, 20, 16, 20, 30, 8],
},
],
};
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.resize();
});
};
// 履约超时预警
const initHomeOvertime = () => {
const myChart = echarts.init(proxy.$refs.homeOvertimeRef);
const option = {
grid: {
top: 50,
right: 20,
bottom: 30,
left: 30,
},
tooltip: {
trigger: 'axis',
},
legend: {
data: ['订单数量', '超时数量', '在线数量', '预警数量'],
right: 13,
},
xAxis: {
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
},
yAxis: [
{
type: 'value',
name: '数量',
},
],
series: [
{
name: '订单数量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20, 11, 13, 10, 9, 17, 19],
},
{
name: '超时数量',
type: 'bar',
data: [15, 12, 26, 15, 11, 16, 31, 13, 5, 16, 13, 15],
},
{
name: '在线数量',
type: 'line',
data: [15, 20, 16, 20, 30, 8, 16, 19, 12, 18, 19, 14],
},
{
name: '预警数量',
type: 'line',
data: [10, 10, 13, 12, 15, 18, 19, 10, 12, 15, 11, 17],
},
],
};
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.resize();
});
};
// // 实验室使用情况
// const initHomeLaboratory = () => {
// const myChart = echarts.init(proxy.$refs.homeLaboratoryRef);
// const option = {
// grid: {
// top: 50,
// right: 20,
// bottom: 30,
// left: 30,
// },
// tooltip: {
// trigger: 'axis',
// },
// legend: {
// data: ['预购队列', '最新成交价'],
// right: 13,
// },
// xAxis: {
// data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子'],
// },
// yAxis: [
// {
// type: 'value',
// name: '价格',
// },
// ],
// series: [
// {
// name: '预购队列',
// type: 'bar',
// data: [5, 20, 36, 10, 10, 20],
// },
// {
// name: '最新成交价',
// type: 'line',
// data: [15, 20, 16, 20, 30, 8],
// },
// ],
// };
// myChart.setOption(option);
// window.addEventListener('resize', () => {
// myChart.resize();
// });
// };
// // 履约超时预警
// const initHomeOvertime = () => {
// const myChart = echarts.init(proxy.$refs.homeOvertimeRef);
// const option = {
// grid: {
// top: 50,
// right: 20,
// bottom: 30,
// left: 30,
// },
// tooltip: {
// trigger: 'axis',
// },
// legend: {
// data: ['订单数量', '超时数量', '在线数量', '预警数量'],
// right: 13,
// },
// xAxis: {
// data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
// },
// yAxis: [
// {
// type: 'value',
// name: '数量',
// },
// ],
// series: [
// {
// name: '订单数量',
// type: 'bar',
// data: [5, 20, 36, 10, 10, 20, 11, 13, 10, 9, 17, 19],
// },
// {
// name: '超时数量',
// type: 'bar',
// data: [15, 12, 26, 15, 11, 16, 31, 13, 5, 16, 13, 15],
// },
// {
// name: '在线数量',
// type: 'line',
// data: [15, 20, 16, 20, 30, 8, 16, 19, 12, 18, 19, 14],
// },
// {
// name: '预警数量',
// type: 'line',
// data: [10, 10, 13, 12, 15, 18, 19, 10, 12, 15, 11, 17],
// },
// ],
// };
// myChart.setOption(option);
// window.addEventListener('resize', () => {
// myChart.resize();
// });
// };
// 页面加载时
onMounted(() => {
initNumCountUp();

View File

@@ -451,9 +451,7 @@ export default defineComponent({
};
const uploadSuccess = (res: any) => {
if (res.code == 200) {
ElMessage.success('文件上传中...');
} else {
if (res.code !== 200) {
ElMessage.error(res.msg);
}
};

View File

@@ -217,6 +217,9 @@ export default {
if (type == 1) {
return '登录';
}
if (type == 2) {
return '通知';
}
};
return {