fj-dc-ui/.svn/pristine/9c/9c58e4ba76762e24ba62f52111a00c10ba534bd9.svn-base

<template>
    <!-- 弹出窗 -->
    <el-dialog title="添加督查对象" :visible.sync="dialogFormVisible" width="80%" @close="closeWindowEvent" 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 label="是否已督查">
                          <el-select v-model="isSupn" placeholder="请选择" clearable style="width: 120px">
                            <el-option label="是" value="1"></el-option>
                            <el-option label="否" value="0"></el-option>
                          </el-select>
                        </el-form-item>
                        <el-form-item label="督查类别">
                          <el-select v-model="isBack" placeholder="请选择" clearable style="width: 120px">
                            <el-option label="回头看" value="1"></el-option>
                            <el-option label="本年度" value="0"></el-option>
                          </el-select>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="refreshCurrentShow">查询</el-button>
                            <el-button type="primary" @click="importExcel">全部导入</el-button>
                            <el-button type="primary" @click="addSiLuanVisisble=true">新增对象</el-button>
                        </el-form-item>
                      <el-form-item>
                        <el-button type="primary" @click="downTemplateExcel">下载模板</el-button>
                      </el-form-item>
                      <el-form-item>
                        <uploadExcel></uploadExcel>
                      </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="100"
                        ></el-table-column>
                        <el-table-column
                            align="center"
                            show-overflow-tooltip
                            prop="type"
                            label="问题类别"
                            :formatter="problemType"
                            min-width="100"
                        ></el-table-column>
                        <el-table-column
                            align="center"
                            show-overflow-tooltip
                            prop="pblmDesc"
                            label="问题描述"
                            min-width="100"
                        ></el-table-column>
                        <!-- <el-table-column
                            align="center"
                            show-overflow-tooltip
                            prop="gateAdmDep"
                            label="是否销号"
                            min-width="100"
                        ></el-table-column> -->
                        <el-table-column
                            align="center"
                            show-overflow-tooltip
                            prop="rectConc"
                            label="是否销号"
                            min-width="80"
                        >
                          <template slot-scope="scope">
                            <span v-if="scope.row.rectConc=='1'">已销号</span>
                            <span v-if="scope.row.rectConc=='2'">未销号</span>
                            <span v-if="scope.row.rectConc=='3'">新增</span>
                          </template>
                        </el-table-column>
                        <el-table-column
                          align="center"
                          show-overflow-tooltip
                          prop="state"
                          label="是否督查"
                          min-width="80"
                        >
                          <template slot-scope="scope">
                               <span v-if="scope.row.state=='1'">是</span>
                               <span v-if="scope.row.state=='0' || scope.row.state==null || scope.row.state==''">否</span>
                          </template>
                        </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>
            </el-main>
        </el-container>
      <el-dialog title="添加新对象" :visible.sync="addSiLuanVisisble" append-to-body>
        <el-form label-width="220px"  ref="formObj">
          <el-form-item label="项目名称" required >
            <el-input v-model="formObj.name" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="河流、河段（湖泊）名称"  required>
            <el-input v-model="formObj.rvReaLkName" 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.pblmType" clearable>
              <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-option label="其他" value="5"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="问题描述" required>
            <el-input v-model="formObj.pblmDesc" autocomplete="off" style="width:70%;"></el-input>
          </el-form-item>
          <el-form-item label="位置">
            <el-input v-model="formObj.location" 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="addSiLuanVisisble = false">取 消</el-button>
          <el-button type="primary" @click="addNewObj('formObj')">确 定</el-button>
        </div>
      </el-dialog>
        <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 '@util/gw_ajax_request.js';
import provTreeList from "@widget/provTreeList.vue";
import uploadExcel from "./uploadExcel";
import { exportModel } from "@util/gw_exportModel"
import {
    getObjListNotInspGroupId,
    addDcAndObjRel
} from "@api/duChaDuiXiang_xsk_API.js";
import {getSupObjListNotInspGroupId} from '@api/duChaPlan.js'
export default {
    components: {
        provTreeList: provTreeList,
        provTreeListQy:resolve => {require(['@widget/provTreeList_quyu.vue'],resolve)},
        uploadExcel
    },
    props: ["dczId", "dczName", "plnaId", "objType","adCodes","isNewPlan"],
    computed: {},
    data() {
        return {
            isSupn:"",
            isBack:"",
            addOnce:false,
            searchNameOfSzName: "",
            rsAdmDep: "",
            pageIndex: 1,
            pageSize: 10,
            total: 0,
            currentShowList: [],
            dialogFormVisible: false,
            formLabelWidth: "120",
            addArr: "",
            addName:"",
            addLttd:"",
            addLgtd:"",
            multipleSelection: [],
            searchProvTreeListCode: "",
            qyDataList:[],
            loading:false,
            showLeftTree:true,
            addRsvrVisible: false,
            props: {
                value: 'id',
                label: 'label',
                children: 'cities'
            },
            provList: [],
            cityList: [],
            countryList: [],
            provName: '',
            cityName: '',
            countryName: '',
            provNames: '',
            cityNames: '',
            countryNames: '',
            curSelectItem: 0,
            addSiLuanVisisble:false,
            formObj:{
                name:"",
                rvReaLkName:"",
                adCode:"",
                adName:"",
                location:"",
                gdX:"",
                gdY:"",
                pblmType:"",
                pblmDesc:""
            },
            importParam:{}
        }
    },
    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;
            }
            console.log("区域树"+n.length+this.showLeftTree+this.objType);
            this.getTableData_sz();
            this.getAreaList()
        }
    },
    mounted() {
        this.getTableData_sz();
    },
    computed:{
            userId:function(){
                return localStorage.getItem("userid")? localStorage.getItem("userid"): '1098101939614724096'
            },
    },
    methods: {
        importExcel(){
            var _self = this;
            this.$confirm('确认要全部导入？', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                request.post('/supervision/plan/insertAllObj', _self.importParam).then((res) => {
                    if (res.success) {
                        if(res.data.key){
                            _self.$message.success("未搜索到可添加的督察对象");
                        }else{
                            _self.dialogFormVisible = false;
                            _self.$message.success("导入成功");
                            _self.$emit("addSuccess");
                            _self.importParam = {};
                        }
                    }else {
                        _self.$message.error("导入失败");
                    }
                });
            })
        },
        downTemplateExcel(){
            let url = "/pdcApi//excel/import/template/hhsl?objType="+this.objType
            let downloadName = "河湖四乱对象基本信息模板.xls"
            let type = "get"
            exportModel(type, url, downloadName)
        },
        problemType(row,column){
            return row.type == '1'? "乱占":
                row.type == '2'? "乱采":
                row.type == '3'? "乱堆":
                row.type == '4'? "乱建":
                row.type == '5'? "其他": row.type;
        },
        showDialog() {
            this.dialogFormVisible = true;
            if(this.$refs['provTreeListQyRef']){
                this.$refs['provTreeListQyRef'].getQyList();
            }
            this.getTableData_sz();
        },
        saveChange() {
            this.addObjectChange();
        },
        treeDataEmit(item){
            this.qyDataList = item;
            if(this.qyDataList.length == 0){
                this.showLeftTree = false;
            }else{
                this.showLeftTree = true;
            }
        },
        getTableData_sz(){
            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);
            _self.importParam.isBack = _self.isBack
            _self.importParam.isSupn = _self.isSupn;
            _self.importParam.inspGroupId = _self.dczId;
            _self.importParam.objType = _self.objType;
            _self.importParam.nm = _self.searchNameOfSzName
            _self.importParam.adCode = _self.str;
            getSupObjListNotInspGroupId(str,_self.dczId,'',_self.pageSize,_self.pageIndex,_self.objType,_self.searchNameOfSzName,_self.isSupn,_self.isBack).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_sz1(){
            var _self = this;
            _self.importParam.isBack = _self.isBack
            _self.importParam.isSupn = _self.isSupn;
            _self.importParam.inspGroupId = _self.dczId;
            _self.importParam.objType = _self.objType;
            _self.importParam.nm = _self.searchNameOfSzName
            _self.importParam.adCode = _self.searchProvTreeListCode;
            getSupObjListNotInspGroupId(_self.searchProvTreeListCode,_self.dczId,'',_self.pageSize,_self.pageIndex,_self.objType,_self.searchNameOfSzName,_self.isSupn,_self.isBack).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_sz1();
            }else{
                this.getTableData_sz();
            }
        },

        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");
                    }
                });
            } catch (e) {
                alert("暂无数据");
            }
        },
        provTreeSelectChangeHandler: function(params) {
            this.searchProvTreeListCode = params.code;
            this.getTableData_sz1();
        },
        provTreeSelectChangeHandler_qy(params){
            this.searchProvTreeListCode = params.code;
            this.getTableData_sz1();
        },
        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
                    }

                }
            })
        },
        handleItemChange(val){
            this.getAreaList(val)
        },
        provChange(val){
            this.curSelectItem = 1
            this.cityName = ''
            this.countryName = ''
            this.formObj.admDiv = 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.admDiv = 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.admDiv = val
                this.countryList.forEach(ele=>{
                    if(ele.adCode == this.countryName){
                        this.countryNames = ele.adName
                    }
                })
                this.formObj.adName = this.provNames + this.cityNames + this.countryNames
                this.formObj.adCode = val
            }
        },
        closeWindowEvent(){
            this.formObj.adCode = ""
        },
        addNewObj(formName){
            let _this = this
            if(!this.formObj.name){
                this.$message.warning('请输入项目名称')
                return
            }
            if(!this.formObj.rvReaLkName){
                this.$message.warning('请输入河流、河段（湖泊）名称')
                return
            }
            if(!this.formObj.pblmType){
                this.$message.warning('问题类型')
                return
            }
            if(!this.formObj.pblmDesc){
                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
            }
            this.formObj.adCode = this.countryName;
            request.post('/att/jskejian/flkdis/base',this.formObj).then(res=>{
                if(res.success){
                    _this.$message.success('添加成功');
                    this.getTableData_sz();
                    _this.addSiLuanVisisble = false;
                    _this.provName = "";
                    _this.cityName = "";
                    _this.countryName = "";
                    _this.formObj = {};
                }else{
                    _this.$message.error(res.message)
                }
            }).catch(res=>{
                _this.$message.error('请求错误'+ res.message)
            })

        }
    }
};
</script>
<style>
</style>