作者 mxd

教师端接口对接

<template>
<view class="evaluationRecords">
<view class="answer-item2">
<view
class="answer-item2"
v-for="item in list"
:key="item.id"
>
<view class="answer-item2-star">
<u-rate :count="5" :readonly="true" :size="18" activeColor="#fc6402" v-model="value"></u-rate>
<view class="answer-item2-star-l">4.0</view>
<u-rate :count="5" :readonly="true" :size="16" activeColor="#fc6402" v-model="item.score" readonly ></u-rate>
<view class="answer-item2-star-l">{{item.score}}</view>
</view>
<view class="myQuestion-2-i-1">
<view class="myQuestion-2-i-1-l">
<image class="myQuestion-2-i-1-l-i" src="@/static/images/tx.png" mode="widthFix"></image>
<view class="myQuestion-2-i-1-l-i" >
<image
:src="item.img || '/static/images/tx.png'"
mode="widthFix">
</view>
</image>
</view>
<view class="myQuestion-2-i-1-r">
<view class="myQuestion-2-i-1-r-1">李晋心</view>
<view class="myQuestion-2-i-1-r-2">2023-12-10发布</view>
<view class="myQuestion-2-i-1-r-1">{{item.name}}</view>
<view class="myQuestion-2-i-1-r-2">{{item.create_time}}发布</view>
</view>
</view>
<view class="myQuestion-2-i-2">
老师你好请问工商管理专业的应届生可以报考工商管理
内的二级专业吗?比如说会计学,旅游管理?
{{item.content}}
</view>
<view class="myQuestion-2-i-4">
<!-- <view class="myQuestion-2-i-4">
<u--image
v-for="(item, index) in []"
:key="index"
... ... @@ -27,8 +35,16 @@
width="145rpx"
@click.native="seeImg(index)"
:src="item"></u--image>
</view>
</view> -->
</view>
<u-loadmore :status="status" v-if="!notData"/>
<u-empty
v-if="notData"
mode="data"
text="暂无数据"
icon="/static/imagesV2/icon24.png"
>
</u-empty>
</view>
</template>
... ... @@ -36,8 +52,73 @@
export default {
data() {
return {
page: 1,
list: [],
// 加载前值为loadmore,加载中为loading,没有数据为nomore
status: 'loadmore'
};
},
computed: {
notData() {
return this.status === 'nomore' && !this.list.length
}
},
onShow() {
this.onRetry()
},
onReachBottom() {
that.getData()
},
methods: {
onRetry(){
this.page=1
this.list = []
this.getData()
},
getData() {
if(this.status === 'loading') return;
this.status = 'loading';
uni.showLoading({
title: '加载中',
mask: true
})
this.$service.P_get('/lecturer/comment', {
page: this.page
}).then(res => {
uni.hideLoading();
if (res.code == 1) {
this.page++;
this.list = [
...this.list,
...res.data.data
];
this.status = res.data.data.length < res.data.per_page ? 'nomore' : 'loadmore'
}else {
this.status = 'loadmore';
if (res.msg) {
uni.showToast({
icon: 'none',
title: res.msg
})
} else {
uni.showToast({
icon: 'none',
title: '获取数据失败'
})
}
}
}).catch(e => {
this.status = 'loadmore';
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '获取数据失败,请检查您的网络连接'
})
})
}
}
}
</script>
... ... @@ -54,8 +135,8 @@
margin-bottom: 20rpx;
.answer-item2-star{
position: absolute;
top: 43rpx;
right: 29rpx;
top: 30rpx;
right: 30rpx;
display: flex;
align-items: center;
.answer-item2-star-l{
... ... @@ -70,7 +151,8 @@
.myQuestion-2-i-1-l-i{
height: 60rpx;
width: 60rpx;
border-radius: 100%;
border-radius: 50%;
overflow: hidden;
}
}
.myQuestion-2-i-1-r{
... ...
<template>
<view class="onLineDetails">
<view class="answer-item2">
<view class="answer-item2-star">
<u-rate :count="5" :readonly="true" :size="18" activeColor="#fc6402" v-model="value"></u-rate>
<view class="answer-item2-star-l">4.0</view>
</view>
<view class="myQuestion-2-i-1">
<view class="myQuestion-2-i-1-l">
<image class="myQuestion-2-i-1-l-i" src="@/static/images/tx.png" mode="widthFix"></image>
<view class="myQuestion-2-i-1-l-i">
<image :src="info.img || '/static/images/tx.png'" ></image>
</view>
</view>
<view class="myQuestion-2-i-1-r">
<view class="myQuestion-2-i-1-r-1">李晋心</view>
<view class="myQuestion-2-i-1-r-2">2023-12-10发布</view>
<view class="myQuestion-2-i-1-r-1">
<view>
{{info.name || ''}}
</view>
<view class="answer-item2-star" v-if="isWatch">
<u-rate
:count="5"
:size="18"
activeColor="#fc6402"
:value="3">
</u-rate>
<view class="answer-item2-star-l">{{info.score}}</view>
</view>
</view>
<view class="myQuestion-2-i-1-r-2">{{info.create_time || ''}}发布</view>
</view>
</view>
<view class="myQuestion-2-i-2">
老师你好请问工商管理专业的应届生可以报考工商管理
内的二级专业吗?比如说会计学,旅游管理?
{{info.question || ''}}
</view>
<view class="myQuestion-2-i-4">
<view class="myQuestion-2-i-4" v-if="info.imgs">
<u--image
v-for="(item, index) in []"
v-for="(item, index) in info.imgs"
:key="index"
radius="15rpx"
height="145rpx"
width="145rpx"
@click.native="seeImg(index)"
@click="previewImage(info.imgs,index)"
:src="item"></u--image>
</view>
<view class="myQuestion-2-i-3">
<view class="myQuestion-2-i-3" v-if="isWatch">
<view class="myQuestion-2-i-3-c">
<view class="myQuestion-2-i-3-c-1">
<view class="myQuestion-2-i-3-c-1-l">
<image class="myQuestion-2-i-3-c-1-l-i" src="@/static/images/tx.png" mode="widthFix"></image>
<text class="myQuestion-2-i-3-c-1-l-t">程菲老师回复</text>
<view class="myQuestion-2-i-3-c-1-l-i">
<image :src="info.lecturer.img_url || '/static/images/tx.png'" mode="widthFix"></image>
</view>
<text class="myQuestion-2-i-3-c-1-l-t">{{info.lecturer.title}}老师回复</text>
</view>
<view class="myQuestion-2-i-3-c-1-r">2023-12-10</view>
<view class="myQuestion-2-i-3-c-1-r">{{info.answer_time}}</view>
</view>
<view class="myQuestion-2-i-3-c-2">
同学你好,这个问题问的好,你说的这些都是不可以报的!
</view>
<view style="margin-top: 28rpx;">
<view style="margin-top: 28rpx;" v-if="isVoiceReply">
<VoicePlayback />
</view>
<view class="myQuestion-2-i-3-c-2" v-else>
{{info.answer}}
</view>
</view>
</view>
</view>
<view class="onLineDetails-1">
<view class="onLineDetails-1" v-if="isEdit">
<view class="onLineDetails-1-1">
<view class="onLineDetails-1-1-l">解答</view>
<view class="onLineDetails-1-1-r">
... ... @@ -56,17 +71,24 @@
</view>
</view>
<view class="onLineDetails-1-2" v-if="answerType === MESSAGETYPE.TEXTANSWER">
<textarea class="onLineDetails-1-2-c" placeholder="请输入" v-model="content_one"></textarea>
<textarea class="onLineDetails-1-2-c" placeholder="请输入" v-model="answer"></textarea>
</view>
<view v-else>
<RecordingDevice />
</view>
</view>
<view class="footer" v-if="isEdit">
<view class="btn" @click="submit">
提交
</view>
</view>
</view>
</template>
<script>
import { MESSAGETYPE } from "@/emit/index.js"
import { MESSAGETYPE, ANSWERTYPE } from "@/emit/index.js"
import RecordingDevice from "@/components/RecordingDevice/index.vue"
import VoicePlayback from "@/components/VoicePlayback/index.vue"
export default {
... ... @@ -77,16 +99,126 @@
data() {
return {
MESSAGETYPE,
answerType: MESSAGETYPE.VOICEANSWERS,
value: 5
id: '',
answerType: MESSAGETYPE.TEXTANSWER,
value: 5,
answer: '',
info: {}
};
},
onHide() {
computed: {
// 是否可编辑
isEdit() {
return this.info.answer_type === ANSWERTYPE.TOBEANSWERED
},
// 是否查看
isWatch() {
return this.info.answer_type === ANSWERTYPE.ANSWERED
},
// 是否语音回复
isVoiceReply() {
return MESSAGETYPE.VOICEANSWERS === this.info.answer_type
}
},
onLoad(option) {
this.id = option.id;
this.getInfo();
},
methods: {
switchItem(type) {
this.answerType = type
},
previewImage(urls,current) {
uni.previewImage({
current,
urls
})
},
getInfo() {
uni.showLoading({
title: '加载中',
mask: true
})
this.$service.P_get('/lecturer/question_info', {
id: this.id
}).then(res => {
uni.hideLoading();
if (res.code == 1) {
this.info = res.data;
}else {
if (res.msg) {
uni.showToast({
icon: 'none',
title: res.msg
})
} else {
uni.showToast({
icon: 'none',
title: '获取数据失败'
})
}
}
}).catch(e => {
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '获取数据失败,请检查您的网络连接'
})
})
},
// 提交
submit() {
uni.showLoading({
title: '提交中',
mask: true
})
const { answerType, answer, id } = this;
if(answerType === MESSAGETYPE.TEXTANSWER && !answer) {
uni.showToast({
title: '请输入解答内容',
icon: 'none'
});
return false;
}
this.$service.P_post('/lecturer/answer', {
answer_type: answerType,
answer,
id: id
}).then(res => {
uni.hideLoading();
if (res.code == 1) {
uni.showToast({
icon:'none',
title:'保存成功'
})
setTimeout(function(){
uni.navigateBack()
},1000)
}else {
if (res.msg) {
uni.showToast({
icon: 'none',
title: res.msg
})
} else {
uni.showToast({
icon: 'none',
title: '获取数据失败'
})
}
}
}).catch(e => {
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '获取数据失败,请检查您的网络连接'
})
})
}
}
}
... ... @@ -94,7 +226,7 @@
<style lang="scss" scoped>
.onLineDetails{
padding: 20rpx 25rpx;
padding: 20rpx 25rpx 140rpx;
.answer-item2{
padding: 30rpx;
background-color: #FFFFFF;
... ... @@ -102,11 +234,9 @@
border-radius: 20rpx;
position: relative;
.answer-item2-star{
position: absolute;
top: 43rpx;
right: 29rpx;
display: flex;
align-items: center;
pointer-events: none;
.answer-item2-star-l{
font-size: 24rpx;
color: #323232;
... ... @@ -119,15 +249,20 @@
.myQuestion-2-i-1-l-i{
height: 60rpx;
width: 60rpx;
border-radius: 100%;
border-radius: 50%;
overflow: hidden;
}
}
.myQuestion-2-i-1-r{
margin-left: 30rpx;
flex: 1;
.myQuestion-2-i-1-r-1{
font-size: 26rpx;
color: #323232;
font-weight: bold;
display: flex;
align-items: center;
justify-content: space-between;
}
.myQuestion-2-i-1-r-2{
font-size: 24rpx;
... ... @@ -241,4 +376,24 @@
}
}
}
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding: 16rpx 25rpx;
background-color: #fff;
.btn {
height: 88rpx;
line-height: 88rpx;
background: #2D81FF;
border-radius: 44rpx;
text-align: center;
font-size: 34rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
}
}
</style>
... ...