<template>
  <div class="show-tips" :class="tipClass" :style="tipStyle" v-if="show">
    <i :class="'el-icon-' + type" :style="iconStyle" style="color: #0083ff;position: relative;top: 0.2rem" v-if="iconShow"></i>
    <slot></slot>
    <span v-if="showClose" class="el-icon-close" @click="show = false"></span>
  </div>
</template>

<script>
export default {
  name: 'ElTipsBox',
  props: {
    tipStyle: {
      type: Object
    },
    tipClass: {
      type: String
    },
    iconStyle: {
      type: Object
    },
    type: {
      // warning/error/info/success
      type: String,
      default: 'warning'
    },
    showClose: {
      type: Boolean,
      default: false
    },
    iconShow: {
      type: Boolean,
      default: true
    }
  },
  data () {
    return {
      show: true
    }
  }
}
</script>
