<template>
  <el-dialog title="详情" :visible.sync="detailOpen" width="1200px" append-to-body destroy-on-close :close-on-click-modal="false">
    <el-form label-width="170px">
      <el-row class="el-row-table">
        <el-col :span="14">
          <el-col :span="12">
            <el-form-item label="开始时间">
              <span v-if="detailInfo.startTime">{{ detailInfo.startTime }}</span>
              <span v-else>-</span>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="结束时间" >
              <span v-if="detailInfo.endTime">{{ detailInfo.endTime }}</span>
              <span v-else>-</span>
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="上传时间" >
              <span v-if="detailInfo.createTime">{{ detailInfo.createTime }}</span>
              <span v-else>-</span>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="建设内容" >
              <span v-if="detailInfo.constructionContent">{{ detailInfo.constructionContent }}</span>
              <span v-else>-</span>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-form-item label="备注" >
              <span v-if="detailInfo.remark">{{ detailInfo.remark }}</span>
              <span v-else>-</span>
            </el-form-item>
          </el-col>
        </el-col>

        <el-col :span="9">
          <div style="width: 100%;height: 390px; border: 1px solid rgb(218, 213, 213);margin-bottom: 10px;">
            <div style="width: 100%;height: 100%" id="hiddenContainer"></div>
          </div>
        </el-col>

      </el-row>
    </el-form>
  </el-dialog>

</template>

<script>
  import {EditorMap} from "@/utils/mapClass/getPath";

  import { listProgress, getProgress, delProgress, addProgress, updateProgress, exportProgress } from "@/api/oldpipesystem/progress";
  export default {
    name: "detail-info",
    data(){
        return{
          map: null,
          coordinateslist:[],
          enterprises: [],
          countyInfo: [],
          detailInfo: {},
          enterpriseName:"",
          detailOpen: false,
          fUploadTimeLable: "",
          fUploadTypeLable: "",
          fUploadType: "",
          fUploadTime: null
        }
    },
  created() {
  },
    methods:{
      getDetailInfo(id){
        getProgress(id).then(res =>{
          if(res.code == 200 && res.data){
            this.detailInfo = res.data;
            this.detailOpen = true;

            this.$nextTick(() => {
              const path = eval(this.$store.state.user.systemSetting.map_center);
              console.log("path",path);
              const text=this.detailInfo.coordinates
              if(text){
                this.coordinateslist=JSON.parse(text);
                this.map = new EditorMap("hiddenContainer", {center:path}, this);
                this.map.addPipeLine({ path: this.coordinateslist });
              }

            });
          }
        })
      }
    }
  }
</script>

<style scoped>

</style>
