<template>
	<view class="main">
		<view class="content"><textarea value="" placeholder="请输入评价内容" maxlength="100" v-model="evContent" /></view>
		<view>
			<view class="uni-padding-wrap">
				<view class="uni-title">请对本次服务做出评价</view>
				<view>
					<radio-group @change="radioChange">
						<label class="radio" v-for="(item, index) in items" :key="item.value">
							<radio class="rediobox" :value="item.value" :checked="index === current" />
							{{ item.name }}
						</label>
					</radio-group>
				</view>
			</view>
		</view>
		<view class="footer-btn">
			<view class="btn" @click="submit()">提交</view>
		</view>
	</view>
</template>

<script>
	import uniRate from '@/components/uni-rate/uni-rate.vue';
	import {
		submitEvaluate,
		saveHaircutComment
	} from '@/common/api.js';
	import {
		callbackRequest,
		getStorage,
		alertTip,
		sureAlterTip
	} from '@/common/util.js';
	export default {
		components: {
			uniRate
		},
		data() {
			return {
				items: [{
						value: '0',
						name: '满意'
					},
					{
						value: '1',
						name: '一般',
						checked: 'true'
					},
					{
						value: '2',
						name: '不满意'
					}
				],
				current: 0,
				type: 0, // 评价类型 1: 服务报修评价
				id: 0, // 记录id
			};
		},
		onLoad(option) {
			// 公共评价页面， 根据 type 区分对什么记录 进行评价， id 为记录id
			this.type = option.type;
			this.id = option.id;
		},
		methods: {
			radioChange: function(evt) {
				for (let i = 0; i < this.items.length; i++) {
					if (this.items[i].value === evt.target.value) {
						this.current = i;
						break;
					}
				}
			},
			submit() {
				if (this.evContent == 0) {
					alertTip('请输入评价内容');
					return false;
				}
				// let data;
				// if (this.type == 4 || this.type == 5) {
				// 	data = {
				// 		method: saveHaircutComment,
				// 		data: {
				// 			detailId: this.typeId,
				// 			userId: this.userInfo.id,
				// 			commentContent: this.evContent,
				// 			satisfiedLevel: this.grade,
				// 			type: this.type == 4 ? 1 : 2
				// 		}
				// 	};
				// } else {
				// 	data = {
				// 		method: submitEvaluate,
				// 		data: {
				// 			type: this.type,
				// 			typeId: this.typeId,
				// 			userId: this.userInfo.id,
				// 			evContent: this.evContent,
				// 			grade: this.grade,
				// 			bak1: this.spareId
				// 		}
				// 	};
				// }

				// alertTip('提交成功');

				// setTimeout(res => {
				// 	uni.redirectTo({
				// 		url: '/pages/newfoodComment/newfood-form'
				// 	});
				// }, 1500)
				// callbackRequest(data).then(res => {

				// 	if(res.data.returnCode == 1){
				// 			sureAlterTip('','评价成功',false)
				// 			.then(_ => {
				// 				if(this.type == 4){
				// 					uni.redirectTo({
				// 						url:'/pages/haircut/haircut?currentTabIndex=1'
				// 					})
				// 				}else if(this.type == 5){
				// 					uni.redirectTo({
				// 						url:'/pages/washCarReservation/washCarReservation?currentTabIndex=1'
				// 					})
				// 				}else {
				// 					// uni.redirectTo({
				// 					// 	url:'/pages/order-form/order-form'
				// 					// })
				// 					uni.navigateBack({
				// 						delta:1
				// 					})
				// 				}
				// 			})
				// 		}else {
				// 			alertTip(res.data.returnMsg)
				// 		}
				// });
			}
		}
	};
</script>

<style lang="scss" scoped>
	@import '@/static/css/common.scss';

	.main {
		min-height: 100vh;
		background: #f8f8f8;
	}

	.content {
		padding: 30rpx;
		background: #fff;

		textarea {
			width: 100%;
			height: 300rpx;
			font-size: 35rpx;
			color: #666;
			line-height: 40rpx;
		}
	}

	.grade {
		font-size: 28upx;
		padding: 30rpx;

		text {
			font-size: 28rpx;
			color: #444;
			font-weight: bold;
		}
	}

	.grade .rate {
		margin-left: 80upx;
		margin-top: -18upx;
	}

	.uni-title {
		margin-top: 20px;
		margin-left: 20px;
		font-size: 18px;
	}

	.radio {
		width: 100%;
		height: 300rpx;
		font-size: 28upx;
		color: #666;
		line-height: 40rpx;
		style: 'transform:scale(0.7)';
	}

	.radio {
		padding: 0 20px;
		font-size: 38upx;
	}

	.rediobox {
		font-size: 28upx;
		margin-top: 20px;
		width: 20px;
		height: 20px;
	}

	/deep/.rediobox .uni-radio-input,
	/deep/.rediobox .uni-radio-wrapper {
		width: 100%;
		height: 100%;
		border: #e5e5e5;
	}

	/deep/ .rediobox .uni-radio-input {
		margin-right: 0;
	}
</style>