@mdsfe/mds-ui/dist/transfer.js

A set of enterprise-class Vue UI components.

(function webpackUniversalModuleDefinition(root, factory) {
	if(typeof exports === 'object' && typeof module === 'object')
		module.exports = factory(require("./icon"), require("./_mixin/locale"), require("./button"), require("./input"), require("./_util/util"), require("./checkbox"));
	else if(typeof define === 'function' && define.amd)
		define(["./icon", "./_mixin/locale", "./button", "./input", "./_util/util", "./checkbox"], factory);
	else {
		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__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 = {};
/******/
/******/ 	// The require function
/******/ 	function __webpack_require__(moduleId) {
/******/
/******/ 		// Check if module is in cache
/******/ 		if(installedModules[moduleId]) {
/******/ 			return installedModules[moduleId].exports;
/******/ 		}
/******/ 		// Create a new module (and put it into the cache)
/******/ 		var module = installedModules[moduleId] = {
/******/ 			i: moduleId,
/******/ 			l: false,
/******/ 			exports: {}
/******/ 		};
/******/
/******/ 		// Execute the module function
/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ 		// Flag the module as loaded
/******/ 		module.l = true;
/******/
/******/ 		// Return the exports of the module
/******/ 		return module.exports;
/******/ 	}
/******/
/******/
/******/ 	// expose the modules object (__webpack_modules__)
/******/ 	__webpack_require__.m = modules;
/******/
/******/ 	// expose the module cache
/******/ 	__webpack_require__.c = installedModules;
/******/
/******/ 	// define getter function for harmony exports
/******/ 	__webpack_require__.d = function(exports, name, getter) {
/******/ 		if(!__webpack_require__.o(exports, name)) {
/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ 		}
/******/ 	};
/******/
/******/ 	// define __esModule on exports
/******/ 	__webpack_require__.r = function(exports) {
/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ 		}
/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
/******/ 	};
/******/
/******/ 	// create a fake namespace object
/******/ 	// mode & 1: value is a module id, require it
/******/ 	// mode & 2: merge all properties of value into the ns
/******/ 	// mode & 4: return value when already ns object
/******/ 	// mode & 8|1: behave like require
/******/ 	__webpack_require__.t = function(value, mode) {
/******/ 		if(mode & 1) value = __webpack_require__(value);
/******/ 		if(mode & 8) return value;
/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ 		var ns = Object.create(null);
/******/ 		__webpack_require__.r(ns);
/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ 		return ns;
/******/ 	};
/******/
/******/ 	// getDefaultExport function for compatibility with non-harmony modules
/******/ 	__webpack_require__.n = function(module) {
/******/ 		var getter = module && module.__esModule ?
/******/ 			function getDefault() { return module['default']; } :
/******/ 			function getModuleExports() { return module; };
/******/ 		__webpack_require__.d(getter, 'a', getter);
/******/ 		return getter;
/******/ 	};
/******/
/******/ 	// Object.prototype.hasOwnProperty.call
/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ 	// __webpack_public_path__
/******/ 	__webpack_require__.p = "/dist/";
/******/
/******/
/******/ 	// Load entry module and return exports
/******/ 	return __webpack_require__(__webpack_require__.s = 100);
/******/ })
/************************************************************************/
/******/ ({

/***/ 0:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; });
/* globals __VUE_SSR_CONTEXT__ */

// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
// This module is a runtime utility for cleaner component module output and will
// be included in the final webpack user bundle.

function normalizeComponent (
  scriptExports,
  render,
  staticRenderFns,
  functionalTemplate,
  injectStyles,
  scopeId,
  moduleIdentifier, /* server only */
  shadowMode /* vue-cli only */
) {
  // Vue.extend constructor export interop
  var options = typeof scriptExports === 'function'
    ? scriptExports.options
    : scriptExports

  // render functions
  if (render) {
    options.render = render
    options.staticRenderFns = staticRenderFns
    options._compiled = true
  }

  // functional template
  if (functionalTemplate) {
    options.functional = true
  }

  // scopedId
  if (scopeId) {
    options._scopeId = 'data-v-' + scopeId
  }

  var hook
  if (moduleIdentifier) { // server build
    hook = function (context) {
      // 2.3 injection
      context =
        context || // cached call
        (this.$vnode && this.$vnode.ssrContext) || // stateful
        (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
      // 2.2 with runInNewContext: true
      if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
        context = __VUE_SSR_CONTEXT__
      }
      // inject component styles
      if (injectStyles) {
        injectStyles.call(this, context)
      }
      // register component module identifier for async chunk inferrence
      if (context && context._registeredComponents) {
        context._registeredComponents.add(moduleIdentifier)
      }
    }
    // used by ssr in case component is cached and beforeCreate
    // never gets called
    options._ssrRegister = hook
  } else if (injectStyles) {
    hook = shadowMode
      ? function () {
        injectStyles.call(
          this,
          (options.functional ? this.parent : this).$root.$options.shadowRoot
        )
      }
      : injectStyles
  }

  if (hook) {
    if (options.functional) {
      // for template-only hot-reload because in that case the render fn doesn't
      // go through the normalizer
      options._injectStyles = hook
      // register for functional component in vue file
      var originalRender = options.render
      options.render = function renderWithStyleInjection (h, context) {
        hook.call(context)
        return originalRender(h, context)
      }
    } else {
      // inject component registration as beforeCreate hook
      var existing = options.beforeCreate
      options.beforeCreate = existing
        ? [].concat(existing, hook)
        : [hook]
    }
  }

  return {
    exports: scriptExports,
    options: options
  }
}


/***/ }),

/***/ 100:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// EXTERNAL MODULE: ./components/transfer/style/index.less
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
  var _h = _vm.$createElement
  var _c = _vm._self._c || _h
  return _c(
    "div",
    { class: _vm.prefixCls },
    [
      _c(
        "mds-TransferPanel",
        _vm._b(
          {
            ref: "leftPanel",
            attrs: {
              "default-checked": _vm.leftDefaultChecked,
              data: _vm.sourceData,
              title: _vm.titles[0] || _vm.t("mds.transfer.titles.0"),
              prefixCls: "mds-transfer-",
            },
            on: { "checked-change": _vm.leftCheckedChange },
          },
          "mds-TransferPanel",
          _vm.$props,
          false
        )
      ),
      _c("div", { class: _vm.prefixCls + "-buttons" }, [
        _c(
          "div",
          { class: _vm.prefixCls + "-button-item" },
          [
            _c(
              "mds-button",
              {
                attrs: { type: "primary", disabled: _vm.lChecked.length === 0 },
                on: { click: _vm.addToRight },
              },
              [
                _c("mds-icon", { attrs: { type: "line-arrow-right" } }),
                _vm.buttonTexts[0] !== undefined
                  ? _c("span", [_vm._v(_vm._s(_vm.buttonTexts[0]))])
                  : _vm._e(),
              ],
              1
            ),
          ],
          1
        ),
        _c(
          "div",
          { class: _vm.prefixCls + "-button-item" },
          [
            _c(
              "mds-button",
              {
                attrs: { type: "primary", disabled: _vm.rChecked.length === 0 },
                on: { click: _vm.addToLeft },
              },
              [
                _c("mds-icon", { attrs: { type: "line-arrow-left" } }),
                _vm.buttonTexts[1] !== undefined
                  ? _c("span", [_vm._v(_vm._s(_vm.buttonTexts[1]))])
                  : _vm._e(),
              ],
              1
            ),
          ],
          1
        ),
      ]),
      _c(
        "mds-TransferPanel",
        _vm._b(
          {
            ref: "rightPanel",
            attrs: {
              title: _vm.titles[1] || _vm.t("mds.transfer.titles.1"),
              data: _vm.targetData,
              prefixCls: "mds-transfer-",
            },
            on: { "checked-change": _vm.rightChecedChange },
          },
          "mds-TransferPanel",
          _vm.$props,
          false
        )
      ),
    ],
    1
  )
}
var staticRenderFns = []
render._withStripped = true


// CONCATENATED MODULE: ./components/transfer/transfer.vue?vue&type=template&id=45345264&lang=html&

// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/transfer/transferPanel.vue?vue&type=template&id=32ae9a30&
var transferPanelvue_type_template_id_32ae9a30_render = function () {
  var _vm = this
  var _h = _vm.$createElement
  var _c = _vm._self._c || _h
  return _c("div", { class: _vm.prefixCls + "panel" }, [
    _c(
      "div",
      { class: _vm.prefixCls + "panel-header" },
      [
        _c(
          "mds-checkbox",
          {
            attrs: {
              checked: _vm.checkAll,
              indeterminate: _vm.isIndeterminate,
            },
            on: { change: _vm.toggleCheckedAll },
          },
          [_vm._v(_vm._s(_vm.title))]
        ),
        _c("span", [_vm._v(_vm._s(_vm.checkedSummary))]),
      ],
      1
    ),
    _c(
      "div",
      { class: _vm.prefixCls + "panel-body" },
      [
        _vm.filterable
          ? _c(
              "div",
              { class: _vm.prefixCls + "panel__filter__box" },
              [
                _c(
                  "mds-input",
                  {
                    class: _vm.prefixCls + "panel__filter",
                    attrs: {
                      size: "small",
                      placeholder: _vm.t("mds.transfer.filterPlaceholder"),
                      prefix: "",
                    },
                    model: {
                      value: _vm.query,
                      callback: function ($$v) {
                        _vm.query = $$v
                      },
                      expression: "query",
                    },
                  },
                  [
                    _c("mds-icon", {
                      attrs: { slot: "prefix", type: "line-search" },
                      slot: "prefix",
                    }),
                  ],
                  1
                ),
              ],
              1
            )
          : _vm._e(),
        _c(
          "mds-checkbox-group",
          {
            directives: [
              {
                name: "show",
                rawName: "v-show",
                value: !_vm.hasNoMatch && _vm.data.length > 0,
                expression: "!hasNoMatch && data.length > 0",
              },
            ],
            class: { "is-filterable": _vm.filterable },
            attrs: { isTransfer: true },
            model: {
              value: _vm.checked,
              callback: function ($$v) {
                _vm.checked = $$v
              },
              expression: "checked",
            },
          },
          _vm._l(_vm.filteredData, function (item) {
            return _c(
              "mds-checkbox",
              {
                key: item.value,
                class: _vm.prefixCls + "panel__item",
                attrs: { value: item.value, disabled: item.disabled },
              },
              [_c("option-content", { attrs: { option: item } })],
              1
            )
          }),
          1
        ),
        _c(
          "p",
          {
            directives: [
              {
                name: "show",
                rawName: "v-show",
                value: _vm.hasNoMatch,
                expression: "hasNoMatch",
              },
            ],
            class: _vm.prefixCls + "panel__empty",
          },
          [_vm._v(_vm._s(_vm.t("mds.transfer.noMatch")))]
        ),
        _c(
          "p",
          {
            directives: [
              {
                name: "show",
                rawName: "v-show",
                value: _vm.data.length === 0 && !_vm.hasNoMatch,
                expression: "data.length === 0 && !hasNoMatch",
              },
            ],
            class: _vm.prefixCls + "panel__empty",
          },
          [_vm._v("\n      " + _vm._s(_vm.t("mds.transfer.noData")) + "\n    ")]
        ),
      ],
      1
    ),
  ])
}
var transferPanelvue_type_template_id_32ae9a30_staticRenderFns = []
transferPanelvue_type_template_id_32ae9a30_render._withStripped = true


// CONCATENATED MODULE: ./components/transfer/transferPanel.vue?vue&type=template&id=32ae9a30&

// EXTERNAL MODULE: external "./input"
var external_input_ = __webpack_require__(17);
var external_input_default = /*#__PURE__*/__webpack_require__.n(external_input_);

// EXTERNAL MODULE: external "./icon"
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__(28);

// EXTERNAL MODULE: external "./_util/util"
var util_ = __webpack_require__(22);

// EXTERNAL MODULE: external "./_mixin/locale"
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&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//







/* harmony default export */ var transferPanelvue_type_script_lang_js_ = ({
  name: 'MdsTransferPanel',
  components: {
    MdsInput: external_input_default.a,
    MdsIcon: external_icon_default.a,
    MdsCheckbox: external_checkbox_["MdsCheckbox"],
    MdsCheckboxGroup: external_checkbox_["MdsCheckboxGroup"],
    OptionContent: {
      props: {
        option: Object
      },
      render: function render(h) {
        var getParent = function getParent(vm) {
          if (vm.$options.name === 'MdsTransferPanel') {
            return vm;
          } else if (vm.$parent) {
            return getParent(vm.$parent);
          } else {
            return vm;
          }
        };
        var panel = getParent(this);
        var transfer = panel.$parent || panel;
        return transfer.$scopedSlots.default ? transfer.$scopedSlots.default({ option: this.option, style: 'overflow-x: auto' }) : h('span', [this.option.label || this.option.value]);
      }
    }
  },
  mixins: [locale_default.a],
  props: {
    data: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    defaultChecked: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    format: Object,
    prefixCls: {
      type: String,
      default: 'mds-transfer-'
    },
    title: {
      type: String,
      default: '标题名称'
    },
    renderContent: {
      type: Function,
      default: util_["noop"]
    },
    filterable: Boolean,
    filterPlaceholder: {
      type: String,
      default: ''
    },
    filterMethod: Function
  },
  data: function data() {
    return {
      query: '',
      checked: this.defaultChecked || [],
      allChecked: false,
      checkChangeByUser: true
    };
  },

  computed: {
    checkedSummary: function checkedSummary() {
      var checkedLength = this.checked.length;
      var dataLength = this.data.length;
      var _format = this.format,
          noChecked = _format.noChecked,
          hasChecked = _format.hasChecked;

      if (noChecked && hasChecked) {
        return checkedLength > 0 ? hasChecked.replace(/\${checked}/g, checkedLength).replace(/\${total}/g, dataLength) : noChecked.replace(/\${total}/g, dataLength);
      } else {
        return checkedLength + '/' + dataLength;
      }
    },
    hasNoMatch: function hasNoMatch() {
      return this.query.length > 0 && this.filteredData.length === 0;
    },
    filteredData: function filteredData() {
      var _this = this;

      return this.data.filter(function (item) {
        if (typeof _this.filterMethod === 'function') {
          return _this.filterMethod(_this.query, item);
        } else {
          var label = item.label || item.value.toString();
          return label.toLowerCase().indexOf(_this.query.toLowerCase()) > -1;
        }
      });
    },
    checkableData: function checkableData() {
      return this.filteredData.filter(function (item) {
        return !item.disabled;
      });
    },
    isIndeterminate: function isIndeterminate() {
      var checkedLength = this.checked.length;
      return checkedLength > 0 && checkedLength < this.checkableData.length;
    }
  },
  watch: {
    checked: function checked(val, oldVal) {
      this.updateAllChecked();
      this.$emit('checked-change', val);
    },
    checkableData: function checkableData() {
      this.updateAllChecked();
    },
    data: function data(val, oldVal) {
      var checked = [];
      var filteredDataKeys = this.filteredData.map(function (item) {
        return item.value;
      });
      this.checked.forEach(function (item) {
        if (filteredDataKeys.indexOf(item) > -1) {
          checked.push(item);
        }
      });
      this.checkChangeByUser = false;
      this.checked = checked;
    }
  },
  // beforeCreate: {},
  methods: {
    toggleCheckedAll: function toggleCheckedAll(checkAllVal) {
      this.checked = checkAllVal ? this.checkableData.filter(function (item) {
        return !item.disabled;
      }).map(function (item) {
        if (!item.disabled) {
          return item.value;
        }
      }) : [];
    },
    updateAllChecked: function updateAllChecked() {
      var _this2 = this;

      var checkableDataKeys = this.checkableData.map(function (item) {
        return item.value;
      });
      this.checkAll = checkableDataKeys.length > 0 && checkableDataKeys.every(function (item) {
        return _this2.checked.indexOf(item) > -1;
      });
    }
  }
  // mounted: {
  // }
});
// CONCATENATED MODULE: ./components/transfer/transferPanel.vue?vue&type=script&lang=js&
 /* harmony default export */ var transfer_transferPanelvue_type_script_lang_js_ = (transferPanelvue_type_script_lang_js_); 
// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(0);

// CONCATENATED MODULE: ./components/transfer/transferPanel.vue





/* normalize component */

var component = Object(componentNormalizer["a" /* default */])(
  transfer_transferPanelvue_type_script_lang_js_,
  transferPanelvue_type_template_id_32ae9a30_render,
  transferPanelvue_type_template_id_32ae9a30_staticRenderFns,
  false,
  null,
  null,
  null
  
)

/* hot reload */
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__(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&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//






/* harmony default export */ var transfervue_type_script_lang_js_ = ({
  name: 'MdsTransfer',
  mixins: [locale_default.a],
  props: {
    data: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    value: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    titles: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    leftDefaultChecked: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    rightDefaultChecked: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    targetOrder: {
      type: String,
      default: 'original'
    },
    prefixCls: {
      type: String,
      default: 'mds-transfer'
    },
    filterable: Boolean,
    filterPlaceholder: {
      type: String,
      default: '请输入搜索内容123'
    },
    filterMethod: Function,
    format: {
      type: Object,
      default: function _default() {
        return {};
      }
    },
    buttonTexts: {
      type: Array,
      default: function _default() {
        return [];
      }
    }
  },
  data: function data() {
    return {
      lChecked: this.leftDefaultChecked || [],
      rChecked: this.rightDefaultChecked || []
    };
  },

  computed: {
    sourceData: function sourceData() {
      var _this = this;

      return this.data.filter(function (item) {
        return _this.value.indexOf(item['value']) === -1;
      });
    },
    targetData: function targetData() {
      var _this2 = this;

      return this.data.filter(function (item) {
        return _this2.value.indexOf(item['value']) !== -1;
      });
    }
  },
  components: {
    MdsButton: external_button_default.a,
    MdsTransferPanel: transferPanel,
    MdsIcon: external_icon_default.a
  },
  watch: {
    value: function value(val, oldVal) {}
  },
  methods: {
    addToRight: function addToRight() {
      var _this3 = this;

      var currentValue = this.value.slice();
      var toMoveArr = [];
      this.data.forEach(function (item) {
        var itemKey = item['value'];
        if (_this3.lChecked.indexOf(itemKey) !== -1 && _this3.value.indexOf(itemKey) === -1) {
          toMoveArr.push(itemKey);
        }
      });
      currentValue = currentValue.concat(toMoveArr);
      this.$emit('input', currentValue);
      this.$emit('change', currentValue, 'right', this.rChecked);
    },
    addToLeft: function addToLeft() {
      var currentValue = this.value.slice();
      this.rChecked.forEach(function (item) {
        var index = currentValue.indexOf(item);
        if (index > -1) {
          currentValue.splice(index, 1);
        }
      });
      this.$emit('input', currentValue);
      this.$emit('change', currentValue, 'left', this.lChecked);
    },
    leftCheckedChange: function leftCheckedChange(val) {
      this.lChecked = val;
    },
    rightChecedChange: function rightChecedChange(val) {
      this.rChecked = val;
    }
  }
  // beforeCreate: {},
  // mounted: {}
});
// CONCATENATED MODULE: ./components/transfer/transfer.vue?vue&type=script&lang=js&
 /* harmony default export */ var transfer_transfervue_type_script_lang_js_ = (transfervue_type_script_lang_js_); 
// CONCATENATED MODULE: ./components/transfer/transfer.vue





/* normalize component */

var transfer_component = Object(componentNormalizer["a" /* default */])(
  transfer_transfervue_type_script_lang_js_,
  render,
  staticRenderFns,
  false,
  null,
  null,
  null
  
)

/* hot reload */
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.