You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dubbo.apache.org by mi...@apache.org on 2019/02/12 08:25:13 UTC

[incubator-dubbo-ops] branch develop updated: customize button style and size #295

This is an automated email from the ASF dual-hosted git repository.

min pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/incubator-dubbo-ops.git


The following commit(s) were added to refs/heads/develop by this push:
     new da4441f  customize button style and size #295
da4441f is described below

commit da4441f5d445f4372d410c75fbeca109aa6c1e97
Author: nzomkxia <z8...@gmail.com>
AuthorDate: Tue Feb 12 16:25:01 2019 +0800

    customize button style and size #295
---
 dubbo-admin-ui/src/components/ServiceDetail.vue | 44 ++++++++++++++++++-------
 dubbo-admin-ui/src/components/ServiceSearch.vue | 31 +++++++++++------
 dubbo-admin-ui/src/lang/en.js                   |  2 ++
 dubbo-admin-ui/src/lang/zh.js                   |  2 ++
 4 files changed, 57 insertions(+), 22 deletions(-)

diff --git a/dubbo-admin-ui/src/components/ServiceDetail.vue b/dubbo-admin-ui/src/components/ServiceDetail.vue
index f4241b3..94d7ff6 100644
--- a/dubbo-admin-ui/src/components/ServiceDetail.vue
+++ b/dubbo-admin-ui/src/components/ServiceDetail.vue
@@ -56,17 +56,21 @@
                 <td>{{getPort(props.item.address)}}</td>
                 <td></td>
                 <td></td>
-                <td><v-tooltip top>
-                  <v-btn
-                          small
-                          slot="activator"
-                          color="primary"
-                          @click="toCopyText(props.item.url)"
-                  >
-                    {{$t('copyUrl')}}
-                  </v-btn>
-                  <span>{{props.item.url}}</span>
-                </v-tooltip></td>
+                <td>
+                  <v-tooltip top>
+                    <v-btn
+                      class="tiny"
+                      slot="activator"
+                      color="primary"
+                      @mouseover="setHoverHint"
+                      @mouseout="setoutHint"
+                      @click="toCopyText(props.item.url)"
+                    >
+                        {{$t(hint)}}
+                    </v-btn>
+                    <span>{{props.item.url}}</span>
+                  </v-tooltip>
+                </td>
               </template>
             </v-data-table>
           </v-tab-item>
@@ -121,7 +125,8 @@
       providerDetails: [],
       consumerDetails: [],
       methodMetaData: [],
-      basic: []
+      basic: [],
+      hint: 'url'
     }),
     methods: {
       setmetaHeaders: function () {
@@ -143,6 +148,13 @@
           }
         ]
       },
+      setHoverHint: function () {
+        this.hint = 'copy'
+      },
+
+      setoutHint: function () {
+        this.hint = 'url'
+      },
       setdetailHeaders: function () {
         this.detailHeaders = {
           providers: [
@@ -261,3 +273,11 @@
   }
 </script>
 
+<style scoped>
+  .tiny {
+    min-width: 30px;
+    height: 20px;
+    font-size: 8px;
+  }
+</style>
+
diff --git a/dubbo-admin-ui/src/components/ServiceSearch.vue b/dubbo-admin-ui/src/components/ServiceSearch.vue
index 1f7706a..dded4cd 100644
--- a/dubbo-admin-ui/src/components/ServiceSearch.vue
+++ b/dubbo-admin-ui/src/components/ServiceSearch.vue
@@ -81,29 +81,30 @@
                 <td>{{props.item.appName}}</td>
                 <td class="text-xs-center px-0" nowrap>
                   <v-btn
-                    small
-                    color='primary'
-                    @click="toTestService(props.item)"
+                    class="tiny"
+                    color='success'
+                    :href='getHref(props.item.service, props.item.appName, props.item.group, props.item.version)'
                   >
-                    {{$t('test')}}
+                   {{ $t('detail') }}
                   </v-btn>
                   <v-btn
                     small
-                    color='primary'
-                    :href='getHref(props.item.service, props.item.appName, props.item.group, props.item.version)'
+                    class="tiny"
+                    outline
+                    @click="toTestService(props.item)"
                   >
-                   {{ $t('detail') }}
+                    {{$t('test')}}
                   </v-btn>
                   <v-menu
                   >
                     <v-btn
                       slot="activator"
-                      color="primary"
+                      class="tiny"
+                      outline
                       small
-                      dark
                     >
                       {{ $t('more') }}
-                      <v-icon>expand_more</v-icon>
+                      <v-icon class="tiny-icon" >arrow_drop_down</v-icon>
                     </v-btn>
                     <v-list>
                       <v-list-tile
@@ -331,5 +332,15 @@
     word-break: break-all;
   }
 
+  .tiny {
+    min-width: 30px;
+    height: 20px;
+    font-size: 8px;
+  }
+
+  .tiny-icon {
+    font-size: 18px;
+  }
+
 </style>
 
diff --git a/dubbo-admin-ui/src/lang/en.js b/dubbo-admin-ui/src/lang/en.js
index 4542d47..85820e8 100644
--- a/dubbo-admin-ui/src/lang/en.js
+++ b/dubbo-admin-ui/src/lang/en.js
@@ -132,6 +132,8 @@ export default {
   detail: 'Detail',
   more: 'More',
   copyUrl: 'Copy URL',
+  copy: 'Copy',
+  url: 'URL',
   copySuccessfully: 'Copied',
   test: 'Test',
   placeholders: {
diff --git a/dubbo-admin-ui/src/lang/zh.js b/dubbo-admin-ui/src/lang/zh.js
index 3467028..3b7a4d6 100644
--- a/dubbo-admin-ui/src/lang/zh.js
+++ b/dubbo-admin-ui/src/lang/zh.js
@@ -132,6 +132,8 @@ export default {
   detail: '详情',
   more: '更多',
   copyUrl: '复制 URL',
+  copy: '复制',
+  url: 'URL',
   copySuccessfully: '已复制',
   test: '测试',
   placeholders: {