diff --git a/src/api/userMG.js b/src/api/userMG.js index 8be28aa..b235519 100644 --- a/src/api/userMG.js +++ b/src/api/userMG.js @@ -15,8 +15,6 @@ export const loginout = () => { return axios.delete("/api/login?&token=" + local export const userList = (params) => { return req("post", "/api/User/list", params) }; // 用户管理-保存（添加编辑） export const userSave = (params) => { return req("post", "/api/User/save", params) }; -// 用户管理-删除用户 -export const userDelete = (params) => { return req("post", "/pm2-api/app/delete" , params ) }; // 用户管理-重置密码 export const userPwd = (params) => { return req("post", "/api/User/pwd", params) }; // 用户管理-修改状态 @@ -59,6 +57,10 @@ export const stopServer = (params) => { return req("post", "/pm2-api/AppCenterCo export const restartServer = (params) => { return req("post", "/pm2-api/AppCenterController/restart" , params ) }; +// 用户管理-删除服务 +export const userDelete = (params) => { return req("post", "/pm2-api/app/delete" , params ) }; +// 用户管理-去除服务 +export const removeServer = (params) => { return req("post", "/pm2-api/app/remove" , params ) }; /** * 菜单管理 **/ diff --git a/src/api/ws.js b/src/api/ws.js new file mode 100644 index 0000000..b12d371 --- /dev/null +++ b/src/api/ws.js @@ -0,0 +1,107 @@ +import { Message } from 'element-ui' +let websock = null +let messageCallback = null +let errorCallback = null +let wsUrl = '' +let tryTime = 0 + +// 接收ws后端返回的数据 +function websocketonmessage (e) { + messageCallback(e.data) +} + +/** + * 发起websocket连接 + * @param {Object} agentData 需要向后台传递的参数数据 + */ +function websocketSend (agentData) { + // 加延迟是为了尽量让ws连接状态变为OPEN + setTimeout(() => { + // 添加状态判断，当为OPEN时，发送消息 + if (websock.readyState === websock.OPEN) { // websock.OPEN = 1 + // 发给后端的数据需要字符串化 + websock.send(JSON.stringify(agentData)) + } + if (websock.readyState === websock.CLOSED) { // websock.CLOSED = 3 + console.log('websock.readyState=3') + Message.error('ws连接异常，请稍候重试') + errorCallback() + } + }, 500) +} + +// 关闭ws连接 +function websocketclose (e) { + // e.code === 1000 表示正常关闭。 无论为何目的而创建, 该链接都已成功完成任务。 + // e.code !== 1000 表示非正常关闭。 + if (e && e.code !== 1000) { + Message.error('ws连接异常，请稍候重试') + errorCallback() + // // 如果需要设置异常重连则可替换为下面的代码，自行进行测试 + // if (tryTime < 10) { + // setTimeout(function() { + // websock = null + // tryTime++ + // initWebSocket() + // console.log(`第${tryTime}次重连`) + // }, 3 * 1000) + //} else { + // Message.error('重连失败！请稍后重试') + //} + } +} +// 建立ws连接 +function websocketOpen (e) { + // console.log('ws连接成功') +} + +// 初始化weosocket +function initWebSocket () { + if (typeof (WebSocket) === 'undefined') { + Message.error('您的浏览器不支持WebSocket，无法获取数据') + return false + } + + // ws请求完整地址 + websock = new WebSocket(wsUrl) + + websock.onmessage = function (e) { + websocketonmessage(e) + } + websock.onopen = function () { + websocketOpen() + } + websock.onerror = function () { + Message.error('ws连接异常，请稍候重试') + errorCallback() + } + websock.onclose = function (e) { + websocketclose(e) + } +} + +/** + * 发起websocket请求函数 + * @param {string} url ws连接地址 + * @param {Object} agentData 传给后台的参数 + * @param {function} successCallback 接收到ws数据，对数据进行处理的回调函数 + * @param {function} errCallback ws连接错误的回调函数 + */ +export function sendWebsocket (url, agentData, successCallback, errCallback) { + wsUrl = url + initWebSocket() + messageCallback = successCallback + errorCallback = errCallback + websocketSend(agentData) +} + +/** + * 关闭websocket函数 + */ +export function closeWebsocket () { + if (websock) { + websock.close() // 关闭websocket + websock.onclose() // 关闭websocket + } +} + diff --git a/src/views/system/user.vue b/src/views/system/user.vue index d10f544..3bbc17e 100644 --- a/src/views/system/user.vue +++ b/src/views/system/user.vue @@ -42,9 +42,11 @@ {{scope.row.onOff ? '运行':'停止'}} - + - + + + @@ -67,7 +69,7 @@ 启动 重启 停止 - 查看log + 查看log @@ -77,7 +79,7 @@ - + @@ -103,6 +105,24 @@ + + + +
+ +
+ + + + + + + + @@ -111,26 +131,19 @@ import { selectApp, saveApp, - deleteApp, searchApp, startServer, stopServer, restartServer, - userSave, userDelete, - userPwd, - userExpireToken, - userFlashCache, - userLock, - UserDeptTree, - UserDeptSave, UserDeptdeptTree, - UserChangeDept } from '../../api/userMG' +import { sendWebsocket, closeWebsocket } from '../../api/ws' import Pagination from '../../components/Pagination' export default { data() { return { + drawer: false, nshow: true, //switch开启 fshow: false, //switch关闭 loading: false, //是显示加载 @@ -218,6 +231,8 @@ export default { * 里面的方法只有被调用才会执行 */ methods: { + //websocket + direction(){}, // 获取数据方法 getdata(parameter) { this.loading = true @@ -227,34 +242,12 @@ export default { msg: null, count: 12, data: [ - // { - // addUser: null, - // editUser: null, - // addTime: 1526452756000, - // editTime: 1527128981000, - // userId: 62, - // systemNo: null, - // userName: '211111111', - // userPassword: 'e10adc3949ba59abbe56e057f20f883e', - // userRealName: '21111111111', - // userSex: '男', - // userMobile: '13601478451', - // userEmail: '222222@qq.com', - // isLock: 'N', - // deptId: 17, - // deptName: 'v', - // roleId: 2 - // } + ] } this.loading = false this.userData = res.data - // // 分页赋值 - // this.pageparm.currentPage = this.formInline.page - // this.pageparm.pageSize = this.formInline.limit - // this.pageparm.total = res.count - // 模拟数据结束 - + /*** * 调用接口，注释上面模拟数据 取消下面注释 */ @@ -384,6 +377,33 @@ export default { } else { } }, + selectLog(index, row){ + console.log(row); + this.drawer = true + sendWebsocket("ws://127.0.0.1:9011/pm2-api/ws/"+Math.random()+"/"+row.name,"",this.serverLog) + + }, + handleClose(done) { + this.$confirm('确认关闭？') + .then(_ => { + closeWebsocket() + var divElement = document.querySelector('.log'); + while (divElement.firstChild) { + divElement.removeChild(divElement.firstChild); + } + done(); + }) + .catch(_ => {}); + }, + serverLog(data){ + var divElement = document.querySelector('.log'); + var pElement = document.createElement('p'); + + pElement.classList.add('myParagraph'); // 添加新定义的类名 + divElement.appendChild(pElement); + + pElement.textContent = data; + }, // 选择复选框事件 selectChange(val) { this.selectdata = val @@ -410,7 +430,8 @@ export default { // 删除 userDelete(row) .then(res => { - if (res.success) { + console.log(res); + if (res.message == "SUCCESS") { this.$message({ type: 'success', message: '数据已删除!' @@ -445,10 +466,10 @@ export default { }) .then(() => { row.permanentlyDelete = false - // 删除 + // 去除 userDelete(row) .then(res => { - if (res.success) { + if (res.message == "SUCCESS") { this.$message({ type: 'success', message: '数据已删除!' @@ -542,175 +563,7 @@ export default { this.$message.error('启动服务失败') }) }, - // 数据权限 - dataAccess: function(index, row) { - this.dataAccessshow = true - this.saveroleId = row.userId - UserDeptTree(row.userId) - .then(res => { - if (res.data.success) { - this.checkmenu = this.changemenu(res.data.data) - this.UserDept = this.changeArr(res.data.data) - } else { - this.$message({ - type: 'info', - message: res.data.msg - }) - } - }) - .catch(err => { - this.loading = false - this.$message.error('获取权限失败，请稍后再试！') - }) - }, - //数据格式化 - changeArr(data) { - var pos = {} - var tree = [] - var i = 0 - while (data.length != 0) { - if (data[i].pId == 0) { - tree.push({ - id: data[i].id, - name: data[i].name, - pId: data[i].pId, - open: data[i].open, - checked: data[i].checked, - children: [] - }) - pos[data[i].id] = [tree.length - 1] - data.splice(i, 1) - i-- - } else { - var posArr = pos[data[i].pId] - if (posArr != undefined) { - var obj = tree[posArr[0]] - for (var j = 1; j < posArr.length; j++) { - obj = obj.children[posArr[j]] - } - - obj.children.push({ - id: data[i].id, - name: data[i].name, - pId: data[i].pId, - open: data[i].open, - checked: data[i].checked, - children: [] - }) - pos[data[i].id] = posArr.concat([obj.children.length - 1]) - data.splice(i, 1) - i-- - } - } - i++ - if (i > data.length - 1) { - i = 0 - } - } - return tree - }, - // 选中菜单 - changemenu(arr) { - let change = [] - for (let i = 0; i < arr.length; i++) { - if (arr[i].checked) { - change.push(arr[i].id) - } - } - return change - }, - // 菜单权限-保存 - menuPermSave() { - let parm = { - userId: this.saveroleId, - deptIds: '' - } - let node = this.$refs.tree.getCheckedNodes() - let moduleIds = [] - if (node.length != 0) { - for (let i = 0; i < node.length; i++) { - moduleIds.push(node[i].id) - } - parm.deptIds = JSON.stringify(moduleIds) - } - UserDeptSave(parm) - .then(res => { - if (res.success) { - this.$message({ - type: 'success', - message: '权限保存成功' - }) - this.dataAccessshow = false - this.getdata(this.formInline) - } else { - this.$message({ - type: 'info', - message: res.msg - }) - } - }) - .catch(err => { - this.loading = false - this.$message.error('权限保存失败，请稍后再试！') - }) - }, - // // 下线用户 - // offlineUser(index, row) { - // this.$confirm('确定要让' + row.userName + '用户下线吗?', '信息', { - // confirmButtonText: '确定', - // cancelButtonText: '取消', - // type: 'warning' - // }) - // .then(() => { - // userExpireToken(row.userName) - // .then(res => { - // if (res.success) { - // this.$message({ - // type: 'success', - // message: '用户' + row.userName + '强制下线成功！' - // }) - // this.getdata(this.formInline) - // } else { - // this.$message({ - // type: 'info', - // message: res.msg - // }) - // } - // }) - // .catch(err => { - // this.loading = false - // this.$message.error('用户下线失败，请稍后再试！') - // }) - // }) - // .catch(() => { - // this.$message({ - // type: 'info', - // message: '已取消' - // }) - // }) - // }, - // 刷新缓存 - // refreshCache(index, row) { - // userFlashCache(row.userName) - // .then(res => { - // if (res.success) { - // this.$message({ - // type: 'success', - // message: '刷新成功！' - // }) - // this.getdata(this.formInline) - // } else { - // this.$message({ - // type: 'info', - // message: res.msg - // }) - // } - // }) - // .catch(err => { - // this.loading = false - // this.$message.error('刷新失败，请稍后再试！') - // }) - // } + } } @@ -722,6 +575,18 @@ export default { .userRole { width: 100%; } +.footer { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + background-color: #f5f5f5; + padding: 20px; + text-align: center; + } + .myParagraph { + margin-left: 20px; +} \ No newline at end of file