import { isDeepEqual } from '@/utils'

export const $businessInput = {
  props:{
    // 标题
    title: {
      type: String,
      default: `选择`
    },
    placeholder: {
      type: String,
      default: `点击选择`,
    },
    // 展示值的属性
    showProp: {
      type: String,
      default: 'name'
    },
    // 选择的属性值
    prop: {
      type: String,
      default: 'priceId'
    },
    // 是否多选
    multiple: {
      type: Boolean,
      default: false,
    },
    // 双向绑定的值(为id)
    value: {
      type: [Array, String, Number],
      default: null
    },
    // 查询条件
    query: {
      type: Object,
      default: () => ({})
    },
    // 打开弹窗前
    beforeOpen: {
      type: Function,
      default: () => {
        return true;
      }
    },
    // 关闭弹窗前
    beforeClose: {
      type: Function,
      default: () => {
        return true;
      }
    },
    // 大小
    size: {
      type: String,
      default: null
    },
    // 是否禁用
    disabled: {
      type: Boolean,
      default: false,
    },
    // 对象处理器，参数类型：对象，返回值类型：字符串
    objectParser: {
      type: Function,
      default: (obj) => {
        return JSON.stringify(obj);
      }
    },
    listApi: {
      type: Function,
      default: null
    },
    loadApi: {
      type: Function,
      default: null,
    }
  },
  data() {
    return {
      selected: [], // 当前选中的值
      dialogShow: false,  // 展示对话框
    }
  },
  computed: {
    // 显示绑定的值
    inputBindValue() {
      if (this.selected == null || this.selected.length === 0) {
        return null;
      }
      return this.selected.map(item => item[this.showProp]).join(",");
    },
  },
  watch: {
    value(nv, ov) {
      this.loadSelected(nv);
    }
  },
  created() {
    this.loadSelected(this.value);
  },
  methods: {
    onCloseSelected(index) {
      this.selected.splice(index, 1);
      this.onSubmit(this.selected);
    },
    // 加载选中的值
    loadSelected(ids) {
      if (ids == null || ids.length === 0) {
        this.selected = [];
        return;
      }
      if (ids instanceof Array) {
        this.doLoad(ids);
      } else {
        this.doLoad([ids]);
      }
    },
    // 加载选中值
    doLoad(ids) {
      this.loadApi(ids).then(res => {
        this.selected = res.data;
      })
    },
    // 修改值
    inputValue(val){
      this.$emit('input', val);
    },
    // 确定
    onSubmit(selected){
      let value = null;
      console.log('onSubmit', selected);
      if (this.multiple) {
        value = selected.map(item => item[this.prop]);
      } else {
        value = selected[this.prop];
      }
      this.$emit('submit', selected);
      if (!isDeepEqual(this.value, value)) {
        this.$emit('change', selected);
      }
      this.inputValue(value);
      this.closeDialog();
    },
    closeDialog() {
      console.log('closeDialog');
      if (this.beforeClose()) {
        console.log('closeDialog ： false');
        this.dialogShow = false;
      }
    },
    // 打开对话框
    openDialog(){
      if (this.beforeOpen()) {
        this.dialogShow =  true;
      }
    }
  }
}
