subject_gxj/projects/src/main/webapp/vmodules/leftMenu.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!-- 左侧导航区域 -->
<div id="leftMenu">
    <!-- <div class="top_menu" @click="changeSide" v-if="collapse"></div> -->
    <div class="layui-side left_menu" :class="{close: collapse}">
        <!-- <div :class="['top_menu', {collapse}]" @click="changeSide" v-if="!collapse"></div> -->
        <div class="layui-side-scroll" style="width: 200px">
            <ul class="layui-nav layui-nav-tree" style="width: 200px" lay-filter="test">
                <li :class="['layui-nav-item', {'layui-nav-itemed layui-nav-itemed-hand': active === index}]"
                    v-for="(item, index) in navLs" :key="index" v-if="menuCode.indexOf(item.code) >= 0"
                >
                    <a :title="item.txt" @click="onSelectItem(index)" class='icon' style="color: #ffffff !important;"
                       :class="active === index? item.activeIcon :item.icon" href="javascript:;">{{item.txt}}</a>
                    <!-- <a v-else :title="item.txt" @click="onSelectItem(index)" :class="['icon', ]" href="javascript:;">{{item.txt}}</a> -->

                    <dl class="layui-nav-child" v-if="item.child != null">
                        <dd v-for="(it,ind) in item.child" :key="ind" v-if="menuCode.indexOf(it.code) >= 0">
                            <a :title="it.txt" href="javascript:;" :class="['icon', it.icon]"
                               style="font-size: 12px;text-indent: 1rem" @click="onSelectItem(index,ind)">{{it.txt}}</a>
                        </dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>
    <!-- 内容区域 -->
    <div class="layui-body">
        <iframe id="rightContent"></iframe>
    </div>
</div>
<script type="text/javascript">
    var year = new Date().getFullYear();
    new Vue({
        el: "#leftMenu",
        data: {
            winH: 0,
            collapse: false,
            tabActive: 1,
            isDialog: '${isDialog}',
            active: 0, // 左侧菜单选中项
            buttonActive: 1,
            buttonActive2: 1,
            menuCode: "${menuCode}".split(","),
            navLs: [
                /* {icon: 'icon_big_screen_active',activeIcon:'icon_big_screen_active', code: '101', txt: '分析大屏',url: 'statics/analysisScreen'}, */
                {
                    icon: 'icon_big_screen_active',
                    activeIcon: 'icon_big_screen_active',
                    code: '101',
                    txt: '智慧分析大屏',
                    url: 'statics/analysisScreenTwo'
                },
                {
                    icon: 'icon_work_bench_active',
                    activeIcon: 'icon_work_bench_active',
                    code: '201',
                    txt: '互动工作台',
                    url: 'workBench/zrWorkBench',
                    kind: ["1", "4"]
                },
                {
                    icon: 'icon_project_active',
                    activeIcon: 'icon_project_active',
                    code: '4',
                    txt: '固定资产投资项目四库',
                    child: [

                        {
                            txt: '储备项目库',
                            code: '402',
                            url: 'subject/subInfo/projTz?type=3',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_cb_${loginUserId}")
                            }
                        },
                        {
                            txt: '新建项目库',
                            code: '408',
                            url: 'subject/subInfo/projTz?type=0',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_xj_${loginUserId}")
                            }
                        },
                        {
                            txt: '在建项目库',
                            code: '401',
                            url: 'subject/subInfo/projTz?type=1',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_main_${loginUserId}")
                            }
                        },
                        {
                            txt: '竣工项目库',
                            code: '403',
                            url: 'subject/subInfo/projTz?type=4',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_end_${loginUserId}")
                            }
                        }
                    ]
                },
                {
                    icon: 'icon_project_active',
                    activeIcon: 'icon_project_active',
                    code: '1999',
                    txt: '重点项目调度',
                    child: [
                        {
                            txt: '储备项目',
                            code: '1103',
                            url: 'subject/subInfo/projTz?type=yearReserve',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearReserve_${loginUserId}")
                            }
                        },
                        {
                            txt: '新建项目',
                            code: '1101',
                            url: 'subject/subInfo/projTz?type=yearNew',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearNew_${loginUserId}")
                            }
                        },
                        {
                            txt: '在建项目',
                            code: '1102',
                            url: 'subject/subInfo/projTz?type=yearExtend',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearExtend_${loginUserId}")
                            }
                        },
                        {
                            txt: '投产项目',
                            code: '1101',
                            url: 'subject/subInfo/projTz?type=yearSum',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearSum_${loginUserId}")
                            }
                        },
                        <%--                    <c:forEach items="${zjlyList}" var="li" varStatus="lis">--%>
                        <%--                        {--%>
                        <%--                            txt: '${li.title}',--%>
                        <%--                            code: '${li.code}',--%>
                        <%--                            url: 'subject/subInfo/projZj?code=${li.code}&title=${li.title}',--%>
                        <%--                        },--%>
                        <%--                        </c:forEach>--%>
                        <c:forEach items="${zjlyList}" var="li" varStatus="lis">
                        <c:choose>
                        <c:when test="${li.code == '1999' && li.title == '重点投资项目'}">
                        {
                            txt: '重点投资项目',
                            code: '1999',
                            url: 'subject/subInfo/projTz?type=major',
                        },
                        </c:when>
                        <c:when test="${li.code == '104' && li.title == '援疆资金'}">
                        {
                            txt: '${li.title}',
                            code: '${li.code}',
                            url: 'non/fixed/investment/yjzj',
                        },
                        </c:when>
                        <c:otherwise>
                        {
                            txt: '${li.title}',
                            code: '${li.code}',
                            /*                     url: 'subject/subInfo/projZjTab?code=${li.code}&title=${li.title}',*/
                            url: 'subject/subInfo/projZjTab?code=${li.code}&title=${li.title}&statusZj=1',
                        },
                        </c:otherwise>
                        </c:choose>
                        </c:forEach>
                        /*            {
                                        txt: '重点投资项目',
                                        code: '404',
                                        url: 'subject/subInfo/projTz?type=major',
                                    },*/

                        /* {
                        txt: '中央预算内资金项目',
                        code: '404',
                        url: 'subject/subInfo/projTz?type=6',
                        },
                        {
                        txt: '援疆资金项目',
                        code: '405',
                        url: 'subject/subInfo/projTz?type=7',
                        },
                        {
                        txt: '总投资10亿元以上项目',
                        code: '1001',
                        url: 'subject/subInfo/projTz?type=9',
                        },
                        {
                        txt: '以工代赈项目',
                        code: '1002',
                        url: 'subject/subInfo/projTz?type=10',
                        },/!*, {
                        txt: (year-1)+'年增发国债',
                        code: '1003',
                        url: 'subject/subInfo/projTz?type=11',
                        },*!/
                        {
                        txt: year+'年超长期国债',
                        code: '1004',
                        url: 'subject/subInfo/projTz?type=12',
                        }
                        ,
                        {
                        txt: '地方政府专项债资金',
                        code: '1005',
                        url: 'subject/subInfo/projTz?type=13',
                        }*/
                    ]
                },
                {
                    icon: 'icon_organ_manage_active',
                    activeIcon: 'icon_organ_manage_active',
                    code: '3',
                    txt: '项目前期管理',
                    child: [
                        {
                            txt: '项目信息申报',
                            code: '301',
                            url: 'subject/subInfo/report'
                        },
                        {
                            txt: '项目审核',
                            code: '302',
                            url: 'subject/apply/spList'/* ?type=qx */
                        },
                        {
                            code: '304',
                            txt: '前期手续办理情况评价',
                            url: 'subject/subInfo/projTz?type=prePj',
                        },
                        {
                            txt: '前期手续办理情况',
                            code: '303',
                            url: 'subject/subInfo/pre'/* ?type=qx */
                        }
                    ]
                },
                {
                    icon: 'icon_project_active',
                    activeIcon: 'icon_project_active',
                    code: '11',
                    txt: '年度固定资产项目库',
                    child: [
                        {
                            txt: '汇总项目',
                            code: '1101',
                            url: 'subject/subInfo/projTz?type=yearSum',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearSum_${loginUserId}")
                            }
                        },
                        {
                            txt: '新建项目',
                            code: '1101',
                            url: 'subject/subInfo/projTz?type=yearNew',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearNew_${loginUserId}")
                            }
                        },
                        {
                            txt: '续建项目',
                            code: '1102',
                            url: 'subject/subInfo/projTz?type=yearExtend',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearExtend_${loginUserId}")
                            }
                        },
                        {
                            txt: '储备项目',
                            code: '1103',
                            url: 'subject/subInfo/projTz?type=yearReserve',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_yearReserve_${loginUserId}")
                            }
                        }
                    ]
                },
                {
                    icon: 'icon_over_time_active',
                    activeIcon: 'icon_over_time_active',
                    code: '2000',
                    txt: '竣工验收及项目后评价',
                    url: 'subject/subInfo/projTz?type=8',
                },
                /*              {
                                  icon: 'icon_over_time_active', activeIcon: 'icon_over_time_active',
                                  code: '5',
                                  txt: '重点投资项目',
                                  url: 'subject/subInfo/projTz?type=major',
                              },*/
                {
                    icon: 'icon_over_time_active', activeIcon: 'icon_over_time_active',
                    code: '5',
                    txt: '统计分析',
                    url: 'tjfx/index'
                },
                {
                    icon: 'icon_over_time_active',
                    activeIcon: 'icon_over_time_active',
                    code: '6',
                    txt: '预警问题督办',
                    child: [
                        {
                            txt: '问题统计分析',
                            code: '602',
                            //icon: 'icon_question_gz',
                            url: 'problem/info/index'
                        },
                        {
                            txt: '问题推送处理',
                            code: '603',
                            url: "problemtrack/index"

                        }
                    ]
                },
                {
                    icon: 'icon_zjfwk_active',
                    activeIcon: 'icon_zjfwk_active',
                    txt: '智联工地',
                    code: '7',
                    child: [
                        /* {
                            code: '701',
                            txt: '智慧工地总览',
                            url: 'smart/index'
                        }, */
                        {
                            code: '702',
                            txt: '项目地图',
                            url: 'smart/query'
                        },
                        {
                            code: '703',
                            txt: '实时视频',
                            url: 'smart/vedio'
                        },
                        {
                            txt: '周调度图片',
                            code: '706',
                            url: 'graphicProgress/list'
                        },
                        {
                            txt: '月航拍全景',
                            code: '707',
                            url: 'aerial/list'
                        }

                    ]
                },
                {
                    icon: 'icon_project_active',
                    activeIcon: 'icon_project_active',
                    code: '8',
                    txt: '产业链共享服务',
                    url: 'intermediary/list'
                    /* child: [
                        {
                            txt: '产业链服务库列表',
                            code: '801',
                            url: 'intermediary/list'
                        },{
                            txt: '产业链服务库统计',
                            code: '802',
                            url: 'intermediary/statics'
                        },
                    ] */
                },

                // ,{
                // 	icon: 'icon_project_zjfwk_active',
                // 	activeIcon:'icon_project_zjfwk_active',
                // 	txt: '产业链服务库',
                // 	code: '11',
                // 	url: 'intermediary/list'
                // },
                // {
                // 	icon: 'icon_project_active',
                // 	activeIcon:'icon_project_active',
                // 	code: '5',
                // 	txt: '项目申报管理',
                // 	child: [
                // 		{
                // 			txt: '项目信息申报',
                // 			code: '501',
                // 			url: 'subject/subInfo/report'
                // 		},
                // 		/* {
                //             txt: '项目申报',
                //             code: '502',
                //             url: 'subject/subPre/records_list'
                //         }, */
                // 		/* {
                //             txt: '分配审核单位',
                //             code: '502',
                //             url: 'subject/subInfo/manage'
                //         }, */
                // 		{
                // 			txt: '项目手续办理',
                // 			code: '503',
                // 			url: '/subPreNew/index'
                // 		},
                // 		{
                // 			txt: '项目审核',
                // 			code: '504',
                // 			url: 'subject/apply/spList'/* ?type=qx */
                // 		},
                // 		/* {
                //             txt: '项目审核-市发改委',
                //             code: '505',
                //             url: 'subject/apply/spList?type=sj'
                //         }, */
                // 		/* {
                //             txt: '项目核准备案',
                //             code: '505',
                //             url: 'subject/hzba/list'
                //         }, */
                // 	]
                // },
                {
                    icon: 'icon_project_xtgl_active',
                    activeIcon: 'icon_project_xtgl_active',
                    code: '9',
                    txt: '系统管理',
                    child: [
                        {
                            txt: '角色管理',
                            code: '901',
                            url: "Rolemeun/view"
                        },
                        {
                            txt: '用户管理',
                            code: '902',
                            url: "user/view"
                        },
                        {
                            txt: '用户管理-项目单位',
                            code: '903',
                            url: "userapply/view"
                        },
                        {
                            txt: '项目单位信息',
                            code: '904',
                            url: 'register/query'
                        }, {
                            txt: '审核项目单位信息',
                            code: '905',
                            url: 'register/queryCheck'
                        },
                        {
                            txt: '行业部门信息',
                            code: '906',
                            url: 'junit/index'
                        },
                        {
                            txt: '部门科室信息',
                            code: '907',
                            url: 'jdepart/index'
                        }
                        ,
                        {
                            txt: '监管单位设置',
                            code: '908',
                            url: 'mainjunit/index'
                        },
                        {
                            txt: '字典管理',
                            code: '909',
                            url: 'dicsystable/index',
                        },
                        /* {
                            txt: 'APP轮播图设置',
                            code: '607',
                            url: 'picture/index'
                        }, */
                        /* {
                            txt: '项目文档的单位设置',
                            code: '608',
                            url: 'approvalUnit/index'
                        }, */
                        {
                            txt: '公告管理',
                            code: '910',
                            url: 'notice/index'
                        },
                        {
                            txt: '系统参数设置',
                            code: '911',
                            url: 'sysTable/index'
                        },
                        {
                            txt: '项目前期批复单位设置',
                            code: '912',
                            url: 'subPreFlow/setUnit'
                        },
                        {
                            txt: '同步日志查询',
                            code: '913',
                            url: 'syncLog/index'
                        },
                        {
                            txt: '项目日志查询',
                            code: '913',
                            url: 'subDataLog/index'
                        },
                        {
                            txt: '登录日志',
                            code: '911',
                            url: 'loginlog/index'
                        },
                        {
                            code: '914',
                            txt: '政策文件分类',
                            url: 'policy/column/index'
                        },
                        // {
                        // 	code: '1002',
                        // 	txt: '文件内容',
                        // 	url: 'policy/document/index'
                        // },
                        // {
                        // 	txt: '项目删除',
                        // 	code: '515',
                        // 	url: 'subject/subInfo/delView'
                        // },
                        {
                            txt: '短信日志查询',
                            code: '915',
                            url: 'msgLog/index'
                        },
                        {
                            txt: '项目总库',
                            code: '916',
                            url: 'subject/subInfo/projTz?type=5',
                            before: function () {
                                window.localStorage.removeItem("TzQueryParam_zk_${loginUserId}")
                            }
                        },
                        {
                            code: '917',
                            txt: '项目年度计划',
                            url: 'annualPlan/index'
                        },
                        {
                            txt: '项目周报',
                            code: '406',
                            url: 'weekReport/view'
                        },
                        {
                            txt: '项目月报',
                            code: '407',
                            url: 'monthReport/view'
                        },
                        {
                            txt: '逾期项目',
                            code: '601',
                            url: 'overdue/view?overStatus=1'
                        },
                        {
                            code: '604',
                            txt: '重大事件记录专栏',
                            url: 'meetingRecords/list'
                        },
                        {
                            txt: '经纬度设置',
                            code: '704',
                            url: 'subject/subInfo/latitudeAndLongitude'
                        },
                        {
                            txt: '摄像头绑定',
                            code: '705',
                            url: 'camera/index'
                        },
                    ]
                }
                // ,{
                // 	icon: 'icon_big_screen_active',
                // 	activeIcon:'icon_big_screen_active',
                // 	code: '8',
                // 	txt: '统计分析',
                // 	child: [
                // 		/* {
                //             code: '811',
                //             txt: '项目预测分析',
                //             url: 'prediction/index',
                //         }, */{
                // 			code: '812',
                // 			txt: '同比',
                // 			url: 'yoy/index'
                //
                // 		},{
                // 			code: '813',
                // 			txt: '环比',
                // 			url: 'qoq/view'
                // 		},{
                // 			code: '814',
                // 			txt: '年度投资分析',
                // 			url: 'yoy/tjfx'
                // 		}
                // 	]
                // }
                // {
                // 	icon: 'icon_big_screen_active',
                // 	activeIcon:'icon_big_screen_active',
                // 	txt: '政策文件管理',
                // 	code: '10',
                // 	child: [
                // 		{
                // 			code: '1001',
                // 			txt: '政策文件分类',
                // 			url: 'policy/column/index'
                // 		},
                // 		{
                // 			code: '1002',
                // 			txt: '文件内容',
                // 			url: 'policy/document/index'
                // 		}
                // 	]
                // }
            ],
            imgLs: 10
        },
        mounted: function () {
            this.init();
            window.addEventListener("message", e => {
                this.changeSide(e.data.collapse)
            });
            window.toWorkBench = this.toWorkBench;
            window.toTask = this.toTask;
        },
        methods: {
            init: function () {
                if (this.isDialog === '1') {
                    this.toTask();
                }
                const $ = layui.jquery
                // $('#rightContent').width(document.body.clientWidth - 190).height(document.body.clientHeight - 50);
                window.addEventListener('resize', function () {
                    // $('#rightContent').height(document.body.clientHeight - 50);
                })

                //通过hash值的索引定位应该加载哪个页面
                var href = window.location.href;
                var toUrl = href.replace(App.getUrl("index"), "");
                if (toUrl.indexOf("#") == 0 && toUrl.length >= 2) {
                    var hashIndex = toUrl.replace("#", "").split("_");
                    for (var i = 0; i < hashIndex.length; i++) {
                        if (!isNumber(hashIndex[i])) {
                            return;
                        }
                    }
                    if (hashIndex.length > 1) {
                        this.onSelectItem(hashIndex[0], hashIndex[1]);
                    } else {
                        this.onSelectItem(hashIndex[0]);
                    }
                    //页面选中
                    /* for(var i =0;i<this.navLs.length;i++){
                        if (this.navLs[i].child != null){
                            //再次循环
                            for (var j=0;j<this.navLs[i].child.length;j++){
                                if(toUrl.indexOf(this.navLs[i].child[j].url) >= 0){
                                    $("#rightContent").attr("src",App.getUrl(toUrl.substring(2,toUrl.length)));
                                    this.active = i;
                                    break;
                                }
                            }
                        }else{
                            if(toUrl.indexOf(this.navLs[i].url) >= 0){
                                $("#rightContent").attr("src",App.getUrl(toUrl.substring(2,toUrl.length)));
                                this.active = i;
                                break;
                            }
                        }

                    } */

                } else {
                    //初始化选中第一个菜单
                    for (var i = 0; i < this.navLs.length; i++) {
                        if (this.menuCode.indexOf(this.navLs[i].code) >= 0) {
                            if (this.navLs[i].child) {
                                var child = this.navLs[i].child;
                                for (var j = 0; j < child.length; j++) {
                                    if (this.menuCode.indexOf(child[j].code) >= 0) {
                                        this.onSelectItem(i, j);
                                        return;
                                    }
                                }
                            } else {
                                this.onSelectItem(i);
                                return;
                            }
                        }
                    }
                }

            },

            changeSide: function (status = true) {
                this.collapse = !status
                if (this.collapse) {
                    $("#rightContent").parent().addClass("close");
                } else {
                    $("#rightContent").parent().removeClass("close");
                }
                $("#rightContent").width("100%");
            },
            toWorkBench: function () {
                var index = this.navLs.findIndex(item => {
                    return item.txt === '工作台';
                });
                this.onSelectItem(index)
            },
            toTask: function () {
                /*       top.App.openLayer({
                           title : "项目调度情况",
                           content : App.getUrl("meetingRecords/show"),
                           height : "700",
                           width : "90%"
                       });*/
                //详情
                var index = top.layer.open({
                    type: 2,
                    area: ['95%', '100%'],
                    content: App.getUrl("taskRecords/show"),
                    shade: 0.5,
                    shadeClose: true
                });
                //top.layer.full(index);
            },
            onSelectItem: function (index, ind) {
                this.active = index;
                if (ind != undefined) {
                    var chooseNode = this.navLs[index]["child"][ind];
                    if (chooseNode.url) {
                        if (chooseNode.before && typeof (chooseNode.before) == 'function') {
                            chooseNode.before();
                        }
                        window.location.hash = index + "_" + ind;
                        var parentNodeText = this.navLs[index].txt;
                        var arrowHtml = '<div class="top-arrow-html"></div>';
                        $("#rightContent").attr("src", App.getUrl(chooseNode.url));
                        $(".top-breadcrumb").html(parentNodeText + arrowHtml + chooseNode.txt);
                    } else {
                        App.msg.warn("正在建设中");
                    }
                } else if (this.navLs[index].url) {
                    var chooseNode = this.navLs[index];
                    if (chooseNode.before && typeof (chooseNode.before) == 'function') {
                        chooseNode.before();
                    }
                    window.location.hash = index;
                    $("#rightContent").attr("src", App.getUrl(this.navLs[index].url));
                    $(".top-breadcrumb").text(this.navLs[index].txt);
                }
            },
            onChangeActive: function (index) {
                this.tabActive = index
            },
            onButtonActive: function (index) {
                this.buttonActive = index
            },
            onView: function () {
                const $ = layui.jquery
                layer.open({
                    type: 1,
                    title: '确认信息',
                    skin: 'pop_info_class',
                    id: 'layerPop1', //防止重复弹出
                    content: $('#popInfo'),
                    btn: ['取消', '提交'],
                    btnAlign: 'c', //按钮居中
                    yes: function () {
                        layer.closeAll();
                    },
                    btn2: function () {
                    },
                    cancel: function () {
                        layer.closeAll();
                    }
                })
            }
        }
    });
    window.onresize = function () {
        $("#rightContent").css("width", "100%");
    }
</script>
<style>
    #rightContent {
        width: 100%;
        border: none;
        height: calc(100% - 6px);
    }

    .left_menu {
        width: 200px;
    }
</style>