<template>
	<view>
		<p style=" color: #0d1013e6;
 font-size: 28rpx;
 font-weight: 500;margin: 24rpx;">请选择反馈类型</p>
		<view class="flexBox" style="margin: 24rpx;"  v-for="(item,index) in category">
			<u-button :text="item.name" shape="circle" :type="active==index ? 'primary' : 'info'" style="margin-right: 12rpx;"   @click="check(item,index)"></u-button>
		</view>
		<view  style="margin: 24rpx;">
			<u-textarea  v-model="info.content" placeholder="请输入详细内容"></u-textarea>
		</view>
		<view  style="margin: 24rpx;">
			<u-upload :fileList="fileList1"  @afterRead="afterRead" @delete="deletePic"
				name="1" multiple :maxCount="1"></u-upload>
		</view>
		<!-- <view class="flexBox" style="justify-content: space-between; margin: 24rpx; background-color: white;padding: 30rpx 12rpx;">
					<text>联系电话</text>
					<input type="text" :value="phone"  />
		</view> -->
		<view class="flexBox" style="width: 90%;justify-content: center;margin: 30rpx;">
			<u-button text="提交" type="primary" shape="circle" @click="submit"></u-button>
		</view>
	</view>
</template>

<script>
	import config from '@/common/config'
	export default {
		data() {
			return {
				action: config.baseUrl + '/api/common/upload',
				category:[],
				active:null,
				fileList1:[],
				info:{
					feedtype_id:'',
					content:'',
					images:''
				}
			}
		},
		methods: {
			check(item,index){
				this.info.feedtype_id = item.id
				this.active = index
			},
			submit(){
				this.info.images = this.fileList
				uni.$u.http.post('/api/user/feedback',this.info).then(res => {
					uni.showToast({
						title: res.msg,
						icon:'none'
					})
					if(res.code == 1){
						setTimeout(() => {
							uni.reLaunch({
								url:'/pages/index/my'
							})
						},1000)
					}
					
					
				}).catch(err => {
					console.log(err);
					uni.showToast({
						title: err.msg
					})
				})
			},
			deletePic(event) {
							this[`fileList${event.name}`].splice(event.index, 1)
						},
						// 新增图片
						async afterRead(event) {
							// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
							let lists = [].concat(event.file)
							let fileListLen = this[`fileList${event.name}`].length
							lists.map((item) => {
								this[`fileList${event.name}`].push({
									...item,
									status: 'uploading',
									message: '上传中'
								})
							})
							for (let i = 0; i < lists.length; i++) {
								const result = await this.uploadFilePromise(lists[i].url)
								let item = this[`fileList${event.name}`][fileListLen]
								this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
									status: 'success',
									message: '',
									url: result
								}))
								fileListLen++
							}
						},
						uploadFilePromise(url) {
							return new Promise((resolve, reject) => {
								let a = uni.uploadFile({
									url: this.action, // 仅为示例，非真实的接口地址
									filePath: url,
									name: 'file',
									formData: {
										user: 'test'
									},
									header:{
										token: uni.getStorageSync('token')
									},
									success: (res) => {
										setTimeout(() => {
											resolve(res.data.data)
										}, 1000)
									}
								});
							})
						},
		},
		onLoad() {
			uni.$u.http.get('/api/user/feedtype').then(res => {
				console.log(res);
				this.category = res.data
			}).catch(err => {
				console.log(err);
			})
		}
	}
</script>

<style scoped>
	.flexBox{
		display: flex;
		align-items: center;
	}
	.hv{
		background:#3375D8
	}
</style>