<template>
  <div v-loading="loading">
    <div class="white-box">
      <el-table class="withdraw-table" :data="tableData" style="width: 100%;" :span-method="objectSpanMethod">
        <el-table-column label="商品编号" prop="SKU_CODE"></el-table-column>
        <el-table-column label="商品名称" prop="GOODS_TITLE"></el-table-column>
        <el-table-column label="数量" prop="BUY_NUMS"></el-table-column>
        <el-table-column label="会员价格">
          <template slot-scope="props">
            {{ props.row.REAL_PRICE * props.row.BUY_NUMS }}
          </template>
        </el-table-column>
        <el-table-column label="会员PV">
          <template slot-scope="props">
            {{ props.row.REAL_PV * props.row.BUY_NUMS }}
          </template>
        </el-table-column>
        <el-table-column label="订单编号" prop="SN"></el-table-column>
        <el-table-column label="会员编号" prop="USER_NAME"></el-table-column>
        <el-table-column label="会员姓名" prop="REAL_NAME"></el-table-column>
        <el-table-column label="收货人" prop="CONSIGNEE"></el-table-column>
        <el-table-column label="收货电话" prop="MOBILE"></el-table-column>
        <el-table-column label="支付时间" prop="PAY_AT"></el-table-column>
        <el-table-column label="订单类型" prop="ORDER_TYPE"></el-table-column>
        <el-table-column label="支付类型" prop="PAY_TYPE"></el-table-column>
      </el-table>
      <div class="white-box-footer">
        <pagination :total="totalCount" :page_size="pageSize" @size-change="handleSizeChange" @current-change="handleCurrentChange"></pagination>
      </div>
    </div>
  </div>
</template>

<script>
    import network from '@/utils/network'
    import tool from '@/utils/tool'
    import Pagination from '@/components/Pagination'
    export default {
        name: "order-list",
        components: {Pagination},
        mounted() {
            this.getData();

        },
        data() {
            return {
                loading: false,
                form:{

                },
                tableData:null,
                list: null,
                currentPage: 1,
                totalPages: 1,
                totalCount: 1,
                pageSize: 20,
                tool: tool,
                //订单号判断
                spanArr: [], // 用于存放需要合并的行的个数
                pos: 0, // 记录spanArr数组的下标


            }
        },


        methods: {

  //
      objectSpanMethod(obj) {

        if (obj.columnIndex >= 5) {
          // ⼆维数组存储的数据取出
          var _row = this.spanArr[obj.rowIndex];
          var _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col,
          };
        } else {
          return false;
        }
      },
      getSpanArr(orderList) {//传⼊你的列表数据
        this.pos = 0;
        orderList.forEach((item, index) => {

          //判断是否是第⼀项
          if (index === 0) {
            this.spanArr.push(1);
            this.pos = 0;
          } else {
            //不是第⼀项时，就根据标识去存储
            if (//orderSn，createdAt...是你的第⼀个数据、第⼆个数据...

              orderList[index].ORDER_SN === orderList[index - 1].ORDER_SN &&
              orderList[index].USER_NAME === orderList[index - 1].USER_NAME &&
              orderList[index].REAL_NAME === orderList[index - 1].REAL_NAME &&
              orderList[index].CONSIGNEE === orderList[index - 1].CONSIGNEE &&
              orderList[index].MOBILE === orderList[index - 1].MOBILE &&
              orderList[index].PAY_AT === orderList[index - 1].PAY_AT
            ) {
              // 查找到符合条件的数据时每次要把之前存储的数据+1
              this.spanArr[this.pos] += 1;
              this.spanArr.push(0);
            } else {
              // 没有符合的数据时，要记住当前的index
              this.spanArr.push(1);
              this.pos = index;
            }
          }
        });
      },






            handleCurrentChange (page) {
                this.getData(page, this.pageSize)
            },
            handleSizeChange (pageSize) {
                this.getData(this.currentPage, pageSize)
            },
            getData(page, pageSize) {
                 this.spanArr = [];
                 this.pos = 0;
                let _this = this
                network.getPageData(_this, 'shop/order-list', page, pageSize, {type: this.type}, function (response) {

                    _this.loading = false;

                    _this.list = response.list;

                    let settingObj=_this.list;

                    let settingArr = Object.keys(settingObj).map(key => {

                        //console.log(key); //为每个键名
                        return settingObj[key];  //把每个对象返回出去生成一个新的数组中相当于0:{id:1}
                    } );

                    _this.tableData=settingArr;
                   // console.log('11111',_this.tableData);
                    _this.getSpanArr(_this.tableData);


                });
            },
        }
    }
</script>
<style scoped>

</style>
