<template>
	<div>
		<avue-form
			ref="formData"
			:option="option"
			v-model="formData"
		>
		</avue-form>
		<footer class="el-dialog__footer">
			<el-button icon="el-icon-circle-plus" type="primary" @click="submitForm">确 定</el-button>
		  <el-button icon="el-icon-circle-close" @click="cancel">取 消</el-button>
		</footer>
	</div>
</template>

<script>
	import {
	  editSiteEmpAuth,
		getDetail
	} from '@/api/systemSet/serverUser';
	export default {
		props:{
			obj:{
				type:Object,
				default:{}
			}
		},
		data () {
			let vm = this;
			return {
				formData:{},
				option:{
					labelWidth:80,
					menuPosition:'right',
					gutter:10,
					menuBtn:false,
					column:[
						{
							label: '省',
							labelWidth:40,
							prop: 'provinces',
							placeholder:'请选择省',
							span:24,
							type: 'select',
							multiple:true,
							filterable:true,
							// collapseTags:true,
							// maxCollapseTags:4,
							props: {
								label: 'name',
								value: 'name',
							},
							cascader: ['city'],
							dicUrl: '/blade-system/region/select',
						},
						{
							label: '市',
							labelWidth:40,
							prop: 'city',
							placeholder:'请选择市',
							type: 'select',
							multiple:true,
							filterable:true,
							props: {
								label: 'name',
								value: 'name',
							},
							cascader: ['area'],
							dicFlag: false,
							dicUrl: '/blade-system/region/select?provinceNames={{provinces}}',
							span:24,
						},
						{
							label: '区',
							labelWidth:40,
							prop: 'area',
							placeholder:'请选择区',
							type: 'select',
							multiple:true,
							filterable:true,
							props: {
								label: 'name',
								value: 'name',
							},
							dicFlag: false,
							dicUrl: '/blade-system/region/select?cityNames={{city}}',
							span:24,
						},
					]
				},
				
			}
		},
		mounted(){
			getDetail(this.obj.id).then(res=>{
				this.formData = {
					provinces: res.data.data.provinces ? res.data.data.provinces.split(",") : [],
					city: res.data.data.city ? res.data.data.city.split(",") : [],
					area: res.data.data.area ? res.data.data.area.split(",") : [],
					userId: this.obj.id,
					id: this.obj.id,
				}
			});
		},
		methods:{
			cancel(){
				this.$emit('childSubmit','cancel');
			},
			submitForm(){
				this.$refs['formData'].validate((valid,done) => {
					if (valid) {
						let formData = JSON.parse(JSON.stringify(this.formData));
						let params = {
							provinces: formData.provinces.join(","),
							city: formData.city.join(","),
							area: formData.area.join(","),
							userId: this.obj.id,
							id: this.obj.id,
						}
						editSiteEmpAuth(params).then(res => {
							this.$message({
								type: 'success',
								message: '操作成功!',
							});
							this.$emit('childSubmit');
						}, error => {
							window.console.log(error);
						});
						done();
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
		}
	}
</script>

<style>
</style>