作者 王勇

消息平台控制中心,初次提交

... ... @@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<title>易通快速通关申报管理系统</title>
<title>消息控制中心</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
</head>
... ...
... ... @@ -2276,49 +2276,57 @@
"integrity": "sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk="
},
"cliui": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
"integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
"integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
"dev": true,
"requires": {
"string-width": "^1.0.1",
"strip-ansi": "^3.0.1",
"wrap-ansi": "^2.0.0"
"string-width": "^3.1.0",
"strip-ansi": "^5.2.0",
"wrap-ansi": "^5.1.0"
},
"dependencies": {
"ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
"emoji-regex": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
"integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA==",
"dev": true
},
"is-fullwidth-code-point": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
"integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
"dev": true
},
"string-width": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
"integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
"dev": true,
"requires": {
"number-is-nan": "^1.0.0"
"emoji-regex": "^7.0.1",
"is-fullwidth-code-point": "^2.0.0",
"strip-ansi": "^5.1.0"
}
},
"string-width": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
"strip-ansi": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
"integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
"dev": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
"strip-ansi": "^3.0.0"
"ansi-regex": "^4.1.0"
}
},
"strip-ansi": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
"wrap-ansi": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
"integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
"dev": true,
"requires": {
"ansi-regex": "^2.0.0"
"ansi-styles": "^3.2.0",
"string-width": "^3.0.0",
"strip-ansi": "^5.0.0"
}
}
}
... ... @@ -4846,9 +4854,9 @@
}
},
"globule": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/globule/-/globule-1.2.1.tgz",
"integrity": "sha512-g7QtgWF4uYSL5/dn71WxubOrS7JVGCnFPEnoeChJmBnyR9Mw8nGoEwOgJL/RC2Te0WhbsEUCejfH8SZNJ+adYQ==",
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/globule/-/globule-1.3.2.tgz",
"integrity": "sha512-7IDTQTIu2xzXkT+6mlluidnWo+BypnbSoEVVQCGfzqnl5Ik8d3e1d4wycb8Rj9tWW+Z39uPWsdlquqiqPCd/pA==",
"dev": true,
"requires": {
"glob": "~7.1.1",
... ... @@ -5249,9 +5257,9 @@
"integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
},
"in-publish": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
"integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E=",
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.1.tgz",
"integrity": "sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ==",
"dev": true
},
"indent-string": {
... ... @@ -6023,9 +6031,9 @@
},
"dependencies": {
"minimist": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
"dev": true
}
}
... ... @@ -6377,9 +6385,9 @@
}
},
"node-sass": {
"version": "4.12.0",
"resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.12.0.tgz",
"integrity": "sha512-A1Iv4oN+Iel6EPv77/HddXErL2a+gZ4uBeZUy+a8O35CFYTXhgA8MgLCWBtwpGZdCvTvQ9d+bQxX/QC36GDPpQ==",
"version": "4.14.1",
"resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.14.1.tgz",
"integrity": "sha512-sjCuOlvGyCJS40R8BscF5vhVlQjNN069NtQ1gSxyK1u9iqvn6tf7O1R4GNowVZfiZUCRt5MmMs1xd+4V/7Yr0g==",
"dev": true,
"requires": {
"async-foreach": "^0.1.3",
... ... @@ -6389,14 +6397,14 @@
"get-stdin": "^4.0.1",
"glob": "^7.0.3",
"in-publish": "^2.0.0",
"lodash": "^4.17.11",
"lodash": "^4.17.15",
"meow": "^3.7.0",
"mkdirp": "^0.5.1",
"nan": "^2.13.2",
"node-gyp": "^3.8.0",
"npmlog": "^4.0.0",
"request": "^2.88.0",
"sass-graph": "^2.2.4",
"sass-graph": "2.2.5",
"stdout-stream": "^1.4.0",
"true-case-path": "^1.0.2"
},
... ... @@ -11461,15 +11469,15 @@
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"sass-graph": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
"integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.5.tgz",
"integrity": "sha512-VFWDAHOe6mRuT4mZRd4eKE+d8Uedrk6Xnh7Sh9b4NGufQLQjOrvf/MQoOdx+0s92L89FeyUUNfU597j/3uNpag==",
"dev": true,
"requires": {
"glob": "^7.0.0",
"lodash": "^4.0.0",
"scss-tokenizer": "^0.2.3",
"yargs": "^7.0.0"
"yargs": "^13.3.2"
}
},
"sass-loader": {
... ... @@ -13472,88 +13480,138 @@
"dev": true
},
"yargs": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
"integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg=",
"version": "13.3.2",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
"integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
"dev": true,
"requires": {
"camelcase": "^3.0.0",
"cliui": "^3.2.0",
"decamelize": "^1.1.1",
"get-caller-file": "^1.0.1",
"os-locale": "^1.4.0",
"read-pkg-up": "^1.0.1",
"cliui": "^5.0.0",
"find-up": "^3.0.0",
"get-caller-file": "^2.0.1",
"require-directory": "^2.1.1",
"require-main-filename": "^1.0.1",
"require-main-filename": "^2.0.0",
"set-blocking": "^2.0.0",
"string-width": "^1.0.2",
"which-module": "^1.0.0",
"y18n": "^3.2.1",
"yargs-parser": "^5.0.0"
"string-width": "^3.0.0",
"which-module": "^2.0.0",
"y18n": "^4.0.0",
"yargs-parser": "^13.1.2"
},
"dependencies": {
"ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
"emoji-regex": {
"version": "7.0.3",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
"integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA==",
"dev": true
},
"camelcase": {
"find-up": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
"integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
"integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
"dev": true,
"requires": {
"locate-path": "^3.0.0"
}
},
"get-caller-file": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
"integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
"dev": true
},
"is-fullwidth-code-point": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
"integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
"dev": true
},
"locate-path": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
"integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
"dev": true,
"requires": {
"number-is-nan": "^1.0.0"
"p-locate": "^3.0.0",
"path-exists": "^3.0.0"
}
},
"p-limit": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
"dev": true,
"requires": {
"p-try": "^2.0.0"
}
},
"p-locate": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
"integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
"dev": true,
"requires": {
"p-limit": "^2.0.0"
}
},
"p-try": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
"integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
"dev": true
},
"path-exists": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
"integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
"dev": true
},
"require-main-filename": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
"integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
"dev": true
},
"string-width": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
"integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
"dev": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
"strip-ansi": "^3.0.0"
"emoji-regex": "^7.0.1",
"is-fullwidth-code-point": "^2.0.0",
"strip-ansi": "^5.1.0"
}
},
"strip-ansi": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
"integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
"dev": true,
"requires": {
"ansi-regex": "^2.0.0"
"ansi-regex": "^4.1.0"
}
},
"y18n": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
"integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
"which-module": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
"integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=",
"dev": true
}
}
},
"yargs-parser": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
"integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo=",
"version": "13.1.2",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
"integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
"dev": true,
"requires": {
"camelcase": "^3.0.0"
"camelcase": "^5.0.0",
"decamelize": "^1.2.0"
},
"dependencies": {
"camelcase": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
"integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
"integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
"dev": true
}
}
... ...
import http from './http.js'
let baseUrl = 'message-bus-service/bus'
// let baseUrl = 'http://127.0.0.1:9030/bus'
// MQ服务器,分页查询列表
export const selectBusServerList = params =>{return http.get(`${baseUrl}/server/list`, params);};
// MQ服务器,新增
export const insertBusServer = params =>{return http.post(`${baseUrl}/server/insert`, params);};
// MQ服务器,编辑
export const updateBusServer = params =>{return http.put(`${baseUrl}/server/update`, params);};
// MQ服务器,删除
export const deleteBusServer = params =>{return http.del(`${baseUrl}/server/delete`, params);};
// MQ服务器,批量删除
export const batchRemoveBusServer = params =>{return http.get(`${baseUrl}/server/batchRemove`, params);};
// MQ虚拟主机,分页查询列表
export const selectVirtualHostList = params =>{return http.get(`${baseUrl}/host/list`, params);};
// MQ虚拟主机,新增
export const insertVirtualHost = params =>{return http.post(`${baseUrl}/host/insert`, params);};
// MQ虚拟主机,编辑
export const updateVirtualHost = params =>{return http.put(`${baseUrl}/host/update`, params);};
// MQ虚拟主机,删除
export const deleteVirtualHost = params =>{return http.del(`${baseUrl}/host/delete`, params);};
// MQ虚拟主机,批量删除
export const batchRemoveVirtualHost = params =>{return http.get(`${baseUrl}/host/batchRemove`, params);};
// MQ交换机,分页查询列表
export const selectBusExchangeList = params =>{return http.get(`${baseUrl}/exchange/list`, params);};
// MQ交换机,新增
export const insertBusExchange = params =>{return http.post(`${baseUrl}/exchange/insert`, params);};
// MQ交换机,编辑
export const updateBusExchange = params =>{return http.put(`${baseUrl}/exchange/update`, params);};
// MQ交换机,删除
export const deleteBusExchange = params =>{return http.del(`${baseUrl}/exchange/delete`, params);};
// MQ交换机,批量删除
export const batchRemoveBusExchange = params =>{return http.get(`${baseUrl}/exchange/batchRemove`, params);};
// MQ路由键,分页查询列表
export const selectRoutingKeyList = params =>{return http.get(`${baseUrl}/routing/list`, params);};
// MQ路由键,新增
export const insertRoutingKey = params =>{return http.post(`${baseUrl}/routing/insert`, params);};
// MQ路由键,编辑
export const updateRoutingKey = params =>{return http.put(`${baseUrl}/routing/update`, params);};
// MQ路由键,删除
export const deleteRoutingKey = params =>{return http.del(`${baseUrl}/routing/delete`, params);};
// MQ路由键,批量删除
export const batchRemoveRoutingKey = params =>{return http.get(`${baseUrl}/routing/batchRemove`, params);};
// MQ消息队列,分页查询列表
export const selectBusQueueList = params =>{return http.get(`${baseUrl}/queue/list`, params);};
// MQ消息队列,新增
export const insertBusQueue = params =>{return http.post(`${baseUrl}/queue/insert`, params);};
// MQ消息队列,编辑
export const updateBusQueue = params =>{return http.put(`${baseUrl}/queue/update`, params);};
// MQ消息队列,删除
export const deleteBusQueue = params =>{return http.del(`${baseUrl}/queue/delete`, params);};
// MQ消息队列,批量删除
export const batchRemoveBusQueue = params =>{return http.get(`${baseUrl}/queue/batchRemove`, params);};
// MQ消息收发记录,分页查询列表
export const selectMessageNoteList = params =>{return http.get(`${baseUrl}/note/list`, params);};
// MQ消息收发记录,新增
export const insertMessageNote = params =>{return http.post(`${baseUrl}/note/insert`, params);};
// MQ消息收发记录,编辑
export const updateMessageNote = params =>{return http.put(`${baseUrl}/note/update`, params);};
// MQ消息收发记录,删除
export const deleteMessageNote = params =>{return http.del(`${baseUrl}/note/delete`, params);};
// MQ消息收发记录,批量删除
export const batchRemoveMessageNote = params =>{return http.get(`${baseUrl}/note/batchRemove`, params);};
// MQ账户消息绑定配置,分页查询列表
export const selectUserMessageBindingList = params =>{return http.get(`${baseUrl}/umb/list`, params);};
// MQ账户消息绑定配置,新增
export const insertUserMessageBinding = params =>{return http.post(`${baseUrl}/umb/insert`, params);};
// MQ账户消息绑定配置,编辑
export const updateUserMessageBinding = params =>{return http.put(`${baseUrl}/umb/update`, params);};
// MQ账户消息绑定配置,删除
export const deleteUserMessageBinding = params =>{return http.del(`${baseUrl}/umb/delete`, params);};
// MQ账户消息绑定配置,批量删除
export const batchRemoveUserMessageBinding = params =>{return http.get(`${baseUrl}/umb/batchRemove`, params);};
// 级联查询
export const getServerList = params =>{return http.get(`${baseUrl}/cascade/server`, params);};
export const getHostList = params =>{return http.get(`${baseUrl}/cascade/host`, params);};
export const getServerAndHostList = params =>{return http.get(`${baseUrl}/cascade/server_host`, params);};
export const getServerAndHostAndExchangeList = params =>{return http.get(`${baseUrl}/cascade/server_host_exchange`, params);};
... ...
... ... @@ -69,7 +69,7 @@ function websocketOpen(e){
console.log("连接成功");
}
initWebSocket();
export{sendSock}
// initWebSocket();
//
// export{sendSock}
... ...
... ... @@ -75,6 +75,14 @@ import queryDeparture from './views/airtransport/queryDeparture.vue'
import queryDeclare from './views/airtransport/queryDeclare.vue'
import outConfigure from './views/airtransport/outConfigure.vue'
import queryFlightConfigure from './views/airtransport/queryFlightConfigure.vue'
// 消息控制中心
import Server from './views/bus/Server.vue'
import VirtualHost from './views/bus/VirtualHost.vue'
import Exchange from './views/bus/Exchange.vue'
import RoutingKey from './views/bus/RoutingKey.vue'
import Queue from './views/bus/Queue.vue'
import MessageNote from './views/bus/MessageNote.vue'
import UserMessageBinding from './views/bus/UserMessageBinding.vue'
... ... @@ -108,162 +116,180 @@ let routes = [
name: '系统设置',
iconCls: 'el-icon-setting',//图标样式class
children: [
{ path: '/user', component: User, name: '用户管理' },
{ path: '/role', component: Role, name: '组织机构' },
{ path: '/perm', component: Perm, name: '权限管理' },
{ path: '/log', component: LOG, name: '系统日志' },
{ path: '/department', component: Department, name: '部门管理' },
{ path: '/company', component: Company, name: '公司管理'},
{ path: '/group', component: Group, name: '集团管理'}
]
},
{
path: '/guestService',
component: Home,
name: '客服系统',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/process', component: Process, name: '工单管理' },
{ path: '/job', component: Job, name: '任务管理' },
{path: '/pre1', component: PreManifest, name: '预配'},
]
},
{
path: '/output',
component: Home,
name: '出港业务申报',
iconCls: 'el-icon-collection',
children: [
{path: '/flight', component: ExitFlight, name: '出港航班申报'},
{path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/pre', component: ExitPre, name: '出港预配舱单'},
{path: '/arrive', component: ExitArrive, name: '出港运抵'},
{path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
{path: '/loading', component: ExitLoading, name: '出港装载'},
{path: '/tidy', component: ExitTidy, name: '出港理货'}
{path: '/user', component: User, name: '用户管理'},
{path: '/role', component: Role, name: '组织机构'},
{path: '/perm', component: Perm, name: '权限管理'},
{path: '/log', component: LOG, name: '系统日志'},
{path: '/department', component: Department, name: '部门管理'},
{path: '/company', component: Company, name: '公司管理'},
{path: '/group', component: Group, name: '集团管理'}
]
},
{
path: '/nmms2',
path: '/bus',
component: Home,
name: '进港业务申报',
iconCls: 'fa fa-id-card-o',
name: '消息控制中心',
iconCls: 'el-icon-message',
children: [
{ path: '/orig', component: OrigFlightList, name: '进港航班申报' },
{path:'/waybill',component:Waybill,name:'进港运单申报'},
{path:'/allocateSearch',component:AllocateSearch,name:'运单分拨申报'},
{ path: '/enter', component: EnterFlightInfo, name: '原始舱单'},
{ path:'/origmaster',component:OrigMaster,name:'进港原始舱单'},
{path:'/entertall',component:EnterTally,name:'进港理货'},
{path:'/tallymaster',component:TallyMster,name:'进港理货舱单'},
{path:'/importallocation',component:Importallocation,name:'进港分拨'},
{path:'/allocatearrive',component:Allocatearrive,name:'分拨运抵'},
{path: '/server', component: Server, name: '服务器管理'},
{path: '/host', component: VirtualHost, name: '虚拟主机管理'},
{path: '/exchange', component: Exchange, name: '交换机管理'},
{path: '/queue', component: Queue, name: '队列管理'},
{path: '/routing', component: RoutingKey, name: '路由键管理'},
{path: '/umb', component: UserMessageBinding, name: '配置管理'},
{path: '/note', component: MessageNote, name: '消息记录管理'},
]
},
{
path: '/lost',
component: Home,
name: '落装改配申报',
iconCls:'el-icon-goods',
children:[
{path:'/lostLoad',component:LostLoad,name:'落装业务申报'},
{path:'/lostLoadChange',component:LostLoadChange,name:'改配业务申报'}
]
},
{
path: '/airtransport',
component: Home,
name: '通用业务申报',
iconCls:'el-icon-goods',
children:[
{path:'/route',component:Route,name:'航线申报'},
{path:'/bill',component:Bill,name:'单据申报'},
{path:'/flights',component:Flight,name:'航班申报'},
{path:'/flightplan',component:Flightplan,name:'当日飞行计划'},
{path:'/aircraft',component:Aircraft,name:'通用航空器申报'},
{path:'/routeaircraft',component:Routeaircraft,name:'航线航空器申报'},
]
},
{
path: '/querytransport',
component: Home,
name: '通用业务查询',
iconCls:'el-icon-goods',
children:[
{path:'/queryRoute',component:queryRoute,name:'航线查询'},
{path:'/queryBill',component:queryBill,name:'单据查询'},
{path:'/queryFlights',component:queryFlight,name:'航班查询'},
{path:'/queryFlightplan',component:queryFlightplan,name:'当日飞行计划查询'},
{path:'/queryAircraft',component:queryAircraft,name:'通用航空器查询'},
{path:'/queryRouteaircraft',component:queryRouteaircraft,name:'航线航空器查询'},
]
},
{
path: '/input',
component: Home,
name: '进港航班申报',
iconCls:'el-icon-goods',
children:[
{path:'/arrival',component:arrival,name:'进港预报申报'},
{path:'/confirmatory',component:confirmatory,name:'进港确报申报'},
{path:'/queryArrival',component:queryArrival,name:'进港预报查询'},
{path:'/queryConfirmatory',component:queryConfirmatory,name:'进港确报查询'},
{path:'/configure',component:configure,name:'进港航班配置'},
{path:'/queryConfigure',component:queryConfigure,name:'航班配置查询'},
]
},
{
path: '/out',
component: Home,
name: '出港航班申报',
iconCls:'el-icon-goods',
children:[
{path:'/departure',component:departure,name:'出港预报申报'},
{path:'/declare',component:declare,name:'出港确报申报'},
{path:'/queryDeparture',component:queryDeparture,name:'出港预报查询'},
{path:'/queryDeclare',component:queryDeclare,name:'出港确报查询'},
{path:'/outConfigure',component:outConfigure,name:'出港航班配置'},
{path:'/queryFlightConfigure',component:queryFlightConfigure,name:'航班配置查询'},
]
},
{
path: '/empt',
component: Home,
name: '能源管理',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/location', component: Location, name: '能源缴费' },
]
},
{
path: '/satff',
component: Home,
name: '生活保障部门',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' },
{ path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' },
{ path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' },
{ path: '/come_car', component: ComeCar, name: '职工公寓外来人员车辆登记管理' },
{ path: '/on_duty', component: OnDuty, name: '职工公寓值班巡视记录管理' },
]
},
{
path: '/water_heating_chamber',
component: Home,
name: '水暖室',
iconCls: 'fa fa-address-card',
// leaf: true,//只有一个节点
children: [
{ path: '/water_stations_patrol', component: WaterStationsPatrol, name: '二水厂-水站巡视记录单管理' },
// { path: '/page6', component: Page6, name: '水质量检测' },
// { path: '/page6', component: Page6, name: '污水站' },
// { path: '/page6', component: Page6, name: '一水厂' },
// { path: '/page6', component: Page6, name: '综合楼空调站' },
]
},
// {
// path: '/guestService',
// component: Home,
// name: '客服系统',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/process', component: Process, name: '工单管理' },
// { path: '/job', component: Job, name: '任务管理' },
// {path: '/pre1', component: PreManifest, name: '预配'},
// ]
// },
// {
// path: '/output',
// component: Home,
// name: '出港业务申报',
// iconCls: 'el-icon-collection',
// children: [
// {path: '/flight', component: ExitFlight, name: '出港航班申报'},
// {path: '/manifest', component: ExitManifest, name: '出港运单申报'},
// {path: '/pre', component: ExitPre, name: '出港预配舱单'},
// {path: '/arrive', component: ExitArrive, name: '出港运抵'},
// {path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
// {path: '/loading', component: ExitLoading, name: '出港装载'},
// {path: '/tidy', component: ExitTidy, name: '出港理货'}
// ]
// },
// {
// path: '/nmms2',
// component: Home,
// name: '进港业务申报',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/orig', component: OrigFlightList, name: '进港航班申报' },
// {path:'/waybill',component:Waybill,name:'进港运单申报'},
// {path:'/allocateSearch',component:AllocateSearch,name:'运单分拨申报'},
// { path: '/enter', component: EnterFlightInfo, name: '原始舱单'},
// { path:'/origmaster',component:OrigMaster,name:'进港原始舱单'},
// {path:'/entertall',component:EnterTally,name:'进港理货'},
// {path:'/tallymaster',component:TallyMster,name:'进港理货舱单'},
// {path:'/importallocation',component:Importallocation,name:'进港分拨'},
// {path:'/allocatearrive',component:Allocatearrive,name:'分拨运抵'},
// ]
// },
// {
// path: '/lost',
// component: Home,
// name: '落装改配申报',
// iconCls:'el-icon-goods',
// children:[
// {path:'/lostLoad',component:LostLoad,name:'落装业务申报'},
// {path:'/lostLoadChange',component:LostLoadChange,name:'改配业务申报'}
//
// ]
// },
// {
// path: '/airtransport',
// component: Home,
// name: '通用业务申报',
// iconCls:'el-icon-goods',
// children:[
// {path:'/route',component:Route,name:'航线申报'},
// {path:'/bill',component:Bill,name:'单据申报'},
// {path:'/flights',component:Flight,name:'航班申报'},
// {path:'/flightplan',component:Flightplan,name:'当日飞行计划'},
// {path:'/aircraft',component:Aircraft,name:'通用航空器申报'},
// {path:'/routeaircraft',component:Routeaircraft,name:'航线航空器申报'},
// ]
// },
// {
// path: '/querytransport',
// component: Home,
// name: '通用业务查询',
// iconCls:'el-icon-goods',
// children:[
// {path:'/queryRoute',component:queryRoute,name:'航线查询'},
// {path:'/queryBill',component:queryBill,name:'单据查询'},
// {path:'/queryFlights',component:queryFlight,name:'航班查询'},
// {path:'/queryFlightplan',component:queryFlightplan,name:'当日飞行计划查询'},
// {path:'/queryAircraft',component:queryAircraft,name:'通用航空器查询'},
// {path:'/queryRouteaircraft',component:queryRouteaircraft,name:'航线航空器查询'},
// ]
// },
// {
// path: '/input',
// component: Home,
// name: '进港航班申报',
// iconCls:'el-icon-goods',
// children:[
// {path:'/arrival',component:arrival,name:'进港预报申报'},
// {path:'/confirmatory',component:confirmatory,name:'进港确报申报'},
// {path:'/queryArrival',component:queryArrival,name:'进港预报查询'},
// {path:'/queryConfirmatory',component:queryConfirmatory,name:'进港确报查询'},
// {path:'/configure',component:configure,name:'进港航班配置'},
// {path:'/queryConfigure',component:queryConfigure,name:'航班配置查询'},
// ]
// },
// {
// path: '/out',
// component: Home,
// name: '出港航班申报',
// iconCls:'el-icon-goods',
// children:[
// {path:'/departure',component:departure,name:'出港预报申报'},
// {path:'/declare',component:declare,name:'出港确报申报'},
// {path:'/queryDeparture',component:queryDeparture,name:'出港预报查询'},
// {path:'/queryDeclare',component:queryDeclare,name:'出港确报查询'},
// {path:'/outConfigure',component:outConfigure,name:'出港航班配置'},
// {path:'/queryFlightConfigure',component:queryFlightConfigure,name:'航班配置查询'},
// ]
// },
//
// {
// path: '/empt',
// component: Home,
// name: '能源管理',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/location', component: Location, name: '能源缴费' },
// ]
// },
// {
// path: '/satff',
// component: Home,
// name: '生活保障部门',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' },
// { path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' },
// { path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' },
// { path: '/come_car', component: ComeCar, name: '职工公寓外来人员车辆登记管理' },
// { path: '/on_duty', component: OnDuty, name: '职工公寓值班巡视记录管理' },
// ]
// },
// {
// path: '/water_heating_chamber',
// component: Home,
// name: '水暖室',
// iconCls: 'fa fa-address-card',
// // leaf: true,//只有一个节点
// children: [
// { path: '/water_stations_patrol', component: WaterStationsPatrol, name: '二水厂-水站巡视记录单管理' },
// // { path: '/page6', component: Page6, name: '水质量检测' },
// // { path: '/page6', component: Page6, name: '污水站' },
// // { path: '/page6', component: Page6, name: '一水厂' },
// // { path: '/page6', component: Page6, name: '综合楼空调站' },
// ]
// },
{
path: '/',
component: Home,
... ...
... ... @@ -146,7 +146,7 @@
}
};
return {
sysName:'易通快速通关申报管理系统',
sysName:'消息控制中心',
collapsed:false,
sysUserName: '',
sysUserId:'',
... ... @@ -371,7 +371,7 @@
aside {
flex:0 0 230px;
width: 230px;
overflow-y: scroll;
/*overflow-y: scroll;*/
background: #606060;
// position: absolute;
// top: 0px;
... ...
<template>
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="24">
<el-col :span="4">
<el-input v-model="exchange_queryInfo.exchangeName" prefix-icon="el-icon-search"
size="medium"
placeholder="交换机名称" clearable style="width:180px"></el-input>
</el-col>
<el-col :span="4">
<el-cascader
style="width:180px" size="medium"
v-model="exchange_queryInfo.virtualHostId"
:options="exchange_config.cascade.server_hostList"
:show-all-levels="false"
:change-on-select="false"
clearable
@change="cascadeQueryChange"
:props="exchange_config.cascade.defaultParams"
placeholder="请选择所属虚拟主机"></el-cascader>
</el-col>
<el-col :span="8">
<el-button type="success" style="width:150px" size="medium" @click="exchange_getList">
查询交换机
</el-button>
<el-button type="primary" style="width:150px" size="medium" @click="exchange_toAddDialog">
添加交换机
</el-button>
</el-col>
</el-row>
</div>
<!-- 列表区域 -->
<div style="margin-top: 20px;">
<el-table :data="exchange_page.exchangeList" border v-loading="exchange_loading.listLoading"
@selection-change="exchange_selectChange"
element-loading-text="获取交换机列表,拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="交换机名称" prop="exchangeName" align="center"
width="190"></el-table-column>
<el-table-column label="所属虚拟主机" prop="virtualHost.virtualHostName" align="center" width="190">
</el-table-column>
<el-table-column label="交换机类型" prop="exchangeType" align="center" width="160">
</el-table-column>
<el-table-column label="是否持久化" prop="durability" align="center" width="145">
<template slot-scope="scope">
<span v-if="scope.row.durability ===false">否</span>
<span v-if="scope.row.durability ===true">是</span>
</template>
</el-table-column>
<el-table-column label="是否自动删除" prop="autoDelete" align="center" width="145">
<template slot-scope="scope">
<span v-if="scope.row.autoDelete ===false">否</span>
<span v-if="scope.row.autoDelete ===true">是</span>
</template>
</el-table-column>
<el-table-column label="是否仅内部使用" prop="internal" align="center" width="145">
<template slot-scope="scope">
<span v-if="scope.row.internal ===false">否</span>
<span v-if="scope.row.internal ===true">是</span>
</template>
</el-table-column>
<el-table-column label="扩展参数" prop="arguments" align="center" width="200">
</el-table-column>
<el-table-column label="相关描述" prop="description" align="center" width="300"></el-table-column>
<el-table-column label="操作" width="280px" align="center" fixed="right">
<template slot-scope="scope">
<!-- 路由键 style="width:50px;margin-left: 1px;"-->
<el-tooltip effect="dark" content="路由键" placement="top-start" :enterable="false">
<el-button type="warning" icon="el-icon-link" size="small"
@click="toRoutingKey(scope.$index,scope.row)">路由键
</el-button>
</el-tooltip>
<!-- 编辑按钮 style="width:50px;margin-left: 1px;"-->
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="small"
@click="exchange_toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<!-- 删除按钮 style="width:50px;margin-left: 1px;"-->
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="danger" icon="el-icon-delete" size="small"
:loading="exchange_loading.delLoading"
@click="exchange_remove(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<!--分页区域-->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:loading="exchange_loading.batchDelLoading"
:disabled="this.exchange_page.selectList.length===0"
@click="exchange_batchRemove">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="exchange_handleSizeChange"
@current-change="exchange_handleCurrentChange"
:current-page="exchange_queryInfo.pageNum"
:page-sizes="[10,20,30,50]"
:page-size="exchange_queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="exchange_page.total">
</el-pagination>
</el-col>
</el-row>
</div>
</el-card>
<!-- 增加,对话框区域 -->
<div>
<el-dialog title="添加交换机"
:visible.sync="exchange_dialog.addDialog"
style="margin-top: -50px"
width="62%" text-align="center" @close="exchange_addDialogClosed">
<el-form :inline="true" label-width="145px" status-icon style="margin-top: -10px"
:model="exchange_addForm" :rules="exchange_addFormRules" ref="exchange_addFormRef">
<el-form-item label="交换机名称:" prop="exchangeName">
<el-input v-model="exchange_addForm.exchangeName" style="width:240px" size="small" clearable
placeholder="请输入交换机名称">
</el-input>
</el-form-item>
<el-form-item label="所属虚拟主机:" prop="virtualHostId">
<el-cascader
clearable style="width: 240px" size="small"
v-model="exchange_addForm.virtualHostId"
@change="cascadeAddChange"
:options="exchange_config.cascade.server_hostList"
:show-all-levels="false"
:change-on-select="false"
:props="exchange_config.cascade.defaultParams"
placeholder="请选择所属虚拟主机"></el-cascader>
</el-form-item>
<el-form-item label="交换机类型:" prop="exchangeType">
<el-select v-model="exchange_addForm.exchangeType" style="width: 240px" clearable
size="small"
placeholder="请选择交换机类型">
<el-option
v-for="item in exchangeTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否持久化:" prop="durability">
<el-select v-model="exchange_addForm.durability" style="width: 240px" clearable size="small"
placeholder="请选择是否持久化">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否自动删除:" prop="autoDelete">
<el-select v-model="exchange_addForm.autoDelete" style="width: 240px" clearable size="small"
placeholder="请选择是否自动删除">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否仅内部使用:" prop="internal">
<el-select v-model="exchange_addForm.internal" style="width: 240px" clearable size="small"
placeholder="是否仅内部使用">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="扩展参数:" prop="arguments">
<el-input v-model="exchange_addForm.arguments" style="width:240px" clearable size="small"
placeholder="扩展参数(JSON格式)">
</el-input>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="exchange_addForm.description" style="width:240px" clearable size="small"
placeholder="相关描述">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
<el-button type="info" @click="exchange_dialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="exchange_add" :loading="exchange_loading.addLoading"
size="medium" style="width: 100px">添加
</el-button>
</div>
</el-dialog>
</div>
<!-- 编辑,对话框区域 -->
<div>
<el-dialog title="编辑交换机"
:visible.sync="exchange_dialog.editDialog"
style="margin-top: -50px"
width="62%" text-align="center" @close="exchange_editDialogClosed">
<el-form :inline="true" label-width="145px" status-icon style="margin-top: -10px"
:model="exchange_editForm" :rules="exchange_editFormRules" ref="exchange_editFormRef">
<el-form-item label="交换机名称:" prop="exchangeName">
<el-input v-model="exchange_editForm.exchangeName" style="width:240px" size="small"
clearable
placeholder="请输入交换机名称">
</el-input>
</el-form-item>
<el-form-item label="所属虚拟主机:" prop="virtualHostId">
<el-cascader
clearable style="width: 240px" size="small"
v-model="exchange_editForm.virtualHostId"
@change="cascadeEditChange"
:options="exchange_config.cascade.server_hostList"
:show-all-levels="false"
:change-on-select="false"
:props="exchange_config.cascade.defaultParams"
placeholder="请选择所属虚拟主机"></el-cascader>
</el-form-item>
<el-form-item label="交换机类型:" prop="exchangeType">
<el-select v-model="exchange_editForm.exchangeType" style="width: 240px" clearable
size="small"
placeholder="请选择交换机类型">
<el-option
v-for="item in exchangeTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否持久化:" prop="durability">
<el-select v-model="exchange_editForm.durability" style="width: 240px" clearable
size="small"
placeholder="请选择是否持久化">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否自动删除:" prop="autoDelete">
<el-select v-model="exchange_editForm.autoDelete" style="width: 240px" clearable
size="small"
placeholder="请选择是否自动删除">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否仅内部使用:" prop="internal">
<el-select v-model="exchange_editForm.internal" style="width: 240px" clearable size="small"
placeholder="是否仅内部使用">
<el-option
v-for="item in booleanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="扩展参数:" prop="arguments">
<el-input v-model="exchange_editForm.arguments" style="width:240px" clearable size="small"
placeholder="扩展参数(JSON格式)">
</el-input>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="exchange_editForm.description" style="width:240px" clearable size="small"
placeholder="相关描述">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="exchange_dialog.editDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="exchange_edit" :loading="exchange_loading.addLoading"
size="medium"
style="width: 100px">
编辑
</el-button>
</div>
</el-dialog>
</div>
</el-main>
</el-container>
</template>
<script>
import {
selectBusExchangeList,
insertBusExchange,
updateBusExchange,
deleteBusExchange,
batchRemoveBusExchange, getServerAndHostList, getHostList, getServerList,
} from "../../api/message_bus";
export default {
name: "Exchange",
data() {
return {
/**
* exchange,配置与参数
*/
exchange_config: {
// 所属虚拟主机名称
virtualHostName: '',
// 所有虚拟主机的基本信息
virtualHostList: [],
// 级联显示
cascade: {
// 服务器及虚拟主机列表
server_hostList: [],
defaultParams: {
label: 'aliasName',
value: 'id',
children: 'aliasList'
}
},
},
/**
* exchange,搜索参数
*/
exchange_queryInfo: {
// 所属虚拟主机Id
virtualHostId: '',
// 交换机名称
exchangeName: '',
// 当前页数
pageNum: 1,
// 每页条数
pageSize: 10
},
/**
* exchange,分页
*/
exchange_page: {
// 列表
exchangeList: [],
// 总条数
total: 0,
// 删除选中列表
selectList: [],
},
/**
* exchange,新增表单
*/
exchange_addForm: {
// 交换机名称
exchangeName: '',
//所属虚拟主机ID
virtualHostId: '',
// 交换机类型,默认 direct;direct(路由-订阅)、topic(动态路由-订阅)、fanout(广播)
exchangeType: 'direct',
// 是否持久化,默认 true
durability: true,
// 是否自动删除,默认 false
autoDelete: false,
//是否是RabbitMQ内部使用,默认 false
internal: false,
// 扩展参数,以JSON格式存储
arguments: '',
// 交换机相关描述
description: '',
},
/**
* exchange,编辑表单
*/
exchange_editForm: {}
,
/**
* exchange,加载
*/
exchange_loading: {
// 列表加载
listLoading: false,
// 添加加载
addLoading: false,
// 编辑加载
editLoading: false,
// 删除加载
delLoading: false,
// 批量删除加载
batchDelLoading: false,
},
/**
* exchange,对话框管理
*/
exchange_dialog: {
// 添加对话框
addDialog: false,
// 编辑对话框
editDialog: false,
},
/**
* exchange,添加表单,验证规则
*/
exchange_addFormRules: {
exchangeName: [
{required: true, message: '请输入交换机名称', trigger: ['blur', 'change']},
],
virtualHostId: [
{required: true, message: '请选择虚拟主机', trigger: ['blur', 'change']},
],
exchangeType: [
{required: true, message: '请选择交换机类型', trigger: ['blur', 'change']},
],
durability: [
{required: true, message: '请选择是否持久化', trigger: ['blur', 'change']},
],
autoDelete: [
{required: true, message: '请选择是否自动删除', trigger: ['blur', 'change']},
],
internal: [
{required: true, message: '请选择是否仅内部使用', trigger: ['blur', 'change']},
],
// 扩展参数,以JSON格式存储
arguments: '',
// 交换机相关描述
description: '',
},
/**
* exchange,编辑表单,验证规则
*/
exchange_editFormRules: {
exchangeName: [
{required: true, message: '请输入交换机名称', trigger: ['blur', 'change']},
],
virtualHostId: [
{required: true, message: '请选择虚拟主机', trigger: ['blur', 'change']},
],
exchangeType: [
{required: true, message: '请选择交换机类型', trigger: ['blur', 'change']},
],
durability: [
{required: true, message: '请选择是否持久化', trigger: ['blur', 'change']},
],
autoDelete: [
{required: true, message: '请选择是否自动删除', trigger: ['blur', 'change']},
],
internal: [
{required: true, message: '请选择是否仅内部使用', trigger: ['blur', 'change']},
],
// 扩展参数,以JSON格式存储
arguments: '',
// 交换机相关描述
description: '',
},
/**
* Boolean属性,选择列表
*/
booleanList: [
{
value: true,
label: '是'
},
{
value: false,
label: '否'
},
],
/**
* 交换机类型,选择列表
*/
exchangeTypeList: [
{
value: 'direct',
label: 'direct'
},
{
value: 'topic',
label: 'topic'
},
{
value: 'fanout',
label: 'fanout'
},
{
value: 'headers',
label: 'headers'
},
],
}
},
methods: {
/**
* 分页查询,监听 pageSize 改变的事件
*/
exchange_handleSizeChange(newSize) {
this.exchange_queryInfo.pageSize = newSize;
//刷新列表
this.exchange_getList();
},
/**
* 分页查询,监听 pageNum 改变的事件
*/
exchange_handleCurrentChange(newPage) {
this.exchange_queryInfo.pageNum = newPage;
//刷新列表
this.exchange_getList();
},
/**
* exchange,分页查询
*/
exchange_getList() {
// 开启加载
this.exchange_loading.listLoading = true;
selectBusExchangeList(this.exchange_queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.exchange_loading.listLoading = false;
return this.$message.error('获取交换机列表,失败!');
}
// 获取列表数据
this.exchange_page.exchangeList = res.data.list;
// 获取列表的总记录数
this.exchange_page.total = res.data.total;
// 关闭加载
this.exchange_loading.listLoading = false;
this.$message.success('获取交换机列表,成功!');
}).catch(error => {
// 关闭加载
this.exchange_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* exchange,添加对话框,打开事件
*/
exchange_toAddDialog() {
this.exchange_dialog.addDialog = true;
},
/**
* exchange,添加对话框,关闭事件
*/
exchange_addDialogClosed() {
// 重置对话框
this.$refs.exchange_addFormRef.resetFields();
},
/**
* exchange,添加功能
*/
exchange_add() {
// 进行表单的预验证
this.$refs.exchange_addFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.exchange_loading.addLoading = true;
insertBusExchange(this.exchange_addForm).then((response) => {
let res = response.data;
// 添加失败
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.exchange_loading.addLoading = false;
return this.$message.error('该交换机,已存在');
}
if (res.code === '999') {
// 关闭加载
this.exchange_loading.addLoading = false;
return this.$message.error('未知异常,添加交换机,失败');
}
// 关闭加载
this.exchange_loading.addLoading = false;
return this.$message.error('添加交换机,失败');
}
// 添加,成功
this.$message.success('添加交换机,成功');
// 关闭加载
this.exchange_loading.addLoading = false;
// 隐藏对话框
this.exchange_dialog.addDialog = false;
// 刷新列表
this.exchange_getList();
}).catch(error => {
// 关闭加载
this.exchange_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* exchange,编辑对话框,打开事件
*/
exchange_toEditDialog(index, row) {
this.exchange_editForm = Object.assign({}, row);
this.exchange_dialog.editDialog = true;
},
/**
* exchange,编辑对话框,关闭事件
*/
exchange_editDialogClosed() {
//重置对话框
this.$refs.exchange_editFormRef.resetFields();
},
/**
* exchange,编辑功能
*/
exchange_edit() {
//进行表单的预验证
this.$refs.exchange_editFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.exchange_loading.editLoading = true;
updateBusExchange(this.exchange_editForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.exchange_loading.editLoading = false;
return this.$message.error('该交换机,已存在');
}
if (res.code === '999') {
// 关闭加载
this.exchange_loading.editLoading = false;
return this.$message.error('未知异常,编辑交换机信息,失败');
}
//关闭加载
this.exchange_loading.editLoading = false;
return this.$message.error('编辑交换机信息,失败');
}
// 关闭加载
this.exchange_loading.editLoading = false;
this.$message.success('编辑交换机信息,成功!');
// 隐藏对话框
this.exchange_dialog.editDialog = false;
// 刷新列表
this.exchange_getList();
}).catch(error => {
this.exchange_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* exchange,删除功能
*/
exchange_remove(index, row) {
// 弹框询问是否删除?
this.$confirm('此操作永久删除该交换机信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.exchange_loading.delLoading = true;
deleteBusExchange(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.exchange_loading.delLoading = false;
return this.$message.error('删除交换机信息,失败');
}
// 关闭加载
this.exchange_loading.delLoading = false;
this.$message.success('删除交换机信息,成功!');
// 刷新列表
this.exchange_getList();
}).catch(error => {
this.exchange_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 批量删除---选中
*/
exchange_selectChange: function (selectList) {
this.exchange_page.selectList = selectList;
},
/**
* exchange,批量删除功能
*/
exchange_batchRemove() {
const ids = this.exchange_page.selectList.map(item => item.id).toString();
this.$confirm('此操作将永久删除选中的交换机信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.exchange_loading.batchDelLoading = true;
let params = {ids: ids};
batchRemoveBusExchange(params).then(response => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.exchange_loading.batchDelLoading = false;
return this.$message.error('批量删除交换机信息,失败');
}
this.$message.success('批量删除交换机信息,成功!');
// 关闭加载
this.exchange_loading.batchDelLoading = false;
// 刷新列表
this.exchange_getList();
}).catch(error => {
// 关闭加载
this.exchange_loading.batchDelLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* exchange,获取全部虚拟主机
*/
selectHostList() {
getHostList().then((response) => {
let res = response.data;
if (res.code !== '200') {
return this.$message.error('获取虚拟主机列表,失败!');
}
// 获取列表数据
this.exchange_config.virtualHostList = res.data;
// this.$message.success('获取虚拟主机列表,成功!');
}).catch(error => {
this.$message.error(error.toString());
});
},
/**
* 服务器与虚拟主机 1:n
* 获取列表
*/
selectServerAndHostList() {
getServerAndHostList().then((response) => {
let res = response.data;
if (res.code !== '200') {
return this.$message.error('获取服务器与虚拟主机信息,失败!');
}
// 获取列表数据
this.exchange_config.cascade.server_hostList = res.data;
// this.$message.success('获取虚拟主机列表,成功!');
}).catch(error => {
this.$message.error(error.toString());
});
},
/**
* 查询,级联。值改变激发的方法
* @param value 改变后的值
*/
cascadeQueryChange(value) {
let ids = value.join().split(",");
this.exchange_queryInfo.virtualHostId = ids[ids.length - 1];
},
/**
* 添加,级联。值改变激发的方法
* @param value 改变后的值
*/
cascadeAddChange(value) {
let ids = value.join().split(",");
this.exchange_addForm.virtualHostId = ids[ids.length - 1];
},
cascadeEditChange(value) {
let ids = value.join().split(",");
this.exchange_editForm.virtualHostId = ids[ids.length - 1];
},
/**
* 携带参数,跳转至路由键界面
*/
toRoutingKey(index, row) {
this.$confirm('查看该交换机下的路由键, 是否继续?', '提示', {
confirmButtonText: '查看',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.$router.push({name: "路由键管理", params: {exchange_scopeRow: row}})
}).catch(() => {
});
},
},
created() {
if (this.$route.params.virtualHost_scopeRow !== undefined) {
// 参数,虚拟主机id
this.exchange_queryInfo.virtualHostId = this.$route.params.virtualHost_scopeRow.id;
// 刷新列表
this.exchange_getList();
// 参数,虚拟主机名称
//this.exchange_config.virtualHostName = this.$route.params.virtualHost_scopeRow.virtualHostName;
} else {
// 刷新列表
this.exchange_getList();
}
},
mounted() {
// this.selectHostList();
this.selectServerAndHostList();
},
computed: {},
}
</script>
<style scoped>
</style>
... ...
<template>
<div>消息记录</div>
</template>
<script>
export default {
name: "MessageNote",
data() {
return {
}
},
methods: {
},
created() {
},
mounted() {
},
computed: {
},
}
</script>
<style scoped>
</style>
... ...
<template>
<div>消息队列</div>
</template>
<script>
import {
selectBusQueueList,
insertBusQueue,
updateBusQueue,
deleteBusQueue,
batchRemoveBusQueue,
getServerAndHostAndExchangeList,
} from "../../api/message_bus";
export default {
name: "Queue",
data() {
return {
/**
* queue,配置与参数
*/
queue_config: {
// 级联显示
cascade: {
// 服务器及虚拟主机列表
server_host_exchangeList: [],
defaultParams: {
label: 'aliasName',
value: 'id',
children: 'aliasList'
}
},
},
/**
* queue,搜索参数
*/
queue_queryInfo: {
// 队列名称
queueName: '',
// 所属交换机id
exchangeId: '',
// 当前页数
pageNum: 1,
// 每页条数
pageSize: 10
},
}
},
methods: {},
created() {
},
mounted() {
},
computed: {},
}
</script>
<style scoped>
</style>
... ...
<template>
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="24">
<el-col :span="4">
<el-input v-model="routingKey_queryInfo.routingKeyName" placeholder="路由键名称"
prefix-icon="el-icon-search" size="medium" clearable style="width:180px">
</el-input>
</el-col>
<el-col :span="4">
<el-cascader
style="width:180px" size="medium"
v-model="routingKey_queryInfo.exchangeId"
:options="routingKey_config.cascade.server_host_exchangeList"
:show-all-levels="false"
:change-on-select="false"
clearable
@change="cascadeQueryChange"
:props="routingKey_config.cascade.defaultParams"
placeholder="请选择所属交换机"></el-cascader>
</el-col>
<el-col :span="8">
<el-button type="success" style="width:150px" size="medium" @click="routingKey_getList">
查询路由键
</el-button>
<el-button type="primary" style="width:150px" size="medium" @click="routingKey_toAddDialog">
添加路由键
</el-button>
</el-col>
</el-row>
</div>
<!-- 列表区域 -->
<div style="margin-top: 20px;">
<el-table :data="routingKey_page.routingKeyList" border v-loading="routingKey_loading.listLoading"
@selection-change="routingKey_selectChange"
element-loading-text="获取路由键列表,拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="路由键名称" prop="routingKeyName" align="center"
width="220"></el-table-column>
<el-table-column label="所属交换机" prop="busExchange.exchangeName" align="center"
width="220"></el-table-column>
<el-table-column label="相关描述" prop="description" align="center" width="280"></el-table-column>
<!-- fixed="right" -->
<el-table-column label="操作" width="232px" align="center">
<template slot-scope="scope">
<!-- 编辑按钮-->
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="mini"
@click="routingKey_toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<!-- 删除按钮-->
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="danger" icon="el-icon-delete" size="mini"
:loading="routingKey_loading.delLoading"
@click="routingKey_remove(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<!--分页区域-->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:loading="routingKey_loading.batchDelLoading"
:disabled="this.routingKey_page.selectList.length===0"
@click="routingKey_batchRemove">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="routingKey_handleSizeChange"
@current-change="routingKey_handleCurrentChange"
:current-page="routingKey_queryInfo.pageNum"
:page-sizes="[10,20,30,50]"
:page-size="routingKey_queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="routingKey_page.total">
</el-pagination>
</el-col>
</el-row>
</div>
</el-card>
<!-- 增加,对话框区域 -->
<div>
<el-dialog title="添加路由键"
:visible.sync="routingKey_dialog.addDialog"
style="margin-top: -50px" text-align="center" width="50%"
@close="routingKey_addDialogClosed">
<el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center"
:model="routingKey_addForm" :rules="routingKey_addFormRules" ref="routingKey_addFormRef">
<el-form-item label="路由键名称:" prop="routingKeyName">
<el-input v-model="routingKey_addForm.routingKeyName" placeholder="请输入路由键名称"
style="width:240px" size="small" clearable>
</el-input>
</el-form-item>
<el-form-item label="所属交换机:" prop="exchangeId">
<el-cascader
style="width:240px" size="small" clearable
v-model="routingKey_addForm.exchangeId"
:options="routingKey_config.cascade.server_host_exchangeList"
:show-all-levels="false"
:change-on-select="false"
@change="cascadeAddChange"
:props="routingKey_config.cascade.defaultParams"
placeholder="请选择所属交换机"></el-cascader>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="routingKey_addForm.description" style="width:240px" clearable
size="small"
placeholder="相关描述">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
<el-button type="info" @click="routingKey_dialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="routingKey_add" :loading="routingKey_loading.addLoading"
size="medium" style="width: 100px">添加
</el-button>
</div>
</el-dialog>
</div>
<!-- 编辑,对话框区域 -->
<div>
<el-dialog title="编辑交换机"
:visible.sync="routingKey_dialog.editDialog"
style="margin-top: -50px" text-align="center" width="50%"
@close="routingKey_editDialogClosed">
<el-form :inline="true" label-width="120px" status-icon style="margin-top: -10px" align="center"
:model="routingKey_editForm" :rules="routingKey_editFormRules" ref="routingKey_editFormRef">
<el-form-item label="路由键名称:" prop="routingKeyName">
<el-input v-model="routingKey_editForm.routingKeyName" placeholder="请输入路由键名称"
style="width:240px" size="small" clearable>
</el-input>
</el-form-item>
<el-form-item label="所属交换机:" prop="exchangeId">
<el-cascader
style="width:240px" size="small" clearable
v-model="routingKey_editForm.exchangeId"
:options="routingKey_config.cascade.server_host_exchangeList"
:show-all-levels="false"
:change-on-select="false"
@change="cascadeEditChange"
:props="routingKey_config.cascade.defaultParams"
placeholder="请选择所属交换机"></el-cascader>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="routingKey_editForm.description" style="width:240px" clearable
size="small"
placeholder="相关描述">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="routingKey_dialog.editDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="routingKey_edit" :loading="routingKey_loading.addLoading"
size="medium"
style="width: 100px">
编辑
</el-button>
</div>
</el-dialog>
</div>
</el-main>
</el-container>
</template>
<script>
import {
selectRoutingKeyList,
insertRoutingKey,
updateRoutingKey,
deleteRoutingKey,
batchRemoveRoutingKey,
getServerAndHostAndExchangeList,
} from "../../api/message_bus";
export default {
name: "RoutingKey",
data() {
return {
/**
* routingKey,配置与参数
*/
routingKey_config: {
// 级联显示
cascade: {
// 服务器及虚拟主机列表
server_host_exchangeList: [],
defaultParams: {
label: 'aliasName',
value: 'id',
children: 'aliasList'
}
},
},
/**
* routingKey,搜索参数
*/
routingKey_queryInfo: {
// 路由键名称
routingKeyName: '',
// 所属交换机id
exchangeId: '',
// 当前页数
pageNum: 1,
// 每页条数
pageSize: 10
},
/**
* routingKey,分页
*/
routingKey_page: {
// 路由键列表
routingKeyList: [],
// 总条数
total: 0,
// 批量删除,选中列表
selectList: [],
},
/**
* routingKey,新增表单
*/
routingKey_addForm: {
// 路由键名称
routingKeyName: '',
// 所属交换机id
exchangeId: '',
// 相关描述
description: '',
},
/**
* routingKey,编辑表单
*/
routingKey_editForm: {}
,
/**
* routingKey,加载
*/
routingKey_loading: {
// 列表加载
listLoading: false,
// 添加加载
addLoading: false,
// 编辑加载
editLoading: false,
// 删除加载
delLoading: false,
// 批量删除加载
batchDelLoading: false,
},
/**
* routingKey,对话框管理
*/
routingKey_dialog: {
// 添加对话框
addDialog: false,
// 编辑对话框
editDialog: false,
},
/**
* routingKey,添加表单,验证规则
*/
routingKey_addFormRules: {
// 路由键名称
routingKeyName: [
{required: true, message: '请输入路由键名称', trigger: ['blur', 'change']},
],
// 所属交换机id
exchangeId: [
{required: true, message: '请选择所属交换机', trigger: ['blur', 'change']},
],
// 相关描述
description: [
{required: true, message: '请输入相关描述', trigger: ['blur', 'change']},
],
},
/**
* routingKey,编辑表单,验证规则
*/
routingKey_editFormRules: {
// 路由键名称
routingKeyName: [
{required: true, message: '请输入路由键名称', trigger: ['blur', 'change']},
],
// 所属交换机id
exchangeId: [
{required: true, message: '请选择所属交换机', trigger: ['blur', 'change']},
],
// 相关描述
description: [
{required: true, message: '请输入相关描述', trigger: ['blur', 'change']},
],
},
/**
* Boolean属性,选择列表
*/
booleanList: [
{
value: true,
label: '是'
},
{
value: false,
label: '否'
},
],
}
},
methods: {
/**
* 分页查询,监听 pageSize 改变的事件
*/
routingKey_handleSizeChange(newSize) {
this.routingKey_queryInfo.pageSize = newSize;
//刷新列表
this.routingKey_getList();
},
/**
* 分页查询,监听 pageNum 改变的事件
*/
routingKey_handleCurrentChange(newPage) {
this.routingKey_queryInfo.pageNum = newPage;
//刷新列表
this.routingKey_getList();
},
/**
* routingKey,分页查询
*/
routingKey_getList() {
// 开启加载
this.routingKey_loading.listLoading = true;
selectRoutingKeyList(this.routingKey_queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.routingKey_loading.listLoading = false;
return this.$message.error('获取路由键列表,失败!');
}
// 获取列表数据
this.routingKey_page.routingKeyList = res.data.list;
// 获取列表的总记录数
this.routingKey_page.total = res.data.total;
// 关闭加载
this.routingKey_loading.listLoading = false;
this.$message.success('获取路由键列表,成功!');
}).catch(error => {
// 关闭加载
this.routingKey_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* routingKey,添加对话框,打开事件
*/
routingKey_toAddDialog() {
this.routingKey_dialog.addDialog = true;
},
/**
* routingKey,添加对话框,关闭事件
*/
routingKey_addDialogClosed() {
// 重置对话框
this.$refs.routingKey_addFormRef.resetFields();
},
/**
* routingKey,添加功能
*/
routingKey_add() {
// 进行表单的预验证
this.$refs.routingKey_addFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.routingKey_loading.addLoading = true;
insertRoutingKey(this.routingKey_addForm).then((response) => {
let res = response.data;
// 添加失败
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.routingKey_loading.addLoading = false;
return this.$message.error('该路由键,已存在');
}
if (res.code === '999') {
// 关闭加载
this.routingKey_loading.addLoading = false;
return this.$message.error('未知异常,添加路由键,失败');
}
// 关闭加载
this.routingKey_loading.addLoading = false;
return this.$message.error('添加路由键,失败');
}
// 添加,成功
this.$message.success('添加路由键,成功');
// 关闭加载
this.routingKey_loading.addLoading = false;
// 隐藏对话框
this.routingKey_dialog.addDialog = false;
// 刷新列表
this.routingKey_getList();
}).catch(error => {
// 关闭加载
this.routingKey_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* routingKey,编辑对话框,打开事件
*/
routingKey_toEditDialog(index, row) {
this.routingKey_editForm = Object.assign({}, row);
this.routingKey_dialog.editDialog = true;
},
/**
* routingKey,编辑对话框,关闭事件
*/
routingKey_editDialogClosed() {
//重置对话框
this.$refs.routingKey_editFormRef.resetFields();
},
/**
* routingKey,编辑功能
*/
routingKey_edit() {
//进行表单的预验证
this.$refs.routingKey_editFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.routingKey_loading.editLoading = true;
updateRoutingKey(this.routingKey_editForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.routingKey_loading.editLoading = false;
return this.$message.error('该路由键,已存在');
}
if (res.code === '999') {
// 关闭加载
this.routingKey_loading.editLoading = false;
return this.$message.error('未知异常,编辑路由键信息,失败');
}
//关闭加载
this.routingKey_loading.editLoading = false;
return this.$message.error('编辑路由键信息,失败');
}
// 关闭加载
this.routingKey_loading.editLoading = false;
this.$message.success('编辑路由键信息,成功!');
// 隐藏对话框
this.routingKey_dialog.editDialog = false;
// 刷新列表
this.routingKey_getList();
}).catch(error => {
// 关闭加载
this.routingKey_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* routingKey,删除功能
*/
routingKey_remove(index, row) {
// 弹框询问是否删除?
this.$confirm('此操作永久删除该路由键信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.routingKey_loading.delLoading = true;
deleteRoutingKey(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.routingKey_loading.delLoading = false;
return this.$message.error('删除路由键信息,失败');
}
// 关闭加载
this.routingKey_loading.delLoading = false;
this.$message.success('删除路由键信息,成功!');
// 刷新列表
this.routingKey_getList();
}).catch(error => {
// 关闭加载
this.routingKey_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 批量删除---选中
*/
routingKey_selectChange: function (selectList) {
this.routingKey_page.selectList = selectList;
},
/**
* routingKey,批量删除功能
*/
routingKey_batchRemove() {
const ids = this.routingKey_page.selectList.map(item => item.id).toString();
this.$confirm('此操作将永久删除选中的路由键信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.routingKey_loading.batchDelLoading = true;
let params = {ids: ids};
batchRemoveRoutingKey(params).then(response => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.routingKey_loading.batchDelLoading = false;
return this.$message.error('批量删除路由键信息,失败');
}
this.$message.success('批量删除路由键信息,成功!');
// 关闭加载
this.routingKey_loading.batchDelLoading = false;
// 刷新列表
this.routingKey_getList();
}).catch(error => {
// 关闭加载
this.routingKey_loading.batchDelLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 服务器与虚拟主机 1:n
* 虚拟主机与交换机 1: n
* 获取列表
*/
selectServerAndHostAndExchangeList() {
getServerAndHostAndExchangeList().then((response) => {
let res = response.data;
if (res.code !== '200') {
return this.$message.error('获取服务器与虚拟主机与交换机信息,失败!');
}
// 获取列表数据
this.routingKey_config.cascade.server_host_exchangeList = res.data;
// this.$message.success('获取虚拟主机列表,成功!');
}).catch(error => {
this.$message.error(error.toString());
});
},
/**
* 查询,级联。值改变激发的方法
* @param value 改变后的值
*/
cascadeQueryChange(value) {
let ids = value.join().split(",");
this.routingKey_queryInfo.exchangeId = ids[ids.length - 1];
},
/**
* 添加,级联。值改变激发的方法
* @param value 改变后的值
*/
cascadeAddChange(value) {
let ids = value.join().split(",");
this.routingKey_addForm.exchangeId = ids[ids.length - 1];
},
cascadeEditChange(value) {
let ids = value.join().split(",");
this.routingKey_editForm.exchangeId = ids[ids.length - 1];
},
},
created() {
if (this.$route.params.exchange_scopeRow !== undefined) {
// 参数,交换机id
this.routingKey_queryInfo.exchangeId = this.$route.params.exchange_scopeRow.id;
// 刷新列表
this.routingKey_getList();
} else {
// 刷新列表
this.routingKey_getList();
}
},
mounted() {
// 获取,服务器、虚拟主机、交换机的级联列表
this.selectServerAndHostAndExchangeList();
},
computed: {},
}
</script>
<style scoped>
</style>
... ...
<template>
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="24">
<el-col :span="4">
<el-input v-model="queryInfo.serverName" prefix-icon="el-icon-search" size="medium"
placeholder="服务器名称" clearable style="width:180px"></el-input>
</el-col>
<el-col :span="15">
<el-button type="success" style="width:150px" size="medium" @click="getServerList">
查询服务器信息
</el-button>
<el-button type="primary" style="width:150px" size="medium" @click="toAddDialog">
添加服务器信息
</el-button>
</el-col>
</el-row>
</div>
<!--服务器信息列表区域-->
<div style="margin-top: 20px;">
<el-table :data="serverList" border v-loading="server_loading.listLoading"
@selection-change="selectChange"
element-loading-text="获取服务器列表,拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="服务器名称" prop="serverName" align="center" width="150"></el-table-column>
<el-table-column label="服务器地址" prop="serverIp" align="center" width="150"></el-table-column>
<el-table-column label="服务器端口号" prop="serverPort" align="center" width="150"></el-table-column>
<el-table-column label="相关描述" prop="description" align="center" width="200"></el-table-column>
<el-table-column label="操作" width="300px" align="center" fixed="right">
<template slot-scope="scope">
<!-- 虚拟主机 -->
<el-tooltip effect="dark" content="虚拟主机" placement="top-start" :enterable="false">
<el-button type="warning" icon="el-icon-link" size="mini"
@click="toVirtualHost(scope.$index,scope.row)">虚拟主机
</el-button>
</el-tooltip>
<!-- 编辑按钮 -->
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="mini"
@click="toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<!-- 删除按钮 -->
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="danger" icon="el-icon-delete" size="mini"
:loading="server_loading.delLoading"
@click="removeServerInfo(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<!--分页区域-->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:disabled="this.selectList.length===0"
@click="batchRemoveServer">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="queryInfo.pageNum"
:page-sizes="[10,20,30,50]"
:page-size="queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</el-col>
</el-row>
</div>
</div>
</el-card>
<!-- 对话框 —> 添加服务器信息 -->
<div>
<el-dialog title="添加服务器信息"
:visible.sync="serverDialog.addDialog"
style="margin-top: -50px"
width="50%" text-align="center" @close="serverAddDialogClosed">
<el-form :inline="true" :model="addServerForm" label-width="120px" status-icon
:rules="addServerFormRules" ref="addServerFormRef"
align="center">
<el-form-item label="服务器名称:" prop="serverName">
<el-input v-model="addServerForm.serverName" style="width:270px" clearable
placeholder="请输入服务器名称"></el-input>
</el-form-item>
<el-form-item label="IP地址:" prop="serverIp">
<el-input v-model="addServerForm.serverIp" style="width:270px" clearable
placeholder="请输入服务器IP地址"></el-input>
</el-form-item>
<el-form-item label="端口号:" prop="serverPort">
<el-input v-model="addServerForm.serverPort" style="width:270px" clearable
placeholder="请输入服务器端口号"></el-input>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="addServerForm.description" style="width:270px" clearable
placeholder="请输入相关描述"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="serverDialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="addServerInfo" :loading="server_loading.addLoading"
size="medium"
style="width: 100px">
添加
</el-button>
</div>
</el-dialog>
</div>
<!-- 对话框 —> 编辑服务器信息 -->
<div>
<el-dialog title="编辑服务器信息"
:visible.sync="serverDialog.editDialog"
style="margin-top: -50px"
width="50%" text-align="center" @close="serverEditDialogClosed">
<el-form :inline="true" :model="editServerForm" label-width="120px" status-icon
:rules="editServerFormRules" ref="editServerFormRef"
align="center">
<el-form-item label="服务器名称:" prop="serverName">
<el-input v-model="editServerForm.serverName" style="width:270px" clearable
placeholder="请输入服务器名称"></el-input>
</el-form-item>
<el-form-item label="IP地址:" prop="serverIp">
<el-input v-model="editServerForm.serverIp" style="width:270px" clearable
placeholder="请输入服务器IP地址"></el-input>
</el-form-item>
<el-form-item label="端口号:" prop="serverPort">
<el-input v-model="editServerForm.serverPort" style="width:270px" clearable
placeholder="请输入服务器端口号"></el-input>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="editServerForm.description" style="width:270px" clearable
placeholder="请输入相关描述"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="serverDialog.editDialog = false" size="medium" style="width: 100px">取消
</el-button>
<el-button type="primary" @click="editServerInfo" :loading="server_loading.addLoading"
size="medium"
style="width: 100px">
编辑
</el-button>
</div>
</el-dialog>
</div>
</el-main>
</el-container>
</template>
<script>
import {
selectBusServerList,
insertBusServer,
updateBusServer,
deleteBusServer,
batchRemoveBusServer
} from "../../api/message_bus";
export default {
name: "Server",
data() {
// 验证IP地址的自定义规则
const serverIpValid = (rule, value, callback) => {
// 验证IP地址的正则表达式
const regMobile = /^((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))$/;
if (regMobile.test(value)) {
// 合法的IP地址
return callback();
}
callback(new Error('请输入合法的IP地址'));
};
return {
/**
* 搜索参数
*/
queryInfo: {
// 服务器名称
serverName: '',
// 当前页数
pageNum: 1,
// 每页条数
pageSize: 10
},
/**
* 添加服务器信息的表单
*/
addServerForm: {
// 服务器名称
serverName: '',
// 服务器IP
serverIp: '',
// 服务器端口号
serverPort: '',
// 相关描述
description: '',
},
/**
* 列表记录的总条数
*/
total: 0,
/**
* 服务器列表
*/
serverList: [],
/**
* 编辑服务器,表单
*/
editServerForm: {},
/**
* 批量删除的选中列表
*/
selectList: [],
/**
* Server,对话框管理
*/
serverDialog: {
// 添加对话框
addDialog: false,
// 编辑对话框
editDialog: false,
},
/**
* 加载
*/
server_loading: {
// 列表加载
listLoading: false,
// 添加加载
addLoading: false,
// 编辑加载
editLoading: false,
// 删除加载
delLoading: false,
// 批量删除加载
batchDelLoading: false,
},
/**
* 添加服务器,表单的验证规则对象
*/
addServerFormRules: {
serverName: [
{required: true, message: '请输入服务器名称', trigger: ['blur', 'change']},
],
serverIp: [
{required: true, message: '请输入服务器IP地址', trigger: ['blur', 'change']},
{validator: serverIpValid, trigger: 'blur'}
],
serverPort: [
{required: true, message: '请输入服务器端口号', trigger: ['blur', 'change']},
],
description: [
{required: true, message: '请输入服务器相关描述', trigger: ['blur', 'change']},
],
},
/**
* 编辑服务器,表单的验证规则对象
*/
editServerFormRules: {
serverName: [
{required: true, message: '请输入服务器名称', trigger: ['blur', 'change']},
],
serverIp: [
{required: true, message: '请输入服务器IP地址', trigger: ['blur', 'change']},
{validator: serverIpValid, trigger: 'blur'}
],
serverPort: [
{required: true, message: '请输入服务器端口号', trigger: ['blur', 'change']},
],
description: [
{required: true, message: '请输入服务器相关描述', trigger: ['blur', 'change']},
],
},
}
},
methods: {
/**
* 分页查询,监听 pageSize 改变的事件
*/
handleSizeChange(newSize) {
this.queryInfo.pageSize = newSize;
// 刷新列表
this.getServerList();
},
/**
* 分页查询,监听 pageNum 改变的事件
*/
handleCurrentChange(newPage) {
this.queryInfo.pageNum = newPage;
// 刷新列表
this.getServerList();
},
/**
* 查询,服务器列表
*/
getServerList() {
// 开启加载
this.server_loading.listLoading = true;
selectBusServerList(this.queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.server_loading.listLoading = false;
return this.$message.error('获取服务器列表,失败!');
}
// 获取服务器列表数据
this.serverList = res.data.list;
// 获取列表的总记录数
this.total = res.data.total;
// 关闭加载
this.server_loading.listLoading = false;
this.$message.success('获取服务器列表,成功!');
if (this.queryInfo.serverId !== undefined && this.queryInfo.serverId !== '') {
// 重置所属服务器id
this.queryInfo.serverId = undefined;
}
}).catch(error => {
// 关闭加载
this.server_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* 打开 添加服务器信息 对话框
*/
toAddDialog() {
this.serverDialog.addDialog = true;
},
/**
* 服务器信息,添加对话框,关闭事件
*/
serverAddDialogClosed() {
//重置对话框
this.$refs.addServerFormRef.resetFields();
},
/**
* 服务器信息,添加功能
*/
addServerInfo() {
// 进行表单的预验证
this.$refs.addServerFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.server_loading.addLoading = true;
insertBusServer(this.addServerForm).then((response) => {
let res = response.data;
// 添加失败
if (res.code !== '200') {
if (res.code === '402') {
// 关闭加载
this.server_loading.addLoading = false;
return this.$message.error('服务器名称,已存在');
}
if (res.code === '400') {
// 关闭加载
this.server_loading.addLoading = false;
return this.$message.error('该服务器信息,已存在');
}
if (res.code === '999') {
// 关闭加载
this.server_loading.addLoading = false;
return this.$message.error('未知异常,添加服务器信息,失败');
}
// 关闭加载
this.server_loading.addLoading = false;
return this.$message.error('添加服务器信息,失败');
}
// 添加,成功
this.$message.success('添加服务器信息,成功');
// 关闭加载
this.server_loading.addLoading = false;
// 隐藏对话框
this.serverDialog.addDialog = false;
// 刷新列表
this.getServerList();
}).catch(error => {
this.server_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 打开编辑服务器信息对话框
*/
toEditDialog(index, row) {
this.editServerForm = Object.assign({}, row);
this.serverDialog.editDialog = true;
},
/**
* 服务器信息,编辑对话框,关闭事件
*/
serverEditDialogClosed() {
//重置对话框
this.$refs.editServerFormRef.resetFields();
},
/**
* 编辑服务器信息,编辑功能
*/
editServerInfo() {
//进行表单的预验证
this.$refs.editServerFormRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.server_loading.editLoading = true;
updateBusServer(this.editServerForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
if (res.code === '402') {
// 关闭加载
this.server_loading.editLoading = false;
return this.$message.error('服务器名称,已存在');
}
if (res.code === '400') {
// 关闭加载
this.server_loading.editLoading = false;
return this.$message.error('该服务器信息,已存在');
}
if (res.code === '999') {
// 关闭加载
this.server_loading.editLoading = false;
return this.$message.error('未知异常,编辑服务器信息,失败');
}
//关闭加载
this.server_loading.editLoading = false;
return this.$message.error('编辑服务器信息,失败');
}
// 关闭加载
this.server_loading.editLoading = false;
this.$message.success('编辑服务器信息,成功!');
// 隐藏对话框
this.serverDialog.editDialog = false;
// 刷新列表
this.getServerList();
}).catch(error => {
this.server_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 删除服务器信息
*/
removeServerInfo(index, row) {
//弹框询问是否删除服务器信息
this.$confirm('此操作永久删除该服务器信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
//开启加载
this.server_loading.delLoading = true;
deleteBusServer(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
//关闭加载
this.server_loading.delLoading = false;
return this.$message.error('删除服务器信息,失败');
}
//关闭加载
this.server_loading.delLoading = false;
this.$message.success('删除服务器信息,成功!');
//刷新列表
this.getServerList();
}).catch(error => {
this.server_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 批量删除,之前的选中
*/
selectChange: function (selectList) {
this.selectList = selectList;
},
/**
* 批量删除-服务器信息
*/
batchRemoveServer() {
const ids = this.selectList.map(item => item.id).toString();
// console.log(ids);
this.$confirm('此操作将永久删除选中的服务器信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.server_loading.batchDelLoading = true;
let params = {ids: ids};
batchRemoveBusServer(params).then(response => {
let res = response.data;
if (res.code !== '200') {
this.server_loading.batchDelLoading = false;
return this.$message.error('批量删除服务器信息,失败');
}
this.$message.success('批量删除服务器信息,成功!');
this.server_loading.batchDelLoading = false;
// 刷新列表
this.getServerList();
}).catch(error => {
this.server_loading.batchDelLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 携带参数,跳转至虚拟主机界面
*/
toVirtualHost(index, row) {
this.$confirm('查看该服务器下的虚拟主机, 是否继续?', '提示', {
confirmButtonText: '查看',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.$router.push({name: "虚拟主机管理", params: {server_scopeRow: row}})
}).catch(() => {
});
}
},
created() {
this.getServerList();
},
mounted() {
},
computed: {}
}
</script>
<style scoped>
</style>
... ...
<template>
<div>用户消息绑定配置</div>
</template>
<script>
export default {
name: "UserMessageBinding",
data() {
return {
}
},
methods: {
},
created() {
},
mounted() {
},
computed: {
},
}
</script>
<style scoped>
</style>
... ...
<template>
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="24">
<el-col :span="4">
<el-input v-model="queryInfo.virtualHostName" prefix-icon="el-icon-search" size="medium"
placeholder="虚拟主机名称" clearable style="width:180px"></el-input>
</el-col>
<el-col :span="4">
<el-select v-model="queryInfo.serverId" prefix-icon="el-icon-search" clearable size="medium"
style="width:180px"
placeholder="请选择服务器名称">
<el-option
v-for="item in (virtualHost_config.serverList)"
:key="item.id"
:label="item.serverName"
:value="item.id">
</el-option>
</el-select>
</el-col>
<el-col :span="10">
<el-button type="success" style="width:150px" size="medium" @click="getVirtualHostList">
查询虚拟主机
</el-button>
<el-button type="primary" style="width:150px" size="medium" @click="toAddDialog">
添加虚拟主机
</el-button>
</el-col>
</el-row>
</div>
<div style="margin-top: 20px;">
<el-table :data="virtualHostList" border v-loading="virtualHost_loading.listLoading"
@selection-change="selectChange"
element-loading-text="获取虚拟主机列表,拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="虚拟主机名称" prop="virtualHostName" align="center"
width="220"></el-table-column>
<el-table-column label="所属服务器" prop="busServer.serverName" align="center" width="220">
</el-table-column>
<el-table-column label="相关描述" prop="description" align="center" width="260"></el-table-column>
<el-table-column label="操作" width="250px" align="center" fixed="right">
<template slot-scope="scope">
<!-- 交换机-->
<el-tooltip effect="dark" content="交换机" placement="top-start" :enterable="false">
<el-button type="warning" icon="el-icon-link" size="small"
style="width:97px;margin-left: 1px;"
@click="toExchange(scope.$index,scope.row)">交换机
</el-button>
</el-tooltip>
<!-- 编辑按钮-->
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="small"
style="width:97px;margin-left: 1px;"
@click="toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<!-- 队列-->
<el-tooltip effect="dark" content="队列" placement="top-start" :enterable="false">
<el-button type="warning" icon="el-icon-link" size="small"
style="width:97px;margin-left: 1px;margin-top: 3px;"
@click="toQueue(scope.$index,scope.row)">队列
</el-button>
</el-tooltip>
<!-- 删除按钮-->
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="danger" icon="el-icon-delete" size="small"
style="width:97px;margin-left: 1px;"
:loading="virtualHost_loading.delLoading"
@click="removeVirtualHostInfo(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<!--分页区域-->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:disabled="this.selectList.length===0"
@click="batchDeleteVirtualHost">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="queryInfo.pageNum"
:page-sizes="[10,20,30,50]"
:page-size="queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</el-col>
</el-row>
</div>
</div>
</el-card>
<!-- 对话框 —> 添加虚拟主机信息 -->
<div>
<el-dialog title="添加虚拟主机信息"
:visible.sync="virtualHostDialog.addDialog"
style="margin-top: -50px"
width="50%" text-align="center" @close="virtualHostAddDialogClosed">
<el-form :inline="true" :model="addVirtualHostForm" label-width="120px" status-icon
:rules="addVirtualHostFormRules" ref="addVirtualHostRef"
align="center">
<el-form-item label="虚拟主机名称:" prop="virtualHostName">
<el-input v-model="addVirtualHostForm.virtualHostName" style="width:270px" clearable
placeholder="请输入虚拟主机名称"></el-input>
</el-form-item>
<el-form-item label="所属服务器:" prop="serverId">
<el-select v-model="addVirtualHostForm.serverId" clearable style="width:270px"
placeholder="请选择服务器名称">
<el-option
v-for="item in (virtualHost_config.serverList)"
:key="item.id"
:label="item.serverName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="addVirtualHostForm.description" style="width:270px" clearable
placeholder="请输入相关描述"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="virtualHostDialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="addVirtualHostInfo" :loading="virtualHost_loading.addLoading"
size="medium"
style="width: 100px">
添加
</el-button>
</div>
</el-dialog>
</div>
<!-- 对话框 —> 编辑虚拟主机信息 -->
<div>
<el-dialog title="编辑虚拟主机"
:visible.sync="virtualHostDialog.editDialog"
style="margin-top: -50px"
width="50%" text-align="center" @close="virtualHostEditDialogClosed">
<el-form :inline="true" :model="editVirtualHostForm" label-width="120px" status-icon
:rules="editVirtualHostFormRules" ref="editVirtualHostRef"
align="center">
<el-form-item label="虚拟主机名称:" prop="virtualHostName">
<el-input v-model="editVirtualHostForm.virtualHostName" style="width:270px" clearable
placeholder="请输入虚拟主机名称"></el-input>
</el-form-item>
<el-form-item label="所属服务器:" prop="serverId">
<el-select v-model="editVirtualHostForm.serverId" clearable style="width:270px"
placeholder="请选择服务器名称">
<el-option
v-for="item in (virtualHost_config.serverList)"
:key="item.id"
:label="item.serverName"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="相关描述:" prop="description">
<el-input v-model="editVirtualHostForm.description" style="width:270px" clearable
placeholder="请输入相关描述"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="info" @click="virtualHostDialog.editDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="editVirtualHostInfo" :loading="virtualHost_loading.addLoading"
size="medium"
style="width: 100px">
编辑
</el-button>
</div>
</el-dialog>
</div>
</el-main>
</el-container>
</template>
<script>
import {
selectVirtualHostList,
insertVirtualHost,
updateVirtualHost,
deleteVirtualHost,
batchRemoveVirtualHost,
getServerList,
} from "../../api/message_bus";
export default {
name: "VirtualHost",
data() {
return {
/**
* 搜索参数
*/
queryInfo: {
// 所属服务器ID
serverId: '',
// 虚拟主机名称
virtualHostName: '',
// 当前页数
pageNum: 1,
// 每页条数
pageSize: 10
},
/**
* 虚拟机,配置参数
*/
virtualHost_config: {
// 所属服务器的名称
serverName: '',
serverList: [],
},
/**
* 添加虚拟主机的表单
*/
addVirtualHostForm: {
// 虚拟主机名称
virtualHostName: '',
// 所属服务器ID
serverId: '',
// 相关描述
description: '',
},
/**
* 列表记录的总条数
*/
total: 0,
/**
* 批量删除的选中列表
*/
selectList: [],
/**
* 虚拟主机列表
*/
virtualHostList: [],
/**
* 编辑虚拟主机,表单
*/
editVirtualHostForm: {},
/**
* virtualHost,对话框管理
*/
virtualHostDialog: {
// 添加对话框
addDialog: false,
// 编辑对话框
editDialog: false,
},
/**
* virtualHost,加载
*/
virtualHost_loading: {
// 列表加载
listLoading: false,
// 添加加载
addLoading: false,
// 编辑加载
editLoading: false,
// 删除加载
delLoading: false,
// 批量删除加载
batchDelLoading: false,
},
/**
* 添加虚拟主机,表单的验证规则对象
*/
addVirtualHostFormRules: {
virtualHostName: [
{required: true, message: '请输入虚拟主机名称', trigger: ['blur', 'change']},
],
serverId: [
{required: true, message: '请选择所属服务器', trigger: ['blur']},
],
description: [
{required: true, message: '请输入虚拟主机相关描述', trigger: ['blur', 'change']},
],
},
/**
* 编辑虚拟主机,表单的验证规则对象
*/
editVirtualHostFormRules: {
virtualHostName: [
{required: true, message: '请输入虚拟主机名称', trigger: ['blur', 'change']},
],
serverId: [
{required: true, message: '请选择所属服务器', trigger: ['blur', 'change']},
],
description: [
{required: true, message: '请输入虚拟主机相关描述', trigger: ['blur', 'change']},
],
},
}
},
methods: {
/**
* 分页查询,监听 pageSize 改变的事件
*/
handleSizeChange(newSize) {
this.queryInfo.pageSize = newSize;
//刷新列表
this.getVirtualHostList();
},
/**
* 分页查询,监听 pageNum 改变的事件
*/
handleCurrentChange(newPage) {
this.queryInfo.pageNum = newPage;
//刷新列表
this.getVirtualHostList();
},
/**
* 分页查询,虚拟主机
*/
getVirtualHostList() {
if (this.virtualHost_config.serverName !== undefined) {
this.virtualHost_config.serverName = undefined;
}
// 开启加载
this.virtualHost_loading.listLoading = true;
selectVirtualHostList(this.queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.virtualHost_loading.listLoading = false;
return this.$message.error('获取虚拟主机列表,失败!');
}
console.log(res.data.list);
// 获取列表数据
this.virtualHostList = res.data.list;
// 获取列表的总记录数
this.total = res.data.total;
// 关闭加载
this.virtualHost_loading.listLoading = false;
this.$message.success('获取虚拟主机列表,成功!');
}).catch(error => {
// 关闭加载
this.virtualHost_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* 虚拟主机信息,添加对话框,打开事件
*/
toAddDialog() {
this.virtualHostDialog.addDialog = true;
},
/**
* 虚拟主机信息,添加对话框,关闭事件
*/
virtualHostAddDialogClosed() {
//重置对话框
this.$refs.addVirtualHostRef.resetFields();
},
/**
* 虚拟主机信息,添加功能
*/
addVirtualHostInfo() {
// 进行表单的预验证
this.$refs.addVirtualHostRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.virtualHost_loading.addLoading = true;
insertVirtualHost(this.addVirtualHostForm).then((response) => {
let res = response.data;
// 添加失败
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.virtualHost_loading.addLoading = false;
return this.$message.error('该虚拟主机,已存在');
}
if (res.code === '999') {
// 关闭加载
this.virtualHost_loading.addLoading = false;
return this.$message.error('未知异常,添加虚拟主机,失败');
}
// 关闭加载
this.virtualHost_loading.addLoading = false;
return this.$message.error('添加虚拟主机,失败');
}
// 添加,成功
this.$message.success('添加虚拟主机,成功');
// 关闭加载
this.virtualHost_loading.addLoading = false;
// 隐藏对话框
this.virtualHostDialog.addDialog = false;
// 刷新列表
this.getVirtualHostList();
}).catch(error => {
this.virtualHost_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 虚拟主机信息,编辑对话框,打开事件
*/
toEditDialog(index, row) {
this.editVirtualHostForm = Object.assign({}, row);
this.virtualHostDialog.editDialog = true;
},
/**
* 虚拟主机信息,编辑对话框,关闭事件
*/
virtualHostEditDialogClosed() {
//重置对话框
this.$refs.editVirtualHostRef.resetFields();
},
/**
* 虚拟主机信息,编辑功能
*/
editVirtualHostInfo() {
//进行表单的预验证
this.$refs.editVirtualHostRef.validate(valid => {
// 未通过,表单预校验
if (!valid) return;
// 通过,表单预检验
this.virtualHost_loading.editLoading = true;
updateVirtualHost(this.editVirtualHostForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
if (res.code === '400') {
// 关闭加载
this.virtualHost_loading.editLoading = false;
return this.$message.error('该虚拟主机,已存在');
}
if (res.code === '999') {
// 关闭加载
this.virtualHost_loading.editLoading = false;
return this.$message.error('未知异常,编辑虚拟主机信息,失败');
}
//关闭加载
this.virtualHost_loading.editLoading = false;
return this.$message.error('编辑虚拟主机信息,失败');
}
// 关闭加载
this.virtualHost_loading.editLoading = false;
this.$message.success('编辑虚拟主机信息,成功!');
// 隐藏对话框
this.virtualHostDialog.editDialog = false;
// 刷新列表
this.getVirtualHostList();
}).catch(error => {
this.virtualHost_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 虚拟主机信息,删除
*/
removeVirtualHostInfo(index, row) {
// 弹框询问是否删除?
this.$confirm('此操作永久删除该虚拟主机信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.virtualHost_loading.delLoading = true;
deleteVirtualHost(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
//关闭加载
this.virtualHost_loading.delLoading = false;
return this.$message.error('删除虚拟主机信息,失败');
}
//关闭加载
this.virtualHost_loading.delLoading = false;
this.$message.success('删除虚拟主机信息,成功!');
//刷新列表
this.getVirtualHostList();
}).catch(error => {
this.virtualHost_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 批量删除,之前的选中
*/
selectChange: function (selectList) {
this.selectList = selectList;
},
/**
* 批量删除-虚拟主机
*/
batchDeleteVirtualHost() {
const ids = this.selectList.map(item => item.id).toString();
this.$confirm('此操作将永久删除选中的虚拟主机信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// 开启加载
this.virtualHost_loading.batchDelLoading = true;
let params = {ids: ids};
batchRemoveVirtualHost(params).then(response => {
let res = response.data;
if (res.code !== '200') {
// 关闭加载
this.virtualHost_loading.batchDelLoading = false;
return this.$message.error('批量删除服务器信息,失败');
}
this.$message.success('批量删除服务器信息,成功!');
// 关闭加载
this.virtualHost_loading.batchDelLoading = false;
// 刷新列表
this.getVirtualHostList();
}).catch(error => {
// 关闭加载
this.virtualHost_loading.batchDelLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* 获取服务器列表
*/
selectServerList() {
getServerList().then((response) => {
let res = response.data;
if (res.code !== '200') {
return this.$message.error('获取服务器列表,失败!');
}
// 获取服务器列表数据
this.virtualHost_config.serverList = res.data;
// this.$message.success('获取服务器列表,成功!');
}).catch(error => {
this.$message.error(error.toString());
});
},
/**
* 携带参数,跳转至交换机界面
*/
toExchange(index, row) {
this.$confirm('查看该虚拟主机下的交换机, 是否继续?', '提示', {
confirmButtonText: '查看',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.$router.push({name: "交换机管理", params: {virtualHost_scopeRow: row}})
}).catch(() => {
});
},
/**
* 携带参数,跳转至队列界面
*/
toQueue(index, row) {
this.$confirm('查看该交换机下的队列, 是否继续?', '提示', {
confirmButtonText: '查看',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.$router.push({name: "队列管理", params: {virtualHost_scopeRow: row}})
}).catch(() => {
});
},
},
created() {
if (this.$route.params.server_scopeRow !== undefined) {
// 参数,服务器id
this.queryInfo.serverId = this.$route.params.server_scopeRow.id;
// 刷新列表
this.getVirtualHostList();
// 参数,服务器名称
this.virtualHost_config.serverName = this.$route.params.server_scopeRow.serverName;
} else {
// 刷新列表
this.getVirtualHostList();
}
},
mounted() {
this.selectServerList();
},
computed: {},
}
</script>
<style scoped>
</style>
... ...
... ... @@ -21,31 +21,31 @@
border
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
>
<el-table-column type="selection" width="55">
<el-table-column type="selection" width="55" align="center">
</el-table-column>
<!--<el-table-column type="index" width="60">-->
<!--</el-table-column>-->
<el-table-column prop="permissionId" label="ID" width="130" sortable>
<el-table-column prop="permissionId" label="ID" width="130" align="center" sortable>
</el-table-column>
<el-table-column prop="name" label="权限名称" min-width="150" sortable>
<el-table-column prop="name" label="权限名称" min-width="150" align="center" sortable>
</el-table-column>
<el-table-column prop="description" label="描述" min-width="120" sortable>
<el-table-column prop="description" label="描述" min-width="120" align="center" sortable>
</el-table-column>
<el-table-column prop="ismenu" label="是否目录" width="100" :formatter="formatState" sortable>
<el-table-column prop="ismenu" label="是否目录" width="120" :formatter="formatState" align="center" sortable>
</el-table-column>
<el-table-column prop="url" label="访问路径" width="300" sortable>
<el-table-column prop="url" label="访问路径" width="250" align="center" sortable>
</el-table-column>
<el-table-column label="操作" min-width="100">
<el-table-column label="操作" min-width="150" align="center">
<template slot-scope="scope">
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
<el-button size="small" type="success" icon="el-icon-check" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" icon="el-icon-delete" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-button type="danger" icon="el-icon-delete" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;">
</el-pagination>
</el-col>
... ... @@ -147,7 +147,7 @@
tableList: [],
total: 0,
pageNum: 1,
pageSize: 100,
pageSize: 10000,
listLoading: false,
sels: [],//列表选中列
//编辑界面是否显示
... ...
... ... @@ -10,7 +10,7 @@
<el-button type="primary" v-on:click="getRoles()">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleAdd">新增</el-button>
<el-button type="success" @click="handleAdd">新增</el-button>
</el-form-item>
</el-form>
</el-col>
... ... @@ -21,32 +21,32 @@
row-key="roleId"
border
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<el-table-column type="selection" width="55">
<el-table-column type="selection" width="60" align="center">
</el-table-column>
<!--<el-table-column type="index" width="60">-->
<!--</el-table-column>-->
<el-table-column prop="roleId" label="ID" width="120">
<el-table-column prop="roleId" label="ID" width="110" align="center">
</el-table-column>
<el-table-column prop="roleName" label="岗位/角色名称" min-width="200" sortable>
<el-table-column prop="roleName" label="岗位/角色名称" width="180" sortable align="center">
</el-table-column>
<!--<el-table-column prop="departmentName" label="部门名称" min-width="200" sortable>-->
<!--</el-table-column>-->
<el-table-column prop="description" label="描述" min-width="160" >
<el-table-column prop="description" label="描述" min-width="100" align="center" >
</el-table-column>
<el-table-column prop="type" label="类型" min-width="80" sortable>
<el-table-column prop="type" label="类型" min-width="100" sortable align="center">
</el-table-column>
<el-table-column prop="businessLicense" label="工商代码" min-width="180" >
</el-table-column>
<el-table-column prop="customsRegCode" label="海关备案代码" min-width="150" >
</el-table-column>
<el-table-column prop="mqcode" label="海关通道编号" min-width="150" >
</el-table-column>
<el-table-column label="操作" min-width="260">
<!-- <el-table-column prop="businessLicense" label="工商代码" min-width="180" align="center">-->
<!-- </el-table-column>-->
<!-- <el-table-column prop="customsRegCode" label="海关备案代码" min-width="150" align="center" >-->
<!-- </el-table-column>-->
<!-- <el-table-column prop="mqcode" label="海关通道编号" min-width="150" align="center">-->
<!-- </el-table-column>-->
<el-table-column label="操作" width="230px" fixed="right" align="center">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="handleAdd(scope.$index, scope.row)">新增下级</el-button>
<el-button size="small" @click="setPerm(scope.$index, scope.row)">设置权限</el-button>
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
<el-button type="success" size="small" @click="handleAdd(scope.$index, scope.row)" style="width:97px;margin-left: 1px;">新增下级</el-button>
<el-button type="warning" size="small" @click="setPerm(scope.$index, scope.row)" style="width:97px;margin-left: 1px;">设置权限</el-button>
<el-button type="primary" style="width:97px;margin-left: 1px;margin-top: 3px;" size="small" @click="handleEdit(scope.$index, scope.row)" >编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)" style="width:97px;margin-left: 1px;">删除</el-button>
</template>
</el-table-column>
</el-table>
... ... @@ -84,15 +84,15 @@
</el-option>
</el-select>
</el-form-item>
<el-form-item label="工商企业代码" prop="businessLicense">
<el-input v-model="addForm.businessLicense" auto-complete="off" placeholder="社会信用代码或者组织机构代码"></el-input>
</el-form-item>
<el-form-item label="海关备案代码" prop="customsRegCode">
<el-input v-model="addForm.customsRegCode" auto-complete="off" placeholder="海关备案后返回的备案代码"></el-input>
</el-form-item>
<el-form-item label="海关通道编号" prop="mqcode">
<el-input v-model="addForm.mqcode" auto-complete="off" placeholder="海关通道编号"></el-input>
</el-form-item>
<!-- <el-form-item label="工商企业代码" prop="businessLicense">-->
<!-- <el-input v-model="addForm.businessLicense" auto-complete="off" placeholder="社会信用代码或者组织机构代码"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="海关备案代码" prop="customsRegCode">-->
<!-- <el-input v-model="addForm.customsRegCode" auto-complete="off" placeholder="海关备案后返回的备案代码"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="海关通道编号" prop="mqcode">-->
<!-- <el-input v-model="addForm.mqcode" auto-complete="off" placeholder="海关通道编号"></el-input>-->
<!-- </el-form-item>-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click.native="addFormVisible = false">取消</el-button>
... ... @@ -264,7 +264,7 @@
getPermList() {
let para = {
pageNum: 1,
pageSize: 700
pageSize: 2000
};
NProgress.start();
permList(para).then((res) => {
... ...
... ... @@ -19,44 +19,46 @@
</el-col>
<!--列表-->
<el-table :data="users" highlight-current-row border v-loading="listLoading" @selection-change="selsChange" style="width: 100%;">
<el-table-column type="selection" width="55">
<el-table :data="users" highlight-current-row border v-loading="listLoading" @selection-change="selsChange"
style="width: 100%;">
<el-table-column type="selection" width="55" align="center">
</el-table-column>
<!--<el-table-column type="index" width="60">-->
<!--</el-table-column>-->
<el-table-column prop="userId" label="ID" width="100" sortable>
<el-table-column prop="userId" label="ID" width="100" align="center" sortable>
</el-table-column>
<el-table-column prop="username" label="账号" width="120" sortable>
<el-table-column prop="username" label="账号" width="120" align="center" sortable>
</el-table-column>
<el-table-column prop="realname" label="姓名" width="120" sortable>
<el-table-column prop="realname" label="姓名" width="120" align="center" sortable>
</el-table-column>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" align="center" sortable>
</el-table-column>
<el-table-column prop="mobilephone" label="电话" width="125">
<el-table-column prop="mobilephone" label="电话" width="130" align="center">
</el-table-column>
<el-table-column prop="creattime" label="创建时间" width="170" sortable>
<el-table-column prop="creattime" label="创建时间" width="175" align="center" sortable>
</el-table-column>
<el-table-column prop="updatetime" label="更新时间" width="170" sortable>
<el-table-column prop="updatetime" label="更新时间" width="175" align="center" sortable>
</el-table-column>
<el-table-column prop="address" label="地址" min-width="180">
<el-table-column prop="address" label="地址" min-width="180" align="center">
</el-table-column>
<el-table-column prop="email" label="Email" min-width="180">
<el-table-column prop="email" label="Email" min-width="180" align="center">
</el-table-column>
<el-table-column prop="state" label="启用" width="100" :formatter="formatState" sortable>
<el-table-column prop="state" label="启用" width="100" :formatter="formatState" align="center" sortable>
</el-table-column>
<el-table-column label="操作" width="250">
<el-table-column label="操作" width="300px" fixed="right" align="center">
<template slot-scope="scope">
<el-button size="small" @click="roleEdit(scope.$index, scope.row)">角色配置</el-button>
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
<el-button type="primary" icon="el-icon-setting" size="small" @click="roleEdit(scope.$index, scope.row)">角色配置</el-button>
<el-button size="small" type="success" icon="el-icon-check" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" icon="el-icon-delete" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="10" :total="total" style="float:right;">
<el-button type="danger" icon="el-icon-delete" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="10"
:total="total" style="float:right;">
</el-pagination>
</el-col>
... ... @@ -69,9 +71,9 @@
<el-form-item label="账号">
<span>{{editForm.username}}</span>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input v-model="editForm.password" auto-complete="off" type="password" show-password></el-input>
</el-form-item>
<!-- <el-form-item label="密码" prop="password">-->
<!-- <el-input v-model="editForm.password" auto-complete="off" type="password" show-password></el-input>-->
<!-- </el-form-item>-->
<el-form-item label="姓名" prop="realname">
<el-input v-model="editForm.realname" auto-complete="off"></el-input>
</el-form-item>
... ... @@ -83,8 +85,8 @@
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="editForm.sex">
<el-radio class="radio" label="1" >男</el-radio>
<el-radio class="radio" label="0" >女</el-radio>
<el-radio class="radio" label="1">男</el-radio>
<el-radio class="radio" label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="年龄">
... ... @@ -98,8 +100,8 @@
</el-form-item>
<el-form-item label="启用">
<el-radio-group v-model="editForm.state">
<el-radio class="radio" label="true" >是</el-radio>
<el-radio class="radio" label="false" >否</el-radio>
<el-radio class="radio" label="true">是</el-radio>
<el-radio class="radio" label="false">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item lable="头像">
... ... @@ -161,14 +163,15 @@
<!--权限设置-->
<el-dialog title="权限设置" :visible.sync="roleFormVisible" :close-on-click-modal="false">
<el-form :model="roleEditForm" label-width="80px" ref="roleEditForm" >
<el-form :model="roleEditForm" label-width="80px" ref="roleEditForm">
<el-form-item label="ID">
<span>{{roleEditForm.userId}}</span>
</el-form-item>
<el-form-item label="账号">
<span>{{roleEditForm.username}}</span>
</el-form-item>
<el-tree :data="roles" :props="treeDefaultProps" default-expand-all show-checkbox highlight-current check-strictly node-key="roleId" ref="tree" @check-change="treeHandleCheckChange">
<el-tree :data="roles" :props="treeDefaultProps" default-expand-all show-checkbox highlight-current
check-strictly node-key="roleId" ref="tree" @check-change="treeHandleCheckChange">
</el-tree>
</el-form>
... ... @@ -183,9 +186,10 @@
<script>
import util from '../../common/js/util'
import NProgress from 'nprogress'
import { getUserList, removeUser, batchRemoveUser, editUser, addUser, setUserRole } from '../../api/user';
import { getList} from '../../api/role_api';
import {getUserList, removeUser, batchRemoveUser, editUser, addUser, setUserRole} from '../../api/user';
import {getList} from '../../api/role_api';
import moment from 'moment'
export default {
data() {
return {
... ... @@ -209,7 +213,10 @@
editLoading: false,
editFormRules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
{required: true, message: '请输入姓名', trigger: 'blur'}
],
mobilephone: [
{required: true, message: '请输入手机号码', trigger: ['blur', 'change']}
]
},
//编辑界面数据
... ... @@ -217,24 +224,27 @@
userId: 1,
username: '',
password: '',
sex: 1,
creattime: '',
sex: '1',
creattime: undefined,
address: '',
realname: '',
email: '',
mobilephone: '',
state: 'true'
state: true
},
addFormVisible: false,//新增界面是否显示
addLoading: false,
addFormRules: {
username: [
{ required: true, message: '请输入姓名,用户名长度在5-11位,支持英文和数字', trigger: 'blur' },
{required: true, message: '请输入姓名,用户名长度在5-11位,支持英文和数字', trigger: 'blur'},
],
password: [
{ required: true, message: '请输入密码,用户名长度在6-18位,支持英文和数字和非空字符', trigger: 'blur'}
]
{required: true, message: '请输入密码,用户名长度在6-18位,支持英文和数字和非空字符', trigger: 'blur'}
],
mobilephone: [
{required: true, message: '请输入手机号码', trigger: ['blur', 'change']},
],
},
//用户角色配置
roleFormVisible: false,
... ... @@ -272,7 +282,7 @@
this.getUsers();
},
//获取用户列表
getUsers:function() {
getUsers: function () {
let para = {
pageNum: this.pageNum,
pageSize: this.pageSize,
... ... @@ -299,7 +309,7 @@
}).then(() => {
this.listLoading = true;
//NProgress.start();
let para = { userId: row.userId };
let para = {userId: row.userId};
removeUser(para).then((res) => {
this.listLoading = false;
//NProgress.done();
... ... @@ -331,8 +341,8 @@
this.roleEditForm = Object.assign({}, row);
let roles = this.roleEditForm.roles;
if (util.checkNull(roles)){
roles.forEach(function (role,v_index,v_arr) {
if (util.checkNull(roles)) {
roles.forEach(function (role, v_index, v_arr) {
if (util.checkNull(role)) {
_this.roleIds[v_index] = role.roleId;
}
... ... @@ -353,11 +363,11 @@
this.roles = res.data.list;
NProgress.done();
}).catch((error) => {
if(null!= error.response && error.response!==undefined){
let status= error.response.status;
if (null != error.response && error.response !== undefined) {
let status = error.response.status;
let msg = error.response.statusText;
alert(status+msg);
}else {
alert(status + msg);
} else {
alert(error);
}
});
... ... @@ -385,11 +395,11 @@
this.$confirm('确认提交吗?', '提示', {}).then(() => {
this.editLoading = true;
//NProgress.start();
let para = Object.assign({}, this.editForm);
// let para = Object.assign({}, this.editForm);
//不需要提交的 去掉,后端不好接收
para.authorities = null;
para.permissions = null;
para.roles = null;
this.editForm.authorities = null;
this.editForm.permissions = null;
this.editForm.roles = null;
// para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd');
/*
查询之后格式this.filters.column.create_start_date中日期发生变化;
... ... @@ -400,7 +410,7 @@
/*moment 安装 npm install moment --save*/
// para.creattime = moment(para.creattime).format('YYYY-MM-DD HH:mm:ss');
this.editLoading = false;
editUser(para).then((res) => {
editUser(this.editForm).then((res) => {
//NProgress.done();
this.$message({
... ... @@ -455,7 +465,7 @@
}).then(() => {
this.listLoading = true;
//NProgress.start();
let para = { ids: ids };
let para = {ids: ids};
batchRemoveUser(para).then((res) => {
this.listLoading = false;
//NProgress.done();
... ... @@ -474,9 +484,9 @@
// this.editLoading = true;
let userId = this.roleEditForm.userId;
let roleIds = this.$refs.tree.getCheckedKeys();
let para = {userId,roleIds};
let para = {userId, roleIds};
setUserRole(para).then((res) => {
if (res.status ===200) {
if (res.status === 200) {
this.$message({
message: '岗位设置成功',
type: 'success'
... ... @@ -490,17 +500,17 @@
console.log(para);
});
},
handleAvatarSuccess: function(response){
this.faceImageUrl = 'http://127.0.0.1:7003/'+response.data;
handleAvatarSuccess: function (response) {
this.faceImageUrl = 'http://127.0.0.1:7003/' + response.data;
},
beforeAvatarUpload: function () {
},
treeHandleCheckChange: function (data, checked, indeterminate) {
if(checked) {
if (checked) {
this.roleIds.push(data.roleId);
}else {
this.roleIds.splice(this.roleIds.contains(data.roleId),1);
} else {
this.roleIds.splice(this.roleIds.contains(data.roleId), 1);
}
// console.log(data, checked, indeterminate);
console.log(this.roleIds);
... ...