From d46c0ed01c27ceec8ce854446814993b0bc4cbed Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=A8=E5=A5=95?=
 <Leopoldthecoder@users.noreply.github.com>
Date: Fri, 9 Feb 2018 12:31:24 +0800
Subject: [PATCH] Transfer: add clearQuery (#9753)

---
 examples/docs/en-US/transfer.md        |  5 +++++
 examples/docs/es/transfer.md           |  5 +++++
 examples/docs/zh-CN/transfer.md        |  5 +++++
 packages/theme-chalk/src/transfer.scss |  1 +
 packages/transfer/src/main.vue         | 10 ++++++++++
 5 files changed, 26 insertions(+)

diff --git a/examples/docs/en-US/transfer.md b/examples/docs/en-US/transfer.md
index be22b6330..19397f41c 100644
--- a/examples/docs/en-US/transfer.md
+++ b/examples/docs/en-US/transfer.md
@@ -278,6 +278,11 @@ By default, Transfer looks for `key`, `label` and `disabled` in a data item. If
 | left-footer | content of left list footer |
 | right-footer | content of right list footer |
 
+### Methods
+| Method | Description | Parameters |
+| ---- | ---- | ---- |
+| clearQuery | clear the filter keyword of a certain panel | 'left' / 'right' |
+
 ### Events
 | Event Name | Description | Parameters |
 |---------- |-------- |---------- |
diff --git a/examples/docs/es/transfer.md b/examples/docs/es/transfer.md
index ca569283b..f75259da6 100644
--- a/examples/docs/es/transfer.md
+++ b/examples/docs/es/transfer.md
@@ -279,6 +279,11 @@ Por defecto Transfer busca los atributos `key`, `label`, y `disabled` en cada el
 | left-footer  | Contenido del footer de la lista de la izquierda |
 | right-footer | Contenido del footer de la lista de la derecha |
 
+### Methods
+| Method | Description | Parameters |
+| ---- | ---- | ---- |
+| clearQuery | clear the filter keyword of a certain panel | 'left' / 'right' |
+
 ### Eventos
 | Nombre | Descripcion                              | Parametros                               |
 | ------ | ---------------------------------------- | ---------------------------------------- |
diff --git a/examples/docs/zh-CN/transfer.md b/examples/docs/zh-CN/transfer.md
index a37456099..9314974c2 100644
--- a/examples/docs/zh-CN/transfer.md
+++ b/examples/docs/zh-CN/transfer.md
@@ -275,6 +275,11 @@
 | left-footer | 左侧列表底部的内容 |
 | right-footer | 右侧列表底部的内容 |
 
+### Methods
+| 方法名 | 说明 | 参数 |
+| ---- | ---- | ---- |
+| clearQuery | 清空某个面板的搜索关键词 | 'left' / 'right'，指定需要清空的面板 |
+
 ### Events
 | 事件名称      | 说明    | 回调参数      |
 |---------- |-------- |---------- |
diff --git a/packages/theme-chalk/src/transfer.scss b/packages/theme-chalk/src/transfer.scss
index 4307de7e2..e231fd054 100644
--- a/packages/theme-chalk/src/transfer.scss
+++ b/packages/theme-chalk/src/transfer.scss
@@ -207,6 +207,7 @@
     line-height: $--transfer-item-height;
     padding: 6px 15px 0;
     color: $--color-text-secondary;
+    text-align: center;
   }
 
   .el-checkbox__label {
diff --git a/packages/transfer/src/main.vue b/packages/transfer/src/main.vue
index 1839a5ee9..5e9d28f10 100644
--- a/packages/transfer/src/main.vue
+++ b/packages/transfer/src/main.vue
@@ -2,6 +2,7 @@
   <div class="el-transfer">
     <transfer-panel
       v-bind="$props"
+      ref="leftPanel"
       :data="sourceData"
       :title="titles[0] || t('el.transfer.titles.0')"
       :default-checked="leftDefaultChecked"
@@ -29,6 +30,7 @@
     </div>
     <transfer-panel
       v-bind="$props"
+      ref="rightPanel"
       :data="targetData"
       :title="titles[1] || t('el.transfer.titles.1')"
       :default-checked="rightDefaultChecked"
@@ -183,6 +185,14 @@
         });
         this.$emit('input', currentValue);
         this.$emit('change', currentValue, 'right', this.leftChecked);
+      },
+
+      clearQuery(which) {
+        if (which === 'left') {
+          this.$refs.leftPanel.query = '';
+        } else if (which === 'right') {
+          this.$refs.rightPanel.query = '';
+        }
       }
     }
   };