<template>
  <div>
    <el-tabs v-model="activeName" @tab-click="handleClickNavs">
      <el-tab-pane label="基本信息" name="first">
        <EssentialInformation @getPosition="getPosition" :essential-information-form-data="informationCollectionData"/>
      </el-tab-pane>
      <el-tab-pane label="违法建筑" name="second">
        <IllegalConstruction :illegal-construction-form-data="informationCollectionData"/>
      </el-tab-pane>
      <el-tab-pane label="违法审批" name="third">
        <IllegalApproval :illegal-approval-form-data="informationCollectionData"/>
      </el-tab-pane>
      <el-tab-pane label="隐患问题" name="fourth">
        <Concerns :concerns-form-data="informationCollectionData"/>
      </el-tab-pane>
      <!--      <el-tab-pane label="json" name="fives">-->
      <!--        <JsonTest/>-->
      <!--      </el-tab-pane>-->
    </el-tabs>
    <div slot="footer" class="dialog-footer" style="text-align: right;margin-top: 20px">
      <el-button @click="cancelOption">{{ onlyShow ? '关闭' : '取 消' }}</el-button>
      <el-button v-if="!onlyShow" type="primary" @click="conformOption">确 定</el-button>
    </div>
  </div>
</template>

<script>
import EssentialInformation from "./EssentialInformation";
import IllegalConstruction from "./IllegalConstruction";
import IllegalApproval from "./IllegalApproval";
import Concerns from "./Concerns";
import {getInformationCollection, updateInformationCollection} from "../../../api/forms";

export default {
  name: "navs",
  props: ["id", 'onlyShow'],
  components: {
    EssentialInformation, IllegalConstruction, IllegalApproval, Concerns
  },
  data() {
    return {
      activeName: "first",
      informationCollectionData: {
        id: this.id,
        propertyOwner: "",//产权人
        propertyOwnerPhoneNumber: "", //产权人电话
        user: "",//使用人
        userPhoneNumber: "",//使用人电话
        county: "", //区县
        street: "", // 街道
        neighborhoodCommittee: "", // 居委会
        road: "",//路、街巷
        roadNumber: "",//号
        buildingName: "",//建筑名称
        buildNo: '',//楼号
        pliesNumber: 1,//层数
        coveredArea: '',//建筑面积
        completeTime: "",//建成年代
        plannedConstructionPurpose: "",//原规划建设用途
        livingNumber: "",//住用人数
        hasSafetyLoophole: '',//是否有安全隐患
        landStatus: "", //土地性质
        hasRegistrationTitle: '', //是否产权登记
        practicalPurpose: "", //实际用途
        otherPracticalPurpose: '',// 其他实际用途，当practicalPurpose为“其他”时必填
        structureType: "", // 结构类型
        otherStructureType: "", // 其他结构类型，同上
        constructionSituationCheck: "", // 既有房屋实际施工情况排查
        designUnit: "",  // 设计单位
        constructionUnit: "", // 施工单位
        hasConstructionSketch: '', //是否有施工草图
        modificationSituationInvestigation: "", //改造情况排查
        modificationCompletionTime: "", // 改造完成时间
        modificationContent: "", // 改造内容
        otherModificationContent: "", //其他改造内容
        buildingOnStreamTime: "",// 在建开工时间
        buildingConstructionUnit: "", // 在建建设单位
        buildingNeighborhoodCommittee: "", // 在建居委
        buildingRoadworkUnit: "", //在建施工单位
        buildingVisualProgress: "", // 在建形象进度
        buildingDesignUnit: "",  // 在建设计单位
        buildingResumeUnit: "", // 在建监理单位
        hasIllegalProjectProcedures: '', // 是否依法办理立项手续
        hasIllegalConstructionLand: '', // 是否违法建设用地
        hasIllegalPlanningPermission: '',// 是否有违法规划许可......
        hasIllegalConstructionPermission: '', //是否未取得施工许可违法擅自施工
        hasIllegalQualification: '',// 无资质施工、设计
        hasIllegalCompletionAcceptance: '', // 未办理竣工验收擅自使用
        hasIllegalChangeUsage: '', // 擅自改变使用功能
        hasCollapseRisk: "", // 存在坍塌风险
        hasIllegalRegistrationAuthority: '', // 违规取得消防。。。。经验许可
        livingMessage: "",// 违法建筑备注
        hasIllegalProjectApproval: '', //立项审批违规
        hasIllegalUsedLandApproval: '', //用地审批违规
        hasIllegalPlanApproval: '', //规划审批违规
        hasIllegalConstructionPermitsApproval: '', //施工许可审批违规
        hasIllegalManageApproval: '', //经验审批违规
        hasConcerns: '', // 是否存在需要整改的隐患问题
        dismantleArea: '', // 拆除涉及面积
        dismantlePlanCompleteTime: "", // 拆除计划完成时间
        dismantleActualCompleteTime: "", // 拆除实际完成时间
        reinforceArea: '', // 加固涉及面积
        reinforcePlanCompleteTime: "", // 加固计划完成时间
        reinforceActualCompleteTime: "", // 加固实际完成时间
        confiscateArea: '', // 没收涉及面积
        confiscatePlanCompleteTime: "", // 没收计划完成时间
        confiscateActualCompleteTime: "", // 没收实际完成时间
        stopUsedArea: '', // 责令停止使用涉及面积
        stopUsedPlanCompleteTime: "", // 责令停止使用计划完成时间
        stopUsedActualCompleteTime: "", // 责令停止使用实际完成时间
        rectificationUsedArea: '', // 责令停工整改涉及面积
        rectificationPlanCompleteTime: "", // 责令停工整改计划完成时间
        rectificationActualCompleteTime: "", // 责令停工整改实际完成时间
        punishCompanyNum: '',   //处罚企业数量
        punishUsersNum: '', //处罚人员数量
        punishMoney: '',//处罚金额
        punishLetterNum: '', //下发处罚通知单份数
        NewDesignUnit: "",  //改造设计单位
        NewConstructionUnit: "",  // 改造施工单位
        approvalMessage: "", // 违法审批备注
        position: "", // TODO 经纬度，（新增） √
        houseFrontImage: [], // TODO 房屋正面照片（新增）
        housePotentialAccidentsImage: [], // TODO 房屋隐患照片（新增）
        underGroundPliesNumber: 1, // TODO 地下层数 （新增）√
        height: "", // TODO 建筑高度 （新增）√
        siteConditions: "", // todo 场地情况 （新增）√
        siteProperties: "", // todo 具体场地类型 （新增）√
        constructionMode: "", // todo 建造方式 （新增）√
        isProtectConstruction: "", // todo 是否是保护建筑 √
        protectConstructionType: "", // todo 保护建筑类型 √
        hasSeismicIsolation: "", // todo 是否采用减隔震 √
        hasSeismicHardening: "", // todo 是否进行过抗震加固 new
        seismicHardeningTime: "", // todo 抗震加固时间 new
      }
    }
  },
  mounted() {
    this.loadInformationCollection()
  },
  methods: {
    handleClickNavs() {

    },
    loadInformationCollection() {
      let _this = this;
      getInformationCollection(this.id).then(res => {
        console.log(res)
        if (res.code === 200) {
          _this.informationCollectionData = res.result;
        }
      })
    },
    cancelOption() {
      this.$emit('closedOP')
    },
    conformOption() {
      let _this = this;
      let essentialInformationFormData = this.informationCollectionData;
      if (essentialInformationFormData.id) {
        updateInformationCollection(essentialInformationFormData).then(res => {
          if (res.code === 200) {
            _this.$message({
              message: "更新成功",
              type: 'success'
            })
          }
          _this.$emit('closedOP')
        })
      }
    },
    getPosition(position) {
      this.informationCollectionData.position = position;
      console.log(position)
    }
  }
}
</script>

<style>

.van-field--disabled .van-field__label {
  color: #646566 !important;
}

.van-field__control:disabled {
  color: #646566 !important;
  -webkit-text-fill-color: #646566 !important;
}

.el-image-viewer__wrapper {
  z-index: 2019 !important;
}
.custom-theme .el-dialog{
  z-index: 34 !important;
}
</style>
