初始提交
This commit is contained in:
95
Host/Views.Mobile/Product/Index.cshtml
Normal file
95
Host/Views.Mobile/Product/Index.cshtml
Normal file
@@ -0,0 +1,95 @@
|
||||
@using Hncore.Pass.Vpn.Response.Product
|
||||
@using Microsoft.Extensions.Configuration
|
||||
@using Hncore.Pass.BaseInfo.Response
|
||||
@using Hncore.Infrastructure.Serializer;
|
||||
@inject IConfiguration m_Configuration
|
||||
@model List<ProductWithPackageResponse>
|
||||
@{
|
||||
ViewData["Title"] = "购买产品";
|
||||
UserLoginModel user = null;
|
||||
if (this.Context.Request.Cookies.TryGetValue("userInfo", out string userCookie))
|
||||
{
|
||||
user = userCookie.FromJsonTo<UserLoginModel>();
|
||||
}
|
||||
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 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 class="cpBanner">
|
||||
<img src="~/m/img/cpBanner.png">
|
||||
</div>
|
||||
<div class="cpNav">
|
||||
<div class="item">
|
||||
<ul class="nav nav-tabs cpName" role="tablist">
|
||||
@foreach (var item in Model)
|
||||
{
|
||||
<li role="presentation" class="@(item.Product.Id==defaultProduct.Id?"active":"")">
|
||||
<a href="#@item.Product.Id" role="tab" data-toggle="tab">@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">
|
||||
<p class="texing">@item.Product.Name</p>
|
||||
<ul class="texingList">
|
||||
@foreach (var str in item.Product.ContentLine)
|
||||
{
|
||||
<li>·@str</li>
|
||||
}
|
||||
</ul>
|
||||
<p style="color: #ec6e58;font-size:30px;font-weight: bold;">
|
||||
需求5个以上,可联系客服设置优惠价<br />
|
||||
若之前享优惠价,请联系客服帮你改价
|
||||
</p>
|
||||
@foreach (var package in item.Packages.Where(m => m.Status == 1))
|
||||
{
|
||||
if (package.IsTest == 1)
|
||||
{
|
||||
<a asp-action="test" asp-controller="product" asp-route-id="@package.ProductId">
|
||||
<div class="card color_@((item.Packages.IndexOf(package)+1)%5)">
|
||||
<div class="item">
|
||||
<p>@package.Name</p>
|
||||
<p>@(package.DayPrice)元/天</p>
|
||||
<p>@package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p>¥<span>@package.Price</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
else
|
||||
{
|
||||
<a asp-action="buy" asp-controller="product" asp-route-id="@package.Id">
|
||||
<div class="card color_@((item.Packages.IndexOf(package)+1)%5)">
|
||||
<div class="item">
|
||||
<p>@package.Name</p>
|
||||
<p>@(package.DayPrice)元/天</p>
|
||||
<p>@package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p>¥<span>@package.Price</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
60
Host/Views.Mobile/Product/ReBuyIndex.cshtml
Normal file
60
Host/Views.Mobile/Product/ReBuyIndex.cshtml
Normal file
@@ -0,0 +1,60 @@
|
||||
@using Hncore.Pass.Vpn.Response.Product
|
||||
@using Microsoft.Extensions.Configuration
|
||||
@using Hncore.Pass.BaseInfo.Response
|
||||
@using Hncore.Infrastructure.Serializer;
|
||||
@inject IConfiguration m_Configuration
|
||||
@model ProductWithPackageResponse
|
||||
@{
|
||||
ViewData["Title"] = "购买产品";
|
||||
UserLoginModel user = null;
|
||||
if (this.Context.Request.Cookies.TryGetValue("userInfo", out string userCookie))
|
||||
{
|
||||
user = userCookie.FromJsonTo<UserLoginModel>();
|
||||
}
|
||||
var defaultProduct = Model.Product;
|
||||
var defaultPackage = Model.Packages.FirstOrDefault();
|
||||
var baseUrl = m_Configuration["BaseInfoUrl"];
|
||||
Func<string, string> P = (path) => $"{baseUrl}{path}";
|
||||
}
|
||||
|
||||
<div class="cpBanner">
|
||||
<img src="~/m/img/cpBanner.png">
|
||||
</div>
|
||||
<div class="cpNav">
|
||||
<div class="item">
|
||||
<ul class="nav nav-tabs cpName" role="tablist">
|
||||
<li role="presentation" class="active">
|
||||
<a href="#@Model.Product.Id">@Model.Product.Name</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane active" id="@Model.Product.Id">
|
||||
<p class="texing">@Model.Product.Name</p>
|
||||
<ul class="texingList">
|
||||
<p>·不限速,网速最高可达50兆</p>
|
||||
<p>·支持手机,电脑,模拟器</p>
|
||||
<p>·200多个城市+全国混波量ip千万级</p>
|
||||
<p>·带宽6-10兆</p>
|
||||
<p>·断开再链接换ip</p>
|
||||
</ul>
|
||||
@foreach (var package in Model.Packages.Where(m=>m.IsTest==0&&m.Status==1))
|
||||
{
|
||||
<a asp-action="rebuy" asp-controller="Product" asp-route-packageId="@package.Id" asp-route-accounts=@ViewBag.accounts>
|
||||
<div class="card color_@((Model.Packages.IndexOf(package)+1)%5)">
|
||||
<div class="item">
|
||||
<p>@package.Name</p>
|
||||
<p>@(package.DayPrice)元/天</p>
|
||||
<p>@package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p>¥<span>@package.Price</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
36
Host/Views.Mobile/Product/Soft.cshtml
Normal file
36
Host/Views.Mobile/Product/Soft.cshtml
Normal file
@@ -0,0 +1,36 @@
|
||||
@using Hncore.Pass.Vpn.Domain
|
||||
@using Microsoft.Extensions.Configuration
|
||||
@inject IConfiguration m_Configuration
|
||||
@model List<ProductEntity>
|
||||
@{
|
||||
var baseUrl = m_Configuration["BaseInfoUrl"];
|
||||
Func<string, string> P = (path) => $"{baseUrl}{path}";
|
||||
}
|
||||
<div class="container-fluid softBg">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-sm-4">
|
||||
|
||||
</div>
|
||||
<div class="col-sm-4 text-center">
|
||||
<p class="simg"><img src="~/img/img_soft.png"></p>
|
||||
<p class="sintro">软件和账户必须为同一产品才能使用</p>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right">
|
||||
<a href="#" class="jiaocheng">使用教程→</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="softList">
|
||||
@foreach (var item in Model.Where(m=>m.Sort != 1000))
|
||||
{
|
||||
<div class="item">
|
||||
@*<p><img src="@P(item.Image)"></p>*@
|
||||
<p>@item.Name</p>
|
||||
<p><a href="@item.SimulatorDownloadUrl"> <button type="button" class="btnBlue">SSTP客户端下载</button></a></p>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
103
Host/Views.Mobile/Product/Test.cshtml
Normal file
103
Host/Views.Mobile/Product/Test.cshtml
Normal file
@@ -0,0 +1,103 @@
|
||||
@using Hncore.Pass.Vpn.Response.Product
|
||||
@using Hncore.Infrastructure.Extension
|
||||
@using Microsoft.Extensions.Configuration
|
||||
@using Hncore.Infrastructure.Common
|
||||
@model PackageInfoResponse
|
||||
@inject IConfiguration m_Configuration
|
||||
@inject Hncore.Pass.Vpn.Service.ProductAccountService m_AccountService
|
||||
@{
|
||||
ViewData["Title"] = "购买产品";
|
||||
var t = this.Context.Request.GetInt("t");
|
||||
var baseUrl = m_Configuration["BaseInfoUrl"];
|
||||
Func<string, string> P = (path) => $"{baseUrl}{path}";
|
||||
var randomPwd = ValidateCodeHelper.MakeNumCode(3).ToLower();
|
||||
var randomAccount = ValidateCodeHelper.MakeCharCode(2).ToLower() + ValidateCodeHelper.MakeNumCode(4).ToLower();
|
||||
while (m_AccountService.Exist(m => m.Account == randomAccount))
|
||||
{
|
||||
randomAccount = ValidateCodeHelper.MakeCharCode(2).ToLower() + ValidateCodeHelper.MakeNumCode(4).ToLower();
|
||||
}
|
||||
}
|
||||
<vc:redirecct-login></vc:redirecct-login>
|
||||
<div class="cpTop">
|
||||
<p class="choose">当前已选产品:</p>
|
||||
<div class="kArea">
|
||||
<div class="cpKuang">
|
||||
<div class="item">
|
||||
<p><img src="@P(Model.Product.Image)"></p>
|
||||
<p>@Model.Product.Name</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p class="kaci">@Model.Package.Name</p>
|
||||
<p class="grayText">@(Model.Package.DayPrice)元/天</p>
|
||||
<p class="grayText">@Model.Package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
¥ <span class="price">@Model.Package.Price</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chongxin">
|
||||
<div class="item redText">
|
||||
*请确认好所需产品,买错产品换货将产生费用
|
||||
</div>
|
||||
<div class="item">
|
||||
<a asp-action="index" asp-controller="product"><button type="button" class="btnBlue">返回重新选择</button></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="biaodan">
|
||||
PPTP账号前缀:<input type="text" name="" id="account" value="@randomAccount" />
|
||||
</div>
|
||||
<div class="biaodan">
|
||||
PPTP账号密码:<input type="text" name="" id="pwd" value="@randomPwd" />
|
||||
</div>
|
||||
<p class="grayText text-center shengyu">剩余试用次数:<span>@(Model.RestTimes)</span></p>
|
||||
<p class="text-center redText tip"></p>
|
||||
<p class="text-center">
|
||||
@if (Model.RestTimes > 0 && Model.Package.Status == 1)
|
||||
{
|
||||
<button type="button" class="btnBlue large" onclick="create()">领取试用</button>
|
||||
}
|
||||
@if (Model.Package.Status == 0)
|
||||
{
|
||||
<span style="color:red;">
|
||||
该产品暂不能测试
|
||||
</span>
|
||||
}
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
@section Scripts{
|
||||
<script>
|
||||
function create() {
|
||||
var data = {
|
||||
ProductId:@(Model.Product.Id),
|
||||
PackageId: @(Model.Package.Id),
|
||||
Account: $('#account').val(),
|
||||
Pwd: $('#pwd').val()
|
||||
};
|
||||
if (data.Account == '' || data.Pwd == '') {
|
||||
$(".tip").text("账户和密码不能为空");
|
||||
return;
|
||||
}
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/api/course/v1/productaccount/CreateTestAccount',
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(data),
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code == 10000) {
|
||||
alert("领取成功")
|
||||
window.location.href = "/user/myaccounts";
|
||||
} else {
|
||||
$(".tip").text(res.Message);
|
||||
}
|
||||
},
|
||||
dataType: "json"
|
||||
});
|
||||
}
|
||||
</script>
|
||||
}
|
||||
701
Host/Views.Mobile/Product/buy.cshtml
Normal file
701
Host/Views.Mobile/Product/buy.cshtml
Normal file
@@ -0,0 +1,701 @@
|
||||
@using Hncore.Pass.Vpn.Response.Product
|
||||
@using Hncore.Infrastructure.Extension
|
||||
@using Hncore.Pass.BaseInfo.Response
|
||||
@using Hncore.Infrastructure.Serializer;
|
||||
@using Hncore.Pass.BaseInfo.Service
|
||||
@using Hncore.Infrastructure.Common
|
||||
@model PackageInfoResponse
|
||||
@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 randomPwd = ValidateCodeHelper.MakeNumCode(3).ToLower();
|
||||
var randomAccount1 = ValidateCodeHelper.MakeCharCode(2).ToLower() + ValidateCodeHelper.MakeNumCode(4).ToLower();
|
||||
while (m_AccountService.Exist(m => m.Account == randomAccount1))
|
||||
{
|
||||
randomAccount1 = ValidateCodeHelper.MakeCharCode(2).ToLower() + ValidateCodeHelper.MakeNumCode(4).ToLower();
|
||||
}
|
||||
|
||||
var randomAccountMutil = ValidateCodeHelper.MakeCharCode(3).ToLower();
|
||||
|
||||
while (m_AccountService.Exist(m => m.Account.StartsWith(randomAccountMutil)))
|
||||
{
|
||||
randomAccountMutil = ValidateCodeHelper.MakeCharCode(3).ToLower();
|
||||
}
|
||||
}
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
|
||||
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$(".btnNav").click(function () {
|
||||
$(".mask").fadeIn();
|
||||
});
|
||||
$(".btnClose").click(function () {
|
||||
$(".mask").fadeOut();
|
||||
});
|
||||
|
||||
$(".dan").click(function () {
|
||||
$(this).addClass("zActive");
|
||||
$(".pi").removeClass("zActive");
|
||||
$(".conDan").show();
|
||||
$(".conPi").hide();
|
||||
});
|
||||
$(".pi").click(function () {
|
||||
$(this).addClass("zActive");
|
||||
$(".dan").removeClass("zActive");
|
||||
$(".conDan").hide();
|
||||
$(".conPi").show();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<vc:redirecct-login></vc:redirecct-login>
|
||||
<vc:pay-wait></vc:pay-wait>
|
||||
<div id="app">
|
||||
<div class="cpTop">
|
||||
<p class="choose">当前已选产品:</p>
|
||||
<div class="kArea">
|
||||
<div class="cpKuang">
|
||||
<div class="item">
|
||||
<p><img src="/@Model.Product.Image"></p>
|
||||
<p>@Model.Product.Name</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p class="kaci">@Model.Package.Name</p>
|
||||
<p class="grayText">@(Model.Package.DayPrice)元/天</p>
|
||||
<p class="grayText">@Model.Package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
¥ <span class="price">@Model.Package.Price</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chongxin">
|
||||
<div class="item redText">
|
||||
*请确认好所需产品,买错产品换货将产生费用
|
||||
@if (Model.Package.Name == "天卡")
|
||||
{
|
||||
<p class="item redText" style="text-align:center">*天卡不支持退款,请谨慎购买</p>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="item">
|
||||
<button type="button" class="btnBlue" onclick="history.go(-1)">返回重新选择</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mytab">
|
||||
<div class="col-sm-6 col-xs-6 text-right">
|
||||
<span class="dan zActive">单个注册</span>
|
||||
</div>
|
||||
<div class="col-sm-6 col-xs-6 text-left">
|
||||
<span class="pi">批量注册</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="conDan">
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP账号前缀:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="OneBuyModel.Account" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP账号密码:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="OneBuyModel.Pwd" v-on:blur="checkOnePwd" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
连接数:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<div class="jiajian">
|
||||
<div class="item" v-on:click="OneBuyModel.ConnectCount>1&&OneBuyModel.ConnectCount--">
|
||||
-
|
||||
</div>
|
||||
<div class="item">
|
||||
<input type="text" style="width:100%;height:60px;border:0;padding-left:20px" v-model="OneBuyModel.ConnectCount" />
|
||||
@*<span>{{OneBuyModel.ConnectCount}}</span>*@
|
||||
</div>
|
||||
<div class="item" v-on:click="OneBuyModel.ConnectCount++">
|
||||
+
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
选择优惠券:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 select">
|
||||
<select class="chooseYhq" v-model="OneBuyModel.CouponId">
|
||||
<option value="volvo">选择优惠券</option>
|
||||
<option v-for="item in Coupons" :value="item.Id">{{item.Name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
余额:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<div class="">
|
||||
当前账户余额<span class="blueText">@(userEntity.RestAmount)</span>元
|
||||
<a href="/User/Index">前往充值</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="showPayType">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
支付方式:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 pay">
|
||||
<div class="radio" v-on:click="OneBuyModel.OPayType=100">
|
||||
<input name="OPayType" type="radio" v-model="OneBuyModel.OPayType" checked value="100">
|
||||
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
|
||||
</div>
|
||||
<div class="radio" v-on:click="OneBuyModel.OPayType=70">
|
||||
<input name="OPayType" type="radio" v-model="OneBuyModel.OPayType" value="70">
|
||||
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
|
||||
</div>
|
||||
<div class="radio" >
|
||||
<input id="UseAccountAmount" name="OPayType" type="radio" v-model="OneBuyModel.UseAccountAmount" value="1">
|
||||
<label for="UseAccountAmount" class="radio-label" style="line-height:150%"> 余额支付</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
应付款:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span>{{OneTotalAmount}}</span>元
|
||||
</div>
|
||||
</div>
|
||||
@* <div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
应付款:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span class="yingfu" style="font-size: 35px;font-weight: bold;">{{OnePayAmount}}</span>元
|
||||
</div>
|
||||
</div> *@
|
||||
<p class="grayText songquan">每隔30天淘宝下单可获得一张优惠券</p>
|
||||
<p class="redText songquan">{{Tip}}</p>
|
||||
<div class="ok">
|
||||
<button type="button" class="btnPay" v-on:click="onePay">确认支付</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="conPi">
|
||||
<p class="shuoming">批量注册的账号会使用【账号前缀】+【开始数】+【个数】顺序进行注册,</p>
|
||||
<p class="shuoming">如:注册账号前缀为【user】开始数为【6】个数为【10】,则注册的账号为:user06,user07,user08,....user14</p>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP账号前缀:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="MoreBuyModel.Account" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP开始号:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="number" v-model="MoreBuyModel.MinPostfix" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP注册个数:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="number" v-model="MoreBuyModel.MaxPostfix" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP账号密码:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="MoreBuyModel.Pwd" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
连接数:
|
||||
</div>
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
<div class="jiajian">
|
||||
<div class="item" @@click="MoreBuyModel.ConnectCount>1&&MoreBuyModel.ConnectCount--">
|
||||
-
|
||||
</div>
|
||||
<div class="item">
|
||||
<input type="text" style="width:100%;height:60px;border:0;padding-left:20px" v-model="MoreBuyModel.ConnectCount" />
|
||||
</div>
|
||||
<div class="item" @@click="MoreBuyModel.ConnectCount++">
|
||||
+
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
@*<span class="quanxian">超过10个请联系客服开通</span>*@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
选择优惠券:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 select">
|
||||
<select class="chooseYhq" v-model="MoreBuyModel.CouponId">
|
||||
<option value="volvo">选择优惠券</option>
|
||||
<option v-for="item in Coupons" :value="item.Id">{{item.Name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
余额:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<div class="">
|
||||
当前账户余额<span class="blueText">@(userEntity.RestAmount)</span>元
|
||||
<a href="/User/Index">前往充值</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="showPayType">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
支付方式:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 pay">
|
||||
<div class="radio" v-on:click="MoreBuyModel.OPayType=100">
|
||||
<input name="radio" type="radio" value="100" checked v-model="MoreBuyModel.OPayType">
|
||||
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
|
||||
</div>
|
||||
<div class="radio" v-on:click="MoreBuyModel.OPayType=70">
|
||||
<input name="radio" type="radio" value="70" v-model="MoreBuyModel.OPayType">
|
||||
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
|
||||
</div>
|
||||
<div class="radio" >
|
||||
<input id="UseAccountAmount_s" name="radio" type="radio" v-model="MoreBuyModel.UseAccountAmount" value="1">
|
||||
<label for="UseAccountAmount_s" class="radio-label" style="line-height:150%"> 余额支付</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
总金额:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span>{{MoreTotalAmount}}</span>元
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
应付款:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span class="yingfu">{{MorePayAmount}}</span>元
|
||||
</div>
|
||||
</div>
|
||||
<p class="grayText songquan">每隔30天淘宝下单可获得一张优惠券</p>
|
||||
<p class="redText songquan">{{Tip}}</p>
|
||||
<div class="ok">
|
||||
<button type="button" class="btnPay" @@click="morePay">确认支付</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 支付弹窗结束 -->
|
||||
|
||||
<div id="aliPayBox" style="display:none"></div>
|
||||
|
||||
|
||||
@section Scripts{
|
||||
<script>
|
||||
var productId =@(Model.Product.Id);
|
||||
/** 表单序列化成json字符串的方法 */
|
||||
function form2JsonString(formId) {
|
||||
var paramArray = $('#' + formId).serializeArray();
|
||||
var jsonObj = {};
|
||||
$(paramArray).each(function () {
|
||||
jsonObj[this.name] = this.value;
|
||||
});
|
||||
console.log(jsonObj);
|
||||
return JSON.stringify(jsonObj);
|
||||
}
|
||||
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
showPayType:true,
|
||||
payHandler:null,
|
||||
Tip:'',
|
||||
RestAmount: @(userEntity.RestAmount),
|
||||
Coupons: [],
|
||||
SelectCoupon: {},
|
||||
OrderInfo: {},
|
||||
OneChecker: {
|
||||
AccountOk: true,
|
||||
PwdOk:true
|
||||
},
|
||||
MoreChecker: {
|
||||
AccountOk: true,
|
||||
PwdOk: true,
|
||||
Max:10,
|
||||
},
|
||||
OneBuyModel: {
|
||||
Price:@(Model.Package.Price),
|
||||
PackageId:@(Model.Package.Id),
|
||||
CouponAmount: 0,
|
||||
OrderType: 1,
|
||||
Account: '@(randomAccount1)',
|
||||
Pwd: '@(randomPwd)',
|
||||
ConnectCount: 1,
|
||||
CouponId: 0,
|
||||
UseAccountAmount: 0,
|
||||
OPayType: 100,
|
||||
PayChannel:40,
|
||||
},
|
||||
MoreBuyModel: {
|
||||
Price:@(Model.Package.Price),
|
||||
PackageId:@(Model.Package.Id),
|
||||
CouponAmount: 0,
|
||||
OrderType: 2,
|
||||
Account: '@(randomAccountMutil)',
|
||||
Pwd: '@(randomPwd)',
|
||||
ConnectCount: 1,
|
||||
CouponId: 0,
|
||||
UseAccountAmount: 0,
|
||||
OPayType: 100,
|
||||
MinPostfix: 1,
|
||||
MaxPostfix: 1,
|
||||
PayChannel:40,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
OneTotalAmount: function () {
|
||||
var total= this.OneBuyModel.Price * this.OneBuyModel.ConnectCount
|
||||
return total.toFixed(2);
|
||||
},
|
||||
OnePayAmount: function () {
|
||||
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ?this.RestAmount:0;
|
||||
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount - this.OneBuyModel.CouponAmount - restAmout;
|
||||
total= total < 0 ? 0 : total;
|
||||
return total.toFixed(2);
|
||||
},
|
||||
MoreTotalAmount: function () {
|
||||
var total= this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix;
|
||||
return total.toFixed(2);
|
||||
},
|
||||
MorePayAmount: function () {
|
||||
var restAmout = this.MoreBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
|
||||
var total = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix - this.MoreBuyModel.CouponAmount - restAmout;
|
||||
total= total < 0 ? 0 : total;
|
||||
return total.toFixed(2);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'OneBuyModel.CouponId': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var totalAmount = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount;
|
||||
for (var i = 0; i < this.Coupons.length; i++) {
|
||||
var item = this.Coupons[i];
|
||||
if (totalAmount < item.AllowMinAmount) {
|
||||
continue;
|
||||
}
|
||||
if (item.Id == newValue) {
|
||||
if (item.CouponType == 1) {//满减
|
||||
this.OneBuyModel.CouponAmount = item.CouponValue;
|
||||
} else {
|
||||
this.OneBuyModel.CouponAmount = totalAmount * item.CouponValue * 0.1;
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
'MoreBuyModel.CouponId': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var totalAmount = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount;
|
||||
for (var i = 0; i < this.Coupons.length; i++) {
|
||||
var item = this.Coupons[i];
|
||||
if (totalAmount < item.AllowMinAmount) {
|
||||
continue;
|
||||
}
|
||||
if (item.Id == newValue) {
|
||||
if (item.CouponType == 1) {//满减
|
||||
this.MoreBuyModel.CouponAmount = item.CouponValue;
|
||||
} else {
|
||||
this.MoreBuyModel.CouponAmount = totalAmount * item.CouponValue * 0.1;
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
'OneBuyModel.OPayType': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var wx = 10;
|
||||
this.OneBuyModel.UseAccountAmount = false;
|
||||
if (isWeiXin()) wx = 20;
|
||||
this.OneBuyModel.PayChannel = newValue == 70 ? wx : 40;
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
'MoreBuyModel.OPayType': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var wx = 10;
|
||||
this.MoreBuyModel.UseAccountAmount = false;
|
||||
if (isWeiXin()) wx = 20;
|
||||
this.MoreBuyModel.PayChannel = newValue == 70 ? wx : 40;
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
if (isWeiXin()) {
|
||||
this.OneBuyModel.PayChannel = 20;
|
||||
this.OneBuyModel.OPayType = 70;
|
||||
this.MoreBuyModel.PayChannel = 20;
|
||||
this.MoreBuyModel.OPayType = 70;
|
||||
this.showPayType = false;
|
||||
}
|
||||
@if(user != null) {
|
||||
<text>this.getCoupons()</text>
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
isNum(value) {
|
||||
return typeof value === 'number' && !isNaN(value);
|
||||
},
|
||||
selectFn: function (e) {
|
||||
console.log(e.target.value) // 选择项的value
|
||||
},
|
||||
getCoupons: function () {
|
||||
var that = this;
|
||||
var url = '/api/sells/v1/coupon/GetAvailableCoupon';
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code == 10000) {
|
||||
that.Coupons = res.Data.map(m => m.Coupon);
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
checkOneAccount() {
|
||||
if (this.OneBuyModel.Account.length > 10 || this.OneBuyModel.Account.length < 5) {
|
||||
this.OneChecker.AccountOk = false;
|
||||
return false;
|
||||
}
|
||||
this.OneChecker.AccountOk = true;
|
||||
return true;
|
||||
},
|
||||
checkOnePwd() {
|
||||
if (this.OneBuyModel.Pwd.length > 6 || this.OneBuyModel.Pwd.length <1) {
|
||||
this.OneChecker.PwdOk = false;
|
||||
return false;
|
||||
}
|
||||
this.OneChecker.PwdOk = true;
|
||||
return true;
|
||||
},
|
||||
checkMoreAccount() {
|
||||
if (this.MoreBuyModel.Account.length > 10 || this.MoreBuyModel.Account.length < 3) {
|
||||
this.MoreChecker.AccountOk = false;
|
||||
return false;
|
||||
}
|
||||
this.MoreChecker.AccountOk = true;
|
||||
return true;
|
||||
},
|
||||
checkMorePwd() {
|
||||
if (this.MoreBuyModel.Pwd.length > 6 || this.MoreBuyModel.Pwd.length < 1) {
|
||||
this.MoreChecker.PwdOk = false;
|
||||
return false;
|
||||
}
|
||||
this.MoreChecker.PwdOk = true;
|
||||
return true;
|
||||
},
|
||||
onePay: function () {
|
||||
this.OneBuyModel.ConnectCount = parseInt(this.OneBuyModel.ConnectCount)
|
||||
if (!this.isNum(this.OneBuyModel.ConnectCount)) return;
|
||||
if (!this.checkOneAccount() || !this.checkOnePwd()) return;
|
||||
if (this.OnePayAmount > 0 ) {
|
||||
if (this.OneBuyModel.UseAccountAmount){
|
||||
alert('余额不足,请充值!');return;
|
||||
}
|
||||
}
|
||||
var that = this;
|
||||
if (this.OneBuyModel.UseAccountAmount === true) this.OneBuyModel.UseAccountAmount = 1;
|
||||
if (this.OneBuyModel.UseAccountAmount === false) this.OneBuyModel.UseAccountAmount = 0;
|
||||
showPayWait();
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/product/CreateOrder',
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(this.OneBuyModel),
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code == 10000) {
|
||||
hidePayWait();
|
||||
if (res.Data == "00") {
|
||||
//alert('购买成功')
|
||||
showPayOk();
|
||||
} else {
|
||||
that.payCallback(res.Data)
|
||||
that.isPay(res.Data.OrderInfo.OrderNo);
|
||||
}
|
||||
} else {
|
||||
//that.Tip = res.Message;
|
||||
tipPayWait(res.Message);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
morePay: function () {
|
||||
this.MoreBuyModel.ConnectCount = parseInt(this.MoreBuyModel.ConnectCount)
|
||||
if (!this.isNum(this.MoreBuyModel.ConnectCount)) return;
|
||||
if (!this.checkMoreAccount() || !this.checkMorePwd() || this.MoreBuyModel.MaxPostfix>500) return;
|
||||
var that = this;
|
||||
if (this.OnePayAmount > 0 ) {
|
||||
if (this.MoreBuyModel.UseAccountAmount){
|
||||
alert('余额不足,请充值!');return;
|
||||
}
|
||||
}
|
||||
if (this.MoreBuyModel.UseAccountAmount === true) this.MoreBuyModel.UseAccountAmount = 1;
|
||||
if (this.MoreBuyModel.UseAccountAmount === false) this.MoreBuyModel.UseAccountAmount = 0;
|
||||
showPayWait();
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/product/CreateOrder',
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(this.MoreBuyModel),
|
||||
success: function (res) {
|
||||
if (res.Code == 10000) {
|
||||
hidePayWait();
|
||||
if (res.Data == "00") {
|
||||
//alert('购买成功')
|
||||
showPayOk();
|
||||
} else {
|
||||
that.payCallback(res.Data)
|
||||
that.isPay(res.Data.OrderInfo.OrderNo);
|
||||
}
|
||||
} else {
|
||||
//that.Tip = res.Message;
|
||||
tipPayWait(res.Message);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
payCallback: function (data) {
|
||||
this.OrderInfo = data.OrderInfo;
|
||||
if (!data.PayData) { alert("下单失败");return; }
|
||||
var payChannel = this.OrderInfo.PayChannel;
|
||||
if (payChannel == 10) {
|
||||
this.h5WxPay(data.PayData)
|
||||
} else if (payChannel == 20) {
|
||||
this.jsWxPay(data.PayData);
|
||||
} else if (payChannel == 40) {
|
||||
this.aliPay(data.PayData);
|
||||
}
|
||||
},
|
||||
h5WxPay(payData) {
|
||||
window.location.href = payData;
|
||||
},
|
||||
jsWxPay(payData) {
|
||||
WeixinJSBridge.invoke(
|
||||
'getBrandWCPayRequest',
|
||||
JSON.parse(payData),
|
||||
function (res) {
|
||||
if (res.err_msg == "get_brand_wcpay_request:ok") {
|
||||
window.location.href = "/User/MyAccounts";
|
||||
} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
|
||||
|
||||
} else {
|
||||
alert("支付失败" + res.err_msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
aliPay(payData) {
|
||||
$("#aliPayBox").html(payData);
|
||||
//window.location.href = payData;
|
||||
},
|
||||
checkAccount: function () {
|
||||
var account = $("#sAccount").val()
|
||||
var url = '/api/course/v1/productaccount/ExistAccount?productId=' + productId + '&accounts=' + account;
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code != 10000) {
|
||||
$("#sAccountTip").text(res.Message)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
isPay: function (orderNo) {
|
||||
var that = this;
|
||||
this.payHandler= setInterval(function () {
|
||||
var url = '/product/IsPay?orderNo=' + orderNo;
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
if (res.Code == 10000 && res.Data ==1) {
|
||||
clearInterval(that.payHandler);
|
||||
$(".payMask").hide();
|
||||
showPayOk();
|
||||
//window.location.href = "/user/myaccounts";
|
||||
}
|
||||
}
|
||||
})
|
||||
}, 3000)
|
||||
},
|
||||
close() {
|
||||
clearInterval(this.payHandler);
|
||||
$('.payMask').hide();
|
||||
$('#qrcode').empty();
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function checkAccount() {
|
||||
var account = $("#sAccount").val()
|
||||
var url = '/api/course/v1/productaccount/ExistAccount?productId=' + productId+ '&accounts=' + account;
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code != 10000) {
|
||||
$("#sAccountTip").text(res.Message)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
}
|
||||
328
Host/Views.Mobile/Product/rebuy.cshtml
Normal file
328
Host/Views.Mobile/Product/rebuy.cshtml
Normal file
@@ -0,0 +1,328 @@
|
||||
@using Hncore.Pass.Vpn.Response.Product
|
||||
@using Hncore.Infrastructure.Extension
|
||||
@using Hncore.Pass.BaseInfo.Response
|
||||
@using Hncore.Infrastructure.Serializer;
|
||||
@using Hncore.Pass.BaseInfo.Service
|
||||
@model PackageInfoResponse
|
||||
@inject UserService m_UserService
|
||||
@{
|
||||
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);
|
||||
}
|
||||
}
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
|
||||
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
|
||||
<vc:redirecct-login></vc:redirecct-login>
|
||||
<vc:pay-wait></vc:pay-wait>
|
||||
<div id="app">
|
||||
<div class="cpTop">
|
||||
<p class="choose">当前已选产品:</p>
|
||||
<div class="kArea">
|
||||
<div class="cpKuang">
|
||||
<div class="item">
|
||||
<p><img src="~/@Model.Product.Image"></p>
|
||||
<p>@Model.Product.Name</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<p class="kaci">@Model.Package.Name</p>
|
||||
<p class="grayText">@(Model.Package.DayPrice)元/天</p>
|
||||
<p class="grayText">@Model.Package.Profile</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
¥ <span class="price">@Model.Package.Price</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chongxin">
|
||||
<div class="item redText">
|
||||
*请确认好所需产品,买错产品换货将产生费用
|
||||
</div>
|
||||
<div class="item">
|
||||
<button type="button" class="btnBlue" onclick="history.go(-1)">返回重新选择</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- con -->
|
||||
<div class="container zhuce">
|
||||
<div class="reg_tab">
|
||||
<div class="item dan active_dan">
|
||||
续费
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="conDan">
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP产品账号:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="OneBuyModel.Account" disabled />
|
||||
</div>
|
||||
</div>
|
||||
@*<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
PPTP账号密码:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 shuru">
|
||||
<input type="text" v-model="OneBuyModel.Pwd" />
|
||||
</div>
|
||||
</div>*@
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
连接数:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<div class="jiajian">
|
||||
<div class="item">
|
||||
|
||||
</div>
|
||||
<div class="item">
|
||||
<span>{{OneBuyModel.ConnectCount}}</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
选择优惠券:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 select">
|
||||
<select class="chooseYhq" v-model="OneBuyModel.CouponId">
|
||||
<option value="0">请选择优惠券</option>
|
||||
<option v-for="item in Coupons" :value="item.Id">{{item.Name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
余额抵扣:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<div class="radio">
|
||||
<input type="checkbox" v-model="OneBuyModel.UseAccountAmount" value="1"> 当前账户余额<span class="blueText">@(userEntity.RestAmount)</span>元
|
||||
@*<input id="radio-1" name="radio" type="radio">
|
||||
<label for="radio-1" class="radio-label">使用余额抵扣,当前账户余额@(userEntity.RestAmount)元</label>*@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="showPayType">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
支付方式:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7 pay">
|
||||
<div class="radio" v-on:click="OneBuyModel.OPayType=100">
|
||||
<input type="radio" v-model="OneBuyModel.OPayType" value="100">
|
||||
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
|
||||
</div>
|
||||
<div class="radio" v-on:click="OneBuyModel.OPayType=70">
|
||||
<input type="radio" v-model="OneBuyModel.OPayType" value="70">
|
||||
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
总金额:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span>{{TotalAmount}}</span>元
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-5 col-xs-5">
|
||||
应付款:
|
||||
</div>
|
||||
<div class="col-sm-7 col-xs-7">
|
||||
<span class="yingfu" style="font-size: 35px;font-weight: bold;">{{PayAmount}}</span>元
|
||||
</div>
|
||||
</div>
|
||||
<p class="grayText songquan">每隔30天淘宝下单可获得一张优惠券</p>
|
||||
<p class="grayText songquan" style="color:red">{{Tip}}</p>
|
||||
<div class="ok">
|
||||
<button type="button" class="btnPay" v-on:click="onePay">确认支付</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="aliPayBox" style="display:none"></div>
|
||||
@section Scripts{
|
||||
<script>
|
||||
var productId =@(Model.Product.Id);
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
showPayType: true,
|
||||
Tip:'',
|
||||
RestAmount: @(userEntity.RestAmount),
|
||||
Coupons: [],
|
||||
SelectCoupon: {},
|
||||
OrderInfo: {},
|
||||
OneBuyModel: {
|
||||
Price:@(Model.Package.Price),
|
||||
PackageId:@(Model.Package.Id),
|
||||
OrderType: @ViewBag.orderType,
|
||||
Account: '@ViewBag.accounts',
|
||||
CouponAmount: 0,
|
||||
Pwd: '',
|
||||
ConnectCount: @(ViewBag.ConnectCount),
|
||||
CouponId: 0,
|
||||
UseAccountAmount: 0,
|
||||
OPayType: 100,
|
||||
PayChannel:40,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
TotalAmount: function () {
|
||||
var count = this.OneBuyModel.Account.split(',').length;
|
||||
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count;
|
||||
return total.toFixed(2);
|
||||
},
|
||||
PayAmount: function () {
|
||||
var count = this.OneBuyModel.Account.split(',').length;
|
||||
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
|
||||
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count - this.OneBuyModel.CouponAmount - restAmout;
|
||||
total= total < 0 ? 0 : total;
|
||||
return total.toFixed(2);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'OneBuyModel.CouponId': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var totalAmount = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount;
|
||||
for (var i = 0; i < this.Coupons.length; i++) {
|
||||
var item = this.Coupons[i];
|
||||
if (totalAmount < item.AllowMinAmount) {
|
||||
continue;
|
||||
}
|
||||
if (item.Id == newValue) {
|
||||
if (item.CouponType == 1) {//满减
|
||||
this.OneBuyModel.CouponAmount = item.CouponValue;
|
||||
} else {
|
||||
this.OneBuyModel.CouponAmount = totalAmount * item.CouponValue * 0.1;
|
||||
}
|
||||
return;
|
||||
}
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
'OneBuyModel.OPayType': { //加引号监听对象里的属性
|
||||
handler: function (newValue, oldValue) {
|
||||
var wx = 10;
|
||||
if (isWeiXin()) wx = 20;
|
||||
this.OneBuyModel.PayChannel = newValue == 70 ? wx : 40;
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
if (isWeiXin()) {
|
||||
this.OneBuyModel.PayChannel = 20;
|
||||
this.OneBuyModel.OPayType = 70;
|
||||
this.showPayType = false;
|
||||
}
|
||||
this.getCoupons();
|
||||
},
|
||||
methods: {
|
||||
getCoupons: function () {
|
||||
var that = this;
|
||||
var url = '/api/sells/v1/coupon/GetAvailableCoupon';
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code == 10000) {
|
||||
that.Coupons = res.Data.map(m => m.Coupon);
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onePay: function () {
|
||||
if (this.PayAmount == 0 || this.OneBuyModel.UseAccountAmount) {
|
||||
if (!confirm('余额和微信支付宝组合支付时,余额将立即扣除,请务必完成后续差额支付!')) return;
|
||||
}
|
||||
var that = this;
|
||||
if (this.OneBuyModel.UseAccountAmount === true) this.OneBuyModel.UseAccountAmount = 1;
|
||||
if (this.OneBuyModel.UseAccountAmount === false) this.OneBuyModel.UseAccountAmount = 0;
|
||||
var that = this;
|
||||
showPayWait();
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/product/CreateOrder',
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(this.OneBuyModel),
|
||||
success: function (res) {
|
||||
console.log(res);
|
||||
if (res.Code == 10000) {
|
||||
hidePayWait();
|
||||
that.payCallback(res.Data)
|
||||
//that.isPay(res.Data.OrderInfo.OrderNo);
|
||||
} else {
|
||||
//that.Tip = res.Message;
|
||||
tipPayWait(res.Message);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
payCallback: function (data) {
|
||||
this.OrderInfo = data.OrderInfo;
|
||||
if (!data.PayData) { alert("下单失败"); return; }
|
||||
var payChannel = this.OrderInfo.PayChannel;
|
||||
if (payChannel == 10) {
|
||||
this.h5WxPay(data.PayData)
|
||||
} else if (payChannel == 20) {
|
||||
this.jsWxPay(data.PayData);
|
||||
} else if (payChannel == 40) {
|
||||
this.aliPay(data.PayData);
|
||||
}
|
||||
},
|
||||
h5WxPay(payData) {
|
||||
window.location.href = payData;
|
||||
},
|
||||
jsWxPay(payData) {
|
||||
WeixinJSBridge.invoke(
|
||||
'getBrandWCPayRequest',
|
||||
JSON.parse(payData),
|
||||
function (res) {
|
||||
if (res.err_msg == "get_brand_wcpay_request:ok") {
|
||||
window.location.href = "/User/MyAccounts";
|
||||
} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
|
||||
|
||||
} else {
|
||||
alert("支付失败" + res.err_msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
aliPay(payData) {
|
||||
$("#aliPayBox").html(payData);
|
||||
},
|
||||
isPay: function (orderNo) {
|
||||
var handler = setInterval(function () {
|
||||
var url = '/product/IsPay?orderNo=' + orderNo;
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: url,
|
||||
success: function (res) {
|
||||
if (res.Code == 10000 && res.Data == 1) {
|
||||
clearInterval(handler);
|
||||
// $(".payMask").hide();
|
||||
window.location.href = "/user/myaccounts";
|
||||
}
|
||||
}
|
||||
})
|
||||
}, 3000)
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
}
|
||||
Reference in New Issue
Block a user