<template>
	<div class="hui-flex hui-dialog">
		<div class="hui-flex-box hui-dialog-content">
			<project-item ref="projectItem"></project-item>
			<el-form ref="houseForm" label-position="top" :model="houseForm">
				<el-form-item label="房源名称" prop="name" :rules="[{required: true, message: '请输入房源名称'}]">
					<el-input type="text" v-model="houseForm.name" placeholder="请输入房源名称"></el-input>
				</el-form-item>
				<el-form-item label="房间号" prop="roomNumber" :rules="[{required: true, message: '请输入房间号'}]">
					<el-input type="text" v-model="houseForm.roomNumber" placeholder="请输入房间号"></el-input>
				</el-form-item>
				<el-form-item label="房源面积(m²)" prop="area" :rules="[{required: true, message: '请输入房源面积(m²)'}]">
					<el-input type="number" v-model="houseForm.area" placeholder="请输入房源面积(m²)"></el-input>
				</el-form-item>
				<el-form-item label="是否装修">
					<el-radio v-model="houseForm.decoration" :label="0">未装修</el-radio>
					<el-radio v-model="houseForm.decoration" :label="1">已装修</el-radio>
				</el-form-item>
				<el-form-item label="启用日期">
					<el-date-picker v-model="houseForm.invocationDate" type="date" placeholder="其选择启用日期">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="是否公开房源">
					<el-radio v-model="houseForm.openState" :label="0">不公开</el-radio>
					<el-radio v-model="houseForm.openState" :label="1">公开</el-radio>
				</el-form-item>
				<el-form-item label="产权证书/不动产权证号">
					<el-input type="text" v-model="houseForm.propertyCertificateNumber" placeholder="请输入产权证书/不动产权证号">
					</el-input>
				</el-form-item>
				<el-form-item label="招商状态">
					<el-radio v-model="houseForm.investmentState" :label="0">未招商</el-radio>
					<el-radio v-model="houseForm.investmentState" :label="1">已招商</el-radio>
				</el-form-item>
				<el-form-item label="房源配图" class="hui-textarea">
					<upload ref="upload" :list="responsibility" type="insert"></upload>
				</el-form-item>
				<el-form-item label="房源标签" class="hui-textarea">
					<tag ref="tag" type="insert" :tagType="3"
						:tagActive="houseForm.tagIds ? houseForm.tagIds.split(',') : []">
					</tag>
				</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 {
		insertHouse,
		getHouseDetailById,
		updateHouse
	} from '@/httpApi/space'
	import upload from '@/components/common/upload'
	import city from '@/components/common/city'
	import tag from '@/components/common/tag'
	import projectItem from '@/components/common/projectItem'
	export default {
		props: ['isUpdate', 'detailId'],
		data() {
			return {
				houseForm: {
					name: '', //房源名称
					roomNumber: '',
					roomState: '', //房源状态
					roomType: '', //房源类型
					area: '',
					decoration: 0,
					investmentState: 0,
					invocationDate: '',
					openState: 0,
					propertyCertificateNumber: '',
					picture: '',
					tagIds: '',
					data: '',
					projectId: '',
					projectItemId: '',
					projectItemTargetId: ''
				},
				specific: '',
				responsibility: []
			}
		},
		created() {
			this.houseForm['projectId'] = this.$store.getters.project.id;
			if (this.isUpdate) {
				getHouseDetailById(this.detailId).then(res => {
					if (res.state) {
						this.houseForm = res.data;
						if (this.houseForm.picture) this.responsibility = JSON.parse(this.houseForm.picture);
						if (this.houseForm.data) {
							let data = JSON.parse(this.houseForm.data);
							this.specific = data.specific;
						}
					}
				})
			}
		},
		methods: {
			submit() {
				this.$refs.houseForm.validate((valid) => {
					if (valid) {
						let postData = JSON.parse(JSON.stringify(this.houseForm));
						postData.data = JSON.stringify({
							specific: this.specific
						});
						postData['picture'] = JSON.stringify(this.$refs.upload.fileList);
						postData['tagIds'] = this.$refs.tag.tagIds();
						if (this.isUpdate) {
							updateHouse(postData).then(this.successFunc);
						} else {
							insertHouse(postData).then(this.successFunc);
						}
					} else {
						return false;
					}
				});
			},
			successFunc(res) {
				if (res.state) {
					this.$message.success('操作成功');
					this.$emit('callback', 'init');
				}
			}
		},
		components: {
			city,
			upload,
			tag,
			projectItem
		},
	}
</script>

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