325 lines
13 KiB
HTML
325 lines
13 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
|||
|
|
<title>加载中...</title>
|
|||
|
|
<link rel="stylesheet" href="/static/cdn/element-ui/2.15.7/theme-chalk/index.min.css"/>
|
|||
|
|
<script src="/static/cdn/vue/2.6.11/vue.min.js"></script>
|
|||
|
|
<script src="/static/cdn/element-ui/2.15.7/index.js"></script>
|
|||
|
|
<script src="/static/js/jquery.min.js"></script>
|
|||
|
|
<script src="/static/js/functions.js"></script>
|
|||
|
|
<link rel="stylesheet" href="/static/css/wechat-group.css?v=asdfgh"/>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div id="app" class="payBox">
|
|||
|
|
<template>
|
|||
|
|
|
|||
|
|
<div class="groupBox" v-show="product_category=='wechat_group'">
|
|||
|
|
<div class="thumb">
|
|||
|
|
<img src="/static/images/group_thumb.jpg"/>
|
|||
|
|
</div>
|
|||
|
|
<div class="groupName"><{product_name}></div>
|
|||
|
|
<div class="subName">你和群里其他人都不是朋友关系，请注意隐私安全。</div>
|
|||
|
|
<ul class="groupDesc">
|
|||
|
|
<li>该群聊为付费群，请支付金额后加入群聊。</li>
|
|||
|
|
<li>你需要实名认证后才能加入群聊，可前往「我>服务>钱包>身份信息」进行认证。</li>
|
|||
|
|
<li>为维护微信平台绿色网络环境，请勿在群内传播违法违规内容。</li>
|
|||
|
|
</ul>
|
|||
|
|
<div class="joinBtnBox">
|
|||
|
|
<div class="joinBtn" @click="createNan66Order()" v-if="payment=='nan66'">支付<{price/100}>元加入群聊</div>
|
|||
|
|
<div class="joinBtn" @click="redirect()" v-else-if="openId==''">支付<{price/100}>元加入群聊</div>
|
|||
|
|
<div class="joinBtn" @click="createOrder()" v-else-if="openId!=''">支付<{price/100}>元加入群聊</div>
|
|||
|
|
<a class="joinBtn" href="javascript:KEFU.showPanel()">咨询在线客服</a>
|
|||
|
|
<div style="text-align: center;margin-top: 10px;" v-if="nan66qrcode">
|
|||
|
|
<p>微信扫描或长按识别下面二维码</p>
|
|||
|
|
<img :src="nan66qrcode" width="90%"/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="knowledgeBox" v-show="product_category=='knowledge'">
|
|||
|
|
<h1 class="mainTitle"><{product_name}></h1>
|
|||
|
|
<el-form label-width="80px" v-if="openId!=''">
|
|||
|
|
<el-form-item label="联系邮箱">
|
|||
|
|
<el-input v-model="email"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="联系手机">
|
|||
|
|
<el-input v-model="tel"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="联系人">
|
|||
|
|
<el-input v-model="realname"></el-input>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
<div style="text-align: center">
|
|||
|
|
<div class="joinBtn" @click="createNan66Order()" v-if="payment=='nan66'">支付<{price/100}>元获取资源</div>
|
|||
|
|
<div class="joinBtn" @click="redirect()" v-else-if="openId==''">微信授权</div>
|
|||
|
|
<div class="joinBtn" @click="createOrder()" v-else-if="openId!=''">支付<{price/100}>元获取资源</div>
|
|||
|
|
<div class="joinBtn" @click="getProductOrderList(1)" v-if="openId!=''" style="display: none">订单列表</div>
|
|||
|
|
<a class="joinBtn" href="javascript:KEFU.showPanel()">咨询在线客服</a>
|
|||
|
|
<div style="text-align: center;margin-top: 10px;" v-if="nan66qrcode">
|
|||
|
|
<p>请用微信扫描下面付款二维码</p>
|
|||
|
|
<img :src="nan66qrcode" width="90%"/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<el-table
|
|||
|
|
v-if="productOrderList.list.length!=0"
|
|||
|
|
:data="productOrderList.list"
|
|||
|
|
border
|
|||
|
|
style="width: 100%;margin-top: 10px">
|
|||
|
|
<el-table-column
|
|||
|
|
prop="order_sn"
|
|||
|
|
label="订单编号">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="money"
|
|||
|
|
label="金额">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<{scope.row.total_amount/100}>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="order_desc"
|
|||
|
|
label="描述">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="kefu_name"
|
|||
|
|
label="商家账号">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="shipping_address"
|
|||
|
|
label="发货信息">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="type"
|
|||
|
|
label="支付状态">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<el-tag type='info' v-show="scope.row.payment_status=='unpaid'">未支付</el-tag>
|
|||
|
|
<el-tag type='success' v-show="scope.row.payment_status=='paid'">已支付</el-tag>
|
|||
|
|
<el-tag type='error' v-show="scope.row.payment_status=='refunded'">已退款</el-tag>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="created_at"
|
|||
|
|
label="下单时间">
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
<el-pagination
|
|||
|
|
v-if="productOrderList.list.length!=0"
|
|||
|
|
background
|
|||
|
|
@current-change="getProductOrderList"
|
|||
|
|
:current-page="productOrderList.page"
|
|||
|
|
layout="prev,pager, next"
|
|||
|
|
:page-size="productOrderList.pagesize"
|
|||
|
|
:total="productOrderList.count">
|
|||
|
|
</el-pagination>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</template>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
var KefuName='{{.kefuName}}';
|
|||
|
|
var EntId='{{.EntId}}';
|
|||
|
|
var AppId='{{.AppId}}';
|
|||
|
|
var Host=getBaseUrl();
|
|||
|
|
var Product='{{.Product}}';
|
|||
|
|
var OpenID='{{.OpenID}}';
|
|||
|
|
var NickName='{{.NickName}}';
|
|||
|
|
var Avatar='{{.Avatar}}';
|
|||
|
|
var Payment='{{.Payment}}';
|
|||
|
|
//var OpenID='ox8mo6F3XddfkoJvkykxIp64gg4M';
|
|||
|
|
|
|||
|
|
|
|||
|
|
function onBridgeReady() {
|
|||
|
|
WeixinJSBridge.call('hideOptionMenu');
|
|||
|
|
}
|
|||
|
|
if (typeof WeixinJSBridge == "undefined") {
|
|||
|
|
if (document.addEventListener) {
|
|||
|
|
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
|
|||
|
|
} else if (document.attachEvent) {
|
|||
|
|
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
|
|||
|
|
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<script>
|
|||
|
|
new Vue({
|
|||
|
|
el: '#app',
|
|||
|
|
delimiters:["<{","}>"],
|
|||
|
|
data: {
|
|||
|
|
openId:OpenID,
|
|||
|
|
email:"",
|
|||
|
|
tel:"",
|
|||
|
|
realname:"",
|
|||
|
|
nickname:NickName,
|
|||
|
|
avatar:Avatar,
|
|||
|
|
product:Product,
|
|||
|
|
product_name:"",
|
|||
|
|
product_category:"",
|
|||
|
|
price:"",
|
|||
|
|
resource_link:"",
|
|||
|
|
payment:Payment,
|
|||
|
|
productOrderList:{
|
|||
|
|
page:1,
|
|||
|
|
count:0,
|
|||
|
|
pagesize:0,
|
|||
|
|
list:[],
|
|||
|
|
},
|
|||
|
|
nan66qrcode:"",
|
|||
|
|
orderTimer:null,
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
getProduct(){
|
|||
|
|
let _this=this;
|
|||
|
|
sendAjax("/2/virtualProduct/"+EntId+"/"+KefuName,"GET",{ent_id:EntId,id:Product},function (res) {
|
|||
|
|
let info=res.result;
|
|||
|
|
if(!info){
|
|||
|
|
alert(res.msg);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if(info.id==0){
|
|||
|
|
alert("商品不存在");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
_this.product_name=info.product_name;
|
|||
|
|
_this.price=info.price;
|
|||
|
|
_this.product_category=info.product_category;
|
|||
|
|
document.title=_this.product_name;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
createOrder(){
|
|||
|
|
if(!this.price){
|
|||
|
|
alert("商品不存在或价格错误");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
sendAjax("/2/jsApiPay","POST",{
|
|||
|
|
openId:this.openId,
|
|||
|
|
amount:this.price,
|
|||
|
|
email:this.email,
|
|||
|
|
tel:this.tel,
|
|||
|
|
contact:this.realname,
|
|||
|
|
nickname:this.nickname,
|
|||
|
|
avatar:this.avatar,
|
|||
|
|
product:this.product,
|
|||
|
|
entId:EntId,
|
|||
|
|
kefuName:KefuName,
|
|||
|
|
},function(resp){
|
|||
|
|
if(resp.code!=20000){
|
|||
|
|
alert(resp.msg);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
let respJson=JSON.parse(resp.result);
|
|||
|
|
window.WeixinJSBridge.invoke('getBrandWCPayRequest', {
|
|||
|
|
"appId": respJson.appId, //公众号ID，由商户传入
|
|||
|
|
"timeStamp": respJson.timeStamp, //时间戳，自1970年以来的秒数
|
|||
|
|
"nonceStr": respJson.nonceStr, //随机串
|
|||
|
|
"package": respJson.package,
|
|||
|
|
"signType": respJson.signType, //微信签名方式：
|
|||
|
|
"paySign": respJson.paySign //微信签名
|
|||
|
|
},
|
|||
|
|
function(res) {
|
|||
|
|
// alert(JSON.stringify(res));
|
|||
|
|
if (res.err_msg == "get_brand_wcpay_request:ok") {
|
|||
|
|
// 使用以上方式判断前端返回,微信团队郑重提示：
|
|||
|
|
//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
|
|||
|
|
alert("支付成功！");
|
|||
|
|
window.location.href=resp.resource_link;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
//南星订单
|
|||
|
|
createNan66Order() {
|
|||
|
|
if (!this.price) {
|
|||
|
|
alert("商品不存在或价格错误");
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
let _this=this;
|
|||
|
|
sendAjax("/2/yiApiPay", "POST", {
|
|||
|
|
openId: this.openId,
|
|||
|
|
amount: this.price,
|
|||
|
|
email: this.email,
|
|||
|
|
tel: this.tel,
|
|||
|
|
contact: this.realname,
|
|||
|
|
nickname: this.nickname,
|
|||
|
|
avatar: this.avatar,
|
|||
|
|
product: this.product,
|
|||
|
|
entId: EntId,
|
|||
|
|
kefuName: KefuName,
|
|||
|
|
}, function (resp) {
|
|||
|
|
resp=JSON.parse(resp);
|
|||
|
|
if (resp.msg != "success") {
|
|||
|
|
alert("支付下单失败！"+resp.msg);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
_this.nan66qrcode="/api/v2/qrcode?str="+resp.qrcode;
|
|||
|
|
// if(!isMobile()){
|
|||
|
|
// _this.nan66qrcode="/api/v2/qrcode?str="+resp.qrcode;
|
|||
|
|
// }else{
|
|||
|
|
// window.open(resp.payurl);
|
|||
|
|
// }
|
|||
|
|
_this.checkOrderStatus(resp.trade_no);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
redirect(){
|
|||
|
|
setTimeout(function () {
|
|||
|
|
var url="https://open.weixin.qq.com/connect/oauth2/authorize?appid="+AppId+"&redirect_uri="+Host+"/pay/"+EntId+"/"+KefuName+"%3Fproduct="+Product+"&response_type=code&scope=snsapi_userinfo#wechat_redirect"
|
|||
|
|
document.location.href=url;
|
|||
|
|
},1000);
|
|||
|
|
},
|
|||
|
|
//订单列表
|
|||
|
|
getProductOrderList(page){
|
|||
|
|
var _this=this;
|
|||
|
|
var params={pagesize:20,page:page,user_id:OpenID,ent_id:EntId};
|
|||
|
|
sendAjax("/2/productOrders","GET",params,function(result){
|
|||
|
|
_this.productOrderList=result.result;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//定时查询扫码状态
|
|||
|
|
checkOrderStatus(orderId) {
|
|||
|
|
let _this=this;
|
|||
|
|
this.stopOrderStatus();
|
|||
|
|
this.orderTimer = setInterval(function() {
|
|||
|
|
sendAjax("/2/orderStatus","POST", {order_id:orderId}, function (data) {
|
|||
|
|
if(data.result){
|
|||
|
|
window.location.href=data.result;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}, 3000);
|
|||
|
|
},
|
|||
|
|
//停止查询扫码状态
|
|||
|
|
stopOrderStatus(){
|
|||
|
|
clearInterval(this.orderTimer); // 停止定时器
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
mounted:function(){
|
|||
|
|
//判断支付
|
|||
|
|
if(Payment=="nan66"){
|
|||
|
|
|
|||
|
|
}else{
|
|||
|
|
if(!this.openId){
|
|||
|
|
this.redirect();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
this.getProduct();
|
|||
|
|
},
|
|||
|
|
created: function () {
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
<script type='text/javascript' src="/static/js/kefu-front.js"></script>
|
|||
|
|
<script>
|
|||
|
|
KEFU.init({
|
|||
|
|
KEFU_URL:getBaseUrl(),
|
|||
|
|
KEFU_KEFU_ID: KefuName,
|
|||
|
|
KEFU_ENT: EntId,
|
|||
|
|
KEFU_SHOW_TYPES:0,
|
|||
|
|
KEFU_AUTO_OPEN:false,
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|