【开发记录】网络穿透/端口映射/动态组网/视频推流EasyNTS上云网关平台tab栏折叠功能开发

EasyNTS上云网关重新定义更新后，除了能够进行网络穿透、远程组网等功能，还增加了视频RTMP推流功能，推流功能设置步骤可参考该文：TSINGSEE研发的RTMP视频推流网关是什么？如何使用？

EasyNTS界面的设计也清爽简洁，左侧tab栏具备折叠功能，但是由于项目规划之初没有此设计，导致目前此tab组件无法达到所需的功能，因此该组件需要重新研发。

我们采用了element组件库的NavMenu导航菜单组件，但是在研发的过程中，我们会发现由于element有自己的框架结构，与我们项目的admin-Lte框架不适应，所以需要做兼容处理。

admin-LTE的框架左侧栏有自带的折叠功能，当处于折叠状态下时，会在页面body的元素上加个sider-collapse的类名，我们需要做的就是监听此类名的存在，将新的组件样式全数写在此类名下，但菜单栏折叠此类名被赋值给页面时，我们书写的样式就会生效。

参考代码如下：

// 收缩下左菜单栏样式
.sidebar-collapse {
    .main-sidebar{
        .item_contanter{
            padding-left: 17px !important;
        }
        .logmenus .el-submenu__title{
            padding-left: 17px !important;
        }
        .el-icon-arrow-down {
            display: none;
        }
    } 
}

EasyNTS视频上云网关平台采用MQTT加密协议，具有运算速度快，安全性高，资源损耗低的优势，在银行政府等机构广泛使用，高性能，高可用。如果大家对此感兴趣，欢迎联系我们了解咨询。