<template>
  <a v-if="value">{{ currency }}</a>
  <span v-else />
</template>

<script>
export default {
  name: 'CurrencyCell',
  props: {
    column: Object,
    value: [String, Number]
  },
  computed: {
    currency() {
      try {
        return isNaN(this.value)
          ? this.value
          : new Intl.NumberFormat(this.currencyMeta.currency_locale || 'en-US',
            { style: 'currency', currency: this.currencyMeta.currency_code || 'USD' })
            .format(this.value)
      } catch (e) {
        return this.value
      }
    },
    currencyMeta() {
      return {
        currency_locale: 'en-US',
        currency_code: 'USD',
        ...(this.column && this.column.meta
          ? this.column.meta
          : {})
      }
    }
  }
}
</script>

<style scoped>

</style>
