fj-dc-ui/.svn/pristine/c7/c730749a4d17eaf0abfaab120b0f6af732ff2a23.svn-base

<template>
  <!-- 弹出窗 -->
  <el-dialog title="添加督查对象" :visible.sync="dialogFormVisible" width="80%" modal-append-to-body append-to-body>
    <el-container>
      <el-aside width="200px" style="border:1px solid #d5d5ff">
        <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">
          <i class="el-icon-share"></i>所属机构
        </p>
        <provTreeListQy
        ref="provTreeListQyRef"
        v-show="showLeftTree"
        :ddczId='dczId'
          rootCode="000000"
          :adCodes="adCodes"
          rootType="1"
          style="max-height:485px;"
          @treeDataEmit="treeDataEmit"
          @provTreeSelectChange="provTreeSelectChangeHandler_qy">

        </provTreeListQy>
        <provTreeList
        v-show="!showLeftTree"
          rootCode="000000"
          rootType="1"
          style="max-height:485px;"
          @provTreeSelectChange="provTreeSelectChangeHandler"
        ></provTreeList>
      </el-aside>
      <el-main style="border:1px solid #d5d5ff;margin-left:5px;padding:0px;">
        <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">督查对象</p>
        <el-form style="padding:10px">
          <div>
            <el-form size="mini" :inline="true" class="demo-form-inline">
              <el-form-item label="名称">
                <el-input
                  style="width:140px;"
                  v-model="searchNameOfSzName"
                  clearable
                  placeholder="请输入名称"
                ></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="refreshCurrentShow">查询</el-button>
                <el-button type="primary" @click="addRsvrVisible=true">添加对象</el-button>
              </el-form-item>
            </el-form>
            <el-table
              border
              v-loading="loading"
              :data="currentShowList"
              tooltip-effect="dark"
              style="width: 100%"
              @selection-change="handleSelectionChange"
            >
              <el-table-column align="center" type="selection" width="60"></el-table-column>
              <el-table-column align="center" prop="index" label="序号" min-width="40"></el-table-column>
              <el-table-column
                align="center"
                show-overflow-tooltip
                prop="nm"
                label="对象名称"
                min-width="150"
              ></el-table-column>
              <el-table-column
                align="center"
                show-overflow-tooltip
                prop="adName"
                label="行政区划"
                min-width="150"
              ></el-table-column>
              <el-table-column
                align="center"
                show-overflow-tooltip
                prop="location"
                label="位置"
                min-width="150"
              ></el-table-column>
<!--              <el-table-column-->
<!--                align="center"-->
<!--                show-overflow-tooltip-->
<!--                prop="unitType"-->
<!--                label="单位类型"-->
<!--                :formatter="unitTypeFormat"-->
<!--                min-width="150"-->
<!--              ></el-table-column>-->
<!--              <el-table-column-->
<!--                align="center"-->
<!--                show-overflow-tooltip-->
<!--                prop="ndstyType"-->
<!--                :formatter="ndstyTypeFormat"-->
<!--                label="行业类型"-->
<!--                min-width="150"-->
<!--              ></el-table-column>-->
            </el-table>
            <div
              class="block"
              style="display:flex;flex-direction:row;justify-content:center;align-items:center;padding-top: 5px;background-color: #fff;"
            >
              <el-pagination
                small
                @current-change="handleCurrentChange"
                :pager-count="5"
                :current-page.sync="pageIndex"
                :page-size="pageSize"
                layout="total, prev, pager, next"
                :total="total"
              ></el-pagination>
            </div>
          </div>
          <!-- </el-form-item> -->
        </el-form>
      </el-main>
      <el-dialog title="添加新对象" :visible.sync="addRsvrVisible" append-to-body>
        <el-form label-width="220px" :model="formObj" >
          <el-form-item label="水源地名称" required>
            <el-input v-model="formObj.swhsName" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="行政区划" required>
            <div>
              <el-select v-model="provName" placeholder="选择省" @change="provChange" style="width:20%">
                <el-option
                  v-for="item in provList"
                  :key="item.adCode"
                  :label="item.adName"
                  :value="item.adCode">
                </el-option>
              </el-select>
              <el-select v-model="cityName" placeholder="选择市" @change="cityChange" style="width:20%">
                <el-option
                  v-for="item in cityList"
                  :key="item.adCode"
                  :label="item.adName"
                  :value="item.adCode">
                </el-option>
              </el-select>
              <el-select v-model="countryName" placeholder="选择县" @change="countryChange" style="width:20%">
                <el-option
                  v-for="item in countryList"
                  :key="item.adCode"
                  :label="item.adName"
                  :value="item.adCode">
                </el-option>
              </el-select>
            </div>
          </el-form-item>
          <el-form-item label="水源地类型" required>
            <el-select v-model="formObj.wainWasoType">
              <el-option label="水库" value="1"></el-option>
              <el-option label="湖泊" value="2"></el-option>
              <el-option label="河流/河道" value="3"></el-option>
              <el-option label="其他" value="9"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="使用状态">
            <el-select v-model="formObj.swhsUse">
              <el-option label="城市日常" value="1"></el-option>
              <el-option label="城市日常、应急" value="2"></el-option>
              <el-option label="城乡日常" value="3"></el-option>
              <el-option label="城乡日常、应急" value="4"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="水源地级别">
            <el-select v-model="formObj.swhsLevel">
              <el-option label="市级" value="1"></el-option>
              <el-option label="县级" value="2"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="取水口位置">
            <el-input v-model="formObj.wainLoc" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="管理单位">
            <el-input v-model="formObj.insName" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="管理单位联系人">
            <el-input v-model="formObj.insPer" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="管理单位联系人电话">
            <el-input v-model="formObj.insPerPhone" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="水行政主管部门">
            <el-input v-model="formObj.dept" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="水行政主管部门联系人">
            <el-input v-model="formObj.deptPer" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="水行政主管部门联系电话">
            <el-input v-model="formObj.deptPerPhone" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="备注">
            <el-input v-model="formObj.note" type="textarea" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="经度">
            <el-input v-model="formObj.gdX" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="纬度">
            <el-input v-model="formObj.gdY" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="addRsvrVisible = false">取 消</el-button>
          <el-button type="primary" @click="addNewObj('formObj')">确 定</el-button>
        </div>
      </el-dialog>
    </el-container>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" :loading="addOnce" :disabled="addOnce" @click="saveChange">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import request from '../../utils/gw_ajax_request.js';
import provTreeList from "../../widgets/provTreeList.vue";
// import provTreeListQy from "../../widgets/provTreeList_quyu.vue"
import {
  getObjListNotInspGroupId,
  addDcAndObjRel
} from "../../api/duChaDuiXiang_xsk_API.js";
import {getSupObjListNotInspGroupId} from '../../api/duChaPlan.js'
export default {
  components: {
    provTreeList: provTreeList,
    provTreeListQy:resolve => {require(['../../widgets/provTreeList_quyu.vue'],resolve)},
  },
  props: ["dczId", "dczName", "plnaId", "objType","adCodes","isNewPlan"],
  computed: {},
  data() {
    return {
      addOnce:false,
      searchNameOfSzName: "",
      searchNameOfAdName: "",
      searchNameOfwtdstNm: "",
      rsAdmDep: "",
      engScal: "",
      wtdstState: "",
      engLevel: "",
      wtdstType: "",
      stnm:'',
      pageIndex: 1,
      pageSize: 10,
      total: 0,
      currentShowList: [],
      dialogFormVisible: false,
      formLabelWidth: "120",
      addArr: "",
      addName:"",
      addLttd:"",
      addLgtd:"",
      multipleSelection: [],
      searchProvTreeListCode: "",
      qyDataList:[],
      loading:false,
      showLeftTree:true,
      addRsvrVisible: false,
      formObj: {
          swhsCode:"",
          swhsName:"",
          adCode:"",
          adName:"",
          wainWasoType:"",
          swhsUse:"",
          swhsLevel:"",
          wainLoc:"",
          insName:"",
          insPer:"",
          insPerPhone:"",
          dept:"",
          deptPer:"",
          deptPerPhone:"",
          gdX:"",
          gdY:"",
          note:""
      },
      props: {
          value: 'id',
          label: 'label',
          children: 'cities'
      },
        provList: [],
        cityList: [],
        countryList: [],
        provName: '',
        cityName: '',
        countryName: '',
        provNames: '',
        cityNames: '',
        countryNames: '',
        curSelectItem: 0
    }
  },
  watch: {
    dczId: function(n, o) {
      this.searchProvTreeListCode = "";
    },
    objType: function(n, o) {
      this.searchProvTreeListCode = "";
      this.objType = n;
      this.getAreaList()
    },
    qyDataList(n,o){
      if(this.qyDataList.length == 0){
        this.showLeftTree = false;
      }else{
        this.showLeftTree = true;
      }
        this.getTableData_172();
      console.log("区域树"+n.length+this.showLeftTree+this.objType);
        this.getAreaList()

    }
  },
  mounted() {
    // this.objType = '4';
    this.getTableData_172();
  },
  computed:{
        userId:function(){
            return localStorage.getItem("userid")? localStorage.getItem("userid"): '1098101939614724096'
        },
  },
  methods: {
      unitTypeFormat (row, column) {
          return row.unitType == '1' ? "企业" : row.rectConc == '2' ? "机关" : row.rectConc == '3' ? "学校" :
              row.rectConc == '4' ? "医院" : row.rectConc == '5' ? "宾馆" : row.rectConc == '6' ? "高校" :
                  row.rectConc == '7' ? "其他" : "";
      },
      ndstyTypeFormat (row, column) {
          return row.ndstyType == '1' ? "节水型" : row.ndstyType == '2' ? "非节水型" : "";
      },
      addNewObj(formName){
          let _this = this
          if(!this.formObj.swhsName){
              this.$message.warning('请输入水源地名称')
              return
          }
          if(!this.provName){
              this.$message.warning('请选择省份')
              return
          }
          if(!this.cityName){
              this.$message.warning('请选择市区')
              return
          }
          if(!this.countryName){
              this.$message.warning('请选择区县')
              return
          }
          if(!this.formObj.wainWasoType){
              this.$message.warning('请选择水源地类型')
              return
          }
          request.post('/att/swhsjs/base',this.formObj).then(res=>{
              if(res.success){
                  _this.$message.success('添加成功')
                  _this.getTableData_172_1();
                  _this.addRsvrVisible = false;
                  _this.provName = "";
                  _this.cityName = "";
                  _this.countryName = "";
                  _this.formObj = {};
              }else{
                  _this.$message.error(res.message)
              }
          }).catch(res=>{
              _this.$message.error('请求错误'+ res.message)
          })
      },
      engStaFormatter(row,column){
        return row.engSta == '1'? "建成":
            row.engSta == '2'? "未建成": '';
      },
      engScalFormatter(row,column){
        return row.engScal == '1'? "大型":
            row.engScal == '2'? "中型":
            row.engScal == '3'? "小型": '';
      },
    rsAdmDepFormatter: function(row, column) {
      return row.rsAdmDep == 1
        ? "水利部门"
        : row.rsAdmDep == 2
        ? "电力部门"
        : row.rsAdmDep == 3
        ? "农业部门"
        : row.rsAdmDep == 4
        ? "林业部门"
        : row.rsAdmDep == 5
        ? "城建部门"
        : row.rsAdmDep == 6
        ? "航运部门"
        : row.rsAdmDep == 7
        ? "环保部门"
        : "其他部门";
    },
    showDialog() {
      this.dialogFormVisible = true;
      if(this.$refs['provTreeListQyRef']){
        this.$refs['provTreeListQyRef'].getQyList();
      }
        this.getTableData_172();
    },
    saveChange() {
      this.addObjectChange();
    },
    treeDataEmit(item){
      this.qyDataList = item;
      if(this.qyDataList.length == 0){
        this.showLeftTree = false;
      }else{
        this.showLeftTree = true;
      }
    },
    getTableData_172(){
      var _self = this;
      if(_self.qyDataList.length == 0){
        _self.showLeftTree = false;
      }else{
        _self.showLeftTree = true;
      }
      _self.loading = true;
      var str = '';
      for(var i=0;i<_self.qyDataList.length;i++){
        str+= _self.qyDataList[i].adCode+',';
      }
      str = str.substring(0,str.length-1);
      getSupObjListNotInspGroupId(str,_self.dczId,'',_self.pageSize,_self.pageIndex,_self.objType,_self.searchNameOfSzName).then((res)=>{
          _self.loading = false;
          _self.currentShowList = res.data.list;
          _self.currentShowList.forEach((element, index) => {
            element["index"] = _self.pageSize * (_self.pageIndex - 1) + index + 1;
          });
          _self.total = res.data.total;
      })
    },
    getTableData_172_1(){
      var _self = this;

      getSupObjListNotInspGroupId(_self.searchProvTreeListCode,_self.dczId,'',_self.pageSize,_self.pageIndex,_self.objType,_self.searchNameOfSzName).then((res)=>{
          _self.loading = false;
          _self.currentShowList = res.data.list;
          _self.currentShowList.forEach((element, index) => {
            element["index"] = _self.pageSize * (_self.pageIndex - 1) + index + 1;
          });
          _self.total = res.data.total;
      })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.refreshCurrentShow();
    },
    refreshCurrentShow: function() {
        if(this.searchProvTreeListCode){
          this.getTableData_172_1();
        }else{
          this.getTableData_172();
        }
    },

    addObjectChange: function() {
      //提交当前选中对象
      var _self = this;
      var names = [];
      if(_self.addOnce){
        _self.addOnce = false;
        return;
      }
      _self.addOnce = true
      var objArr = [];
      const length = _self.multipleSelection.length;
        for (let i = 0; i < length; i++) {
            var obj = {};
            obj['code'] = _self.multipleSelection[i].id;
            obj['name'] = _self.multipleSelection[i].nm;
            obj['objId'] = _self.multipleSelection[i].objId;
            obj['ptype'] = _self.objType;
            objArr.push(obj);
            names.push(_self.multipleSelection[i].nm);
        }
        if(this.isNewPlan){
            var obj = {
                persid :this.userId,
                nm: this.dczName,
                id: this.dczId,
                persAllAreaDtoList: [],
                persAllDtoList: [],
                persAllObjDtoList: objArr
            };
            this.addOnce = false;
            this.dialogFormVisible = false;
            this.$message.success("选择成功");
            this.$emit("addSuccess",{obj:obj,names:names.join(",")});
            return;
        }
      try {
        request.post("/supervision/plan/insertSupervisionObj", {
            persid :this.userId,
            nm: this.dczName,
            id: this.dczId,
            persAllAreaDtoList: [],
            persAllDtoList: [],
            persAllObjDtoList: objArr
        }).then(response => {
            if (response.success == true) {
                _self.addOnce = false;
                _self.dialogFormVisible = false;
                _self.$message.success("添加成功");
                _self.$emit("addSuccess");
            }
        });
        // addDcAndObjRel(
        //   _self.addArr,
        //   _self.addName,
        //   _self.addLttd,
        //   _self.addLgtd,
        //   _self.objType,
        //   _self.dczId,
        //   _self.plnaId,
        //   _self.plnaId,
        // ).then(response => {
        //   if (response.success == true) {
        //     _self.addOnce = false;
        //     this.dialogFormVisible = false;
        //     // this.getTableData();
        //     this.$message.success("添加成功");
        //     this.$emit("addSuccess");
        //     // _self.dczId = "";
        //     _self.addArr = "";
        //   }
        // });
      } catch (e) {
        alert("暂无数据");
      }
    },
    provTreeSelectChangeHandler: function(params) {
      this.searchProvTreeListCode = params.code;
        this.getTableData_172_1();

    },
    provTreeSelectChangeHandler_qy(params){
      this.searchProvTreeListCode = params.code;
        this.getTableData_172_1();

    },
    provChange(val){
        this.curSelectItem = 1
        this.cityName = ''
        this.countryName = ''
        this.formObj.adCode = val
        this.provList.forEach(ele=>{
            if(ele.adCode == this.provName){
                this.provNames = ele.adName
            }
        })
        this.formObj.adName = this.provNames
        this.getAreaList(val)
    },
    cityChange(val){
        this.curSelectItem = 2
        if(val && val != ''){
            this.formObj.adCode = val
            this.countryName = ''
            this.cityList.forEach(ele=>{
                if(ele.adCode == this.cityName){
                    this.cityNames = ele.adName
                }
            })
            this.formObj.adName = this.provNames + this.cityNames
            this.getAreaList(val)
        }
    },
    countryChange(val){
        if(val && val != ''){
            this.formObj.adCode = val
            this.countryList.forEach(ele=>{
                if(ele.adCode == this.countryName){
                    this.countryNames = ele.adName
                }
            })
            this.formObj.adName = this.provNames + this.cityNames + this.countryNames
        }
    },
    closeWindowEvent(){
        this.formObj.adCode = ""
    },
    getAreaList(val){
        let areaParams = {
            adName: "",
            id: this.dczId,
            pageNum: 1,
            pageSize: 10000
        }
        let adCode = ''
        if(!val){
            adCode = '000000000000'
        }else{
            adCode = val
        }
        request.get('/dc/ad/base/getAdData',{params:{'adCode':adCode}}).then(res=>{
            if(res.success){
                if(this.curSelectItem == 1){
                    this.cityList = res.data
                }else if(this.curSelectItem == 2){
                    this.countryList = res.data
                }else{
                    this.provList = res.data
                }

            }
        })
    },
  }
};
</script>
<style>
</style>