fj-dc-ui/.svn/pristine/a2/a270bdd44d5716b52cdfce553a36f65baa76994e.svn-base

<template>
    <div class="nygs">
        <el-container style="height:520px;">
            <el-aside width="300px" style="border:1px solid #d5d5ff">
                <p class="aside_title">
                    <el-button type="text" @click="addVillage" v-if="openType">添加行政村</el-button>
                </p>
                <el-tree :data="treeData" :props="defaultPropsXzc" @node-click="handleNodeClickXzc"
                         node-key="id"
                         default-expand-all
                         :expand-on-click-node="false">
                    <span class="custom-tree-node" slot-scope="{ node, data }">
                        <span>{{ node.label }}</span>
                        <span class="mr10">
                            <i class="el-icon-delete" v-if="openType" @click.stop="removeNode(node, data)"></i>
                        </span>
                    </span>
                </el-tree>
            </el-aside>
            <el-main style="margin-left:5px;padding:0;height: 100%;overflow: hidden;">
                <el-card class="box-card">
                    <div slot="header" class="clearfix">
                        <span>用水户</span>
                        <el-button style="float: right; padding: 3px 0;" type="text" @click="addYsh" v-if="openType">
                            添加
                        </el-button>
                    </div>
                    <ul class="ul_height">
                        <li v-for="(item,index) in yshList" :key="index" class="text item lh40">
                            <p @click="yshRow(item)">
                                {{ item.usrNm }}
                                <span class="flr"><i class="el-icon-delete" v-if="openType"
                                                     @click.stop="yshDelete(item)"></i></span>
                            </p>
                        </li>
                    </ul>
                </el-card>
            </el-main>
        </el-container>
        <!--添加行政村-->
        <el-dialog
            class="outerDialog custom_dialog"
            title="添加行政村"
            width="40%"
            :visible.sync="villageVisible"
            :modal-append-to-body="true"
            :append-to-body="true">
            <el-container style="height:520px;">
                <el-aside width="300px" style="border:1px solid #d5d5ff">
                    <p class="aside_title village_title">{{rowData.adName}}</p>
                    <el-tree :data="villageTreeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
                </el-aside>
                <el-main style="border:1px solid #d5d5ff;margin-left:5px;padding:0px;">
                    <el-table
                        ref="multipleTable"
                        :data="villageTableData"
                        tooltip-effect="dark"
                        max-height="510"
                        style="width: 100%"
                        @selection-change="handleSelectionChange">
                        <el-table-column
                            type="selection"
                            width="55">
                        </el-table-column>
                        <el-table-column
                            prop="adName"
                            label="行政村名称"
                            min-width="120"
                            show-overflow-tooltip>
                        </el-table-column>
                        <el-table-column
                            prop="isPoveryt"
                            label="是否贫困村"
                            min-width="120">
                            <template slot-scope="scope">
                                <span>{{ scope.row.isPoveryt == '1' ? "是" : "否"}}</span>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-main>
            </el-container>
            <span slot="footer">
                <el-button style="margin-top:5px;" @click="villageSave">确定</el-button>
            </span>
        </el-dialog>
        <!--用水户-->
        <el-dialog
            class="outerDialog custom_dialog"
            title="添加用水户"
            width="40%"
            :visible.sync="wateruserVisible"
            :close-on-click-modal="false"
            :modal-append-to-body="true"
            :append-to-body="true">
            <el-form :model="wateruserForm" ref="wateruserForm" label-width="200px">
                <el-form-item label="户主姓名" required>
                    <el-input type="text" v-model="wateruserForm.userNm" clearable placeholder="请输入户主姓名"
                              style="width:60%;"></el-input>
                </el-form-item>
                <el-form-item label="联系方式">
                    <el-input type="text" v-model="wateruserForm.telphone" clearable placeholder="请输入联系方式"
                              style="width:60%;"></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer">
                <el-button style="margin-top:5px;" @click="waterUserSave">确定</el-button>
            </span>
        </el-dialog>
        <waterUser v-if="waterUserTianBaoVisible" :yshRowData="yshRowData" :rowData="rowData" :openType="openType"
                   @closeDialog="closeDialog"
                   @addShuiKuSuccess="addShuiKuSuccess" :currentObjectId="currentObjectId"
                   :oriFatherName="oriFatherName"
                   :villageNm="villageNm"
                   :currentObjectRgstrId="currentObjectRgstrId"></waterUser>
    </div>
</template>

<script>
    import inputWith from "@widget/inuptWith.vue"
    import request from "@util/gw_ajax_request.js"
    import waterUser from "./waterUser2021"
    
    export default {
        components: {
            inputWith: inputWith,
            // problemDialog
            waterUser: waterUser,//用水户填报
        },
        props: ['currentObjectId', 'currentObjectName', 'currentObjectRgstrId', 'rowData', 'openType'],
        
        data() {
            var checkTel = (rule, value, callback) => {
                if (value == '') {
                    callback();
                }
                if (isNaN(value)) {
                    callback(new Error('请输入合理电话'));
                }
                var isPhone = /^([0-9]{3,4}-)?[0-9]{7,8}$/; //座机
                var isMob = /^[1][3,4,5,7,8][0-9]{9}$/; // 座机格式
                if (!isMob.test(value) && !isPhone.test(value)) {
                    callback(new Error('请输入合理电话'));
                } else {
                    callback();
                }
            };
            return {
                yshList: [],
                gsdwList: [],
                wateruserVisible: false,
                villageVisible: false,
                waterUserTianBaoVisible: false,
                countryProTianBaoVisible: false,
                gsgcVisible: false,
                waterUserDialog: false,
                villageTableData: [],
                multipleSelection: [],
                wateruserForm: {
                    userNm: "",
                    userTel: "",
                },
                treeData: [],
                villageTreeData: [],
                defaultPropsXzc: {
                    children: 'dcuserRelVilles',
                    label: 'townName'
                },
                defaultProps: {
                    // children: 'children',
                    label: 'adName'
                },
                adCodes: "",
                townName: "",
                villageNm: "",
                adCode: "",
                yshRowData: null,
                gsgcRowData: null,
                rules: {
                    telphone: [{
                        validator: checkTel,
                        trigger: 'change',
                    }],
                },
                oriFatherName: "",
                villageAdCode: ""
            }
        },
        computed: {
            recPersId() {
                return localStorage.getItem("userid") ? localStorage.getItem("userid") : ''
            }
        },
        created() {
        
        },
        mounted() {
            this.getLeftTreeData();
        },
        watch: {
            // currentObjectRgstrId(n, o) {
            //     this.getRgstridObj();
            // },
        },
        methods: {
            //添加行政村
            addVillage() {
                this.villageVisible = true;
                this.getVillageTreeList();
            },
            getVillageTreeList() {
                request.get(`/bis/insp/vill2021/findCheckTree/${this.rowData.adCode}/${this.rowData.rgstrId}`)
                    .then(res => {
                        if (res.success && res.data) {
                            this.$nextTick(() => {
                                if (res.data.length) {
                                    this.villageTreeData = res.data;
                                    let length = this.villageTreeData - 1;
                                    this.villageTableData = res.data[length].attCountryDtoList;
                                    this.townName = res.data[length].adName;
                                }
                                
                            })
                        }
                    })
            },
            //villageSave添加行政村确定
            villageSave() {
                if (!this.multipleSelection.length) {
                    this.$message.warning("请至少选择一个行政村");
                    return;
                }
                let obj = [{
                    "codes": this.adCodes,
                    "regstrId": this.rowData.rgstrId,
                    "townName": this.townName
                }]
                
                request.post(`/bis/insp/vill2021/vill/addbatch`, obj)
                    .then(res => {
                        if (res.success) {
                            this.$message.success("添加行政村成功");
                            this.getLeftTreeData();
                            this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
                            this.villageVisible = false;
                        } else {
                            this.$message.warning(res.message);
                        }
                    })
                
            },
            handleSelectionChange(val) {
                this.adCodes = "";
                this.multipleSelection = val;
                this.multipleSelection.map(i => {
                    return this.adCodes += i.adCode + ";";
                });
                this.adCodes = this.adCodes.substr(0, this.adCodes.length - 1);
            },
            //左侧树数据
            getLeftTreeData() {
                request.get(`/bis/insp/vill2021/findTree/${this.rowData.adCode}/${this.rowData.rgstrId}`)
                    .then(res => {
                        if (res.success && res.data) {
                            this.treeData = res.data;
                            this.treeData.forEach(i => {
                                if (i["dcuserRelVilles"]) {
                                    i["dcuserRelVilles"].forEach(j => {
                                        j.townName = j.villageNm;
                                        j.adCode = j.villCode;
                                    })
                                }
                            })
                            this.adCode = this.treeData[0].dcuserRelVilles[0].id || "";
                            this.villageAdCode = this.treeData[0].dcuserRelVilles[0].villCode || "";
                            this.villageNm = this.treeData[0].dcuserRelVilles[0].villageNm || "";
                            this.oriFatherName = this.treeData[0].townName || "";
                            this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
                        }
                    })
            },
            //获取用水户、供水单位列表
            getYsGsdwList(code, rgstrId) {
                request.get(`/bis/insp/vill2021/findNode/${code}/${rgstrId}`)
                    .then(res => {
                        if (res.success) {
                            this.$nextTick(() => {
                                this.gsdwList = res.data.fee;
                                this.yshList = res.data.poor;
                            })
                            
                        }
                    })
            },
            //用水户添加
            addYsh() {
                if (this.adCode) {
                    for (var obj in this.wateruserForm) {
                        this.wateruserForm[obj] = '';
                    }
                    this.wateruserVisible = true;
                } else {
                    this.$message.warning("请选择左侧行政村");
                }
            },
            //添加用水户保存
            waterUserSave() {
                if (!this.wateruserForm.userNm) {
                    this.$message.warning("请填写用水户户主姓名");
                    return;
                }
                let obj = {
                    villageNm: this.villageNm,
                    villId: this.adCode,
                    usrNm: this.wateruserForm.userNm,
                    usrTel: this.wateruserForm.telphone,
                    regstrId: this.rowData.rgstrId,
                }
                request.post(`/bis/insp/vill2021/usr`, obj)
                    .then(res => {
                        if (res.success) {
                            this.$message.success("添加用水户成功");
                            this.wateruserVisible = false;
                            this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
                        }
                    })
            },
            //用水户row
            yshRow(row) {
                this.yshRowData = row;
                this.waterUserTianBaoVisible = true;
            },
            //用水户删除
            yshDelete(row) {
                this.$confirm('确定要删除该数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    request.post(`/bis/insp/vill2021/usr/delete/${row.id}`)
                        .then(res => {
                            if (res.success) {
                                this.$message.success("删除成功");
                                this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
                            } else {
                                this.$message.warning(res.message);
                            }
                        })
                        .catch(err => {
                            console.log(err);
                        })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            //供水单位添加
            addGsdw() {
                if (this.adCode) {
                    this.gsgcVisible = true;
                } else {
                    this.$message.warning("请选择左侧行政村");
                }
                
            },
            //供水单位row
            // gsdwRow(row) {
            //
            //   this.gsgcRowData = row;
            //   this.countryProTianBaoVisible = true;
            // },
            // //供水单位删除
            // gsdwDelete(row) {
            //   this.$confirm('确定要删除该数据, 是否继续?', '提示', {
            //     confirmButtonText: '确定',
            //     cancelButtonText: '取消',
            //     type: 'warning'
            //   }).then(() => {
            //     request.post(`/bis/insp/vill2021/fee/delete/${row.id}`)
            //       .then(res => {
            //         if (res.success) {
            //           this.$message.success("删除成功");
            //           this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
            //         } else {
            //           this.$message.warning(res.message);
            //         }
            //       })
            //       .catch(err => {
            //         console.log(err);
            //       })
            //   }).catch(() => {
            //     this.$message({
            //       type: 'info',
            //       message: '已取消删除'
            //     });
            //   });
            // },
            handleNodeClick(data) {
                this.$nextTick(() => {
                    this.townName = data.adName;
                    this.villageTableData = data.attCountryDtoList;
                })
                
            },
            handleNodeClickXzc(node, data) {
                this.$nextTick(() => {
                    if (node.id && node.villageNm) {
                        this.oriFatherName = data.parent.data.townName;
                        this.adCode = node.id;
                        this.villageNm = node.villageNm;
                        this.getYsGsdwList(node.id, node.rgstrId);
                        this.villageAdCode = node.adCode;
                    }
                    
                })
                
            },
            closeDialog() {
                this.waterUserTianBaoVisible = false;
            },
            // closeGsGcDialog(val) {
            //   this.countryProTianBaoVisible = false;
            //   if (val === "success") {
            //     this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
            //   }
            // },
            addShuiKuSuccess() {
                this.waterUserTianBaoVisible = false;
            },
            //    删除左侧树行政村
            removeNode(node, data) {
                if (data.id) {
                    this.$confirm('确定清空督查数据并将该村从督查任务中删除, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        request.post(`/bis/insp/vill2021/vill/delete/${data.id}`)
                            .then(res => {
                                if (res.success) {
                                    this.$message.success("删除成功");
                                    this.getLeftTreeData();
                                } else {
                                    this.$message.warning(res.message);
                                }
                            })
                            .catch(err => {
                                console.log(err);
                            })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消删除'
                        });
                    });
                }
            },
            // DuiXiangAddSuccessHandler: function () {
            //   this.gsgcVisible = false;
            //   this.getYsGsdwList(this.adCode, this.rowData.rgstrId);
            // },
            // closeDuChaDuiXiangDialog() {
            //   this.gsgcVisible = false;
            // }
            
        }
        
    }

</script>

<style lang="scss">
    /*.nygs{*/
    .aside_title {
        padding-right: 10px;
        height: 30px;
        line-height: 30px;
        text-align: end;
        border-bottom: 1px solid rgb(235, 238, 245);
        background-color: #d5d5ff;
    }
    
    .village_title {
        text-align: center;
    }
    
    .ul_height {
        height: 100%;
        overflow: auto;
    }
    
    .box-card {
        height: 100%;
        overflow: auto;
    }
    
    /*.mt20{*/
    /*margin-top: 20px;*/
    /*}*/
    .lh40 {
        list-style: none;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
        padding: 0 20px;
        border-bottom: 1px solid rgb(235, 238, 245);
    }
    
    .flr {
        float: right;
        margin-right: 20px;
    }
    
    .nygs .el-card__body {
        height: calc(100% - 56px);
        padding: 0;
        overflow: auto;
    }
    
    .nygs span.custom-tree-node {
        width: 100%;
    }
    
    .mr10 {
        margin-right: 20px;
        float: right;
    }
    
    .nygs .el-tree-node__content {
        height: 40px;
        line-height: 40px;
    }
    
    .nygs .el-tree > div > div:first-child .mr10 {
        display: none;
    }
    
    .nygs .el-tree-node.is-current > .el-tree-node__content {
        background-color: gainsboro !important;
    }
    
    /*}*/

</style>