fj-dc-ui/.svn/pristine/11/1188d3c001f53f80aa8fc372be60e5aba983cbf2.svn-base

<template>
  <div id="gwd">
    <transition name="el-fade-in-linear">
      <draggable :title="'地下水测站信息'" initTop=100 initLeft=220 initWidth=790 initHeight=500  @closeDraggable='closeModal_dixiashui' style="z-index: 999;">
        <div class="process_line">
          <div class="item content4">
            <div class="item3">
              <div>
                <span class="label">测站名称：</span>
                <span class="label2">{{formObj.stnm}}</span>
              </div>
              <div class="mt20">
                <span class="label">测站编码：</span>
                <span class="label2 spanStyle">{{formObj.stcd}}</span>
              </div>
            </div>

            <div class="item3">
              <div class="">
                <span class="label">经度：</span>
                <span class="label2">{{formObj.lgtd}}</span>
              </div>
              <div class="mt20">
                <span class="label">纬度：</span>
                <span class="label2">{{formObj.lttd}}</span>
              </div>
            </div>
            <div class="item3">
              <div>
                <span class="label">测站地址：</span>
                <span class="label2 spanStyle" :title=formObj.stlc>{{formObj.stlc}}</span>
              </div>
            </div>

          </div>
          <el-collapse v-model="activeNames_sk" @change="skhandleChange" accordion>
            <el-collapse-item title="测站维护管理" name="1">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>基本信息与基础设施</span>
                </div>
                <div class="mt10">
                  <span class="span100">测站是否有标志牌:</span>
                  <span class="ml10">{{isRadio(formObj.flagSign)}}</span>
                </div>

              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>水库调度运用方案</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否编制:</span>
                  <span class="ml10">{{isRadio(czwhgl.schPlanSameExta)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">测站有无保护措施（新建站是否配套保护箱/保护筒/简易站房）:</span>
                  <span class="ml10">{{czwhgl.flagSafeguard == "1" ? "有": czwhgl.flagSafeguard == "0" ? "无" : ""}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>测量工具与人员</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否配备检测工具:</span>
                  <span class="ml10">{{isRadio(czwhgl.flagTool)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>井口保护设施</span>
                </div>
                <div class="mt10">
                  <span class="span100">保护筒外管是否完好无损:</span>
                  <span class="ml10">{{isRadio(czwhgl.wellProtScore)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否配备检测工具:</span>
                  <span class="ml10">{{isRadio(czwhgl.toolScore)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>得分</span>
                </div>
                <div class="mt10">
                  <span class="span100">得分 :</span>
                  <span class="ml10">{{czwhgl.score}}</span>
                </div>
              </el-card>
            </el-collapse-item>
            <el-collapse-item title="监测数据质量和到报率" name="2" class="sgzzr">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>监测数据质量和到报率</span>
                </div>
                <div class="mt10">
                  <span class="span100">现场比测精度误差（cm） :</span>
                  <span class="ml10">{{jcsjzl.repeatability}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">单站月统计到报率（%） :</span>
                  <span class="ml10">{{jcsjzl.percentageScore}}</span>
                </div>

              </el-card>
            </el-collapse-item>
            <el-collapse-item title="检查人员评价" name="3" class="sgzzr">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>详情</span>
                </div>
                <div class="mt10">
                  <span class="span100">检查人员评价 :</span>
                  <span class="ml10">{{jcry.checkComment}}</span>
                </div>

              </el-card>
            </el-collapse-item>
            <el-collapse-item title="问题清单" name="4">
              <div class="item content">
                <template>
                  <el-table :data="groundWateDialogData" height="200" highlight-current-row border stripe style="width: 100%">

                    <el-table-column
                      show-overflow-tooltip="true"
                      prop="inspPblmName"
                      label="问题名称"
                      min-width="100"
                      align="center"
                    ></el-table-column>
                    <el-table-column
                      header-align="center"
                      align="center"
                      show-overflow-tooltip="true"
                      min-width="120"
                      prop="inspPblmCate"
                      label="问题严重程度"
                    >
                      <template slot-scope="scope">
              <span
                style="padding: 3px 10px;background:#27C19F;border-radius:15px;color:rgba(255,255,255,1)"
                v-if="scope.row.inspPblmCate == 0"
              >一般</span>
                        <span
                          style="padding: 3px 10px;background:#E6A23C;border-radius:15px;color:rgba(255,255,255,1)"
                          v-if="scope.row.inspPblmCate == 1"
                        >较重</span>
                        <span
                          style="padding: 3px 10px;background:#F56C6C;border-radius:15px;color:rgba(255,255,255,1)"
                          v-if="scope.row.inspPblmCate == 2"
                        >严重</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      header-align="center"
                      align="center"
                      min-width="120"
                      prop="ifCasePblm"
                      label="是否典型"
                    >
                      <template slot-scope="scope">
                        <span v-if="scope.row.ifCasePblm == 1">典型</span>
                        <span v-if="scope.row.ifCasePblm == 0">非典型</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="collTime"
                      label="上报时间"
                      align="center"
                      :formatter="timestampToTime"
                      show-overflow-tooltip="true"
                      min-width="170"
                    ></el-table-column>

                    <!--<el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="objType" label="督查对象类型" align='center' width="150">-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="inspPblmType" label="督查问题类型" align='center' width="120"></el-table-column>-->
                    <!--<el-table-column prop="inspPblmCode" label="督查问题编码" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="objType" label="督查对象类型" align='center' width="150">-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="inspPblmType" label="督查问题类型" align='center' width="120"></el-table-column>-->
                    <!--<el-table-column prop="inspPblmCode" label="督查问题编码" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--<el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"-->
                                     <!--show-overflow-tooltip></el-table-column>-->
                    <!--&lt;!&ndash;<el-table-column prop="pblmLong" label="问题经度" align='center' width="130"></el-table-column>&ndash;&gt;-->
                    <!--&lt;!&ndash;<el-table-column prop="pblmLat" label="问题纬度" align='center'></el-table-column>&ndash;&gt;-->
                    <!--<el-table-column prop="ifCasePblm" label="是否典型问题" align='center' width="150">-->
                      <!--<template slot-scope="scope">-->
                        <!--<span v-if="scope.row.ifCasePblm == 1">典型</span>-->
                        <!--<span v-if="scope.row.ifCasePblm == 0">非典型</span>-->
                      <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="inspPblmOrgName" label="问题责任单位" align='center' width="150"></el-table-column>-->
                    <!--<el-table-column prop="pblmPersName" label="问题责任人" align='center' width="150"></el-table-column>-->
                    <!--<el-table-column prop="inspPblmCate" label="督查问题严重程度" align='center' width="150">-->
                      <!--<template slot-scope="scope">-->
                          <!--<span style="padding: 3px 10px;background:#27C19F;border-radius:15px;color:rgba(255,255,255,1)"-->
                                <!--v-if="scope.row.inspPblmCate == 0">一般</span>-->
                        <!--<span style="padding: 3px 10px;background:#E6A23C;border-radius:15px;color:rgba(255,255,255,1)"-->
                              <!--v-if="scope.row.inspPblmCate == 1">较重</span>-->
                        <!--<span style="padding: 3px 10px;background:#F56C6C;border-radius:15px;color:rgba(255,255,255,1)"-->
                              <!--v-if="scope.row.inspPblmCate == 2">严重</span>-->
                      <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="pblmStat" label="问题状态" align='center' width="150">-->
                      <!--<template slot-scope="scope">-->
                        <!--<span v-if="scope.row.pblmStat == 0">暂存</span>-->
                        <!--<span v-if="scope.row.pblmStat == 1">上报</span>-->
                        <!--<span v-if="scope.row.pblmStat == 2">审核</span>-->
                        <!--<span v-if="scope.row.pblmStat == 3">审办</span>-->
                        <!--<span v-if="scope.row.pblmStat == 4">整改通知</span>-->
                        <!--<span v-if="scope.row.pblmStat == 5">整改反馈</span>-->
                        <!--<span v-if="scope.row.pblmStat == 6">销号</span>-->
                        <!--<span v-if="scope.row.pblmStat == 9">删除</span>-->
                      <!--</template>-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="reviOpin" label="复查意见" align='center' width="150"></el-table-column>-->
                    <!--<el-table-column prop="reviConc" label="复查结论" align='center'>-->
                      <!--<template slot-scope="scope">-->
                        <!--<span v-if="scope.row.reviConc == 0">复查一次销号</span>-->
                        <!--<span v-if="scope.row.reviConc == 1">进一步整改</span>-->
                        <!--<span v-if="scope.row.reviConc == 2">多次整改销号</span>-->
                      <!--</template>-->
                    <!--</el-table-column>-->
                    <!--&lt;!&ndash;<el-table-column prop="dataStat" label="数据状态" align='center'></el-table-column>&ndash;&gt;-->
                    <!--<el-table-column prop="collTime" label="采集时间" align='center' :formatter="timestampToTime"-->
                                     <!--show-overflow-tooltip width="150">-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="recPers" label="操作记录人员" align='center' width="150"></el-table-column>-->
                  </el-table>
                </template>
              </div>
            </el-collapse-item>
          </el-collapse>
        </div>
      </draggable>
    </transition>
  </div>
</template>

<script>
  import draggable from './draggable'
  import request from '../../utils/gw_ajax_request'
  export default {
      name: "groundWateDialog",
      components:{
        draggable
      },
      props:["propsStcd","djbId","currentObjectId"],
      data(){
        return{
          processLineShow_dixiashui: true,
          groundWateDialogData: [],
          formObj: {},
          czwhgl: {},
          jcsjzl: {},
          jcry: {},
          activeNames_sk: 0,
          problemForm: {},
        }
      },
      computed: {
        persId() {
          return localStorage.getItem("userid")
            ? localStorage.getItem("userid")
            : "1098101939614724096";
        }
      },
      mounted(){
        this.getGroundWateData();
      },
      methods:{
        closeModal_dixiashui() {
          this.$emit('closeDraggable','dxs');
        },
        //折叠窗加载
        skhandleChange(val) {
          switch (val) {
            case '1':
              request.post(`/dc/insp/grw/getMainTainData?id=${this.djbId}`).then(res =>{
                if(res.success){
                  this.czwhgl = res.data;
                }else {
                  this.czwhgl = {};
                }
              });
              break;
            case '2':
              request.post(`/dc/insp/grw/getDataQuality?id=${this.djbId}`).then(res =>{
                if(res.success){
                  this.jcsjzl = res.data;
                }else {
                  this.jcsjzl = {};
                }
              });
              break;
            case '3':
              request.get(`/dc/insp/grw/getCkComment?id=${this.djbId}`).then(res =>{
                if(res.success){
                  this.jcry = res.data;
                }else{
                  this.jcry = {};
                }
              });
              break;
            case '4':
              this.groundWateDialogData = [];
              this.problemForm.regid = this.djbId;//1d913aea732f44798cf2648fd8eff4fe
              request.post(`/dc/insp/pblm/list/${this.persId}`,this.problemForm)
                .then(res => {
                  if (res.success) {
                    this.groundWateDialogData = res.data.list;
                    // this.tableLoading = false;
                  }
                });
              break;


          }
        },
        isRadio(val) {
          switch (val) {
            case "1":
              return "是";
              break;
            case "0":
              return "否";
              break;
          }
        },
        getGroundWateData() {
          request.get(`/dc/insp/attGrwBase/${this.propsStcd}`).then(res =>{
            if(res.success){
              this.formObj = res.data;
            }else {
              this.formObj = {};
            }
          })
        },
        timestampToTime(row, column) {
          var date = new Date(row.collTime);
          var Y = date.getFullYear() + "-";
          var M =
            (date.getMonth() + 1 < 10
              ? "0" + (date.getMonth() + 1)
              : "0" + date.getMonth() + 1) + "-";
          var D =
            (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
          var h =
            (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
          var m =
            date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
          return Y + M + D + h + m;
        }
      },
      watch: {
        currentObjectId(n){
          this.getGroundWateData();
        }
      }
  }
</script>

<style>
  #gwd .item.content4 {
    padding: 20px;
  }
  #gwd span.label {
    font-size: 17px;
    font-weight: bold;
  }
  #gwd span.label2.spanStyle {
    font-size: 13px;
  }
  #gwd .el-collapse-item__header, #kjrmap .el-table th>.cell {
    font-size: 14px;
    font-family: MicrosoftYaHei-Bold;
    font-weight: 700;
    color: #333;
  }

  #gwd .el-collapse-item__header {
    text-indent: 25px;
    background: #f6f8fb;
    box-shadow: 0 -1px 0 0 rgba(0,0,0,.1);
  }
</style>