<template>
	<view>
		<cu-custom bgColor="bg-blue"  :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content"> 报名信息</block>
			<block slot="right" >已报名 {{dataList.length}} 人</block>
		</cu-custom>
		<view>
			<view class="uni-container">
				<uni-table ref="table" :loading="loading" stripe  emptyText="暂无更多数据" @selection-change="selectionChange">
					<uni-tr >
						<uni-th style="width: 50px;" @filter-change="searchChangeHandle"   field="awardsName" @sort-change="sortChangeHandle"  align="center">序号</uni-th>
						<uni-th @filter-change="searchChangeHandle"   field="awardsName" @sort-change="sortChangeHandle"  align="center">姓名</uni-th>
						<uni-th @filter-change="searchChangeHandle"   field="companyName" @sort-change="sortChangeHandle"  align="center">公司</uni-th>
						<uni-th @filter-change="searchChangeHandle"   field="prizeName" @sort-change="sortChangeHandle"  align="center">部门</uni-th>
						<uni-th @filter-change="searchChangeHandle"   field="number"  @sort-change="sortChangeHandle"  align="center">手机号</uni-th>
					</uni-tr>
					<uni-tr v-for="(row, index) in dataList" :key="index">
						<uni-td align="center"><span><b>{{row.serialNumber}}</b></span></uni-td>
						<uni-td align="center">{{row.name}}</uni-td>
						<uni-td align="center">{{row.companyName}}</uni-td>
						<uni-td align="center">{{row.officeName}}</uni-td>
						<uni-td align="center">{{row.phone}}</uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</view>
		</view>
</template>

<script>
  import uniFab from '@/components/uni-fab/uni-fab.vue';
  import TestMobileService from '@/api/test/luckyDraw/LuckyDrawService'
  export default {
	onShow(option) {
		
	},
	components:{
		uniFab
	},
    data () {
      return {
		  eventId: '',
        searchForm: {},
        dataList: [], // 数据列表
        tablePage: {
          total: 0,
          currentPage: 1,
          pageSize: 10,
          orders: []
        },
        loading: false
      }
    },
    testMobileService: null,
	onLoad(option) {
	  this.testMobileService = new TestMobileService()
			let { eventId } = option
	  this.refreshList(eventId)
		this.eventId = eventId;
	},
    methods: {
	  /*获取数据列表 */
	  refreshList(eventId) {
	    this.loading = true
	    this.testMobileService.appShowList({
	  	  'current': this.tablePage.currentPage,
	  	  'size': this.tablePage.pageSize,
	  	  'orders': this.tablePage.orders,
	  	  'eventId': eventId,
	  	  ...this.searchForm
	  	}).then((data) => {
	  	  this.dataList = data.records
	  	  this.tablePage.total = data.total
	  	  this.loading = false
	  	})
	  	
	  },
	  // 排序
	  sortChangeHandle (column) {
	  	this.tablePage.orders = []
	  	if (column.order != null) {
	  	  this.tablePage.orders.push({column: this.$utils.toLine(column.property), asc: column.order === 'ascending'})
	  	}
	  	this.refreshList()
	  },
	// 检索
	  searchChangeHandle (column) {
		this.searchForm[column.property] = column.filter
		this.refreshList()
	  },
	// 分页触发
	  currentChangeHandle (e) {
		this.tablePage.currentPage = e.current
		this.refreshList()
	  }
    }
  }
</script>

