<template>
  <u-button size="small" :active="active" :suffix-icon="icon" v-on="$listeners"><slot></slot></u-button>
</template>
<script>
import UButton from '@uif/hq/src/components/button'

export default {
  name: 'u-button-sort',
  components: {UButton},
  props: {
    active: {
      type: Boolean,
      default: false
    },
    isAsc: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
    }
  },
  computed: {
    icon () {
      if (this.active && this.isAsc) {
        return 'sort-icon sort-icon-asc'
      } else if (this.active) {
        return 'sort-icon sort-icon-desc'
      }
      return 'sort-icon'
    }
  },
  mounted () {
  },
  methods: {
    handleClick (event) {
      this.$emit('click', event)
    }
  }
}
</script>
