You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
159 lines
3.0 KiB
159 lines
3.0 KiB
<template>
|
|
<view v-if="show" class="review">
|
|
<view class="review-main">
|
|
<!-- 标题 -->
|
|
<view class="review-title">{{ $t('page.review.title') }}</view>
|
|
|
|
<!-- 选项列表 -->
|
|
<view class="options">
|
|
<u-radio-group v-model="checkedOption" placement="column">
|
|
<view v-for="(item,index) in evaluateList" class="option">
|
|
<view class="option-top">
|
|
<view class="option-top-left">
|
|
<u-radio :customStyle="{marginBottom: '8px'}"
|
|
activeColor="#000" :label="item.optionValue"
|
|
:name="item.optionValue" />
|
|
</view>
|
|
<view class="option-top-right">
|
|
<u-rate :count="5"
|
|
active-color="#EEBF72"
|
|
v-model="item.num"></u-rate>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="option-content"> {{ item[type[$i18n.locale]] }}</view>
|
|
</view>
|
|
</u-radio-group>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { play } from '@/utils/clickSound.js'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
checkedOption: '',
|
|
type : {
|
|
en : 'answerEnglish',
|
|
es : "answerSpanish"
|
|
},
|
|
evaluateList : []
|
|
}
|
|
},
|
|
props : {
|
|
show : {
|
|
type : Boolean,
|
|
default : true
|
|
},
|
|
oid : {
|
|
}
|
|
},
|
|
created(){
|
|
this.getEvaluateList()
|
|
},
|
|
methods: {
|
|
//关闭选择评论弹框
|
|
closeReviewProp(){
|
|
|
|
let data = {}
|
|
|
|
this.evaluateList.forEach(n => {
|
|
if(n.optionValue == this.checkedOption){
|
|
data = n
|
|
}
|
|
})
|
|
|
|
this.request('evaluate', {}, {
|
|
evaluateId : data.id,
|
|
id : this.oid,
|
|
num : data.num
|
|
}).then(res => {
|
|
if(res.code == 200){
|
|
this.$emit('close', this.checkedOption)
|
|
this.checkedOption = ''
|
|
}
|
|
})
|
|
},
|
|
getEvaluateList(){
|
|
this.request('getEvaluateList').then(res => {
|
|
if(res.code == 200){
|
|
this.evaluateList = res.result
|
|
}
|
|
})
|
|
},
|
|
async asyncLoading() { //加载效果
|
|
return new Promise((resolve, reject) => {
|
|
uni.showLoading({
|
|
title: this.$t('page.review.loading')
|
|
});
|
|
setTimeout(() => {
|
|
uni.hideLoading();
|
|
resolve()
|
|
}, 500)
|
|
})
|
|
},
|
|
},
|
|
watch : {
|
|
checkedOption : function(newVal){
|
|
if(this.checkedOption){
|
|
play()
|
|
this.asyncLoading().then(res => {
|
|
this.closeReviewProp()
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.review {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 750rpx;
|
|
height: 100vh;
|
|
margin: 0rpx auto;
|
|
z-index: 99999;
|
|
background-color: #00000099;
|
|
|
|
.review-main {
|
|
background: $uni-bg-color;
|
|
width: 600rpx;
|
|
color: $uni-bg-color-app;
|
|
border-radius: 10rpx;
|
|
padding: 15rpx;
|
|
border: 1px solid #ccc;
|
|
|
|
.review-title {
|
|
font-size: 34rpx;
|
|
padding: 15rpx 0rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.options {
|
|
margin-top: 20rpx;
|
|
|
|
.option {
|
|
margin-bottom: 15rpx;
|
|
|
|
.option-top {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.option-content{
|
|
color: #747474;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|