fj-dc-ui/.svn/pristine/a5/a5d68beec8cc8e162923ac9c28d23ec3d3fe38c8.svn-base

<template>
    <el-container>
        <el-aside width="250px" :style="{'height': treeHeight + 'px'}">
            <el-tree
                    :highlight-current="true"
                    class="filter_tree report_tree"
                    :data="treeDataLists"
                    :props="defaultProps"
                    node-key="id"
                    :filter-node-method="filterNode"
                    :expand-on-click-node="false"
                    :default-expand-all="true"
                    @node-click='treeNodeClickHandler'
                    ref="tree2">
                <span class="custom-tree-node" slot-scope="{ node }">
                    <el-tooltip v-if="node.isLeaf" class="item" effect="dark" :content="node.label"
                                placement="top-start">
                        <span>{{ node.label }}</span>
                    </el-tooltip>
                    <span v-else>{{ node.label }}</span>
                </span>
            </el-tree>
        </el-aside>
        <el-main>
            <div class="block" style="'padding':'10px 0'">
                <span class="demonstration" style="margin-right: 5px;margin-left: 7px">报告状态</span>
                <el-select v-model="bgType" placeholder="请选择" @change="search">
                  <el-option :label="item.nowStep" :value="item.nowId" :key="index"
                             v-for="(item,index) in bgTypeList"/>
                </el-select>
<!--                <el-select v-model="bgType" clearable placeholder="请选择">-->
<!--                    <el-option label="专家(交换意见稿)" value="0"></el-option>-->
<!--                    <el-option label="交换意见阶段" value="4"></el-option>-->
<!--                    <el-option label="成果讨论阶段" value="5"></el-option>-->
<!--                    <el-option label="中心修改阶段" value="6"></el-option>-->
<!--                    <el-option label="司局修改阶段" value="7"></el-option>-->
<!--                </el-select>-->
            </div>
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane v-for="(item,index) in tabList" :key="index" :label="item.label" :lazy="true"
                             :name="item.value">
                    <div v-if="showReport" style="width:100%;padding:0px 0px;" :style="{'height' : tableHeight + 'px'}">
                        <p v-if="showLastTab"
                           style="font-weight: bolder;color: #868686;font-size: larger;line-height: 100px;text-align: center">
                            请通过左侧树点击指定工程，查看报表</p>
                        <iframe v-if="!showLastTab && item.value === activeName" id="iframeEle"
                                :src="tableSrc + '&rgstrId=' + rgstrId + '&names=' + name + '&bgType=' + bgType + '&currentRlcode='+currentRlcode+ '&isStage='+(bgType=='0'?'0':'1')+ '&width=1920&height=592'"
                                frameborder="0" width="100%" height="100%" style="overflow: auto"></iframe>
                    </div>
                    <!-- <component :is="'summary'" :tableSrc="tableSrc" :pcid="pcid" :year="year"></component> -->
                </el-tab-pane>
            </el-tabs>
        </el-main>
    </el-container>
</template>
<script>
    import summary from './summary'
    import request from "@util/gw_ajax_request"
    import {reportHosturl} from '@util/global_variable.js'

    export default {
        data() {
            return {
                treeHeight: window.innerHeight - 110,
                tableHeight: window.innerHeight - 180,
                activeName: 'summary',
                showReport: false,
                tabList: [
                    {label: '问题统计表（按专业）', value: 'summary'},
                    {label: '问题统计表（按责任主体）', value: 'membership'},
                    // {label: '2018-2019年度中央及省级水利投资建设项目稽察问题汇总表', value: 'problemSummary'},
                    {label: '稽察发现问题清单', value: 'seriousProblemReport'},
                    {label: '稽察发现问题责任追究统计表', value: 'jcfxwtzrjjtjb'}

                ],
                addForm: {
                    year: '',
                    batch: '',
                    persId: localStorage.getItem("userid")
                },
                yearList: [],
                pcList: [],
                pcid: '',
                year: '',
                treeDataLists: [],
                defaultProps: {
                    children: 'children',
                    label: 'pnm'
                },
                rgstrId: '',
                name: '',
                tableSrc: `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_wttj_zy`,
                currentRlcode: localStorage.getItem('currentRlcode'),
                bgType:'0',
                bgTypeList: [],
            }
        },
        //监听属性 类似于data概念
        computed: {
            persId() {
                return localStorage.getItem("userid")
                    ? localStorage.getItem("userid")
                    : "1098101939614724096";
            },
            showLastTab() {
                return this.activeName == 'seriousProblemReport' && !this.rgstrId
            },
            // tableSrc(){
            //     return `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_wttj_zy`
            // }
        },
        components: {
            summary,
        },
        mounted() {
            this.$nextTick(() => {
                this.getTreeData();
            })
            this.getBgTypeList();
        },
        methods: {
            search() {
                let iframe = document.getElementById('iframeEle')
                let src = this.tableSrc
                iframe.src = src
                    + '&year=' + this.addForm.year
                    + '&pcid=' + this.addForm.batch
                    + '&bgType=' + this.bgType
                    + '&currentRlcode=' + this.currentRlcode
                    + '&isStage=' + (this.bgType === '0' ? '0' : '1')
                    + '&width=1920&height=592'
            },
            //获取左侧树数据
            getTreeData() {
                let _self = this;
                request.post(`/tac/insp/year/batch/obj/getObjTreeListV2`, {
                    "persId": _self.persId
                }).then(res => {
                    _self.showReport = true
                    _self.treeDataLists = res.data.children;
                    console.log(_self.treeDataLists)
                    let batchList = _self.treeDataLists[0].children
                    let rgstrId = []
                    let projectList = []
                    batchList[0].children.forEach(ele => {
                        ele.children.forEach(element => {
                            projectList = projectList.concat(element.children)
                        })
                    })
                    projectList.forEach(ele => {
                        rgstrId.push(ele.id)
                    })
                    this.rgstrId = rgstrId.join(',')
                    this.name = batchList[0].pnm
                    console.log(rgstrId)
                    setTimeout(() => {
                        this.$refs.tree2.filter('初始化');
                    }, 1000)
                })
            },
            getBgTypeList() {
                request.post(`/tac/province/plan/process/list`, {}).then(res => {

                    if (res.success) {
                        this.bgTypeList = res.data;
                        let expertOpinion = {
                            nowStep: '专家现场意见稿',
                            nowId: '0'
                        }
                        this.bgTypeList.unshift(expertOpinion);//方法将把它的参数插入 arrayObject 的头部
                    }
                })
            },
            //树节点点击事件
            treeNodeClickHandler(data, node, tree) {
                let rgstrId = []
                let projectList = []
                if (this.activeName == 'seriousProblemReport') {
                    if (node.level == 5) {
                        this.rgstrId = data.id
                        this.name = data.pnm
                    } else {
                        this.rgstrId = ''
                        this.name = ''
                    }
                } else {
                    if(node.level == 1){
                        data.children.forEach(ele => {
                            ele.children.forEach(element => {
                                element.children.forEach(element1 => {
                                    projectList = projectList.concat(element1.children)
                                })
                            })
                        })
                        projectList.forEach(ele => {
                            rgstrId.push(ele.id)
                        })
                        this.rgstrId = rgstrId.join(',')
                        this.name = data.pnm
                    }else if (node.level == 2) {
                        data.children.forEach(ele => {
                            ele.children.forEach(element => {
                                projectList = projectList.concat(element.children)
                            })
                        })
                        projectList.forEach(ele => {
                            rgstrId.push(ele.id)
                        })
                        this.rgstrId = rgstrId.join(',')
                        this.name = data.pnm
                    } else if (node.level == 3) {
                        data.children.forEach(ele => {
                            projectList = projectList.concat(ele.children)
                        })
                        projectList.forEach(ele => {
                            rgstrId.push(ele.id)
                        })
                        this.rgstrId = rgstrId.join(',')
                        this.name = data.pnm
                    } else if (node.level == 4) {
                        projectList = projectList.concat(data.children)
                        projectList.forEach(ele => {
                            rgstrId.push(ele.id)
                        })
                        this.rgstrId = rgstrId.join(',')
                        this.name = data.pnm
                    } else {
                        this.rgstrId = ''
                        this.name = ''
                    }

                }
            },
            filterNode(value, data, node) {
                if (!value) return true;
                if (this.activeName == 'seriousProblemReport') {
                    return node.level < 6;
                } else {
                    return node.level < 5;
                }
            },
            changeYear() {
            },
            handleClick() {
            }
        },
        watch: {
            activeName(val) {
                if (val == 'summary') {
                    this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_wttj_zy`
                } else if (val == 'membership') {
                    this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_wttj_zrzt`
                } else if (val == 'problemSummary') {
                    this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_wttj_huizong`
                } else if (val == 'seriousProblemReport') {
                    this.rgstrId = ''
                    this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_fxwtqd`
                } else if (val == 'jcfxwtzrjjtjb') {
                    this.rgstrId = ''
                    this.tableSrc = `${reportHosturl}/demo/reportJsp/showReport-suoding.jsp?rpx=fjjc_fxwt_zrjj.rpx`
                }
                this.$refs.tree2.filter(val);
            }
        }
    }
</script>

<style lang="scss">
    .report_tree {
        margin-top: 20px;
    }
</style>