realty/virgo.wzfrontend/console/src/components/work/space/project/edit.vue

<template>
	<div class="hui-flex hui-dialog">
		<div class="hui-flex-box hui-dialog-content">
			<el-form ref="projectForm" label-position="top" :model="projectForm">
				<el-form-item label="项目名称" prop="name" :rules="[{required: true, message: '请输入项目名称'}]">
					<el-input type="text" v-model="projectForm.name" placeholder="请输入项目名称"></el-input>
				</el-form-item>
				<el-form-item label="项目区域" prop="address" :rules="[{required: true, message: '请选择项目区域'}]">
					<city v-model="projectForm.address"></city>
				</el-form-item>
				<el-form-item label="具体地点">
					<el-input type="text" v-model="specific" placeholder="请输入具体地点">
					</el-input>
				</el-form-item>
				<el-form-item label="项目描述" class="hui-textarea">
					<el-input type="textarea" v-model="projectForm.comment" placeholder="请输入项目描述" resize="none">
					</el-input>
				</el-form-item>
				<el-form-item label="项目配图" class="hui-textarea">
					<upload ref="upload" :list="responsibility" type="insert"></upload>
				</el-form-item>
			</el-form>
		</div>
		<div class="hui-dialog-submit">
			<el-button size="medium" @click="$emit('callback')">取 消</el-button>
			<el-button size="medium" type="primary" @click="submit">保 存</el-button>
		</div>
	</div>
</template>

<script>
	import {
		insertProject,
		getProjectDetailById,
		updateProject
	} from '@/httpApi/work'
	import upload from '@/components/common/upload'
	import city from '@/components/common/city'
	export default {
		props: ['isUpdate', 'detailId'],
		data() {
			return {
				projectForm: {
					name: '', //项目名称
					address: [],
					comment: '',
					data: '',
					organizationId: '',
					picture: '',
					tagId: ''
				},
				specific: '',
				responsibility: []
			}
		},
		created() {
			this.projectForm['organizationId'] = this.$store.getters.user.organization.id;
			if (this.isUpdate) {
				console.log(this.detailId);
				getProjectDetailById(this.detailId).then(res => {
					if (res.state) {
						this.projectForm = res.data;
						this.projectForm.address = JSON.parse(this.projectForm.address);
						if (this.projectForm.picture) this.responsibility = JSON.parse(this.projectForm.picture);
						if (this.projectForm.data) {
							let data = JSON.parse(this.projectForm.data);
							this.specific = data.specific;
						}
					}
				})
			}
		},
		methods: {
			submit() {
				this.$refs.projectForm.validate((valid) => {
					if (valid) {
						let postData = JSON.parse(JSON.stringify(this.projectForm));
						postData.data = JSON.stringify({
							specific: this.specific
						});
						postData['picture'] = JSON.stringify(this.$refs.upload.fileList);
						postData['address'] = JSON.stringify(this.projectForm.address);
						if (this.isUpdate) {
							updateProject(postData).then(this.successFunc);
						} else {
							insertProject(postData).then(this.successFunc);
						}
					} else {
						return false;
					}
				});
			},
			successFunc(res) {
				if (res.state) {
					this.$message.success('操作成功');
					this.$emit('callback', 'init');
				}
			}
		},
		components: {
			city,
			upload
		},
	}
</script>

<style lang="scss"></style>