实例介绍
【实例简介】
页面左侧可折叠收缩菜单
【实例截图】
【核心代码】
<div class="slimScrollDiv" style="position: relative; width: auto; height: 100%;"><div class="sidebar-collapse" style="width: auto; height: 100%;">
<ul class="nav" id="side-menu">
<li id="menu12" class="">
<a href="javascript:;" id="12"><i class="fa fa-12"></i><span class="nav-label">工程管理</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
<li id="child1121" class="">
<a href="javascript:;" id="1121"> <i class="fa fa-1121"></i> <span class="nav-label">抄表管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse" aria-expanded="false" style="height: 0px;">
<li><a data-sid="111211" class="J_menuItem" href="http://xxx.xxx.xxx/meterRecord_list.shtml?meterType=1" data-index="0">仪表数据</a>
</li></ul>
</li>
<li id="child1122" class="active">
<a href="javascript:;" id="1122"> <i class="fa fa-1122"></i> <span class="nav-label">工程维修</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse in" aria-expanded="true">
<li><a data-sid="111221" class="J_menuItem" href="http://xxx.xxx.xxx/maintainEngineer_list.shtml" data-index="0">业主报修</a>
</li></ul>
</li>
</ul>
</li>
<li id="menu13" class="">
<a href="javascript:;" id="13"><i class="fa fa-13"></i><span class="nav-label">财务管理</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
<li id="child1131">
<a href="javascript:;" id="1131"> <i class="fa fa-1131"></i> <span class="nav-label">帐单管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111311" class="J_menuItem" href="http://xxx.xxx.xxx/createBilling2_list.shtml" data-index="0">生成帐单</a>
</li><li><a data-sid="111312" class="J_menuItem" href="http://xxx.xxx.xxx/billing2_list.shtml" data-index="1">帐单列表</a>
</li><li><a data-sid="111313" class="J_menuItem" href="http://xxx.xxx.xxx/billing2Settle_list.shtml" data-index="2">帐单月结</a>
</li><li><a data-sid="111314" class="J_menuItem" href="http://xxx.xxx.xxx/printAdvice_list.shtml" data-index="3">打印通知单</a>
</li></ul>
</li>
<li id="child1132">
<a href="javascript:;" id="1132"> <i class="fa fa-1132"></i> <span class="nav-label">收费管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111321" class="J_menuItem" href="http://xxx.xxx.xxx/billing2Pay_list.shtml" data-index="0">房屋帐单收费</a>
</li><li><a data-sid="111322" class="J_menuItem" href="http://xxx.xxx.xxx/prePayAmount_list.shtml" data-index="1">预交款收费</a>
</li><li><a data-sid="111323" class="J_menuItem" href="http://xxx.xxx.xxx/roomItemPay_list.shtml" data-index="2">押金收费</a>
</li><li><a data-sid="111324" class="J_menuItem" href="http://xxx.xxx.xxx/tempItemPay_list.shtml" data-index="3">其它收费</a>
</li><li><a data-sid="111325" class="J_menuItem" href="http://xxx.xxx.xxx/overdueFineAudit_list.shtml" data-index="4">减免审核</a>
</li></ul>
</li>
<li id="child1133">
<a href="javascript:;" id="1133"> <i class="fa fa-1133"></i> <span class="nav-label">凭证管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111331" class="J_menuItem" href="http://xxx.xxx.xxx/billing2PayEvidence_list.shtml" data-index="0">房屋账单收费凭证</a>
</li><li><a data-sid="111332" class="J_menuItem" href="http://xxx.xxx.xxx/prePayAmountEvidence_list.shtml" data-index="1">预交款收费凭证</a>
</li><li><a data-sid="111333" class="J_menuItem" href="http://xxx.xxx.xxx/roomItemPayEvidence_list.shtml" data-index="2">押金收费凭证</a>
</li><li><a data-sid="111334" class="J_menuItem" href="http://xxx.xxx.xxx/tempItemPayEvidence_list.shtml" data-index="3">其它收费凭证</a>
</li></ul>
</li>
<li id="child1134">
<a href="javascript:;" id="1134"> <i class="fa fa-1134"></i> <span class="nav-label">金融联划款</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111341" class="J_menuItem" href="http://xxx.xxx.xxx/bankAccount_list.shtml" data-index="0">划款帐号</a>
</li><li><a data-sid="111342" class="J_menuItem" href="http://xxx.xxx.xxx/bankAccountFile_outplate.shtml" data-index="1">出盘文件</a>
</li><li><a data-sid="111343" class="J_menuItem" href="http://xxx.xxx.xxx/bankAccountFile_backplate.shtml" data-index="2">回盘文件</a>
</li><li><a data-sid="111344" class="J_menuItem" href="http://xxx.xxx.xxx/bankAccountPay_list.shtml" data-index="3">划款记录</a>
</li></ul>
</li>
<li id="child1137">
<a href="http://xxx.xxx.xxx/netPayRecordCheck_list.shtml" id="1137" class="J_menuItem" data-index="23"> <i class="fa fa-1137"></i> <span class="nav-label">网上交易对帐</span></a>
</li>
<li id="child1135">
<a href="javascript:;" id="1135"> <i class="fa fa-1135"></i> <span class="nav-label">收入报表</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111351" class="J_menuItem" href="http://xxx.xxx.xxx/billing2FeeStat_list.shtml" data-index="0">房屋帐单费用报表</a>
</li><li><a data-sid="111352" class="J_menuItem" href="http://xxx.xxx.xxx/billing2PayStat_list.shtml" data-index="1">房屋帐单收款报表</a>
</li><li><a data-sid="111353" class="J_menuItem" href="http://xxx.xxx.xxx/prePayAmountStat_list.shtml" data-index="2">预交款收款报表</a>
</li><li><a data-sid="111354" class="J_menuItem" href="http://xxx.xxx.xxx/roomItemPayStat_List.shtml" data-index="3">押金收款报表</a>
</li><li><a data-sid="111355" class="J_menuItem" href="http://xxx.xxx.xxx/tempItemPayStat_list.shtml" data-index="4">其它收款报表</a>
</li><li><a data-sid="111356" class="J_menuItem" href="http://xxx.xxx.xxx/overdueFineStat_list.shtml" data-index="5">费用减免报表</a>
</li><li><a data-sid="111357" class="J_menuItem" href="http://xxx.xxx.xxx/maintainFundStat_list.shtml" data-index="6">维修基金报表</a>
</li></ul>
</li>
<li id="child1136">
<a href="javascript:;" id="1136"> <i class="fa fa-1136"></i> <span class="nav-label">收费设置</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111361" class="J_menuItem" href="http://xxx.xxx.xxx/item_list.shtml" data-index="0">收费项目</a>
</li><li><a data-sid="111362" class="J_menuItem" href="http://xxx.xxx.xxx/itemFee_list.shtml" data-index="1">收费标准</a>
</li><li><a data-sid="111364" class="J_menuItem" href="http://xxx.xxx.xxx/area_editAreaConfig.shtml" data-index="2">基本设置</a>
</li><li><a data-sid="111363" class="J_menuItem" href="http://xxx.xxx.xxx/roomItemFeeRef_list.shtml" data-index="3">收费标准选用</a>
</li></ul>
</li>
</ul>
</li>
<li id="menu15" class="">
<a href="javascript:;" id="15"><i class="fa fa-15"></i><span class="nav-label">人事管理</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
<li id="child1151" class="active">
<a href="javascript:;" id="1151"> <i class="fa fa-1151"></i> <span class="nav-label">人事组织</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse in" aria-expanded="true">
<li><a data-sid="111511" class="J_menuItem" href="http://xxx.xxx.xxx/staff_list.shtml" data-index="0">员工管理</a>
</li><li><a data-sid="111512" class="J_menuItem" href="http://xxx.xxx.xxx/positionWork_positionTree.shtml" data-index="1">组织结构</a>
</li></ul>
</li>
<li id="child1153">
<a href="javascript:;" id="1153"> <i class="fa fa-1153"></i> <span class="nav-label">统计报表</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111531" class="J_menuItem" href="http://xxx.xxx.xxx/moveLog_list.shtml" data-index="0">员工调动统计</a>
</li><li><a data-sid="111532" class="J_menuItem" href="http://xxx.xxx.xxx/stat_feedbackStaffList.shtml" data-index="1">员工评价统计</a>
</li></ul>
</li>
</ul>
</li>
<li id="menu19" class="">
<a href="javascript:;" id="19"><i class="fa fa-19"></i><span class="nav-label">基础资料</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
<li id="child1191" class="active">
<a href="javascript:;" id="1191"> <i class="fa fa-1191"></i> <span class="nav-label">楼房管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse in" aria-expanded="true">
<li><a data-sid="111911" class="J_menuItem" href="http://xxx.xxx.xxx/room_list.shtml" data-index="0">房间档案</a>
</li><li><a data-sid="111912" class="J_menuItem" href="http://xxx.xxx.xxx/building_list.shtml" data-index="1">大楼档案</a>
</li><li><a data-sid="111914" class="J_menuItem" href="http://xxx.xxx.xxx/area_list.shtml" data-index="2">小区档案</a>
</li><li><a data-sid="111913" class="J_menuItem" href="http://xxx.xxx.xxx/roomType_list.shtml" data-index="3">房间类型</a>
</li></ul>
</li>
<li id="child1192">
<a href="javascript:;" id="1192"> <i class="fa fa-1192"></i> <span class="nav-label">仪表管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111921" class="J_menuItem" href="http://xxx.xxx.xxx/roomMeterRef_list.shtml" data-index="0">仪表档案</a>
</li><li><a data-sid="111922" class="J_menuItem" href="http://xxx.xxx.xxx/meterTemplate_list.shtml" data-index="1">抄表模板</a>
</li><li><a data-sid="111923" class="J_menuItem" href="http://xxx.xxx.xxx/meter_list.shtml" data-index="2">仪表类型</a>
</li></ul>
</li>
<li id="child1193">
<a href="javascript:;" id="1193"> <i class="fa fa-1193"></i> <span class="nav-label">业主管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="111931" class="J_menuItem" href="http://xxx.xxx.xxx/owner_list.shtml" data-index="0">业主档案</a>
</li><li><a data-sid="111934" class="J_menuItem" href="http://xxx.xxx.xxx/tenant_list.shtml" data-index="1">租户档案</a>
</li><li><a data-sid="111932" class="J_menuItem" href="http://xxx.xxx.xxx/user_list.shtml" data-index="2">悦家园用户</a>
</li></ul>
</li>
</ul>
</li>
<li id="menu20" class="">
<a href="javascript:;" id="20"><i class="fa fa-20"></i><span class="nav-label">系统设置</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse" aria-expanded="false" style="height: 0px;">
<li id="child1201">
<a href="javascript:;" id="1201"> <i class="fa fa-1201"></i> <span class="nav-label">权限管理</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="112011" class="J_menuItem" href="http://xxx.xxx.xxx/account_list.shtml" data-index="0">用户帐号</a>
</li><li><a data-sid="112012" class="J_menuItem" href="http://xxx.xxx.xxx/position_positionTree.shtml" data-index="1">组织结构</a>
</li></ul>
</li>
<li id="child1203">
<a href="javascript:;" id="1203"> <i class="fa fa-1203"></i> <span class="nav-label">日志统计</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="112031" class="J_menuItem" href="http://xxx.xxx.xxx/loginLog_list.shtml" data-index="0">登录日志</a>
</li></ul>
</li>
</ul>
</li>
<li id="menu25" class="active">
<a href="javascript:;" id="25"><i class="fa fa-25"></i><span class="nav-label">帮助中心</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse in" aria-expanded="true">
<li id="child1251">
<a href="javascript:;" id="1251"> <i class="fa fa-1251"></i> <span class="nav-label">智慧物业SaaS系统</span> <span class="fa arrow"></span> </a>
<ul class="nav nav-third-level collapse">
<li><a data-sid="125111" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_propertyBkShow.shtml" data-index="0">视频教程</a>
</li><li><a data-sid="125112" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_systemSetShow.shtml" data-index="1">系统设置</a>
</li><li><a data-sid="125113" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_baseDataShow.shtml" data-index="2">基础资料</a>
</li><li><a data-sid="125114" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_custManageShow.shtml" data-index="3">客服管理</a>
</li><li><a data-sid="125115" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_engManageShow.shtml" data-index="4">工程管理</a>
</li><li><a data-sid="125116" class="J_menuItem" href="http://xxx.xxx.xxx/helpCenter_finManageShow.shtml" data-index="5">财务管理</a>
</li></ul>
</li>
<li id="child1252">
<a href="http://xxx.xxx.xxx/helpCenter_ownerAppShow.shtml" id="1252" class="J_menuItem" data-index="58"> <i class="fa fa-1252"></i> <span class="nav-label">业主移动端</span></a>
</li>
</ul>
</li>
</ul>
</div>
小贴士
感谢您为本站写下的评论，您的评论对其它用户来说具有重要的参考价值，所以请认真填写。
- 类似“顶”、“沙发”之类没有营养的文字，对勤劳贡献的楼主来说是令人沮丧的反馈信息。
- 相信您也不想看到一排文字/表情墙，所以请不要反馈意义不大的重复字符，也请尽量不要纯表情的回复。
- 提问之前请再仔细看一遍楼主的说明，或许是您遗漏了。
- 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦，又没人会搭理，于人于己都无利。
关于好例子网
本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享，对搜索内容的合法性不具有预见性、识别性、控制性，仅供学习研究，请务必在下载后24小时内给予删除，不得用于其他任何用途，否则后果自负。基于互联网的特殊性，平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查；无论平台是否已进行审查，用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定，若资源存在侵权或相关问题请联系本站客服人员，点此联系我们。关于更多版权及免责申明参见 版权及免责申明
网友评论
我要评论