<template>
  <div class="statistics-wrapper" v-loading="loading">
    <statistics-card
      style="flex: 1"
      :value="0"
      label="设备总数"
      icon="el-icon-s-order"
      start-color="#409EFF"
      end-color="#53a8ff"
    />
    <statistics-card
      style="flex: 1"
      :value="0"
      label="订单数"
      icon="el-icon-check"
      start-color="#67C23A"
      end-color="#85ce61"
    />
    <statistics-card
      style="flex: 1"
      :value="0"
      label="订单金额"
      icon="el-icon-check"
      start-color="#67C23A"
      end-color="#85ce61"
    />
    <statistics-card
      style="flex: 1"
      :value="0"
      label="分成金额"
      icon="el-icon-check"
      start-color="#67C23A"
      end-color="#85ce61"
    />
    <statistics-card
      style="flex: 1"
      :value="0"
      label="账户余额"
      icon="el-icon-check"
      start-color="#67C23A"
      end-color="#85ce61"
    />
  </div>
  
</template>

<script>
import StatisticsCard from '@/components/StatisticsCard'

export default {
  name: 'UserStatistics',
  components: {
    StatisticsCard
  },
  props: {
    userId: {
      type: String,
      default: null,
    }
  },
  data() {
    return {
      loading: false,
    }
  },
  created() {
    this.getBrief()
  },
  methods: {
    getBrief() {
      
    }
  }
}
</script>

<style lang="scss" scoped>
.statistics-wrapper{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}
.statistics-title {
  margin-bottom: 8px;
  div {
    font-size: 14px;
    color: #333;
  }
}
</style>