<template>
  <div id="search">
    <div v-if="type === 'select'">
      <el-select v-model="input" :placeholder="placeholder" filterable @input="handleInput">
        <el-option v-for="(item, index) in newDataList" :key="index" :label="item.label" :value="item.value"></el-option>
      </el-select>
    </div>
    <div v-if="type === 'input'">
      <el-input v-model="input" :placeholder="placeholder" @input="handleInput"></el-input>
    </div>
  </div>
</template>

<script>
import _ from 'lodash';
export default {
  name: 'search',
  props: {
    type: { type: String, default: 'input' },
    placeholder: { type: String, default: '请输入' },
    dataList: { type: Array, default: () => [] },
  },
  components: {},
  data: () => ({
    input: '',
    newDataList: [],
  }),
  created() {},
  computed: {},
  mounted() {
    if (this.type === 'select') {
      this.$set(this, `newDataList`, this.dataList);
    }
  },
  methods: {
    handleInput() {
      this.$emit('input', this.input);
      return;
    },
  },
};
</script>

<style lang="less" scoped>
.icons {
  zoom: 1.5;
  position: relative;
  top: 0.5rem;
}
</style>
