<template>
  <SelectUserComponent
    :value="props.value"
    :disabled="props.disabled"
    :record="props.record"
    :isJson="props.isJson"
    :multiple="props.multiple"
    :width="props.width"
    :readonly="props.readonly"
    :formRef="props.formRef"
    @onChange="onChange"
    @onClick="onClick"
    @onBlur="onBlur"
    @onFocus="onFocus"
    @update:value="updateValue"
    :placeholder="props.record?.placeholderContent || props.placeholder"
  ></SelectUserComponent>
</template>

<script setup name="FormSelectUser">
const props = defineProps({
  value: {
    type: [String, Array],
    default: ''
  },
  //是否禁用
  disabled: {
    type: Boolean,
    default: false
  },
  record: {
    type: Object,
    default: {}
  },
  placeholder: {
    type: String,
    default: '请选择'
  },
  // 是否是json格式
  isJson: {
    type: Boolean,
    default: true
  },
  // 是否多选
  multiple: {
    type: Boolean,
    default: false
  },
  // input宽度
  width: {
    type: String,
    default: '100%'
  },
  // 是否只读
  readonly: {
    type: Boolean,
    default: false
  },
  // ref
  formRef: {
    type: Object,
    default: null
  }
});

const emits = defineEmits(['update:value', 'onChange', 'onClick', 'onBlur', 'onFocus']);

const onChange = record => {
  emits('onChange', record);
};
const onClick = record => {
  emits('onClick', record);
};
const onBlur = record => {
  emits('onBlur', record);
};
const onFocus = record => {
  emits('onFocus', record);
};

const updateValue = value => {
  emits('update:value', value);
};
</script>

<style></style>
