<template>
	<div>
		<el-dialog :title='this.title+"试卷"' :visible="visible" :before-close="handleClose" :close-on-click-modal="false"
			custom-class="bbsl-location-dialog" top='5vh' width="70%">
			<div>
				<el-steps :active="isActive" finish-status="success" simple>
					<el-step title="试卷信息">
					</el-step>
					<el-step title="开始组卷"></el-step>
				</el-steps>

				<el-form ref="formInfo" label-position="top" :model="this.params" label-width="150px" :rules="rules">
					<div v-if="isActive==0">
						<!-- 试卷信息 -->
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item label="试卷名称" prop="name">
									<el-input v-model="params.name" clearable placeholder="请输入试卷名称"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="考试课目" prop="subjectId">
									<el-select v-model="subject" multiple placeholder="请选择课目" @change="selectSubject"
										v-on:click.native="subjectDUsers" style="width:100%">
										<el-option v-for="(item,index) in subjectList" :key="index" :label="item.name"
											:value="item.id">
										</el-option>
									</el-select>
									<!-- <el-cascader v-model="params.subjectId" :options="subjectlist" clearable filterable
										:props="{ value: 'id', label: 'name', checkStrictly: true }" style="width: 100%"
										@change="handleChange">
									</el-cascader> -->
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="考试时长" prop="timeLength">
									<el-input v-model="params.paperSetting.timeLength" clearable
										placeholder="请输入考试时长(分钟)">
									</el-input>

								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="24">
							<el-col :span="8">
								<el-form-item label="总分数" prop="totalScore">
									<el-input v-model="params.totalScore" placeholder="请输入及格分数"></el-input>
									</el-input>
								</el-form-item>
							</el-col>
							<el-col :span="8">
								<el-form-item label="及格分数" prop="passScore">
									<el-input v-model="params.paperSetting.passScore" placeholder="请输入及格分数"></el-input>
									</el-input>
								</el-form-item>
							</el-col>

						</el-row>
					</div>
					<!-- 开始组卷 -->
					<div v-if="isActive==1">
						<el-row :gutter="24">
							<el-col>
								<el-form-item label="组卷类型" prop="">
									<div style="display: flex;">
										<div class="typeBtn" :class="{'btnActive':params.wayType==item.value}"
											v-for="(item,index) in zjfsList" :key="index" @click="changeType(item)">
											{{item.name}}
										</div>
									</div>
								</el-form-item>
							</el-col>
						</el-row>
						<el-button v-if="params.wayType==1||params.wayType==3" size="mini" type="primary"
							style="margin-bottom: 5px;" plain @click="addRandom"><i class="el-icon-plus"></i>添加
						</el-button>
						<el-button v-if="params.wayType==2" size="mini" type="primary" style="margin-bottom: 5px;" plain
							@click="addTopic"><i class="el-icon-plus"></i>添加</el-button>
						<!-- 配置出卷弹框 -->
						<configurationDIalog v-if="confVisible" :confVisible="confVisible" :subjectlist="subjectList"
							:paperQuestionSettings="params.paperQuestionSettings" @closeFormDiao="closeFormDiao"
							@questions="testQuestions"></configurationDIalog>
						<div v-if="params.wayType==1||params.wayType==3">
							<el-table :data="params.paperQuestionSettings" border style="width: 100%">
								<el-table-column type="index" width="50"></el-table-column>
								<el-table-column label="课目" prop="subjectName"></el-table-column>
								<el-table-column label="题型" prop="questionName"></el-table-column>
								<el-table-column label="题目总数量" prop="totalNumuber"></el-table-column>
								<el-table-column label="题目数量" prop="numuber">
									<template #default="scope">
										<el-input-number v-model="scope.row.numuber" controls-position="right"
											@change="handleNumber(scope.row.numuber,scope.row.totalNumuber)" :min="1"
											:max="Number(scope.row.totalNumuber)"></el-input-number>
									</template>
								</el-table-column>
								<el-table-column label="分数" prop="score">
									<template #default="scope">
										<el-input-number v-model="scope.row.score" controls-position="right" :min="1">
										</el-input-number>
									</template>
								</el-table-column>
								<el-table-column label="删除" width="60">
									<template #default="scope">
										<el-button type="danger" @click="delSubject(scope.$index)" icon="el-icon-delete"
											plain circle></el-button>
									</template>
								</el-table-column>
							</el-table>
							<div class="combined">
								<span v-if="totalScore>params.totalScore"
									style="color: red;font-weight: 100;">(当前选择分数超出配置总分数)</span>
								总分数：<span :style="{'color': totalScore>params.totalScore?'red':''}">
									{{totalScore}}
								</span>
							</div>
						</div>
						<div class="disposition" v-if="params.wayType==2&&params.paperQuestionSettings.length>0">
							<div class="itemBox" v-for="(x,xi) in this.params.paperQuestionSettings">
								<div class="topic">
									<div class="topic-left">
										<div>{{xi+1}}/{{params.paperQuestionSettings.length}}</div>
										<div>{{x.questionTypeName}}</div>
										<span v-html="x.questionsInfo?x.questionsInfo.question:''"></span>
									</div>
									<div class="topic-right">
										<div>{{x.score}}分</div>
										<div @click="anShrinkage(x,xi)">
											{{x.isShrink?'收缩':'展开'}}
											<i class="el-icon-arrow-down" v-if="!x.isShrink"></i>
											<i class="el-icon-arrow-up" v-if="x.isShrink"></i>
										</div>
									</div>
								</div>
								<div class="details" v-if="x.isShrink">
									<div v-if="x.questionType==1||x.questionType==2||x.questionType==3">
										<div v-for="(o,oi) in x.questionsInfo.options"
											style="display: flex;align-items: center;">
											{{o.optionKey}}、<span v-html="o.optionContent"></span>
										</div>
									</div>
									<div class="correct"
										v-if="x.questionType==1||x.questionType==2||x.questionType==3||x.questionType==4">
										正确答案：
										<!-- <span v-if="x.questionType==3">{{x.questionsInfo.rightOption==0?'对':'错'}}</span> -->
										<span>{{x.questionsInfo.rightOption}}</span>
									</div>
									<div class="parsing">
										题目解析：<span
											v-html="x.questionsInfo.parsing?x.questionsInfo.parsing:'无解析'"></span>
									</div>
								</div>
								<div class="tally">
									标签：<el-button type="info" round plain size='mini'>
										{{x.questionsInfo?x.questionsInfo.difficultyName:''}}
									</el-button>
								</div>
								<div class="footer">
									<div>更新时间：{{x.questionsInfo?x.questionsInfo.createTime:''}}</div>
									<div style="width: 30px;text-align: center;" @click="deleteTopic(xi)"><i
											style="color: red;" class="el-icon-delete"></i></div>
								</div>
							</div>
							<div class="combined" v-if="params.wayType==2&&params.paperQuestionSettings.length>0">
								总分数：
								<span :style="{'color': configScore>params.totalScore?'red':''}">
									{{configScore}}
								</span>
							</div>
						</div>

					</div>
				</el-form>
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" v-if="isActive>0" @click="lastStep">上一步</el-button>
				<el-button type="primary" v-if="isActive==0" @click="nextStep">下一步</el-button>
				<el-button type="primary" v-else @click="nextStep">确 定</el-button>
				<el-button @click="handleClose">取 消</el-button>
			</span>
		</el-dialog>
		<subjectDialog ref="subjectDialog" @getUser="getUser"></subjectDialog>
		<randomDialog ref="randomDialog" @getRandom="getRandom"></randomDialog>
	</div>
</template>

<script>
import dictUtils from '@/components/dict/DictSelectUtils.js'
import paperMenu from '@/api/examination/paperMenu.js'
import mnsjMenu from '@/api/examination/mnsjMenu.js'
import configurationDIalog from '@/views/examKhMenu/examMenu/components/configurationDIalog.vue'
import subjectDialog from '@/views/examKhMenu/examMenu/components/subjectDialog.vue'
import randomDialog from '@/views/examKhMenu/examMenu/components/randomDialog.vue'

export default {
		props: {
			subjectlist: {
				type: Array,
				default: () => []
			},
		},
		components: {
			configurationDIalog,
			subjectDialog,
			randomDialog
		},
		name: 'paperMenuDialog',
		data() {
			return {
				querys: [{
					group: 'main',
					operation: 'LIKE',
					parentGroup: '',
					property: 'u.fullname_',
					relation: 'AND',
					value: ''
				}, ],
				visible: false,
				confVisible: false, //二级弹框
				activeCollapse1: '1',
				ctlTypeList: '',
				isActive: 0,
				parameter: {},
				params: {
					name: '',
					subjectId: '',
					wayType: 1,
					paperQuestionSettings: [],
					totalScore: 100,
					paperSetting: {
						timeLength: null,
						passScore: null
					}

				},
				subject: [],
				subjectList: [],
				btnBisabled: true,
				rules: {
					name: [{
						required: true,
						message: '请输入试卷名称',
						trigger: 'blur',
					}, ],

					subjectId: [{
						required: true,
						message: '请选择考试课目',
						trigger: 'blur',
					}, ],
					totalScore: [{
						required: true,
						message: '请输入总分数',
						trigger: 'blur',
					}, ],
					timeLength: [{
						required: true,
						message: '请输入考试时长',
						trigger: 'blur',
					}, ],
				},
				testUserList: [{
					name: '所有人',
					value: '1'
				}, {
					name: '用户',
					value: '2'
				}],
				//随机组卷
				data: [],
				queryParam: {
					pageBean: {
						page: 1,
						pageSize: 10,
					}
				},
				ruleForm: {
					startTime: '', // 开始时间
					endTime: '', // 结束时间
				},
				// 禁用今天之前的时间
				pickerOptionsOne: {
					disabledDate(time) {
						return time.getTime() < Date.now() - 8.64e7
					},
				},
				// 禁用今天之前的时间 + 禁用第一个时间选择框选择的小时之前的时间
				pickerOptionsTwo: {
					selectableRange: [],
					disabledDate(time) {
						return time.getTime() < Date.now() - 8.64e7
					},
				},


				title: '',
				search: '',
				search1: '',
				EquipmentList: [],
				multipleSelection: [],
				multipleSelection1: [],
				defaultProps: {
					children: 'children',
					label: 'name'
				},
				selectUserProps: {
					label: "userName"
				},
				nameArr: [],
				typeList: [{
						name: '正在考试',
						value: 0
					},
					{
						name: '模拟考试',
						value: 1
					}

				],



				subjectsList: [],
				topicList: [], //题目类型
				stndList: [], //试题难度
				ksfsList: [], //考试方式
				isShrink: false, //展开
				//考生确认
				total: 0,
				jobsList: [], //岗位树
				subjectUser: {
					majorIds: [],
					subjectIds: []
				},
				roomList: [], //考场列表
			}
		},
		computed: {
			totalScore() {
				let totalScore = 0
				this.params.paperQuestionSettings.forEach(p => {
					totalScore += p.numuber * p.score
				})
				return totalScore
			},
			configScore() {
				let configScore = 0
				this.params.paperQuestionSettings.forEach(s => {
					configScore += Number(s.score)
				})
				return configScore
			}
		},
		watch: {
			// 监听计算属性里面的endTime
			endTime: {
				handler: function(val, oldVal) {
					this.pickerOptionsTwo.selectableRange = val
				},
				deep: true,
			}
		},

		created() {
			this.zjfsList = dictUtils.getDictItemsFromCache('zjfs')
			this.zjfsList.pop()
			this.topicList = dictUtils.getDictItemsFromCache('sttx')
			this.stndList = dictUtils.getDictItemsFromCache('stnd')
			this.ksfsList = dictUtils.getDictItemsFromCache('ksfs')
			this.getOrgPostPage()
			this.pagingQuery()
		},
		mounted() {},
		methods: {
			add(val) {
				this.visible = true
				this.parameter = val
				this.title = '新增'
			},
			edit(val) {
				this.visible = true
				this.title = '修改'
				this.$nextTick(() => {
					mnsjMenu.detailId(val.id, res => {
						if (res) {
							this.params = res
							this.subjectList = this.params.subjectInfos
							this.subjectList.forEach(s => {
								this.subject.push(s.id)
							})
							if (this.params.wayType == 1 || this.params.wayType == 3) {
								this.params.paperQuestionSettings.forEach(p => {
									this.subjectList.forEach(s => {
										if (s.id == p.subjectId) {
											p.subjectName = s.name
										}
									})
									this.topicList.forEach(t => {
										if (t.value == p.questionType) {
											p.questionName = t.name
										}
									})
								})
							}
							if (this.params.wayType == 2) {
								this.params.paperQuestionSettings.forEach(e => {
									e.isShrink = false
									this.topicList.forEach(t => {
										if (e.questionType == t.value) {
											e.questionTypeName = t.name
										}
									})
									this.stndList.forEach(s => {
										if (e.questionsInfo.difficulty == s
											.value) {
											e.questionsInfo.difficultyName = s.name
										}
									})
								})
							}
						}
					})
				})

			},
			//复制试卷
			copy(val) {
				this.visible = true
				this.title = '复制'
				this.$nextTick(() => {
					mnsjMenu.detailId(val.id, res => {
						if (res) {
							this.params = res
							delete this.params.id
							this.subjectList = this.params.subjectInfos
							this.subjectList.forEach(s => {
								this.subject.push(s.id)
							})
							delete this.params.paperSetting.id
							delete this.params.paperSetting.paperId
							delete this.params.pkVal
							if (this.params.wayType == 1 || this.params.wayType == 3) {
								this.params.paperQuestionSettings.forEach(p => {
									delete p.paperBaseId
									delete p.id
									this.subjectList.forEach(s => {
										if (s.id == p.subjectId) {
											p.subjectName = s.name
										}
									})
									this.topicList.forEach(t => {
										if (t.value == p.questionType) {
											p.questionName = t.name
										}
									})
								})
							}
							if (this.params.wayType == 2) {
								this.params.paperQuestionSettings.forEach(e => {
									delete e.paperBaseId
									delete e.id
									e.isShrink = false
									this.topicList.forEach(t => {
										if (e.questionType == t.value) {
											e.questionTypeName = t.name
										}
									})
									this.stndList.forEach(s => {
										if (e.questionsInfo.difficulty == s
											.value) {
											e.questionsInfo.difficultyName = s.name
										}
									})
								})
							}
						}
					})
				})
			},
			pagingQuery() {
				paperMenu.pagingQuery({
					pageBean: {
						page: -1,
						pageSize: 10,
						showTotal: true
					}

				}, res => {
					if (res) {
						this.roomList = res.rows
						// console.log(this.roomList);
					}
				})
			},
			// 关闭新增人员窗口
			handleClose() {
				this.params = {
					name: '',
					subjectId: '',
					wayType: 1,
					paperQuestionSettings: [],
					paperSetting: {
						testUserType: 1
					}
				}
				this.isActive = 0
				this.subject = []
				this.subjectList = []
				this.visible = false
			},
			// 确认后不关闭弹框
			addClose() {
				this.params = {
					name: '',
					wayType: 1,
					subjectId: '',
					paperQuestionSettings: [{}]
				}
			},
			changeValue() {
				this.params.paperQuestionSettings[index].questionType = JSON.parse(JSON.stringify(this.params
					.paperQuestionSettings[index].questionType));
			},
			getUser(val) {
				this.subject = []
				this.subjectList = val
				this.subjectList.forEach(e => {
					this.subject.push(e.id)
				})


			},
			//打开课目弹框
			subjectDUsers() {
				console.log(this.subjectList);
				this.$refs.subjectDialog.add(this.subjectList)
			},
			selectSubject(val) {
				console.log(val);
				let arr = JSON.parse(JSON.stringify(this.subjectList))
				this.subjectList = []
				arr.forEach((p, pi) => {
					val.forEach(v => {
						// console.log(p,v);
						if (p.id == v) {
							this.subjectList.push(p)
						}
					})

				})
			},
			//上一步
			lastStep() {
				this.isActive -= 1
			},
			//下一步
			nextStep() {
				if (this.isActive == 0) {
					if (this.subject.length > 0) {
						this.subject.forEach((s, si) => {
							if (si == 0) {
								this.params.subjectId = s
							} else {
								this.params.subjectId += ',' + s
							}
						})
					} else {
						this.params.subjectId = ''
					}
					if (this.params.subjectId == '' || this.params.paperSetting.timeLength == '' || this.params
						.totalScore == '' || this.params.paperSetting.passScore == '') {
						this.$notify({
							type: 'warning',
							message: '请填写完整试卷信息',
							duration: 2000
						})
						return
					} else {
						this.isActive += 1
					}
				} else if (this.isActive == 1) {
					this.$refs.formInfo.validate(valid => {
						if (valid) {
							if (this.title === '新增' || this.title === '复制') {
								mnsjMenu.addRecord(this.params, response => {
									if (response.state) {
										this.$notify({
											type: 'success',
											message: this.title + '成功',
											duration: 2000
										})
										this.$emit('loadData')
										this.handleClose()
									} else {
										this.$message.warning(response.message)
									}
								})
							} else if (this.title === '修改') {
								mnsjMenu.editQuery(this.params, response => {
									if (response.state) {
										this.$notify({
											type: 'success',
											message: this.title + '成功',
											duration: 2000
										})
										this.handleClose()
										this.$emit('loadData')
									} else {
										this.$message.warning(response.message)
									}
								})
							}

						}
					})
				}


			},
			addTable() {
				this.params.paperQuestionSettings.push({})
			},
			testUserType(val) {
				this.params.paperSetting.testUserType = val.value
			},
			changeType(val) {
        //判断当前选中的组卷类型
				//如果为1和3时
				//判断是否填写题目
				// 如果存在题目，则弹出提示框确认
				if (this.params.paperQuestionSettings.length > 0) {
					this.$confirm('您确定要修改组卷类型吗？切换后原有的试题将会无效', '温馨提示', {
						confirmButtonText: '是',
						cancelButtonText: '否',
						type: 'warning'
					}).then(() => {
						this.params.wayType = val.value
						this.params.paperQuestionSettings = []

					}).catch(() => {

					});
				} else {
					// 不存在题目，直接跳转
					this.params.wayType = val.value
					this.params.paperQuestionSettings = []

				}
			},
			removeTable(index) {
				if (this.params.paperQuestionSettings.length == 1) {
					this.params.json = ''
					this.params.paperQuestionSettings = [{}]
				} else {
					this.params.paperQuestionSettings.splice(index, 1)
				}
			},
			// 课目树选中ID
			handleChange(val) {
				let ArrIds = []
				ArrIds = val
				if (ArrIds.length == 0) {
					this.params.subjectId = ArrIds[0]
				} else {
					this.params.subjectId = ArrIds[val.length - 1]
				}
			},
			//岗位树点击
			handleNodeClick(val) {
				console.log(val);
				this.queryParam.querys = [{
					group: "defaultQueryGroup",
					operation: "EQUAL",
					property: "POS_ID_",
					relation: "AND",
					value: val.id
				}, ]
				paperMenu.getOrgUserPage(this.queryParam, res => {
					if (res.rows) {
						// this.EquipmentList = res.rows
						res.rows.forEach(r => {
							this.EquipmentList.push({
								positionId: r.relId,
								account: r.account,
								userName: r.fullName
							})
						})
						this.total = res.total
					}
				})
			},
			getOrgUserPage(val) {
				if (val) {
					this.queryParam.pageBean.page = val
				}
				if (this.querys[0].value) {
					this.queryParam.querys.push(this.querys[0])
				}
				paperMenu.getOrgUserPage(this.queryParam, res => {
					if (res.rows) {
						this.EquipmentList = res.rows
						this.total = res.total
					}
				})
			},
			//删除
			delSubject(index) {
				this.params.paperQuestionSettings.splice(index, 1)
			},
			//添加题目
			addTopic() {
				this.confVisible = true
			},
			//随机添加
			addRandom() {
				this.$refs.randomDialog.add(this.subjectList, this.params.paperQuestionSettings)
			},
			//展开 收缩
			anShrinkage(val, index) {
				if (!val.questionsInfo.options || val.questionsInfo.options.length > 0) {
					val.isShrink = !val.isShrink
					this.$set(this.params.paperQuestionSettings, index, val)

				} else if (val.questionsInfo.options.length == 0 && !val.isShrink) {
					paperMenu.detailIdTopic(val.questionId, res => {
						val.questionsInfo.options = res.options
						val.isShrink = !val.isShrink
						this.$set(this.params.paperQuestionSettings, index, val)
					})

				} else {
					val.isShrink = !val.isShrink
					this.$set(this.params.paperQuestionSettings, index, val)
				}
			},
			closeFormDiao() {
				this.confVisible = false;
			},
			deleteTopic(index) {
				this.params.paperQuestionSettings.splice(index, 1)
			},
			//随机弹框返回值
			getRandom(val) {
				val.forEach(v => {
					this.subjectList.forEach(s => {
						if (s.id == v.subjectId) {
							v.subjectName = s.name
						}
					})
					this.topicList.forEach(t => {
						if (t.value == v.questionType) {
							v.questionName = t.name
						}
					})
					this.params.paperQuestionSettings.push(v)
				})

			},
			//接收考试题目
			async testQuestions(val) {
				this.confVisible = false
				val.forEach(e => {
					this.params.paperQuestionSettings.push({
						questionId: e.id,
						questionType: e.type,
						score: e.score,
						numuber: 1,
						questionsInfo: {
							difficulty: e.difficulty,
							question: e.question,
							rightOption: e.rightOption,
							parsing: e.parsing,
							createTime: e.createTime,
							options: []
						}
					})
				})
				this.params.paperQuestionSettings.forEach(e => {
					e.isShrink = false
					this.topicList.forEach(t => {
						if (e.questionType == t.value) {
							e.questionTypeName = t.name
						}
					})
					this.stndList.forEach(s => {
						if (e.questionsInfo.difficulty == s.value) {
							e.questionsInfo.difficultyName = s.name
						}
					})
				})
				this.params.paperQuestionSettings = this.params.paperQuestionSettings.sort(function(a, b) {
					return a.questionType - b.questionType
				})
			},
			//题目数量
			handleNumber(num, totalNumuber) {
				console.log(num, totalNumuber);
			},
			// 考生确认
			//获取岗位树
			getOrgPostPage() {
				paperMenu.getOrgPostPage(this.queryParam, res => {
					if (res.rows) {
						this.jobsList = res.rows
						this.total = res.total
					}
				})
			},
			handleSizeChange(val) {
				this.queryParam.pageBean.pageSize = val
				this.getOrgUserPage()
				console.log(`当前条: ${val}`);
			},
			handleCurrentChange(val) {
				this.queryParam.pageBean.page = val
				this.getOrgUserPage()
				console.log(`当前页: ${val}`);
			},
			// 中间列表
			searchEnterFun() {
				this.getOrgUserPage(1)
			},
			// 重置
			reset() {
				this.querys[0].value = ""
				this.getOrgUserPage(1)
			},
			handleSelectionChange(val) {
				if (val.length > 0) {
					val.forEach(v => {
						this.params.userInfoVos.push(v)
					})
				}

			},


		},
	}
</script>
<style>
	.el-message-box {
		position: absolute;
		top: 25%;
		left: 40%;
	}

	.parsing p {
		margin: 0;
		display: inline;
	}
</style>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
		height: 100% !important;
		max-height: 80%
	}

::v-deep .bbsl-location-dialog .el-dialog__body {
		margin: 0 !important;
	}

	.column-box {
		display: flex;
		justify-content: space-around;
	}

	.disposition {
		min-height: 500px;

		.itemBox {
			width: 100%;
			padding: 10px 20px;
			box-sizing: border-box;
			border: 1px solid #E6E6E6;
			margin-bottom: 10px;
		}

		.itemBox:hover {
			border: 1px solid #009aff;
		}

		.details {

			.correct {
				margin: 10px 0;
				color: #009aff;
			}

			.parsing {
				margin: 10px 0;
				color: #999;
			}
		}

		.topic {
			padding: 10px 0;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;

			.topic-left {
				display: flex;
				justify-content: space-between;
				align-items: center;

				div:nth-child(1) {
					color: #36aafd;
					padding: 0 4px;
					border: 1px solid #36aafd;
				}

				div:nth-child(2) {
					color: #36aafd;
					padding: 0 4px;
					margin: 0 5px;
					border: 1px solid #36aafd;
				}
			}

			.topic-right {
				display: flex;
				justify-content: space-between;

				div:nth-child(1) {
					margin: 0 20px;
				}
			}
		}

		.tally {
			color: #999;
			padding: 5px 0;
			box-sizing: border-box;
		}

		.footer {
			color: #999;
			padding: 5px 0;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
		}
	}

	.examinee {
		margin-top: 10px;
		display: flex;
		min-height: 400px;

		.examinee-left {
			width: 20%;

      ::v-deep .el-tree {
				border: none;
			}
		}

		.examinee-right {
			width: 80%;
		}
	}

::v-deep .el-tree-node__content {
		padding: 5px 0;
	}

	.typeBtn {
		height: 40px;
		padding: 0 20px;
		box-sizing: border-box;
		border: 1px solid #DCDFE6;
		text-align: center;
		border-radius: 3px;
		margin-right: 5px;
	}

	.btnActive {
		background-color: #1289FE;
		color: #fff;
	}

	.el-row {
		height: 100%;
	}

	.el-col {
		height: 100%;
	}

	.el-table {
		height: calc(100% - 50px);
		margin-bottom: 10px;
	}

	.combined {
		text-align: right;
		font-weight: bold;
		font-size: 16px;
		margin-right: 20px;
	}

	.buttons {
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
</style>
