<template>
  <div class="c-latestBlocks">
    <div class="top flex items-center justify-between px-3.5">
      <div class="text-darkBlue text-sm font-bold">
        {{ $t('lang.latestTx') }}
      </div>
      <div
        class="text-footer-color text-xs"
        @click="$router.push('/tradeList')"
      >
        {{ $t('lang.viewMore') }}
      </div>
    </div>
    <m-tx-item
      v-for="(n, i) in latestTxs"
      :key="i"
      :row="n"
      :blockTime="n.time_block"
      :amount="n.amount"
      :txHash="n.hash"
      :from="n.from"
      :hideStatus="true"
      :to="n.to"
    ></m-tx-item>
  </div>
</template>
<script lang="ts">
import Vue, { PropType } from 'vue'
import mTxItem from './m-txItem.vue'
export default Vue.extend({
  components: { mTxItem },
  props: {
    latestTxs: Array as PropType<any[]>,
  },
})
</script>
<style lang="scss" scoped>
.c-latestBlocks {
  .top {
    height: 50px;
    background: #ffffff;
    border-radius: 2px;
  }
}
</style>
