fj-dc-ui/.svn/pristine/84/84e69a452e2b347cbc672db12abe905909d875b3.svn-base

<template>
    <div id="skJichuxinxiContainer">
        <el-dialog :title="formObj.swhsName+'基础信息'" :visible.sync="dialogFormVisible" :append-to-body="true" height="500">
        <el-container>
            <el-main style="border:1px solid #d5d5ff;margin-left:5px;padding:0px;overflow-x: hidden;">
                <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">详情</p>
                <el-row :gutter="5" style="padding:10px;">
                  <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 地表水水源地名称：</el-col>
                  <el-col :span="6" style="text-align:left;">{{formObj.swhsName}}</el-col>
                  <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">  所在位置：</el-col>
                  <el-col :span="6" style="text-align:left;">{{formObj.swhsLoc}}</el-col>
                </el-row>
                <el-row :gutter="5" style="padding:10px;">
                    <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 管理单位所属行业：</el-col>
                    <el-col :span="6" style="text-align:left;">{{formObj.tra}}</el-col>
                    <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">取水口数量：</el-col>
                    <el-col :span="6" style="text-align:left;">{{formObj.wainNum}}</el-col>
                </el-row>
                <el-row :gutter="5" style="padding:10px;">
                  <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 主要取水用途：</el-col>
                  <el-col :span="6" style="text-align:left;">
                    <span v-if="formObj.wainUse == '1'">城乡生活</span>
                    <span v-if="formObj.wainUse == '2'">城镇生活</span>
                    <span v-if="formObj.wainUse == '3'">乡村生活</span>
                  </el-col>
                  <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">取水水源类型：</el-col>
                  <el-col :span="6" style="text-align:left;">
                    <span v-if="formObj.wintType == '1'">水库</span>
                    <span v-if="formObj.wintType == '2'">湖泊</span>
                    <span v-if="formObj.wintType == '3'">河流</span>
                    <span v-if="formObj.wintType == '9'">其他</span>
                  </el-col>
                </el-row>
              <el-row :gutter="5" style="padding:10px;">
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 水质目标：</el-col>
                <el-col :span="6" style="text-align:left;">
                  <span v-if="formObj.waquGoal == '1'">表示Ⅰ类水质目标</span>
                  <span v-if="formObj.waquGoal == '2'">表示Ⅱ类水质目标</span>
                  <span v-if="formObj.waquGoal == '3'">表示Ⅲ类水质目标</span>
                  <span v-if="formObj.waquGoal == '4'">表示Ⅳ类水质目标</span>
                  <span v-if="formObj.waquGoal == '5'">表示Ⅴ类水质目标</span>
                  <span v-if="formObj.waquGoal == '6'">表示劣Ⅴ类水质目标</span>
                </el-col>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">水面面积(k㎡)：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.watArea}}</el-col>
              </el-row>
              <el-row :gutter="5" style="padding:10px;">
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 一级保护区水域面积(k㎡)：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.watArea1stProt}}</el-col>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">二级保护区水域面积(k㎡)：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.watArea2ndProt}}</el-col>
              </el-row>

              <el-row :gutter="5" style="padding:10px;">
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 取水湖泊名称：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.wintLakeName}}</el-col>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">取水水库名称：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.wintRsName}}</el-col>
              </el-row>

              <el-row :gutter="5" style="padding:10px;">
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;"> 取水河流名称：</el-col>
                <el-col :span="6" style="text-align:left;">{{formObj.wintRvName}}</el-col>
                <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">水源地现状-水质类别：</el-col>
                <el-col :span="6" style="text-align:left;">
                  <span v-if="formObj.waquGoal == '1'">表示Ⅰ类水质目标</span>
                  <span v-if="formObj.waquGoal == '2'">表示Ⅱ类水质目标</span>
                  <span v-if="formObj.waquGoal == '3'">表示Ⅲ类水质目标</span>
                  <span v-if="formObj.waquGoal == '4'">表示Ⅳ类水质目标</span>
                  <span v-if="formObj.waquGoal == '5'">表示Ⅴ类水质目标</span>
                  <span v-if="formObj.waquGoal == '6'">表示劣Ⅴ类水质目标</span>
                </el-col>
              </el-row>


                <el-row :gutter="5" style="padding:10px;">
                    <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">经度：</el-col>
                    <el-col :span="6" style="text-align:left;">{{formObj.swhsLong }}</el-col>

                    <el-col :span="6" style="color:#409EFF;text-align:right;font-weight:bold;">纬度：</el-col>
                    <el-col :span="6" style="text-align:left;">{{formObj.swhsLat }}</el-col>
                </el-row>
            </el-main>
        </el-container>
        </el-dialog>
    </div>
</template>

<script>
import { getDbsBaseInfo } from "../../../api/zhxxAPI.js";
export default {
  components: {

  },
  props: ["currentResCode"],

  data() {
    return {
        dialogFormVisible:false,
      formObj: {},
      formLabelWidth: "160px",
      loading: true,
      currentResCode1: "",
    };
  },
  computed: {
    recPersId() {
      return localStorage.getItem("userid")
        ? localStorage.getItem("userid")
        : "";
    }
  },
  mounted() {
    this.dialogFormVisible = true;
    this.currentResCode1 = this.currentResCode;
    this.getBaseInfo();
  },
  watch: {
    currentResCode(n, o) {
        this.currentResCode1 = this.currentResCode;
      this.getBaseInfo();
    }
  },
  methods: {
      showDialog(){
          this.dialogFormVisible = true;
      },
    getBaseInfo() {
      var _self = this;
      if(_self.currentResCode1 == ""){
        return
      }

      getDbsBaseInfo(_self.currentResCode1).then(res => {
          if (res.data) {
            _self.formObj = res.data;
          } else {
            _self.formObj = {};
          }
        }).catch(err =>{
          console.log(err);
      });
    }
  }
};
</script>

<style>

</style>