<template>
	<view>
		<view class="wBox">
			<view class="tt">考级基本信息</view>
			<view class="ddd">
				<text class="lab">考级名称：</text>{{ form.name }}
			</view>
			<view class="ddd">
				<text class="lab">申请日期：</text>{{form.applyTime}}
			</view>
			<view class="ddd">
				<text class="lab">申请单位：</text>{{ form.memberName }}
			</view>
			<view class="ddd">
				<text class="lab">考官：</text>{{form.examinerNames?.split('，').join('/')}}
			</view>
			<view class="ddd">
				<text class="lab">考试开始时间：</text>{{form.startTime}}
			</view>
			<view class="ddd">
				<text class="lab">考试结束时间：</text>{{form.endTime}}
			</view>
			<view class="ddd">
				<text class="lab">考级地点：</text>{{form.address}}
			</view>
			<view class="ddd" v-if="app.globalData.showPrice">
				<text class="lab">总金额：</text>{{(form.totalAmount*1).toFixed(2) }}
			</view>
		</view>
		<view class="wBox">
			<view class="tt">
				考生信息
			</view>
			<view class="vipData">
				<view>共 <text>{{ tablePersonInfo.total }}</text>人</view>
				<view v-for="l in tablePersonInfo.levelArr" :key="l.level">
					{{ szToHz(l.level) }}级: <text>{{ l.num }} </text>人
				</view>
			</view>
			<view class="userlist">
				<view class="item" v-for="n in list" style="background-color: #fffafa;">
					<view class="w100">
						<view class="name">{{n.realName}} <text>{{n.memName}}</text></view>
						<!-- <view class="date">{{n.idcTypeStr}}：{{n.idcCode}}</view> -->
						<view class="flexbox">
							<view>
								原有级别
								<text v-if="n.levelOld">{{ szToHz(n.levelOld) }}级</text>
								<text v-else>十级</text>
							</view>
							<view>
								考试级别
								<text>
									{{ szToHz(n.levelNew) }}级
								</text>
							</view>
							<view v-if="app.globalData.showPrice">
								金额
								<text>
									{{ (n.examFee * 1).toFixed(2) }}
								</text>
							</view>
							<view>
								是否通过
								<text v-if="n.isPass=='1'" class="text-success">通过</text>
								<text v-else class="text-danger">未通过</text>
							</view>
						</view>
					</view>
		
				</view>
			</view>

		</view>
		<view class="wBox">
			<view class="tt">
				审核信息
			</view>
			<view>
				<view class="stepItem" v-for="(n,index) in recordList">
					<view class="time">{{n.handleDate||'待审批'}}</view>
					<view class="content">
						<view class="status">
							<text :class="{
                  'text-success':n.auditStatus=='1',
                  'text-danger':n.auditStatus=='2',
                  'text-warning':n.auditStatus=='3'
                }">{{ n.auditStatusStr }}</text>
						</view>
						<!-- <view class="name">第 {{index+1}} 步</view> -->
						<view class="deptName">{{n.deptName}}</view>
						<view v-if="n.auditStatus==2">
							备注：{{n.reason||'/' }}
						</view>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script setup>
	import * as api from '@/common/api.js'
	import config from '@/config.js'
	import _ from 'lodash'
	import {
		onMounted,
		ref
	} from 'vue'
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app'
	const app = getApp();
	const deptType = ref('')
	const form = ref({})
	const tablePersonInfo = ref({})
	const recordList = ref([])
	const list = ref([])
	let examId = ''
	onLoad((option) => {
		examId = option.examId
	})
	onShow(() => {
		if (app.globalData.isLogin) {
			init()
		} else {
			app.firstLoadCallback = () => {
				init()
			};
		}
	})

	function init() {
		uni.showLoading({
			title: '加载中'
		})
		deptType.value = app.globalData.deptType
		getForm()
		getRecordList()
		getTablePersonInfo()
	}

	function getForm() {
		api.getLevelApplyInfo(examId).then(res => {
			uni.hideLoading()
			form.value = res.data
		})
	}

	function getRecordList() {
		api.getApprovalRecord(examId).then(res => {
			recordList.value = res.data.levelSteps
		})
	}
	function getTablePersonInfo() {
		api.getStudentList({        
			examId: examId
		}).then(res=>{
			list.value = res.rows
			
			  const total = list.value.length
			  const levelArr = []
			  _.each(list.value, (d) => {
			    const temp = _.find(levelArr, (l) => {
			      return l.level == d.levelNew
			    })
			    if (temp) {
			      temp.num++
			    } else {
			      levelArr.push({
			        level: d.levelNew,
			        num: 1
			      })
			    }
			  })
			
			  tablePersonInfo.value = {
			    total: total,
			    levelArr: _.sortBy(levelArr, (l) => {
			      return l.level
			    })
			  }
		})
	}
	function szToHz(num) {
	  const hzArr = ['〇', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
	  return hzArr[parseInt(num)]
	}
</script>

<style scoped>
	.wBox {
		width: 700rpx;
		padding: 30rpx;
		margin: 20rpx auto;
		background: #FFFFFF;
		box-shadow: 0rpx 12rpx 116rpx 0rpx rgba(196, 203, 214, 0.1);
		border-radius: 15rpx;

		.tt {
			color: #0A1629;margin: 0 0 30rpx;
			font-size: 30rpx;
		}
		
		.ddd{font-size: 28rpx;color: #333;
			.lab{color: #999;display: inline-block;text-align: justify;}
		}
	}

</style>