293 lines
7.7 KiB
HTML
293 lines
7.7 KiB
HTML
{% extends "layout.html" %} {% block content %}
|
|
<style>
|
|
.pos-box {
|
|
height: auto;
|
|
}
|
|
.control-item {
|
|
display: inline-block;
|
|
height: 45px;
|
|
min-width: 100px;
|
|
padding: 0 20px;
|
|
line-height: 45px;
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
text-align: center;
|
|
}
|
|
.control-item.active {
|
|
color: #20a53a;
|
|
background: #20a53a10;
|
|
}
|
|
.daily-thumbnail {
|
|
width: 1200px;
|
|
margin: 80px auto;
|
|
}
|
|
.thumbnail-box {
|
|
position: relative;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.thumbnail-introduce {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin-bottom: 40px;
|
|
}
|
|
.thumbnail-introduce span {
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
}
|
|
.thumbnail-introduce ul {
|
|
display: flex;
|
|
font-size: 16px;
|
|
line-height: 30px;
|
|
margin: 20px 0;
|
|
list-style-type: square;
|
|
}
|
|
.thumbnail-introduce ul li + li {
|
|
margin-left: 40px;
|
|
}
|
|
.pluginTipsGg {
|
|
position: relative;
|
|
width: 950px;
|
|
height: 678px;
|
|
background-color: #f1f1f1;
|
|
background-size: 100%;
|
|
background-repeat: no-repeat;
|
|
background-position: top;
|
|
border: 1px solid #f2f2f2;
|
|
border-radius: 4px;
|
|
image-rendering: -webkit-optimize-contrast;
|
|
}
|
|
/*.pluginTipsGg:hover::before{*/
|
|
/* display: inline-block;*/
|
|
/*}*/
|
|
.pluginTipsGg::before {
|
|
content: '点击预览';
|
|
display: none;
|
|
background: #000;
|
|
opacity: 0.2;
|
|
color: #fff;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
line-height: 621px;
|
|
font-size: 18px;
|
|
vertical-align: bottom;
|
|
text-align: center;
|
|
border-radius: 4px;
|
|
transition: all 1s;
|
|
}
|
|
.tab-list .tabs-item.active:after {
|
|
content: '';
|
|
width: 20px;
|
|
height: 2px;
|
|
position: absolute;
|
|
left: 50%;
|
|
bottom: 0px;
|
|
background: red;
|
|
margin-left: -10px;
|
|
background: #20a53a;
|
|
}
|
|
.thumbnail-box .thumbnail-tab {
|
|
margin-right: 20px;
|
|
width: 120px;
|
|
border-left: 1px solid #def2e2;
|
|
}
|
|
.thumbnail-tab li {
|
|
padding: 0 20px;
|
|
line-height: 36px;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
}
|
|
.thumbnail-tab li.on {
|
|
border-left: 2px solid #20a53a;
|
|
color: #20a53a;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
.thumbnail-item {
|
|
display: none;
|
|
}
|
|
.thumbnail-item.show {
|
|
display: block;
|
|
}
|
|
</style>
|
|
<div class="main-content pb55" style="min-height: 525px">
|
|
<div class="container-fluid">
|
|
{% if 'error_msg' in data %}
|
|
<div class="pos-box bgw mtb15">
|
|
<div class="control-nav">
|
|
<div class="control-item active" name="control">YakPanel WAF</div>
|
|
</div>
|
|
</div>
|
|
<div class="mtb15 pd15 bgw daily-view">
|
|
<div class="info-title-tips">
|
|
<p><span class="glyphicon glyphicon-alert" style="color: #f39c12; margin-right: 10px"></span>Tip: This page can be turned off in the panel settings</p>
|
|
</div>
|
|
<div class="daily-thumbnail">
|
|
<div class="thumbnail-introduce">
|
|
<span>Nginx WAF function introduction</span>
|
|
<ul>
|
|
<li>Only supports Nginx</li>
|
|
<li>Defend against CC attacks</li>
|
|
<li>Keyword blocking</li>
|
|
<li>Block malicious scans</li>
|
|
<li>Stop hackers</li>
|
|
</ul>
|
|
<div class="daily-product-buy">
|
|
<a title="Buy professional" href="javascript:;" class="btn btn-success va0 ml15 payPlugin">Buy now</a>
|
|
</div>
|
|
</div>
|
|
<div class="thumbnail-box">
|
|
<ul class="thumbnail-tab">
|
|
<li class="on">Overview</li>
|
|
<li>Report</li>
|
|
<li>Global</li>
|
|
<li>WebSite</li>
|
|
<li>Blockade</li>
|
|
</ul>
|
|
<div class="thumbnail-item show">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/1.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/2.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/3.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/4.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/5.png)"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="pos-box bgw mtb15">
|
|
<div class="control-nav">
|
|
<div class="control-item active" name="control">YakPanel WAF</div>
|
|
</div>
|
|
</div>
|
|
<div class="mtb15 pd15 bgw daily-view">
|
|
<div class="info-title-tips">
|
|
<p><span class="glyphicon glyphicon-alert" style="color: #f39c12; margin-right: 10px"></span>Tip: This page can be turned off in the panel settings</p>
|
|
</div>
|
|
<div class="daily-thumbnail">
|
|
<div class="thumbnail-introduce">
|
|
<span>Nginx WAF function introduction</span>
|
|
<ul>
|
|
<li>Only supports Nginx</li>
|
|
<li>Defend against CC attacks</li>
|
|
<li>Keyword blocking</li>
|
|
<li>Block malicious scans</li>
|
|
<li>Stop hackers</li>
|
|
</ul>
|
|
<div class="daily-product-buy">
|
|
<a title="Buy professional" href="javascript:;" class="btn btn-success va0 ml15 payPlugin">Buy now</a>
|
|
</div>
|
|
</div>
|
|
<div class="thumbnail-box">
|
|
<ul class="thumbnail-tab">
|
|
<li class="on">Overview</li>
|
|
<li>Report</li>
|
|
<li>Global</li>
|
|
<li>WebSite</li>
|
|
<li>Blockade</li>
|
|
</ul>
|
|
<div class="thumbnail-item show">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/1.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/2.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/3.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/4.png)"></div>
|
|
</div>
|
|
<div class="thumbnail-item">
|
|
<div class="pluginTipsGg" style="background-image: url(/static/img/nginx_firewall/5.png)"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %} {% block scripts %} {{ super() }}
|
|
<script type="text/javascript" src="/static/js/soft.js?version_20200109={{g['version']}}"></script>
|
|
<script type="text/javascript">
|
|
bt.send(
|
|
'get_soft_find',
|
|
'plugin/get_soft_find',
|
|
{
|
|
sName: 'btwaf',
|
|
},
|
|
function (res) {
|
|
if (res.endtime >= 0) {
|
|
$('.payPlugin').after('<a href="javascript:;" class="btn btn-success va0 ml15 installWaf">Install now</a>');
|
|
$('.payPlugin').remove();
|
|
}
|
|
}
|
|
);
|
|
|
|
$('.daily-product-buy').on('click', '.installWaf', function () {
|
|
bt.soft.install('btwaf');
|
|
// change_install_success();
|
|
});
|
|
|
|
$('.payPlugin').on('click', function () {
|
|
bt.soft.get_soft_find('btwaf', function (rdata) {
|
|
window.parent.usePay({ source: 25, plugin: { name: rdata.title, pid: rdata.pid, type: rdata.type, plugin: true, ps: rdata.ps } });
|
|
// bt.soft.product_pay_view();
|
|
// setTimeout(function(){
|
|
// $('.lib_ltd').click();
|
|
// },500);
|
|
});
|
|
});
|
|
|
|
$('.thumbnail-tab li').click(function () {
|
|
var index = $(this).index();
|
|
$(this).addClass('on').siblings('.on').removeClass('on');
|
|
$('.thumbnail-item').eq(index).addClass('show').siblings('.show').removeClass('show');
|
|
});
|
|
|
|
function change_install_success() {
|
|
var timer = setInterval(function () {
|
|
bt.send(
|
|
'get_soft_find',
|
|
'plugin/get_soft_find',
|
|
{
|
|
sName: 'btwaf',
|
|
},
|
|
function (res) {
|
|
if (res.setup) {
|
|
clearInterval(timer);
|
|
setTimeout(function () {
|
|
location.reload();
|
|
}, 2000);
|
|
}
|
|
}
|
|
);
|
|
}, 1000);
|
|
}
|
|
// $('.thumbnail-box').on('click',function(){
|
|
// layer.open({
|
|
// title:false,
|
|
// btn:false,
|
|
// shadeClose:true,
|
|
// closeBtn: 2,
|
|
// area:['950px','725px'],
|
|
// content:'<div class="pd10"><img src="/static/img/btwaf-nginx.png" style="width:100%"/></div>'
|
|
// })
|
|
// })
|
|
</script>
|
|
{% endblock %}
|