|
|
<template>
|
|
|
<div class="app-container4">
|
|
|
<div class="Whatbigdata">
|
|
|
<div class="left">
|
|
|
<el-scrollbar height="640px">
|
|
|
<p class="test" style="margin-left:25px">大数据之所以称为大数据，因其和“小数据”比较起来，有显著的特征:</p>
|
|
|
<div class="eval_main" v-for="(item, index) in mlist" :key="index" :class="['eval_main' + index]" >
|
|
|
<div class="eval_main_title">
|
|
|
<div class="eval_main_left">
|
|
|
<span>{{ index + 1 }}</span>
|
|
|
</div>
|
|
|
<div class="eval_main_right"> {{ item.topicName }} <span>({{ item.topicType }})</span></div>
|
|
|
</div>
|
|
|
<div class="eval_main_content">
|
|
|
<div class="eval_main_single">
|
|
|
<el-radio-group v-if="item.topicType === '单选题'" v-model="item.studentAnswer" @change="changeMultipleChoiceQuestions">
|
|
|
<el-radio :class="getSingleChoiceStyle(item.rightOrWrong, item.questionAnswer, 'A',item.studentAnswer)" v-if="item.optionA !== null" label="A" border >A.{{ item.optionA }}<span class="stylingCorrectly" v-if="item.questionAnswer!=='A'&&item.studentAnswer==='A'&&item.rightOrWrong!==''&&item.rightOrWrong!==null">正确答案:{{item.questionAnswer}}</span>
|
|
|
</el-radio>
|
|
|
<el-radio :class="getSingleChoiceStyle(item.rightOrWrong, item.questionAnswer, 'B',item.studentAnswer) " v-if="item.optionB !== null" label="B" border >B.{{ item.optionB }}<span class="stylingCorrectly" v-if="item.questionAnswer!=='B'&&item.studentAnswer==='B'&&item.rightOrWrong!==''&&item.rightOrWrong!==null">正确答案:{{item.questionAnswer}}</span> </el-radio >
|
|
|
<el-radio :class=" getSingleChoiceStyle(item.rightOrWrong, item.answer, 'C') " v-if="item.optionC !== null" label="C" border >{{ item.optionC }} </el-radio >
|
|
|
<el-radio :class=" getSingleChoiceStyle(item.rightOrWrong, item.answer, 'D') " v-if="item.optionD !== null" label="D" border>{{ item.optionD }}</el-radio >
|
|
|
</el-radio-group>
|
|
|
<div class="eval_main_checkbox" style="position: relative;">
|
|
|
<el-checkbox-group v-if="item.topicType === '多选题'" v-model="item.studentAnswer" >
|
|
|
<el-checkbox v-if="item.optionA !== null" v-model="item.state" :label="item.optionA" :class="showIcon(item, 'A')" border >A.{{ item.optionA }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionA)">正确答案:{{item.questionAnswer}}</span></el-checkbox>
|
|
|
<el-checkbox v-if="item.optionB !== null" v-model="item.state" :label="item.optionB" :class="showIcon(item, 'B')" border >B.{{ item.optionB }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionB)">正确答案:{{item.questionAnswer}}</span></el-checkbox>
|
|
|
<el-checkbox v-if="item.optionC !== null" v-model="item.state" :label="item.optionC" :class="showIcon(item, 'C')" border >C.{{ item.optionC }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionC)">正确答案:{{item.questionAnswer}}</span></el-checkbox >
|
|
|
<el-checkbox v-if="item.optionD !== null" v-model="item.state" :label="item.optionD" :class="showIcon(item, 'D')" border >D.{{ item.optionD }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionD)">正确答案:{{item.questionAnswer}}</span></el-checkbox >
|
|
|
<el-checkbox v-if="item.optionE !== null" v-model="item.state" :label="item.optionE" :class="showIcon(item, 'E')" border >E.{{ item.optionE}}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionE)">正确答案:{{item.questionAnswer}}</span></el-checkbox>
|
|
|
<el-checkbox v-if="item.optionF !== null" v-model="item.state" :label="item.optionF" :class="showIcon(item, 'F')" border >F.{{ item.optionF }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionF)">正确答案:{{item.questionAnswer}}</span></el-checkbox >
|
|
|
<el-checkbox v-if="item.optionG !== null" v-model="item.state" :label="item.optionG" :class="showIcon(item, 'G')" border >G.{{ item.optionG }}<span class="stylingCorrectly2" v-if="ifShow(item,item.optionG)">正确答案:{{item.questionAnswer}}</span></el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
</div>
|
|
|
<!-- <el-radio-group v-if="item.topicType === '判断题'" v-model="item.studentAnswer" >
|
|
|
<el-radio label="A" border >正确<span :class="showIcon(item, 'A', item.topicType)">{{ }}</span></el-radio>
|
|
|
<el-radio label="B" border >错误<span :class="showIcon(item, 'B', item.topicType)">{{ }}</span></el-radio>
|
|
|
</el-radio-group> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-scrollbar>
|
|
|
<div class="dialog-footer" style="margin-top:5px">
|
|
|
<el-button @click="taskAnswer" class="tj">提交任务</el-button>
|
|
|
<el-button type="primary" @click="answerAgain" class="cxks">
|
|
|
重新开始
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="rigin">
|
|
|
<span @click="bigDataDialogVisible=true"></span>
|
|
|
</div>
|
|
|
<el-dialog
|
|
|
custom-class="gdialog"
|
|
|
v-model="bigDataDialogVisible"
|
|
|
title="什么是大数据"
|
|
|
width="70%"
|
|
|
:before-close="handleClose">
|
|
|
<el-scrollbar height="700px">
|
|
|
<p>
|
|
|
伴随着云计算、大数据、物联网、人工智能等信息技术的快速发展和传统产业数字化的转型，数据量呈现几何级增长，根据市场研究资料显示，全球数据总量将从 2016 年的 16.1ZB 增长到 2025 年的 163ZB （约合 180 万亿 GB），十年内将有 10 倍的增长，复合增长率为 26%<br/>
|
|
|
若以现有的蓝光光盘为计量标准，那么 40ZB 的数据全部存入蓝光光盘，所需要的光盘总重量将达到 424 艘尼米兹号航母的总重量。而这些数据中，约 80% 是非结构化或半结构化类型的数据，甚至更有一部分是不断变化的流数据。因此，数据的爆炸性增长态势，以及其数据构成特点使得人们进入了“大数据”时代。
|
|
|
</p>
|
|
|
<p> 一般认为，大数据主要具有以下4个方面的典型特征，即大量(Volume)、多样(Variety)、高速(Velocity)和价值(Value)，即所谓的4V，接下来，通过一张图来具休描述。</p>
|
|
|
<p><img src="@/assets/images/szjj/u1592.png" alt=""></p>
|
|
|
<p style="font-weight:600;"> 一、Volume(大量)</p><p>大数据的特征首先就是数据规模大。随着互联网、物联网、移动互联技术的发展，人和事物的所有轨迹都可以被记录下来，数据呈现出爆发性增长。数据相关计量单位的换算关系如下表所示。</p>
|
|
|
<p><img src="@/assets/images/szjj/u1594.png" alt=""></p>
|
|
|
<p>互联网每分钟产生的数据</p>
|
|
|
<p><img src="@/assets/images/szjj/u1597.png" alt=""></p>
|
|
|
<p style="font-weight:600;"> 二、Variety(多样)</p><p>
|
|
|
数据来源的广泛性，决定了数据形式的多样性。我们把这些数据大致分为三类：结构化的数据、半结构化的数据和非结构化的数据。<br/>
|
|
|
结构化的数据，一般指的是关系型数据库中的数据，例如MySQL、Oracle中的表中的数据。如财务系统数据、信息管理系统数据、医疗系统数据等,其特点是数据间因果关系强。这些数据中，每一行的数据都保持着相同的数据格式，有规律可循，非常容易处理。<br/>
|
|
|
半结构化的数据，指的是有一定的结构性，但是比起关系型数据库表中的结构化的数据来说，结构不是那么清晰，处理起来也比结构化的数据略微麻烦。常见的半结构化的数据有json、xml、html等。其特点是数据间的因果关系弱。<br/>
|
|
|
非结构化的数据，指的就是没有丝毫结构性可言的数据了，如即时消息、视频、照片、点击流、 日志文件、地理位置信息等，其特点是数据间没有因果关系。数据没有固定的格式，通常需要我们单独设计程序来处理这些数据，从中提取出来有价值的信息。<br/>
|
|
|
而我们在工作中要处理的数据，往往都是以半结构化和非结构化的居多。有统计显示，目前结构化数据占据整个互联网数据量的75%以上，而产生价值的大数据，往往是这些非结构化数据。<br/>
|
|
|
</p><p style="font-weight:600;"> 三、Velocity(高速)</p>
|
|
|
<p>数据的增长速度和处理速度是大数据高速性的重要体现。与以往的报纸、书信等传统数据载体生产传播方式不同，在大数据时代，大数据的交换和传播主要是通过互联网和云计算等方式实现的,其生产和传播数据的速度是非常迅速的。另外,大数据还要求处理数据的响应速度要快，例如，上亿条数据的分析必须在几秒内完成。数据的输人、处理与丢弃必须立刻见效，几乎无延迟。</p>
|
|
|
<p style="font-weight:600;">四、Value(价值)</p><p>
|
|
|
大数据的核心特征是价值，其实价值密度的高低和数据总量的大小是成反比的，即数据价值密度越高数据总量越小，数据价值密度越低数据总量越大，总结为：价值密度低、商业价值高。大数据相关的技术体系，需要处理的数据量是非常庞大的，动辄PB、EB规模的数据，但是真正具有价值的数据却非常稀少，只有100M，甚至更少。我们就需要从这么庞大的数据集中提取出来这些密度非常低的有价值的数据进行处理。任何有价值的信息的提取依托的就是海量的基础数据，以监控视频为例，在一小时的视频中，有用的数据可能仅仅只有一两秒，但是却会非常重要。</p>
|
|
|
</el-scrollbar>
|
|
|
<template #footer>
|
|
|
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
<script setup>
|
|
|
import {LookBlockchainComposition} from '@/api/economy/bigData.js'
|
|
|
import * as API from "@/api/AI.js";
|
|
|
import {getTopic,submitJudgmentResults} from '@/api/hash/digitalEconomy.js'
|
|
|
// import { getUserId } from '@/utils/auth'
|
|
|
import { getUserInfo } from '@/utils/auth'
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
const mlistLength = ref(0);
|
|
|
const answerData=ref([])
|
|
|
const getTitle=async()=>{
|
|
|
try{
|
|
|
const newArray = [];
|
|
|
const sendData={
|
|
|
module:'什么是大数据',
|
|
|
userId:JSON.parse(getUserInfo()).userId
|
|
|
}
|
|
|
const res = await getTopic(sendData);
|
|
|
mlist.value = res.data;
|
|
|
mlist.value.forEach((item) => {
|
|
|
answerData.value.push(item.studentAnswer)
|
|
|
if (item.topicType === "多选题"&&item.rightOrWrong===null) {
|
|
|
item.studentAnswer = [];
|
|
|
}
|
|
|
if(item.topicType === "多选题"&&item.rightOrWrong!==null){
|
|
|
item.studentAnswer = item.studentAnswer.split(',').map((item2) => {
|
|
|
if (item2 === "A") {
|
|
|
return item.optionA;
|
|
|
}
|
|
|
if (item2 === "B") {
|
|
|
return item.optionB;
|
|
|
}
|
|
|
if (item2 === "C") {
|
|
|
return item.optionC;
|
|
|
}
|
|
|
if (item2 === "D") {
|
|
|
return item.optionD;
|
|
|
}
|
|
|
if (item2 === "E") {
|
|
|
return item.optionE;
|
|
|
}
|
|
|
if (item2 === "F") {
|
|
|
return item.optionF;
|
|
|
}
|
|
|
if (item2 === "G") {
|
|
|
return item.optionG;
|
|
|
}
|
|
|
return item2;
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
mlistLength.value = res.data.length;
|
|
|
}catch(e){
|
|
|
console.log(e);
|
|
|
}
|
|
|
}
|
|
|
getTitle()
|
|
|
const mlist = ref({});
|
|
|
const correctNot1 = ref(false);
|
|
|
const correctNot2 = ref(false);
|
|
|
const getSingleChoiceStyle = (item, answer, answer2,studentAnswer) => {
|
|
|
if(item===''||item===null){
|
|
|
return
|
|
|
}
|
|
|
if ( answer === answer2) {
|
|
|
correctNot1.value = true;
|
|
|
return "correctStyleSingleChoiceQuestions";
|
|
|
}
|
|
|
if (answer !== answer2) {
|
|
|
correctNot2.value = true;
|
|
|
return "singleChoiceErrorStyle";
|
|
|
}
|
|
|
return;
|
|
|
};
|
|
|
const showIcon = (item, answer) => {
|
|
|
if(item.rightOrWrong===''||item.rightOrWrong===null){
|
|
|
return
|
|
|
}
|
|
|
if(item.questionAnswer!==null){
|
|
|
const isFlag=ref(false)
|
|
|
item.questionAnswer.split(',').map((item2)=>{
|
|
|
if(item2===answer){
|
|
|
isFlag.value=true
|
|
|
}
|
|
|
return item2
|
|
|
})
|
|
|
if(isFlag.value){
|
|
|
return "Correct";
|
|
|
}else{
|
|
|
return "error"
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const ifShow=(item,item2)=>{
|
|
|
if(item.rightOrWrong===''||item.rightOrWrong===null){
|
|
|
return false
|
|
|
}
|
|
|
const flag2=ref(false)
|
|
|
const item4=item.questionAnswer.split(',')
|
|
|
const arr=ref([])
|
|
|
item4.forEach(item5=>{
|
|
|
if(item5==='A'){
|
|
|
arr.value.push(item.optionA)
|
|
|
}
|
|
|
if(item5==='B'){
|
|
|
arr.value.push(item.optionB)
|
|
|
}
|
|
|
if(item5==='C'){
|
|
|
arr.value.push(item.optionC)
|
|
|
}if(item5==='D'){
|
|
|
arr.value.push(item.optionD)
|
|
|
}
|
|
|
if(item5==='E'){
|
|
|
arr.value.push(item.optionE)
|
|
|
}
|
|
|
if(item5==='F'){
|
|
|
arr.value.push(item.optionF)
|
|
|
}
|
|
|
if(item5==='G'){
|
|
|
arr.value.push(item.optionG)
|
|
|
}
|
|
|
})
|
|
|
item.studentAnswer.forEach(item3=>{
|
|
|
if(item3===item2){
|
|
|
flag2.value=true
|
|
|
}
|
|
|
})
|
|
|
// if(JSON.stringify(item.studentAnswer) === JSON.stringify(arr.value)){
|
|
|
if(arraysAreEqual(JSON.stringify(item.studentAnswer),JSON.stringify(arr.value))){
|
|
|
flag2.value=false
|
|
|
}
|
|
|
return flag2.value
|
|
|
}
|
|
|
function arraysAreEqual(arr1, arr2) {
|
|
|
const set1 = new Set(arr1);
|
|
|
const set2 = new Set(arr2);
|
|
|
return Array.from(set1).every(value => set2.has(value)) && Array.from(set2).every(value => set1.has(value));
|
|
|
}
|
|
|
const bigDataDialogVisible = ref(false);
|
|
|
const timer=ref(null)
|
|
|
let seconds=0
|
|
|
watch(() => bigDataDialogVisible.value, (newValue) => {
|
|
|
if (newValue) {
|
|
|
timer.value=setInterval(()=>{
|
|
|
seconds++
|
|
|
},1000)
|
|
|
} else {
|
|
|
if(timer.value){
|
|
|
clearInterval(timer.value)
|
|
|
}
|
|
|
const data=ref({
|
|
|
"stuScoreDetailsDTO":{
|
|
|
"viewingTime": seconds,
|
|
|
"userId":JSON.parse(getUserInfo()).userId,
|
|
|
}
|
|
|
})
|
|
|
API.knowledgeProfileScore(data.value).then((res)=>{
|
|
|
|
|
|
})
|
|
|
}
|
|
|
});
|
|
|
const data = ref([
|
|
|
{
|
|
|
topicId: "1b2eccf76e0e4080a99c19358dfcd7b7",
|
|
|
topicName: "区块链中常用的哈希算法是（ ）",
|
|
|
topicType: "单选题",
|
|
|
topicDifficultyLevel: null,
|
|
|
topicScore: 10,
|
|
|
topicNumber: null,
|
|
|
option:{
|
|
|
A: "SHA-256",
|
|
|
B: "SHA-512",
|
|
|
C: "MD5",
|
|
|
D: "SHA-1",
|
|
|
},
|
|
|
|
|
|
optionE: null,
|
|
|
optionF: null,
|
|
|
answer: "B",
|
|
|
studentAnswer: "A",
|
|
|
questionAnswer: null,
|
|
|
module: "哈希函数",
|
|
|
logic: 1,
|
|
|
state: null,
|
|
|
reason: null,
|
|
|
optionImg: null,
|
|
|
rightOrWrong: "错误",
|
|
|
},
|
|
|
{
|
|
|
topicId: "1cc64b24a2f2493b89741f1464dfb626",
|
|
|
topicName: "关于哈希函数，下列说法错误的是（ ）",
|
|
|
topicType: "单选题",
|
|
|
topicDifficultyLevel: null,
|
|
|
topicScore: 10,
|
|
|
topicNumber: null,
|
|
|
option:{
|
|
|
A: "哈希函数是一种单向函数",
|
|
|
B: "哈希函数是一种不可逆函数",
|
|
|
C: "哈希函数是一种可逆函数",
|
|
|
D: "哈希函数是一种压缩函数",
|
|
|
},
|
|
|
optionE: null,
|
|
|
optionF: null,
|
|
|
answer: "C",
|
|
|
studentAnswer: "A",
|
|
|
questionAnswer: null,
|
|
|
module: "哈希函数",
|
|
|
logic: 1,
|
|
|
state: null,
|
|
|
reason: null,
|
|
|
optionImg: null,
|
|
|
rightOrWrong: "错误",
|
|
|
},
|
|
|
|
|
|
]);
|
|
|
const error=ref()
|
|
|
const TaskAssessment1 = async (TaskData) => {
|
|
|
try {
|
|
|
const res = await submitJudgmentResults(TaskData);
|
|
|
proxy.$modal.msgSuccess(
|
|
|
`提交成功`
|
|
|
);
|
|
|
bigDataDialogVisible.value=false
|
|
|
getTitle()
|
|
|
} catch (error) {}
|
|
|
};
|
|
|
const taskAnswer = () => {
|
|
|
mlist.value.forEach((item) => {
|
|
|
if (item.studentAnswer === "" || item.studentAnswer === null) {
|
|
|
return;
|
|
|
}
|
|
|
});
|
|
|
const mlistArray = Object.values(mlist.value);
|
|
|
const newTable=mlistArray.map((item)=>{
|
|
|
return{
|
|
|
answer: item.studentAnswer,
|
|
|
module: "什么是大数据",
|
|
|
topicId: item.topicId,
|
|
|
type: item.topicType,
|
|
|
userId: JSON.parse(getUserInfo()).userId,
|
|
|
}
|
|
|
})
|
|
|
newTable.forEach(
|
|
|
(item,index) => {
|
|
|
if (item.type === "多选题") {
|
|
|
const newArray = [];
|
|
|
item.answer.forEach((item2) => {
|
|
|
if (item2 === mlist.value[index].optionA) {
|
|
|
newArray.push("A");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionB) {
|
|
|
newArray.push("B");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionC) {
|
|
|
newArray.push("C");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionD) {
|
|
|
newArray.push("D");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionE) {
|
|
|
newArray.push("E");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionF) {
|
|
|
newArray.push("F");
|
|
|
}
|
|
|
if (item2 === mlist.value[index].optionG) {
|
|
|
newArray.push("G");
|
|
|
}
|
|
|
});
|
|
|
item.answer = newArray;
|
|
|
// item.answer.push(newArray)
|
|
|
}
|
|
|
if (item.type !== "多选题") {
|
|
|
let flag = item.answer;
|
|
|
item.answer = [];
|
|
|
item.answer.push(flag);
|
|
|
}
|
|
|
if (item.type === "多选题") {
|
|
|
item.answer.sort(function (s1, s2) {
|
|
|
let x1 = s1.toUpperCase();
|
|
|
let x2 = s2.toUpperCase();
|
|
|
if (x1 < x2) {
|
|
|
return -1;
|
|
|
}
|
|
|
if (x1 > x2) {
|
|
|
return 1;
|
|
|
}
|
|
|
return 0;
|
|
|
});
|
|
|
}
|
|
|
item.answer=item.answer.join(",")
|
|
|
}
|
|
|
);
|
|
|
// console.log(newTable, "transformedData");
|
|
|
TaskAssessment1(newTable);
|
|
|
};
|
|
|
const answerAgain=()=>{
|
|
|
mlist.value.forEach(item=>{
|
|
|
// item.answer=''
|
|
|
if(item.topicType==='多选题'){
|
|
|
item.studentAnswer=[]
|
|
|
}else{
|
|
|
item.studentAnswer=''
|
|
|
}
|
|
|
item.rightOrWrong=''
|
|
|
})
|
|
|
}
|
|
|
// 页面销毁
|
|
|
onBeforeUnmount(() => {
|
|
|
|
|
|
});
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.Whatbigdata {
|
|
|
position: relative;
|
|
|
display: flex;
|
|
|
.left{
|
|
|
width:100%;
|
|
|
height: 100%;
|
|
|
}
|
|
|
.rigin{
|
|
|
position: absolute;
|
|
|
right: 0;
|
|
|
top: 35px;
|
|
|
width: 216px;
|
|
|
padding-left: 60px;
|
|
|
span {
|
|
|
display: inline-block;
|
|
|
width: 110px;
|
|
|
height: 143px;
|
|
|
background: url("@/assets/images/szjj/案例任务.png") no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
p{
|
|
|
font-size: var(--student-fs-body);
|
|
|
font-family: var(--student-font-base);
|
|
|
// font-weight: 600;
|
|
|
color: #000000;
|
|
|
}
|
|
|
.topic {
|
|
|
.setp {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
.setp-item {
|
|
|
width: 25px;
|
|
|
height: 25px;
|
|
|
background: #5621f8;
|
|
|
border-radius: 50%;
|
|
|
font-size: var(--student-fs-caption);
|
|
|
text-align: center;
|
|
|
line-height: 25px;
|
|
|
color: #000000;
|
|
|
}
|
|
|
span {
|
|
|
margin-left: 8px;
|
|
|
font-size: var(--student-fs-caption);
|
|
|
font-family: var(--student-font-base);
|
|
|
font-weight: 600;
|
|
|
color: #333333;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
p {
|
|
|
width: calc(100% - 40%);
|
|
|
height: 36px;
|
|
|
background: #e9ebfc;
|
|
|
border-radius: 4px;
|
|
|
padding: 0px 20px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.eval_main {
|
|
|
margin-top: 25px;
|
|
|
.eval_main_title {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
font-weight: bold;
|
|
|
font-size: var(--student-fs-body);
|
|
|
align-items: center;
|
|
|
.eval_main_right {
|
|
|
color: #000000;
|
|
|
margin-left: 23px;
|
|
|
span {
|
|
|
font-size: var(--student-fs-body);
|
|
|
color: #00b4f2;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.eval_main_left {
|
|
|
position: relative;
|
|
|
align-items: center;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
width: 32px;
|
|
|
height: 32px;
|
|
|
background-color: #5621F8;
|
|
|
color: #FFFFFF;
|
|
|
border-radius: 50%;
|
|
|
font-size: var(--student-fs-body-sm);
|
|
|
font-size: var(--student-fs-body);
|
|
|
font-weight: 100;
|
|
|
margin-left: 35px;
|
|
|
}
|
|
|
.eval_main_single {
|
|
|
margin: 10px 0 10px 35px;
|
|
|
.el-radio-group {
|
|
|
width: 985px;
|
|
|
}
|
|
|
.el-radio {
|
|
|
margin-bottom: 10px;
|
|
|
width: 801px;
|
|
|
top: 5px;
|
|
|
background: #FFFFFF;
|
|
|
}
|
|
|
.el-checkbox {
|
|
|
margin-bottom: 5px;
|
|
|
width: 801px;
|
|
|
top: 5px;
|
|
|
background: #FFFFFF;
|
|
|
}
|
|
|
.el-checkbox-group {
|
|
|
font-size: 0;
|
|
|
line-height: 0;
|
|
|
display: inline-flex;
|
|
|
align-items: center;
|
|
|
flex-wrap: wrap;
|
|
|
width: 985px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.correctStyleSingleChoiceQuestions.el-radio.is-bordered.is-checked {
|
|
|
border-color: #00bb00 !important;
|
|
|
position: relative;
|
|
|
&::after{
|
|
|
content: '√';
|
|
|
position: absolute;
|
|
|
// margin-left: 94%;
|
|
|
left: 805px;
|
|
|
color: #00bb00;
|
|
|
}
|
|
|
}
|
|
|
.singleChoiceErrorStyle.el-radio.is-bordered.is-checked {
|
|
|
border-color: red !important;
|
|
|
// 尾部插入
|
|
|
position: relative;
|
|
|
&::after{
|
|
|
content: 'X';
|
|
|
position: absolute;
|
|
|
// margin-left: 93%;
|
|
|
left: 805px;
|
|
|
color: red;
|
|
|
}
|
|
|
}
|
|
|
.el-dialog__footer {
|
|
|
text-align: center;
|
|
|
}
|
|
|
.tj{
|
|
|
width: 136px;
|
|
|
height: 40px;
|
|
|
color: #000000 !important;
|
|
|
background: url('@/assets/images/szjj/提交任务.png');
|
|
|
--el-button-border-color: #ffffff00;
|
|
|
--el-button-hover-border-color: #ffffff00;
|
|
|
--el-button-active-border-color: #ffffff00;
|
|
|
}
|
|
|
.cxks{
|
|
|
width: 136px;
|
|
|
height: 40px;
|
|
|
background: url('@/assets/images/szjj/重新开始.png') no-repeat;
|
|
|
color: #000000 !important;
|
|
|
--el-button-border-color: #ffffff00;
|
|
|
--el-button-hover-border-color: #ffffff00;
|
|
|
--el-button-active-border-color: #ffffff00;
|
|
|
}
|
|
|
.stylingCorrectly2{
|
|
|
position: absolute;
|
|
|
left: 828px;
|
|
|
}
|
|
|
.error.el-checkbox.is-bordered.is-checked {
|
|
|
position: relative;
|
|
|
border-color: red !important;
|
|
|
&::after{
|
|
|
content: 'X';
|
|
|
// margin-left: 96% !important;
|
|
|
position: absolute;
|
|
|
left: 805px;
|
|
|
color: red;
|
|
|
}
|
|
|
}
|
|
|
.Correct.el-checkbox.is-bordered.is-checked {
|
|
|
position: relative;
|
|
|
// right: -2%;
|
|
|
border-color: #00bb00 !important;
|
|
|
&::after{
|
|
|
content: '√';
|
|
|
// margin-left: 93%;
|
|
|
position: absolute;
|
|
|
color: #00bb00;
|
|
|
left: 805px;
|
|
|
}
|
|
|
}
|
|
|
.stylingCorrectly{
|
|
|
position: absolute;
|
|
|
right: -101px;
|
|
|
}
|
|
|
</style>
|
|
|
|