1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

    <!-- 列表 -->
    <el-table v-loading="loading"
              :data="list"
              row-key="appOrderNo"
              default-expand-all
              :tree-props="{children: 'children'}"
    >
      <el-table-column type="index" label="序号" width="55" prop="parentIndex">

        <template slot-scope="scope">
          <span v-if="scope.row.isIndex ">{{scope.row.parentIndex}}</span>
        </template>

      </el-table-column>
      <el-table-column label="订单号" align="center" prop="appOrderNo" />
      <el-table-column label="交易时间" align="center" prop="createTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
      ....
    </el-table>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

/** 查询列表 */
getList() {
  this.loading = true;
  // 处理查询参数
  let params = {...this.queryParams};
  this.addBeginAndEndTime(params, this.dateRangeCreateTime, 'createTime');
  // 执行查询
  getPayOrderPage(params).then(response => {
    this.list = response.data.list;
    //计算序号，标注父标签
    this.list.forEach((item, index) => {
      item.isIndex = true;
      const {pageSize, pageNo} = this.queryParams;      // rows列数   page  页码
      item.parentIndex =  index + pageSize * (pageNo - 1) + 1
      // item.parentIndex = index + 1;
    });
    this.total = response.data.total;
    this.loading = false;
  });
}