fj-dc-ui/.svn/pristine/74/74eb0e0fbe5d3ac5b75ea4de2dc53f94bd00f0d6.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>
            </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-select style="width:100px;" 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 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-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="sapName"
                                    label="堤防险工险段名称"
                                    min-width="100"
                            ></el-table-column>
                            <el-table-column
                                    align="center"
                                    show-overflow-tooltip
                                    prop="adName"
                                    label="起点行政区名称"
                                    min-width="100"
                            ></el-table-column>
                            <el-table-column
                                    align="center"
                                    show-overflow-tooltip
                                    prop="dikeGrad"
                                    label="堤防等级"
                                    :formatter="engScalFormatter"
                                    min-width="80"
                            ></el-table-column>
                            <el-table-column
                                    align="center"
                                    show-overflow-tooltip
                                    prop="sapType"
                                    label="险工险段类型"
                                    min-width="100"
                            ></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-dialog title="添加新堤防险工险段" :visible.sync="addRsvrVisible" append-to-body>
                <el-form label-width="120px" :model="formObj" ref="formObj">
                    <el-form-item label="险工险段名称" required>
                        <el-input v-model="formObj.sapName" autocomplete="off" style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="所在堤防" required>
                        <el-input v-model="formObj.diskName" autocomplete="off" style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="堤防等级">
                        <el-select v-model="formObj.dikeGrad" placeholder="请选择" clearable>
                            <el-option v-for="item in difangdengji" :key="item.value" :label="item.label"
                                       :value="item.value"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="险工险段长度(m)">
                        <el-input v-model="formObj.sapLen" placeholder="请输入详细地点" autocomplete="off"
                                  style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="险工险段类型">
                        <el-input type="textarea" rows="6" v-model="formObj.sapType" clearable
                                  placeholder="请输入险工险段类型" style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="起点行政区划" required>
                        <div v-if="showLocSelect">
                            <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>
                            &#x3000;<span v-if="showLocSelect" @click="showLocSelect = false"
                                          style="color: #009fff;font-size:12px;cursor:pointer">取消</span>
                        </div>
                        <div v-else>
                            <el-input v-model="formObj.adName" readonly autocomplete="off"
                                      style="width:70%;"></el-input>&#x3000;<span @click="showLocSelect = true"
                                                                                  style="color: #009fff;font-size:12px;cursor:pointer">选择</span>
                        </div>
                    </el-form-item>
                    <el-form-item label="起所在地">
                        <el-input v-model="formObj.startLoc" autocomplete="off" style="width:70%;"></el-input>
                    </el-form-item>
                    <el-form-item label="终所在地">
                        <el-input v-model="formObj.endLoc" 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="addNewRsvr('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" @click="saveChange">确 定</el-button>
        </div>
    </el-dialog>
</template>
<script>
    import request from '@util/gw_ajax_request.js';
    import provTreeList from "@widget/provTreeList.vue";
    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)
            },
        },
        props: ["dczId", "dczName", "plnaId", "objType","adCodes","isNewPlan","isNew"],
        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: {
                    adCode: "",//起点行政区编码 ,
                    adName: "",//起点行政区名称 ,
                    basCode: "",//所属流域机构 ,
                    centerX: "",//起点经度 ,
                    centerY: "",//
                    chkState: "",//信息审核状态 ,
                    coast: "",//所在海岸 ,
                    compUnitAttn: "",//主管单位联系人 ,
                    compUnitAttnTel: "",//主管单位联系人电话 ,
                    dikeGrad: "",//堤防等级 ,
                    diskName: "",//所在堤防 ,
                    endLoc: "",//终点所在地 ,
                    gdX: "",//起点高德经度 ,
                    gdY: "",//起点高德纬度 ,
                    gvmtFldWho: "",//政府防汛责任人 ,
                    gvmtFldWhoTel: "",//政府防汛责任人电话 ,
                    lake: "",//所在湖泊 ,
                    mampu: "",//管理单位 ,
                    mampuAttn: "",//管理单位联系人 ,
                    mampuAttnTel: "",//管理单位联系人电话 ,
                    persId: "",//创建人 ,
                    riverBank: "",//所在河岸 ,
                    sapLen: "",//险工险段长度(m) ,
                    sapName: "",//险工险段名称 ,
                    sapType: "",//险工险段类型 ,
                    startLoc: "",//起点所在地 ,
                },
                difangdengji: [
                    {
                        value: "1",
                        label: "1级"
                    },
                    {
                        value: "2",
                        label: "2级"
                    },
                    {
                        value: "3",
                        label: "3级"
                    },
                    {
                        value: "4",
                        label: "4级"
                    },
                    {
                        value: "5",
                        label: "5级"
                    },
                    {
                        value: "6",
                        label: "5级以下"
                    }
                ],
                props: {
                    value: 'id',
                    label: 'label',
                    children: 'cities'
                },
                provList: [],
                cityList: [],
                countryList: [],
                showLocSelect: false,
                provName: '',
                cityName: '',
                countryName: '',
                provNames: '',
                cityNames: '',
                countryNames: '',
            }
        },
        watch: {
            dczId: function (n, o) {
                this.searchProvTreeListCode = "";
            },
            objType: function (n, o) {
                this.searchProvTreeListCode = "";
                this.objType = n;
            },
            qyDataList(n,o){
                if(this.qyDataList.length == 0){
                    this.showLeftTree = false;
                }else{
                    this.showLeftTree = true;
                }
                this.getAreaList()
            },
            searchProvTreeListCode(val){
                if(val){
                    this.getTableData_sz()
                }
            }
        },
        mounted() {
            this.getTableData_sz();
            this.getAreaList()

        },
        computed: {
            userId: function () {
                return localStorage.getItem("userid") ? localStorage.getItem("userid") : '1098101939614724096'
            },
        },
        methods: {
            engScalFormatter(row, column) {
                return row.dikeGrad == '1' ? "1级" :
                    row.dikeGrad == '2' ? "2级" :
                        row.dikeGrad == '3' ? "3级" :
                            row.dikeGrad == '4' ? "4级" :
                                row.dikeGrad == '5' ? "5级" :
                                    row.dikeGrad == '6' ? "5级以下" :'';
            },
            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_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);
                getSupObjListNotInspGroupId(str, _self.dczId, '', _self.pageSize, _self.pageIndex, '29', _self.searchNameOfSzName, _self.engScal).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;

                getSupObjListNotInspGroupId(_self.searchProvTreeListCode, _self.dczId, '', _self.pageSize, _self.pageIndex, '29', _self.searchNameOfSzName, _self.engScal).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();
                }
            },
            toAddNewRsvr() {
                for(var obj in this.formObj){
                    this.formObj[obj] = '';
                }
                this.addRsvrVisible = true;
            },
            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
                        }

                    }
                })
            },
            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
                }
            },
            addNewRsvr(formName) {
                let _this = this
                if (!this.formObj.sapName) {
                    this.$message.warning('请输入堤防险工险段名称')
                    return
                }
                if (!this.formObj.diskName) {
                    this.$message.warning('请输入所在堤防')
                    return
                }
                if (!this.formObj.adName) {
                    this.$message.warning('请输入起点行政区划')
                    return
                }
                this.formObj.adCode = this.searchProvTreeListCode;
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        request.post('/att/waga/sap/base', this.formObj).then(res => {
                            if (res.success) {
                                _this.$message.success('添加成功')
                                this.getTableData_sz1();
                                _this.addRsvrVisible = false;
                            } else {
                                _this.$message.error(res.message)
                            }
                        }).catch(res => {
                            _this.$message.error('请求错误' + res.message)
                        })
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            addObjectChange: function () {
                //提交当前选中对象
                var _self = this;
                var names = [];
                if (_self.addOnce) {
                    _self.addOnce = false;
                    return;
                }
                _self.addOnce = true
                var objArr = [];
                var objIds = [];
                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].sapName;
                    obj['ptype'] = '29';
                    objArr.push(obj);
                    objIds.push(_self.multipleSelection[i].id);
                    names.push(_self.multipleSelection[i].sapName);
                }
                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) {
                            if(this.isNew){
                                _self.addOnce = false;
                                _self.$message.success("添加成功");
                                _self.$emit('addSuccess',{listArr:objArr,listIds:objIds});
                                _self.dialogFormVisible = false;
                            }else {
                                _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();

            },


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