qzw_xcx/pages/index/feedback.vue

<template>
	<view style="padding: 0 32upx;margin-bottom: 35upx;">
		<view class="comment">满意度星级评价(完成此项送30圈币)</view>
		<view class="comment">您对酒店的整体满意度</view>
		<view class="comment">
			<van-rate
			  :value="satisfaction"
			  void-icon="star"
			  void-color="#eee"
			  color="#ee0a24"
			  @change="getsatisfaction"
			/>
		</view>
		<view class="comment">您是否会再次入住或向他人介绍本酒店</view>
		<view class="comment">
			<van-rate
			  :value="recommend"
			  void-icon="star"
			  void-color="#eee"
			  color="#ee0a24"
			  @change="getrecommend"
			/>
		</view>
		<view class="comment">您对酒店的设施是否满意</view>
		<view class="comment">
			<van-rate
			  :value="facilities"
			  void-icon="star"
			  void-color="#eee"
			  @change="getfacilities"
			  color="#ee0a24"
			/>
		</view>
		<view class="comment">您对员工的待客礼仪否满意</view>
		<view class="comment">
			<van-rate
			  :value="ceremony"
			  void-icon="star"
			  @change="getceremony"
			  void-color="#eee"
			  color="#ee0a24"
			/>
		</view>
		<view class="comment">您对我们提供的网上购物的总体评价</view>
		<view class="comment">
			<van-rate
			  :value="shopping"
			  void-icon="star"
			  @change="getshopping"
			  void-color="#eee"
			  color="#ee0a24"
			/>
		</view>
		<view class="comment">文字建议与评价(完成此项送20圈币)</view>
		<view class="comment" style="padding: 20rpx 40rpx;">对我们的酒店设施与服务，您还有什么建议吗？对我们的服务人员您有什么批评或表扬吗？请告诉我们...</view>
		<TextArea :maxnumber="maxnumber" :tips="tips" @submitValue="submitValue"/>	
		<view style="padding: 15upx 32upx;">
			<view>添加图片(最多3张)</view>
			<uploadImage @getImg="getImg" />	
		</view>
		<view class="submitRemin" @click="submitRemin">提交</view>
	</view>
</template>

<script>
	import TextArea from '@/component/textarea.vue'
	import uploadImage from '@/component/uploadImage.vue'
	export default {
		components: {
			TextArea,
			uploadImage
		},
		data() {
			return{
				conent:'',
				maxnumber: 300,
				tips: '',
				satisfaction:'',	//酒店整体满意度评分 取值范围1-5
				recommend:'',	//	是否再次入住评分 取值范围1-5
				facilities:'',	//设施评分 取值范围1-5
				ceremony:'',	//是	string	礼仪评分 取值范围1-5
				shopping:'',	//是	string	网上购物评分 取值范围1-5
				content:'',	 //否	string	评价内容评分 取值范围1-5
				img_list:'',
				store_id: 0
			}
		},
		onLoad(e) {
			this.store_id = e.store_id;
		},
		
		methods: {
			getsatisfaction(e) {
				this.satisfaction = e.detail;
			},
			getrecommend(e) {
				this.recommend = e.detail;
			},
			getfacilities(e) {
				this.facilities = e.detail;
			},
			getceremony(e){
				this.ceremony = e.detail;
			},
			getshopping(e){
				this.shopping = e.detail;
			},
			getImg(e) {
				this.img_list = e.join(',');
			},
			submitValue(e) {
				this.content = e.detail.value;
			},
			submitRemin() {
				if(this.satisfaction == '' || this.recommend == ''
				|| this.facilities == ''|| this.ceremony == ''|| this.shopping == '') {
					this.$msg("请完成星级评价！");
					return;
				}
				if(this.content == '') {
					this.$msg('请填写反馈内容！');
					return;
				}
				if(this.content.length < 20 ) {
					this.$msg( '反馈内容不能少于20个字！');
					return;
				}
				this.request({
					url: '/v2/store/feedback',
					method: 'post',
					data: {
						store_id: this.store_id,
						satisfaction: this.satisfaction,
						recommend: this.recommend,
						facilities: this.facilities,
						ceremony: this.ceremony,
						shopping: this.shopping,
						content: this.content,
						img_list: this.img_list,
					},
					success: (res) => {
						uni.navigateBack();
					}
				})
			}
		}
	}
</script>

<style>
	.comment {
		text-align: center;
		padding: 20upx 0;
	}
</style>