This is an automated email from the ASF dual-hosted git repository.
liujun pushed a commit to branch refactor-with-go
in repository https://gitbox.apache.org/repos/asf/dubbo-admin.git
The following commit(s) were added to refs/heads/refactor-with-go by this push:
new ecb18e0a feat: add trafficGay trafficWeight and fix: some problems
(#1171)
ecb18e0a is described below
commit ecb18e0a5e20f60278c29dcdd4e47164901150ec
Author: SDUWYS <[email protected]>
AuthorDate: Mon Jul 3 10:56:27 2023 +0800
feat: add trafficGay trafficWeight and fix: some problems (#1171)
---
dubbo-admin-ui/src/api/menu.js | 4 +-
dubbo-admin-ui/src/components/ServiceSearch.vue | 9 +-
.../src/components/traffic/Accesslog.vue | 76 +--
.../src/components/traffic/Arguments.vue | 46 +-
dubbo-admin-ui/src/components/traffic/Gray.vue | 222 ++++++--
dubbo-admin-ui/src/components/traffic/Mock.vue | 68 +--
dubbo-admin-ui/src/components/traffic/Region.vue | 168 +++---
dubbo-admin-ui/src/components/traffic/Retry.vue | 34 +-
dubbo-admin-ui/src/components/traffic/Timeout.vue | 46 +-
dubbo-admin-ui/src/components/traffic/Weight.vue | 586 ++++++++++++++-------
pkg/admin/handlers/traffic/weight.go | 4 +-
11 files changed, 839 insertions(+), 424 deletions(-)
diff --git a/dubbo-admin-ui/src/api/menu.js b/dubbo-admin-ui/src/api/menu.js
index 1c937fb5..478835fa 100644
--- a/dubbo-admin-ui/src/api/menu.js
+++ b/dubbo-admin-ui/src/api/menu.js
@@ -27,11 +27,11 @@ const Menu = [
{ title: 'trafficRetry', path: '/traffic/retry' },
{ title: 'trafficRegion', path: '/traffic/region' },
// { title: 'trafficIsolation', path: '/traffic/isolation' },
- // { title: 'trafficWeight', path: '/traffic/weight' },
+ { title: 'trafficWeight', path: '/traffic/weight' },
{ title: 'trafficArguments', path: '/traffic/arguments' },
{ title: 'trafficMock', path: '/traffic/mock' },
{ title: 'trafficAccesslog', path: '/traffic/accesslog' },
- // { title: 'trafficGray', path: '/traffic/gray' },
+ { title: 'trafficGray', path: '/traffic/gray' },
// { title: 'trafficHost', path: '/traffic/host' },
{ title: 'routingRule', path: '/governance/routingRule' },
{ title: 'tagRule', path: '/governance/tagRule' },
diff --git a/dubbo-admin-ui/src/components/ServiceSearch.vue
b/dubbo-admin-ui/src/components/ServiceSearch.vue
index 8e988a2d..2ae615dc 100644
--- a/dubbo-admin-ui/src/components/ServiceSearch.vue
+++ b/dubbo-admin-ui/src/components/ServiceSearch.vue
@@ -129,6 +129,7 @@
</v-container>
</template>
<script>
+import { store } from '../store/index'
export default {
data () {
return {
@@ -281,9 +282,9 @@ export default {
if (v && v.length >= 4) {
this.searchLoading = true
if (this.selected === 0) {
- this.typeAhead = this.$store.getters.getServiceItems(v)
+ this.typeAhead = store.getters.getServiceItems(v)
} else if (this.selected === 2) {
- this.typeAhead = this.$store.getters.getAppItems(v)
+ this.typeAhead = store.getters.getAppItems(v)
}
this.searchLoading = false
this.timerID = null
@@ -363,8 +364,8 @@ export default {
},
mounted: function () {
this.setHeaders()
- this.$store.dispatch('loadServiceItems')
- this.$store.dispatch('loadAppItems')
+ store.dispatch('loadServiceItems')
+ store.dispatch('loadAppItems')
const query = this.$route.query
let filter = null
let pattern = null
diff --git a/dubbo-admin-ui/src/components/traffic/Accesslog.vue
b/dubbo-admin-ui/src/components/traffic/Accesslog.vue
index 885b3edc..575dbe0e 100644
--- a/dubbo-admin-ui/src/components/traffic/Accesslog.vue
+++ b/dubbo-admin-ui/src/components/traffic/Accesslog.vue
@@ -87,20 +87,18 @@
></v-text-field>
</v-flex>
</v-layout>
+ <v-layout row wrap>
+ <v-switch label="开启或关闭访问日志" v-model="handleAccesslog"></v-switch>
+ </v-layout>
+ <v-layout v-if="handleAccesslog" row wrap>
<v-flex xs6 sm3 md5>
<v-text-field
- label="开启 Accesslog(这里应该是一个开关按钮，用户点击打开或关闭)"
- hint=""
- v-model="createAccesslog"
- ></v-text-field>
- </v-flex>
- <v-flex xs6 sm3 md5>
- <v-text-field
- label="日志文件存储路径（此输入框默认隐藏，用户点击显示出来）"
+ label="日志文件存储路径"
hint="输入 accesslog 存储的目标文件绝对路径（如/home/user1/access.log）"
v-model="createAccesslog"
- ></v-text-field>
+ ></v-text-field>
</v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -124,20 +122,18 @@
></v-text-field>
</v-flex>
</v-layout>
+ <v-layout row wrap>
+ <v-switch label="开启或关闭访问日志"
v-model="handleUpdateAccesslog"></v-switch>
+ </v-layout>
+ <v-layout v-if="handleUpdateAccesslog" row wrap>
<v-flex xs6 sm3 md5>
<v-text-field
- label="开启 Accesslog(这里应该是一个开关按钮，用户点击打开或关闭)"
- hint=""
- v-model="updateAccesslog"
- ></v-text-field>
- </v-flex>
- <v-flex xs6 sm3 md5>
- <v-text-field
- label="日志文件存储路径（此输入框默认隐藏，用户点击后显示出来）"
+ label="日志文件存储路径"
hint="输入 accesslog 存储的目标文件绝对路径（如/home/user1/access.log）"
v-model="updateAccesslog"
- ></v-text-field>
+ ></v-text-field>
</v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -204,6 +200,8 @@ export default {
createAccesslog: '',
deleteApplication: '',
deleteAccesslog: '',
+ handleUpdateAccesslog: '',
+ handleAccesslog: false,
dialog: false,
headers: [
],
@@ -217,7 +215,7 @@ export default {
}),
methods: {
submit () {
- if (this.accesslog && this.application) {
+ if (this.application) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -244,7 +242,7 @@ export default {
this.updateDialog = false
this.$axios.put('/traffic/accesslog', {
application: this.updateApplication,
- accesslog: this.updateAccesslog
+ accesslog: this.handleUpdateAccesslog ? this.updateAccesslog : 'false'
}).then((res) => {
if (res) {
alert('操作成功')
@@ -274,10 +272,8 @@ export default {
this.dialog = true
},
confirmDelete () {
- console.log(this.deleteAccesslog)
this.$axios.delete('/traffic/accesslog', {
- application: this.deleteApplication,
- accesslog: this.deleteAccesslog
+ application: this.deleteApplication
}).then((res) => {
if (res) {
alert('操作成功')
@@ -291,22 +287,32 @@ export default {
this.deleteApplication = props.application
},
update (props) {
- console.log(props)
this.updateApplication = props.application
- this.updateAccesslog = props.accesslog
+ this.handleUpdateAccesslog = props.accesslog !== 'false'
+ this.updateAccesslog = props.accesslog === 'false' ? '' : props.accesslog
this.updateDialog = true
- console.log(this.updateApplication)
- console.log(this.updateAccesslog)
},
save () {
- this.$axios.post('/traffic/accesslog', {
- application: this.createApplication,
- accesslog: this.createAccesslog
- }).then((res) => {
- if (res) {
- alert('操作成功')
- }
- })
+ if (this.handleAccesslog) {
+ this.$axios.post('/traffic/accesslog', {
+ application: this.createApplication,
+ accesslog: this.createAccesslog
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ } else {
+ this.$axios.post('/traffic/accesslog', {
+ application: this.createApplication,
+ accesslog: this.handleAccesslog.toString()
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ }
+ this.dialog = false
},
closeDialog () {
this.dialog = false
diff --git a/dubbo-admin-ui/src/components/traffic/Arguments.vue
b/dubbo-admin-ui/src/components/traffic/Arguments.vue
index b7e9d6bf..9072f5b9 100644
--- a/dubbo-admin-ui/src/components/traffic/Arguments.vue
+++ b/dubbo-admin-ui/src/components/traffic/Arguments.vue
@@ -100,14 +100,14 @@
v-model="createService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Group"
hint="$t('versionInputPrompt')"
v-model="createGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Version"
hint="$t('versionInputPrompt')"
@@ -123,7 +123,7 @@
v-model="createRuleMethod"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="参数索引"
hint="如第一个参数，请输入0"
@@ -131,7 +131,7 @@
v-model="createRuleIndex"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="参数匹配条件"
hint="请输入参数匹配条件"
@@ -161,14 +161,14 @@
v-model="updateService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Group"
hint="$t('versionInputPrompt')"
v-model="updateGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Version"
hint="$t('versionInputPrompt')"
@@ -181,22 +181,22 @@
<v-text-field
label="方法名"
hint="请输入方法名"
- v-model="createRuleMethod"
+ v-model="updateRuleMethod"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="参数索引"
hint="如第一个参数，请输入0"
type="number"
- v-model="createRuleIndex"
+ v-model="updateRuleIndex"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="参数匹配条件"
hint="请输入参数匹配条件"
- v-model="createRuleMatch"
+ v-model="updateRuleMatch"
></v-text-field>
</v-flex>
</v-layout>
@@ -260,13 +260,17 @@ export default {
searchLoading: false,
timerID: null,
service: '',
- rule: '',
group: '',
version: '',
createGroup: '',
createVersion: '',
+ createRuleMethod: '',
+ createRuleIndex: '',
+ createRuleMatch: '',
updateService: '',
- updateRule: '',
+ updateRuleMethod: '',
+ updateRuleIndex: '',
+ updateRuleMatch: '',
updateGroup: '',
updateVersion: '',
deleteDialog: false,
@@ -286,7 +290,7 @@ export default {
}),
methods: {
submit () {
- if (this.service && this.rule) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -297,7 +301,6 @@ export default {
this.$axios.get('/traffic/argument', {
params: {
service: this.service,
- rule: this.rule,
group: this.group,
version: this.version
}
@@ -313,7 +316,7 @@ export default {
this.updateDialog = false
this.$axios.put('/traffic/argument', {
service: this.updateService,
- rule: this.updateRule,
+ rule:
`${this.updateRuleMethod}[${this.updateRuleIndex}]=${this.updateRuleMatch}`,
group: this.updateGroup,
version: this.updateVersion
}).then((res) => {
@@ -329,7 +332,7 @@ export default {
value: 'service'
},
{
- text: '应用规则',
+ text: '规则',
value: 'rule'
},
{
@@ -356,7 +359,6 @@ export default {
console.log(this.deleteArguments)
this.$axios.delete('/traffic/argument', {
service: this.deleteService,
- rule: this.deleteRule,
group: this.deleteGroup,
version: this.deleteVersion
}).then((res) => {
@@ -369,13 +371,15 @@ export default {
deleteItem (props) {
this.deleteDialog = true
this.deleteService = props.service
- this.deleteRule = props.rule
this.deleteGroup = props.group
this.deleteVersion = props.version
},
update (props) {
this.updateService = props.service
- this.updateRule = props.rule
+ var parts = props.rule.split(/(\w+)\[(\w+)\]=(\w+)/)
+ this.updateRuleMethod = parts[1]
+ this.updateRuleIndex = parts[2]
+ this.updateRuleMatch = parts[3]
this.updateGroup = props.group
this.updateVersion = props.version
this.updateDialog = true
@@ -383,7 +387,7 @@ export default {
save () {
this.$axios.post('/traffic/argument', {
service: this.createService,
- rule: this.createRule,
+ rule:
`${this.createRuleMethod}[${this.createRuleIndex}]=${this.createRuleMatch}`,
group: this.createGroup,
version: this.createVersion
}).then((res) => {
diff --git a/dubbo-admin-ui/src/components/traffic/Gray.vue
b/dubbo-admin-ui/src/components/traffic/Gray.vue
index c028e797..03c891bf 100644
--- a/dubbo-admin-ui/src/components/traffic/Gray.vue
+++ b/dubbo-admin-ui/src/components/traffic/Gray.vue
@@ -27,7 +27,7 @@
<v-layout row wrap>
<v-flex xs6 sm3 md9>
<v-text-field
- v-model="service"
+ v-model="application"
flat
label="请输入应用名"
></v-text-field>
@@ -48,23 +48,21 @@
<v-data-table :headers="headers" :items="tableData" hide-actions
class="elevation-1">
<template slot="items" slot-scope="props">
<td >{{props.item.service}}</td>
- <td>{{props.item.mock}}</td>
- <td>{{props.item.group}}</td>
- <td>{{props.item.version}}</td>
+ <td>{{props.item.Gary}}</td>
<td class="text-xs-center px-0" nowrap>
- <v-btn
+ <!-- <v-btn
class="tiny"
color='success'
@click="Check(props.item)"
>
查看
- </v-btn>
+ </v-btn> -->
<v-btn
class="tiny"
color='success'
@click="update(props.item)"
>
- 修改
+ 查看修改
</v-btn>
<v-btn
class="tiny"
@@ -81,10 +79,32 @@
<v-dialog v-model="dialog" width="800px" persistent >
<v-card>
<v-card-title class="justify-center">
- <span class="headline">新增GAY</span>
+ <span class="headline">新增灰度</span>
</v-card-title>
- <v-card-text v-for="(modal,index) in createGay.tags" :key="index">
- <v-flex>
+ <v-card>
+ <v-card-text>
+ <v-layout row warp>
+ <v-flex xs6 sm3 md8>
+ <v-text-field
+ label="application"
+ hint="请输入application"
+ v-model="createGary.application"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md4>
+ <v-btn
+ style="margin-left: 20px;"
+ depressed
+ color="primary"
+ @click="addCreateGary"
+ >
+ 新增
+ </v-btn>
+ </v-flex>
+ </v-layout>
+ </v-card-text>
+ <v-card-text v-for="(modal,index) in createGary.tags" :key="index">
+ <v-flex xs6 sm3 md6>
<v-text-field
label="名称"
hint="请输入名称"
@@ -104,7 +124,7 @@
style="margin-left: 20px;"
:items="items"
label="Outlined style"
- v-model="selectedOption[idx]"
+ v-model="selectedOption[index][idx]"
@change="updateValue"
outlined
></v-select>
@@ -114,7 +134,7 @@
style="margin-left: 20px;"
label="value"
hint="请输入匹配的值"
- v-model="item.value[selectedOption[idx]]"
+ v-model="item.value[selectedOption[index][idx]]"
></v-text-field>
</v-flex>
<v-flex xs6 sm3 md3>
@@ -130,6 +150,7 @@
</v-flex>
</v-layout>
</v-card-text>
+ </v-card>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn flat @click.native="closeDialog">{{$t('close')}}</v-btn>
@@ -140,10 +161,32 @@
<v-dialog v-model="updateDialog" width="800px" persistent >
<v-card>
<v-card-title class="justify-center">
- <span class="headline">修改GAY</span>
+ <span class="headline">修改灰度</span>
</v-card-title>
- <v-card-text v-for="(modal,index) in gay.tags" :key="index">
- <v-flex>
+ <v-card>
+ <v-card-text>
+ <v-layout row warp>
+ <v-flex xs6 sm3 md8>
+ <v-text-field
+ label="application"
+ hint="请输入application"
+ v-model="updateGary.application"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md4>
+ <v-btn
+ style="margin-left: 20px;"
+ depressed
+ color="primary"
+ @click="addUpdateGary"
+ >
+ 新增
+ </v-btn>
+ </v-flex>
+ </v-layout>
+ </v-card-text>
+ <v-card-text v-for="(modal,index) in updateGary.tags" :key="index">
+ <v-flex xs6 sm3 md6>
<v-text-field
label="名称"
hint="请输入名称"
@@ -163,8 +206,8 @@
style="margin-left: 20px;"
:items="items"
label="Outlined style"
- v-model="selectedOption[idx]"
- @change="updateValue"
+ v-model="selectedUpdateOption[index][idx]"
+ @change="updateValue(index, idx)"
outlined
></v-select>
</v-flex>
@@ -173,7 +216,7 @@
style="margin-left: 20px;"
label="value"
hint="请输入匹配的值"
- v-model="item.value[selectedOption[idx]]"
+ v-model="item.value[selectedUpdateOption[index][idx]]"
></v-text-field>
</v-flex>
<v-flex xs6 sm3 md3>
@@ -182,13 +225,14 @@
class="tiny"
color='success'
outline
- @click="addItem(index)"
+ @click="addUpdateItem(index)"
>
新增一条
</v-btn>
</v-flex>
</v-layout>
</v-card-text>
+ </v-card>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn flat @click.native="closeUpdateDialog">{{$t('close')}}</v-btn>
@@ -248,7 +292,7 @@ export default {
searchLoading: false,
timerID: null,
service: '',
- gay: '',
+ Gary: '',
mock: '',
group: '',
version: '',
@@ -266,7 +310,8 @@ export default {
deleteVersion: '',
deleteGroup: '',
dialog: false,
- selectedOption: [],
+ selectedOption: [[]],
+ selectedUpdateOption: [[]],
headers: [
],
items: ['empty', 'exact', 'noempty', 'prefix', 'regex', 'wildcard'],
@@ -274,15 +319,17 @@ export default {
services: [],
loading: false,
updateDialog: false,
- createGay:
+ application: '',
+ updateGary: {},
+ createGary:
{
- application: '244',
+ application: '',
tags: [
{
- name: '233',
+ name: '',
match: [
{
- key: 'string',
+ key: '',
value: {
empty: '',
exact: '',
@@ -298,20 +345,68 @@ export default {
}
}),
methods: {
- updateValue () {
- console.log(this.selectedOption)
+ updateValue (index, idx) {
+ const temp = {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ this.updateGary.tags[index].match[idx].value = temp
},
submit () {
- if (this.service) {
+ if (this.application) {
this.search()
} else {
this.$notify.error('service is needed')
return false
}
},
+ addCreateGary () {
+ const temp = {
+ name: '',
+ match: [
+ {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ ]
+ }
+ this.selectedOption.push([])
+ this.createGary.tags.push(temp)
+ },
+ addUpdateGary () {
+ const temp = {
+ name: '',
+ match: [
+ {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ ]
+ }
+ this.selectedUpdateOption.push([])
+ this.updateGary.tags.push(temp)
+ },
addItem (params) {
const temp = {
- key: 'string',
+ key: '',
value: {
empty: '',
exact: '',
@@ -322,24 +417,50 @@ export default {
}
}
const index = parseInt(params)
- this.createGay.tags[index].match.push(temp)
+ this.createGary.tags[index].match.push(temp)
+ },
+ addUpdateItem (params) {
+ const temp = {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ const index = parseInt(params)
+ this.updateGary.tags[index].match.push(temp)
},
search () {
this.$axios.get('/traffic/gray', {
params: {
- application: this.service
+ application: this.application
}
}).then(response => {
this.tableData = []
+ const array = []
response.data.forEach(element => {
- this.tableData.push(element)
+ element.tags.forEach(item => {
+ array.push(item.name)
+ })
+ const uniqueArray = Array.from(new Set(array))
+ const Gary = uniqueArray.join('|')
+ const result = {
+ service: element.application,
+ Gary,
+ element
+ }
+ this.tableData.push(result)
})
console.log(this.tableData)
})
},
saveUpdate () {
this.updateDialog = false
- this.$axios.put('/traffic/gray', this.gay).then((res) => {
+ this.$axios.put('/traffic/gray', this.upda).then((res) => {
if (res) {
alert('操作成功')
}
@@ -354,7 +475,7 @@ export default {
},
{
text: '灰度环境',
- value: 'mock'
+ value: 'Gary'
},
{
text: '操作',
@@ -371,10 +492,7 @@ export default {
confirmDelete () {
console.log(this.deleteArguments)
this.$axios.delete('/traffic/mock', {
- service: this.deleteService,
- mock: this.deleteMock,
- group: this.deleteGroup,
- version: this.deleteVersion
+ service: this.deleteService
}).then((res) => {
if (res) {
alert('操作成功')
@@ -385,19 +503,31 @@ export default {
deleteItem (props) {
this.deleteDialog = true
this.deleteService = props.service
- this.deleteMock = props.mock
- this.deleteGroup = props.group
- this.deleteVersion = props.version
},
update (props) {
- this.updateService = props.service
- this.updateMock = props.mock
- this.updateGroup = props.group
- this.updateVersion = props.version
+ this.updateGary = props.element
+ props.element.tags.forEach((item, index) => {
+ this.selectedUpdateOption[index] = []
+ item.match.forEach((it, idx) => {
+ if (it.value.empty !== '') {
+ this.selectedUpdateOption[index][idx] = 'empty'
+ } else if (it.value.exact !== '') {
+ this.selectedUpdateOption[index][idx] = 'exact'
+ } else if (it.value.noempty !== '') {
+ this.selectedUpdateOption[index][idx] = 'noempty'
+ } else if (it.value.prefix !== '') {
+ this.selectedUpdateOption[index][idx] = 'prefix'
+ } else if (it.value.regex !== '') {
+ this.selectedUpdateOption[index][idx] = 'regex'
+ } else if (it.value.wildcard !== '') {
+ this.selectedUpdateOption[index][idx] = 'wildcard'
+ }
+ })
+ })
this.updateDialog = true
},
save () {
- this.$axios.post('/traffic/gray', this.createGay).then((res) => {
+ this.$axios.post('/traffic/gray', this.createGary).then((res) => {
if (res) {
alert('操作成功')
}
diff --git a/dubbo-admin-ui/src/components/traffic/Mock.vue
b/dubbo-admin-ui/src/components/traffic/Mock.vue
index f3dfddd9..126b53a5 100644
--- a/dubbo-admin-ui/src/components/traffic/Mock.vue
+++ b/dubbo-admin-ui/src/components/traffic/Mock.vue
@@ -100,14 +100,14 @@
v-model="createService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Group"
hint="$t('groupInputPrompt')"
v-model="createGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Version"
hint="$t('versionInputPrompt')"
@@ -116,19 +116,19 @@
</v-flex>
</v-layout>
<v-layout wrap>
- <v-flex xs6 sm3 md3>
- <v-text-field
- label="这里应该是个下拉框，有两个选项：当调用失败时返回、强制返回"
- hint=""
- v-model="updateMock"
- ></v-text-field>
+ <v-flex xs6 sm3 md6>
+ <v-select
+ v-model="mockMethod"
+ label="调用方式"
+ :items="['失败返回', '强制返回']"
+ variant="outlined"
+ ></v-select>
</v-flex>
- <v-flex xs6 sm3 md3>
- <v-text-field
- label="请输入具体返回值（如 json 结构体或字符串，具体取决于方法签名的返回值）"
- hint="请点击链接查看如何配置 mock 值。"
- v-model="updateMock"
- ></v-text-field>
+ </v-layout>
+ <v-layout wrap>
+ <v-flex xs6 sm3 md6>
+ <v-textarea v-model="createMock" label="请输入具体返回值（如 json
结构体或字符串，具体取决于方法签名的返回值）"
+ hint="请点击链接查看如何配置 mock 值。" variant="outlined"></v-textarea>
</v-flex>
</v-layout>
</v-card-text>
@@ -169,19 +169,19 @@
</v-flex>
</v-layout>
<v-layout wrap>
- <v-flex xs6 sm3 md3>
- <v-text-field
- label="这里应该是个下拉框，有两个选项：当调用失败时返回、强制返回"
- hint=""
- v-model="updateMock"
- ></v-text-field>
+ <v-flex xs6 sm3 md6>
+ <v-select
+ v-model="mockUpdateMethod"
+ label="调用方式"
+ :items="['失败返回', '强制返回']"
+ variant="outlined"
+ ></v-select>
</v-flex>
- <v-flex xs6 sm3 md3>
- <v-text-field
- label="请输入具体返回值（如 json 结构体或字符串，具体取决于方法签名的返回值）"
- hint="请点击链接查看如何配置 mock 值。"
- v-model="updateMock"
- ></v-text-field>
+ </v-layout>
+ <v-layout wrap>
+ <v-flex xs6 sm3 md6>
+ <v-textarea v-model="updateMock" label="请输入具体返回值（如 json
结构体或字符串，具体取决于方法签名的返回值）"
+ hint="请点击链接查看如何配置 mock 值。" variant="outlined"></v-textarea>
</v-flex>
</v-layout>
</v-card-text>
@@ -253,9 +253,11 @@ export default {
updateMock: '',
updateGroup: '',
updateVersion: '',
+ mockMethod: '',
deleteDialog: false,
createService: '',
createMock: '',
+ mockUpdateMethod: '',
deleteService: '',
deleteMock: '',
deleteVersion: '',
@@ -270,7 +272,7 @@ export default {
}),
methods: {
submit () {
- if (this.service && this.mock) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -278,6 +280,7 @@ export default {
}
},
search () {
+ console.log('mock: force:return Mock
Comment'.split(/:\s(.*?):(.*)/)[2].replace(/^return\s/, ''))
this.$axios.get('/traffic/mock', {
params: {
service: this.service,
@@ -297,7 +300,7 @@ export default {
this.updateDialog = false
this.$axios.put('/traffic/mock', {
service: this.updateService,
- mock: this.updateMock,
+ mock: `${this.mockUpdateMethod === '失败返回' ? `mock: fail:return
${this.updateMock}` : `mock: force:return ${this.updateMock}`}`,
group: this.updateGroup,
version: this.updateVersion
}).then((res) => {
@@ -340,7 +343,6 @@ export default {
console.log(this.deleteMock)
this.$axios.delete('/traffic/mock', {
service: this.deleteService,
- mock: this.deleteMock,
group: this.deleteGroup,
version: this.deleteVersion
}).then((res) => {
@@ -359,15 +361,19 @@ export default {
},
update (props) {
this.updateService = props.service
- this.updateMock = props.mock
+ var parts = props.mock.split(/:\s(.*?):(.*)/)
+ console.log(parts)
+ this.mockUpdateMethod = parts[1] === 'force' ? '强制返回' : '失败返回'
+ this.updateMock = parts[2].replace(/^return\s/, '')
this.updateGroup = props.group
this.updateVersion = props.version
this.updateDialog = true
},
save () {
+ console.log(this.mockMethod)
this.$axios.post('/traffic/mock', {
service: this.createService,
- mock: this.createMock,
+ mock: `${this.mockMethod === '失败返回' ? `mock: fail:return
${this.createMock}` : `mock: force:return ${this.createMock}`}`,
group: this.createGroup,
version: this.createVersion
}).then((res) => {
diff --git a/dubbo-admin-ui/src/components/traffic/Region.vue
b/dubbo-admin-ui/src/components/traffic/Region.vue
index 58956d4c..f0fac848 100644
--- a/dubbo-admin-ui/src/components/traffic/Region.vue
+++ b/dubbo-admin-ui/src/components/traffic/Region.vue
@@ -36,14 +36,14 @@
<v-text-field
label="Version"
:hint="$t('dataIdVersionHint')"
- v-model="group"
+ v-model="version"
></v-text-field>
</v-flex>
<v-flex xs6 sm3 md2 >
<v-text-field
label="Group"
:hint="$t('dataIdGroupHint')"
- v-model="version"
+ v-model="group"
></v-text-field>
</v-flex>
<v-btn @click="submit" color="primary"
large>{{$t('search')}}</v-btn>
@@ -92,7 +92,7 @@
<span class="headline">{{$t('createNewRoutingRule')}}</span>
</v-card-title>
<v-card-text >
- <v-layout wrap>
+ <v-layout row wrap>
<v-flex xs6 sm3 md3>
<v-text-field
label="服务名"
@@ -100,31 +100,33 @@
v-model="createService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md3>
<v-text-field
- label="Group"
+ label="服务版本"
+ hint="$t('versionInputPrompt')"
+ v-model="createVersion"
+ ></v-text-field>
+ </v-flex>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md3>
+ <v-text-field
+ label="服务组"
hint="$t('groupInputPrompt')"
v-model="createGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ </v-layout>
+ <v-layout row wrap>
+ <v-switch label="开启或关闭同区域优先" v-model="handleRule"></v-switch>
+ </v-layout>
+ <v-layout v-if="handleRule" row wrap>
+ <v-flex xs6 sm3 md5>
<v-text-field
- label="Version"
- hint="$t('versionInputPrompt')"
- v-model="createVersion"
- ></v-text-field>
+ label="匹配规则"
+ hint="请输入流量匹配规则（默认不设置，则对所有流量生效），配置后只有匹配规则的流量才会执行同区域优先调用，如
method=sayHello"
+ v-model="createRule"
+ ></v-text-field>
</v-flex>
</v-layout>
- <v-text-field
- label="开启或关闭同区域优先（这里应该是一个开关，让用户选择打开或关闭同区域优先）"
- hint=""
- v-model="createRule"
- ></v-text-field>
- <v-text-field
- label="匹配以下条件的流量开启同区域优先（默认不显示，用户点击后才显示出来让用户输入）"
- hint="请输入流量匹配规则（默认不设置，则对所有流量生效），配置后只有匹配规则的流量才会执行同区域优先调用，如
method=sayHello"
- v-model="createRule"
- ></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -139,35 +141,41 @@
<span class="headline">{{$t('createNewRoutingRule')}}</span>
</v-card-title>
<v-card-text >
- <v-layout wrap>
- <v-flex>
+ <v-layout row wrap>
+ <v-flex xs6 sm3 md3>
<v-text-field
label="服务名"
hint="请输入服务名"
v-model="updateService"
></v-text-field>
</v-flex>
- </v-layout>
- <v-text-field
- label="Group"
- hint="$t('groupInputPrompt')"
- v-model="updateGroup"
- ></v-text-field>
- <v-text-field
- label="Version"
- hint="$t('versionInputPrompt')"
- v-model="updateVersion"
+ <v-flex style="margin-left: 10px;" xs6 sm3 md3>
+ <v-text-field
+ label="Group"
+ hint="$t('groupInputPrompt')"
+ v-model="updateGroup"
></v-text-field>
- <v-text-field
- label="开启或关闭同区域优先（这里应该是一个开关，让用户选择打开或关闭同区域优先）"
- hint="这应该是一个 radio button，让用户选择是否开启同区域优先？"
- v-model="updateRule1"
+ </v-flex>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md3>
+ <v-text-field
+ label="Version"
+ hint="$t('versionInputPrompt')"
+ v-model="updateVersion"
></v-text-field>
- <v-text-field
- label="匹配以下条件的流量开启同区域优先（默认不显示，用户点击后才显示出来让用户输入）"
- hint="请输入流量匹配规则（默认不设置，则对所有流量生效），配置后只有匹配规则的流量才会执行同区域优先调用，如
method=sayHello"
- v-model="updateRule2"
+ </v-flex>
+ </v-layout>
+ <v-layout row wrap>
+ <v-switch label="开启或关闭同区域优先" v-model="handleUpdateRule"></v-switch>
+ </v-layout>
+ <v-layout v-if="handleUpdateRule" row wrap>
+ <v-flex xs6 sm3 md5>
+ <v-text-field
+ label="匹配规则"
+ hint="请输入流量匹配规则（默认不设置，则对所有流量生效），配置后只有匹配规则的流量才会执行同区域优先调用，如
method=sayHello"
+ v-model="updateRule"
></v-text-field>
+ </v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -238,6 +246,8 @@ export default {
updateGroup: '',
updateVersion: '',
deleteDialog: false,
+ handleRule: false,
+ handleUpdateRule: false,
createService: '',
createRule: '',
deleteService: '',
@@ -254,7 +264,7 @@ export default {
}),
methods: {
submit () {
- if (this.service && this.rule) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -265,7 +275,6 @@ export default {
this.$axios.get('/traffic/region', {
params: {
service: this.service,
- rule: this.rule,
group: this.group,
version: this.version
}
@@ -279,16 +288,29 @@ export default {
},
saveUpdate () {
this.updateDialog = false
- this.$axios.put('/traffic/region', {
- service: this.updateService,
- rule: this.updateRule,
- group: this.updateGroup,
- version: this.updateVersion
- }).then((res) => {
- if (res) {
- alert('操作成功')
- }
- })
+ if (this.handleUpdateRule) {
+ this.$axios.put('/traffic/region', {
+ service: this.updateService,
+ rule: this.updateRule,
+ group: this.updateGroup,
+ version: this.updateVersion
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ } else {
+ this.$axios.put('/traffic/region', {
+ service: this.updateService,
+ rule: this.handleUpdateRule.toString(),
+ group: this.updateGroup,
+ version: this.updateVersion
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ }
},
setHeaders: function () {
this.headers = [
@@ -321,7 +343,6 @@ export default {
this.dialog = true
},
confirmDelete () {
- console.log(this.deleteRegion)
this.$axios.delete('/traffic/region', {
service: this.deleteService,
rule: this.deleteRule,
@@ -343,22 +364,41 @@ export default {
},
update (props) {
this.updateService = props.service
- this.updateRule = props.rule
+ if (props.rule === 'false') {
+ this.handleUpdateRule = false
+ this.updateRule = ''
+ } else {
+ this.handleUpdateRule = true
+ this.updateRule = props.rule
+ }
this.updateGroup = props.group
this.updateVersion = props.version
this.updateDialog = true
},
save () {
- this.$axios.post('/traffic/region', {
- service: this.createService,
- rule: this.createRule,
- group: this.createGroup,
- version: this.createVersion
- }).then((res) => {
- if (res) {
- alert('操作成功')
- }
- })
+ if (this.handleRule) {
+ this.$axios.post('/traffic/region', {
+ service: this.createService,
+ rule: this.createRule,
+ group: this.createGroup,
+ version: this.createVersion
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ } else {
+ this.$axios.post('/traffic/region', {
+ service: this.createService,
+ rule: this.handleRule.toString(),
+ group: this.createGroup,
+ version: this.createVersion
+ }).then((res) => {
+ if (res) {
+ alert('操作成功')
+ }
+ })
+ }
this.dialog = false
},
closeDialog () {
diff --git a/dubbo-admin-ui/src/components/traffic/Retry.vue
b/dubbo-admin-ui/src/components/traffic/Retry.vue
index 94822cf0..fd589afe 100644
--- a/dubbo-admin-ui/src/components/traffic/Retry.vue
+++ b/dubbo-admin-ui/src/components/traffic/Retry.vue
@@ -100,22 +100,21 @@
v-model="createService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Group"
hint="请输入服务group(可选)"
v-model="createGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Version"
hint="请输入服务version(可选)"
v-model="createVersion"
></v-text-field>
</v-flex>
- </v-layout>
- <v-flex xs6 sm3 md3>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md3>
<v-text-field
label="重试次数"
hint="请输入一个整数值(如 3 代表在服务调用失败后重试 3 次)"
@@ -123,6 +122,7 @@
v-model="createRetry"
></v-text-field>
</v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -145,26 +145,28 @@
v-model="updateService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Group"
hint="请输入服务group(可选)"
v-model="updateGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="Version"
hint="请输入服务version(可选)"
v-model="updateVersion"
></v-text-field>
</v-flex>
- </v-layout>
- <v-text-field
- label="重试次数"
- hint="请输入一个整数值(如 3 代表在服务调用失败后重试 3 次)"
- v-model="updateRetry"
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
+ <v-text-field
+ label="重试次数"
+ hint="请输入一个整数值(如 3 代表在服务调用失败后重试 3 次)"
+ v-model="updateRetry"
></v-text-field>
+ </v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -251,7 +253,7 @@ export default {
}),
methods: {
submit () {
- if (this.service && this.retry) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -262,7 +264,6 @@ export default {
this.$axios.get('/traffic/retry', {
params: {
service: this.service,
- retry: this.retry,
group: this.group,
version: this.version
}
@@ -278,13 +279,14 @@ export default {
this.updateDialog = false
this.$axios.put('/traffic/retry', {
service: this.updateService,
- retry: this.updateRetry,
+ retry: parseInt(this.updateRetry),
group: this.updateGroup,
version: this.updateVersion
}).then((res) => {
if (res) {
alert('操作成功')
}
+ this.search()
})
},
setHeaders: function () {
@@ -318,10 +320,8 @@ export default {
this.dialog = true
},
confirmDelete () {
- console.log(this.deleteRetry)
this.$axios.delete('/traffic/retry', {
service: this.deleteService,
- retry: this.deleteRetry,
group: this.deleteGroup,
version: this.deleteVersion
}).then((res) => {
@@ -348,7 +348,7 @@ export default {
save () {
this.$axios.post('/traffic/retry', {
service: this.createService,
- retry: this.createRetry,
+ retry: parseInt(this.createRetry),
group: this.createGroup,
version: this.createVersion
}).then((res) => {
diff --git a/dubbo-admin-ui/src/components/traffic/Timeout.vue
b/dubbo-admin-ui/src/components/traffic/Timeout.vue
index faa39aff..5868e62b 100644
--- a/dubbo-admin-ui/src/components/traffic/Timeout.vue
+++ b/dubbo-admin-ui/src/components/traffic/Timeout.vue
@@ -93,36 +93,36 @@
</v-card-title>
<v-card-text >
<v-layout row wrap>
- <v-flex xs6 sm3 md3>
+ <v-flex xs6 sm3 md2>
<v-text-field
label="服务名"
hint="请输入服务名"
v-model="createService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="服务分组"
hint="请输入服务group(可选)"
v-model="createGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="服务版本"
hint="请输入服务version(可选)"
v-model="createVersion"
></v-text-field>
</v-flex>
- </v-layout>
- <v-flex xs6 sm3 md3>
- <v-text-field
- label="超时时间"
- hint="请输入一个整数值作为超时时间(单位ms)"
- type="number"
- v-model="createTimeout"
- ></v-text-field>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
+ <v-text-field
+ label="超时时间"
+ hint="请输入一个整数值作为超时时间(单位ms)"
+ type="number"
+ v-model="createTimeout"
+ ></v-text-field>
</v-flex>
+ </v-layout>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -138,34 +138,36 @@
</v-card-title>
<v-card-text >
<v-layout wrap>
- <v-flex xs6 sm3 md3>
+ <v-flex xs6 sm3 md2>
<v-text-field
label="服务名"
hint="请输入服务名"
v-model="updateService"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="服务分组"
hint="请输入服务group(可选)"
v-model="updateGroup"
></v-text-field>
</v-flex>
- <v-flex xs6 sm3 md2>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
<v-text-field
label="服务版本"
hint="请输入服务version(可选)"
v-model="updateVersion"
></v-text-field>
</v-flex>
+ <v-flex style="margin-left: 10px;" xs6 sm3 md2>
+ <v-text-field
+ label="超时时间"
+ hint="请输入一个整数值作为超时时间(单位ms)"
+ type="number"
+ v-model="updateTimeout"
+ ></v-text-field>
+ </v-flex>
</v-layout>
- <v-text-field
- label="超时时间"
- hint="请输入一个整数值作为超时时间(单位ms)"
- type="number"
- v-model="updateTimeout"
- ></v-text-field>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
@@ -252,7 +254,7 @@ export default {
}),
methods: {
submit () {
- if (this.service && this.timeout) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
@@ -263,7 +265,6 @@ export default {
this.$axios.get('/traffic/timeout', {
params: {
service: this.service,
- timeout: parseInt(this.timeout),
group: this.group,
version: this.version
}
@@ -322,7 +323,6 @@ export default {
console.log(this.deleteTimeout)
this.$axios.delete('/traffic/timeout', {
service: this.deleteService,
- timeout: parseInt(this.deleteTimeout),
group: this.deleteGroup,
version: this.deleteVersion
}).then((res) => {
diff --git a/dubbo-admin-ui/src/components/traffic/Weight.vue
b/dubbo-admin-ui/src/components/traffic/Weight.vue
index 84b198f9..4c3fb7f5 100644
--- a/dubbo-admin-ui/src/components/traffic/Weight.vue
+++ b/dubbo-admin-ui/src/components/traffic/Weight.vue
@@ -25,29 +25,31 @@
<v-card-text>
<v-form>
<v-layout row wrap>
- <v-combobox
- :loading="searchLoading"
- :items="typeAhead"
- :search-input.sync="application"
- flat
- append-icon=""
- hide-no-data
- label="请输入application"
- hint="请输入application"
- ></v-combobox>
- <v-combobox
- style="margin-left: 20px;"
- :loading="searchLoading"
- :items="typeAhead"
- :search-input.sync="accesslog"
- flat
- append-icon=""
- hide-no-data
- label="请输入accesslog"
- hint="请输入accesslog"
- ></v-combobox>
-
- <v-btn @click="submit" color="primary" large>搜索</v-btn>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ v-model="service"
+ label="Service"
+ flat
+ hint="请输入应用名"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ v-model="version"
+ label="Version"
+ flat
+ hint="请输入应用名"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ v-model="group"
+ label="Group"
+ flat
+ hint="请输入应用名"
+ ></v-text-field>
+ </v-flex>
+ <v-btn @click="submit" color="primary"
large>{{$t('search')}}</v-btn>
<v-btn @click="create" color="primary" large>新建</v-btn>
</v-layout>
</v-form>
@@ -57,14 +59,21 @@
<v-flex xs12>
<v-card>
<v-toolbar flat color="transparent" class="elevation-0">
- <v-toolbar-title><span
class="headline">{{$t('trafficWeight')}}</span></v-toolbar-title>
+ <v-toolbar-title><span
class="headline">{{$t('trafficweight')}}</span></v-toolbar-title>
<v-spacer></v-spacer>
</v-toolbar>
<v-data-table :headers="headers" :items="tableData" hide-actions
class="elevation-1">
<template slot="items" slot-scope="props">
- <td >{{props.item.application}}</td>
- <td>{{props.item.accesslog}}</td>
+ <td >{{props.item.service}}</td>
+ <td>{{props.item.weight}}</td>
<td class="text-xs-center px-0" nowrap>
+ <!-- <v-btn
+ class="tiny"
+ color='success'
+ @click="Check(props.item)"
+ >
+ 查看
+ </v-btn> -->
<v-btn
class="tiny"
color='success'
@@ -79,91 +88,199 @@
>
删除
</v-btn>
- <v-btn
- class="tiny"
- outline
- >
- 启用
- </v-btn>
</td>
</template>
</v-data-table>
</v-card>
</v-flex>
<v-dialog v-model="dialog" width="800px" persistent >
+ <v-card>
+ <v-card-title class="justify-center">
+ <span class="headline">新增权重</span>
+ </v-card-title>
<v-card>
- <v-card-title class="justify-center">
- <span class="headline">新增GRAY</span>
- </v-card-title>
<v-card-text>
- <v-flex xs6 sm3 md3>
- <v-select
- hint="请选择key"
- style="margin-left: 20px;"
- :items="keys"
- label="Outlined style"
- outlined
- ></v-select>
- </v-flex>
- <v-layout row wrap v-for="(item,idx) in
createWeight.match.application.oneof" :key="idx">
- <v-flex xs6 sm3 md3>
- <v-select
- style="margin-left: 20px;"
- :items="items"
- label="Outlined style"
- v-model="selectedOption[idx]"
- outlined
- ></v-select>
- </v-flex>
- <v-flex xs6 sm3 md>
- <v-text-field
- style="margin-left: 20px;"
- label="value"
- hint="请输入匹配的值"
- v-model="item[selectedOption[idx]]"
- ></v-text-field>
- </v-flex>
+ <v-layout row warp>
<v-flex xs6 sm3 md3>
- <v-btn
- style="margin-left: 20px;"
- class="tiny"
- color='success'
- outline
- @click="addItem(index)"
- >
- 新增一条
- </v-btn>
- </v-flex>
- </v-layout>
+ <v-text-field
+ label="service"
+ hint="请输入service"
+ v-model="createWeight.service"
+ ></v-text-field>
+ </v-flex>
+ <v-flex style="margin-left: 20px;" xs6 sm3 md3>
+ <v-text-field
+ label="version"
+ hint="请输入version"
+ v-model="createWeight.version"
+ ></v-text-field>
+ </v-flex>
+ <v-flex style="margin-left: 20px;" xs6 sm3 md3>
+ <v-text-field
+ label="group"
+ hint="请输入group"
+ v-model="createWeight.group"
+ ></v-text-field>
+ </v-flex>
+ <v-flex style="margin-left: 20px;" xs6 sm3 md2>
+ <v-btn
+ depressed
+ color="primary"
+ @click="addCreateWeight"
+ >
+ 新增
+ </v-btn>
+ </v-flex>
+ </v-layout>
</v-card-text>
- <v-card-actions>
- <v-spacer></v-spacer>
- <v-btn flat @click.native="closeDialog">{{$t('close')}}</v-btn>
- <v-btn depressed color="primary"
@click.native="save">{{$t('save')}}</v-btn>
- </v-card-actions>
- </v-card>
+ <v-card-text v-for="(modal,index) in createWeight.weights" :key="index">
+ <v-flex xs6 sm3 md6>
+ <v-text-field
+ label="权重"
+ hint="请输入权重"
+ type="number"
+ v-model="modal.weight"
+ @input="handleInputWeight(index)"
+ ></v-text-field>
+ </v-flex>
+ <v-layout row wrap v-for="(item,idx) in modal.match.param" :key="idx">
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ label="key"
+ hint="请输入key"
+ v-model="item.key"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-select
+ style="margin-left: 20px;"
+ :items="items"
+ label="Outlined style"
+ v-model="selectedOption[index][idx]"
+ @change="updateValue"
+ outlined
+ ></v-select>
+ </v-flex>
+ <v-flex xs6 sm3 md>
+ <v-text-field
+ style="margin-left: 20px;"
+ label="value"
+ hint="请输入匹配的值"
+ v-model="item.value[selectedOption[index][idx]]"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-btn
+ style="margin-left: 20px;"
+ class="tiny"
+ color='success'
+ outline
+ @click="addItem(index)"
+ >
+ 新增一条
+ </v-btn>
+ </v-flex>
+ </v-layout>
+ </v-card-text>
+ </v-card>
+ <v-card-actions>
+ <v-spacer></v-spacer>
+ <v-btn flat @click.native="closeDialog">{{$t('close')}}</v-btn>
+ <v-btn depressed color="primary"
@click.native="save">{{$t('save')}}</v-btn>
+ </v-card-actions>
+ </v-card>
</v-dialog>
<v-dialog v-model="updateDialog" width="800px" persistent >
<v-card>
<v-card-title class="justify-center">
- <span class="headline">{{$t('createNewRoutingRule')}}</span>
+ <span class="headline">修改权重</span>
</v-card-title>
- <v-card-text >
- <v-layout wrap>
- <v-flex>
+ <v-card>
+ <v-card-text>
+ <v-layout row warp>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ label="service"
+ hint="请输入service"
+ v-model="updateWeight.service"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ label="version"
+ hint="请输入version"
+ v-model="updateWeight.version"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ label="group"
+ hint="请输入group"
+ v-model="updateWeight.group"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md4>
+ <v-btn
+ style="margin-left: 20px;"
+ depressed
+ color="primary"
+ @click="addUpdateWeight"
+ >
+ 新增
+ </v-btn>
+ </v-flex>
+ </v-layout>
+ </v-card-text>
+ <v-card-text v-for="(modal,index) in updateWeight.weights" :key="index">
+ <v-flex xs6 sm3 md6>
+ <v-text-field
+ label="权重"
+ hint="请输入权重"
+ type="number"
+ v-model="modal.weight"
+ @input="handleUpdateInputWeight(index)"
+ ></v-text-field>
+ </v-flex>
+ <v-layout row wrap v-for="(item,idx) in modal.match.param" :key="idx">
+ <v-flex xs6 sm3 md3>
+ <v-text-field
+ label="key"
+ hint="请输入key"
+ v-model="item.key"
+ ></v-text-field>
+ </v-flex>
+ <v-flex xs6 sm3 md3>
+ <v-select
+ style="margin-left: 20px;"
+ :items="items"
+ label="Outlined style"
+ v-model="selectedUpdateOption[index][idx]"
+ @change="updateValue(index, idx)"
+ outlined
+ ></v-select>
+ </v-flex>
+ <v-flex xs6 sm3 md>
<v-text-field
- label="Application Name"
- hint="请输入Application Name"
- v-model="updateApplication"
+ style="margin-left: 20px;"
+ label="value"
+ hint="请输入匹配的值"
+ v-model="item.value[selectedUpdateOption[index][idx]]"
></v-text-field>
</v-flex>
- </v-layout>
- <v-text-field
- label="Accesslog"
- hint="请输入Accesslog"
- v-model="updateAccesslog"
- ></v-text-field>
+ <v-flex xs6 sm3 md3>
+ <v-btn
+ style="margin-left: 20px;"
+ class="tiny"
+ color='success'
+ outline
+ @click="addUpdateItem(index)"
+ >
+ 新增一条
+ </v-btn>
+ </v-flex>
+ </v-layout>
</v-card-text>
+ </v-card>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn flat @click.native="closeUpdateDialog">{{$t('close')}}</v-btn>
@@ -205,7 +322,7 @@
<script>
import Breadcrumb from '../public/Breadcrumb.vue'
export default {
- name: 'Accesslog',
+ name: 'weight',
components: { Breadcrumb },
data: () => ({
breads: [
@@ -222,115 +339,210 @@ export default {
input: null,
searchLoading: false,
timerID: null,
- application: '',
- accesslog: '',
- items: ['empty', 'exact', 'noempty', 'prefix', 'regex', 'wildcard'],
- keys: ['application', 'service', 'param'],
- selectedKey: [],
+ service: '',
+ weight: '',
+ mock: '',
+ group: '',
+ version: '',
+ createGroup: '',
+ createVersion: '',
+ updateService: '',
+ updateMock: '',
+ updateGroup: '',
+ updateVersion: '',
deleteDialog: false,
- createApplication: '',
- selectedOption: [],
- createAccesslog: '',
- deleteApplication: '',
- createWeight: {
- match: {
- application: {
- oneof: [
- {
- empty: '',
- exact: '',
- noempty: '',
- prefix: '',
- regex: '',
- wildcard: ''
- }
- ]
- },
- param: [
- {
- key: '',
- value: {
- empty: '',
- exact: '',
- noempty: '',
- prefix: '',
- regex: '',
- wildcard: ''
- }
- }
- ],
- service: {
- oneof: [
- {
- empty: '',
- exact: '',
- noempty: '',
- prefix: '',
- regex: '',
- wildcard: ''
- }
- ]
- }
- },
- weight: 0
- },
- deleteAccesslog: '',
+ createService: '',
+ createMock: '',
+ deleteService: '',
+ deleteMock: '',
+ deleteVersion: '',
+ deleteGroup: '',
dialog: false,
+ selectedOption: [[]],
+ selectedUpdateOption: [[]],
headers: [
],
- service: null,
+ items: ['empty', 'exact', 'noempty', 'prefix', 'regex', 'wildcard'],
tableData: [],
services: [],
loading: false,
updateDialog: false,
- updateApplication: '',
- updateAccesslog: ''
+ updateWeight: {},
+ createWeight:
+ {
+ service: '',
+ group: '',
+ version: '',
+ weights: [
+ {
+ weight: '',
+ match: {
+ param: [
+ {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ ]
+ }
+ }
+ ]
+ }
}),
methods: {
+ handleInputWeight (index) {
+ this.createWeight.weights[index].weight =
Number(this.createWeight.weights[index].weight)
+ },
+ handleUpdateInputWeight (index) {
+ this.updateWeight.weights[index].weight =
Number(this.updateWeight.weights[index].weight)
+ },
+ updateValue (index, idx) {
+ const temp = {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ this.updateWeight.weights[index].match[idx].value = temp
+ },
submit () {
- if (this.accesslog && this.application) {
+ if (this.service) {
this.search()
} else {
this.$notify.error('service is needed')
return false
}
},
+ addCreateWeight () {
+ const temp = {
+ weight: '',
+ match: {
+ param: [
+ {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ ]
+ }
+ }
+ this.selectedOption.push([])
+ this.createWeight.weights.push(temp)
+ },
+ addUpdateWeight () {
+ const temp = {
+ weight: '',
+ match: {
+ param: [
+ {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ ]
+ }
+ }
+ this.selectedUpdateOption.push([])
+ this.updateWeights.push(temp)
+ },
+ addItem (params) {
+ const temp = {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ const index = parseInt(params)
+ this.createWeight.weights[index].match.param.push(temp)
+ },
+ addUpdateItem (params) {
+ const temp = {
+ key: '',
+ value: {
+ empty: '',
+ exact: '',
+ noempty: '',
+ prefix: '',
+ regex: '',
+ wildcard: ''
+ }
+ }
+ const index = parseInt(params)
+ this.updateWeight.weights[index].match.param.push(temp)
+ },
search () {
- this.$axios.get('/traffic/accesslog', {
+ this.$axios.get('/traffic/weight', {
params: {
- application: this.application,
- accesslog: this.accesslog
+ service: this.service,
+ version: this.version,
+ group: this.group
}
}).then(response => {
- console.log(response)
this.tableData = []
+ console.log(response)
response.data.forEach(element => {
- this.tableData.push(element)
+ let sum = 0
+ element.weights.forEach(item => {
+ sum += item.weight
+ })
+ const weight = sum / element.weights.length
+ const result = {
+ service: element.service,
+ weight,
+ element
+ }
+ this.tableData.push(result)
})
console.log(this.tableData)
})
},
saveUpdate () {
- console.log(this.updateAccesslog)
this.updateDialog = false
- this.$axios.put('/traffic/accesslog', {
- application: this.updateApplication,
- accesslog: this.updateAccesslog
- }).then((res) => {
+ this.$axios.put('/traffic/weight', this.updateWeight).then((res) => {
if (res) {
alert('操作成功')
}
})
+ this.search()
},
setHeaders: function () {
this.headers = [
{
- text: '服务',
- value: 'application'
+ text: '应用名',
+ value: 'service'
},
{
- text: 'accesslog',
- value: 'accesslog'
+ text: '权重',
+ value: 'weight'
+ },
+ {
+ text: '操作',
+ value: 'version'
}
]
},
@@ -341,39 +553,55 @@ export default {
this.dialog = true
},
confirmDelete () {
- console.log(this.deleteAccesslog)
- this.$axios.delete('/traffic/accesslog', {
- application: this.deleteApplication,
- accesslog: this.deleteAccesslog
+ console.log(this.deleteArguments)
+ this.$axios.delete('/traffic/mock', {
+ service: this.deleteService,
+ group: this.deleteGroup,
+ version: this.deleteVersion
}).then((res) => {
if (res) {
alert('操作成功')
}
})
- this.deleteAccesslog = false
+ this.deleteArguments = false
},
deleteItem (props) {
this.deleteDialog = true
- this.deleteAccesslog = props.accesslog
- this.deleteApplication = props.application
+ this.deleteService = props.element.service
+ this.deleteGroup = props.element.group
+ this.deleteVersion = props.element.version
},
update (props) {
- console.log(props)
- this.updateApplication = props.application
- this.updateAccesslog = props.accesslog
+ this.updateWeight = props.element
+ props.element.weights.forEach((item, index) => {
+ this.selectedUpdateOption[index] = []
+ item.match.param.forEach((it, idx) => {
+ console.log(index, idx)
+ if (it.value.empty !== '') {
+ this.selectedUpdateOption[index][idx] = 'empty'
+ } else if (it.value.exact !== '') {
+ this.selectedUpdateOption[index][idx] = 'exact'
+ } else if (it.value.noempty !== '') {
+ this.selectedUpdateOption[index][idx] = 'noempty'
+ } else if (it.value.prefix !== '') {
+ this.selectedUpdateOption[index][idx] = 'prefix'
+ } else if (it.value.regex !== '') {
+ this.selectedUpdateOption[index][idx] = 'regex'
+ } else if (it.value.wildcard !== '') {
+ this.selectedUpdateOption[index][idx] = 'wildcard'
+ }
+ })
+ })
this.updateDialog = true
- console.log(this.updateApplication)
- console.log(this.updateAccesslog)
},
save () {
- this.$axios.post('/traffic/accesslog', {
- application: this.createApplication,
- accesslog: this.createAccesslog
- }).then((res) => {
+ console.log(this.createWeight)
+ this.$axios.post('/traffic/weight', this.createWeight).then((res) => {
if (res) {
alert('操作成功')
}
})
+ this.dialog = false
},
closeDialog () {
this.dialog = false
diff --git a/pkg/admin/handlers/traffic/weight.go
b/pkg/admin/handlers/traffic/weight.go
index ad12b360..70969f45 100644
--- a/pkg/admin/handlers/traffic/weight.go
+++ b/pkg/admin/handlers/traffic/weight.go
@@ -34,7 +34,7 @@ var weightSvc = &traffic.WeightService{}
// @Tags TrafficWeight
// @Accept json
// @Produce json
-// @Param weight body model.Weight true "rule"
+// @Param weight body model.Percentage true "rule"
// @Success 200 {bool} true
// @Failure 400 {object} model.HTTPError
// @Failure 500 {object} model.HTTPError
@@ -51,7 +51,7 @@ func CreateWeight(c *gin.Context) {
// @Tags TrafficWeight
// @Accept json
// @Produce json
-// @Param weight body model.Weight true "rule"
+// @Param weight body model.Percentage true "rule"
// @Success 200 {bool} true
// @Failure 400 {object} model.HTTPError
// @Failure 500 {object} model.HTTPError
