septcuts

七天网络快捷下拉框

Usage no npm install needed!

<script type="module">
  import septcuts from 'https://cdn.skypack.dev/septcuts';
</script>

README

Septcuts npm

七天网络快键菜单

JSON: https://static.7net.cc/septcuts/septcuts.json

Demo: https://static.7net.cc/septcuts/examples/index.html

Getting Started

Install with NPM:


$ npm install --save septcuts

Import into your project:


import Septcuts from 'septcuts'

Usage

    <button class='btn-septcuts'>七天网络</button>

    var septcuts=new Septcuts(".btn-septcuts");

Options

var septcuts = new Septcuts('.btn-septcuts', {
      //应用列表,默认全部七天全部产品,也可设置为接口地址,如https://static.7net.cc/septcuts/septcuts.json
      groups: 'https://static.7net.cc/septcuts/septcuts.json',
      http: { url: 'https://static.7net.cc/septcuts/septcuts.json', method: 'post', header: {}, data: {} },//接口请求,设置groups未设置时,可设置此项
      cssClass: 'drop-item', //给下拉菜单额外添加的className
      itemWidth: 180,  //菜单项的宽度,默认180px
      iconSize: 28,  //菜单icon的大小,默认28px
      colNum: 3, //一行最多显示几个菜单项,默认3个
      trigger: 'click',  //弹出菜单的触发方式,默认hover

      //菜单项的点击事件,配置此项后点击将不执行跳转
      click: function (item) { 
        //todo
        //
        //
      },
        //初始化完成后执行,可在此处获取应用列表
      onInit:function(septcuts){
       // console.log(septcuts);
       //测试快发适用,不同环境动态修改url域名,不建议在生产环境继续使用
       if(DEBUG==true){
            septcuts.groups.forEach(group => {
            group.items.map(item => {
                item.url = item.url.split('.')[0] +
                            window.location.hostname.substr(window.location.hostname.indexOf('.')) +
                            (item.url.replace('://', '').includes('/') ? (item.url.substr(item.url.replace('://', '')
                                .indexOf('/') + 3) || '') : '')
                return item;
             })
            });
            septcuts.update()
        }
      }
    })
    septcuts.groups=[{
                "title": "应用平台",
                "items": [
                { "label": "考试管理", "url": "https://office.7net.cc", "icon": "https://static.7net.cc/septcuts/icons/ksgl.png" },
                { "label": "阅卷任务", "url": "https://yj.7net.cc", "icon": "https://static.7net.cc/septcuts/icons/yjrw.png" }
                ]
            }]; //应用列表
    septcuts.update()//应用列表更新应用列表||septcuts.update([]);
    septcuts.destroy(); //销毁事件

In Browser

    <script src="path/septcuts.min.js"></script>
    var septcuts=new Septcuts(".drop-button");

CDN

    <script src="//static.7net.cc/septcuts/septcuts.min.js"></script>