<template>
	<view class="content">
		<u-form :model="form" ref="uForm">
			<u-form-item label="问题类型" label-position="top">
				<u-input v-model="form.typeName" type="select" :border="true" @click="typeshow = true" />
				<u-select v-model="typeshow" mode="single-column" :list="list" @confirm="confirmType"></u-select>
			</u-form-item>
			<u-form-item label="问题内容" label-position="top">
				<u-input v-model="form.contentName" type="select" :border="true" @click="contentshow = true" />
				<u-select v-model="contentshow" mode="single-column" :list="list" @confirm="confirmContent"></u-select>
			</u-form-item>
			<u-form-item label="位置" label-position="top">
				<text>江苏省苏州市通园路66号</text>
				<u-button shape="square" slot='right' size="mini" @click="showMap=true" type="info">重新获取</u-button>
			</u-form-item>
			<u-form-item label-position="top" label="描述" prop="intro">
				<u-input v-model="form.intro" type='textarea' height='100' :border="true" />
			</u-form-item>
			<u-form-item label-position="top" label="附件上传" prop="intro">
				<u-upload ref="uUpload" :action="action" upload-text="选择附件" :show-tips="false"></u-upload>
			</u-form-item>
		</u-form>
		<u-button type="primary" @click="submit">提交</u-button>
		<u-popup v-model="showMap" mode="center" closeable close-icon-color="#ffffff" border-radius="14">
			<view>
				<view class="popuptitle">选择位置</view>
				<map :style="{width:width+'px',height:height+ 'px'}" :latitude="location.latitude"
					:longitude="location.longitude">
				</map>
				<view>
					<u-button type="success" shape="square">确认选择</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showMap: false,
				typeshow: false,
				contentshow: false,
				action: "",
				location: {},
				list: [{
						value: '1',
						label: '江'
					},
					{
						value: '2',
						label: '湖'
					}
				],
				form: {
					type: "",
					content: "",
					typeName: "",
					contentName: ""
				},
				width: 300,
				height: 300
			}
		},
		onReady() {
			let that = this;
			uni.getLocation({
				success(res) {
					that.location = res;
				}
			})
			uni.getSystemInfo({
				complete(res) {
					that.width = res.screenWidth * .8
					that.height = res.screenHeight * .6
				}
			})

		},
		methods: {
			submit() {},
			confirmType(e) {
				this.form.type = e[0].value
				this.form.typeName = e[0].label
			},
			confirmContent(e) {
				this.form.content = e[0].value
				this.form.contentName = e[0].label
			},

		}
	}
</script>

<style>
	.content {
		padding: 20rpx;
	}

	.popuptitle {
		background: #2979ff;
		color: #fff;
		padding: 20rpx 30rpx;
	}
</style>
