1457 lines
73 KiB
Plaintext
1457 lines
73 KiB
Plaintext
@using Hncore.Pass.Vpn.Response.Product
|
||
@using Microsoft.Extensions.Configuration
|
||
@using Hncore.Pass.BaseInfo.Response
|
||
@using Hncore.Infrastructure.Serializer;
|
||
@using Hncore.Pass.BaseInfo.Service
|
||
@inject IConfiguration m_Configuration
|
||
@model List<ProductWithPackageResponse>
|
||
@inject UserService m_UserService
|
||
@inject Hncore.Pass.Vpn.Service.ProductAccountService m_AccountService
|
||
@{
|
||
ViewData["Title"] = "购买产品";
|
||
UserLoginModel user = null;
|
||
Hncore.Pass.BaseInfo.Models.User userEntity = new Hncore.Pass.BaseInfo.Models.User();
|
||
if (this.Context.Request.Cookies.TryGetValue("userInfo", out string userCookie))
|
||
{
|
||
user = userCookie.FromJsonTo<UserLoginModel>();
|
||
userEntity = await m_UserService.GetById(user.Id);
|
||
}
|
||
var pid = this.Context.Request.Query.ContainsKey("id") ? this.Context.Request.Query["id"].ToString() : "";
|
||
var defaultProduct = Model.Select(m => m.Product).FirstOrDefault();
|
||
if (pid == "")
|
||
{
|
||
pid = Model.Select(m => m.Product).FirstOrDefault().Id.ToString();
|
||
}
|
||
else
|
||
{
|
||
defaultProduct = Model.Select(m => m.Product).FirstOrDefault(m => m.Id.ToString() == pid);
|
||
}
|
||
|
||
//设置获取余额
|
||
var restAmout = Convert.ToDecimal(0.00);
|
||
var resttime = 0;
|
||
var userid = 0;
|
||
if (user != null){
|
||
resttime = await m_AccountService.GetRestTestCount(user.Id);
|
||
restAmout = userEntity.RestAmount;
|
||
userid = userEntity.Id;
|
||
}
|
||
var defaultPackage = Model.Where(m => m.Product.Id == defaultProduct.Id).Select(m => m.Packages.FirstOrDefault()).FirstOrDefault();
|
||
var baseUrl = m_Configuration["BaseInfoUrl"];
|
||
Func<string, string> P = (path) => $"{baseUrl}{path}";
|
||
}
|
||
<div id="loading">
|
||
<div class="loader">
|
||
<div class="loader-inner">
|
||
<div class="loader-line-wrap">
|
||
<div class="loader-line"></div>
|
||
</div>
|
||
<div class="loader-line-wrap">
|
||
<div class="loader-line"></div>
|
||
</div>
|
||
<div class="loader-line-wrap">
|
||
<div class="loader-line"></div>
|
||
</div>
|
||
<div class="loader-line-wrap">
|
||
<div class="loader-line"></div>
|
||
</div>
|
||
<div class="loader-line-wrap">
|
||
<div class="loader-line"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<style>
|
||
.loader {
|
||
background: #000;
|
||
background: radial-gradient(#222, #000);
|
||
bottom: 0;
|
||
left: 0;
|
||
overflow: hidden;
|
||
position: fixed;
|
||
right: 0;
|
||
top: 0;
|
||
z-index: 99999;
|
||
}
|
||
|
||
.loader-inner {
|
||
bottom: 0;
|
||
height: 60px;
|
||
left: 0;
|
||
margin: auto;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
width: 100px;
|
||
}
|
||
|
||
.loader-line-wrap {
|
||
animation:
|
||
spin 2000ms cubic-bezier(.175, .885, .32, 1.275) infinite
|
||
;
|
||
box-sizing: border-box;
|
||
height: 50px;
|
||
left: 0;
|
||
overflow: hidden;
|
||
position: absolute;
|
||
top: 0;
|
||
transform-origin: 50% 100%;
|
||
width: 100px;
|
||
}
|
||
.loader-line {
|
||
border: 4px solid transparent;
|
||
border-radius: 100%;
|
||
box-sizing: border-box;
|
||
height: 100px;
|
||
left: 0;
|
||
margin: 0 auto;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
width: 100px;
|
||
}
|
||
.loader-line-wrap:nth-child(1) { animation-delay: -50ms; }
|
||
.loader-line-wrap:nth-child(2) { animation-delay: -100ms; }
|
||
.loader-line-wrap:nth-child(3) { animation-delay: -150ms; }
|
||
.loader-line-wrap:nth-child(4) { animation-delay: -200ms; }
|
||
.loader-line-wrap:nth-child(5) { animation-delay: -250ms; }
|
||
|
||
.loader-line-wrap:nth-child(1) .loader-line {
|
||
border-color: hsl(0, 80%, 60%);
|
||
height: 90px;
|
||
width: 90px;
|
||
top: 7px;
|
||
}
|
||
.loader-line-wrap:nth-child(2) .loader-line {
|
||
border-color: hsl(60, 80%, 60%);
|
||
height: 76px;
|
||
width: 76px;
|
||
top: 14px;
|
||
}
|
||
.loader-line-wrap:nth-child(3) .loader-line {
|
||
border-color: hsl(120, 80%, 60%);
|
||
height: 62px;
|
||
width: 62px;
|
||
top: 21px;
|
||
}
|
||
.loader-line-wrap:nth-child(4) .loader-line {
|
||
border-color: hsl(180, 80%, 60%);
|
||
height: 48px;
|
||
width: 48px;
|
||
top: 28px;
|
||
}
|
||
.loader-line-wrap:nth-child(5) .loader-line {
|
||
border-color: hsl(240, 80%, 60%);
|
||
height: 34px;
|
||
width: 34px;
|
||
top: 35px;
|
||
}
|
||
|
||
@@keyframes spin {
|
||
0%, 15% {
|
||
transform: rotate(0);
|
||
}
|
||
100% {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
</style>
|
||
|
||
<div class="cpBanner" style="background:#03162a;display:none;">
|
||
|
||
<div class="row" style="color:white;width:calc(100vw-1px);">
|
||
<div class="col-md-12 text-center" style="padding:2% ;">
|
||
<h4>需求五个以上、可联系右侧客服设置优惠价</h4>
|
||
<p>动态IP销量排名NO.1<br>
|
||
十余种全网知名旗舰产品低价热销、
|
||
节点多、稳定、靠谱、单人单线
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="cpNav" style="margin-top:4.7em;">
|
||
<div class="item">
|
||
<ul class="nav nav-tabs cpName" role="tablist" style="margin-top:calc(26vh);">
|
||
<li>
|
||
<a style="color:#0098fb;border:1px solid #99CCFF"><span class="glyphicon glyphicon-arrow-down"></span>动态独享IP<span class="glyphicon glyphicon-arrow-down"></span></a>
|
||
</li>
|
||
@foreach (var item in Model)
|
||
{
|
||
if(item.Product.Id == 18) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF"><span style="color: #f64e3d;font-weight:bold;padding-right: 5px;">送</span>@item.Product.Name<span style="color: #f64e3d;font-weight:bold;float:right;padding-right: 5px;">最快</span></a>
|
||
</li>
|
||
} else if(item.Product.Id == 14) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" id="p14" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name</a>
|
||
</li>
|
||
}else if(item.Product.Id == 26) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" id="p26" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name<span style="color: #f64e3d;font-weight:bold;float:right;padding-right: 5px;">新</span></a>
|
||
</li>
|
||
}else if(item.Product.Id == 27) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" id="p27" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name<span style="color: #f64e3d;font-weight:bold;float:right;padding-right: 5px;">新</span></a>
|
||
</li>
|
||
}else if(item.Product.Id == 6) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" id="p6" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name<span style="color: #f64e3d;font-weight:bold;float:right;padding-right: 5px;">新</span></a>
|
||
</li>
|
||
}
|
||
else if(item.Product.Id == 22) {
|
||
<li >
|
||
<a style="color:#0098fb;border:1px solid #99CCFF"><span class="glyphicon glyphicon-arrow-down"></span>静态IP<span class="glyphicon glyphicon-arrow-down"></span></a>
|
||
</li>
|
||
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" role="tab" class="click_product" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name </a>
|
||
</li>
|
||
}
|
||
else if(item.Product.Id == 21) {
|
||
|
||
<li >
|
||
<a style="color:#0098fb;border:1px solid #99CCFF"><span class="glyphicon glyphicon-arrow-down"></span>单窗口单IP<span class="glyphicon glyphicon-arrow-down"></span></a>
|
||
</li>
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" role="tab" class="click_product" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name </a>
|
||
</li>
|
||
} else if(item.Product.Id == 28) {
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" id="p28" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name<span style="color: #f64e3d;font-weight:bold;float:right;padding-right: 5px;">新</span></a>
|
||
</li>
|
||
} else {
|
||
|
||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||
<a href="#@item.Product.Id" class="click_product" role="tab" data-toggle="tab" style="font-size: 25px;border:1px solid #99CCFF">@item.Product.Name </a>
|
||
</li>
|
||
}
|
||
}
|
||
</ul>
|
||
</div>
|
||
<div class="item">
|
||
<div class="tab-content">
|
||
@foreach (var item in Model)
|
||
{
|
||
<div role="tabpanel" class="tab-pane @(item.Product.Id==defaultProduct.Id?"active":"")" id="@item.Product.Id">
|
||
<div style="fonft-size:1.2em;float:left;position: relative;top: calc(-2vh);left: -47%;height:calc(26vh);line-height:1.2em;width:calc(100vw);overflow:hidden;background:rgb(57, 81, 107);color:#FFFFFF;">
|
||
<p class="texing text-center" style="color:#009933;border:none;">@item.Product.Name 简介</p>
|
||
<hr>
|
||
<ul class="texingList" style="padding-bottom:0;">
|
||
@foreach (var str in item.Product.ContentLine)
|
||
{
|
||
<li style="padding:5px;">·@str</li>
|
||
}
|
||
</ul>
|
||
|
||
<p class=" text-center" style="color:#FF9933">需求五个以上、可联系右侧客服设置优惠价</p>
|
||
</div>
|
||
<div style="margin-top:calc(2vh);">
|
||
|
||
@if (item.Product.Id == 14){
|
||
<div class="p_type @("type"+item.Product.Id)" style="padding-top: 10px;">
|
||
<button type="button" onclick="ttzhizun()" class="btn btn-default btn-lg ttzx" style="background-color: #FF9900;font-size:1.3em;">尊享版-不限速</button>
|
||
<button type="button" onclick="ttgaoji()" class="btn btn-default btn-lg ttgj" style="background-color: white;font-size:1.3em;">高级版-限速4M</button><br>
|
||
<button type="button" onclick="ttputong()" class="btn btn-default btn-lg ttpt" style="background-color: white;font-size:1.3em;margin-top:10px;">普通版-限速2M</button>
|
||
</div>
|
||
}
|
||
@if (item.Product.Id == 26){
|
||
<div class="p_type @("type"+item.Product.Id)" style="padding-top: 10px;">
|
||
<button type="button" onclick="lbzhizun()" class="btn btn-default btn-lg lbzx" style="background-color: #FF9900;font-size:1.3em;">尊享版-不限速</button>
|
||
<button type="button" onclick="lbgaoji()" class="btn btn-default btn-lg lbgj" style="background-color: white;font-size:1.3em;">高级版-限速4M</button><br>
|
||
<button type="button" onclick="lbputong()" class="btn btn-default btn-lg lbpt" style="background-color: white;font-size:1.3em;margin-top:10px;">普通版-限速2M</button>
|
||
</div>
|
||
}
|
||
@if (item.Product.Id == 27){
|
||
<div class="p_type @("type"+item.Product.Id)" style="padding-top: 10px;">
|
||
<button type="button" onclick="qldt1()" class="btn btn-default btn-lg qldt1" style="background-color: #FF9900;font-size:1.3em;float:left;margin:5px;">2M</button>
|
||
<button type="button" onclick="qldt5()" class="btn btn-default btn-lg qldt5" style="background-color: white;font-size:1.3em;float:left;margin:5px;">5M</button><br>
|
||
<button type="button" onclick="qldt10()" class="btn btn-default btn-lg qldt10" style="background-color: white;font-size:1.3em;float:left;margin:5px;">10M</button><br>
|
||
<button type="button" onclick="qldt20()" class="btn btn-default btn-lg qldt20" style="background-color: white;font-size:1.3em;float:left;margin:5px;">20M</button>
|
||
</div>
|
||
}
|
||
@if (item.Product.Id == 6){
|
||
<div class="p_type @("type"+item.Product.Id)" style="padding-top: 10px;">
|
||
<button type="button" onclick="xfgaoji()" class="btn btn-default btn-lg xfgj" style="background-color: #FF9900;font-size:1.3em;">高级-6M</button>
|
||
<button type="button" onclick="xfduxiang()" class="btn btn-default btn-lg xfdx" style="background-color: white;font-size:1.3em;">优享-10M</button><br>
|
||
|
||
</div>
|
||
}
|
||
|
||
@if (item.Product.Id == 20) {
|
||
<div style="margin: 5px;">
|
||
<button type="button" onclick="wjdxphone()" id="dxaz" class="btn btn-default btn-lg" style="background-color: white;font-size:1.5em;">安卓/苹果</button>
|
||
<button type="button" onclick="wjdxpc()" id="dxdn" class="btn btn-default btn-lg" style="background-color: white;font-size:1.5em;">电脑</button>
|
||
|
||
</div>
|
||
<div style="margin: 5px;">
|
||
<button type="button" onclick="wjdxpt()" id="dxpt" class="btn btn-default btn-lg" style="background-color: #FF9900;font-size:1.5em;">普通版-5兆</button>
|
||
<button type="button" onclick="wjdxgj()" id="dxgj" class="btn btn-default btn-lg" style="background-color: white;font-size:1.5em;">高端版-10兆</button>
|
||
</div>
|
||
}
|
||
|
||
@if (item.Product.Id == 21) {
|
||
<div style="margin: 5px;">
|
||
<button type="button" onclick="wjgxphone()" id="gxaz" class="btn btn-default btn-lg" style="background-color: #FF9900;font-size:1.5em;">安卓/苹果</button>
|
||
<button type="button" onclick="wjgxpc()" id="gxdn" class="btn btn-default btn-lg" style="background-color: white;font-size:1.5em;">电脑</button>
|
||
</div>
|
||
<div style="margin: 5px;">
|
||
<button type="button" onclick="wjgxpt()" id="gxpt" class="btn btn-default btn-lg" style="background-color: #FF9900;font-size:1.5em;">普通版</button>
|
||
<button type="button" onclick="wjgxgj()" id="gxgj" class="btn btn-default btn-lg" style="background-color: white;font-size:1.5em;">极速版</button>
|
||
</div>
|
||
}
|
||
@if(item.Product.Id != 28){
|
||
@foreach (var package in item.Packages.Where(m => m.Status == 1&&(m.TenantId==1157||m.TenantId==9999||m.TenantId==10000)).OrderBy(m => m.TenantId))
|
||
{
|
||
if (package.IsTest == 1 &&package.Id != 89&&package.Id != 1034&&package.Id != 1040&&package.Id != 1094&&package.Id != 1097&&package.Id != 60&&package.Id != 1114)
|
||
{
|
||
<a asp-action="test" id="@("package-"+package.Id)" asp-controller="product" asp-route-id="@package.ProductId">
|
||
<div class="card color_2">
|
||
<div class="item">
|
||
<p style="font-size: 35px;color:#FFFF00;">@package.Name</p>
|
||
<p>@package.Profile</p>
|
||
</div>
|
||
<div class="item">
|
||
<p>¥<span>0.00</span></p>
|
||
<p style="color: #FF9900;text-decoration: line-through">原价：@package.LinePrice 元</p>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
}
|
||
|
||
else
|
||
{
|
||
@if(package.Price == 0.1M){
|
||
<a asp-action="buy" id="@("package-"+package.Id)" asp-controller="product" asp-route-id="@package.Id">
|
||
<div class="card color_2">
|
||
<div class="item">
|
||
<p style="font-size: 35px;color:#FFFF00;">@package.Name 首单</p>
|
||
<p>@package.Profile</p>
|
||
</div>
|
||
<div class="item">
|
||
<p>¥<span>@package.Price</span></p>
|
||
<p style="color: #FF9900;text-decoration: line-through">原价：@package.LinePrice 元</p>
|
||
|
||
</div>
|
||
</div>
|
||
</a>
|
||
} else if((package.Id == 89||package.Id == 1034||package.Id == 1040||package.Id == 1094||package.Id == 1097||package.Id == 1103||package.Id == 60||package.Id == 1114)&&package.IsTest==1){
|
||
<a asp-action="test" id="@("package-"+package.Id)" asp-controller="product" asp-route-id="@package.Id">
|
||
<div class="card color_2">
|
||
<div class="item">
|
||
<p style="font-size: 35px;color:#FFFF00;">@package.Name</p>
|
||
<p>@package.Profile</p>
|
||
</div>
|
||
<div class="item">
|
||
<p>¥<span>0.00</span></p>
|
||
<p style="color: #FF9900;text-decoration: line-through">原价：@package.LinePrice 元</p>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
}
|
||
else {
|
||
<a asp-action="buy" id="@("package-"+package.Id)" asp-controller="product" asp-route-id="@package.Id">
|
||
<div class="card color_2">
|
||
<div class="item">
|
||
<p style="font-size: 35px;color:#FFFF00;">@package.Name</p>
|
||
<p>@package.Profile</p>
|
||
</div>
|
||
<div class="item">
|
||
|
||
@if((package.Id == 64||package.Id == 1004)&&package.Price<60){
|
||
<p>¥<span>60.00</span></p>
|
||
} else {
|
||
<p>¥<span>@package.Price</span></p>
|
||
}
|
||
<p style="color: #FF9900;text-decoration: line-through">原价：@package.LinePrice 元</p>
|
||
</div>
|
||
</div>
|
||
</a>
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</div>
|
||
</div>
|
||
}
|
||
|
||
|
||
<div id="app" class="qilinjingtai" style="display:none;">
|
||
|
||
<div class="col-sm-10 col-md-6 margin-top-30">
|
||
<div class="panel panel-info relative">
|
||
<div class="panel-heading">
|
||
<h3 class="text-center">拨号线路(静态)</h3>
|
||
</div>
|
||
<div class="row text-center" style="margin:0;">
|
||
<div class="col-sm-6" style="padding:10px 0;margin:0;">
|
||
<h4 style="padding:10px;color:#00a63f;">静态专线介绍</h4>
|
||
<p>运营商专线宽带,自营机房<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>大出口流量,直播/游戏首选<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>全新vpn隧道,安全可靠<span class="glyphicon glyphicon-ok " style=" color:#00a63f; float:right;"></span></p>
|
||
<p>全局代理不易发现<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>IP周期性变化<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>精选超20000条不同线路<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>Ros/爱快/路由器/手机/电脑<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>华为级维护专员7*24小时服务<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
</div>
|
||
<div class="col-sm-6" style="background:#ccc;padding:10px 0;">
|
||
<h4 style="padding:10px;color:#00a63f;">传统socks5</h4>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span> 天翼云,各种云线路</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>低带宽出口,共享严重,线路拥挤</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>传统协议,波动大,延迟大</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>系统局部代理,易发现,易封号</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>-</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>容量一般只有2-3000线路</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>电脑/手机</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>售后困难,处理时间漫长</p>
|
||
</div>
|
||
</div>
|
||
<div v-on:click="qilinjt()" class="panel-footer text-center " style="background-color:#00a63f;color:white;padding:20px;font-size:20px;cursor: pointer">
|
||
立即购买
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-sm-10 col-md-6 margin-top-30">
|
||
<div class="panel panel-info relative">
|
||
<div class="panel-heading">
|
||
<h3 class="text-center">水滴专线(固态)</h3>
|
||
</div>
|
||
<div class="row text-center" style="padding:0;margin:0;">
|
||
<div class="col-sm-6" style="padding:10px 0 0 0;">
|
||
<h4 style="padding:10px;color:#00a63f;">固态专线介绍</h4>
|
||
<p>运营商专线宽带,更稳定<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>全新vpn隧道,安全可靠<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>全局代理,为游戏而生<span class="glyphicon glyphicon-ok " style=" color:#00a63f; float:right;"></span></p>
|
||
<p>IP永久固定不变<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>精选超10000条不同线路<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>Ros/爱快/路由器/手机/电脑<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p>华为级维护专员7*24小时服务<span class="glyphicon glyphicon-ok" style=" color:#00a63f; float:right;"></span></p>
|
||
<p> </p>
|
||
</div>
|
||
<div class="col-sm-6" style="background:#ccc;padding:10px 0 0 0;">
|
||
<h4 style="padding:10px;color:#00a63f;">传统socks5</h4>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span> 天翼云,各种云线路</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>传统socks5协议,波动大,延迟大</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>系统局部代理,易发现,易封号</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>-</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>容量一般只有2-3000线路</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>电脑/手机</p>
|
||
<p><span class="glyphicon glyphicon-remove" style=" color:red; float:left;"></span>售后困难,处理时间漫长</p>
|
||
<p> </p>
|
||
</div>
|
||
</div>
|
||
<div v-on:click="qilingt()" class="panel-footer text-center " style="background-color:#00a63f;color:white;padding:20px;font-size:20px;cursor: pointer">
|
||
立即购买
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Modal -->
|
||
<div class="modal fade" id="pay_qilin" data-backdrop="static" style="z-index:10000;margin-top:30%" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||
<h4 class="modal-title text-center" id="myModalLabel">水滴-购买支付</h4>
|
||
</div>
|
||
<div class="modal-body text-center">
|
||
<p>购买账号数量:{{order_info.buy_num}} 待支付金额:￥{{order_info.price}}</p>
|
||
<p>我的余额:￥ @(restAmout) <a href="/User/Index">前往充值</a></p>
|
||
<p>
|
||
<input id="balance_s1" type="radio" v-model="order_info.pay_type" name="OPayType" value="10" > <label for="balance_s1">余额支付</label> <br>
|
||
<input id="zhifubaopay_s1" type="radio" v-model="order_info.pay_type" name="OPayType" value="100" checked ><label for="zhifubaopay_s1"> <img src="~/img/zfb.png">支付宝支付</label> <br>
|
||
<input id="weixinpay_s1" type="radio" v-model="order_info.pay_type" name="OPayType" value="70" > <label for="weixinpay_s1"><img src="~/img/wx.png">微信支付</label>
|
||
</p>
|
||
<p><button class="btn btn-success btn-lg" v-on:click="pay()">确认支付</button></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="modal fade" id="staticBackdrop" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
|
||
<div class="modal-dialog">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h5 class="modal-title" id="staticBackdropLabel">微信扫码支付</h5>
|
||
</div>
|
||
<div class="modal-body" id="qrcode_s" style="margin: 0 auto;">
|
||
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" v-on:click="verifyed" class="btn btn-success btn-lg">我已付款</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="alipay"></div>
|
||
<div class="modal fade" id="qilinbuy" style="margin:10px;" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
|
||
<div class="modal-dialog" style="width:100%;" role="document">
|
||
<div class="modal-content" style="width:100%">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||
<h4 class="modal-title text-center" id="myModalLabel">{{qilin.title}}</h4>
|
||
</div>
|
||
<div class="modal-body ">
|
||
<div class="row">
|
||
<div class="col-sm-12 col-md-4" style="border:1px solid #ccc;line-height:200%;">
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
套餐类型：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div class="btn-group" role="group" aria-label="...">
|
||
<button type="button" id="jinyougame" v-on:click="game()" class="btn btn-success btn-lg">游戏独享</button>
|
||
<button type="button" id="jinyouline" v-on:click="line()" class="btn btn-default btn-lg">线路独享</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row " style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
游戏选择：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<select class="form-control " v-model="qilin.game_id" id="gameselect" @@change="select_game" style="height:50px;font-size:15px;">
|
||
<option value="0">-请选择游戏-</option>
|
||
<option v-for="item in game_list" :value="item.id">{{item.name}}</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
线路品质：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
优质尊享
|
||
</div>
|
||
</div>
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
购买数量：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div class="col-sm-10">
|
||
<input type="number" v-model="order_info.buy_num" @@change="change_num()" min=1 class="form-control" value="1">
|
||
</div>
|
||
<div class="col-sm-2" title="1.这里输入的数量可以大于等于右侧指定地区输入框中的数量总和
|
||
|
||
例如：左侧输入100条，右侧只选中了一个地区并设定了20条，那么剩余80条将平均分配至未选择的区域。
|
||
|
||
2.右侧地区不是必填的，用户不手动分配地区，那么将由系统自动分配。">
|
||
<span class="glyphicon glyphicon-question-sign"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
账户余额：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
￥@restAmout
|
||
</div>
|
||
</div>
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
账号：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div class="col-sm-10">
|
||
<input type="text" v-model="order_info.account" class="form-control" placeholder="请输入账号">
|
||
</div>
|
||
<div class="col-sm-2" title="
|
||
1.若购买数量大于1，则系统将根据用户所填账户内容生成批量账户
|
||
|
||
2.示例：填写 zhangsan，购买数量20，则会生成zhangsan1-zhangsan20">
|
||
<span class="glyphicon glyphicon-question-sign"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row" style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
密码：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div class="col-sm-10">
|
||
<input type="text" v-model="order_info.password" class="form-control" placeholder="请输入密码">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div class="col-sm-12 col-md-8" >
|
||
<div style="border:1px solid #ccc;margin-left:3px;">
|
||
<div class="row" >
|
||
<div class="input-group col-sm-12" style="float:left;margin-left:15px;margin-top:5px;">
|
||
可用节点总数：{{province_city.surplus_out_total}}
|
||
</div>
|
||
</div>
|
||
<div class="row ">
|
||
<div class="col-sm-3 text-center" style="height:470px;overflow:auto;overflow-x: hidden;">
|
||
<label style="border:1px solid #00a63f;padding:3px;width:100%;margin:2px;"><input checked name="allprovince" @@change="select_all_province()" type="checkbox"> 全部</label>
|
||
<label v-for="(item,index) in province_city.province_surplus_outs" :key="index" style="border:1px solid #00a63f;padding:3px;width:100%;margin:2px"><input v-model="province" name="province" :value="index" type="checkbox" @@change="select_province()">{{item.en_name}}({{item.total}})</label>
|
||
</div>
|
||
<div class="col-sm-9" style="font-size:15px;height:453px;overflow:auto;">
|
||
<div class="col-sm-4 diqu" v-for="item in citys" style="padding:5px;">
|
||
<div style="border:1px solid #ddd;padding:5px;">
|
||
<p v-if="item.isp_class == 0" style="padding:0;margin:0;white-space: nowrap;overflow:hidden;"><span class="glyphicon glyphicon-asterisk " style="color:#00a63f;overflow:hidden;"></span>[多线]{{item.name}}</p>
|
||
<p v-else-if="item.isp_class == 1" style="padding:0;margin:0;white-space: nowrap;overflow:hidden;"><span class="glyphicon glyphicon-asterisk " style="color:#00a63f;overflow:hidden;"></span>[电信]{{item.name}}</p>
|
||
<p v-else-if="item.isp_class == 2" style="padding:0;margin:0;white-space: nowrap;overflow:hidden;"><span class="glyphicon glyphicon-asterisk " style="color:#00a63f;overflow:hidden;"></span>[联通]{{item.name}}</p>
|
||
<p v-else-if="item.isp_class == 3" style="padding:0;margin:0;white-space: nowrap;overflow:hidden;"><span class="glyphicon glyphicon-asterisk " style="color:#00a63f;overflow:hidden;"></span>[移动]{{item.name}}</p>
|
||
<p v-else style="padding:0;margin:0;white-space: nowrap;overflow:hidden;"><span class="glyphicon glyphicon-asterisk " style="color:#00a63f;overflow:hidden;"></span>[未知]{{item.name}}</p>
|
||
<hr style="margin:0;">
|
||
<p style="padding:0;margin:0;">余量:{{item.total}} 延迟:{{item.ping}}ms</p>
|
||
<p style="padding:0;margin:0;">分配数量:<input type="number" min=0 value="0" :class="item.province+'-'+item.city+'-'+item.rid+'-100'" @@change="selsect_adddr_num(item.province+'-'+item.city+'-'+item.rid+'-100',item.total)" :max="item.total" style="width:50%;color:black;background:white;"></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="border:1px solid #ccc;margin-left:3px;margin-top:5px;">
|
||
<div class="row " style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
带宽选择：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div v-if="this.qilin.is_unshar == 0" class="btn-group" role="group" aria-label="...">
|
||
<button v-for="(item,index) in package_list.game" :key="index" :class="'package-type-game-'+index" v-on:click="package_click('package-type-game-'+index,'game')" type="button" class="btn btn-default btn-lg">
|
||
<span v-if="index == 'test'">测试</span>
|
||
<span v-else>{{index}}</span>
|
||
</button>
|
||
</div>
|
||
|
||
<div v-if="this.qilin.is_unshar == 1" class="btn-group" role="group" aria-label="...">
|
||
<button v-for="(item,index) in package_list.line" :key="index" :class="'package-type-line-'+index" v-on:click="package_click('package-type-line-'+index,'line')" type="button" class="btn btn-default btn-lg">
|
||
<span v-if="index == 'test'">测试</span>
|
||
<span v-else>{{index}}</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row " style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
时长选择：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<div class="btn-group" role="group" aria-label="...">
|
||
<button v-for="item in package_info_list" type="button" :class="'package-name-'+item.Id" v-on:click="package_name_click('package-name-'+item.Id,item.Id)" class="btn btn-default btn-lg">{{item.package_name}}</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row " style="padding:5px;">
|
||
<div class="col-sm-3">
|
||
应付金额：
|
||
</div>
|
||
<div class="col-sm-9">
|
||
<span>￥{{order_info.price}}</span>
|
||
<button style="float:right;margin-right:50px;" v-on:click="pay_page()" class="btn btn-success btn-lg">购买</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row" v-if="qilin.product_id == 2">
|
||
<div class="col-sm-12" style="background-color:rgb(209 236 241);padding:10px;margin:10px 0">
|
||
<p>专享专线：稳定、安全，上下行同速，告别游戏延迟、卡顿。IP将长久有效<span style="color:red;">IP不变化</span>。</p>
|
||
<p>线路品质：尊享 > 砖石 > 白金 > 黄金 > 青铜，线路等级越高线路质量越好</p>
|
||
</div>
|
||
|
||
<div class="col-sm-12" style="background-color:rgb(209 236 241);padding:10px;margin:10px 0">
|
||
<p>游戏独享:单个游戏所用IP保证在IP池内不会出现同款游戏使用相同IP,游戏真实独享。</p>
|
||
<p>线路独享:个人独享整个线路,真实独享,永远不重复。</p>
|
||
<p style="color:red;">线路切换单日限制为20次</p>
|
||
<p style="color:red;">如果没有自己想用的地区线路或线路余量不足，请联系客服上架</p>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="row" v-if="qilin.product_id == 1">
|
||
<div class="col-sm-12" style="background-color:rgb(209 236 241);padding:10px;margin:10px 0">
|
||
<p>静态线路：稳定、安全，高带宽出口，游戏、直播全搞定。IP<span style="color:red;">3-7</span>天周期性变化。</p>
|
||
<p>线路品质：尊享 > 砖石 > 白金 > 黄金 > 青铜，线路等级越高线路质量越好</p>
|
||
</div>
|
||
|
||
<div class="col-sm-12" style="background-color:rgb(209 236 241);padding:10px;margin:10px 0">
|
||
<p>游戏独享:单个游戏所用IP保证在IP池内不会出现同款游戏使用相同IP,游戏真实独享。</p>
|
||
<p>线路独享:个人独享整个线路,真实独享,永远不重复。</p>
|
||
<p style="color:red;">线路切换单日限制为20次</p>
|
||
<p style="color:red;">如果没有自己想用的地区线路或线路余量不足，请联系客服上架</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<script src="~/js/vue.js"></script>
|
||
<script type="text/javascript">
|
||
var app = new Vue({
|
||
el: '#app',
|
||
data: {
|
||
qilin:{
|
||
'title':'购买水滴专线-固态',
|
||
'is_unshar':0, // 0 游戏独享 1 线路独享
|
||
'game_id':0,
|
||
'product_id':1,//1静态 2固态
|
||
},
|
||
game_list:[],
|
||
province_city:{},
|
||
province:[],
|
||
citys:[],
|
||
package_list:[],
|
||
package_info_list:[],
|
||
order_info:{
|
||
pay_type:10,
|
||
type:0,//类型,0:静态;1:专线;
|
||
package_id:'',
|
||
game_id:'',
|
||
buy_num:1,
|
||
price:'',
|
||
account:'',
|
||
password:'',
|
||
product_info:[]
|
||
},
|
||
},
|
||
computed: {
|
||
|
||
},
|
||
watch: {
|
||
|
||
},
|
||
created: function () {
|
||
this.order_info.account = this.randomString(2) + (Math.floor(Math.random() * 1000) + 1);
|
||
this.order_info.password = (Math.floor(Math.random() * 1000) + 1);
|
||
},
|
||
methods: {
|
||
randomString(len) {
|
||
len = len || 32;
|
||
var $chars = 'abcdefhijkmnprstwxy';
|
||
var maxPos = $chars.length;
|
||
var pwd = '';
|
||
for (i = 0; i < len; i++) {
|
||
pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
|
||
}
|
||
return pwd;
|
||
},
|
||
qilinjt() {
|
||
$('#qilinbuy').modal('show');
|
||
this.qilin.title = "购买拨号线路-静态"
|
||
this.qilin.product_id = 1
|
||
this.order_info.type = 0;
|
||
this.order_info.package_id = '';
|
||
this.order_info.product_info = [];
|
||
this.game();
|
||
this.get_package();
|
||
},
|
||
qilingt() {
|
||
$('#qilinbuy').modal('show');
|
||
this.qilin.title = "购买水滴专线-固态"
|
||
this.qilin.product_id = 2
|
||
this.order_info.type = 1;
|
||
this.order_info.package_id = '';
|
||
this.order_info.product_info = [];
|
||
this.game();
|
||
this.get_package();
|
||
},
|
||
get_package(){
|
||
|
||
let data = {
|
||
cookie:document.cookie,
|
||
}
|
||
|
||
var url = 'http://php-api.juip.com/jinyou/api/getPackage?type=';
|
||
|
||
if ( @(userid) != 0 ) {
|
||
url = 'http://php-api.juip.com/jinyou/Jinyoujt/getPackage?type=';
|
||
}
|
||
|
||
var that = this;
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: url+this.qilin.product_id,
|
||
dataType: "json",
|
||
data: JSON.stringify(data),
|
||
beforeSend: function(xhr) {
|
||
xhr.withCredentials = true;
|
||
},
|
||
crossDomain: true,
|
||
success: function (res) {
|
||
that.package_list = res.data;
|
||
}
|
||
});
|
||
},
|
||
package_click(cls,type) {
|
||
this.package_info_list = [];
|
||
this.order_info.package_id = '';
|
||
var package_name = cls.split('-');
|
||
if (type == 'game') {
|
||
for (var i in this.package_list.game) {
|
||
if ( @(resttime) < 1) {
|
||
this.package_list.game.test[0].Price = 1;
|
||
}
|
||
$('.package-type-game-'+i).addClass('btn-default');
|
||
$('.package-type-game-'+i).removeClass(' btn-success');
|
||
if (i == package_name[3]) {
|
||
this.package_info_list = this.package_list.game[i];
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
|
||
if (type == 'line') {
|
||
if ( @(resttime) < 1) {
|
||
this.package_list.line.test[0].Price = 1;
|
||
}
|
||
for (var i in this.package_list.line) {
|
||
$('.package-type-line-'+i).addClass('btn-default');
|
||
$('.package-type-line-'+i).removeClass(' btn-success');
|
||
if (i == package_name[3]) {
|
||
this.package_info_list = this.package_list.line[i];
|
||
}
|
||
}
|
||
}
|
||
$("."+cls).addClass(' btn-success');
|
||
$("."+cls).removeClass("btn-default");
|
||
},
|
||
package_name_click(package_name,package_id) {
|
||
this.order_info.package_id = package_id;
|
||
for (var i in this.package_info_list) {
|
||
$('.package-name-'+this.package_info_list[i].Id).addClass('btn-default');
|
||
$('.package-name-'+this.package_info_list[i].Id).removeClass(' btn-success');
|
||
if (this.package_info_list[i].Id == package_id) {
|
||
this.order_info.price = this.package_info_list[i].Price * this.order_info.buy_num;
|
||
}
|
||
}
|
||
$("."+package_name).addClass(' btn-success');
|
||
$("."+package_name).removeClass("btn-default");
|
||
},
|
||
change_num() {
|
||
for (var i in this.package_info_list) {
|
||
if (this.package_info_list[i].Id == this.order_info.package_id) {
|
||
this.order_info.price = this.package_info_list[i].Price * this.order_info.buy_num;
|
||
}
|
||
}
|
||
},
|
||
selsect_adddr_num(addr_id,total) {
|
||
var num = $("."+addr_id).val();
|
||
if (num>total) {
|
||
num =total;
|
||
$("."+addr_id).val(num)
|
||
}
|
||
this.order_info.product_info[addr_id] = num;
|
||
this.order_info.product_info = {...this.order_info.product_info};
|
||
|
||
let all_add_num = 0;
|
||
for (var i in this.order_info.product_info) {
|
||
all_add_num += parseInt(this.order_info.product_info[i]);
|
||
}
|
||
if (this.order_info.buy_num<all_add_num) {
|
||
this.order_info.buy_num = all_add_num;
|
||
}
|
||
|
||
for (var i in this.package_info_list) {
|
||
if (this.package_info_list[i].Id == this.order_info.package_id) {
|
||
this.order_info.price = this.package_info_list[i].Price * this.order_info.buy_num;
|
||
}
|
||
}
|
||
},
|
||
game() {
|
||
this.qilin.is_unshar = 0;
|
||
$("#jinyougame").removeClass("btn-default");
|
||
$("#jinyougame").addClass(" btn-success");
|
||
$("#jinyouline").removeClass(" btn-success");
|
||
$("#gameselect").removeAttr('disabled');
|
||
this.order_info.product_info = [];
|
||
this.order_info.package_id = '';
|
||
this.package_info_list = [];
|
||
|
||
var that = this;
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: 'http://php-api.juip.com/jinyou/api/gameList',
|
||
dataType: "json",
|
||
async:false,
|
||
success: function (res) {
|
||
that.game_list = res.data;
|
||
}
|
||
});
|
||
this.select_game()
|
||
},
|
||
line() {
|
||
this.order_info.product_info = [];
|
||
this.qilin.is_unshar = 1;
|
||
this.qilin.game_id = '';
|
||
this.order_info.package_id = '';
|
||
this.package_info_list = [];
|
||
$("#jinyouline").removeClass("btn-default");
|
||
$("#jinyouline").addClass(" btn-success");
|
||
$("#jinyougame").removeClass(" btn-success");
|
||
$("#gameselect").attr('disabled',"true");
|
||
this.select_game()
|
||
},
|
||
select_game() {
|
||
|
||
this.citys = [];
|
||
var that = this;
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: 'http://php-api.juip.com/jinyou/api/regionSurplusOuts?product_id='+this.qilin.product_id+'&is_unshar='+this.qilin.is_unshar+'&game_id='+this.qilin.game_id,
|
||
dataType: "json",
|
||
async:false,
|
||
success: function (res) {
|
||
that.province_city = res.data.region
|
||
}
|
||
});
|
||
|
||
for (var i in this.province_city.province_surplus_outs) {
|
||
this.province.push(i);
|
||
this.citys = this.citys.concat(this.province_city.province_surplus_outs[i].citys);
|
||
}
|
||
this.order_info.game_id = this.qilin.game_id
|
||
},
|
||
select_province() {
|
||
this.citys = [];
|
||
for (var i in this.province_city.province_surplus_outs) {
|
||
if (this.province.includes(i)) {
|
||
this.citys = this.citys.concat(this.province_city.province_surplus_outs[i].citys);
|
||
}
|
||
}
|
||
},
|
||
select_all_province() {
|
||
var checkboxes = document.querySelector('input[name="allprovince"]');
|
||
|
||
if (checkboxes.checked) {
|
||
for (var i in this.province_city.province_surplus_outs) {
|
||
this.province.push(i);
|
||
this.citys = this.citys.concat(this.province_city.province_surplus_outs[i].citys);
|
||
}
|
||
} else {
|
||
this.province = [];
|
||
this.citys = [];
|
||
}
|
||
},
|
||
pay_page(){
|
||
if (this.order_info.package_id == '') {
|
||
alert('请选择套餐！');
|
||
return;
|
||
}
|
||
if (this.order_info.game_id == '' && this.qilin.is_unshar == 0) {
|
||
alert('请选择游戏！');
|
||
return;
|
||
}
|
||
if (this.order_info.account.length < 5 && this.hasNumAndChar(this.order_info.account)) {
|
||
alert('账号长度至少5位！');
|
||
return;
|
||
}
|
||
if (this.order_info.password.length < 3 && this.hasNumAndChar(this.order_info.password)) {
|
||
alert('密码长度至少3位！');
|
||
return;
|
||
}
|
||
|
||
|
||
if (this.order_info.price == 0) {
|
||
this.order_info.pay_type = 10;
|
||
this.pay()
|
||
} else {
|
||
$('#pay_qilin').modal('show');
|
||
}
|
||
},
|
||
pay(){
|
||
let data = {
|
||
cookie:document.cookie,
|
||
order_info: this.order_info
|
||
}
|
||
|
||
console.log(data.order_info);
|
||
console.log(JSON.stringify(data));
|
||
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: 'http://php-api.juip.com/jinyou/jinyoujt/create_order',
|
||
dataType: "json",
|
||
contentType: "application/json",
|
||
data: JSON.stringify(data),
|
||
beforeSend: function(xhr) {
|
||
xhr.withCredentials = true;
|
||
},
|
||
crossDomain: true,
|
||
success: function (res) {
|
||
if (res.code == 1) {
|
||
$('#pay_qilin').modal('hide');
|
||
alert(res.msg);
|
||
window.location.href = "/user/myaccounts";
|
||
} else if (res.code == 2) {
|
||
document.getElementById("alipay").innerHTML=res.data;
|
||
document.forms['alipaysubmit'].submit();
|
||
$('#pay_qilin').modal('hide');
|
||
} else if (res.code == 3) {
|
||
$("#qrcode_s").html('');
|
||
new QRCode(document.getElementById("qrcode_s"), {
|
||
text: res.data,
|
||
width : 300,
|
||
height : 300
|
||
});
|
||
|
||
$('#staticBackdrop').modal('show');
|
||
$('#pay_qilin').modal('hide');
|
||
} else {
|
||
$('#pay_qilin').modal('hide');
|
||
alert(res.msg);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
verifyed() {
|
||
$('#staticBackdrop').modal('hide');
|
||
window.location.href = "/user/myaccounts";
|
||
},
|
||
hasNumAndChar(str) {
|
||
var zg = /^[0-9a-zA-Z]*$/;
|
||
if (!zg.test(str)) {
|
||
return false;
|
||
} else {
|
||
return true;
|
||
}
|
||
},
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<script>
|
||
$(function(){
|
||
setTimeout(function(){
|
||
$("#loading").hide();
|
||
},500);
|
||
});
|
||
|
||
$("#p28").click(function () {
|
||
$(".qilinjingtai").show();
|
||
for (var i=1;i<30;i++){
|
||
$("#p"+i).removeClass("on");
|
||
}
|
||
});
|
||
|
||
$(".click_product").click(function () {
|
||
$(".qilinjingtai").hide();
|
||
});
|
||
|
||
$(".p_type").hide();
|
||
$("#p14").click(function () {
|
||
$(".type14").show();
|
||
$(".type26").hide();
|
||
$(".type6").hide();
|
||
$(".type27").hide();
|
||
$("#package-89").show();
|
||
$("#package-69").show();
|
||
$("#package-70").show();
|
||
$("#package-71").show();
|
||
$("#package-1022").show();
|
||
$("#package-1023").show();
|
||
for (var i=1034;i<1046;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
$(".ttzx").css('background-color','#FF9900');
|
||
$(".ttgj").css('background-color','white');
|
||
$(".ttpt").css('background-color','white');
|
||
|
||
});
|
||
$("#p26").click(function () {
|
||
$(".type14").hide();
|
||
$(".type26").show();
|
||
$(".type6").hide();
|
||
$(".type27").hide();
|
||
|
||
for (var i=1090;i<1097;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1097;i<1109;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
$(".lbzx").css('background-color','#FF9900');
|
||
$(".lbgj").css('background-color','white');
|
||
$(".lbpt").css('background-color','white');
|
||
});
|
||
$("#p27").click(function () {
|
||
$(".type14").hide();
|
||
$(".type26").hide();
|
||
$(".type27").show();
|
||
$(".type6").hide();
|
||
|
||
for (var i=1115;i<1121;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1121;i<1139;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
$(".qldt1").css('background-color','#FF9900');
|
||
$(".qldt5").css('background-color','white');
|
||
$(".qldt10").css('background-color','white');
|
||
$(".qldt20").css('background-color','white');
|
||
});
|
||
$("#p6").click(function () {
|
||
$(".type14").hide();
|
||
$(".type26").hide();
|
||
$(".type6").show();
|
||
$(".type27").hide();
|
||
|
||
$("#package-60").show();
|
||
for (var i=22;i<27;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1109;i<1115;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
$(".xfgj").css('background-color','#FF9900');
|
||
$(".xfdx").css('background-color','white');
|
||
});
|
||
function ttzhizun() {
|
||
$("#package-89").show();
|
||
$("#package-69").show();
|
||
$("#package-70").show();
|
||
$("#package-71").show();
|
||
$("#package-1022").show();
|
||
$("#package-1023").show();
|
||
for (var i=1034;i<1046;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
|
||
$(".ttzx").css('background-color','#FF9900');
|
||
$(".ttgj").css('background-color','white');
|
||
$(".ttpt").css('background-color','white');
|
||
}
|
||
function lbzhizun() {
|
||
for (var i=1090;i<1097;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1097;i<1109;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
|
||
$(".lbzx").css('background-color','#FF9900');
|
||
$(".lbgj").css('background-color','white');
|
||
$(".lbpt").css('background-color','white');
|
||
}
|
||
function ttgaoji() {
|
||
$(".ttgj").css('background-color','#FF9900');
|
||
$(".ttzx").css('background-color','white');
|
||
$(".ttpt").css('background-color','white');
|
||
$("#package-89").hide();
|
||
$("#package-69").hide();
|
||
$("#package-70").hide();
|
||
$("#package-71").hide();
|
||
$("#package-1022").hide();
|
||
$("#package-1023").hide();
|
||
for (var i=1040;i<1046;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1034;i<1040;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
function lbgaoji() {
|
||
$(".lbgj").css('background-color','#FF9900');
|
||
$(".lbzx").css('background-color','white');
|
||
$(".lbpt").css('background-color','white');
|
||
|
||
for (var i=1090;i<1097;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1103;i<1109;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1097;i<1103;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
function ttputong() {
|
||
$(".ttpt").css('background-color','#FF9900');
|
||
$(".ttzx").css('background-color','white');
|
||
$(".ttgj").css('background-color','white');
|
||
$("#package-89").hide();
|
||
$("#package-69").hide();
|
||
$("#package-70").hide();
|
||
$("#package-71").hide();
|
||
$("#package-1022").hide();
|
||
$("#package-1023").hide();
|
||
for (var i=1040;i<1046;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1034;i<1040;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
function lbputong() {
|
||
$(".lbpt").css('background-color','#FF9900');
|
||
$(".lbzx").css('background-color','white');
|
||
$(".lbgj").css('background-color','white');
|
||
|
||
for (var i=1090;i<1097;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1103;i<1109;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1097;i<1103;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
|
||
function qldt1() {
|
||
$(".qldt1").css('background-color','#FF9900');
|
||
$(".qldt5").css('background-color','white');
|
||
$(".qldt10").css('background-color','white');
|
||
$(".qldt20").css('background-color','white');
|
||
for (var i=1115;i<1121;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1121;i<1139;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
|
||
function qldt5() {
|
||
$(".qldt1").css('background-color','white');
|
||
$(".qldt5").css('background-color','#FF9900');
|
||
$(".qldt10").css('background-color','white');
|
||
$(".qldt20").css('background-color','white');
|
||
for (var i=1115;i<1121;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1121;i<1127;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1127;i<1139;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
function qldt10() {
|
||
$(".qldt1").css('background-color','white');
|
||
$(".qldt5").css('background-color','white');
|
||
$(".qldt10").css('background-color','#FF9900');
|
||
$(".qldt20").css('background-color','white');
|
||
for (var i=1115;i<1127;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1127;i<1133;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1133;i<1139;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
function qldt20() {
|
||
$(".qldt1").css('background-color','white');
|
||
$(".qldt5").css('background-color','white');
|
||
$(".qldt10").css('background-color','white');
|
||
$(".qldt20").css('background-color','#FF9900');
|
||
for (var i=1115;i<1133;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1133;i<1139;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
function xfgaoji() {
|
||
$(".xfgj").css('background-color','#FF9900');
|
||
$(".xfdx").css('background-color','white');
|
||
$("#package-60").show();
|
||
for (var i=22;i<27;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1109;i<1115;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
function xfduxiang() {
|
||
$(".xfdx").css('background-color','#FF9900');
|
||
$(".xfgj").css('background-color','white');
|
||
$("#package-60").hide();
|
||
for (var i=22;i<27;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1109;i<1115;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
|
||
var wjdxtype = 1;
|
||
function wjdxphone() {
|
||
$("#dxaz").css('background-color','#FF9900');
|
||
$("#dxdn").css('background-color','white');
|
||
|
||
$("#dxpt").css('background-color','#FF9900');
|
||
$("#dxgj").css('background-color','white');
|
||
wjdxtype = 1;
|
||
for (var i=1048;i<1051;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1051;i<1060;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
wjdxphone();
|
||
|
||
function wjdxpc() {
|
||
$("#dxaz").css('background-color','white');
|
||
$("#dxdn").css('background-color','#FF9900');
|
||
|
||
$("#dxpt").css('background-color','#FF9900');
|
||
$("#dxgj").css('background-color','white');
|
||
wjdxtype = 2;
|
||
for (var i=1048;i<1054;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1057;i<1060;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1054;i<1057;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
function wjdxpt() {
|
||
|
||
$("#dxpt").css('background-color','#FF9900');
|
||
$("#dxgj").css('background-color','white');
|
||
if (wjdxtype == 1) {
|
||
for (var i=1051;i<1060;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1048;i<1051;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
} else if (wjdxtype == 2) {
|
||
for (var i=1048;i<1054;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1054;i<1057;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
|
||
for (var i=1057;i<1060;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
}
|
||
function wjdxgj() {
|
||
|
||
$("#dxpt").css('background-color','white');
|
||
$("#dxgj").css('background-color','#FF9900');
|
||
if (wjdxtype == 1) {
|
||
for (var i=1048;i<1051;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1051;i<1054;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
|
||
for (var i=1054;i<1060;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
} else if (wjdxtype == 2) {
|
||
for (var i=1048;i<1057;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1057;i<1060;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
//1 安卓、苹果 2 pc
|
||
var wjgxtype = 1;
|
||
function wjgxphone() {
|
||
$("#gxaz").css('background-color','#FF9900');
|
||
$("#gxdn").css('background-color','white');
|
||
$("#gxpt").css('background-color','#FF9900');
|
||
$("#gxgj").css('background-color','white');
|
||
$("#wjgxgd").removeClass("active");
|
||
$("#wjgxpt").addClass("active");
|
||
wjgxtype = 1;
|
||
for (var i=1060;i<1063;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1063;i<1072;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
wjgxphone();
|
||
|
||
function wjgxpc() {
|
||
$("#gxaz").css('background-color','white');
|
||
$("#gxdn").css('background-color','#FF9900');
|
||
$("#gxpt").css('background-color','#FF9900');
|
||
$("#gxgj").css('background-color','white');
|
||
$("#wjgxgd").removeClass("active");
|
||
$("#wjgxpt").addClass("active");
|
||
wjgxtype = 2;
|
||
for (var i=1060;i<1066;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1069;i<1072;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1066;i<1069;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
function wjgxpt() {
|
||
$("#gxpt").css('background-color','#FF9900');
|
||
$("#gxgj").css('background-color','white');
|
||
$("#wjgxgd").removeClass("active");
|
||
$("#wjgxpt").addClass("active");
|
||
if (wjgxtype == 1) {
|
||
for (var i=1060;i<1063;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
for (var i=1063;i<1072;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
} else if (wjgxtype == 2) {
|
||
for (var i=1060;i<1066;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1066;i<1069;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
|
||
for (var i=1069;i<1072;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
}
|
||
}
|
||
function wjgxgj() {
|
||
$("#gxpt").css('background-color','white');
|
||
$("#gxgj").css('background-color','#FF9900');
|
||
$("#wjgxgd").addClass("active");
|
||
$("#wjgxpt").removeClass("active");
|
||
if (wjgxtype == 1) {
|
||
for (var i=1060;i<1063;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1063;i<1066;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
|
||
for (var i=1066;i<1072;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
} else if (wjgxtype == 2) {
|
||
for (var i=1060;i<1069;i++){
|
||
$("#package-"+i).hide();
|
||
}
|
||
for (var i=1069;i<1072;i++){
|
||
$("#package-"+i).show();
|
||
}
|
||
}
|
||
}
|
||
</script> |