<template>
	<view>
		<status-nav navBarTitle="我要评价" returnColor="#c2c2c2"></status-nav>
		<container-subgroup>
			<view slot="content" style="margin: 0 -30rpx;">
				<view class="bacf fon28 pad-sx30 pad-zy40">
					<view class=" bold disjbac fw line-h50">
						<view class="mar-y20">{{project_name}}</view>
						<view>{{project_number}}</view>
					</view>
					<view class="mar-s10 mar-x30" style="color: #6b6a6a;">服务时间：{{project_time}}</view>
					<view class="radius20 pad30 dis" style="border: 2rpx solid #dcdcdc;">
						<image src="/static/public/icon-evaluate-pen.png" mode="widthFix" lazy-load style="width: 25rpx;height: 30rpx;"></image>
						<textarea v-model="serviceExperience" class="fon24 mar-z20 width100" style="height: 200rpx;" placeholder="写下您的服务体验，帮助我们更好的管理提升" placeholder-style="font-size:24rpx;color: #aaaaaa;" />
					</view>
					<view class="fon30 bold mar-sx30">上传图片</view>
					<view class="disac">
						<view @tap="chooseImg(index)" class="mar-y20" v-for="(item,index) in imgList" :key="index" style="background-color: #dcdcdc;">
							<view v-if="item.imgsrc==''" class="evaluate-addimg" style="width: 142rpx;height: 142rpx;"></view>
							<image v-else :src="item.imgsrc" mode="aspectFill" lazy-load style="width: 142rpx;height: 142rpx;vertical-align: middle;"></image>
						</view>
					</view>
				</view>
				<view class="bacf fon28 pad-sx30 pad-zy40 mar-s20">
					<view class="fon30 bold mar-sx30">您的评价</view>
					<view class="mar-s40 mar-x50" style="color: #545454;">
						<view class="mar-x40 disac"><text class="mar-y40">技术服务</text><rate-one :size="42" :gutter="40" :curentClick="0" v-model="rateNum" @change="chooseRate"></rate-one></view>
						<view class="disac"><text class="mar-y40">客服态度</text><rate-one :size="42" :gutter="40" :curentClick="1" v-model="attitudeNum" @change="chooseRate"></rate-one></view>
					</view>
				</view>
				<!-- 提交保存 -->
				<view class="person-btn" @tap="submitData" style="margin-top: 50rpx;">提交保存</view>
			</view>
		</container-subgroup>
	</view>
</template>

<script>
	import rateOne from '@/components/rates/rate-one.vue';
	export default {
	    components:{
	        rateOne
	    },
		data() {
			return {
				imgList:[//上传图片数组
					{imgsrc:''},
					{imgsrc:''},
					{imgsrc:''}
				],
				project_id:'',
				project_name:'长沙XXXXXXXXX项目名称',
				project_number:'GD20220108-1002',
				project_time:'2022-01-11 15 : 27',
				rateNum:5,//技术服务评分
				attitudeNum:5,//客服态度评分
				serviceExperience:'',//服务体验
				flag:true
			}
		},
		methods: {
			// 提交保存事件
			submitData(){
				if(this.flag) {
					this.flag = false;
					let params = {
						id:this.project_id,
						a:this.serviceExperience,
						b:this.imgList[0].imgsrc,
						c:this.imgList[1].imgsrc,
						d:this.imgList[2].imgsrc,
						f:this.rateNum,
						g:this.attitudeNum
					}
					console.log(params,74);
					// this.$requst.post('',params).then(res=>{
					// 	if(res.code) {
					// 		uni.navigateBack({delta:1})
					// 	}
					// })
				}
			},
			// 选择图片
			chooseImg(index){
				uni.chooseImage({
					count:1,
					sourceType:['album','camera'],
					sizeType:['compressed'],
					success: (res) => {
						this.imgList[index].imgsrc = res.tempFilePaths[0];
					}
				})
			},
			chooseRate(arr){
				switch (arr[1]){
					case 0:
					 this.rateNum = arr[0];
						break;
					case 1:
					 this.attitudeNum = arr[0];
						break;
				}
			   
			},
		}
	}
</script>

<style>

</style>