<template>
    <div class="info">
        <el-form :model="formData" disable ref="formData" label-width="150px" class="custom-form">
            <el-row>
                <el-col :span="10">
                    <el-form-item label="单位名称" prop="enforce_obj_name">
                        <el-input v-model="formData.enforce_obj_name" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="单位地址" prop="enforce_obj_address">
                        <el-input v-model="formData.enforce_obj_address" suffix-icon="el-icon-place"
                                  @focus="showMap()"
                        >
                        </el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="10">
                    <el-form-item label="单位类型" prop="enforce_obj_type">
                        <!--                        <el-input v-model="formData.enforce_obj_type" :disabled="true"/>-->
                        <el-select v-model="formData.enforce_obj_type" disabled placeholder="">
                            <el-option
                                    v-for="item in this.unitSize"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="场所类型" prop="place_type">
                        <!--                        <el-input v-model="formData.place_type" :disabled="true"/>-->
                        <el-select v-model="formData.place_type" disabled placeholder="">
                            <el-option
                                    v-for="item in this.placeType"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :span="10">
                    <el-form-item label="单位法人" prop="legal_person">
                        <el-input v-model="formData.legal_person" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="联系电话" prop="legal_person_phone">
                        <el-input v-model="formData.legal_person_phone" :disabled="true"/>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <el-dialog title="地图" :visible.sync="showMapVisible" append-to-body>
            <place-map v-if="showMapVisible" ref="map"
                       :address.sync="formData.enforce_obj_address"
                       @hidePlace="showMapVisible=false">
            </place-map>
        </el-dialog>
    </div>
</template>

<script>
    import {getEnforceItem} from '@/api/resource'
    import PlaceMap from '@/component/PlaceMap.vue'
    import {resourceMixin} from '@/mixin/resource'

    export default {
        name: "OrgInfo",
        props: {
            id: {
                type: String,
                default: ''
            }
        },
        mixins: [resourceMixin],
        components: {
            PlaceMap
        },
        data() {
            return {
                formData: {},
                addressMap: false,
                addressTitle: '',
                showMapVisible: false
            }
        },
        mounted() {
            this.getEnforceItem();
        },
        methods: {
            showMap() {
                this.showMapVisible = true;
            },
            close() {

            },
            getEnforceItem() {
                getEnforceItem(this.id).then(res => {
                    this.formData = res;
                })
            }

        }
    }
</script>

<style scoped>

</style>