tianyan/tra-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改评论页的传参

Browse Source
This commit is contained in:
田岩
2025-08-21 08:46:43 +08:00
parent 8211032e86
commit e5e0b19bda
19 changed files with 1049 additions and 884 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/learningTasks.js
+10 -1
View File
@@ -6,7 +6,16 @@ export const queryAllTraTaskInfoByUserId = (data) => {
return request({
url: base_url + '/traTaskInfo/queryAllTraTaskInfoByUserId',
method: 'post',
toastErrors: true,
data
});
};
// 查询当前用户的课程完成情况
export const queryAllTraTaskCrsInfo = (data) => {
return request({
url: base_url + '/traTaskInfo/queryAllTraTaskCrsInfo',
method: 'post',
data
});
};
src/api/wrong_question_record.js → src/api/wrongQuestionRecord.js
View File
src/common/imgSvg.ts
+9
View File
@@ -48,3 +48,12 @@ export const completeTheExercisesIcon = (color: string) : string => {
`.trim();
return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgXml)}`;
};
// 锁定
export const lockIcon = (color: string) : string => {
const svgXml = `
<svg t="1755683025230" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6630" width="64" height="64"><path d="M787.136 395.466H373.113c0.036-0.579 0.173-1.128 0.173-1.716V267.63c0-81.153 72.891-147.174 162.483-147.174 86.561 0 162.488 64.414 162.488 137.851 0 15.446 12.523 27.969 27.969 27.969 15.446 0 27.969-12.523 27.969-27.969 0-105.043-100.027-193.789-218.426-193.789-120.439 0-218.422 91.118-218.422 203.112v126.12c0 0.588 0.137 1.138 0.173 1.716h-14.467c-82.25 0-149.168 66.918-149.168 149.168v284.402c0 71.971 58.551 130.522 130.522 130.522h502.728c71.971 0 130.522-58.551 130.522-130.522V525.988c0.001-71.971-58.55-130.522-130.521-130.522z m74.584 433.57c0 41.125-33.459 74.584-74.584 74.584H284.408c-41.125 0-74.584-33.459-74.584-74.584V544.634c0-51.409 41.822-93.23 93.23-93.23h484.082c41.125 0 74.584 33.459 74.584 74.584v303.048z" fill="${color}" p-id="6631"></path><path d="M613.108 649.541H458.436c-15.446 0-27.969 12.523-27.969 27.969 0 15.446 12.523 27.969 27.969 27.969h154.672c15.446 0 27.969-12.523 27.969-27.969 0-15.446-12.523-27.969-27.969-27.969z" fill="${color}" p-id="6632"></path></svg>
`.trim();
return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgXml)}`;
};
src/components/examination/characters-subject.vue
+57 -69
View File
@@ -2,17 +2,17 @@
<view class="item">
<view class="top">
<view class="type">
{{subject_type_text}}
</view>
<view class="score">
5分
</view>
<view class="fl1">
{{ subject_type_text }}
</view>
<view class="score">5分</view>
<view class="fl1"></view>
<view class="right">
<view class="mark_and_feedback_div">
<image :src="markIcon(props.item.mark?'#0066FF':'#ABABAB')" class="img" @click="mark_click()"></image>
<image
:src="markIcon(props.item.mark ? '#0066FF' : '#ABABAB')"
class="img"
@click="mark_click()"
></image>
<image :src="feedbackIcon()" class="img" @click="feedback_click()"></image>
</view>
<!-- <view class="right_text">展开</view>
@@ -20,7 +20,7 @@
</view>
</view>
<view class="question_text">
{{subject_data.qnsContent}}
{{ subject_data.qnsContent }}
</view>
<view class="option_div">
<questionVue @changePlay="changePlay" :dataInfo="talkingInfo" :activeVoiceId="questionValue"></questionVue>
@@ -28,103 +28,93 @@
</view>
</template>
<script setup>
import {
ref,
reactive,
onMounted,
nextTick,
computed,
toRaw,
watch
} from 'vue'
import { ref, reactive, onMounted, nextTick, computed, toRaw, watch } from 'vue';
import questionVue from './question.vue';
import radioSubjectItem from './radio-subject-item.vue'
import {
markIcon,feedbackIcon
} from '@/common/imgSvg'
import {
SUBJECT_TYPE
} from '@/enum.js'
const questionValue = ref('')
import radioSubjectItem from './radio-subject-item.vue';
import { markIcon, feedbackIcon } from '@/common/imgSvg';
import { SUBJECT_TYPE } from '@/enum.js';
const questionValue = ref('');
const props = defineProps({
item: {
type: Object,
required: true,
required: true
},
mode: {
type: String,
required: true,
required: true
},
activeVoiceId: {
type: String,
required: true,
required: true
},
voicePathValue: {
type: String,
required: true,
},
required: true
}
});
const emit = defineEmits(['subject_click'])
const emit = defineEmits(['subject_click']);
const talkingInfo = ref({
id: '3',
intrctWay: "02",
intrctContent: "中的i id一二三。",
intrctWay: '02',
intrctContent: '中的i id一二三。',
talkingText: '中的i id一二三。',
talkingVoice: ''
})
watch(() => props.voicePathValue, (val) => {
if (val) {
talkingInfo.value = {
id: '3',
intrctWay: "02",
intrctContent: "中的i id一二三。",
talkingText: '中的i id一二三。',
talkingVoice: val
});
watch(
() => props.voicePathValue,
(val) => {
if (val) {
talkingInfo.value = {
id: '3',
intrctWay: '02',
intrctContent: '中的i id一二三。',
talkingText: '中的i id一二三。',
talkingVoice: val
};
}
}
})
const feedback_click = () =>{
emit('subject_click', 'feedback', props.item)
}
const mark_click = () =>{
emit('subject_click', 'mark', props.item)
}
);
const feedback_click = () => {
emit('subject_click', 'feedback', props.item);
};
const mark_click = () => {
emit('subject_click', 'mark', props.item);
};
const customStyle = {
borderRadius: '16rpx',
width: '292rpx',
backgroundColor: '#0066FF',
border: '1rpx solid rgb(12, 123, 245)',
}
border: '1rpx solid rgb(12, 123, 245)'
};
const subject_data = reactive({
qnsId: '',
qnsContent: '',
qnsTyp: '',
})
qnsTyp: ''
});
Object.assign(subject_data, {
qnsId: props.item.qnsId,
qnsContent: props.item.qnsContent,
qnsTyp: props.item.qnsTyp,
})
qnsTyp: props.item.qnsTyp
});
// 题类型
const subject_type_text = computed(() => SUBJECT_TYPE.find(res => subject_data.qnsTyp === res.value)?.label || '')
const subject_type_text = computed(() => SUBJECT_TYPE.find((res) => subject_data.qnsTyp === res.value)?.label || '');
const changePlay = (id) => {
console.log('changePlay');
questionValue.value = id
questionValue.value = id;
// emit('handleEvents', 'changePlay', props.talkingInfo, id)
}
};
</script>
<style scoped lang="scss">
.mark_and_feedback_div{
.mark_and_feedback_div {
display: flex;
height: 100%;
justify-content: end;
align-items: center;
.img{
.img {
width: 38rpx;
height: 38rpx;
margin-left: 4rpx;
@@ -133,7 +123,6 @@
}
.option_div {
padding-top: 46rpx;
}
.item {
@@ -150,12 +139,12 @@
.type {
width: 108rpx;
height: 46rpx;
background: #267EFF;
background: #267eff;
border-radius: 8rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 25rpx;
color: #FFFFFF;
color: #ffffff;
text-align: center;
line-height: 46rpx;
}
@@ -181,7 +170,6 @@
text-align: left;
font-style: normal;
}
}
}
@@ -196,4 +184,4 @@
margin-top: 20rpx;
}
}
</style>
</style>
src/components/examination/radio-subject-item.vue
+13 -20
View File
@@ -3,12 +3,6 @@
<view class="option_text">
{{props.analysisVo.itemNo}}. {{props.analysisVo.itemContent}}
</view>
<!-- <image v-show="select_status==='primary'" class="img" src="@/static/images/common/primary.png" mode="heightFix">
</image>
<image v-show="select_status==='success'" class="img" src="@/static/images/common/success.png" mode="heightFix">
</image>
<image v-show="select_status==='error'" class="img" src="@/static/images/common/error.png" mode="heightFix">
</image> -->
<image :src="select_status_icon" class="img"></image>
</view>
</template>
@@ -37,21 +31,21 @@
required: false,
},
my_answer: {
type: Array,
required: true,
},
backend_answer: {
type: Array,
required: true,
},
type: String,
defauft:''
}
});
const select_status = computed(() => {
if (props.backend_answer.length === 0) {
return (props.my_answer||[]).includes(props.analysisVo.itemId) ? 'primary' : 'info';
} else {
return (props.my_answer||[]).includes(props.analysisVo.itemId) ? 'success' :
'error';
}
// 只要是正确答案 就是绿色
if (props.analysisVo.correctFlag === 'R') return 'success';
// 是错误答案但是被用户错误选中的为红
console.log('props.my_answer', props.my_answer);
const my_answer_array = props.my_answer.split(',');
if(my_answer_array.includes(props.analysisVo.itemId) && props.analysisVo.correctFlag === 'E') return 'error';
// 只有被我选中,不知是正确还是错误的为蓝
if(my_answer_array.includes(props.analysisVo.itemId)) return 'primary';
// 什么都不是者为灰色
return 'info';
})
const select_status_icon = computed(() => {
if (select_status.value === 'primary') {
@@ -65,7 +59,6 @@
})
const click_option = () => {
emit('click_option', props.analysisVo)
}
</script>
src/components/examination/radio-subject.vue
+16 -18
View File
@@ -24,7 +24,7 @@
</view>
<view class="option_div">
<radioSubjectItem v-for="(analysisVo,index) in subject_data.itemVos" @click_option="click_option" :key="index"
:analysisVo="analysisVo" :my_answer="props.item.my_answer" :backend_answer="props.item.backend_answer">
:analysisVo="analysisVo" :my_answer="props.item.my_answer">
</radioSubjectItem>
</view>
<view class="option_div_button" v-if="subject_data.qnsTyp==='MU' && ['practice','study'].includes(props.mode)">
@@ -81,8 +81,6 @@
qnsTyp: '',
itemVos: props.item.itemVos.map(res => ({
...res,
// 选择状态, 'info表示未选' ， primary 表示蓝色， sunccess 表示绿色， error 表示红色
select_status: 'info'
})),
})
Object.assign(subject_data, {
@@ -95,21 +93,21 @@
const subject_type_text = computed(() => SUBJECT_TYPE.find(res => subject_data.qnsTyp === res.value)?.label || '')
// 点击答题
const click_option = (analysisVo) => {
// // 无论什么类型如果表里已经有了，再次点击就是弹出
if (props.item.my_answer.includes(analysisVo.itemId)) {
props.item.my_answer = props.item.my_answer.filter(id => id !== analysisVo.itemId);
} else if (props.item.qnsTyp === 'SN') { // 单选
// 单选插入，并且移除其他
props.item.my_answer[0] = analysisVo.itemId
muCheckbox()
} else if (props.item.qnsTyp === 'MU') { // 多选题
// 多选直接插入
props.item.my_answer.push(analysisVo.itemId)
} else if (props.item.qnsTyp === 'JD') { // 判断题
// 判断插入，并且移除其他
props.item.my_answer = [analysisVo.itemId]
muCheckbox()
}
// // // 无论什么类型如果表里已经有了，再次点击就是弹出
// if (props.item.my_answer.includes(analysisVo.itemId)) {
// props.item.my_answer = props.item.my_answer.filter(id => id !== analysisVo.itemId);
// } else if (props.item.qnsTyp === 'SN') { // 单选
// // 单选插入，并且移除其他
// props.item.my_answer[0] = analysisVo.itemId
// muCheckbox()
// } else if (props.item.qnsTyp === 'MU') { // 多选题
// // 多选直接插入
// props.item.my_answer.push(analysisVo.itemId)
// } else if (props.item.qnsTyp === 'JD') { // 判断题
// // 判断插入，并且移除其他
// props.item.my_answer = [analysisVo.itemId]
// muCheckbox()
// }
}
const muCheckbox = () => {
emit('subject_click', 'answer', {
src/components/examination/subject.vue
+213
View File
@@ -0,0 +1,213 @@
<template>
<view class="item">
<view class="top">
<view class="type">
{{subject_type_text}}
</view>
<view class="score" v-if="mode !== 'study'">
5分
</view>
<view class="fl1" v-if="mode !== 'study'">
</view>
<view class="right" v-if="mode !== 'study'">
<view class="mark_and_feedback_div">
<image :src="markIcon(props.item.mark?'#0066FF':'#ABABAB')" class="img" @click="mark_click()"></image>
<image :src="feedbackIcon()" class="img" @click="feedback_click()"></image>
</view>
<!-- <view class="right_text">展开</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon> -->
</view>
</view>
<view class="question_text">
{{subject_data.qnsContent}}
</view>
<view class="option_div">
<template v-if="qnsTyp === 'ES'">
<!-- <questionVue @changePlay="changePlay" :dataInfo="talkingInfo" :activeVoiceId="questionValue"></questionVue> -->
</template>
<template v-else>
<radioSubjectItem v-for="(analysisVo,index) in subject_data.itemVos" @click_option="click_option" :key="index"
:analysisVo="analysisVo" :my_answer="props.item.my_answer">
</radioSubjectItem>
</template>
</view>
<view class="option_div_button" v-if="subject_data.qnsTyp==='MU' && ['practice','study'].includes(props.mode)">
<uv-button type="primary" class="send_evaluate" :custom-style="customStyle" :throttleTime="300"
@click="muCheckbox" :hairline="false">确定</uv-button>
</view>
</view>
</template>
<script setup>
import {
ref,
reactive,
onMounted,
nextTick,
computed,
toRaw
} from 'vue'
import radioSubjectItem from './radio-subject-item.vue'
import {
markIcon,
feedbackIcon
} from '@/common/imgSvg'
import {
SUBJECT_TYPE
} from '@/enum.js'
const customStyle = {
borderRadius: '16rpx',
width: '292rpx',
backgroundColor: '#0066FF',
border: '1rpx solid rgb(12, 123, 245)',
}
const emit = defineEmits(['subject_click'])
const props = defineProps({
item: {
type: Object,
required: true,
},
mode: {
type: String,
required: true,
}
});
const feedback_click = () => {
emit('subject_click', 'feedback', props.item)
}
const mark_click = () => {
emit('subject_click', 'mark', props.item)
}
// 单选 SN， 多选 MU，判断题 JD，简答 ES
const qnsTyp = computed(() => props.item.qnsTyp)
const subject_data = reactive({
qnsId: '',
qnsContent: '',
qnsTyp: '',
itemVos: props.item.itemVos.map(res => ({
...res,
})),
})
Object.assign(subject_data, {
qnsId: props.item.qnsId,
qnsContent: props.item.qnsContent,
qnsTyp: props.item.qnsTyp,
})
// 题类型
const subject_type_text = computed(() => SUBJECT_TYPE.find(res => subject_data.qnsTyp === res.value)?.label || '')
// 点击答题
const click_option = (analysisVo) => {
// // 无论什么类型如果表里已经有了，再次点击就是弹出
// if (props.item.my_answer.includes(analysisVo.itemId)) {
// props.item.my_answer = props.item.my_answer.filter(id => id !== analysisVo.itemId);
// } else if (props.item.qnsTyp === 'SN') { // 单选
// // 单选插入，并且移除其他
// props.item.my_answer[0] = analysisVo.itemId
// muCheckbox()
// } else if (props.item.qnsTyp === 'MU') { // 多选题
// // 多选直接插入
// props.item.my_answer.push(analysisVo.itemId)
// } else if (props.item.qnsTyp === 'JD') { // 判断题
// // 判断插入，并且移除其他
// props.item.my_answer = [analysisVo.itemId]
// muCheckbox()
// }
}
const muCheckbox = () => {
emit('subject_click', 'answer', {
qnsTyp: props.item.qnsTyp,
qnsId: props.item.qnsId,
answer: props.item.my_answer,
answerItems: subject_data.itemVos.filter(t=> props.item.my_answer.includes(t.itemId))
})
}
</script>
<style scoped lang="scss">
.mark_and_feedback_div {
display: flex;
height: 100%;
justify-content: end;
align-items: center;
.img {
width: 38rpx;
height: 38rpx;
margin-left: 4rpx;
padding: 4rpx;
}
}
.option_div_button {
width: 100%;
height: 84rpx;
padding-top: 30rpx;
// background-color: red;
display: flex;
flex-direction: column;
align-items: center;
}
.item {
// height: 170rpx;
overflow: hidden;
display: flex;
flex-direction: column;
padding-bottom: 40rpx;
.top {
display: flex;
align-items: center;
.type {
width: 108rpx;
height: 46rpx;
background: #267EFF;
border-radius: 8rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 25rpx;
color: #FFFFFF;
text-align: center;
line-height: 46rpx;
}
.score {
margin-left: 24rpx;
font-family: ArialMT;
font-size: 30rpx;
color: #333333;
text-align: left;
}
.right {
display: flex;
align-items: center;
.right_text {
font-family: PingFangSC;
font-weight: 600;
font-size: 28rpx;
color: #333;
text-align: left;
font-style: normal;
}
}
}
.question_text {
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
color: #333333;
line-height: 48rpx;
text-align: left;
font-style: normal;
margin-top: 20rpx;
}
}
</style>
src/components/examination/touchBtn.vue
+2
View File
@@ -154,6 +154,7 @@
};
onMounted(async () => {
// #ifdef APP-PLUS
recorderManager.onStop(function (res) {
console.log('recorder stop' + JSON.stringify(res));
console.log('录音文件临时位置', res.tempFilePath, isOut.value);
@@ -177,6 +178,7 @@
startTime = Date.now();
recordingStatus.value = 'in_recording';
});
// #endif
});
const touchY = ref(0);
src/components/topic-display/topic-display.vue
+170 -48
View File
@@ -1,63 +1,120 @@
<template>
<view class="">
<view class="option_div">
<view class="option_item success">
<view class="text">
A.这里是选项 A 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item success">
<view class="text">
B.这里是选项 B 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item error">
<view class="text">
C.这里是选项 C 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item info">
D.这里是选项D的内容
<view class="item">
<view class="top">
<view class="type">{{ subject_type_text }}</view>
<view class="score">{{ item.tgtGrade }}分</view>
<view class="fl1"></view>
<view class="right" v-if="[''].includes(props.mode)">
<view class="right_text">展开</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon>
</view>
</view>
<view class="analysis_div">
<view class="analysis_title">
<view class="success_answer">
正确答案：ABC
</view>
<view class="text">{{ item.qnsContent }}</view>
<view class="additional_div">
<view class="option_div">
<radioSubjectItem v-for="(analysisVo,index) in item.itemVos" @click_option="click_option" :key="index"
:analysisVo="analysisVo" :my_answer="props.item.anserResult" :backend_answer="[]">
</radioSubjectItem>
<view class="your_answer">
你的答案：<text class="red_color">AB</text>
<!-- <view class="option_item success">
<view class="text">A.这里是选项 A 的内容</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item success">
<view class="text">B.这里是选项 B 的内容</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item error">
<view class="text">C.这里是选项 C 的内容</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item info">D.这里是选项D的内容</view> -->
</view>
<view class="analysis_note">
题目解析：属于商业银行风险管理“三道防线的是A部门，B部门和C部门银行风险管理“三道防线的是A部门，B部，银行风险管理“三道防线的是A部门，B部银行风险管理“三道防线的是A部门，B部
<view class="analysis_div">
<view class="analysis_title">
<view class="success_answer">正确答案：{{ correctResultLabel.join('') }}</view>
<view class="your_answer">
你的答案：
<text class="red_color">{{ myResultLabel.join('') }}</text>
</view>
</view>
<view class="analysis_note">
题目解析：{{item.analyContent}}
</view>
</view>
</view>
</view>
</template>
<script>
<script setup>
import radioSubjectItem from '@/components/examination/radio-subject-item.vue'
import { SUBJECT_TYPE } from '@/enum.js';
import { ref, reactive, computed, onMounted, nextTick, getCurrentInstance } from 'vue';
const props = defineProps({
item: {
type: Object,
required: true
},
mode: {
type: String,
required: true,
validator: (value) => {
// 考试: examination 练习: practice 错题本: mistake 学习: study
return ['examination', 'practice', 'mistake', 'study'].includes(value);
}
}
});
// 试题类型
const qnsTyp = computed(() => props.item.qnsTyp);
const item = computed(() => props.item);
// 正确答案选项
const correctResultLabel = computed(() =>
props.item.itemVos.filter((res) => res.correctFlag === 'R').map((res) => res.itemNo)
);
// 我的答案选项
const myResultLabel = computed(() => {
const anserResultArray = props.item.anserResult.split(',');
return props.item.itemVos.filter((res) => anserResultArray.includes(res.itemId)).map((res) => res.itemNo);
});
console.log(myResultLabel.value, 'myResultLabel');
//
const subject_data = reactive({
qnsId: '',
qnsContent: '',
qnsTyp: '',
itemVos: props.item.itemVos.map((res) => ({
...res,
// 选择状态, 'info表示未选' ， primary 表示蓝色， sunccess 表示绿色， error 表示红色
select_status: 'info'
}))
});
// 题目类型换成汉字
const subject_type_text = computed(() => SUBJECT_TYPE.find((res) => qnsTyp.value === res.value)?.label || '');
const click_option = () => {
}
</script>
<style scoped lang="scss">
.success {
color: #15B859;
background: #E7F8ED;
color: #15b859;
background: #e7f8ed;
}
.info {
color: #333333;
background: #F9F9F9 ;
background: #f9f9f9;
}
.error {
color: #F5212D;
background: #FCE8E9;
color: #f5212d;
background: #fce8e9;
}
.option_item {
width: 100%;
height: 108rpx;
@@ -88,23 +145,26 @@
padding-right: 30rpx;
}
}
.analysis_div{
.analysis_title{
.analysis_div {
.analysis_title {
display: flex;
justify-content: space-between;
align-items: center;
margin: 32rpx 0 28rpx 0;
.success_answer{
.success_answer {
}
.your_answer{
.your_answer {
}
.red_color{
color: #F5212D;
.red_color {
color: #f5212d;
}
}
.analysis_note{
.analysis_note {
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
@@ -114,4 +174,66 @@
font-style: normal;
}
}
</style>
.item {
// height: 170rpx;
border-radius: 16rpx;
margin: 12rpx 0 50rpx 0;
padding: 34rpx 30rpx 34rpx 36rpx;
background-color: #fff;
display: flex;
flex-direction: column;
.top {
display: flex;
align-items: center;
.type {
width: 108rpx;
height: 46rpx;
background: #267eff;
border-radius: 8rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 25rpx;
color: #ffffff;
text-align: center;
line-height: 46rpx;
}
.score {
margin-left: 24rpx;
font-family: ArialMT;
font-size: 30rpx;
color: #333333;
text-align: left;
}
.right {
display: flex;
align-items: center;
.right_text {
font-family: PingFangSC;
font-weight: 600;
font-size: 28rpx;
color: #333;
line-height: 40rpx;
text-align: left;
font-style: normal;
}
}
}
.text {
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
color: #333333;
line-height: 48rpx;
text-align: left;
font-style: normal;
margin-top: 20rpx;
}
}
</style>
src/pages/courseDetail/index.vue
+1 -1
View File
@@ -104,7 +104,7 @@
<uv-button
type="primary"
class="send_evaluate"
@click="common.navigateTo('/pages/courseDetail/submit?crsNum=' + form.crsNum + '&imgId=' + form.imgId)"
@click="common.navigateTo('/pages/courseDetail/submit?crsId=' + crsId + '&imgId=' + form.imgId)"
>
发布评价
</uv-button>
src/pages/courseDetail/submit.vue
+2 -2
View File
@@ -62,7 +62,7 @@
import common from '@/common/common';
const formData = reactive({
"crsNum": null,
"crsId": null,
"imgIdList": [], // 发表图片ID列表，文件ID集
"bbsGrade": 10, // 综合评分(最高10分)
"bbsTag": 'SUG', // 评价标签 （SUG 建议 ASK 提问 ）
@@ -92,7 +92,7 @@
})
}
onLoad((params) => {
formData.crsNum = params.crsNum;
formData.crsId = params.crsId;
from.value = params.from;
imgId.value = params.imgId;
});
src/pages/examination/index.vue
+257 -246
View File
@@ -3,15 +3,16 @@
<nav-bar :is_seat="true"></nav-bar>
<view class="nav-div">
<view class="title ellipsis-text" @click="hand_in_paper_button_click()">
{{paperData.papersName}}
{{ paperData.papersName }}
</view>
<view class="back_div"></view>
</view>
<view class="countdown-and-question-number-div">
<view class="top">
<view class="countdown">
<text class="grey">答题进度</text> <text class="bold">{{questionNumber + 1}}</text><text
class="grey">/{{topicList.length}}</text>
<text class="grey">答题进度</text>
<text class="bold">{{ questionNumber + 1 }}</text>
<text class="grey">/{{ topicList.length }}</text>
</view>
<view class="question">
<view class="grey">剩余时间</view>
@@ -19,164 +20,178 @@
</view>
</view>
<view class="progress">
<uv-line-progress :percentage="progress" :showText="false" activeColor="#FFFFFF" inactiveColor="#89B8FF"
:height="8"></uv-line-progress>
<uv-line-progress
:percentage="progress"
:showText="false"
activeColor="#FFFFFF"
inactiveColor="#89B8FF"
:height="8"
></uv-line-progress>
</view>
</view>
<view class="scroll_div">
<swiper class="swiper" :indicator-dots="false" @change="swiperChange" :current="questionNumber"
easing-function="linear">
<swiper-item v-for="(item,index) in topicList">
<swiper
class="swiper"
:indicator-dots="false"
@change="swiperChange"
:current="questionNumber"
easing-function="linear"
>
<swiper-item v-for="(item, index) in topicList">
<view class="content">
<view class="expose_shadow"></view>
<scroll-view :scroll-y="true" class="scroll-Y" :show-scrollbar="false" :refresher-threshold="0">
<RadioSubject :item="item" v-if="item.qnsTyp !== 'ES'" :mode="mode"
@subject_click="subject_click">
</RadioSubject>
<CharactersSubject :item="item" v-if="item.qnsTyp === 'ES'" :mode="mode"
<Subject :item="item" :mode="mode" @subject_click="subject_click"></Subject>
<!-- <CharactersSubject :item="item" v-if="item.qnsTyp === 'ES'" :mode="mode"
:activeVoiceId="activeVoiceId" :voicePathValue="voicePathValue"
@subject_click="subject_click">
</CharactersSubject>
</CharactersSubject> -->
</scroll-view>
</view>
</swiper-item>
</swiper>
</view>
<view class="fixed-box font_pf" :style="{marginBottom:popup_input_bottom}">
<view class="fixed-box font_pf" :style="{ marginBottom: popup_input_bottom }">
<view class="fixed-btn-box">
<view class="sheet_button" @click="openSheet(true)">
<image :src="examinationSheetIcon()" class="img"></image>
<view class="sheet_text">答题卡</view>
</view>
<view class="button_div">
<uv-button class="button" type="primary" :throttleTime="100" text="上一题" color="#E2EDFF"
<uv-button
class="button"
type="primary"
:throttleTime="100"
text="上一题"
color="#E2EDFF"
custom-style="color:#0066FF;borderRadius:16rpx;height:92rpx;"
@click="button_tab(-1)"></uv-button>
<view style="width:46rpx"></view>
<uv-button class="button" type="primary" :throttleTime="100" :text="next_question" color="#0066FF"
@click="button_tab(-1)"
></uv-button>
<view style="width: 46rpx"></view>
<uv-button
class="button"
type="primary"
:throttleTime="100"
:text="next_question"
color="#0066FF"
custom-style="color:#FFFFFF;borderRadius:16rpx;height:92rpx;"
@click="button_tab(1)"></uv-button>
@click="button_tab(1)"
></uv-button>
</view>
</view>
<view class="touch-btn-div" :class="{'show':showTouchBtn}">
<TouchBtn class="talk-btns" @submit="touchBtnSubmit"
loadingText="问题回答中，请在问题回答结束后重试！" :isLoading="!answerIsOver" :isDisabled="false" />
<view class="touch-btn-div" :class="{ show: showTouchBtn }">
<TouchBtn
class="talk-btns"
@submit="touchBtnSubmit"
loadingText="问题回答中，请在问题回答结束后重试！"
:isLoading="!answerIsOver"
:isDisabled="false"
/>
</view>
</view>
<uni-popup ref="popupRef" class="popup">
<view class="sheet_popup_div" >
<view class="sheet_popup_div">
<view class="title_div">
<view class="text">
答题卡
</view>
<view class="text">答题卡</view>
<view class="popup_back_div" @click="openSheet(false)">
<image :src="optionErrorIcon('#000000')" class="img"></image>
</view>
</view>
<view class="sheet_table">
<view class="sheet_table_item" v-for="(item,index) in topicList" :class="{
'current':index === questionNumber,
'mark':markList.includes(item.qnsId),
'completed':completedList.includes(item.qnsId),
}" @click="clikc_sheet_item(index)">
<view
class="sheet_table_item"
v-for="(item, index) in topicList"
:class="{
current: index === questionNumber,
mark: markList.includes(item.qnsId),
completed: completedList.includes(item.qnsId)
}"
@click="clikc_sheet_item(index)"
>
<view class="circle">
{{index + 1}}
{{ index + 1 }}
</view>
</view>
</view>
<view class="sheet_button">
<uv-button class="button" type="primary" :throttleTime="100" text="交卷" color="#0066FF"
<uv-button
class="button"
type="primary"
:throttleTime="100"
text="交卷"
color="#0066FF"
custom-style="color:#FFFFFF;borderRadius:16rpx;height:92rpx;"
@click="hand_in_paper_button_click()"></uv-button>
@click="hand_in_paper_button_click()"
></uv-button>
</view>
</view>
</uni-popup>
<!-- 反馈组件 -->
<Feedback ref="feedbackRef"></Feedback>
<!-- 结尾弹出层 -->
<Dialog ref="dialogRef" :dialogConfiguration="dialogConfiguration" @button_click="result_click">
</Dialog>
<Dialog ref="dialogRef" :dialogConfiguration="dialogConfiguration" @button_click="result_click"></Dialog>
</view>
</template>
<script setup>
import Feedback from './components/feedback.vue'
import Dialog from './components/dialog.vue'
import RadioSubject from '@/components/examination/radio-subject.vue'
import CharactersSubject from '@/components/examination/characters-subject.vue'
import TouchBtn from '@/components/examination/touchBtn.vue'
import {
ref,
reactive,
computed,
onMounted,
nextTick
} from 'vue';
import {
onLoad
} from '@dcloudio/uni-app'
import Feedback from './components/feedback.vue';
import Dialog from './components/dialog.vue';
import Subject from '@/components/examination/subject.vue';
import CharactersSubject from '@/components/examination/characters-subject.vue';
import TouchBtn from '@/components/examination/touchBtn.vue';
import { ref, reactive, computed, onMounted, nextTick } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import common from '@/common/common';
import {
getPageCache
} from '@/common/common';
import {
commonUploadVoiceFile
} from "@/api/common.js"
import {
optionErrorIcon,
examinationSheetIcon
} from '@/common/imgSvg'
import {
commitPaperExam,
queryPaperExamScore
} from '@/api/examination.js'
import { getPageCache } from '@/common/common';
import { commonUploadVoiceFile } from '@/api/common.js';
import { optionErrorIcon, examinationSheetIcon } from '@/common/imgSvg';
import { commitPaperExam, queryPaperExamScore } from '@/api/examination.js';
const answerIsOver = ref(true)
const feedbackRef = ref(null)
const dialogRef = ref(null)
const popupRef = ref(null)
const mode = ref('examination') // 考试 examination 练习practice
const answerIsOver = ref(true);
const feedbackRef = ref(null);
const dialogRef = ref(null);
const popupRef = ref(null);
const mode = ref('examination'); // 考试 examination 练习practice
const paperData = reactive({
execId: '', // 执行ID
examId: '', // 考试ID
papersId: '', // 试卷ID
limitTm: 0, // 考试限制时间
papersName: '', // 试卷名称
}) // 试卷信息
const topicList = reactive([]) // 问题列表
const popup_input_bottom = ref('0px')
const questionNumber = ref(0) // 题号
papersName: '' // 试卷名称
}); // 试卷信息
const topicList = reactive([]); // 问题列表
const popup_input_bottom = ref('0px');
const questionNumber = ref(0); // 题号
const systemInfo = uni.getSystemInfoSync();
const showTouchBtn = computed(() => {
return topicList[questionNumber.value]['qnsTyp'] === 'ES'
})
return topicList[questionNumber.value]['qnsTyp'] === 'ES';
});
const completedList = computed(() => {
return []
})
return [];
});
const markList = computed(() => topicList.filter(res => !!res.mark).map(res => res.qnsId)) // 标记列表
const markList = computed(() => topicList.filter((res) => !!res.mark).map((res) => res.qnsId)); // 标记列表
// 下一题按钮状态
const next_question = computed(() => (topicList.length === questionNumber.value + 1) ? '交卷' : '下一题')
const next_question = computed(() => (topicList.length === questionNumber.value + 1 ? '交卷' : '下一题'));
const progress = computed(() => { // 计算进度百分比（保留两位小数）
const progress = computed(() => {
// 计算进度百分比（保留两位小数）
const total = topicList.length;
if (total === 0) return 0;
const completed = questionNumber.value + 1;
return Math.min(Math.round((completed / total) * 10000) / 100, 100);
})
});
// 弹出框配置
const dialogConfiguration = reactive({})
const dialogConfiguration = reactive({});
const activeVoiceId = ref('')
const activeVoiceId = ref('');
const swiperChange = (item) => {
questionNumber.value = item.detail.current
}
questionNumber.value = item.detail.current;
};
// 按上一题下一题
const button_tab = (num) => {
@@ -185,81 +200,78 @@
newNumber = 0;
} else if (newNumber >= topicList.length) {
newNumber = topicList.length - 1;
hand_in_paper_button_click() // 调用交卷
hand_in_paper_button_click(); // 调用交卷
}
questionNumber.value = newNumber;
}
};
// 打开或者关闭弹出层
const openSheet = (status) => status ? popupRef.value.open('bottom') : popupRef.value.close();
const openSheet = (status) => (status ? popupRef.value.open('bottom') : popupRef.value.close());
// 点击答题卡按钮
const clikc_sheet_item = (index) => {
questionNumber.value = index
}
questionNumber.value = index;
};
const subject_click = (type, params) => {
if (type === 'mark') {
topicList[questionNumber.value]['mark'] = !topicList[questionNumber.value]['mark']
topicList[questionNumber.value]['mark'] = !topicList[questionNumber.value]['mark'];
} else if (type === 'feedback') {
console.log('feedbackRef.value', feedbackRef.value);
feedbackRef.value.open()
feedbackRef.value.open();
}
}
};
const voicePathValue = ref('');
const voicePathValue = ref('')
// 录音按钮提交
const touchBtnSubmit = (type, submitObj) => {
if (type === 'voice') {
uploadRecordNow(submitObj)
}else if (type === 'text') {
uploadRecordNow(submitObj);
} else if (type === 'text') {
}
}
};
// 发送语音
const uploadRecordNow = (voicePath) => {
commonUploadVoiceFile(voicePath, '/traask/traAskchat/voiceTrans', {}).then(res => {
let _res = JSON.parse(res.data)
voicePathValue.value = voicePath
console.log('_res', _res, voicePath);
if (_res.rtnCode === '0000') {
}
}).catch(err => {
uni.showToast({
title: '系统异常，请联系管理员',
icon: "none",
duration: 1000
commonUploadVoiceFile(voicePath, '/traask/traAskchat/voiceTrans', {})
.then((res) => {
let _res = JSON.parse(res.data);
voicePathValue.value = voicePath;
console.log('_res', _res, voicePath);
if (_res.rtnCode === '0000') {
}
})
.catch((err) => {
uni.showToast({
title: '系统异常，请联系管理员',
icon: 'none',
duration: 1000
});
});
})
}
};
// 发送文本
const submitAnswerNow = (val, cb = null) => {
}
const submitAnswerNow = (val, cb = null) => {};
// 初始化时检查
onLoad(() => {
const examination = getPageCache('examination')
const examination = getPageCache('examination');
if (!examination) {
common.navigateBack()
return
common.navigateBack();
return;
}
paperData.execId = examination.execId
paperData.examId = examination.examId
paperData.papersId = examination.papersId
paperData.limitTm = examination.limitTm
paperData.papersName = examination.papersName
topicList.push(...examination.qnsInfoVos.map(res => ({
...res,
mark: false,
my_answer: [],
backend_answer: [],
})))
paperData.execId = examination.execId;
paperData.examId = examination.examId;
paperData.papersId = examination.papersId;
paperData.limitTm = examination.limitTm;
paperData.papersName = examination.papersName;
topicList.push(
...examination.qnsInfoVos.map((res) => ({
...res,
mark: false,
my_answer:''
}))
);
// 安全区域底部到屏幕底部的高度（即底部安全区域高度）
const safeAreaBottomHeight = systemInfo.screenHeight - systemInfo.safeArea.bottom;
uni.onKeyboardHeightChange(res => {
uni.onKeyboardHeightChange((res) => {
let keyboardHeight = res.height;
// 仅在iOS端补偿安全区域高度
if (systemInfo.platform === 'ios') {
@@ -270,125 +282,130 @@
});
});
const result_click = ({
key
}) => {
const result_click = ({ key }) => {
console.log('res', key);
if (key === 'hand_in_paper') { // 现在交卷
hand_in_paper()
} else if (key === 'continue') { // 继续考试
dialogRef.value.close()
if (key === 'hand_in_paper') {
// 现在交卷
hand_in_paper();
} else if (key === 'continue') {
// 继续考试
dialogRef.value.close();
}
}
};
// 交卷按钮点击，打开交卷确认框
const hand_in_paper_button_click = () => {
console.log('点击交卷', paperData);
// 判断是否完成所有题目
const completeList = topicList.filter(res => !!(Array.isArray(res.my_answer) ? res.my_answer.length : res
.my_answer)).map(res => ({
a: res.qnsId,
b: res.my_answer,
c: !!res.my_answer
}))
dialogConfiguration.title = '确认现在交卷吗?'
const completeList = topicList
.filter((res) => !!(Array.isArray(res.my_answer) ? res.my_answer.length : res.my_answer))
.map((res) => ({
a: res.qnsId,
b: res.my_answer,
c: !!res.my_answer
}));
dialogConfiguration.title = '确认现在交卷吗?';
const style_button_1 = {
color: '#FFFFFF',
fontSize: '30rpx',
backgroundColor: '#0066FF',
borderRadius: '8rpx'
}
};
const style_button_2 = {
color: '#0066FF',
fontSize: '30rpx',
backgroundColor: '#E2EDFF',
borderRadius: '8rpx'
}
const incompleteNumber = topicList.length - completeList.length
if (incompleteNumber === 0) { // 完成
dialogConfiguration.type = 'complete'
dialogConfiguration.title = '确认现在交卷吗?'
dialogConfiguration.buttonList = [{
key: 'hand_in_paper',
name: '现在交卷',
style: style_button_1
}, {
key: 'continue',
name: '继续考试',
style: style_button_2
}]
};
const incompleteNumber = topicList.length - completeList.length;
if (incompleteNumber === 0) {
// 完成
dialogConfiguration.type = 'complete';
dialogConfiguration.title = '确认现在交卷吗?';
dialogConfiguration.buttonList = [
{
key: 'hand_in_paper',
name: '现在交卷',
style: style_button_1
},
{
key: 'continue',
name: '继续考试',
style: style_button_2
}
];
} else {
dialogConfiguration.type = 'incomplete' // 未完成
dialogConfiguration.html =
`当前考试进度：<text style="color:#0066FF;font-weight:bold;">${completeList.length}/${topicList.length}</text> 题 还有<text style="color:#0066FF;font-weight:bold;">${incompleteNumber}</text>道题未作答，确认交卷吗？`
dialogConfiguration.buttonList = [{
key: 'continue',
name: '继续考试',
style: style_button_1
}, {
key: 'hand_in_paper',
name: '现在交卷',
style: style_button_2
}]
dialogConfiguration.type = 'incomplete'; // 未完成
dialogConfiguration.html = `当前考试进度：<text style="color:#0066FF;font-weight:bold;">${completeList.length}/${topicList.length}</text> 题 还有<text style="color:#0066FF;font-weight:bold;">${incompleteNumber}</text>道题未作答，确认交卷吗？`;
dialogConfiguration.buttonList = [
{
key: 'continue',
name: '继续考试',
style: style_button_1
},
{
key: 'hand_in_paper',
name: '现在交卷',
style: style_button_2
}
];
}
dialogRef.value.open()
}
dialogRef.value.open();
};
// 执行交卷
const hand_in_paper = () => {
const answerDtoList = topicList.map(res => {
const answerDtoList = topicList.map((res) => {
let answerItem = {
examId: paperData.examId,
papersId: paperData.papersId,
qnsId: res.qnsId,
ossKey: '',
anserResult: '',
}
if (res.qnsTyp === 'ES') { // 问答题特殊处理
anserResult: ''
};
if (res.qnsTyp === 'ES') {
// 问答题特殊处理
return {
...answerItem,
anserResult: ''
}
} else { //其他题
};
} else {
//其他题
return {
...answerItem,
anserResult: res.my_answer.join(',')
}
};
}
})
});
console.log('answerDtoList', answerDtoList);
dialogRef.value.close()
common.loading('正在提交')
dialogRef.value.close();
common.loading('正在提交');
commitPaperExam({
examId: paperData.examId,
execId: paperData.execId || '1',
examLenTm: 1200,
answerDtoStr: JSON.stringify(answerDtoList)
}).then(res => {
console.log('提交成功', res);
if (res.body.flagQuery === 'Y') { // 需要查分
common.redirectTo('/pages/examination/result?execId=' + res.body.execId)
} else { // 不需要查分
common.navigateBack()
}
// const execId = res.body.execId
// let timer = setInterval(() => {
// queryPaperExamScore({
// execId
// }).then(res => {
// console.log('分数返回', res);
// clearInterval(timer)
// })
// }, 1000)
}).catch((res) => {
console.log('error', res);
}).finally(() => {
common.hideLoading().body
})
}
.then((res) => {
console.log('提交成功', res);
// 判断是否需要查分
if (res.body.flagQuery === 'Y') {// 需要查分
const examLenTm = 678;
common.redirectTo(
`/pages/examination/result?execId=${res.body.execId}&examLenTm=${examLenTm}&papersName=${paperData.papersName}`
);
} else {
// todo 此处应该有个弹窗交代下结果
common.navigateBack();
}
})
.catch((res) => {
console.log('error', res);
})
.finally(() => {
common.hideLoading().body;
});
};
</script>
<style scoped lang="scss">
@@ -404,10 +421,9 @@
padding: 0 38rpx;
.sheet_popup_div {
width: 100%;
height: 100%;
background-color: #FFFFFF;
background-color: #ffffff;
padding: 10rpx 34rpx;
display: flex;
flex-direction: column;
@@ -425,7 +441,7 @@
color: #000000;
text-align: center;
font-style: normal;
border-bottom: 2rpx solid #EFEFEF;
border-bottom: 2rpx solid #efefef;
}
.popup_back_div {
@@ -439,7 +455,6 @@
justify-content: center;
.img {
width: 30rpx;
height: 30rpx;
}
@@ -457,7 +472,7 @@
width: calc((100vw - 108rpx) / 5 - 16rpx);
height: calc((100vw - 108rpx) / 5 - 16rpx);
margin: 8rpx;
border: 2rpx solid #E5E5E5;
border: 2rpx solid #e5e5e5;
border-radius: 50%;
display: flex;
align-items: center;
@@ -468,29 +483,29 @@
.current {
background-color: rgba(0, 102, 255, 0.6);
border-color: #0066FF;
color: #FFFFFF;
border-color: #0066ff;
color: #ffffff;
}
.completed {
// 已完成
background-color: rgba(0, 102, 255, 0.1);
border-color: #0066FF;
color: #0066FF;
border-color: #0066ff;
color: #0066ff;
}
.mark,
.completed.mark {
background-color: rgba(232, 181, 49, 0.1);
color: #E8B531;
border-color: #E8B531;
color: #e8b531;
border-color: #e8b531;
}
.current.mark {
// 已完成
background-color: rgba(0, 102, 255, 0.6);
color: #FFFFFF;
border-color: #E8B531;
color: #ffffff;
border-color: #e8b531;
}
}
@@ -506,11 +521,10 @@
left: 0;
bottom: 0;
border-radius: 16rpx 16rpx 0px 0px;
border: 2rpx solid #E5E5E5;
background: #FFFFFF;
border: 2rpx solid #e5e5e5;
background: #ffffff;
}
.touch-btn-div {
height: 0;
overflow: hidden;
@@ -527,7 +541,7 @@
justify-content: space-between;
align-items: center;
padding: 0 20rpx 20rpx 20rpx;
.sheet_button {
display: flex;
flex-direction: column;
@@ -537,7 +551,6 @@
.img {
width: 38rpx;
height: 40rpx;
}
.sheet_text {
@@ -569,13 +582,12 @@
.swiper {
// 状态栏 var(--status-bar-height)
// 标题栏 70rpx
// 进度时间栏 70rpx
// 进度时间栏上下间距 40rpx = 20rpx + 20rpx
// 标题栏 70rpx
// 进度时间栏 70rpx
// 进度时间栏上下间距 40rpx = 20rpx + 20rpx
// 正文上下间距 64rpx
height: calc(100vh - var(--status-bar-height) - 70rpx - 70rpx - 40rpx - 64rpx);
// background-color: red;
}
.content {
@@ -592,7 +604,7 @@
left: 0%;
width: calc(100% - 66rpx);
height: 28rpx;
background-color: #FFFFFF;
background-color: #ffffff;
border-radius: 0 0 14rpx 14rpx;
opacity: 0.4;
z-index: 0;
@@ -615,7 +627,7 @@
justify-content: space-between;
font-family: PingFangSC;
font-size: 26rpx;
color: #FFFFFF;
color: #ffffff;
text-align: left;
font-style: normal;
}
@@ -632,14 +644,14 @@
}
:deep(.uv-count-down__text) {
color: #FFFFFF !important;
color: #ffffff !important;
font-weight: 600;
font-size: 26rpx !important;
}
}
.grey {
color: #B6E2FF;
color: #b6e2ff;
}
.bold {
@@ -658,11 +670,10 @@
font-family: PingFangSC;
font-weight: 500;
font-size: 34rpx;
color: #FFFFFF;
color: #ffffff;
text-align: center;
font-style: normal;
line-height: 70rpx;
}
.back_div {
@@ -678,9 +689,9 @@
.main_div {
display: flex;
flex-direction: column;
background: linear-gradient(to top, #3480FF, #0066FF);
background: linear-gradient(to top, #3480ff, #0066ff);
/* 确保背景占满整个视口高度 */
min-height: 100vh;
margin: 0;
}
</style>
</style>
src/pages/examination/result.vue
+171 -178
View File
@@ -2,56 +2,60 @@
<view class="main_div max_page">
<nav-bar :is_seat="true"></nav-bar>
<view class="nav-div">
<view class="title ellipsis-text">
考试结算
</view>
<view class="title ellipsis-text">考试结算</view>
<view class="back_div">
<view class="back-icon"></view>
</view>
</view>
<!-- <view class="sheet_table_div_fixed" v-if="sheet_table_status">
<swiper :indicator-dots="false" class="sheet_swiper" :current="sheet_swiper_index" @change="sheet_swiper_change">
<swiper-item v-for="(group, groupIndex) in groupedTopicList" :key="groupIndex">
<uv-grid :col="5" class="sheet_table" @click="sheet_click">
<uv-grid-item v-for="(item,index) in group" :key="index">
<view class="circle">
{{ groupIndex * 10 + index + 1 }}
</view>
</uv-grid-item>
</uv-grid>
</swiper-item>
</swiper>
<view class="swiper-dots">
</view>
</view> -->
<scroll-view :scroll-y="true" @scroll="scroll" :scroll-top="scrollTop" class="scroll scroll-Y"
:scroll-with-animation="true" :show-scrollbar="false">
<scroll-view
:scroll-y="true"
@scroll="scroll"
:scroll-top="scrollTop"
class="scroll scroll-Y"
:scroll-with-animation="true"
:show-scrollbar="false"
>
<view class="information-details-div">
<view class="top">
<view class="left">
<view class="top">得分</view>
<view class="mid">
<text v-if="pass_status===0" class="loading-pass">--</text>
<text v-if="pass_status===-1" class="no-pass">40</text>
<text v-if="pass_status===1" class="pass">50</text>
<text v-if="pass_status === 0" class="loading-pass">--</text>
<text v-if="pass_status === -1" class="no-pass">{{ result.examGrade }}</text>
<text v-if="pass_status === 1" class="pass">{{ result.examGrade }}</text>
</view>
<view class="bottom">
<text v-if="pass_status===-1">失败乃成功之母，继续努力</text>
<text v-if="pass_status===1">考的不错啊，继续加油</text>
<text v-if="pass_status===0">考试结果计算中...</text>
<image v-if="pass_status===1" src="@/static/images/login/clap.png" mode="widthFix"
style="width: 32rpx;"></image>
<text v-if="pass_status === -1">失败乃成功之母，继续努力</text>
<text v-if="pass_status === 1">考的不错啊，继续加油</text>
<text v-if="pass_status === 0">考试结果计算中...</text>
<image
v-if="pass_status === 1"
src="@/static/images/login/clap.png"
mode="widthFix"
style="width: 32rpx"
></image>
</view>
</view>
<view class="right">
<view class="img">
<image v-if="pass_status===1" src="@/static/images/examination/qualified.png"
mode="widthFix" style="width: 270rpx;"></image>
<image v-if="pass_status===-1" src="@/static/images/examination/unqualified.png"
mode="widthFix" style="width: 270rpx;"></image>
<image v-if="pass_status===0" src="@/static/images/examination/getting_in.gif"
mode="widthFix" style="width: 270rpx;"></image>
<view class="img_div">
<image
v-if="pass_status === 1"
src="@/static/images/examination/qualified.png"
mode="aspectFit"
class="img"
></image>
<image
v-if="pass_status === -1"
src="@/static/images/examination/unqualified.png"
mode="aspectFit"
class="img"
></image>
<image
v-if="pass_status === 0"
src="@/static/images/examination/getting_in.gif"
mode="aspectFit"
class="img"
></image>
</view>
</view>
</view>
@@ -59,41 +63,44 @@
<!-- 考试标题 -->
<view class="title-div">
<view class="title-icon">
<image src="@/static/images/examination/examination-icon.png" mode="widthFix" class="img">
</image>
</view>
<view class="title ellipsis-text">
考试：这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称这里是考试名称
<image
src="@/static/images/examination/examination-icon.png"
mode="widthFix"
class="img"
></image>
</view>
<view class="title ellipsis-text">考试：{{ result.papersName }}</view>
</view>
<!-- 时间和考试按钮 -->
<view class="time-and-exam-button">
<view class="time-icon">
<image src="@/static/images/examination/duration-icon.png" mode="widthFix" class="img">
</image>
<image src="@/static/images/examination/duration-icon.png" mode="widthFix" class="img"></image>
</view>
<view class="time">
时长：12 分 15 秒
</view>
<view class="fl1">
<!-- 12 分 15 秒 -->
时长：{{ result.examLenTm }}
</view>
<view class="fl1"></view>
<view class="examination">
<view>考试排行榜</view>
<view class="back-icon"></view>
</view>
</view>
</view>
</view>
<view class="main-div">
<!-- <uv-sticky id='tabsDiv' class="sticky"> -->
<view class="sheet_table_div">
<swiper :indicator-dots="false" class="sheet_swiper" :current="sheet_swiper_index" @change="sheet_swiper_change">
<view class="sheet_table_div" v-if="pass_status !== 0 && topicList.length > 0">
<swiper
:indicator-dots="false"
class="sheet_swiper"
:style="{ height: topicList.length > 5 ? '230rpx' : '115rpx' }"
:current="sheet_swiper_index"
@change="sheet_swiper_change"
>
<!-- 循环渲染分组后的数组 -->
<swiper-item v-for="(group, groupIndex) in groupedTopicList" :key="groupIndex">
<uv-grid :col="5" class="sheet_table" @click="sheet_click">
<uv-grid-item v-for="(item,index) in group" :key="index">
<uv-grid-item v-for="(item, index) in group" :key="index">
<view class="circle">
{{ groupIndex * 10 + index + 1 }}
</view>
@@ -101,70 +108,57 @@
</uv-grid>
</swiper-item>
</swiper>
<view class="swiper-dots">
</view>
<view class="swiper-dots"></view>
</view>
<!-- </uv-sticky> -->
<!-- 获取答题结果时候的图片 -->
<view class="loading-pass-image-div" v-if="pass_status===0">
<view class="loading-pass-image-div" v-if="pass_status === 0">
<image src="@/static/images/examination/getting_robot.png" mode="widthFix" class="img"></image>
<view class="tip">
你的等待会有更精确的结果，要耐心哦~
</view>
<view class="tip">你的等待会有更精确的结果，要耐心哦~</view>
</view>
<view class="item" :id="'id_'+index" :class="getStatusClass(index)" v-for="(item,index) in dataList">
<view class="top">
<view class="type">
单选题
<!-- <view class="top">
<view class="type">单选题</view>
<view class="score">5分</view>
<view class="fl1"></view>
<view class="right">
<view class="right_text">
展开
</view>
<view class="score">
5分
</view>
<view class="fl1">
</view>
<!-- <view class="right">
<view class="right_text">
展开
</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon>
</view> -->
</view>
<view class="text">
属于商业银行风险管理“三道防线”的哪些风险管理部门，为什么？
</view>
<view class="additional_div">
<!-- <RadioSubject></RadioSubject> -->
</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon>
</view>
</view>
<view class="text">属于商业银行风险管理“三道防线”的哪些风险管理部门，为什么？</view>
<view class="additional_div">
<RadioSubject></RadioSubject>
</view> -->
<view class="" :id="'id_' + index" :class="getStatusClass(index)" v-for="(item, index) in topicList">
<topic-display :item="item" mode="mistake"></topic-display>
</view>
</view>
</scroll-view>
</view>
</template>
<script setup>
import {
ref,
reactive,
computed,
onMounted,
nextTick,
getCurrentInstance
} from 'vue';
// import RadioSubject from '../wrong_question_record/components/radio-subject.vue'
const statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
const pass_status = ref(1)
const sheet_swiper_index = ref(0)
import { onLoad } from '@dcloudio/uni-app';
import { ref, reactive, computed, onMounted, nextTick, getCurrentInstance } from 'vue';
import { queryPaperExamScore } from '@/api/examination.js';
const pass_status = ref(0);
const sheet_swiper_index = ref(0);
const result = reactive({
execId: '',
papersName: '',
examLenTm: '',
examGrade: ''
});
const sheet_swiper_change = (event) => {
sheet_swiper_index.value = event.detail.current
}
const topicList = reactive([1, 2, 3, 4, 5, 6, 3, 4, 5, 6, 3, 4, 5, 6, 3, 4, 5, 6, 3, 4, 5, 6])
const dataList = reactive([1, 2, 3, 4, 5, 6])
sheet_swiper_index.value = event.detail.current;
};
const topicList = reactive([]);
// 答题卡计算属性
const groupedTopicList = computed(() => {
if (!topicList || topicList.length === 0) {
@@ -178,30 +172,17 @@
}
return groups;
});
const sheet_table_status = ref(false)
const scrollTop = ref(0)
const scrollTop = ref(0);
// 答题卡点击
const sheet_click = (index) => {
scrollTop.value = index * 200
scrollTop.value = index * 200;
};
console.log('index', index);
// sheet_table_status.value = false
// nextTick(() => {
// sss.value = 'id_' + index
// nextTick(() => {
// sheet_table_status.value = true
// })
// })
}
const scroll = (event) => {
const top = event.detail.scrollTop
console.log('top', top);
if (top > 257) {
sheet_table_status.value = true
} else {
sheet_table_status.value = false
}
}
};
const getStatusClass = (index) => {
const remainder = index % 3;
if (remainder === 0) return 'in_progress';
@@ -211,11 +192,29 @@
const animationfinish = (event) => {
console.log('event', event);
};
const get_result = () => {
setTimeout(() => {
queryPaperExamScore({
execId: result.execId
}).then(({ body }) => {
console.log('分数返回', body);
if (body.isWait === 'Y') {
get_result();
} else if (body.isWait === 'N') {
pass_status.value = body.examResult === 'P' ? 1 : -1; // ｐ通过
result.examGrade = body.examGrade;
topicList.push(...body.qnsInfoVo);
}
});
}, 1000);
};
// 初始化时检查
onMounted(() => {
onLoad((e) => {
result.execId = e.execId;
result.papersName = e.papersName;
result.examLenTm = e.examLenTm;
get_result();
});
</script>
@@ -223,15 +222,11 @@
$bg-margin-left: 30rpx;
.scroll-Y {
// max-height: calc(100vh - var(--status-bar-height) - 70rpx - 70rpx - 40rpx - 64rpx - 68rpx - 60rpx);
height: calc(100vh - var(--status-bar-height) - 70rpx - 10rpx);
// background-color: red;
}
.item {
border-radius: 16rpx;
margin: 18rpx 0;
@@ -247,12 +242,12 @@
.type {
width: 108rpx;
height: 46rpx;
background: #267EFF;
background: #267eff;
border-radius: 8rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 25rpx;
color: #FFFFFF;
color: #ffffff;
text-align: center;
line-height: 46rpx;
}
@@ -278,7 +273,6 @@
text-align: left;
font-style: normal;
}
}
}
@@ -292,11 +286,10 @@
font-style: normal;
margin-top: 20rpx;
}
}
.sticky {}
.sticky {
}
.sheet_table_div_fixed {
position: absolute;
@@ -318,9 +311,9 @@
z-index: 600;
background-color: #fff;
}
.sheet_swiper {
height: 230rpx;
// max-height: 230rpx;
}
.swiper-dots {
@@ -339,41 +332,40 @@
display: flex;
align-items: center;
justify-content: center;
border: 2rpx solid #E5E5E5;
border: 2rpx solid #e5e5e5;
margin: 20rpx;
}
.current {
background-color: rgba(0, 102, 255, 0.6);
border-color: #0066FF;
color: #FFFFFF;
border-color: #0066ff;
color: #ffffff;
}
.completed {
// 已完成
background-color: rgba(0, 102, 255, 0.1);
border-color: #0066FF;
color: #0066FF;
border-color: #0066ff;
color: #0066ff;
}
.mark,
.completed.mark {
background-color: rgba(232, 181, 49, 0.1);
color: #E8B531;
border-color: #E8B531;
color: #e8b531;
border-color: #e8b531;
}
.current.mark {
// 已完成
background-color: rgba(0, 102, 255, 0.6);
color: #FFFFFF;
border-color: #E8B531;
color: #ffffff;
border-color: #e8b531;
}
}
// 主内容框
.main-div {
display: flex;
flex-direction: column;
padding: 34rpx 0 30rpx 0;
@@ -419,13 +411,10 @@
font-style: normal;
}
}
}
// 信息框
.information-details-div {
display: flex;
flex-direction: column;
padding: 34rpx 20rpx 30rpx 48rpx;
@@ -433,15 +422,18 @@
border-radius: 16rpx;
position: relative;
background-color: #fff;
opacity: .8;
opacity: 0.8;
box-shadow: 2rpx -2rpx 2rpx #fff;
&>.top {
& > .top {
display: flex;
justify-content: space-between;
&>.left {
&>.top {
& > .left {
display: flex;
flex-direction: column;
justify-content: space-between;
& > .top {
font-family: PingFangSC;
font-weight: 700;
font-size: 34rpx;
@@ -451,17 +443,18 @@
font-style: normal;
}
&>.mid {
& > .mid {
font-weight: 700;
font-size: 66rpx;
line-height: 66rpx;
text-align: left;
font-style: normal;
margin-top: 34rpx;
margin-bottom: 30rpx;
height: 100rpx;
// margin-top: 34rpx;
// margin-bottom: 30rpx;
}
&>.bottom {
& > .bottom {
display: flex;
align-items: center;
font-family: PingFangSC;
@@ -471,18 +464,21 @@
line-height: 24rpx;
text-align: left;
font-style: normal;
}
}
&>.right {
& > .right {
margin-left: 20rpx;
.img_div {
.img {
width: 270rpx;
height: 190rpx;
}
}
}
}
&>.bottom {
& > .bottom {
font-family: PingFangSC;
font-weight: 400;
font-size: 26rpx;
@@ -517,7 +513,7 @@
.examination {
display: flex;
align-items: center;
color: #0066FF;
color: #0066ff;
.back-icon {
position: relative;
@@ -538,8 +534,8 @@
left: 25%;
width: 40%;
height: 40%;
border-top: 4rpx solid #0066FF;
border-left: 4rpx solid #0066FF;
border-top: 4rpx solid #0066ff;
border-left: 4rpx solid #0066ff;
transform: rotate(135deg);
}
}
@@ -547,25 +543,23 @@
}
.loading-pass {
color: #0066FF;
color: #0066ff;
font-family: DINAlternate, DINAlternate;
font-weight: bold;
font-size: 65rpx;
color: #0066FF;
letter-spacing: 12rpx
color: #0066ff;
letter-spacing: 12rpx;
}
.no-pass {
color: #D70C18;
color: #d70c18;
}
.pass {
color: #0066FF;
color: #0066ff;
}
}
.nav-div {
position: relative;
@@ -611,15 +605,14 @@
transform: rotate(-45deg);
}
}
}
.main_div {
display: flex;
flex-direction: column;
background-color: #F0F5F9;
background-color: #f0f5f9;
/* 添加30度角的斜向上渐变，高度限制为400px */
background-image: linear-gradient(30deg, #F0F5F9, #EBF1FF);
background-image: linear-gradient(30deg, #f0f5f9, #ebf1ff);
/* 渐变背景高度400px，宽度充满容器 */
background-size: 100% 600rpx;
/* 防止渐变背景重复 */
@@ -629,4 +622,4 @@
overflow: hidden;
position: relative;
}
</style>
</style>
src/pages/learningTasks/components/list-item.vue
+13 -3
View File
@@ -1,10 +1,10 @@
<template>
<view class="scroll_div">
<scroll-view scroll-y="true" class="scroll-Y" @scrolltolower="scrolltolower" :show-scrollbar="false">
<view class="item" :class="getStatusClass(item.isFinish)" v-for="(item, index) in data_list">
<view class="item" :class="getStatusClass(item.isFinish)" v-for="(item, index) in data_list" @click="click_item(item)">
<view class="img_div">
<image-preview class="img" :src="item.ossAddr" mode="scaleToFill"></image-preview>
<view class="subscript" v-if="item.isFinish === '00'">未完成</view>
<view class="subscript" v-if="item.isFinish === '00'">进行中</view>
<view class="subscript" v-if="item.isFinish === '01'">已完成</view>
</view>
<view class="right_div">
@@ -22,7 +22,7 @@
</view>
<view>
进度：
<text class="">{{ item.sumCrs ?? 0 }}/{{ item.sumCrs ?? 0 }}门课程</text>
<text class="">{{ item.finishCrs ?? 0 }}/{{ item.sumCrs ?? 0 }}门课程</text>
</view>
</view>
</view>
@@ -38,6 +38,10 @@
const total = ref(-1);
const page = ref(0);
const data_list = reactive([]);
import {
setPageCache
} from '@/common/common';
import common from '@/common/common';
import { ref, reactive, onMounted, nextTick } from 'vue';
import { queryAllTraTaskInfoByUserId } from '@/api/learningTasks.js';
@@ -89,6 +93,12 @@
if (isFinish === '01') return 'completed';
return 'expired';
};
// 跳转到详情
const click_item = (item) => {
setPageCache('learning_tasks_details', item)
common.navigateTo('/pages/learningTasks/details');
}
const scrolltolower = (item) => {
getData();
};
src/pages/learningTasks/details.vue
+78 -46
View File
@@ -14,16 +14,18 @@
<view class="right">
<view class="title_div">
<view class="title">
JBank银行服诉旦撒大银行服诉旦撒大1233333213银行服诉旦撒大银行服诉旦撒大银行服诉旦撒大
{{ detailData.taskName }}
</view>
</view>
<view class="time">
<text class="color_3">起止时间：</text>
<text class="color_class">2025-05-13至2025-05-13</text>
<text class="color_class">
{{ detailData.startTm?.substr(0, 10) }}至{{ detailData.endTm?.substr(0, 10) }}
</text>
<view class="fl1"></view>
<view class="num-item" @click="collect_click('ss')">
<view class="num-item" @click="collect_click(detailData.collectionId)">
<image
v-if="false"
v-if="detailData.collectionId"
class="collect-icon"
src="@/static/images/courseDetail/out_collect.png"
mode="widthFix"
@@ -39,11 +41,11 @@
<view class="num_div">
<view class="num_div_item">
<text class="color_3">完成人数：</text>
<text class="color_2">34/125</text>
<text class="color_2">{{ detailData.taskFinishSums ?? 0 }}/{{ detailData.taskSums ?? 0 }}</text>
</view>
<view class="num_div_item">
<text class="color_3">进度：</text>
<text class="color_2">2/4门课程</text>
<text class="color_2">{{ detailData.finishCrs ?? 0 }}/{{ detailData.sumCrs ?? 0 }}门课程</text>
</view>
</view>
</view>
@@ -60,20 +62,35 @@
:show-scrollbar="false"
@scrolltolower="scrolltolower"
>
<view class="item" v-for="item in [1, 23, 4, 5, 6, 78, 8, 1231, 1, , 123, 213, 213, 123]">
<view class="item" v-for="item in data_list" @click="item_click(item)">
<view class="progress_div">
<view class="circle_div"></view>
<view class="line_div"></view>
</view>
<view class="content_div">
<view class="status_div">已结束</view>
<view class="status_div">
<text v-if="item.status==='01'">进行中</text>
<text v-if="item.status==='02'">已完成</text>
<text v-if="item.status==='03'">未解锁</text>
</view>
<view class="main_body_div">
<view class="title">中国银行业的监管机构有哪些中国银行业的监管机构有哪些中国银行业的监管机构有哪些中国银行业的监管机构有哪些中国银行业的监管机构有哪些</view>
<view class="title">
{{item.crsName}}
</view>
<view class="button_div">
<image class="img" :src="passTheExamIcon('#0066FF')"></image>
<view class="button_text">完成练习</view>
<template v-if="item.isFinishStudy==='01' && item.isFinishExam==='01'">
<image class="img" :src="lockIcon('#999999')"></image>
<view class="button_text">暂无通过条件，可自动解锁</view>
</template>
<template v-if="item.isFinishStudy!=='01'">
<image class="img" :src="passTheExamIcon('#0066FF')"></image>
<view class="button_text">完成练习</view>
</template>
<template v-if="item.isFinishExam!=='01'">
<image class="img" :src="completeTheExercisesIcon('#0066FF')"></image>
<view class="button_text">通过考试</view>
</template>
</view>
</view>
</view>
@@ -85,44 +102,56 @@
<script setup>
import { onLoad } from '@dcloudio/uni-app';
import { reactive, computed } from 'vue';
import { startTraExamPapersInfo } from '@/api/examination.js';
import { passTheExamIcon, completeTheExercisesIcon } from '@/common/imgSvg';
import { reactive, computed, nextTick } from 'vue';
import { queryAllTraTaskCrsInfo } from '@/api/learningTasks.js';
import { passTheExamIcon, completeTheExercisesIcon, lockIcon } from '@/common/imgSvg';
import { insertTraPersonalCollectionTask, deleteTraPersonalCollectionById } from '@/api/favorites.js';
import common from '@/common/common';
import { setPageCache, getPageCache } from '@/common/common';
const detailData = reactive({
papersId: '',
papersName: '',
examStartTm: '',
examEndTm: '',
execPersionNumer: '',
planPersionNumber: '',
judgeNumber: 0,
singleNumber: 0,
multiNumber: 0,
essayNumber: 0,
judgeGrade: 0,
singleGrade: 0,
multiGrade: 0,
essayGrade: 0
taskId: '',
taskName: '',
collectionId: '',
taskFinishSums: '',
taskSums: '',
finishCrs: '',
sumCrs: ''
});
const data_list = reactive([]);
const getData = () => {
queryAllTraTaskCrsInfo({
taskId: detailData.taskId
// taskId: 'TASKINFO02506401613920250820161715000008095'
})
.then((res) => {
data_list.push(...res.body);
})
.finally(() => {});
};
const scrolltolower = () => {};
const item_click = (item) => {
};
const collect_click = async (collectId) => {
console.log('学习', collectId);
try {
if (!collectId) {
common.loading('收藏中');
form.value.collectId = await insertTraPersonalCollectionTask({
collectTyp: '01',
collectBusId: crsId.value
const res = await insertTraPersonalCollectionTask({
collectTyp: '02',
collectBusId: detailData.taskId
});
detailData.collectionId = res.body;
common.msg('收藏成功');
} else {
common.loading('取消收藏中');
await deleteTraPersonalCollectionById({
collectId: collectId
});
form.value.collectId = null;
detailData.collectionId = null;
common.msg('取消成功');
}
} catch (e) {
@@ -130,10 +159,14 @@
}
};
onLoad((e) => {
const testing_hall_details = getPageCache('testing_hall_details');
const learning_tasks_details = getPageCache('learning_tasks_details');
Object.assign(detailData, {
...testing_hall_details
...learning_tasks_details
});
nextTick(() => {
getData();
});
console.log('detailData', detailData);
});
</script>
@@ -250,15 +283,15 @@
}
}
.scroll-div {
background: linear-gradient( 180deg, #EBF2FE 0%, #F3F7FE 6%, #F9FBFF 12%, #F4F6F8 100%);
background: linear-gradient(180deg, #ebf2fe 0%, #f3f7fe 6%, #f9fbff 12%, #f4f6f8 100%);
// background: linear-gradient(180deg, #ebf2fe 0%, #f3f7fe 6%, #fafbfc 12%, #fafbfc 100%);
border-radius: 16rpx;
margin-top: -20rpx;
z-index: 2;
box-shadow: 0 0 10rpx #F9FBFF;
border: 2rpx solid #F9F9FA;
box-shadow: 0 0 10rpx #f9fbff;
border: 2rpx solid #f9f9fa;
margin: 0 auto;
width: calc(100% - 52rpx);
}
@@ -327,13 +360,13 @@
.right {
overflow: hidden;
margin-left: 24rpx;
width: 100%;
.title_div {
display: flex;
justify-content: space-between;
flex: 1;
.title {
font-family: PingFangSC;
font-weight: 600;
color: #000000;
@@ -359,21 +392,20 @@
height: 54rpx;
display: flex;
align-items: center;
.num-item {
display: flex;
align-items: center;
font-size: 30rpx;
color: #666666;
.collect-icon {
width: 36rpx;
height: 36rpx;
}
}
}
.num_div {
font-family: PingFangSC;
font-weight: 400;
src/pages/learningTasks/index.vue
-1
View File
@@ -44,7 +44,6 @@
<script setup>
import { LineBg } from '@/enum.js';
import listItem from './components/list-item.vue';
// 我的收藏
import { reactive, ref, computed, nextTick, onMounted, watch } from 'vue';
import common from '@/common/common.js';
const listItemRefs = ref([]);
src/pages/testingHall/details.vue
-1
View File
@@ -34,7 +34,6 @@
<view class="title-note">
考试时长：<text class="bold">{{detailData.totalGrade}}</text>分钟
</view>
<view class="title-table">
<view class="title-table-item">
<view class="top">
src/pages/wrongQuestionRecord/components/favorites-course.vue
+37 -133
View File
@@ -1,88 +1,56 @@
<template>
<view class="scroll_div">
<scroll-view :scroll-y="true" class="scroll-Y" :show-scrollbar="false" @scrolltolower="scrolltolower">
<view class="item" :class="getStatusClass(index)" v-for="(item,index) in data_list">
<view class="top">
<view class="type">
单选题
</view>
<view class="score">
5分
</view>
<view class="fl1">
</view>
<view class="right">
<view class="right_text">
展开
</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon>
</view>
</view>
<view class="text">
属于商业银行风险管理“三道防线”的哪些风险管理部门，为什么？
</view>
<view class="additional_div">
<RadioSubject></RadioSubject>
</view>
</view>
<!-- <view class="item" :class="getStatusClass(index)" v-for="(item, index) in data_list">
</view> -->
<topic-display v-for="(item, index) in data_list" :item="item" mode="mistake"></topic-display>
<uv-load-more v-if="total != 0" :status="status" loadmore-text="轻轻上拉加载" :height="30"></uv-load-more>
</scroll-view>
</view>
</template>
<script setup>
import RadioSubject from './radio-subject.vue'
const status = ref('loading') // loadmore - 加载前，loading - 加载中，nomore - 没有数据
const limit = 15
const total = ref(-1)
const page = ref(0)
const data_list = reactive([])
import {
ref,
reactive,
onMounted,
nextTick
} from 'vue'
import {
queryTraCrsBbsInfoByCrsId
} from '@/api/courseDetail.js';
import {
queryTraMistakesCollectionPaging,
} from '@/api/wrong_question_record.js';
const status = ref('loading'); // loadmore - 加载前，loading - 加载中，nomore - 没有数据
const limit = 15;
const total = ref(-1);
const page = ref(0);
const data_list = reactive([]);
import { ref, reactive, onMounted, nextTick } from 'vue';
import { queryTraCrsBbsInfoByCrsId } from '@/api/courseDetail.js';
import { queryTraMistakesCollectionPaging } from '@/api/wrongQuestionRecord.js';
const getData = (from = '') => {
if (from == 'first') {
if (total.value !== -1) {
return
return;
}
status.value = 'loading'
total.value = -1
page.value = 1
data_list.length = 0
status.value = 'loading';
total.value = -1;
page.value = 1;
data_list.length = 0;
} else {
if (status.value !== 'loadmore' && status.value !== '') return
status.value = 'loading'
page.value++
if (status.value !== 'loadmore' && status.value !== '') return;
status.value = 'loading';
page.value++;
}
console.log(status.value, '阿斯顿撒');
setTimeout(() => {
queryTraMistakesCollectionPaging({
isCorrect: 'N',
page: page.value,
limit: limit
}).then(res => {
total.value = res.total
data_list.push(...res.body)
}).finally(() => {
if (data_list.length >= total.value) {
status.value = 'nomore'
} else {
status.value = 'loadmore'
}
})
}, 200)
}
.then((res) => {
total.value = res.total;
data_list.push(...res.body);
})
.finally(() => {
if (data_list.length >= total.value) {
status.value = 'nomore';
} else {
status.value = 'loadmore';
}
});
}, 200);
};
const getStatusClass = (index) => {
const remainder = index % 3;
if (remainder === 0) return 'in_progress';
@@ -90,86 +58,22 @@
return 'expired';
};
const scrolltolower = (item) => {
getData()
getData();
};
defineExpose({
getData
})
});
</script>
<style scoped lang="scss">
.scroll_div {
background-color: #F1F5FA;
background-color: #f1f5fa;
padding: 22rpx;
}
.scroll-Y {
height: calc(100vh - var(--status-bar-height) - 54rpx - 88rpx - 20rpx - 44rpx - 156rpx);
// background-color: #fff;
}
.scroll-Y .item {
// height: 170rpx;
border-radius: 16rpx;
margin: 32rpx 0;
padding: 34rpx 30rpx 34rpx 36rpx;
background-color: #fff;
display: flex;
flex-direction: column;
.top {
display: flex;
align-items: center;
.type {
width: 108rpx;
height: 46rpx;
background: #267EFF;
border-radius: 8rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 25rpx;
color: #FFFFFF;
text-align: center;
line-height: 46rpx;
}
.score {
margin-left: 24rpx;
font-family: ArialMT;
font-size: 30rpx;
color: #333333;
text-align: left;
}
.right {
display: flex;
align-items: center;
.right_text {
font-family: PingFangSC;
font-weight: 600;
font-size: 28rpx;
color: #333;
line-height: 40rpx;
text-align: left;
font-style: normal;
}
}
}
.text {
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
color: #333333;
line-height: 48rpx;
text-align: left;
font-style: normal;
margin-top: 20rpx;
}
}
</style>
</style>
src/pages/wrongQuestionRecord/components/radio-subject.vue
-117
View File
@@ -1,117 +0,0 @@
<template>
<view class="">
<view class="option_div">
<view class="option_item success">
<view class="text">
A.这里是选项 A 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item success">
<view class="text">
B.这里是选项 B 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item error">
<view class="text">
C.这里是选项 C 的内容
</view>
<image class="img" src="@/static/images/common/success.png" mode="heightFix"></image>
</view>
<view class="option_item info">
D.这里是选项D的内容
</view>
</view>
<view class="analysis_div">
<view class="analysis_title">
<view class="success_answer">
正确答案：ABC
</view>
<view class="your_answer">
你的答案：<text class="red_color">AB</text>
</view>
</view>
<view class="analysis_note">
题目解析：属于商业银行风险管理“三道防线的是A部门，B部门和C部门银行风险管理“三道防线的是A部门，B部，银行风险管理“三道防线的是A部门，B部银行风险管理“三道防线的是A部门，B部
</view>
</view>
</view>
</template>
<script>
</script>
<style scoped lang="scss">
.success {
color: #15B859;
background: #E7F8ED;
}
.info {
color: #333333;
background: #F9F9F9 ;
}
.error {
color: #F5212D;
background: #FCE8E9;
}
.option_item {
width: 100%;
height: 108rpx;
border-radius: 15rpx;
margin-top: 32rpx;
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
line-height: 108rpx;
text-align: left;
font-style: normal;
padding-left: 52rpx;
display: flex;
align-items: center;
.text {
flex: 1;
white-space: nowrap;
/* 强制不换行 */
overflow: hidden;
/* 超出部分隐藏 */
text-overflow: ellipsis;
}
.img {
height: 30rpx;
padding-right: 30rpx;
}
}
.analysis_div{
.analysis_title{
display: flex;
justify-content: space-between;
align-items: center;
margin: 32rpx 0 28rpx 0;
.success_answer{
}
.your_answer{
}
.red_color{
color: #F5212D;
}
}
.analysis_note{
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
color: #666666;
line-height: 48rpx;
text-align: left;
font-style: normal;
}
}
</style>