2025-08-01 11:39:06 +08:00

266 lines
7.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="xilu">
<view class="page-foot">
<view class="xilu_foot_nav" @click.stop="comment_post()">
<view class="btn1">提交评价</view>
</view>
</view>
<view class="container">
<view class="ptb30 plr25">
<!-- <view class="xilu_info" v-if="type==0">
<view class="flex-box">
<image src="@/static/logo.png" mode="aspectFill" class="xilu_info_cover"></image>
<view class="flex-grow-1 pl20">
<view class="fs32 fw500 colf lh46">力量训练</view>
<view class="fs24 col2 lh32 mt15">11月16日 14:2015:20</view>
<view class="flex-box mt20">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="pl10 flex-grow-1 m-ellipsis fs28 col9 lh40">上海市徐汇区石龙路壹方天地上海市徐汇区石龙路壹方天地
</view>
</view>
</view>
</view>
</view> -->
<template v-if="info">
<view class="xilu_info" v-if="info.order_type != 3">
<view class="flex-box">
<image :src="info.course_camp.course.xilufitness_urls.thumb_image" mode="aspectFill"
class="xilu_info_cover"></image>
<view class="flex-grow-1 pl20">
<view class="fs32 fw500 colf lh46">{{info.course_camp.course.title || ''}}</view>
<view class="mt15 fs24 col9 lh34">已签到<text
class="col2">{{info.code_num || 0 }}</text>/{{info.code_total_num || 0}}</view>
<view class="flex-box mt15"
@click.stop="openLocation(info.course_camp.shop.lat,info.course_camp.shop.lng)">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="pl10 flex-grow-1 m-ellipsis fs28 col9 lh40 pr20">
{{info.course_camp.shop.address || ''}}
</view>
<image src="@/static/images/xilu_guide.png" mode="widthFix" class="ico30"></image>
</view>
</view>
</view>
</view>
<view class="xilu_info" v-else>
<view class="flex-box">
<image :src="info.course_camp.course.xilufitness_urls.thumb_image" mode="aspectFill"
class="xilu_info_cover"></image>
<view class="flex-grow-1 pl20">
<view class="fs32 fw500 colf lh46">{{info.course_camp.course.title || ''}}</view>
<view class="fs24 col2 lh32 mt15">11月23日-12月17日</view>
<view class="mt15 fs24 col9 lh34">已签到<text
class="col2">{{info.code_num || 0 }}</text>/{{info.code_total_num || 0}}</view>
</view>
</view>
<view class="flex-box mt15"
@click.stop="openLocation(info.course_camp.shop.lat,info.course_camp.shop.lng)">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="pl10 flex-grow-1 m-ellipsis fs28 col9 lh40 pr20">
{{info.course_camp.shop.address || ''}}
</view>
<image src="@/static/images/xilu_guide.png" mode="widthFix" class="ico30"></image>
</view>
</view>
</template>
<view class="xilu_rate_link">
<view class="flex-box">
<view class="colf fw500 w90 fs30 lh42 mr20">专业度</view>
<htz-rate v-model="ceshi1" checkedHref="../../static/images/rate_sc.png"
disHref="../../static/images/rate_uc.png" :size="48" :gutter="30"
@change="ceshiChange"></htz-rate>
<view class="colf fs28 lh40">{{ceshi1}}</view>
</view>
<view class="flex-box mt40">
<view class="colf fw500 fs30 w90 lh42 mr20">亲和力</view>
<htz-rate v-model="ceshi2" checkedHref="../../static/images/rate_sc.png"
disHref="../../static/images/rate_uc.png" :size="48" :gutter="30"
@change="ceshiChange2"></htz-rate>
<view class="colf fs28 lh40">{{ceshi2}}</view>
</view>
<view class="flex-box mt40">
<view class="colf fw500 fs30 lh42 w90 mr20">印象</view>
<htz-rate v-model="ceshi3" checkedHref="../../static/images/rate_sc.png"
disHref="../../static/images/rate_uc.png" :size="48" :gutter="30"
@change="ceshiChange3"></htz-rate>
<view class="colf fs28 lh40">{{ceshi3}}</view>
</view>
<view class="xilu_textarea_link mt50">
<textarea v-model="content" placeholder="来评价一下您的想法吧~" placeholder-class="col6"></textarea>
<!-- <view class="tr fs22 colb7 mt30 pr20"><text class="col2">0</text>/30</view> -->
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const app = getApp();
var eventChannel = null;
import htzRate from '@/components/htz-rate/htz-rate.vue'
export default {
components: {
htzRate,
},
data() {
return {
ceshi1: 3,
ceshi2: 3,
ceshi3: 3,
info: '',
content: ''
}
},
methods: {
ceshiChange(val) {
console.log('你选择了' + val + '分');
},
ceshiChange2(val) {
console.log('你选择了' + val + '分');
},
ceshiChange3(val) {
console.log('你选择了' + val + '分');
},
//打开地图
openLocation(lat, lng) {
this.$api.openLocation(lat, lng);
},
//订单详情
getInfos(id) {
let _this = this;
this.$http({
url: '/addons/xilufitness/order/getDetail',
data: {
id: id
},
method: 'get'
}).then(res => {
if (res.code == 1) {
_this.info = res.data.info;
}
}).catch(error => {
console.log('orderError', error);
})
},
//提交评价
comment_post() {
let _this = this;
if (!_this.content) {
this.$api.toast('请输入 评价内容');
} else {
this.$http({
url: '/addons/xilufitness/order/commentOrder',
data: {
order_id: _this.info.id || 0,
content: _this.content,
profession_star: _this.ceshi1,
affinity_star: _this.ceshi2,
impression_star: _this.ceshi3
},
method: 'post'
}).then(res => {
if (res.code == 1) {
this.$api.toast('评价成功');
this.$api.back(2000);
eventChannel.emit('reloadOrder', {});
} else {
this.$api.modal('温馨提示', res.msg, function() {}, false)
}
}).catch(error => {
console.log('commentError', error);
})
}
}
},
onLoad(options) {
eventChannel = this.getOpenerEventChannel();
this.getInfos(options.id || 0);
},
onShareAppMessage() {
}
}
</script>
<style lang="scss" scoped>
.page-foot {
background-color: #0F1011;
}
.container {
background-color: #0F1011;
}
.xilu {
background-color: #0F1011;
&_info {
width: 700rpx;
padding: 20rpx 30rpx 30rpx;
background: #292B2C;
border-radius: 20rpx;
&_cover {
width: 150rpx;
height: 150rpx;
border-radius: 20rpx;
display: block;
}
}
&_rate_link {
margin-top: 20rpx;
padding: 40rpx 40rpx 30rpx 30rpx;
width: 700rpx;
background: #292B2C;
box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(183, 189, 202, 0.1);
border-radius: 20rpx;
}
&_foot_nav {
padding: 0 30rpx 40rpx;
}
&_textarea_link {
width: 630rpx;
height: 429rpx;
background: #0F1011;
border-radius: 20rpx;
textarea {
width: 100%;
height: 335rpx;
color: #fff;
padding: 30rpx;
font-size: 30rpx;
}
}
}
.w90 {
width: 90rpx;
}
.colb7 {
color: #B7B7B7;
}
.btn1 {
height: 90rpx;
line-height: 90rpx;
border-radius: 20rpx;
font-size: 30rpx;
font-weight: 400;
color: #0E0E0F;
}
</style>