import employeeInput from '../employee-input/index';
import employeeList from '../employee-list/index';
import './style';

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c('div', {
    staticClass: "ks-employee-search"
  }, [_c('employeeInput', {
    ref: "input",
    attrs: {
      "clearable": _vm.clearable,
      "multiple": _vm.multiple,
      "placeholder": _vm.placeholder,
      "showCancel": _vm.showCancel
    },
    on: {
      "focus": _vm.focus,
      "blur": _vm.blur,
      "clear": _vm.clear,
      "change": _vm.inputChange,
      "delete": _vm.inputDelete,
      "cancel": _vm.cancel
    },
    model: {
      value: _vm.selectValue,
      callback: function callback($v) {
        _vm.selectValue = $v;
      },
      expression: "selectValue"
    }
  }), _vm._v(" "), _c('employeeList', {
    ref: "list",
    staticClass: "ks-employee-search-list",
    attrs: {
      "multiple": _vm.multiple,
      "repeatText": _vm.repeatText,
      "selected": _vm.selected,
      "showHistory": _vm.showHistory,
      "searchListHandler": _vm.searchListHandler,
      "historyListHandler": _vm.historyListHandler,
      "disabledItemClick": _vm.disabledItemClick
    },
    on: {
      "_moveHeadRight": _vm.moveHeadRight,
      "confirm": _vm.confirm,
      "selectItem": _vm.selectListItem
    },
    scopedSlots: _vm._u([{
      key: "employeeListInfo",
      fn: function fn(ref) {
        var item = ref.item;
        return [_vm._t("employeeListInfo", null, {
          "item": item
        })];
      }
    }, {
      key: "historyListInfo",
      fn: function fn(ref) {
        var item = ref.item;
        return [_vm._t("historyListInfo", null, {
          "item": item
        })];
      }
    }], null, true),
    model: {
      value: _vm.selectValue,
      callback: function callback($v) {
        _vm.selectValue = $v;
      },
      expression: "selectValue"
    }
  })], 1);
};

var __vue_staticRenderFns__ = [];
export default {
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__,
  name: 'ks-employee',
  components: {
    employeeInput: employeeInput,
    employeeList: employeeList
  },
  props: {
    value: {
      type: Array,
      default: function _default() {
        return [];
      }
    },
    // 是否展示取消按钮
    showCancel: {
      type: Boolean,
      default: false
    },
    clearable: {
      type: Boolean,
      default: true
    },
    // 是否多选
    multiple: {
      type: Boolean,
      default: false
    },
    placeholder: {
      type: String,
      default: '请搜索人名/工号'
    },
    // 多选重复添加的提示文案
    repeatText: {
      type: String,
      default: '请勿重复添加'
    },
    showHistory: {
      type: Boolean,
      default: true
    },
    // 选中事件前的fetch
    selected: {
      type: Function
    },
    historyListHandler: {
      type: Function
    },
    searchListHandler: {
      type: Function
    },
    disabledItemClick: {
      type: Function
    }
  },
  data: function data() {
    return {
      selectValue: this.value
    };
  },
  mounted: function mounted() {},
  watch: {
    value: function value(val) {
      this.selectValue = val;
    }
  },
  methods: {
    moveHeadRight: function moveHeadRight() {
      // 将头部的头像滚动区域平移至最后，选中需要展示最后一个
      this.$refs.input.moveRight();
    },
    inputChange: function inputChange(val) {
      // input组件搜索触发查询
      this.$refs.list.getSearch(val);
    },
    inputDelete: function inputDelete(item) {
      // input的删除触发
      this.$refs.list.deleteSelect(item);
    },
    focus: function focus() {
      this.$emit('focus');
    },
    clear: function clear() {
      this.$refs.list.getSearch('');
      this.$emit('clear');
    },
    blur: function blur() {
      this.$emit('blur');
    },
    cancel: function cancel() {
      this.$emit('cancel', false);
    },
    confirm: function confirm(list) {
      this.$emit('input', list);
      this.$emit('confirm', list);
    },
    selectListItem: function selectListItem(item, type) {
      // 列表选中需要清空input的value
      if (type !== 'history') {
        type !== 'history' && this.$refs.input.clear();
      }

      this.$emit('selectListItem', item);
    }
  }
};