您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
对蜂网路由器后台进行优化,1.首页显示温度模块,2.内网主机可单机查看功能,3.不会自动退出登录(不可用),4.点击logo会复制地址和cookie并打开新窗口跳转到新系统,不会替换当前页面
当前为
// ==UserScript== // @name fw // @namespace http://tampermonkey.net/ // @version 0.2.4 // @description 对蜂网路由器后台进行优化,1.首页显示温度模块,2.内网主机可单机查看功能,3.不会自动退出登录(不可用),4.点击logo会复制地址和cookie并打开新窗口跳转到新系统,不会替换当前页面 // @author 005 // @match *://*/*?PAGE=* // @icon https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net // @grant none // @license MIT // ==/UserScript== (function () { 'use strict'; const time = 1500;//跳转时间(毫秒) const isDev = 0; // 只读权限禁止放行 const readonlyAPI = [ '/dhcp_log_del.htm', '/start_upgred.htm', '/updateprogress.htm', '/update_online_again.htm', '/fw_profile_reset.htm', '/fw_config_restore.htm', '/restart2.htm', '/poweroff.htm', '/fwlog_ping_del.htm', '/action/fwlog_delete.htm', ] // 只读权限放行 const whitelistAPI = [ '/auth', '/fw_quit.htm', '/is_bind_lan.htm', '/hosts_info.htm', '/show_connect.htm', '/show_connect_exe.htm', '/waf_get_server.htm', '/waf_get_rule.htm', '/waf_get_log.htm', ] // 请求过滤器 $.ajaxPrefilter(function (options, originalOptions, jqXHR) { if (!'只读权限') { for(let i=0;i<readonlyAPI.length;i++){ if (options.url.indexOf(readonlyAPI[i]) != -1) { // 阻止请求 jqXHR.abort('Request blocked by ajaxPrefilter.') alert('111只读权限') location.reload(); return; } } if (options.data) { let isInterdict = false; for(let i=0;i<whitelistAPI.length;i++){ if (options.url.indexOf(whitelistAPI[i]) == -1){ isInterdict = true; }else{ return; } } if(isInterdict){ // 阻止请求 jqXHR.abort('Request blocked by ajaxPrefilter.') alert('222只读权限') location.reload(); }; } } }); // CSS { var btnCss = `margin-right:24x; display:inline-block; cursor:pointer; margin-left:10px; padding:5px 10px; background-color:#26A3E9; border-radius:4px; color:#fff; font-size:12px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: all .2s linear;` var inpCss = `background-color: #ffffff; color: #666666; font-size: 14px; height: 28px; line-height: 28px; text-indent: 10px; width: 198px; border: 1px solid #dbdfe6; padding: 0; border-radius: 4px;` var selCss = `border: 1px solid #dbdfe6; border-radius: 4px; height: 28px; line-height: 28px; text-indent: 10px; width: 100px; ` } { //防止自动退出登录(不可用) setInterval(() => { i = 1 }, 600000) sessionStorage.setItem('login', '1') // 首页 //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- let IndexTime = null if (location.search.indexOf("?PAGE=index") !== -1) { IndexTime = null $.get('/action/env_check.htm', {}, function (msg) { // console.log(msg); let html = '' if (msg.cpu_term < 10 || msg.cpu_term > 85) { html += '<span>CPU温度: [ <font style="color:#ff0000;">' + msg.cpu_term + ' ℃</font> ]<img src="images/warning.png" title="温度异常,请及时清理设备,检查设备散热问题。" style="margin-left: 5px;width:14px; height:14px;"></span>'; $(".box-B10 p:nth(5)").after(` <div class="H10"></div> <p class="blk_tit"><span class="info_tit">CPU温度</span><span class="blk_txt" id="cpu_term"><font style="color:#ff0000;">${msg.cpu_term} ℃</font><img src="images/warning.png" title="温度异常,请及时清理设备,检查设备散热问题。" style="margin-left: 5px;width:14px; height:14px;"> </span></p> `) } else { html += '<span>CPU温度: [ <font style="color:#59CBA0">' + msg.cpu_term + ' ℃</font> ]</span>'; $(".box-B10 p:nth(5)").after(` <div class="H10"></div> <p class="blk_tit"><span class="info_tit">CPU温度</span><span class="blk_txt" id="cpu_term">${msg.cpu_term} ℃ </span></p> `) } $(".box-B10 p:last-of-type").css("display", "none") }, "JSON") IndexTime = setInterval(() => { $.get('/action/env_check.htm', {}, function (msg) { //console.log(msg) if (msg.cpu_term < 10 || msg.cpu_term > 85) { $("#cpu_term").html(`<font style="color:#ff0000;">${msg.cpu_term} ℃</font><img src="images/warning.png" title="温度异常,请及时清理设备,检查设备散热问题。" style="margin-left: 5px;width:14px; height:14px;"> `) } else { $("#cpu_term").html(msg.cpu_term + " ℃") } }, "JSON") }, 4000) //关闭跳转事件 $(".col-xs-7").off("click"); } //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- //内网主机 //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- if (location.search.indexOf("?PAGE=hosts_info") !== -1) { $(".seitchH-ul>.PPPOE_div>.H20>p").html('') // 单机应用查看 { $(".PPPOE_div>.div-tab").prepend(` <span style="margin-right:5px;">单机查看:</span> <input type="text" id="ipInp" value="" style="${inpCss}width:130px;" /> <div id="searchBtn" style="${btnCss}" >查看</div> <span> | </span> `) $("#ipInp").val(localStorage.getItem("ipVal")||'') } //IP正则 let ipaddress = /^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])/; //遮罩层CSS { var maskCss = `background-color:rgba(0,0,0,.3); display:none; position:fixed; width:100%; min-width:1200px; height:100%; top:0; left:0; bottom:0; z-index:99999; transition: all .2s linear; box-sizing: border-box; overflow:auto; ` var maskGtDiv = `width:1200px; height:calc(100% - 110px); overflow:hidden; margin:55px auto; background-color:#fff; border-radius: 10px; padding:10px 0; box-sizing: border-box;` var refreshTimeCss = `background-color: #ffffff; color: #666666; font-size: 13px; height: 28px; line-height: 28px; text-indent: 10px; width: 52px; border: 1px solid #dbdfe6; padding: 0; border-radius: 4px; margin:0 5px;` var listTableWrapperCss = `width:100%; height:calc(100% - 100px); margin-top:45px; border:1px solid #f0f0f0; border-radius:0 0 10px 10px; padding-bottom:10px; overflow: auto; ` } //添加遮罩层 { $("body").append(` <div id="mask" style="${maskCss}"> <div style="${maskGtDiv}"> <div style=" padding:15px 20px; display:flex; justify-content: space-between; align-items:center; border-bottom:1px solid #eee; "> <span style="font-size:16px;font-weight: bold;">连接列表</span> <div id="colseBtn" style="${btnCss}color:#ff4d4f;background-color:#fff;" title="ESC 关闭">关闭</div> </div> <div style="padding:15px 40px;height:calc(100% - 95px); position: relative;"> <div style="display:flex;justify-content: space-between"> <div style="display:flex; flex-direction: row; align-items:center;"> <select id="isHide" class="selCss"style="${selCss}width:65px;margin-right:4px;"> <option value="1">隐藏</option> <option value="0">显示</option> </select> <span>:</span> <select class="selCss" id="hideType" style="${selCss}margin-right:10px;"> <option value="appstat">连接类型</option> <option value="pri">优先级</option> <option value="proto">协议</option> <option value="sport">源端口</option> <option value="dport">目的端口</option> <option value="daddr">目标地址</option> <option value="wan">外网接口</option> <option value="status">连接状态</option> </select> <input id="hideInp" style="${inpCss}width:130px; "/> <div id="resetHideBtn" style="${btnCss}">重置</div> <div id="okHideBtn" style="${btnCss}">确认</div> </div> <div>自动刷新:<input type="number" id="refreshTimeInp" style="${refreshTimeCss}"/>秒 <div id="StartStopBtn" style="${btnCss}" title="空格 停止刷新">启动</div> <div id="reloadBtn" style="${btnCss}" title="R 刷新">立即刷新</div> </div> </div> <ul id="listTableWrapper" style="${listTableWrapperCss}"> <li style="position:absolute; width: calc(100% - 77px); top: 61px; left: 40px;"> <ul class="listTableHead" style="border-radius: 10px 10px 0 0;overflow:hidden;cursor: pointer;"> <li data-type="appstat">连接类型</li> <li data-type="pri">优先级</li> <li data-type="up">上传流量</li> <li data-type="down">下载流量</li> <li data-type="proto">协议</li> <li data-type="sport">源端口</li> <li data-type="dport">目的端口</li> <li data-type="daddr">目标地址</li> <li data-type="wan">外网接口</li> <li data-type="status">连接状态</li> </ul> </li> </ul> </div> </div> `) //回到顶部 /* $("#mask").append(` <div id="back-to-top" style=" position: fixed; bottom: 80px; right: calc(50% - 690px);; border-radius: 50%; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 24px; background-color: #fff; color:#1f1f1f; cursor: pointer; transition: all .2s linear; font-weight: bold; " title="T 回到顶部">↑</div> </div>`) */ //添加排序元素 $(".listTableHead>li").append(` <div style="display:flex;flex-direction: column;margin-left:5px;"> <div style="width: 0;height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 5px solid #b1b1b1;"></div> <div style="width: 0;height: 0;margin-top:3px; border-top: 5px solid #b1b1b1; border-left: 4px solid transparent; border-right: 4px solid transparent;"></div> </div> `) //CSS----------------------- { $(".selCss>option").css({ border:"1px solid #f0f0f0", }) $(".listTableHead>li").css({ cursor: "pointer", transition: "all .2s linear" }) $("#listTableWrapper>li>ul").css({ display:"flex" }) $("#listTableWrapper>li>ul>li").css({ width:"10%", height:"40px", display:"flex", justifyContent: "center", alignItems: "center", borderBottom:"1px solid #f0f0f0", }) $("#listTableWrapper>li>ul").eq(0).children('li').css({ backgroundColor:"#fafafa", fontWeight: "bold", height:"40px" }) //hover------------------- //查看按钮 $("#searchBtn").hover(function(){ // 移入 $(this).css("background-color","#39ade6") }, function(){ // 移出 $(this).css("background-color","#26a3e9") }); // 遮罩层关闭按钮 $("#colseBtn").hover(function(){ $(this).css("color","#ff7875") $(this).css("background-color","#fff2f0") }, function(){ $(this).css("color","#ff4d4f") $(this).css("background-color","#fff") }); //按钮 $("#searchBtn,#reloadBtn,#okHideBtn,#StartStopBtn,#resetHideBtn").hover(function(){ // 移入 $(this).css("background-color","#39ade6") }, function(){ // 移出 $(this).css("background-color","#26a3e9") }); //列表头部排序 $(".listTableHead>li").hover(function(){ // 鼠标移入时的处理逻辑 $(this).css("background-color","#efefef") }, function(){ // 鼠标移出时的处理逻辑 $(this).css("background-color","#fafafa") }); //回到顶部按钮 $("#back-to-top").hover(function(){ // 鼠标移入时的处理逻辑 $(this).css("background-color","#f0f0f0") }, function(){ // 鼠标移出时的处理逻辑 $(this).css("background-color","#fff") }); } } //ip详情列表样式 function ipListTableCss(){ $("#listTableWrapper>li>ul").css({ display:"flex" }) $("#listTableWrapper>li>ul>li").css({ width:"10%", height:"30px", display:"flex", justifyContent: "center", alignItems: "center", borderBottom:"1px solid #f0f0f0", }) $("#listTableWrapper>li:gt(0)>ul").css({ transition: "all .2s linear" }) //hover------------------- //除第一个li其他选中 $("#listTableWrapper>li:gt(0)>ul").hover(function(){ // 鼠标移入时的处理逻辑 if($(this).children().last().text()=="稳定") $(this).css("background-color","#fafafa") }, function(){ // 鼠标移出时的处理逻辑 if($(this).children().last().text()=="稳定") $(this).css("background-color","#fff") }); } let timerReload=null;//刷新定时器 let isStart=false;//是否开始 let sort={state:0,type:'down'};//排序 let ipListData=[];//ip详情数据 //查看按钮点击事件 $(document).on("click", "#searchBtn",function(){ getIpList(); //初始隐藏组件 let hideEntryInp = sessionStorage.getItem('hideEntry')?JSON.parse(sessionStorage.getItem('hideEntry')):''; if(Object.prototype.toString.call(hideEntryInp) === '[object Object]'){ const keys = Object.keys(hideEntryInp); const values = Object.values(hideEntryInp); $("#hideType").val(keys[0]) if(keys[0]=='pri'){ switch(values[0]){ case "1":$('#hideInp').val("最高");break; case "2":$('#hideInp').val("高");break; case "3":$('#hideInp').val("中");break; case "4":$('#hideInp').val("低");break; case "5":$('#hideInp').val("最低");break; } }else{ $('#hideInp').val(values[0]); $('#isHide').val(hideEntryInp.isHide); } }else{ $('#hideInp').val(''); $('#isHide').val(1); } }); //隐藏重置点击事件 $(document).on("click", "#resetHideBtn", function(){ $("#hideInp").val('') sessionStorage.removeItem('hideEntry') getIpList()//发起请求 message('', '已重置') }); //隐藏输入框添加键盘事件 $('#hideInp').keydown(function(event) { // 使用 event.key 来判断按键 if (event.key === 'Enter') { hideOk(); } }); //隐藏确认点击事件 $(document).on("click", "#okHideBtn",hideOk); //自动刷新输入框添加键盘事件 $('#refreshTimeInp').keydown(function(event) { // 使用 event.key 来判断按键 if (event.key === 'Enter') { if($("#refreshTimeInp").val()>0){ clearInterval(timerReload) $("#StartStopBtn").text('停止') isStart=true timerReload=setInterval(getIpList,$("#refreshTimeInp").val()*1000) }else{ message('warning','大于 0 生效!') } } }); //启/停定时按钮 $(document).on("click", "#StartStopBtn", function(){ if(isStart){ $("#StartStopBtn").text('启动') clearInterval(timerReload) isStart=false message('', '自动刷新已停止!') }else{ if($("#refreshTimeInp").val()>0){ message('success', '已启动!') $("#StartStopBtn").text('停止') isStart=true timerReload=setInterval(getIpList,$("#refreshTimeInp").val()*1000) }else{ message('warning', '大于 0 生效!') } } }); //立即刷新按钮 $(document).on("click", "#reloadBtn", function(){ getIpList() $("#StartStopBtn").text('启动') clearInterval(timerReload) isStart=false message('success', '刷新成功!') }); //排序点击事件 $(document).on("click", ".listTableHead>li", function(){ $(".listTableHead>li>div").each(function() { $(this).children().eq(0).css("border-bottom-color","#b1b1b1"); $(this).children().eq(1).css("border-top-color","#b1b1b1"); }) if(sort.type==this.dataset.type){ if(sort.state<2){ sort.state+=1 }else{ sort.state=0 } }else{ sort.state=1; sort.type=this.dataset.type; } switch(sort.state){ case 1:$(this).children().children().eq(0).css("border-bottom-color","#1677ff"); $(this).children().children().eq(1).css("border-top-color","#b1b1b1");break; case 2:$(this).children().children().eq(0).css("border-bottom-color","#b1b1b1"); $(this).children().children().eq(1).css("border-top-color","#1677ff");break; } addIpList() }); //隐藏确认 function hideOk(){ let hideType = $("#hideType").val() let hideVal = $("#hideInp").val().trim() let isOk = true if(hideType=="pri"){ if(/^[\u4e00-\u9fa5]{1,2}$/.test(hideVal)){ switch(hideVal){ case "最高":hideVal="1";break; case "高":hideVal="2";break; case "中":hideVal="3";break; case "低":hideVal="4";break; case "最低":hideVal="5";break; default:isOk = false; } }else{ isOk = false; } }else if(hideType=="proto"){ if(!(/TCP/i.test(hideVal) || /UDP/i.test(hideVal) || /ICMP/i.test(hideVal)))isOk = false; }else if(hideType=="sport"||hideType=="dport"){ const num = parseInt(hideVal, 10); if(!(!isNaN(num) && num >= 0 && num <= 65535))isOk = false; }else if(hideType=="daddr"){ const pattern = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/; if(!pattern.test(hideVal))isOk = false; }else if(hideType=="wan"){ if(!((hideVal.indexOf('wan')!=-1)||(hideVal.indexOf('LAN')!=-1)))isOk = false; }else if(hideType=="status"){ if(hideVal=="未响应"){ hideVal = 1 }else if(hideVal=="稳定"){ hideVal = 2 }else{ isOk = false } }else if(hideType=="appstat"){ console.log(isOk,hideType,hideVal) } if(isOk&&hideVal){ message('success', 'OK!') sessionStorage.setItem('hideEntry',JSON.stringify({[hideType]:hideVal,isHide:$("#isHide").val()})) }else{ console.log(isOk,hideType,hideVal) message('warning', '类型与值不匹配!') } getIpList()//发起请求 //console.log(isOk,hideType,hideVal) } // 请求获取ip详情列表 function getIpList(){ let ip = $("#ipInp")[0].value //判断输入IP是否正确 if (ipaddress.test(ip)) { let data = JSON.stringify({ ip, wan: $(".sel_line option:selected").attr("data") }) //请求数据 $.get('/action/show_connect_exe.htm', { data }, function (msg) { localStorage.setItem("ipVal",ip) if (msg.length > 0) { if(Array.isArray(msg[0])){ message('','有子数组'); }else{ ipListData = msg; addIpList() } $("#mask").css("display","block") } else { //没有查到数据 message('warning',"该IP无数据!") } }, "JSON") } else { message('error',"IP有误!") } } // 添加ip详情列表数据 function addIpList(){ //console.log(sort.state,sort.type); $("#listTableWrapper>li:gt(0)").remove() let sortData=JSON.parse(JSON.stringify(ipListData)); let hideEntry = sessionStorage.getItem('hideEntry')?JSON.parse(sessionStorage.getItem('hideEntry')):'' let hideEntryKey = ''; if(Object.prototype.toString.call(hideEntry) === '[object Object]'){ hideEntryKey = Object.keys(hideEntry)[0]; }else{ } switch(sort.state){ case 1:sortData.sort(function(a,b){return a[sort.type]-b[sort.type]});break; case 2:sortData.sort(function(a,b){return b[sort.type]-a[sort.type]});break; } let html = '' sortData=sort.state==0?ipListData:sortData sortData.forEach(function(item,index){ if(hideEntryKey){ if(hideEntry.isHide==1){ if(item[hideEntryKey]==hideEntry[hideEntryKey])return; }else{ if(item[hideEntryKey]!=hideEntry[hideEntryKey])return; } } html +=` <li style="${item.status==1?'background-color:#fff2e8':''}"> <ul> <li>${item.appstat}</li> <li>${(function(){ switch(item.pri){ case "1":return "最高"; case "2":return "高"; case "3":return "中"; case "4":return "低"; case "5":return "最低"; } })()}</li> <li>${formatFileSize(item.up)}</li> <li>${formatFileSize(item.down)}</li> <li>${item.proto}</li> <li>${item.sport}</li> <li>${item.dport}</li> <li>${item.daddr}</li> <li>${item.wan}</li> <li>${item.status==1?"未响应":"稳定"}</li> </ul> </li>` }) $("#listTableWrapper").append(html) ipListTableCss() } $(document).ready(function() { //返回顶部按钮 // 绑定到某个元素(如按钮)的点击事件上 $('#back-to-top').click(function() { // 使用animate()方法来平滑地滚动到页面顶部 $('body, html').animate({ scrollTop: 0 }, 500); // 500是动画的持续时间,以毫秒为单位 return false; // 阻止链接的默认行为(如果有的话) }); //手动刷新 $(".auto-flush").val(0) //初始隐藏组件 let hideEntryInp = sessionStorage.getItem('hideEntry')?JSON.parse(sessionStorage.getItem('hideEntry')):''; if(Object.prototype.toString.call(hideEntryInp) === '[object Object]'){ const keys = Object.keys(hideEntryInp); const values = Object.values(hideEntryInp); $("#hideType").val(keys[0]) $('#hideInp').val(values[0]); $('#isHide').val(hideEntryInp.isHide); }else{ $('#hideInp').val(''); $('#isHide').val(1); } $("#mask").attr('tabindex', '0').focus() //添加键盘事件 $("#mask").keydown(function(event) { //console.log(event.keyCode) // 检查是否按下了空格键 if (event.key === ' ' || event.keyCode === 32) { message('', '已停止!') //停止自动刷新 $("#StartStopBtn").text('启动') clearInterval(timerReload) isStart=false // 阻止事件的默认行为 event.preventDefault(); return false; // 在jQuery中,返回false也会阻止事件冒泡 }else if(event.keyCode ===82){//R键 //立即刷新 $("#reloadBtn").click() }else if(event.keyCode ===84){ //回到顶部 $('#back-to-top').click() }else if(event.keyCode ===27){ $('#colseBtn').click() } }); }); //遮罩层关闭按钮 $("#colseBtn").click(function(){ $("#mask").css("display","none") $('#hideInp').val(''); clearInterval(timerReload) isStart=false $("#refreshTimeInp").val('') $("#StartStopBtn").text('启动') }) // 单机流量详情 { $("#tblMain>tr").click(function(){ //console.log(this) }) } } //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- //newfw //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- if (window.location.host.indexOf(':') > 0 && !isPrivateIpAddress(window.location.hostname) || isDev == 1) $(".back_logo").css({ "cursor": "pointer" }); // logo点击事件 $(".back_logo").click(function () { if (window.location.host.indexOf(':') > 0 && !isPrivateIpAddress(window.location.hostname) || isDev == 1) { let str = '' if (window.location.host.split(':').length == 1) { str = window.btoa(window.location.host + ':80' + '*@*' + ($.cookie("NAME") || '')); } else { str = window.btoa(window.location.host + '*@*' + ($.cookie("NAME") || '')); } let $temp = $('<input>'); $('body').append($temp); $temp.val(str).select(); document.execCommand('copy'); $temp.remove(); $(".back_logo").html(` <div style=" width:100%; height:100%; display: flex; justify-content: center; align-items: center; color:#666; font-size:20px; background-color:rgba(255, 255, 255,.8); user-select: none; ">OK</div> `); setTimeout(() => { if (isDev == 1) { window.open("http://localhost:5173/login"); } else { window.open("http://47.108.191.179:8887/login"); } $(".back_logo").html(""); }, time) } }); // ip私有地址正则 function isPrivateIpAddress(ip) { // CIDR格式的私有IP地址段 var privateRegex = /^(?:(?:10|172\.(?:[1-9]|[1][0-9])|192\.168)\.)/; return privateRegex.test(ip); } //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- } { $('#menu').css("border", "1px solid red !important") } //流量转换 function formatFileSize(size) { const scale = 1024; if (size == "") { return "0B"; } else if (size < scale) { return `${size}.00B`; } else if (size < scale * scale) { return `${(size / scale).toFixed(2)}KB`; } else if (size < scale * scale * scale) { return `${(size / (scale * scale)).toFixed(2)}MB`; } else if (size < scale * scale * scale * scale) { return `${(size / (scale * scale * scale)).toFixed(2)}GB`; } else { return `${size}`; } } //消息提示 //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- /** * 消息提示 * @param {a} a 消息类型,例如:'default','success','warning','error' * @param {b} b 消息内容,例如:'这是一条消息提示' * @example * message('success', '恭喜你,这是一条成功消息') //@example示例代码 * @return {Function} 返回数据类型 */ _addMessageHTML(); let timerMessage = null; let topPX = 0; let arrMes = []; /** * 消息提示 * @param {a} a 消息类型,例如:'default','success','warning','error' * @param {b} b 消息内容,例如:'这是一条消息提示' * @example * message('success', '恭喜你,这是一条成功消息') //@example示例代码 * @return {Function} 返回数据类型 */ function message(a, b) { clearTimeout(timerMessage) switch (a) { case 'success': _success(); break; case 'warning': _warning(); break; case 'error': _error(); break; default: _default(); } $('#pmt_text').text(b) $('#prompt').css('opacity', 1) $('#prompt').css('top', '20px') timerMessage = setTimeout(() => { _closeMessage(); }, 3000) function _default() { $('#prompt').css('color', '#909399') $('#prompt').css('border-color', '#ebeef5') $('#prompt').css('background-color', '#edf2fc') $("#pmt_state").text('i'); $("#pmt_state").css("background-color", "#909399") } function _success() { $('#prompt').css('color', '#67c23a') $('#prompt').css('border-color', '#e1f3d8') $('#prompt').css('background-color', '#f0f9eb') $("#pmt_state").text('√'); $("#pmt_state").css("background-color", "#67c23a") } function _warning() { $('#prompt').css('color', '#e6a23c') $('#prompt').css('border-color', '#faecd8') $('#prompt').css('background-color', '#fdf6ec') $("#pmt_state").text('!'); $("#pmt_state").css("background-color", "#e6a23c") } function _error() { $('#prompt').css('color', '#f56c6c') $('#prompt').css('border-color', '#fde2e2') $('#prompt').css('background-color', '#fef0f0') $("#pmt_state").text('×'); $("#pmt_state").css("background-color", "#f56c6c") } } //关闭消息提示 function _closeMessage() { topPX -= 48; clearTimeout(timerMessage) $('#prompt').css('opacity', 0) $('#prompt').css('top', '-48px') } //添加消息提示元素 function _addMessageHTML() { const promptCSS = ` position: fixed; background-color: #edf2fc; border-color: #ebeef5; color: #909399; /* font-size: 12px; */ width: 380px; height: 48px; top: -48px; left: 50%; transform: translateX(-50%); border: 1px solid #ebeef5; border-radius: 3px; display: flex; justify-content: space-between; align-items: center; padding: 0 18px; user-select: none; opacity: 0; transition: all .2s linear; z-index: 99999; ` const pmt_stateCSS = ` display: inline-block; font-size: 12px; font-weight: bold; width: 16px; height: 16px; line-height: 16px; border-radius: 50%; text-align: center; background-color: #909399; color: #edf2fc; margin-right: 10px; ` const pmt_clearCSS = ` font-size: 22px; color: #c4c5cc; cursor: pointer; transition: all .1s linear; ` $('body').append(` <div id="prompt" style="${promptCSS}"> <div id="pmt"> <span id="pmt_state" style="${pmt_stateCSS}">i</span> <span id="pmt_text" style="font-size: 14px;">这是一条消息提示</span> </div> <div id="pmt_clear" style="${pmt_clearCSS}">×</div> </div> `) } //关闭消息提示按钮 $("#pmt_clear").click(() => { _closeMessage() }) //------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- })();
QingJ © 2025
镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址