fj-dc-ui/.svn/pristine/21/2198f1f6182af92af7d8d688aab91c4fed13bd06.svn-base

<template>
	<!-- 弹出窗 -->
	<el-dialog title="添加督查对象" :visible.sync="dialogFormVisible" width="80%" @close="closeFatherDialogEvent">
		<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"
					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 :inline="true" :model="formInline" class="demo-form-inline">
                    <el-form-item label="水源地名称">
                        <el-input v-model="formInline.name" placeholder="水源地名称" clearable ></el-input>
                    </el-form-item>
                    <!-- <el-form-item label="检查分类">
                        <el-select v-model="formInline.type" clearable placeholder="检查分类">
                            <el-option v-for="item in jianchaLists" :key="item.value" :label="item.name" :value="item.value"></el-option>
                        </el-select>
                    </el-form-item> -->
                    <el-form-item>
                        <el-button type="primary" @click="onSubmit">查询</el-button>
                        <!-- <el-button type="primary" @click="toAddNewTdfj">添加新项目</el-button> -->
                    </el-form-item>
                </el-form>

                <el-table
                    border
                    :height="tableHeight"
                    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="name"
                        label="地表水源地名称"
                        min-width="100"
                    ></el-table-column>
                    <!-- <el-table-column
                        align="center"
                        show-overflow-tooltip
                        prop="sdType"
                        label="淤地坝工程类型"
                        min-width="100"
                    ></el-table-column> -->

                    <el-table-column
                        align="center"
                        show-overflow-tooltip
                        prop="stlc"
                        label="地表水源地所在位置"
                        min-width="130"
                    ></el-table-column>

                </el-table>
                <el-pagination
                    small
                    @current-change="handleCurrentChange"
                    :pager-count="5"
                    :current-page.sync="pageNum"
                    :page-size="pageSize"
                    layout="total, prev, pager, next"
                    :total="total"
                ></el-pagination>
			</el-main>
		</el-container>
        <el-dialog title="添加新项目" :visible.sync="addTdfjVisible" append-to-body width="60%" @close="closeAddNewObj">
            <el-row>
                <el-button style="float: right;" type="primary" @click="addReadyHave">添加已有项目</el-button>
            </el-row>
			<el-form label-width="120px" :model="formObj"  ref="formObj" :inline="true" >
                <el-form-item label="检查分类" required >
                    <el-select v-model="formObj.type"  placeholder="请选择" @change="changeOtherTableData">
							<el-option v-for="item in jianchaLists" :key="item.value" :label="item.name" :value="item.value"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="项目名称" required >
					<el-input v-model="formObj.name" autocomplete="off" ></el-input>
				</el-form-item>
				<el-form-item label="项目编号" required >
					<el-input v-model="formObj.code" autocomplete="off" ></el-input>
				</el-form-item>
                <el-form-item label="所属流域机构" prop="reverOrg">
                    <el-select v-model="formObj.admOrg" placeholder="所属流域机构"  style="width: 178px;">
                        <el-option v-for="item in lyjg" :key="item.id" :label="item.pnm" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="行政区名称">
                    <addvSearch
                        style="width: 178px;margin-left:10px;margin-right:15px"
                        v-model="formObj.adCode"
                        :maxHeight='300'
                        :maxWidth='250'
                        :rootAddCode='curAdcode_long'
                        :level='"3"'
                        :nameOrCode="'code'"
                        @addvTreeNodeClick="addvTreeNodeClickEvent"
                    ></addvSearch>
                </el-form-item>
				<el-form-item label="工程详细位置">
					<el-input v-model="formObj.location" autocomplete="off" ></el-input>
				</el-form-item>
				<el-form-item label="经度">
						<el-input v-model="formObj.centerX" autocomplete="off" ></el-input>
				</el-form-item>
				<el-form-item label="纬度">
						<el-input v-model="formObj.centerY" autocomplete="off" ></el-input>
				</el-form-item>
			</el-form>

            <el-row v-if="addOtherTableData" style="border-top:1px solid #dcdcdc;">
                <el-form  label-width="120px" :model="formObj"  ref="formObj" :inline="true" style="margin-top: 10px;">
                    <el-form-item label="项目名称">
                        <el-input v-model="formObjOther.name" autocomplete="off" ></el-input>
                    </el-form-item>
                    <el-button type="primary" @click="onSubmitOther">查询</el-button>
                </el-form>
            </el-row>
            <el-table
                    v-if="otherTable"
                    border
                    v-loading="loadingOther"
                    :data="otherDcdxTableDataLists"
                    highlight-current-row
                    @current-change="otherTableRowClickEvent"
                    tooltip-effect="dark"
                    style="width: 100%"
                    >
                    <el-table-column align="center" prop="index" label="序号" min-width="40"></el-table-column>
                    <el-table-column
                        align="center"
                        show-overflow-tooltip
                        prop="name"
                        label="项目名称"
                        min-width="100"
                    ></el-table-column>
                    <el-table-column
                        align="center"
                        show-overflow-tooltip
                        prop="location"
                        label="工程详细位置"
                        min-width="100"
                    ></el-table-column>
                    <el-table-column
                        align="center"
                        show-overflow-tooltip
                        prop="type"
                        label="检查分类"
                        :formatter="formatType"
                        min-width="100"
                    ></el-table-column>
                </el-table>
                <el-pagination
                    style="text-align:center;"
                    v-if="otherTable"
                    small
                    @current-change="handleCurrentChangeOther"
                    :pager-count="5"
                    :current-page.sync="pageNumOther"
                    :page-size="pageSizeOther"
                    layout="total, prev, pager, next"
                    :total="totalOther"
                ></el-pagination>

			<div slot="footer" class="dialog-footer">
				<el-button @click="addTdfjVisibleCancel">取 消</el-button>
				<el-button type="primary" @click="addNewTdfj('formObj')">确 定</el-button>
			</div>
		</el-dialog>
		<div slot="footer" class="dialog-footer">
			<el-button @click="cancel()">取 消</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 addvSearch from "../../widgets/addvSearch.vue"
import {getTdfjList,addDcAndObjRel,getOtherTableData} from "../../api/duChaDuiXiang_tdfj_API.js";
import { getLyjglistSz } from "../../api/duChaTianBao.js";
import {curAdcode_short,curAdcode_long} from '@util/global_variable.js'
export default {
	components: {
        provTreeList: provTreeList,
        addvSearch,
        provTreeListQy:resolve => {require(['../../widgets/provTreeList_quyu.vue'],resolve)},
	},
	props: ["dczId", "dczName", "plnaId", "objType"],
	data() {
		return {
            qyDataList:[],
            addOtherTableData:false,
            // currentOtherTableRow:{},
            otherDcdxTableDataLists:[],
            pageNumOther:1,
            pageSizeOther:10,
            totalOther:0,
            otherTable:false,
            addOnce:false,
            addArr: "",
			addName:"",
			addLttd:"",
			addLgtd:"",
            lyjg: [],//流域机构
            addTdfjVisible:false,
            loading:true,
            loadingOther:true,
            currentShowList:[],
            multipleSelection: [],
            pageNum:1,
            pageSize:10,
            total:0,
            dialogFormVisible: false,
            showLeftTree:true,
            searchProvTreeListCode: "",
            formInline:{
                name:"",
                type:"",
            },
            formObjOther:{
                name:"",
                type:"",
            },
            formObj:{
                name:"",
                code:"",
                type:"",
                location:"",
                centerX:"",
                centerY:"",
                admOrg:"",
                adCode:"",
            },
            jianchaLists:[
                {
                    name:'水库',
                    value:'1'
                },
                {
                    name:'水闸',
                    value:'2'
                },
                {
                    name:'人饮',
                    value:'3'
                },
                {
                    name:'水利工程建设',
                    value:'4'
                },
                {
                    name:'水利工程运行',
                    value:'5'
                },
            ]
		}
	},
	watch: {
        searchProvTreeListCode(n,o){
            this.searchProvTreeListCode = n;
            this.getTableData();
        },
        dczId(n,o){
            this.dczId = n ;
        },
        qyDataList(n,o){
            if(this.qyDataList.length == 0){
                this.showLeftTree = false;
            }else{
                this.showLeftTree = true;
            }
            this.getTableData();

        }
	},
	mounted() {

	},
	computed:{
        userId:function(){
                return localStorage.getItem("userid")? localStorage.getItem("userid"): '1098101939614724096'
        },
        tableHeight(){
            if(window.innerWidth <= 1366){
                return window.innerHeight - 300;
            }else{
                return window.innerHeight - 510;
            }
        },
        curAdcode_short(){
            return curAdcode_short
        },
        curAdcode_long(){
            return curAdcode_long
        }
	},
	methods: {
        treeDataEmit(item){
            this.qyDataList = item;
            if(this.qyDataList.length == 0){
                this.showLeftTree = false;
            }else{
                this.showLeftTree = true;
            }
        },
        onSubmit(){
            this.getTableData();
        },
        onSubmitOther(){
            this.getOtherTableDataLists();
        },
		showDialog(dczIdSelf,tableCurrentRowType = null,yqList) {
            this.qyDataList = yqList;
            this.dczId = dczIdSelf;
			this.tableCurrentRowType = tableCurrentRowType;
			this.dialogFormVisible = true;
            let _self = this;
            this.getTableData();
            this.getLyjgList();
        },
        //获取流域机构数据
		getLyjgList() {
            var _self = this;
            getLyjglistSz().then(res => {
                _self.lyjg = res.data;
            });
        },
		provTreeSelectChangeHandler: function(params) {
            this.searchProvTreeListCode = params.code;
            this.formObj.adCode = params.code;
        },

        handleCurrentChange(val) {
			console.log(`当前页: ${val}`);
			this.getTableData();
		},
        handleCurrentChangeOther(val) {
			console.log(`当前页: ${val}`);
			this.getOtherTableDataLists();
		},
		handleSelectionChange(val) {
			this.multipleSelection = val;
        },
        getTableData(){
            var _self = this;
            if(_self.qyDataList.length == 0){
                _self.showLeftTree = false;
            }else{
                _self.showLeftTree = true;
            }
            _self.loading = true;
            if(_self.qyDataList.length > 1){
                var str = '';
                for(var i=0;i<_self.qyDataList.length;i++){
                    str+= _self.qyDataList[i].adCode+',';
                }
                str = str.substring(0,str.length-1);
                _self.searchProvTreeListCode = str;
            }else{
                _self.searchProvTreeListCode = _self.searchProvTreeListCode;
            }
            getTdfjList(_self.pageNum,_self.pageSize,5,_self.formInline.name,_self.dczId,_self.searchProvTreeListCode).then((response)=>{
				    _self.loading = false;
					_self.currentShowList = response.data.list;
					_self.currentShowList.forEach((element, index) => {
						element["index"] = _self.pageSize * (_self.pageNum - 1) + index + 1;
					});
					_self.total = response.data.total;
			})
        },
        getOtherTableDataLists(){
            var _self = this;
            let obj = {
                'type':_self.formObj.type,
                'pageNum':_self.pageNumOther,
                'pageSize':_self.pageSizeOther,
                'adCode':_self.formObj.adCode,
                'name':_self.formObjOther.name,
            }
            getOtherTableData(obj).then((response)=>{
				    _self.loadingOther = false;
					_self.otherDcdxTableDataLists = response.data.list;
					_self.otherDcdxTableDataLists.forEach((element, index) => {
						element["index"] = _self.pageSizeOther * (_self.pageNumOther - 1) + index + 1;
					});
					_self.totalOther = response.data.total;
			})
        },
        otherTableRowClickEvent(val) {
            // val = val;
            this.formObj.name = val.name;
            this.formObj.location = val.location;
            this.formObj.centerX = val.centerX;
            this.formObj.centerY = val.centerY;
            this.formObj.admOrg = val.admOrg;
            this.formObj.adCode = val.adCode;
        },
        toAddNewTdfj(){
			this.addTdfjVisible = true
			// this.formObj.engScal = this.gongchengguimo[0].value
			// this.formObj.rsType = this.zhubaleixing[0].value
        },
        addNewTdfj(formName){
            let _this = this
            this.formObj['persId'] = this.userId;
            // if(this.searchProvTreeListCode != ""){
            //     this.formObj.adCode = this.searchProvTreeListCode;
            // }
            request.post('/att/fsc/base',this.formObj).then(res=>{
                if(res.success){
                    _this.$message.success('添加成功')
                    this.addTdfjVisible = false;
                    this.getTableData();
                    _this.addRsvrVisible = false
                    this.putEmptyObj();
                }else{
                    _this.$message.error(res.message)
                }
            }).catch(res=>{
                _this.$message.error('请求错误'+ res.message)
            })
        },
        saveChange() {
			this.addObjectChange();
		},
        addObjectChange: function() {
                    //提交当前选中对象
            var _self = this;
            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].code;
                    obj['name'] = _self.multipleSelection[i].name;
                    obj['ptype'] = '5';
                    objArr.push(obj);
                }

            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("暂无数据");
            }
		},
        formatType(row,column){
                let type = row.type;
                let _type = '水利工程运行';
                switch (type) {
                    case '1' : _type = '水库';break;
                    case '2' : _type = '水闸';break;
                    case '3' : _type = '人饮';break;
                    case '4' : _type = '水利工程建设';break;
                }
                return _type;
        },
        putEmptyObj(){
            this.formObj = {
                "name": '',
                "code": '',
                "type": "",
                "location": "",
                "centerX": '',
                "centerY": "",
                "admOrg": "",
            };
        },
        cancel(){
            this.putEmptyObj();
            this.formObjOther.name="";
            this.formInline.name = "";
            this.searchProvTreeListCode = "";
            this.dialogFormVisible = false;
        },
        addReadyHave(){
            if(this.formObj.type == ""){
                this.$message.warning("请先选择检查分类！");
            }else{
                this.addOtherTableData = true;
                this.otherTable = true;
                this.getOtherTableDataLists();
            }
        },
        changeOtherTableData(){
            this.getOtherTableDataLists();
            this.formObj.name = "";
            this.formObj.location = "";
            this.formObj.centerX = "";
            this.formObj.centerY = "";
            this.formObj.admOrg = "";
        },
        addTdfjVisibleCancel(){
            this.addTdfjVisible = false;
            this.addOtherTableData = false;
            this.otherTable = false;
            this.formObj.type = "";
            this.formObj.name = "";
            this.formObj.location = "";
            this.formObj.centerX = "";
            this.formObj.centerY = "";
            this.formObj.admOrg = "";
            this.formObj.adCode = "";
        },
        closeAddNewObj(){
            this.addOtherTableData = false;
            this.otherTable = false;
            this.formObj.type = "";
            this.formObj.name = "";
            this.formObj.location = "";
            this.formObj.centerX = "";
            this.formObj.centerY = "";
            this.formObj.admOrg = "";
            this.formObj.adCode = "";
        },
        closeFatherDialogEvent(){
            this.putEmptyObj();
            this.formInline.name = "";
            this.searchProvTreeListCode = "";
        },
        addvTreeNodeClickEvent(item){
            this.formObj.adCode = item.id;
            this.getOtherTableDataLists();
        },
        provTreeSelectChangeHandler_qy(params){
            //this.qyDataList.length = 1;
            this.searchProvTreeListCode = params.code;
            this.formObj.adCode = params.code;
            this.getTableData();
        },
	}
};
</script>
<style>
.demo-form-inline{
    padding:10px;
}
</style>