diff --git a/dubbo-admin-ui/src/api/menu.js b/dubbo-admin-ui/src/api/menu.js
index 478835fa7..719d7e5e2 100644
--- a/dubbo-admin-ui/src/api/menu.js
+++ b/dubbo-admin-ui/src/api/menu.js
@@ -33,9 +33,9 @@ const Menu = [
       { title: 'trafficAccesslog', path: '/traffic/accesslog' },
       { title: 'trafficGray', path: '/traffic/gray' },
       //  { title: 'trafficHost', path: '/traffic/host' },
-      { title: 'routingRule', path: '/governance/routingRule' },
-      { title: 'tagRule', path: '/governance/tagRule' },
-      { title: 'dynamicConfig', path: '/governance/config' }
+      { title: 'routingRule', path: '/traffic/routingRule' },
+      { title: 'tagRule', path: '/traffic/tagRule' },
+      { title: 'dynamicConfig', path: '/traffic/config' }
     ]
   },
   {
diff --git a/dubbo-admin-ui/src/components/ServiceDetail.vue b/dubbo-admin-ui/src/components/ServiceDetail.vue
index f13927885..848ecbf73 100644
--- a/dubbo-admin-ui/src/components/ServiceDetail.vue
+++ b/dubbo-admin-ui/src/components/ServiceDetail.vue
@@ -100,7 +100,7 @@
           <template slot="items" slot-scope="props">
             <td>{{props.item.name}}</td>
             <td>
-              <v-chip v-for="(type, index) in props.item.parameterTypes" :key="type.id" label>{{type}}</v-chip>
+              <v-chip v-for="(type) in props.item.parameterTypes" :key="type.id" label>{{type}}</v-chip>
             </td>
             <td>
               <v-chip label>{{props.item.returnType}}</v-chip>
diff --git a/dubbo-admin-ui/src/components/apiDocs/ApiForm.vue b/dubbo-admin-ui/src/components/apiDocs/ApiForm.vue
index f81f2a821..a438130d4 100644
--- a/dubbo-admin-ui/src/components/apiDocs/ApiForm.vue
+++ b/dubbo-admin-ui/src/components/apiDocs/ApiForm.vue
@@ -379,6 +379,7 @@ export default {
         }
         var tempMapValueArray = tempMap.get(tempMapKey)
         if (!tempMapValueArray) {
+          // eslint-disable-next-line no-array-constructor
           tempMapValueArray = new Array()
           tempMap.set(tempMapKey, tempMapValueArray)
         }
diff --git a/dubbo-admin-ui/src/components/public/AceEditor.vue b/dubbo-admin-ui/src/components/public/AceEditor.vue
index e2819b369..85f021d87 100644
--- a/dubbo-admin-ui/src/components/public/AceEditor.vue
+++ b/dubbo-admin-ui/src/components/public/AceEditor.vue
@@ -80,6 +80,7 @@ export default {
   data () {
     return {
       $ace: null,
+      // eslint-disable-next-line vue/no-reserved-keys
       _content: ''
     }
   },
diff --git a/dubbo-admin-ui/src/components/public/Breadcrumb.vue b/dubbo-admin-ui/src/components/public/Breadcrumb.vue
index b0f28138c..63c6a28b6 100644
--- a/dubbo-admin-ui/src/components/public/Breadcrumb.vue
+++ b/dubbo-admin-ui/src/components/public/Breadcrumb.vue
@@ -41,6 +41,7 @@ export default {
     },
     items: {
       type: Array,
+      // eslint-disable-next-line vue/require-valid-default-prop
       default: []
     }
   },
diff --git a/dubbo-admin-ui/src/components/public/Drawer.vue b/dubbo-admin-ui/src/components/public/Drawer.vue
index 6f2296de6..cd91935b7 100644
--- a/dubbo-admin-ui/src/components/public/Drawer.vue
+++ b/dubbo-admin-ui/src/components/public/Drawer.vue
@@ -1,3 +1,4 @@
+<!-- eslint-disable vue/valid-v-for -->
 <!--
   ~ Licensed to the Apache Software Foundation (ASF) under one or more
   ~ contributor license agreements.  See the NOTICE file distributed with
@@ -34,7 +35,7 @@
     </v-toolbar>
 
     <v-list expand>
-      <template v-for="(item, i) in menus">
+      <template v-for="(item) in menus">
         <v-list-group v-if="item.items" :group="item.group" :prepend-icon="item.icon" no-action>
           <v-list-tile slot="activator" ripple>
             <v-list-tile-content>
@@ -42,7 +43,7 @@
             </v-list-tile-content>
           </v-list-tile>
 
-          <template v-for="(subItem, i) in item.items">
+          <template v-for="(subItem) in item.items">
             <v-list-tile :to="subItem.path" ripple>
               <v-list-tile-content>
                 <v-list-tile-title>{{ $t(subItem.title) }}</v-list-tile-title>
diff --git a/dubbo-admin-ui/src/components/traffic/Accesslog.vue b/dubbo-admin-ui/src/components/traffic/Accesslog.vue
index 9b605f08f..19371e2b4 100644
--- a/dubbo-admin-ui/src/components/traffic/Accesslog.vue
+++ b/dubbo-admin-ui/src/components/traffic/Accesslog.vue
@@ -28,16 +28,11 @@
             <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"
+                  <v-text-field
+                    label="Application Name"
                     hint="请输入application"
-                  ></v-combobox>
+                    v-model="application"
+                  ></v-text-field>
                   <v-btn @click="submit" color="primary" large>搜索</v-btn>
                   <v-btn @click="create" color="primary" large>新建</v-btn>
                 </v-layout>
@@ -131,6 +126,7 @@
               <v-text-field
                 label="Application Name"
                 hint="请输入应用名"
+                disabled
                 v-model="updateApplication"
               ></v-text-field>
             </v-flex>
@@ -176,7 +172,7 @@
           <v-btn
             color="green darken-1"
             text
-            @click="confirmDelete"
+            @click="confirmDelete()"
           >
           确定
           </v-btn>
@@ -266,6 +262,9 @@ export default {
           }
         })
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -288,18 +287,30 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createAccesslog = ''
+      this.createApplication = ''
     },
     confirmDelete () {
+      console.log(this.deleteApplication)
       this.$axios.delete('/traffic/accesslog', {
-        application: this.deleteApplication
-      }).then((res) => {
+        params: {
+          application: this.deleteApplication,
+          group: this.group,
+          version: this.version
+        }
+      }
+      ).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteAccesslog = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
+      console.log(props)
       this.deleteDialog = true
       this.deleteAccesslog = props.accesslog
       this.deleteApplication = props.application
@@ -324,6 +335,9 @@ export default {
         alert('访问日志未开启，请选中开关后再保存！')
       }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -336,6 +350,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.application = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Arguments.vue b/dubbo-admin-ui/src/components/traffic/Arguments.vue
index 1e4b9ae6d..106f2eabc 100644
--- a/dubbo-admin-ui/src/components/traffic/Arguments.vue
+++ b/dubbo-admin-ui/src/components/traffic/Arguments.vue
@@ -28,25 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     flat
                     label="请输入服务名"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Version"
-                    :hint="$t('dataIdVersionHint')"
-                    v-model="group"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Group"
-                    :hint="$t('dataIdGroupHint')"
-                    v-model="version"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -101,27 +88,13 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="createService"
             ></v-text-field>
           </v-flex>
-          <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 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-layout wrap>
           <v-flex lg12>
@@ -186,27 +159,14 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
+              disabled
               v-model="updateService"
             ></v-text-field>
           </v-flex>
-          <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 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-layout wrap>
           <v-flex lg12>
@@ -315,6 +275,7 @@ export default {
     version: '',
     createGroup: '',
     createVersion: '',
+    searchService: '',
     createRuleMethod: '',
     createRuleIndex: '',
     createRuleMatch: '',
@@ -346,6 +307,18 @@ export default {
       this.search()
     },
     search () {
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/argument', {
         params: {
           service: this.service,
@@ -368,7 +341,7 @@ export default {
         const matchCondition = `method=${this.updateRuleMethod} & arguments[${this.updateRuleIndex}]=${this.updateRuleMatch}`
         const filterCondition = ` => ${this.updateFilterCondition}`
         this.$axios.put('/traffic/argument', {
-          service: this.updateService,
+          service: this.tempService,
           rule: matchCondition + filterCondition,
           group: this.updateGroup,
           version: this.updateVersion
@@ -378,6 +351,9 @@ export default {
           }
         })
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -408,19 +384,27 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createService = ''
+      this.createRule = ''
     },
     confirmDelete () {
       console.log(this.deleteArguments)
       this.$axios.delete('/traffic/argument', {
-        service: this.deleteService,
-        group: this.deleteGroup,
-        version: this.deleteVersion
-      }).then((res) => {
+        params: {
+          service: this.deleteService,
+          group: this.deleteGroup,
+          version: this.deleteVersion
+        }
+      }
+      ).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteArguments = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -429,7 +413,12 @@ export default {
       this.deleteVersion = props.version
     },
     update (props) {
-      this.updateService = props.service
+      if (props.version && props.group) {
+        this.updateService = `${props.group}/${props.service}:${props.version}`
+      } else {
+        this.updateService = props.service
+      }
+      this.tempService = props.service
       var parts = props.rule.split(/(\w+)\[(\w+)\]=(\w+)/)
       this.updateRuleMethod = parts[1]
       this.updateRuleIndex = parts[2]
@@ -439,9 +428,14 @@ export default {
       this.updateDialog = true
     },
     save () {
-      // if (!this.createRuleMethod || !this.createRuleMatch || !this.createRuleIndex || !this.createFilterCondition) {
-      //  alert('请分别输入方法匹配条件和机器过滤条件')
-      // } else {
+      const matches = this.createService.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createService = matches[0]
+      } else {
+        this.createGroup = matches[1]
+        this.createService = matches[2]
+        this.createVersion = matches[3]
+      }
       const matchCondition = `method=${this.createRuleMethod} & arguments[${this.createRuleIndex}]=${this.createRuleMatch}`
       const filterCondition = ` => ${this.createFilterCondition}`
       this.$axios.post('/traffic/argument', {
@@ -454,8 +448,10 @@ export default {
           alert('操作成功')
         }
       })
-      // }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -468,6 +464,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Gray.vue b/dubbo-admin-ui/src/components/traffic/Gray.vue
index 75200c963..780b9c6f8 100644
--- a/dubbo-admin-ui/src/components/traffic/Gray.vue
+++ b/dubbo-admin-ui/src/components/traffic/Gray.vue
@@ -183,6 +183,7 @@
               <v-text-field
                 label="application"
                 hint="请输入 Provider 应用名"
+                disabled
                 v-model="updateGary.application"
               ></v-text-field>
             </v-flex>
@@ -323,7 +324,7 @@ export default {
     deleteVersion: '',
     deleteGroup: '',
     dialog: false,
-    selectedOption: [[]],
+    selectedOption: [['exact']],
     selectedUpdateOption: [[]],
     headers: [
     ],
@@ -389,7 +390,7 @@ export default {
           }
         ]
       }
-      this.selectedOption.push([])
+      this.selectedOption.push(['exact'])
       this.createGary.tags.push(temp)
     },
     addUpdateGary () {
@@ -425,6 +426,7 @@ export default {
         }
       }
       const index = parseInt(params)
+      this.selectedOption[index].push('exact')
       this.createGary.tags[index].match.push(temp)
     },
     addUpdateItem (params) {
@@ -467,12 +469,15 @@ export default {
     },
     saveUpdate () {
       this.updateDialog = false
-      this.$axios.put('/traffic/gray', this.upda).then((res) => {
+      this.$axios.put('/traffic/gray', this.updateGary).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -495,17 +500,45 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createGary = {
+        application: '',
+        tags: [
+          {
+            name: '',
+            match: [
+              {
+                key: '',
+                value: {
+                  empty: '',
+                  exact: '',
+                  noempty: '',
+                  prefix: '',
+                  regex: '',
+                  wildcard: ''
+                }
+              }
+            ]
+          }
+        ]
+      }
     },
     confirmDelete () {
-      console.log(this.deleteArguments)
-      this.$axios.delete('/traffic/mock', {
-        service: this.deleteService
-      }).then((res) => {
+      this.$axios.delete('/traffic/mock',
+        {
+          params: {
+            service: this.deleteService,
+            group: this.deleteGroup,
+            version: this.deleteVersion
+          }
+        }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteArguments = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -540,6 +573,9 @@ export default {
         }
       })
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -552,6 +588,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.application = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Mock.vue b/dubbo-admin-ui/src/components/traffic/Mock.vue
index a1d28875f..c9c48f436 100644
--- a/dubbo-admin-ui/src/components/traffic/Mock.vue
+++ b/dubbo-admin-ui/src/components/traffic/Mock.vue
@@ -28,25 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     flat
                     label="请输入服务名"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Version"
-                    :hint="$t('dataIdVersionHint')"
-                    v-model="group"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Group"
-                    :hint="$t('dataIdGroupHint')"
-                    v-model="version"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -101,27 +88,13 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="createService"
             ></v-text-field>
           </v-flex>
-          <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 style="margin-left: 10px;" xs6 sm3 md2>
-            <v-text-field
-              label="Version"
-              hint="$t('versionInputPrompt')"
-              v-model="createVersion"
-            ></v-text-field>
-          </v-flex>
         </v-layout>
         <v-layout wrap>
           <v-flex xs6 sm3 md6>
@@ -159,27 +132,14 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
+              disabled
               v-model="updateService"
             ></v-text-field>
           </v-flex>
-          <v-flex xs6 sm3 md2>
-           <v-text-field
-              label="Group"
-              hint="请输入服务版本group（可选）"
-              v-model="updateGroup"
-            ></v-text-field>
-           </v-flex>
-           <v-flex xs6 sm3 md2>
-            <v-text-field
-              label="Version"
-              hint="请输入服务分组version（可选）"
-              v-model="updateVersion"
-            ></v-text-field>
-           </v-flex>
         </v-layout>
         <v-layout wrap>
           <v-flex xs6 sm3 md6>
@@ -193,7 +153,7 @@
         </v-layout>
         <v-layout wrap>
           <v-flex xs6 sm3 md6>
-            <v-textarea v-model="createMock" label="请输入模拟的返回值"
+            <v-textarea v-model="updateMock" label="请输入模拟的返回值"
               hint="如 json 结构体或字符串，具体取决于方法签名的返回值。请通过上面的链接查看如何配置返回值。"  variant="outlined"></v-textarea>
           </v-flex>
         </v-layout>
@@ -257,6 +217,7 @@ export default {
     searchLoading: false,
     timerID: null,
     service: '',
+    searchService: '',
     mock: '',
     group: '',
     version: '',
@@ -266,7 +227,7 @@ export default {
     updateMock: '',
     updateGroup: '',
     updateVersion: '',
-    mockMethod: '',
+    mockMethod: '强制返回',
     deleteDialog: false,
     createService: '',
     createMock: '',
@@ -288,7 +249,18 @@ export default {
       this.search()
     },
     search () {
-      console.log('mock: force:return Mock Comment'.split(/:\s(.*?):(.*)/)[2].replace(/^return\s/, ''))
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/mock', {
         params: {
           service: this.service,
@@ -307,7 +279,7 @@ export default {
     saveUpdate () {
       this.updateDialog = false
       this.$axios.put('/traffic/mock', {
-        service: this.updateService,
+        service: this.tempService,
         mock: `${this.mockUpdateMethod === '失败时返回' ? `fail:return ${this.updateMock}` : `force:return ${this.updateMock}`}`,
         group: this.updateGroup,
         version: this.updateVersion
@@ -316,6 +288,9 @@ export default {
           alert('操作成功')
         }
       })
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -346,19 +321,28 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createService = ''
+      this.mockMethod = '强制返回'
+      this.createMock = ''
     },
     confirmDelete () {
       console.log(this.deleteMock)
-      this.$axios.delete('/traffic/mock', {
-        service: this.deleteService,
-        group: this.deleteGroup,
-        version: this.deleteVersion
-      }).then((res) => {
+      this.$axios.delete('/traffic/mock',
+        {
+          params: {
+            service: this.deleteService,
+            group: this.deleteGroup,
+            version: this.deleteVersion
+          }
+        }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteAccesslog = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -368,17 +352,28 @@ export default {
       this.deleteVersion = props.version
     },
     update (props) {
-      this.updateService = props.service
+      if (props.version && props.group) {
+        this.updateService = `${props.group}/${props.service}:${props.version}`
+      } else {
+        this.updateService = props.service
+      }
+      this.tempService = props.service
+      this.updateGroup = props.group
+      this.updateVersion = props.version
       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)
+      const matches = this.createService.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createService = matches[0]
+      } else {
+        this.createGroup = matches[1]
+        this.createService = matches[2]
+        this.createVersion = matches[3]
+      }
       this.$axios.post('/traffic/mock', {
         service: this.createService,
         mock: `${this.mockMethod === '失败时返回' ? `mock: fail:return ${this.createMock}` : `mock: force:return ${this.createMock}`}`,
@@ -390,6 +385,9 @@ export default {
         }
       })
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -402,6 +400,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Region.vue b/dubbo-admin-ui/src/components/traffic/Region.vue
index ea3cf0ae2..c37998bf8 100644
--- a/dubbo-admin-ui/src/components/traffic/Region.vue
+++ b/dubbo-admin-ui/src/components/traffic/Region.vue
@@ -28,25 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     flat
                     label="请输入服务名"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Version"
-                    :hint="$t('dataIdVersionHint')"
-                    v-model="version"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Group"
-                    :hint="$t('dataIdGroupHint')"
-                    v-model="group"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -101,27 +88,13 @@
       </v-layout>
       <v-card-text >
         <v-layout row wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="createService"
             ></v-text-field>
           </v-flex>
-          <v-flex style="margin-left: 10px;" xs6 sm3 md3>
-            <v-text-field
-              label="服务版本"
-              hint="请输入服务版本version（可选）"
-              v-model="createVersion"
-            ></v-text-field>
-          </v-flex>
-          <v-flex style="margin-left: 10px;" xs6 sm3 md3>
-            <v-text-field
-              label="服务组"
-              hint="请输入服务分组group（可选）"
-              v-model="createGroup"
-            ></v-text-field>
-          </v-flex>
         </v-layout>
         <v-layout row wrap>
           <v-switch label="开启或关闭同区域优先" v-model="handleRule"></v-switch>
@@ -155,27 +128,14 @@
        </v-layout>
       <v-card-text >
         <v-layout row wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
+              disabled
               v-model="updateService"
             ></v-text-field>
           </v-flex>
-          <v-flex style="margin-left: 10px;" xs6 sm3 md3>
-            <v-text-field
-              label="Group"
-              hint="请输入服务分组group（可选）"
-              v-model="updateGroup"
-        ></v-text-field>
-          </v-flex>
-          <v-flex style="margin-left: 10px;" xs6 sm3 md3>
-            <v-text-field
-              label="Version"
-              hint="请输入服务版本version（可选）"
-              v-model="updateVersion"
-        ></v-text-field>
-          </v-flex>
         </v-layout>
         <v-layout row wrap>
           <v-switch label="开启或关闭同区域优先" v-model="handleUpdateRule"></v-switch>
@@ -249,6 +209,7 @@ export default {
     searchLoading: false,
     timerID: null,
     service: '',
+    searchService: '',
     rule: '',
     group: '',
     version: '',
@@ -280,6 +241,18 @@ export default {
       this.search()
     },
     search () {
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/region', {
         params: {
           service: this.service,
@@ -298,7 +271,7 @@ export default {
       this.updateDialog = false
       if (this.handleUpdateRule) {
         this.$axios.put('/traffic/region', {
-          service: this.updateService,
+          service: this.tempService,
           rule: this.updateRule,
           group: this.updateGroup,
           version: this.updateVersion
@@ -319,6 +292,9 @@ export default {
           }
         })
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -349,19 +325,27 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createService = ''
+      this.handleRule = false
+      this.createRule = ''
     },
     confirmDelete () {
-      this.$axios.delete('/traffic/region', {
-        service: this.deleteService,
-        rule: this.deleteRule,
-        group: this.deleteGroup,
-        version: this.deleteVersion
-      }).then((res) => {
+      this.$axios.delete('/traffic/region',
+        {
+          params: {
+            service: this.deleteService,
+            group: this.deleteGroup,
+            version: this.deleteVersion
+          }
+        }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteRegion = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -371,7 +355,12 @@ export default {
       this.deleteVersion = props.version
     },
     update (props) {
-      this.updateService = props.service
+      if (props.version && props.group) {
+        this.updateService = `${props.group}/${props.service}:${props.version}`
+      } else {
+        this.updateService = props.service
+      }
+      this.tempService = props.service
       if (props.rule === 'false') {
         this.handleUpdateRule = false
         this.updateRule = ''
@@ -384,6 +373,14 @@ export default {
       this.updateDialog = true
     },
     save () {
+      const matches = this.createService.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createService = matches[0]
+      } else {
+        this.createGroup = matches[1]
+        this.createService = matches[2]
+        this.createVersion = matches[3]
+      }
       if (this.handleRule) {
         this.$axios.post('/traffic/region', {
           service: this.createService,
@@ -399,6 +396,9 @@ export default {
         alert('同区域优先未开启，请选中开关后再保存！')
       }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -411,6 +411,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Retry.vue b/dubbo-admin-ui/src/components/traffic/Retry.vue
index 00c007cd1..436095d6d 100644
--- a/dubbo-admin-ui/src/components/traffic/Retry.vue
+++ b/dubbo-admin-ui/src/components/traffic/Retry.vue
@@ -28,25 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     flat
                     label="请输入服务名"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Version"
-                    :hint="$t('dataIdVersionHint')"
-                    v-model="group"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Group"
-                    :hint="$t('dataIdGroupHint')"
-                    v-model="version"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -101,27 +88,13 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="createService"
             ></v-text-field>
           </v-flex>
-          <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 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-layout wrap>
           <v-flex style="margin-left: 10px;" xs6 sm3 md3>
@@ -153,27 +126,14 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md3>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
+              disabled
               v-model="updateService"
             ></v-text-field>
           </v-flex>
-          <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 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-layout wrap>
           <v-flex style="margin-left: 10px;" xs6 sm3 md2>
@@ -247,6 +207,7 @@ export default {
     retry: '',
     group: '',
     version: '',
+    searchService: '',
     createGroup: '',
     createVersion: '',
     updateService: '',
@@ -273,6 +234,18 @@ export default {
       this.search()
     },
     search () {
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/retry', {
         params: {
           service: this.service,
@@ -291,7 +264,7 @@ export default {
       this.updateDialog = false
       if (this.updateRetry) {
         this.$axios.put('/traffic/retry', {
-          service: this.updateService,
+          service: this.tempService,
           retry: parseInt(this.updateRetry),
           group: this.updateGroup,
           version: this.updateVersion
@@ -299,11 +272,13 @@ export default {
           if (res) {
             alert('操作成功')
           }
-          this.search()
         })
       } else {
         alert('请输入重试值')
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -334,18 +309,25 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createService = ''
+      this.createRetry = ''
     },
     confirmDelete () {
       this.$axios.delete('/traffic/retry', {
-        service: this.deleteService,
-        group: this.deleteGroup,
-        version: this.deleteVersion
+        params: {
+          service: this.deleteService,
+          group: this.deleteGroup,
+          version: this.deleteVersion
+        }
       }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteRetry = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -355,13 +337,26 @@ export default {
       this.deleteVersion = props.version
     },
     update (props) {
-      this.updateService = props.service
+      if (props.version && props.group) {
+        this.updateService = `${props.group}/${props.service}:${props.version}`
+      } else {
+        this.updateService = props.service
+      }
+      this.tempService = props.service
       this.updateRetry = props.retry
       this.updateGroup = props.group
       this.updateVersion = props.version
       this.updateDialog = true
     },
     save () {
+      const matches = this.createService.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createService = matches[0]
+      } else {
+        this.createGroup = matches[1]
+        this.createService = matches[2]
+        this.createVersion = matches[3]
+      }
       if (this.createRetry) {
         this.$axios.post('/traffic/retry', {
           service: this.createService,
@@ -377,6 +372,9 @@ export default {
         alert('请输入重试值')
       }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -389,6 +387,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Timeout.vue b/dubbo-admin-ui/src/components/traffic/Timeout.vue
index 29de587ad..c77b429b1 100644
--- a/dubbo-admin-ui/src/components/traffic/Timeout.vue
+++ b/dubbo-admin-ui/src/components/traffic/Timeout.vue
@@ -28,25 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     flat
                     label="请输入服务名"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Version"
-                    :hint="$t('dataIdVersionHint')"
-                    v-model="group"
-                  ></v-text-field>
-                </v-flex>
-                <v-flex xs6 sm3 md2 >
-                  <v-text-field
-                    label="Group"
-                    :hint="$t('dataIdGroupHint')"
-                    v-model="version"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -101,27 +88,13 @@
       </v-layout>
       <v-card-text >
         <v-layout row wrap>
-          <v-flex xs6 sm3 md2>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="createService"
             ></v-text-field>
           </v-flex>
-          <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 style="margin-left: 10px;" xs6 sm3 md2>
-            <v-text-field
-              label="服务版本"
-              hint="请输入服务version(可选)"
-              v-model="createVersion"
-            ></v-text-field>
-           </v-flex>
         </v-layout>
         <v-layout row wrap>
           <v-flex style="margin-left: 10px;" xs6 sm3 md2>
@@ -153,25 +126,12 @@
       </v-layout>
       <v-card-text >
         <v-layout wrap>
-          <v-flex xs6 sm3 md2>
+          <v-flex xs6 sm3 md9>
             <v-text-field
               label="服务名"
-              hint="请输入服务名"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               v-model="updateService"
-            ></v-text-field>
-          </v-flex>
-          <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 style="margin-left: 10px;" xs6 sm3 md2>
-            <v-text-field
-              label="服务版本"
-              hint="请输入服务version(可选)"
-              v-model="updateVersion"
+              disabled
             ></v-text-field>
           </v-flex>
          </v-layout>
@@ -248,6 +208,7 @@ export default {
     timeout: null,
     group: '',
     version: '',
+    searchService: '',
     createGroup: '',
     createVersion: '',
     updateService: '',
@@ -274,6 +235,18 @@ export default {
       this.search()
     },
     search () {
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/timeout', {
         params: {
           service: this.service,
@@ -292,7 +265,7 @@ export default {
       this.updateDialog = false
       if (this.updateTimeout) {
         this.$axios.put('/traffic/timeout', {
-          service: this.updateService,
+          service: this.tempService,
           timeout: parseInt(this.updateTimeout),
           group: this.updateGroup,
           version: this.updateVersion
@@ -304,6 +277,9 @@ export default {
       } else {
         alert('请输入超时时间')
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -334,19 +310,27 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createService = ''
+      this.createTimeout = ''
     },
     confirmDelete () {
       console.log(this.deleteTimeout)
-      this.$axios.delete('/traffic/timeout', {
-        service: this.deleteService,
-        group: this.deleteGroup,
-        version: this.deleteVersion
-      }).then((res) => {
+      this.$axios.delete('/traffic/timeout',
+        {
+          params: {
+            service: this.deleteService,
+            group: this.deleteGroup,
+            version: this.deleteVersion
+          }
+        }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteTimeout = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
       this.deleteDialog = true
@@ -356,13 +340,26 @@ export default {
       this.deleteVersion = props.version
     },
     update (props) {
-      this.updateService = props.service
+      if (props.version && props.group) {
+        this.updateService = `${props.group}/${props.service}:${props.version}`
+      } else {
+        this.updateService = props.service
+      }
+      this.tempService = props.service
       this.updateTimeout = props.timeout
       this.updateGroup = props.group
       this.updateVersion = props.version
       this.updateDialog = true
     },
     save () {
+      const matches = this.createService.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createService = matches[0]
+      } else {
+        this.createGroup = matches[1]
+        this.createService = matches[2]
+        this.createVersion = matches[3]
+      }
       if (this.createTimeout) {
         this.$axios.post('/traffic/timeout', {
           service: this.createService,
@@ -378,6 +375,9 @@ export default {
         alert('请输入超时时间')
       }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -390,6 +390,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/components/traffic/Weight.vue b/dubbo-admin-ui/src/components/traffic/Weight.vue
index c779ac7d7..b93542477 100644
--- a/dubbo-admin-ui/src/components/traffic/Weight.vue
+++ b/dubbo-admin-ui/src/components/traffic/Weight.vue
@@ -28,28 +28,12 @@
           <v-card-text>
             <v-form>
               <v-layout row wrap>
-                <v-flex xs6 sm3 md3>
+                <v-flex xs6 sm3 md9>
                   <v-text-field
-                    v-model="service"
+                    v-model="searchService"
                     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="请输入应用名"
+                    hint="请输入service,如有group和version，请按照group/service:version格式输入"
                   ></v-text-field>
                 </v-flex>
                 <v-btn @click="submit" color="primary" large>{{$t('search')}}</v-btn>
@@ -69,6 +53,7 @@
             <template slot="items" slot-scope="props">
               <td >{{props.item.service}}</td>
               <td>{{props.item.weight}}</td>
+              <td>{{props.item.matchRule}}</td>
               <td class="text-xs-center px-0" nowrap>
                 <!-- <v-btn
                   class="tiny"
@@ -109,27 +94,13 @@
       <v-card>
         <v-card-text>
           <v-layout row warp>
-            <v-flex xs6 sm3 md3>
+            <v-flex xs6 sm3 md9>
             <v-text-field
               label="service"
-              hint="请输入service"
+              hint="请输入service,如有group和version，请按照group/service:version格式输入"
               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
@@ -211,27 +182,13 @@
       <v-card>
         <v-card-text>
           <v-layout row warp>
-            <v-flex xs6 sm3 md3>
+            <v-flex xs6 sm3 md9>
               <v-text-field
                 label="service"
-                hint="请输入service"
+                disabled
                 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;"
@@ -322,7 +279,7 @@
         <v-btn
           color="green darken-1"
           text
-          @click="confirmDelete"
+          @click="confirmDelete()"
         >
         确定
         </v-btn>
@@ -352,6 +309,7 @@ export default {
     input: null,
     searchLoading: false,
     timerID: null,
+    searchService: '',
     service: '',
     weight: '',
     mock: '',
@@ -504,6 +462,18 @@ export default {
       this.updateWeight.weights[index].match.param.push(temp)
     },
     search () {
+      if (this.searchService === '*') {
+        this.service = '*'
+      } else {
+        const matches = this.searchService.split(/^(.*?)\/(.*?):(.*)$/)
+        if (matches.length === 1) {
+          this.service = matches[0]
+        } else {
+          this.group = matches[1]
+          this.service = matches[2]
+          this.version = matches[3]
+        }
+      }
       this.$axios.get('/traffic/weight', {
         params: {
           service: this.service,
@@ -512,35 +482,58 @@ export default {
         }
       }).then(response => {
         this.tableData = []
-        console.log(response)
         response.data.forEach(element => {
           let sum = 0
+          let matchRule = ''
           element.weights.forEach(item => {
             sum += item.weight
+            const matchParams = [] // 用于存储参数的数组
+            item.match.param.forEach(it => {
+              let param = `${it.key}-`
+              if (it.value.empty !== '') {
+                param += 'empty-' + it.value.empty
+              } else if (it.value.exact !== '') {
+                param += 'exact-' + it.value.exact
+              } else if (it.value.noempty !== '') {
+                param += 'noempty-' + it.value.noempty
+              } else if (it.value.prefix !== '') {
+                param += 'prefix-' + it.value.prefix
+              } else if (it.value.regex !== '') {
+                param += 'regex-' + it.value.regex
+              } else if (it.value.wildcard !== '') {
+                param += 'wildcard-' + it.value.wildcard
+              }
+              matchParams.push(param) // 将参数添加到数组中
+            })
+            matchRule += (matchParams.length > 0) ? (matchParams.join(',') + ',') : ''
           })
+          matchRule = matchRule.slice(0, -1)
           const weight = sum / element.weights.length
           const result = {
             service: element.service,
             weight,
+            matchRule,
             element
           }
           this.tableData.push(result)
         })
-        console.log(this.tableData)
       })
     },
     saveUpdate () {
       this.updateDialog = false
+      this.updateWeight.service = this.tempService
       if (this.updateWeight) {
         this.$axios.put('/traffic/weight', this.updateWeight).then((res) => {
           if (res) {
             alert('操作成功')
           }
         })
-        this.search()
       } else {
         alert('请输入权重值')
       }
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     setHeaders: function () {
       this.headers = [
@@ -552,6 +545,10 @@ export default {
           text: '权重',
           value: 'weight'
         },
+        {
+          text: '匹配条件',
+          value: 'matchRule'
+        },
         {
           text: '操作',
           value: 'version'
@@ -563,21 +560,52 @@ export default {
     },
     create () {
       this.dialog = true
+      this.createWeight = {
+        service: '',
+        group: '',
+        version: '',
+        weights: [
+          {
+            weight: '',
+            match: {
+              param: [
+                {
+                  key: '',
+                  value: {
+                    empty: '',
+                    exact: '',
+                    noempty: '',
+                    prefix: '',
+                    regex: '',
+                    wildcard: ''
+                  }
+                }
+              ]
+            }
+          }
+        ]
+      }
     },
     confirmDelete () {
-      console.log(this.deleteArguments)
+      console.log(this.deleteService)
       this.$axios.delete('/traffic/mock', {
-        service: this.deleteService,
-        group: this.deleteGroup,
-        version: this.deleteVersion
+        params: {
+          service: this.deleteService,
+          group: this.deleteGroup,
+          version: this.deleteVersion
+        }
       }).then((res) => {
         if (res) {
           alert('操作成功')
         }
       })
-      this.deleteArguments = false
+      this.deleteDialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     deleteItem (props) {
+      console.log(props)
       this.deleteDialog = true
       this.deleteService = props.element.service
       this.deleteGroup = props.element.group
@@ -585,10 +613,13 @@ export default {
     },
     update (props) {
       this.updateWeight = props.element
+      this.tempService = this.updateWeight.service
+      if (this.updateWeight.group && this.updateWeight.version) {
+        this.updateWeight.service = `${this.updateWeight.group}/${this.updateWeight.service}:${this.updateWeight.version}`
+      }
       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 !== '') {
@@ -607,6 +638,14 @@ export default {
       this.updateDialog = true
     },
     save () {
+      const matches = this.createWeight.service.split(/^(.*?)\/(.*?):(.*)$/)
+      if (matches.length === 1) {
+        this.createWeight.service = matches[0]
+      } else {
+        this.createWeight.group = matches[1]
+        this.createWeight.service = matches[2]
+        this.createWeight.version = matches[3]
+      }
       if (this.createWeight) {
         this.$axios.post('/traffic/weight', this.createWeight).then((res) => {
           if (res) {
@@ -617,6 +656,9 @@ export default {
         alert('请输入权重值')
       }
       this.dialog = false
+      setTimeout(() => {
+        this.search()
+      }, 1000)
     },
     closeDialog () {
       this.dialog = false
@@ -629,6 +671,8 @@ export default {
   },
   mounted () {
     this.setHeaders()
+    this.searchService = '*'
+    this.search()
   }
 }
 
diff --git a/dubbo-admin-ui/src/router/index.js b/dubbo-admin-ui/src/router/index.js
index 8ce7a1e38..b5fdbf255 100644
--- a/dubbo-admin-ui/src/router/index.js
+++ b/dubbo-admin-ui/src/router/index.js
@@ -76,12 +76,15 @@ export default new Router({
           component: TestMethod
         },
         {
-          path: '/governance/routingRule',
+          path: '/traffic/routingRule',
           name: 'RoutingRule',
-          component: RoutingRule
+          component: RoutingRule,
+          meta: {
+            requireLogin: false
+          }
         },
         {
-          path: '/governance/tagRule',
+          path: '/traffic/tagRule',
           name: 'TagRule',
           component: TagRule
         },
@@ -106,7 +109,7 @@ export default new Router({
         //   component: WeightAdjust
         // },
         {
-          path: '/governance/config',
+          path: '/traffic/config',
           name: 'Overrides',
           component: Overrides
         },
diff --git a/dubbo-admin-ui/src/util/index.js b/dubbo-admin-ui/src/util/index.js
index 9df3cbfd7..8e18fd922 100644
--- a/dubbo-admin-ui/src/util/index.js
+++ b/dubbo-admin-ui/src/util/index.js
@@ -1,3 +1,4 @@
+/* eslint-disable no-prototype-builtins */
 /*
  * Licensed to the Apache Software Foundation (ASF) under one or more
  * contributor license agreements.  See the NOTICE file distributed with