index.vue 3.89 KB
<template>
	<view class="ncc-wrap ncc-wrap-form"  style="width: 96%;margin: 0 auto;margin-top: 20rpx; background-color: white;border-radius: 20rpx;padding-bottom: 15rpx;">
		<view class="titleall-box">
			<view class="titleall-left">
				<view class="titleall-left-line"></view>填写信息
			</view>
		</view>
		<ncc-parser :formConf="formData" ref="dynamicForm" v-if="!loading" @submit="sumbitForm" :key="key" style="padding-bottom: 70rpx;"/>
		<view class="buttom-actions" style="margin: 0 auto;width: 96%;">
			<u-button class="buttom-btn" @click="resetForm">重置</u-button>
			<u-button class="buttom-btn" type="primary" style="background-color: #e60012;" @click="submit" :loading="btnLoading">
				{{formData.confirmButtonText||'确定'}}
			</u-button>
		</view>
	</view>
</template>

<script>
	import {
		createModel
	} from '@/api/apply/visualDev'
	export default {
		props: ['config', 'modelId', 'isPreview'],
		data() {
			return {
				dataForm: {
					data: ''
				},
				formData: {},
				key: +new Date(),
				btnLoading: false,
				loading: true,
			}
		},
		created() {
			this.init()
		},
		methods: {
			init() {
				var  dformData = {}
				// console.log('本地数据',localData)
				let localData = uni.getStorageSync(this.modelId)
				if(localData){
					// this.formData = JSON.parse(localData)
					dformData = JSON.parse(localData)
					console.log('本地数据2',dformData)
					this.formData = JSON.parse(this.config.formData)
				}else{
					this.formData = JSON.parse(this.config.formData)
				}
				// this.formData = JSON.parse(this.config.formData)
				
				// var  dformData = {ZhiWu:'111111'}
				
				this.fillFormData(this.formData, dformData)
				
				
				console.log('formdata',this.formData)
				this.loading = true
				this.$nextTick(() => {
					this.loading = false
					this.key = +new Date()
				})
			},
			fillFormData(form, data) {
				const loop = list => {
					for (let i = 0; i < list.length; i++) {
						let item = list[i]
						if (item.__vModel__) {
							const val = data[item.__vModel__]
							if (val) item.__config__.defaultValue = val
						}
						if (item.__config__ && item.__config__.nccKey !== 'table' && item.__config__.children && Array
							.isArray(item.__config__.children)) {
							loop(item.__config__.children)
						}
					}
				}
				loop(form.fields)
			},
			
			sumbitForm(data) {
				if (!data) return
				// this.btnLoading = true
				this.dataForm.data = JSON.stringify(data)
				console.log('数据格式',this.dataForm)
				console.log('数据格式2',data)
				// localStorage.setItem(this.modelId,this.dataForm.data)
				uni.setStorageSync(this.modelId,this.dataForm.data)
				createModel(this.modelId, this.dataForm).then(res => {
					uni.showToast({
						title: res.msg,
						complete: () => {
							setTimeout(() => {
								this.btnLoading = false
								uni.navigateBack()
							}, 1500)
						}
					})
				}).catch(() => {
					this.btnLoading = false
				})
			},
			submit() {
				if (this.isPreview == '1') {
					uni.showToast({
						title: '功能预览不支持数据保存',
						icon: 'none'
					})
					return
				}
				this.$refs.dynamicForm && this.$refs.dynamicForm.submitForm()
				console.log('表单json',this.$refs.dynamicForm)
				
			},
			resetForm() {
				this.loading = true
				this.key = +new Date()
				this.$nextTick(() => {
					this.loading = false
					this.$refs.dynamicForm && this.$refs.dynamicForm.resetForm()
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.titleall-box {
		display: flex;
		justify-content: space-between;
		padding: 40rpx 20rpx 20rpx 0;
		.titleall-left {
			font-size: 32rpx;
			font-weight: bold;
			display: flex;
			align-items: center;
			.titleall-left-line {
				width: 14rpx;
				height: 36rpx;
				border-radius: 0 10rpx 10rpx 0;
				background-color: #E60012;
				box-shadow: 0 0 10rpx 5rpx #fbdadc;
				margin-right: 20rpx;
			}
			text {
				font-size: 28rpx;
				color: #999999;
			}
		}
	}
</style>