<template>
	<view>
		<block v-if="detail">
			<view class="page">
				<view class="system-form-wrap">
					<view class="form-title" style="text-align:center;padding-top:40rpx;font-weight:600;font-size:30rpx;">
						请填写表单所需信息
					</view>
					<ns-newform ref="form" :data="detail.json_data" @submit="create"></ns-newform>
					<button class="button mini" style="font-size:32rpx;" type="primary" size="mini" @click="create">提交</button>
				</view>
			</view>
		</block>
		<block v-else>
			<ns-empty :text="complete ? '提交成功' : '未获取到表单信息'" :isIndex="false"></ns-empty>
		</block>
		<loading-cover ref="loadingCover"></loading-cover>
		<ns-login ref="login"></ns-login>
	</view>
</template>

<script>
export default {
	data() {
		return {
			id: 0,
			detail: null,
			isRepeat: false,
			complete: false,
			scroll: true,
			uniacid: 0
		}
	},
	onLoad(options) {
		if (!options.uniacid) {
			uni.showModal({
				title: '提示',
				content: '参数错误',
				showCancel: false,
				success: () => {}
			})
			return false
		}

		this.uniacid = options.uniacid
		this.id = options.id || 0

		if (options.scene) {
			const scene = decodeURIComponent(options.scene)
			const params = scene.split('&')
			params.length && params.forEach(item => {
				if (item.indexOf('id') != -1) {
					this.id = item.split('-')[1]
				}
			})
		}

		this.getData()
	},
	watch: {
		storeToken(newVal, oldVal) {
			newVal && this.getData()
		}
	},
	methods: {
		getData() {
			this.$api.sendRequest({
				url: '/form/api/form/info',
				data: {
					form_id: this.id,
					uniacid: this.uniacid
				},
				success: res => {
					if (res.code == 0 && res.data) {
						this.detail = res.data
						uni.setNavigationBarTitle({
							title: res.data.form_name
						})
					}
					this.$refs.loadingCover && this.$refs.loadingCover.hide()
				},
				fail: () => {
					this.$refs.loadingCover && this.$refs.loadingCover.hide()
				}
			})
		},
		create() {
			if (!this.$refs.form.verify()) return

			if (this.isRepeat) return

			this.isRepeat = true
			this.$api.sendRequest({
				url: '/form/api/form/create',
				data: {
					form_id: this.id,
					form_data: JSON.stringify(this.$refs.form.formData),
					uniacid: this.uniacid
				},
				success: res => {
					if (res.code == 0) {
						uni.showModal({
							title: '提示',
							content: '提交成功',
							showCancel: false,
							success: () => {}
						})
					} else {
						this.isRepeat = false
						this.$util.showToast({
							title: res.message
						})
					}
				}
			})
		}
	}
}
</script>

<style scoped>
page {
	background: #fff;
}

.form-banner {
	width: 100vw;
	line-height: 1;
}

.form-banner image {
	width: 100%;
	line-height: 1;
}

.system-form-wrap {
	border-radius: 32rpx;
	overflow: hidden;
	margin: 0 0 60rpx 0;
	padding: 0 12rpx;
	transform: translateY(-40rpx);
}

.system-form-wrap .form-title {
	line-height: 100rpx;
	padding-top: 20rpx;
}

.system-form-wrap .button {
	height: 80rpx;
	line-height: 80rpx !important;
	margin-top: 30rpx !important;
	width: 84%;
	margin-left: 28rpx !important;
	border-radius: 80rpx;
	background: #f4391c;
	color: #fff;
}

.system-form-wrap .form-wrap {
	background: #fff;
	padding: 30rpx;
	border-radius: 32rpx;
}
</style>
