boss/pages/main/index/user_bills.vue

<template>
  <div>
    <div class="user-name">用户：开发者大汪(123132)</div>
    <div class="user-info">订单数量：100（支付成功 50），收入金额：123.45元（成功 34.45元），支出金额：543.21元（成功 43.21元），当前余额 1000.00元</div>
    <el-table
      :data="tableData" border
      style="width: 100%">
      <el-table-column
        prop=""
        label="订单名称">
      </el-table-column>
      <el-table-column
        prop=""
        label="实际金额">
      </el-table-column>
      <el-table-column
        prop=""
        label="当前余额">
      </el-table-column>
      <el-table-column
        prop=""
        label="支付方式">
      </el-table-column>
      <el-table-column
        prop=""
        label="订单状态">
      </el-table-column>
      <el-table-column
        prop=""
        label="创建时间">
      </el-table-column>
      <el-table-column
        prop=""
        label="订单编号">
      </el-table-column>
      <el-table-column
        prop=""
        label="人工">
      </el-table-column>
      <el-table-column
        prop=""
        label="备注说明">
      </el-table-column>
    </el-table>
    <div class="order-footer">
      <el-pagination
        background
        @current-change="getTableData"
        @size-change="changePageSize"
        :current-page.sync="currentPage"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="20"
        layout="total, sizes, prev, pager, next, jumper"
        :total="totalCount"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  
}
</script>

<style lang="scss" scoped>
  .user-name {
    margin-bottom: 10px;
  }

  .user-info {
    margin-bottom: 10px;
  }

  .order-footer {
    position: absolute;
    bottom: 10px;
    left: 10px;
  }
</style>