<template>
	<view class="container" style="">
		<view class="background"></view>
		<view class="header"
			style="display:flex;align-items:center;padding:10px;background-color:white;width:100%;margin:0 auto;">
			<view class="tx">
				<image :src="user.headicon" style="width:50px;height:50px;border:1px solid white;border-radius:20rpx;">
				</image>
			</view>
			<view class="info" style="display:block;">
				<view style="color:black;font-size:12px;">昵称:<text style="margin-left:5px;">{{user.realName}}</text>
				</view>
				<view style="color:black;font-size:12px;">ID:<text style="margin-left:5px;">{{user.id}}</text>
				</view>
			</view>
		</view>
		<view class="centerView">
			<view class="comm" style="display:flex;justify-content:center;align-items:center;margin:10px 0px 20px 0px;">
				<view style="color:white;">我的评价</view>
				<view>
					<!-- 设置评分数 -->
					<uni-rate :max="3" :margin="10" @change="onChange" />
					<!-- <uni-rate bind:__l="__l" bind:change="__e" data-event-opts="{{[ [ '^change',[ ['onChange'] ] ] ]}}" margin="{{10}}" max="{{3}}" vueId="10357bad-1"></uni-rate> -->
				</view>
			</view>
			<view class="contentView"
				style="border:1px solid white;width:90%;height:100px;margin:0 auto;padding:10px;border-radius:10px;background-color:white;">
				<textarea maxlength="100" placeholder="请输入评价内容(不得高于60字)" placeholderClass="area"
					style="color:gray;font-size:25rpx;" v-model="form.txt"></textarea>
			</view>
		</view>
		<view class="uploadView">
			<view style="display:flex;justify-content:center;align-items:center;margin:10px 0px 20px 0px;">
				<view style="color:white;">图片上传</view>
			</view>
			<view
				style="border:1px solid white;width:90%;height:118px;margin:0 auto;padding:10px;border-radius:10px;background-color:white;">
				<view class="fileview">
					<uni-file-picker limit="3" mode="grid" @select="select" style="transform:scale(0.5);" @delete="delBanner">
					</uni-file-picker>
					<!-- <uni-file-picker bind:__l="__l" bind:select="__e" data-event-opts="{{[ [ '^select',[ ['select'] ] ] ]}}" fileMediatype="image" limit="{{3}}" mode="grid" style="transform:scale(0.5);" vueId="10357bad-2" wx:if="{{form.banner.length>0}}"></uni-file-picker> -->
				</view>
			</view>
		</view>
		<view class="btnSubmit" style="margin-top:20px;">
			<view @click="SubmitBtn" hoverClass="SubmitHover"
				style="margin:0 auto;border:1px solid white;padding:10px;text-align:center;color:black;border-radius:10px;background-color:white;width:90%;">
				提交评价</view>
		</view>
	</view>

</template>

<script>
	import BASE_URL from '../../common/config.js'
	import service from '../../service/service.js'
	export default {
		data() {
			return {
				BASE_URL,
				user: {},
				model: null,
				form: {
					"userId": "",
					"goodsId": "",
					"txt": "",
					"idNo": "",
					"title": "",
					"banner": [],
					"type": "",
					"creatorTime": "2022-12-22T07:26:22.661Z",
					"lastModifyTime": "2022-12-22T07:26:22.661Z"
				},
				orderChangeModel:{
					id:'',
					type:''
				}
			}
		},
		onLoad(data) {
			console.log(data.item)
			this.model = JSON.parse(decodeURIComponent(data.item))
			this.orderChangeModel.id=this.model.id
			console.log('这是信息啊', this.model)
			this.form.goodsId=this.model.goodsId
			
			let idNos=[]
			this.model.jsonDetail.arrayJsons.forEach((item,index)=>{
					idNos.push(item.jsonDetail.IdNo)
					this.form.title+=item.jsonDetail.Title+','
			})
			this.form.idNo=idNos.toString()
			this.form.title=this.form.title.substr(0,this.form.title.length-1)
			console.log('组合信息',this.form)
			this.ShowUserInfo()
		},
		methods: {
			SubmitBtn(){
				if(this.form.type==''){
					uni.showToast({
						title:'请选择评分',
						icon:'none'
					})
					return
				}
				if(this.form.txt==''){
					uni.showToast({
						title:'请输入评价内容',
						icon:'none'
					})
					return
				}
				this.form.userId=service.getUser().id
				this.API.AddComment(this.form).then(res=>{
					console.log('添加评论信息',res)
					if(res.code==200){
						this.OkOrder()
						uni.showToast({
							title:'评价成功',
							icon:'none'
						})
						setTimeout(()=>{
							uni.reLaunch({
								url:'/pages/order/order?type=0'
							})
						},2000)
					}else{
						uni.showToast({
							title:'评价失败',
							icon:'none'
						})
					}
				})
			},
			// 订单完成
			OkOrder() {
				this.orderChangeModel.type='4'
				this.API.ChangeOrderOptions(this.orderChangeModel).then(res=>{
					console.log('更改状态',res)
				})
			},
			delBanner(e){
				console.log('这是删除信息',e)
				console.log('索引',this.form.banner.findIndex(o=>o.fileId==e.tempFilePath))
				this.form.banner.splice(this.form.banner.findIndex(o=>o.fileId==e.tempFilePath),1)
			console.log('这是组合',this.form.banner)
			},
			select(filed){
				console.log('这是上传图',filed)
				let that=this
				uni.uploadFile({
					url:that.BASE_URL+'/api/file/Uploader/annexpic',
					filePath: filed.tempFilePaths[0],
					name: 'file',
					header:{
						Authorization:service.getToken()
					},
					formData: {
						user: 'test'
					},
					success(e) {
						console.log('这是信息',e)
						let data=JSON.parse(e.data)
						console.log('dataxinxi',data)
						let info={
							"name": data.data.name,
							"fileId":filed.tempFilePaths[0],
							"url": data.data.url
						}
						that.form.banner.push(info)
						console.log('组合数组',that.form.banner)
						
					},
					fail(error) {
						console.log('错误',error)
						uni.showToast({
							title:'上传失败',
							icon:'none'
						})
					}
				})
			},
			
			onChange(e) {
				console.log('这是分数', e)
				if(e.value=='1'){
					this.form.type='3'
				}else if(e.value=='2'){
					this.form.type='2'
				}else {
					this.form.type='1'
				}
			},
			ShowUserInfo() {
				this.API.GetUserInfo(service.getUser().id).then(res => {
					console.log('这是获取得用户信息', res)
					this.user = res.data
					console.log('这是信息', this.user.headIcon)
					if (!res.data.headIcon.startsWith('http')) {
						this.user.headIcon = this.BASE_URL + res.data.headIcon
					} else {
						console.log('包含http')
					}
				})
			}
		}
	}
</script>

<style>
	.container {
		margin: 0;
		background-color: #8dccff;
		background-size: 100% 100%;
		height: 100%;
		min-height: 100vh;
	}
</style>
