<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="#aec438" :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"
|
|
},
|
|
// "A" : "This app has been with me since lstarted hiah school and continued unti!had my child, You deserve to have it.",
|
|
// "B" : "Very easy to use,l have recommendedt to my familly and friends.",
|
|
// "C" : "This APp is very suitable for beginnerso choose.",
|
|
// "D" : "This APP interface is very good.",
|
|
// "E" : "Not bad, but not good either, barelyworth usina."
|
|
// optionList: [{
|
|
// letter: 'A.',
|
|
// mark: 5,
|
|
// content: this.$t('page.review.A')
|
|
// },
|
|
// {
|
|
// letter: 'B.',
|
|
// mark: 4,
|
|
// content: this.$t('page.review.B')
|
|
// },
|
|
// {
|
|
// letter: 'C.',
|
|
// mark: 3,
|
|
// content: this.$t('page.review.C')
|
|
// },
|
|
// {
|
|
// letter: 'D.',
|
|
// mark: 2,
|
|
// content: this.$t('page.review.D')
|
|
// },
|
|
// {
|
|
// letter: 'E.',
|
|
// mark: 1,
|
|
// content: this.$t('page.review.E')
|
|
// }
|
|
// ],
|
|
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: black;
|
|
width: 600rpx;
|
|
color: white;
|
|
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>
|