|
...
|
...
|
@@ -5,10 +5,12 @@ |
|
|
|
<!-- 搜素区域 -->
|
|
|
|
<el-row>
|
|
|
|
<el-col :span="24" align="left">
|
|
|
|
<el-button type="warning" size="medium" icon="el-icon-search" @click="loadRouter" :loading="loadingStatus">
|
|
|
|
<el-button type="warning" size="medium" icon="el-icon-search" @click="loadRouter"
|
|
|
|
:loading="loadingStatus">
|
|
|
|
加载已配置消息
|
|
|
|
</el-button>
|
|
|
|
<el-button type="primary" size="medium" icon="el-icon-plus" @click="batchAddRouter" :loading="loadingStatus">
|
|
|
|
<el-button type="primary" size="medium" icon="el-icon-plus" @click="batchAddRouter"
|
|
|
|
:loading="loadingStatus">
|
|
|
|
生成路由
|
|
|
|
</el-button>
|
|
|
|
</el-col>
|
|
...
|
...
|
@@ -16,98 +18,102 @@ |
|
|
|
<el-divider></el-divider>
|
|
|
|
<el-row>
|
|
|
|
<div style="border: 6px solid #6F8294;">
|
|
|
|
<el-row style="margin: -2px">
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择消息发送者</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="sndr"
|
|
|
|
show-checkbox
|
|
|
|
node-key="username"
|
|
|
|
:props="userProps"
|
|
|
|
ref="sndrTree"
|
|
|
|
@check-change="treeSndrCheckChange"
|
|
|
|
<el-row style="margin: -2px">
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择消息发送者</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="sndr"
|
|
|
|
show-checkbox
|
|
|
|
node-key="username"
|
|
|
|
:props="userProps"
|
|
|
|
ref="sndrTree"
|
|
|
|
@check-change="treeSndrCheckChange"
|
|
|
|
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6" align="center">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择要发送的消息类型</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="message_type"
|
|
|
|
show-checkbox
|
|
|
|
node-key="name"
|
|
|
|
default-expand-all
|
|
|
|
check-strictly
|
|
|
|
:props="defaultProps"
|
|
|
|
highlight-current
|
|
|
|
ref="typeTree"
|
|
|
|
@check-change="treeTypeCheckChange"
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择消息接收者</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="rcvr"
|
|
|
|
show-checkbox
|
|
|
|
node-key="id"
|
|
|
|
:props="userProps"
|
|
|
|
ref="rcvrTree"
|
|
|
|
@check-change="treeRcvrCheckChange"
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>消息路由配置其他属性</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-form :inline="true" :model="params" class="demo-form-inline" align="center" style="border:3px solid #6F8294;height: 800px;padding-top: 15px">
|
|
|
|
<el-form-item label="路由状态：">
|
|
|
|
<el-select v-model="params.status" placeholder="请选择" style="width: 150px" size="mini">
|
|
|
|
<el-option
|
|
|
|
v-for="item in status_options"
|
|
|
|
:key="item.value"
|
|
|
|
:label="item.label"
|
|
|
|
:value="item.value">
|
|
|
|
<span style="float: left">{{ item.label }}</span>
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
|
|
|
|
</el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="路由用途：">
|
|
|
|
<el-select v-model="params.usage" placeholder="请选择" style="width: 150px" size="mini">
|
|
|
|
<el-option
|
|
|
|
v-for="item in usage_options"
|
|
|
|
:key="item.value"
|
|
|
|
:label="item.label"
|
|
|
|
:value="item.value">
|
|
|
|
<span style="float: left">{{ item.label }}</span>
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
|
|
|
|
</el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="路由描述：">
|
|
|
|
<el-input type="textarea" v-model="params.des" style="width: 150px" size="mini"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6" align="center">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择要发送的消息类型</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="message_type"
|
|
|
|
show-checkbox
|
|
|
|
node-key="name"
|
|
|
|
default-expand-all
|
|
|
|
check-strictly
|
|
|
|
:props="defaultProps"
|
|
|
|
highlight-current
|
|
|
|
ref="typeTree"
|
|
|
|
@check-change="treeTypeCheckChange"
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>选择消息接收者</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-tree
|
|
|
|
:data="rcvr"
|
|
|
|
show-checkbox
|
|
|
|
node-key="id"
|
|
|
|
:props="queueProps"
|
|
|
|
ref="rcvrTree"
|
|
|
|
@check-change="treeRcvrCheckChange"
|
|
|
|
>
|
|
|
|
</el-tree>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="6">
|
|
|
|
<el-row class="bt">
|
|
|
|
<span>消息路由配置其他属性</span>
|
|
|
|
</el-row>
|
|
|
|
<el-row>
|
|
|
|
<el-form :inline="true" :model="params" class="demo-form-inline" align="center"
|
|
|
|
style="border:3px solid #6F8294;height: 800px;padding-top: 15px">
|
|
|
|
<el-form-item label="路由状态：">
|
|
|
|
<el-select v-model="params.status" placeholder="请选择" style="width: 150px"
|
|
|
|
size="mini">
|
|
|
|
<el-option
|
|
|
|
v-for="item in status_options"
|
|
|
|
:key="item.value"
|
|
|
|
:label="item.label"
|
|
|
|
:value="item.value">
|
|
|
|
<span style="float: left">{{ item.label }}</span>
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
|
|
|
|
</el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="路由用途：">
|
|
|
|
<el-select v-model="params.usage" placeholder="请选择" style="width: 150px"
|
|
|
|
size="mini">
|
|
|
|
<el-option
|
|
|
|
v-for="item in usage_options"
|
|
|
|
:key="item.value"
|
|
|
|
:label="item.label"
|
|
|
|
:value="item.value">
|
|
|
|
<span style="float: left">{{ item.label }}</span>
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
|
|
|
|
</el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="路由描述：">
|
|
|
|
<el-input type="textarea" v-model="params.des" style="width: 150px"
|
|
|
|
size="mini"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</el-row>
|
|
|
|
</el-card>
|
|
|
|
</el-main>
|
|
...
|
...
|
@@ -115,7 +121,8 @@ |
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import { getAlltype,api_batchAddRouter,loadRouterBySndr } from "../../api/message_bus";
|
|
|
|
import {getAlltype, api_batchAddRouter, loadRouterBySndr, selectBusQueueList} from "../../api/message_bus";
|
|
|
|
|
|
|
|
export default {
|
|
|
|
name: "Configure",
|
|
|
|
|
|
...
|
...
|
@@ -125,7 +132,7 @@ |
|
|
|
sndr: [],
|
|
|
|
rcvr: [],
|
|
|
|
api_back: [],
|
|
|
|
params:{
|
|
|
|
params: {
|
|
|
|
sndr: '',
|
|
|
|
sndrs: [],
|
|
|
|
types: [],
|
|
...
|
...
|
@@ -135,38 +142,44 @@ |
|
|
|
des: "",
|
|
|
|
ver: "1.0"
|
|
|
|
},
|
|
|
|
status_options:[
|
|
|
|
status_options: [
|
|
|
|
{
|
|
|
|
label: "启用",
|
|
|
|
value: 1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
label:"关闭",
|
|
|
|
label: "关闭",
|
|
|
|
value: 0
|
|
|
|
}
|
|
|
|
],
|
|
|
|
usage_options:[
|
|
|
|
usage_options: [
|
|
|
|
{
|
|
|
|
label: "生产用",
|
|
|
|
value: 1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
label:"测试用",
|
|
|
|
label: "测试用",
|
|
|
|
value: 2
|
|
|
|
}
|
|
|
|
],
|
|
|
|
message_type: [],
|
|
|
|
defaultProps: {
|
|
|
|
children: 'children',
|
|
|
|
label: function (data,node) {
|
|
|
|
return '[' + data.name+ ']' + data.des;
|
|
|
|
label: function (data, node) {
|
|
|
|
return '[' + data.name + ']' + data.des;
|
|
|
|
},
|
|
|
|
disabled: 'disabled'
|
|
|
|
},
|
|
|
|
userProps: {
|
|
|
|
children: 'children',
|
|
|
|
label: function (data, node) {
|
|
|
|
return '('+data.username + ')' + data.des;
|
|
|
|
return '(' + data.username + ')' + data.des;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
queueProps:{
|
|
|
|
children: 'children',
|
|
|
|
label: function (data, node) {
|
|
|
|
return '(' + data.queueName + ')' + data.description;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
...
|
...
|
@@ -174,12 +187,12 @@ |
|
|
|
methods: {
|
|
|
|
typeFilterNode(treeList) {
|
|
|
|
let _this = this;
|
|
|
|
if (Array.isArray(treeList)){
|
|
|
|
treeList.forEach(function(item,index){
|
|
|
|
if (item.type == 1 || item.type==2){
|
|
|
|
if (Array.isArray(treeList)) {
|
|
|
|
treeList.forEach(function (item, index) {
|
|
|
|
if (item.type == 1 || item.type == 2) {
|
|
|
|
item.disabled = true;
|
|
|
|
}
|
|
|
|
if (item.children !== undefined){
|
|
|
|
if (item.children !== undefined) {
|
|
|
|
_this.typeFilterNode(item.children);
|
|
|
|
}
|
|
|
|
})
|
|
...
|
...
|
@@ -187,7 +200,7 @@ |
|
|
|
|
|
|
|
},
|
|
|
|
getAllType() {
|
|
|
|
let _this =this;
|
|
|
|
let _this = this;
|
|
|
|
_this.loadingStatus = true;
|
|
|
|
getAlltype().then((response) => {
|
|
|
|
let res = response.data;
|
|
...
|
...
|
@@ -210,7 +223,7 @@ |
|
|
|
/**
|
|
|
|
* 访问用户服务,绑定用户列表，按组搜索
|
|
|
|
*/
|
|
|
|
getUserInfo(){
|
|
|
|
getUserInfo() {
|
|
|
|
let userResponse = [{
|
|
|
|
id: 1,
|
|
|
|
username: "zp260",
|
|
...
|
...
|
@@ -220,14 +233,13 @@ |
|
|
|
username: "test04",
|
|
|
|
des: "测试用户2"
|
|
|
|
},
|
|
|
|
{
|
|
|
|
id: 3,
|
|
|
|
username: "zp2505",
|
|
|
|
des: "测试用户3"
|
|
|
|
}
|
|
|
|
{
|
|
|
|
id: 3,
|
|
|
|
username: "zp2505",
|
|
|
|
des: "测试用户3"
|
|
|
|
}
|
|
|
|
];
|
|
|
|
this.sndr = userResponse;
|
|
|
|
this.rcvr = userResponse;
|
|
|
|
},
|
|
|
|
treeSndrCheckChange(data, checked, indeterminate) {
|
|
|
|
if (checked) {
|
|
...
|
...
|
@@ -238,15 +250,15 @@ |
|
|
|
},
|
|
|
|
treeRcvrCheckChange(data, checked, indeterminate) {
|
|
|
|
if (checked) {
|
|
|
|
this.params.rcvrs.push(data.username);
|
|
|
|
this.params.rcvrs.push(data.queueName);
|
|
|
|
} else {
|
|
|
|
this.params.rcvrs.splice(this.params.rcvrs.contains(data.username), 1);
|
|
|
|
this.params.rcvrs.splice(this.params.rcvrs.contains(data.queueName), 1);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
treeTypeCheckChange(data, checked, indeterminate) {
|
|
|
|
let mt = {
|
|
|
|
name:'',
|
|
|
|
type:0
|
|
|
|
name: '',
|
|
|
|
type: 0
|
|
|
|
};
|
|
|
|
mt.name = data.name;
|
|
|
|
mt.type = data.type;
|
|
...
|
...
|
@@ -257,10 +269,10 @@ |
|
|
|
}
|
|
|
|
console.log(this.params.types);
|
|
|
|
},
|
|
|
|
loadRouter(){
|
|
|
|
loadRouter() {
|
|
|
|
let _this = this;
|
|
|
|
this.loadingStatus = true;
|
|
|
|
if(this.params.sndrs.length !== 1){
|
|
|
|
if (this.params.sndrs.length !== 1) {
|
|
|
|
this.$confirm('请选择单个发送者', '错误', {
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
type: 'error',
|
|
...
|
...
|
@@ -268,9 +280,9 @@ |
|
|
|
}).then(() => {
|
|
|
|
_this.loadingStatus = false;
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
|
|
_this.loadingStatus = false;
|
|
|
|
});
|
|
|
|
}else{
|
|
|
|
} else {
|
|
|
|
let pam = {
|
|
|
|
sndr: _this.params.sndrs[0]
|
|
|
|
};
|
|
...
|
...
|
@@ -293,21 +305,22 @@ |
|
|
|
)
|
|
|
|
}
|
|
|
|
},
|
|
|
|
loadRouterHandle(){
|
|
|
|
if (Array.isArray(this.api_back) && this.api_back.length>0){
|
|
|
|
loadRouterHandle() {
|
|
|
|
if (Array.isArray(this.api_back) && this.api_back.length > 0) {
|
|
|
|
let typeList = [];
|
|
|
|
this.api_back.forEach(function(routerItem,index){
|
|
|
|
typeList.push({name:routerItem.stype});
|
|
|
|
this.api_back.forEach(function (routerItem, index) {
|
|
|
|
typeList.push({name: routerItem.stype});
|
|
|
|
});
|
|
|
|
this.typeTreeSet(typeList);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
typeTreeSet(typeList){
|
|
|
|
typeTreeSet(typeList) {
|
|
|
|
this.$refs.typeTree.setCheckedNodes(typeList);
|
|
|
|
},
|
|
|
|
batchAddRouter() {
|
|
|
|
let _this = this;
|
|
|
|
_this.loadingStatus = true;
|
|
|
|
//todo: 生产者列表，消费者列表，及路由类型判空后再访问接口
|
|
|
|
api_batchAddRouter(this.params).then(response => {
|
|
|
|
let res = response.data;
|
|
|
|
console.log(res)
|
|
...
|
...
|
@@ -331,11 +344,33 @@ |
|
|
|
this.$refs.sndrTree.setCheckedKeys([]);
|
|
|
|
this.$refs.typeTree.setCheckedKeys([]);
|
|
|
|
this.$refs.rcvrTree.setCheckedKeys([]);
|
|
|
|
},
|
|
|
|
queue_getList() {
|
|
|
|
let queue_queryInfo = {
|
|
|
|
// 当前页数
|
|
|
|
pageNum: 1,
|
|
|
|
// 每页条数
|
|
|
|
pageSize: 100000
|
|
|
|
};
|
|
|
|
selectBusQueueList(queue_queryInfo).then((response) => {
|
|
|
|
let res = response.data;
|
|
|
|
if (res.code !== '200') {
|
|
|
|
// 关闭加载
|
|
|
|
return this.$message.error(res.msg);
|
|
|
|
}
|
|
|
|
// 获取列表数据
|
|
|
|
this.rcvr = res.data.list;
|
|
|
|
this.$message.success(res.msg);
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.error(error.toString());
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
this.getAllType();
|
|
|
|
this.getUserInfo();
|
|
|
|
this.queue_getList();
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
...
|
...
|
@@ -348,14 +383,17 @@ |
|
|
|
color: #ffffff;
|
|
|
|
text-align: center
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-col {
|
|
|
|
margin-right: 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-tree {
|
|
|
|
padding-top: 15px;
|
|
|
|
border:3px solid #6F8294;
|
|
|
|
border: 3px solid #6F8294;
|
|
|
|
height: 800px
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-row .el-col .el-row {
|
|
|
|
margin-top: 0px;
|
|
|
|
}
|
...
|
...
|
|
