<template>
    <div>
        <div style="width:500px;margin: auto;margin-top: 30px;">
            <div style="margin-left: -50px; font-size: 14px;font-weight: 700;color: #666;padding: 4px 10px;border-left: 2px solid #666;">{{$t('common.UnitInformation')}}</div>
            <div style="height: 100px;position: relative;">
                <span style="position: absolute;left: 23%;top: 50%;transform: translate(-50%,-50%);font-size: 14px;color: #606266;">{{$t('common.Logo')}}</span>
                <img :src="'api/file/pub/'+ form.photo" alt="" style="width: 100px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);"/>
            </div>
        </div>
        <div style="width: 100%;">
            <el-form ref="form" :model="form" label-width="140px" class="demo-ruleForm"  style="margin-left: 284px;margin-top: 20px;">
                <el-form-item :label="$t('common.NameOfEnterprise')" prop='name'>
                    <el-input v-model="form.unitName" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.Continent')">
                        <el-input v-model="form.are" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.UCountry')">
                        <el-input  v-model="form.unitCountry" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.Nature')">
                    <el-input v-model="form.enterpriseProperty" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.UIndustry')">
                    <el-input v-model="form.industry" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.RegisteredCapital')">
                    <el-input v-model="form.registerMoney" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.EstablishmentTime')">
                    <el-input v-model="form.setUpDate" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.Website')">
                    <el-input v-model="form.officialWebsitePath" disabled></el-input>
                </el-form-item>
<!--                <el-form-item label="公司介绍:">-->
<!--                    <el-input type="textarea" :rows="2" v-html="form.unitIntrodution" disabled></el-input>-->
<!--                </el-form-item>-->
                <el-form-item :label="$t('common.UScope')">
                    <el-input type="textarea" :rows="4"  v-model="form.unitScope" disabled></el-input>
                </el-form-item>
            </el-form>

        </div>

        <div style="width:500px;margin: auto;margin-top: 30px;">
            <div style="margin-left: -50px; font-size: 14px;font-weight: 700;color: #666;padding: 4px 10px;border-left: 2px solid #666;">{{$t('common.Contact Information')}}</div>
        </div>
        <div style="width: 100%;">
            <el-form ref="form" :model="form" label-width="120px" class="demo-ruleForm" style="margin-left: 284px;margin-top: 20px;">
                <el-form-item :label="$t('common.ContactsName')" prop='name'>
                    <el-input v-model="form.linkName" disabled></el-input>
                </el-form-item>
                <el-form-item :label="$t('common.ContactsPhone')">
                    <el-input v-model="form.linkPhoneNumber" disabled></el-input>
                </el-form-item>
            </el-form>

        </div>
        <div style="clear: both;"></div>

    </div>
</template>
<script>
    import { getUnitInfo } from "@/api/userCenter";
    import { formatDate } from "@/utils/formatUtils";
    export default {
        name: 'userCenterUnitInformation',
        data () {
            return {
                informationsClass:'1',
                dialogVisible: false,
                ifDiaslog:'',
                title:'',
                form: {
                    unitName: '',
                    unitCode: '',
                    registerMoney: '',
                    unitCountry: '',
                    unitCountryDict: '',
                    unitProvince: '',
                    unitProvinceDict: '',
                    unitCity: '',
                    unitCityDict: '',
                    unitRegion: '',
                    setUpDate: '',
                    corporateName: '',
                    corporateIdCard: '',
                    corporateDuty: '',
                    officialWebsitePath: '',
                    unitAddress: '',
                    dynamic: '',
                    dynamicDict: '',
                    unitsSystem: '',
                    unitsSystemDict: '',
                    councilMembers: '',
                    councilMembersDict: '',
                    are: '',
                    industry: '',
                    industryDict: '',
                    areDict: '',
                    unitLabel: '',
                    unitIntrodution: '',
                    status: '',
                    statusDict: '',
                    language: '',
                    enterpriseProperty: '',
                    photo: '',
                    enterprisePropertyDict: '',
                    unitScope: '',
                    businessLicenseRegistrationNumber: '',
                    businessTermStartTime: '',
                    businessTermEndTime: '',
                    organizationCodeCertificateNo: '',
                    businessLicensePhoto: '',
                    organizationCodePhoto: '',
                    linkName: '',
                    linkPhoneNumber: '',
                },
                show: true,
                count: '',
                timer: null
            }
        },
        mounted () {
            this.initData();
        },
        watch: {
            '$i18n.locale'(){
                this.initData();
            }
        },
        methods:{
            getInformation(num){
                this.informationsClass=num
            },
            initData(){
                getUnitInfo(this.$i18n.locale).then(result => {
                    if(result.data){
                        this.form = result.data;
                        this.form.setUpDate = this.form.setUpDate
                            ? formatDate(this.form.setUpDate, "YYYY-MM-DD HH:mm:ss")
                            : "";
                        if(!this.form.photo){
                            this.form.photo = "/def/enterpriseDefault.png";
                        }
                    }

                }).catch((error) => {
                    this.$message({
                        message: error.msg,
                        type: 'error'
                    });
                })
            }
        }
    }
</script>
<style scoped>

    .box1:after{
        display:block;
        clear:both;
        content:"";
        visibility:hidden;
        height:0
    }
    .el-input {
        width: 75%;
    }
    .el-form {
        width: 500px !important;
    }
    .el-button {
        width: 200px;
        height: 45px;
    }
</style>