<template>
  <div class="totalwrap">
    <p>
      <span class="totalbgname">总计</span>
      <span v-for="item in this.$util.formatNumArr(totalNum)" :class="item !== ',' ? 'totalbg' : 'totalnobg' ">{{item}}</span>
    </p>

  </div>
</template>

<script>

export default {
  name: 'total',
  props: {
    totalNum: String
  },
  data() {
    return {
      // initnum: this.$util.formatNumArr(this.totalNum)
    }

  }
}
</script>

<style scoped>
  .totalwrap {
    height: 72px;
    padding: 23px 0  23px 23px;
    box-sizing: border-box;
    color: #fff;
    font-size:14px;
    font-weight:500;
  }
  .totalwrap p{
    height: 29px;
    line-height: 29px;
  }
  .totalbgname{
    padding-right: 10px;
  }
  .totalbg {
    width: 20px;
    height: 29px;
    margin-right: 3px;
    display: inline-block;
    text-align: center;
    line-height: 29px;
    font-size: 22px;
    background: url("../assets/img/totalbg.svg") no-repeat;
  }
  .totalnobg{
    display: inline-block;
    margin-right: 3px;
    font-size: 22px;
  }
</style>
