@mdsfe/mds-ui 0.3.0-2 → 0.3.0-20

package/dist/transfer.js

@@ -7,7 +7,7 @@
 		var a = typeof exports === 'object' ? factory(require("./icon"), require("./_mixin/locale"), require("./button"), require("./input"), require("./_util/util"), require("./checkbox")) : factory(root["./icon"], root["./_mixin/locale"], root["./button"], root["./input"], root["./_util/util"], root["./checkbox"]);
 		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
 	}
-})(window, function(__WEBPACK_EXTERNAL_MODULE__7__, __WEBPACK_EXTERNAL_MODULE__10__, __WEBPACK_EXTERNAL_MODULE__14__, __WEBPACK_EXTERNAL_MODULE__17__, __WEBPACK_EXTERNAL_MODULE__21__, __WEBPACK_EXTERNAL_MODULE__35__) {
+})(window, function(__WEBPACK_EXTERNAL_MODULE__7__, __WEBPACK_EXTERNAL_MODULE__9__, __WEBPACK_EXTERNAL_MODULE__13__, __WEBPACK_EXTERNAL_MODULE__17__, __WEBPACK_EXTERNAL_MODULE__22__, __WEBPACK_EXTERNAL_MODULE__28__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -91,7 +91,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 115);
+/******/ 	return __webpack_require__(__webpack_require__.s = 100);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -203,14 +203,7 @@ function normalizeComponent (
 
 /***/ }),
 
-/***/ 10:
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE__10__;
-
-/***/ }),
-
-/***/ 115:
+/***/ 100:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -223,9 +216,13 @@ var style = __webpack_require__(247);
 // EXTERNAL MODULE: ./components/transfer/style/panel.less
 var panel = __webpack_require__(249);
 
+// EXTERNAL MODULE: ./components/transfer/style/extra.less
+var extra = __webpack_require__(251);
+
 // CONCATENATED MODULE: ./components/transfer/style/index.js
 
 
+
 // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transfer.vue?vue&type=template&id=45345264&lang=html&
 var render = function () {
   var _vm = this
@@ -377,7 +374,7 @@ var transferPanelvue_type_template_id_32ae9a30_render = function () {
                   },
                   [
                     _c("mds-icon", {
-                      attrs: { slot: "prefix", type: "line-calendar" },
+                      attrs: { slot: "prefix", type: "line-search" },
                       slot: "prefix",
                     }),
                   ],
@@ -472,13 +469,13 @@ var external_icon_ = __webpack_require__(7);
 var external_icon_default = /*#__PURE__*/__webpack_require__.n(external_icon_);
 
 // EXTERNAL MODULE: external "./checkbox"
-var external_checkbox_ = __webpack_require__(35);
+var external_checkbox_ = __webpack_require__(28);
 
 // EXTERNAL MODULE: external "./_util/util"
-var util_ = __webpack_require__(21);
+var util_ = __webpack_require__(22);
 
 // EXTERNAL MODULE: external "./_mixin/locale"
-var locale_ = __webpack_require__(10);
+var locale_ = __webpack_require__(9);
 var locale_default = /*#__PURE__*/__webpack_require__.n(locale_);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transferPanel.vue?vue&type=script&lang=js&
@@ -722,7 +719,7 @@ if (false) { var api; }
 component.options.__file = "components/transfer/transferPanel.vue"
 /* harmony default export */ var transferPanel = (component.exports);
 // EXTERNAL MODULE: external "./button"
-var external_button_ = __webpack_require__(14);
+var external_button_ = __webpack_require__(13);
 var external_button_default = /*#__PURE__*/__webpack_require__.n(external_button_);
 
 // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transfer.vue?vue&type=script&lang=js&
@@ -930,22 +927,958 @@ var transfer_component = Object(componentNormalizer["a" /* default */])(
 if (false) { var transfer_api; }
 transfer_component.options.__file = "components/transfer/transfer.vue"
 /* harmony default export */ var transfer = (transfer_component.exports);
+// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transferExtra.vue?vue&type=template&id=7bf23e3c&
+var transferExtravue_type_template_id_7bf23e3c_render = function () {
+  var _vm = this
+  var _h = _vm.$createElement
+  var _c = _vm._self._c || _h
+  return _c(
+    "div",
+    { staticClass: "mds-transfer-extra", style: { height: _vm.height + "px" } },
+    [
+      _c(
+        "div",
+        {
+          staticClass: "mds-transfer-extra-left",
+          style: { height: _vm.height + "px" },
+        },
+        [
+          _c(
+            "div",
+            {
+              staticClass:
+                "mds-transfer-extra-card mds-transfer-extra-left-card",
+            },
+            [
+              _c(
+                "div",
+                { staticClass: "mds-transfer-extra-header" },
+                [
+                  _c(
+                    "mds-checkbox",
+                    {
+                      attrs: {
+                        checked: _vm.leftCheckAll,
+                        indeterminate: _vm.leftIndeterminate,
+                      },
+                      on: { change: _vm.toggleLeftCheckAll },
+                    },
+                    [_vm._v(_vm._s(_vm.leftTitle))]
+                  ),
+                  _c("span", { staticClass: "mds-transfer-extra-count" }, [
+                    _vm._v(
+                      "\n          " +
+                        _vm._s(_vm.leftSelected.length) +
+                        "/" +
+                        _vm._s(_vm.filteredLeftList.length) +
+                        "\n        "
+                    ),
+                  ]),
+                ],
+                1
+              ),
+              _vm.filterable
+                ? _c(
+                    "div",
+                    { staticClass: "mds-transfer-extra-search" },
+                    [
+                      _c(
+                        "mds-input",
+                        {
+                          attrs: {
+                            placeholder: _vm.filterPlaceholder,
+                            clearable: "",
+                            size: "small",
+                          },
+                          model: {
+                            value: _vm.leftSearch,
+                            callback: function ($$v) {
+                              _vm.leftSearch = $$v
+                            },
+                            expression: "leftSearch",
+                          },
+                        },
+                        [
+                          _c("mds-icon", {
+                            attrs: { slot: "prefix", type: "line-search" },
+                            slot: "prefix",
+                          }),
+                        ],
+                        1
+                      ),
+                    ],
+                    1
+                  )
+                : _vm._e(),
+              _c(
+                "div",
+                {
+                  class:
+                    _vm.prefixCls +
+                    "extra-scroll " +
+                    _vm.prefixCls +
+                    "panel-body",
+                },
+                [
+                  _c(
+                    "mds-checkbox-group",
+                    {
+                      staticClass: "checkbox-group-vertical",
+                      model: {
+                        value: _vm.leftSelected,
+                        callback: function ($$v) {
+                          _vm.leftSelected = $$v
+                        },
+                        expression: "leftSelected",
+                      },
+                    },
+                    _vm._l(_vm.filteredLeftList, function (item) {
+                      return _c(
+                        "mds-checkbox",
+                        {
+                          key: item.key,
+                          attrs: { value: item.key, disabled: item.disabled },
+                        },
+                        [
+                          _vm.$scopedSlots.default
+                            ? [_vm._t("default", null, { option: item })]
+                            : [
+                                _vm._v(
+                                  "\n              " +
+                                    _vm._s(item.label) +
+                                    "\n            "
+                                ),
+                              ],
+                        ],
+                        2
+                      )
+                    }),
+                    1
+                  ),
+                ],
+                1
+              ),
+            ]
+          ),
+        ]
+      ),
+      _c(
+        "div",
+        {
+          staticClass: "mds-transfer-extra-actions-wrapper",
+          style: { height: _vm.height + "px" },
+        },
+        _vm._l(_vm.targets, function (target, index) {
+          return _c(
+            "div",
+            {
+              key: target.key,
+              staticClass: "mds-transfer-extra-actions",
+              class:
+                "mds-transfer-extra-actions-" +
+                (index === 0 ? "top" : "bottom"),
+              style: _vm.getActionStyle(index),
+            },
+            [
+              _c(
+                "div",
+                { staticClass: "mds-transfer-extra-button-item" },
+                [
+                  _c(
+                    "mds-button",
+                    {
+                      staticClass: "mds-transfer-extra-btn",
+                      attrs: {
+                        type: "primary",
+                        disabled: _vm.leftSelected.length === 0,
+                      },
+                      on: {
+                        click: function ($event) {
+                          return _vm.moveTo(target.key)
+                        },
+                      },
+                    },
+                    [_c("mds-icon", { attrs: { type: "line-arrow-right" } })],
+                    1
+                  ),
+                ],
+                1
+              ),
+              _c(
+                "div",
+                [
+                  _c(
+                    "mds-button",
+                    {
+                      staticClass: "mds-transfer-extra-btn",
+                      attrs: {
+                        type: "primary",
+                        disabled: _vm.getRightSelected(target.key).length === 0,
+                      },
+                      on: {
+                        click: function ($event) {
+                          return _vm.moveBack(target.key)
+                        },
+                      },
+                    },
+                    [_c("mds-icon", { attrs: { type: "line-arrow-left" } })],
+                    1
+                  ),
+                ],
+                1
+              ),
+            ]
+          )
+        }),
+        0
+      ),
+      _c(
+        "div",
+        {
+          staticClass: "mds-transfer-extra-right",
+          style: { height: _vm.height + "px" },
+        },
+        _vm._l(_vm.targets, function (target, index) {
+          return _c(
+            "div",
+            {
+              key: target.key,
+              staticClass:
+                "mds-transfer-extra-card mds-transfer-extra-right-card",
+              style: _vm.getCardStyle(index),
+            },
+            [
+              _c(
+                "div",
+                { staticClass: "mds-transfer-extra-header" },
+                [
+                  _c(
+                    "mds-checkbox",
+                    {
+                      attrs: {
+                        checked: _vm.rightCheckAll(target.key),
+                        indeterminate: _vm.rightIndeterminate(target.key),
+                      },
+                      on: {
+                        change: function (val) {
+                          return _vm.toggleRightCheckAll(target.key, val)
+                        },
+                      },
+                    },
+                    [_vm._v(_vm._s(_vm.rightTitle[index] || target.title))]
+                  ),
+                  _c("span", { staticClass: "mds-transfer-extra-count" }, [
+                    _vm._v(
+                      "\n          " +
+                        _vm._s(_vm.getRightSelected(target.key).length) +
+                        "/" +
+                        _vm._s(_vm.getFilteredRightList(target.key).length) +
+                        "\n        "
+                    ),
+                  ]),
+                ],
+                1
+              ),
+              _vm.filterable
+                ? _c(
+                    "div",
+                    { staticClass: "mds-transfer-extra-search" },
+                    [
+                      _c(
+                        "mds-input",
+                        {
+                          attrs: {
+                            value: _vm.getRightSearch(target.key),
+                            placeholder: _vm.filterPlaceholder,
+                            clearable: "",
+                            size: "small",
+                          },
+                          on: {
+                            input: function ($event) {
+                              return _vm.updateRightSearch(target.key, $event)
+                            },
+                          },
+                        },
+                        [
+                          _c("mds-icon", {
+                            attrs: { slot: "prefix", type: "line-search" },
+                            slot: "prefix",
+                          }),
+                        ],
+                        1
+                      ),
+                    ],
+                    1
+                  )
+                : _vm._e(),
+              _c(
+                "div",
+                {
+                  class:
+                    _vm.prefixCls +
+                    "extra-scroll " +
+                    _vm.prefixCls +
+                    "panel-body",
+                },
+                [
+                  _c(
+                    "mds-checkbox-group",
+                    {
+                      staticClass: "checkbox-group-vertical",
+                      attrs: { value: _vm.getRightSelected(target.key) },
+                      on: {
+                        input: function ($event) {
+                          return _vm.updateRightSelected(target.key, $event)
+                        },
+                      },
+                    },
+                    _vm._l(
+                      _vm.getFilteredRightList(target.key),
+                      function (item) {
+                        return _c(
+                          "mds-checkbox",
+                          {
+                            key: item.key,
+                            attrs: { value: item.key, disabled: item.disabled },
+                          },
+                          [
+                            _vm.$scopedSlots.default
+                              ? [_vm._t("default", null, { option: item })]
+                              : [
+                                  _vm._v(
+                                    "\n              " +
+                                      _vm._s(item.label) +
+                                      "\n            "
+                                  ),
+                                ],
+                          ],
+                          2
+                        )
+                      }
+                    ),
+                    1
+                  ),
+                ],
+                1
+              ),
+            ]
+          )
+        }),
+        0
+      ),
+    ]
+  )
+}
+var transferExtravue_type_template_id_7bf23e3c_staticRenderFns = []
+transferExtravue_type_template_id_7bf23e3c_render._withStripped = true
+
+
+// CONCATENATED MODULE: ./components/transfer/transferExtra.vue?vue&type=template&id=7bf23e3c&
+
+// EXTERNAL MODULE: external "babel-runtime/helpers/toConsumableArray"
+var toConsumableArray_ = __webpack_require__(19);
+var toConsumableArray_default = /*#__PURE__*/__webpack_require__.n(toConsumableArray_);
+
+// CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transferExtra.vue?vue&type=script&lang=js&
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+
+
+
+
+
+
+
+/* harmony default export */ var transferExtravue_type_script_lang_js_ = ({
+  name: 'MdsTransferExtra',
+  components: {
+    MdsInput: external_input_default.a,
+    MdsIcon: external_icon_default.a,
+    MdsCheckbox: external_checkbox_["MdsCheckbox"],
+    MdsCheckboxGroup: external_checkbox_["MdsCheckboxGroup"],
+    MdsButton: external_button_default.a
+  },
+  mixins: [locale_default.a],
+  props: {
+    height: {
+      type: [String, Number],
+      default: 600 // 或 '600px'
+    },
+    cardGap: {
+      type: Number,
+      default: 24 // 卡片间距
+    },
+    // 左侧数据源
+    data: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    prefixCls: {
+      type: String,
+      default: 'mds-transfer-'
+    },
+    // 左侧标题
+    leftTitle: {
+      type: String,
+      default: '数据源'
+    },
+    // 右侧标题
+    rightTitle: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    // 目标区域配置
+    targets: {
+      type: Array,
+      default: function _default() {
+        return [{ key: 'target1', title: '目标区域1' }, { key: 'target2', title: '目标区域2' }];
+      }
+    },
+    // 初始值
+    value: {
+      type: Object,
+      default: function _default() {
+        return {};
+      }
+    },
+    // 是否可搜索
+    filterable: {
+      type: Boolean,
+      default: false
+    },
+    // 搜索占位符
+    filterPlaceholder: {
+      type: String,
+      default: function _default() {
+        // 优先使用上游传入的值，否则用国际化或默认
+        return this.$t && this.$t('mds.transfer.filterPlaceholder') || '请输入搜索内容';
+      }
+    },
+    // 自定义搜索方法
+    filterMethod: Function,
+    leftDefaultChecked: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    rightDefaultChecked: {
+      type: Object, // { [targetKey]: [key1, key2] }
+      default: function _default() {
+        return {};
+      }
+    }
+  },
+  data: function data() {
+    return {
+      leftList: [].concat(toConsumableArray_default()(this.data)),
+      rightLists: this.initRightLists(),
+      leftSelected: this.cleanSelectedKeys(this.leftDefaultChecked, this.data),
+      rightSelected: this.initRightSelected(),
+      leftSearch: '',
+      rightSearch: this.initRightSearch()
+    };
+  },
+
+  computed: {
+    cardCount: function cardCount() {
+      return this.targets.length;
+    },
+    cardHeight: function cardHeight() {
+      var h = typeof this.height === 'number' ? this.height : parseInt(this.height);
+      return (h - (this.cardCount - 1) * this.cardGap) / this.cardCount;
+    },
+
+    // 过滤后的左侧列表
+    filteredLeftList: function filteredLeftList() {
+      var _this = this;
+
+      if (!this.filterable || !this.leftSearch.trim()) {
+        return this.leftList;
+      }
+
+      if (this.filterMethod) {
+        return this.leftList.filter(function (item) {
+          return _this.filterMethod(_this.leftSearch, item);
+        });
+      }
+
+      return this.leftList.filter(function (item) {
+        return item.label && item.label.toLowerCase().includes(_this.leftSearch.toLowerCase());
+      });
+    },
+    leftCheckAll: function leftCheckAll() {
+      var _this2 = this;
+
+      var checkable = this.filteredLeftList.filter(function (i) {
+        return !i.disabled;
+      });
+      return checkable.length > 0 && checkable.every(function (i) {
+        return _this2.leftSelected.includes(i.key);
+      });
+    },
+    leftIndeterminate: function leftIndeterminate() {
+      var _this3 = this;
+
+      var checkable = this.filteredLeftList.filter(function (i) {
+        return !i.disabled;
+      });
+      var checked = checkable.filter(function (i) {
+        return _this3.leftSelected.includes(i.key);
+      });
+      return checked.length > 0 && checked.length < checkable.length;
+    }
+  },
+  watch: {
+    data: {
+      handler: function handler(newData) {
+        this.leftList = [].concat(toConsumableArray_default()(newData));
+        this.leftSelected = this.cleanSelectedKeys(this.leftSelected, this.leftList);
+      },
+
+      deep: true
+    },
+    value: {
+      handler: function handler(newValue) {
+        var _this4 = this;
+
+        this.targets.forEach(function (target) {
+          _this4.rightLists[target.key] = newValue[target.key] || [];
+          _this4.$set(_this4.rightSelected, target.key, _this4.cleanSelectedKeys(_this4.getRightSelected(target.key), _this4.getRightList(target.key)));
+        });
+      },
+
+      deep: true
+      // leftDefaultChecked(newVal) {
+      //   this.leftSelected = this.cleanSelectedKeys(newVal, this.leftList)
+      // },
+      // rightDefaultChecked: {
+      //   handler(newVal) {
+      //     this.targets.forEach(target => {
+      //       this.$set(
+      //         this.rightSelected,
+      //         target.key,
+      //         this.cleanSelectedKeys(newVal[target.key] ? [...newVal[target.key]] : [], this.getRightList(target.key))
+      //       )
+      //     })
+      //   },
+      //   deep: true
+      // }
+    } },
+  methods: {
+    cleanSelectedKeys: function cleanSelectedKeys(selectedKeys, list) {
+      var validKeys = list.map(function (item) {
+        return item.key;
+      });
+      return selectedKeys.filter(function (key) {
+        return validKeys.includes(key);
+      });
+    },
+    getCardStyle: function getCardStyle(index) {
+      return {
+        height: this.cardHeight + 'px',
+        marginBottom: index < this.cardCount - 1 ? this.cardGap + 'px' : '0'
+      };
+    },
+    getActionStyle: function getActionStyle(index) {
+      // 让按钮区和每个右侧卡片垂直居中对齐
+      return {
+        height: this.cardHeight + 'px',
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        marginBottom: index < this.cardCount - 1 ? this.cardGap + 'px' : 0
+      };
+    },
+
+    // 初始化右侧数据
+    initRightLists: function initRightLists() {
+      var _this5 = this;
+
+      var rightLists = {};
+      this.targets.forEach(function (target) {
+        rightLists[target.key] = _this5.value[target.key] || [];
+      });
+      return rightLists;
+    },
+
+
+    // 初始化右侧选中状态
+    initRightSelected: function initRightSelected() {
+      var _this6 = this;
+
+      var rightSelected = {};
+      this.targets.forEach(function (target) {
+        rightSelected[target.key] = _this6.rightDefaultChecked[target.key] ? [].concat(toConsumableArray_default()(_this6.rightDefaultChecked[target.key])) : [];
+      });
+      return rightSelected;
+    },
+
+
+    // 初始化右侧搜索状态
+    initRightSearch: function initRightSearch() {
+      var rightSearch = {};
+      this.targets.forEach(function (target) {
+        rightSearch[target.key] = '';
+      });
+      return rightSearch;
+    },
+
+
+    // 获取右侧列表
+    getRightList: function getRightList(targetKey) {
+      return this.rightLists[targetKey] || [];
+    },
+
+
+    // 获取过滤后的右侧列表
+    getFilteredRightList: function getFilteredRightList(targetKey) {
+      var _this7 = this;
+
+      var list = this.getRightList(targetKey);
+      var search = this.getRightSearch(targetKey);
+
+      if (!this.filterable || !search.trim()) {
+        return list;
+      }
+
+      if (this.filterMethod) {
+        return list.filter(function (item) {
+          return _this7.filterMethod(search, item);
+        });
+      }
+
+      return list.filter(function (item) {
+        return item.label && item.label.toLowerCase().includes(search.toLowerCase());
+      });
+    },
+
+
+    // 获取右侧选中状态
+    getRightSelected: function getRightSelected(targetKey) {
+      if (!this.rightSelected[targetKey]) {
+        this.$set(this.rightSelected, targetKey, []);
+      }
+      return this.rightSelected[targetKey];
+    },
+
+
+    // 获取右侧搜索状态
+    getRightSearch: function getRightSearch(targetKey) {
+      if (!this.rightSearch[targetKey]) {
+        this.$set(this.rightSearch, targetKey, '');
+      }
+      return this.rightSearch[targetKey];
+    },
+
+
+    // 更新右侧选中状态
+    updateRightSelected: function updateRightSelected(targetKey, selectedValues) {
+      this.$set(this.rightSelected, targetKey, selectedValues);
+    },
+
+
+    // 更新右侧搜索状态
+    updateRightSearch: function updateRightSearch(targetKey, searchValue) {
+      this.$set(this.rightSearch, targetKey, searchValue);
+    },
+
+
+    // 移动到右侧
+    moveTo: function moveTo(targetKey) {
+      var _this8 = this,
+          _rightLists$targetKey;
+
+      if (this.leftSelected.length === 0) return;
+
+      var moveItems = this.leftList.filter(function (item) {
+        return _this8.leftSelected.includes(item.key);
+      });
+
+      // 避免重复添加
+      var existingKeys = this.getRightList(targetKey).map(function (item) {
+        return item.key;
+      });
+      var newItems = moveItems.filter(function (item) {
+        return !existingKeys.includes(item.key);
+      });
+
+      if (!this.rightLists[targetKey]) {
+        this.$set(this.rightLists, targetKey, []);
+      }
+      (_rightLists$targetKey = this.rightLists[targetKey]).push.apply(_rightLists$targetKey, toConsumableArray_default()(newItems));
+
+      // 从左侧移除已移动的项
+      this.leftList = this.leftList.filter(function (item) {
+        return !_this8.leftSelected.includes(item.key);
+      });
+      this.leftSelected = this.cleanSelectedKeys(this.leftSelected, this.leftList);
+
+      // 触发更新事件
+      this.emitChange();
+    },
+
+
+    // 移回左侧
+    moveBack: function moveBack(targetKey) {
+      var _leftList;
+
+      var selected = this.getRightSelected(targetKey);
+      if (selected.length === 0) return;
+
+      var moveItems = this.getRightList(targetKey).filter(function (item) {
+        return selected.includes(item.key);
+      });
+
+      // 避免重复添加到左侧
+      var existingKeys = this.leftList.map(function (item) {
+        return item.key;
+      });
+      var newItems = moveItems.filter(function (item) {
+        return !existingKeys.includes(item.key);
+      });
+      (_leftList = this.leftList).push.apply(_leftList, toConsumableArray_default()(newItems));
+
+      // 从右侧移除已移动的项
+      this.$set(this.rightLists, targetKey, this.getRightList(targetKey).filter(function (item) {
+        return !selected.includes(item.key);
+      }));
+      this.$set(this.rightSelected, targetKey, this.cleanSelectedKeys(this.getRightSelected(targetKey), this.getRightList(targetKey)));
+
+      // 触发更新事件
+      this.emitChange();
+    },
+
+
+    // 触发更新事件
+    emitChange: function emitChange() {
+      var _this9 = this;
+
+      var result = {};
+      this.targets.forEach(function (target) {
+        result[target.key] = _this9.getRightList(target.key);
+      });
+      this.$emit('input', result);
+      this.$emit('change', result);
+    },
+    toggleLeftCheckAll: function toggleLeftCheckAll(val) {
+      var checkable = this.filteredLeftList.filter(function (i) {
+        return !i.disabled;
+      }).map(function (i) {
+        return i.key;
+      });
+      this.leftSelected = val ? checkable : [];
+    },
+    rightCheckAll: function rightCheckAll(targetKey) {
+      var _this10 = this;
+
+      var checkable = this.getFilteredRightList(targetKey).filter(function (i) {
+        return !i.disabled;
+      });
+      return checkable.length > 0 && checkable.every(function (i) {
+        return _this10.getRightSelected(targetKey).includes(i.key);
+      });
+    },
+    rightIndeterminate: function rightIndeterminate(targetKey) {
+      var _this11 = this;
+
+      var checkable = this.getFilteredRightList(targetKey).filter(function (i) {
+        return !i.disabled;
+      });
+      var checked = checkable.filter(function (i) {
+        return _this11.getRightSelected(targetKey).includes(i.key);
+      });
+      return checked.length > 0 && checked.length < checkable.length;
+    },
+    toggleRightCheckAll: function toggleRightCheckAll(targetKey, val) {
+      var checkable = this.getFilteredRightList(targetKey).filter(function (i) {
+        return !i.disabled;
+      }).map(function (i) {
+        return i.key;
+      });
+      this.updateRightSelected(targetKey, val ? checkable : []);
+    }
+  }
+});
+// CONCATENATED MODULE: ./components/transfer/transferExtra.vue?vue&type=script&lang=js&
+ /* harmony default export */ var transfer_transferExtravue_type_script_lang_js_ = (transferExtravue_type_script_lang_js_); 
+// CONCATENATED MODULE: ./components/transfer/transferExtra.vue
+
+
+
+
+
+/* normalize component */
+
+var transferExtra_component = Object(componentNormalizer["a" /* default */])(
+  transfer_transferExtravue_type_script_lang_js_,
+  transferExtravue_type_template_id_7bf23e3c_render,
+  transferExtravue_type_template_id_7bf23e3c_staticRenderFns,
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* hot reload */
+if (false) { var transferExtra_api; }
+transferExtra_component.options.__file = "components/transfer/transferExtra.vue"
+/* harmony default export */ var transferExtra = (transferExtra_component.exports);
 // CONCATENATED MODULE: ./components/transfer/index.js
 
 
 
+
+// MdsTransfer.Extra = MdsTransferExtra
 transfer.install = function (Vue) {
-    Vue.component(transfer.name, transfer);
+  Vue.component(transfer.name, transfer);
+  Vue.component(transferExtra.name, transferExtra);
 };
 
 /* harmony default export */ var components_transfer = __webpack_exports__["default"] = (transfer);
 
 /***/ }),
 
-/***/ 14:
+/***/ 13:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__14__;
+module.exports = __WEBPACK_EXTERNAL_MODULE__13__;
 
 /***/ }),
 
@@ -956,10 +1889,17 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__17__;
 
 /***/ }),
 
-/***/ 21:
+/***/ 19:
+/***/ (function(module, exports) {
+
+module.exports = require("babel-runtime/helpers/toConsumableArray");
+
+/***/ }),
+
+/***/ 22:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__21__;
+module.exports = __WEBPACK_EXTERNAL_MODULE__22__;
 
 /***/ }),
 
@@ -977,10 +1917,17 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__21__;
 
 /***/ }),
 
-/***/ 35:
+/***/ 251:
+/***/ (function(module, exports) {
+
+// removed by extract-text-webpack-plugin
+
+/***/ }),
+
+/***/ 28:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE__35__;
+module.exports = __WEBPACK_EXTERNAL_MODULE__28__;
 
 /***/ }),
 
@@ -989,6 +1936,13 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__35__;
 
 module.exports = __WEBPACK_EXTERNAL_MODULE__7__;
 
+/***/ }),
+
+/***/ 9:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__9__;
+
 /***/ })
 
 /******/ });