fj-dc-ui/.svn/pristine/9f/9f594f96d10a081d8304ac2edbc7dbc8061ff63e.svn-base

<template>
    <!-- 弹出窗 -->
    <el-dialog title="添加督查对象" width="60%" @close="closeDuChaDuiXiangDialog" :visible.sync="dialogFormVisible"
               :close-on-click-modal="false"
               :modal-append-to-body="true"
               :append-to-body="true">
        <el-container>
            <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="searchNameOfRsName"
                                    clearable
                                    placeholder="请输入供水工程名称"
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="工程类型">
                                <el-select style="width:200px;" v-model="engScal" clearable placeholder="请选择">
                                    <el-option label="万人工程" value="1"></el-option>
                                    <el-option label="千人工程" value="2"></el-option>
                                    <el-option label="千人以下集中供水工程" value="3"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="refreshCurrentShow">查询</el-button>
                            </el-form-item>
                            <el-form-item>
                                <el-button type="primary" @click="toAddNewRsvr">添加新供水工程</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="cwsName"
                                label="供水工程名称"
                                min-width="100"
                            ></el-table-column>
                            <el-table-column
                                align="center"
                                show-overflow-tooltip
                                prop="cwsLoc"
                                label="所在地点"
                                min-width="100"
                            ></el-table-column>
                            <el-table-column
                                align="center"
                                show-overflow-tooltip
                                prop="engType"
                                label="工程类型"
                                :formatter="engScalFormatter"
                                min-width="80"
                            ></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>
        <div slot="footer" class="dialog-footer">
            <el-button @click="closeDuChaDuiXiangDialog">取 消</el-button>
            <el-button type="primary" @click="saveChange">确 定</el-button>
        </div>
        
        <el-dialog title="添加新供水工程" :visible.sync="addRsvrVisible" append-to-body width="40%" >
            <el-form label-width="200px" :model="formObj" :rules="rules" ref="formObj">
                <el-form-item label="工程名称" prop="rsName">
                    <el-input v-model="formObj.rsName" clearable autocomplete="off" style="width:60%;"></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="所在地点" prop="location">
                    <el-input v-model="formObj.location" clearable autocomplete="off" style="width:60%;"></el-input>
                </el-form-item>
                <el-form-item label="工程类型" prop="engType">
                    <el-select v-model="formObj.engType" clearable placeholder="请选择" autocomplete="off" style="width:60%;">
                        <el-option label="万人工程" value="1"></el-option>
                        <el-option label="千人工程" value="2"></el-option>
                        <el-option label="千人以下集中供水工程" value="3"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="addRsvrVisible = false">取 消</el-button>
                <el-button type="primary" @click="addNewRsvr('formObj')">确 定</el-button>
            </div>
        </el-dialog>
    </el-dialog>
</template>
<script>
    import request from '@util/gw_ajax_request'
    import provTreeList from "@widget/provTreeList.vue";
    import {
        getObjListNotInspGroupId,
        addDcAndObjRel
    } from "@api/duChaDuiXiang_xsk_API.js";
    
    export default {
        components: {
            provTreeList: provTreeList,
            provTreeListQy: resolve => {
                require(['@widget/provTreeList_quyu.vue'], resolve)
            },
        },
        props: ["dczId", "dczName", "plnaId", "objType", "rowData","villageAdCode"],
        data() {
            return {
                addOnce: false,
                objTypeName: '小水库',
                xsk: true,
                ncys: false,
                shgc: false,
                dxs: false,
                searchNameOfRsName: "",
                searchNameOfAdName: "",
                searchNameOfwtdstNm: "",
                addLevel: "",
                rsAdmDep: "",
                engScal: "",
                wtdstState: "",
                engLevel: "",
                wtdstType: "",
                stnm: '',
                pageIndex: 1,
                pageSize: 10,
                total: 0,
                currentShowList: [],
                dialogFormVisible: true,
                formLabelWidth: "120",
                addArr: "",
                addName: "",
                addLttd: "",
                addLgtd: "",
                multipleSelection: [],
                searchProvTreeListCode: "",
                qyDataList: [],
                loading: false,
                showLeftTree: true,
                addRsvrVisible: false,
                formObj: {
                    "rsName": "",
                    "rsAdmName": "",
                    "rsLoc": "",
                    "location": "",
                    "engType": ""
                },
                areasList: [],
                props: {
                    value: 'id',
                    label: 'label',
                    children: 'cities'
                },
                rules: {
                    rsName: [
                        {required: true, message: '请输入工程名称', trigger: 'blur'},
                    ],
                    location: [
                        {required: true, message: '请输入所在地点', trigger: 'blur'}
                    ],
                    engType: [
                        {required: true, message: '请选择工程类型', trigger: 'blur'}
                    ]
                },
                provList: [],
                cityList: [],
                countryList: [],
                provName: '',
                cityName: '',
                countryName: '',
                provNames: '',
                cityNames: '',
                countryNames: '',
                curSelectItem: 0
            }
        },
        watch: {
            dczId: function (n, o) {
                this.searchProvTreeListCode = "";
            },
            qyDataList(n, o) {
                if (this.qyDataList.length == 0) {
                    this.showLeftTree = false;
                } else {
                    this.showLeftTree = true;
                }
                console.log("区域树" + n.length + this.showLeftTree + this.objType);
                if (this.objType == '1') {
                    this.getTableData_sk();
                    this.getAreaList()
                } else if (this.objType == '5') {
                    this.getTableData_dxs();
                }
            }
        },
        mounted() {
            this.getTableData_sk();
        },
        computed: {
            userId: function () {
                return localStorage.getItem("userid") ? localStorage.getItem("userid") : '1098101939614724096'
            },
        },
        methods: {
            changeCurrentObjSelectName(item) {
                this.objType = item;
            },
            selectChange(val) {
                console.log(val);
                this.objType = val;
            },
            engScalFormatter: function (row, column) {
                return  row.engType == 1 ? "万人工程" :
                    row.engType == 2 ? "千人工程" :
                        row.engType == 3 ? "千人以下集中供水工程" : ""
            },
            wtdstStateFormatter: function (row, column) {
                return row.wtdstState == 1 ? "已修复" : "未修复";
            },
            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
                                            ? "环保部门"
                                            : "其他部门";
            },
            adGradFormatter: function (row, column) {
                return row.adGrad == 1
                    ? "国家级"
                    : row.adGrad == 2
                        ? "省级"
                        : row.adGrad == 3
                            ? "地市级"
                            : row.adGrad == 4
                                ? "县级"
                                : row.adGrad == 5
                                    ? "乡级"
                                    : row.adGrad == 6
                                        ? "村"
                                        : "村组";
            },
            adNameFormatter: function (row, column) {
                return row.adName;
            },
            adFullNameFormatter: function (row, column) {
                return row.adFullName;
            },
            adCodeFormatter: function (row, column) {
                return row.adCode;
            },
            saveChange() {
                this.addObjectChange();
            },
            treeDataEmit(item) {
                this.qyDataList = item;
                if (this.qyDataList.length == 0) {
                    this.showLeftTree = false;
                } else {
                    this.showLeftTree = true;
                }
            },
            getTableData_sk() {
                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);
                // var obj = {
                // 		"adcd": str,
                // 		"rsName": _self.searchNameOfRsName,
                // 		"engScal": _self.engScal,
                // 		"id": _self.userId,
                // 		"groupId":_self.dczId,
                // 		"pageNum":_self.pageIndex,
                // 		"pageSize":_self.pageSize
                // 	}
                let obj = {
                    "adCode": _self.rowData.adCode,
                    "engType": _self.engScal,
                    "name": _self.searchNameOfRsName,
                    "pageNum": _self.pageIndex,
                    "pageSize": _self.pageSize,
                    "regstrId": _self.rowData.rgstrId
                }
                request.post('/bis/insp/vill2021/cws/pageNotDC', obj).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 () {
                this.getTableData_sk();
                
            },
            
            addObjectChange: function () {
                const length = this.multipleSelection.length;
                for (let i = 0; i < length; i++) {
                    this.addArr += this.multipleSelection[i].cwsCode + ";";
                }
                this.addArr = this.addArr.substr(0, this.addArr.length - 1);
                try {
                    let obj = {
                        "adCode": this.villageAdCode,
                        "cwsIds": this.addArr,
                        "regstrId": this.rowData.rgstrId
                    }
                    
                    request.post(`/bis/insp/vill2021/cws/addBatch`,obj)
                        .then(res =>{
                            if(res.success){
                                this.dialogFormVisible = false;
                                this.$message.success("添加成功");
                                this.$emit("addSuccess");
                                _self.addArr = "";
                            }else{
                                this.$message.warning(res.message);
                            }
                        })
                } catch (e) {
                    alert("暂无数据");
                }
            },
            toAddNewRsvr() {
                this.cityList = [];
                this.countryList = [];
                this.provList = [];
                this.provName = "";
                this.cityName = "";
                this.countryName = "";
                for (var obj in this.formObj) {
                    this.formObj[obj] = '';
                }
                this.addRsvrVisible = true;
                this.curSelectItem = null;
                // this.getAreaList();
            },
            addNewRsvr(formName) {
                let obj = {
                    "addvcd": this.rowData.adCode,
                    "cwsName":  this.formObj.rsName,
                    "cwsLoc": this.formObj.location,
                    "engType": this.formObj.engType,
                }
                
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        request.post('/dc/att/cwsBase/insert', obj).then(res => {
                            if (res.success) {
                                this.$message.success('添加成功')
                                this.getTableData_sk();
                                this.addRsvrVisible = false
                            } else {
                                _this.$message.error(res.message)
                            }
                        }).catch(res => {
                            this.$message.error(res.message)
                        })
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            getAreaList(val) {
                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.location = 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.location = 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.location = this.provNames + this.cityNames + this.countryNames
                }
            },
            
            
            closeDuChaDuiXiangDialog() {
                this.dialogFormVisible = false;
                this.$emit("closeDuChaDuiXiangDialog");
            }
        }
    };
</script>
<style>
</style>