From 14a079815ca856d8a08e1931ec548ea6304ddeea Mon Sep 17 00:00:00 2001
From: qishibo <www.qii@qq.com>
Date: Wed, 13 Mar 2019 16:27:21 +0800
Subject: [PATCH] key list overflow

---
 src/components/Connections.vue | 8 ++++++--
 src/i18n/langs/cn.js           | 1 +
 src/i18n/langs/en.js           | 1 +
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/Connections.vue b/src/components/Connections.vue
index 28d48fa..3bac245 100644
--- a/src/components/Connections.vue
+++ b/src/components/Connections.vue
@@ -28,14 +28,15 @@
 
           <!-- search match -->
           <el-form-item class="search-input">
-            <el-input v-model="searchMatch[getConnectionPoolKey(item)]" @keyup.enter.native="changeMatchMode(getConnectionPoolKey(item))" placeholder="Enter To Search" size="mini">
+            <el-input v-model="searchMatch[getConnectionPoolKey(item)]" @keyup.enter.native="changeMatchMode(getConnectionPoolKey(item))" :placeholder="$t('message.enter_to_search')" size="mini">
               <i slot="suffix" class="el-input__icon" :class="searchIcon" @click="changeMatchMode(getConnectionPoolKey(item))"></i>
             </el-input>
           </el-form-item>
         </el-form>
 
+        <!-- key list -->
         <ul class="key-list">
-          <li class="key-item" v-for="key of keyList[getConnectionPoolKey(item)]" @click="clickKey(key, getConnectionPoolKey(item))">{{key}}</li>
+          <li class="key-item" :title="key" v-for="key of keyList[getConnectionPoolKey(item)]" @click="clickKey(key, getConnectionPoolKey(item))">{{key}}</li>
         </ul>
 
         <!-- page -->
@@ -521,10 +522,13 @@ export default {
   }
   .connection-menu .key-list .key-item {
     white-space:nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
     cursor: pointer;
     color: #3c5765;
     font-size: 82%;
     line-height: 1.6;
+    margin-right: 3px;
   }
   .connection-menu .key-list .key-item:hover {
     color: #409EFF;
diff --git a/src/i18n/langs/cn.js b/src/i18n/langs/cn.js
index 97ccba8..4288e44 100644
--- a/src/i18n/langs/cn.js
+++ b/src/i18n/langs/cn.js
@@ -47,6 +47,7 @@ const cn = {
     enter_new_key: '请先输入新的key名称',
     key_type: '类型',
     save: '保存',
+    enter_to_search: '按下 Enter 键进行搜索',
   },
 };
 
diff --git a/src/i18n/langs/en.js b/src/i18n/langs/en.js
index 9e5455a..bb32c79 100644
--- a/src/i18n/langs/en.js
+++ b/src/i18n/langs/en.js
@@ -47,6 +47,7 @@ const en = {
     enter_new_key: 'Enter Your New Key Name First',
     key_type: 'Key Type',
     save: 'Save',
+    enter_to_search: 'Enter To Search',
   },
 };