contactUs.vue 4.57 KB
<template>
	<view class="page">
		<view class="head">
			<view class="logo-title">
				<image @click="goBack" src="../../static/left.png"></image>
				联系我们
			</view>
			<view class="title">
			</view>
			<view class="setting-mess"></view>
		</view>
		
		<view class="main">
			<view class="top-box" @click="fklxshow = true">
				<view><text class="red">*</text>反馈类型</view>
				<view class="top-box-img">
					<input  v-model="form.type" type="text" placeholder="请选择" placeholder-class="placeholder" />
					<image class="top-box-image" src="../../static/down3.png"></image>
				</view>
			</view>
			<u-picker :show="fklxshow" :columns="columns" @confirm="fklxconfirm" @cancel="fklxshow = false"></u-picker>
			<view class="message-list">
			<view class="info-box">
				<view class="info-box-list">
					<view class="info-box-width width100">
						<view><text class="red">*</text>问题和意见</view>
						<view>
							<textarea maxlength="10000" v-model="form.problem" auto-height placeholder="请输入" class="textarea"></textarea>
						</view>
					</view>
				</view>
			</view>
			</view>
			
			<view class="message-list">
			<view class="info-box">
				<view class="info-box-list">
					<view class="info-box-width">
						<view style="margin-bottom: 20rpx;">图片</view>
						<view class="" style="width: 70vw;">
							<u-upload :fileList="fileList1" @afterRead="afterRead1" @delete="deletePic1" name="1" multiple
								:maxCount="9">
							</u-upload>
						</view>
						
					</view>
				</view>
			</view>
			</view>
			
			<view class="top-box">
				<view class="top-box-heng">联系电话:{{info.telephone}}<view class="top-box-heng-right">联系人:{{info.person}}</view></view>
			</view>
		</view>
		
		<view class="page-footer">
		  <view class="footer-buy">
		    <view class="cart-add" @click="submit">
		      <text>提交</text>
		    </view>
		  </view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				fileList1:[],
				form:{
					type:"",
					problem:"",
					images:"",
				},
				fklxshow:false,
				columns:[
					['优化建议','其他']
				],
				info:{}
			};
		},
		onLoad() {
			this.lxrxx();
		},
		methods:{
			lxrxx(){
				this.API.lxrxx().then(res=>{
					this.info = res.data
				})
			},
			fklxconfirm(e){
				console.log(e);
				this.form.type = e.value[0]
				this.fklxshow = false
			},
			goBack() {
				uni.navigateBack({
					delta: 1
				});
			},
			submit(){
				console.log(this.fileList1);
				if(this.fileList1.length > 0){
					var arr = []
					for(let i = 0;i < this.fileList1.length;i++){
						arr.push(this.fileList1[i].url)
					}
					this.form.images = arr.join(',')
				}
				this.API.lxwm(this.form).then(res=>{
					console.log(1,res);
					if(res.code == 1){
						uni.showToast({
							icon:"success",
							title:"提交成功"
						})
						setTimeout(()=>{
							uni.navigateBack({
								delta: 1
							});
						},500)
					}else{
						uni.showToast({
							icon:"error",
							title:"提交失败"
						})
					}
				})
				// 
			},
			async afterRead1(event) {
				// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this.fileList1.length
				lists.map((item) => {
					this.fileList1.push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this.fileList1[fileListLen]
					console.log("result", result);
					this.fileList1.splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			deletePic1(event) {
				console.log(event);
				this.fileList1.splice(event.index,1)
				console.log(this.fileList1);
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: 'http://antis103.sherkxuan.cn/api/common/upload', // 仅为示例,非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test',
							token: uni.getStorageSync("token"),
						},
						success: (res) => {
							console.log("111", JSON.parse(res.data));
							// var info = {
							// 	url:'https://yipinzhisheng.com' + JSON.parse(res.data).data.url
							// }
							// this.form.avatar.push(info)
							setTimeout(() => {
								resolve(JSON.parse(res.data).data.fullurl)
							}, 1000)
						}
					});
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	@import 'contactUs.scss';
</style>