<style scoped>
	.flex{
		display: flex;
	}
	.con {
		width: 100%;
		height: 100vh;
		background-color: #FFF;
		box-sizing: border-box;
		padding-bottom: 90rpx;
	}
	.nowrap{
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.mr{
		margin-right: 10rpx;
	}
	.btn {
		/* width: 100%; */
		/* height: 45px; */
		padding: 0rpx 30rpx;
		border-radius: 10rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: PingFang SC;
		color: #EEEEEE;
	}
</style>

<template>
	<view class="con">
		<uni-table border stripe emptyText="暂无数据" >
		    <!-- 表头行 -->
		    <uni-tr class="header">
		        <uni-th align="center" width="100">姓名</uni-th>
				<uni-th align="center" width="100">手机号</uni-th>
		        <uni-th align="center" width="80">状态</uni-th>
				<uni-th align="center" width="auto">操作</uni-th>
		    </uni-tr>
		    <!-- 表格数据行 -->
		    <uni-tr v-for="(item,index) in data" :key="index">
		        <uni-td align="center">
					<view class="nowrap">
						{{item.LinkMan}}
					</view>
				</uni-td>
		        <uni-td align="center">{{item.LinkTel}}</uni-td>
		        <uni-td align="center">
					<view class="nowrap">
						<text v-if="item.IsRollCall==1">未到</text>
						<text v-if="item.IsRollCall==2">已到</text>
					</view>
				</uni-td>
				<uni-td align="center">
					<view class="flex" v-if="item.IsCommission!=2">
						<view class="btn mr nowrap" :style="{'background-color':mainColor}" @click="SignIn(item,2)">
							已到
						</view>
						<view class="btn nowrap" style="color: #999;" :style="{'border': `1rpx solid ${mainColor}`}" @click="SignIn(item,1)">
							未到
						</view>
					</view>
				</uni-td>
		    </uni-tr>
		</uni-table>
	</view>
</template>

<script>
	import uniTable from './tableComponents/uni-table/uni-table.vue'
	import uniTr from './tableComponents/uni-tr/uni-tr.vue'
	import uniTh from './tableComponents/uni-th/uni-th.vue'
	import uniTd from './tableComponents/uni-td/uni-td.vue'
	export default {
		components:{
			uniTable,
			uniTr,
			uniTh,
			uniTd
		},
		data() {
			return {
				pageTitle: "点名列表",
				mainColor: '',
				scrollTop: 0,
				ActivityId: 0,
				data:[],
			};
		},
		created() {
			this.mainColor = this.$uiConfig.mainColor;
		},
		mounted() {
			uni.setNavigationBarTitle({
				title: this.pageTitle,
			});

		},
		onLoad(option) {
			this.ActivityId = option.ActivityId
			this.GetRollCallConsultList();
		},
		methods: {
			GetRollCallConsultList() {
				this.request2({
						url: '/api/AppletEducation/GetRollCallConsultList',
						data: {
							ActivityId: this.ActivityId
						}
					},
					res => {
						if(res.resultCode===1){
							this.data=res.data
						}
					}
				);
			},
			SignIn(item,i){
				let newItem=JSON.parse(JSON.stringify(item))
				newItem.IsRollCall=i
				let that=this
				this.request2({
						url: '/api/AppletEducation/GetUpdateRollCallConsultList',
						data: [newItem]
					},
					res => {
						if(res.resultCode===1){
							uni.showToast({
								title:"操作成功",
								icon:"success"
							})
							that.GetRollCallConsultList();
						}else{
							uni.showToast({
								title:res.message,
								icon:"error"
							})
						}
					}
				);
			}
		},
	};
</script>
