<template>
  <div :class="type === '1' ? 'btn' : 'btn1'" :style='`width:${width}px`' class="flex flex-center mr-5 font-12 pointer">
    <el-icon color="#E9A956">
      <component :is="icon"></component>
    </el-icon>
    <div class="ml-5 nowrap"> {{ title }}</div>
  </div>
</template>

<script>
export default {
  name: 'base-button',
  props: {
    title: {
      type: String,
      default: '搜索'
    },
    type: {
      type: String,
      default: '1'
    },
    icon: {
      type: String,
      default: 'Search'
    },
    width: {
      type: Number,
      default: 100
    }
  },
  methods: {
    click () {
      console.log(new Date().getTime())
      // this.$nextTick(this.$emit('click'))
    }
  }
}
</script>

<style lang="scss" scoped>
.btn {
  border-radius: 6px;
  padding: 8px 16px;
  height: 20px;
  font-size: 14px;
  background-color: #AB7630;
  color: white;
}

.btn1 {
  border-radius: 6px;
  padding: 8px 16px;
  height: 20px;
  font-size: 14px;
  background-color: white;
  color: #AB7630;
  border: 1px solid #ECAB56;
}
</style>
