vipBuy.vue 36 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118
  1. <template>
  2. <view class="container">
  3. <view class="info es-pt-34">
  4. <view class="u-f-ajc u-f-jsb es-ml-24" :style="{marginTop: statusBarHeight+'px'}">
  5. <view class="u-f-ajc" @tap="toBack">
  6. <image class="es-icon-64" src="/static/image/agent/member/back_white_icon.png" mode=""></image>
  7. </view>
  8. <view class="u-f-ajc">
  9. <image class="es-h-52 w264" src="/static/image/agent/member/member_title.png" mode=""></image>
  10. </view>
  11. <view class=""></view>
  12. </view>
  13. <view class="es-ml-32 u-f es-mt-44 info-box">
  14. <view class="u-f-ajc es-mr-20 avatar es-br-ban es-bc-white">
  15. <image class="es-br-ban es-icon-80" :src="!$isEmpty(user.avatar)?user.avatar:avatar" mode="">
  16. </image>
  17. </view>
  18. <view class="">
  19. <view class="es-c-white es-fs-32 es-fw-600">
  20. {{ $isEmpty(user.nickName)?"暂无昵称":user.nickName }}
  21. </view>
  22. <view class="es-mt-4 es-c-99 es-fs-24" v-if="user.isVip==1">
  23. 有效期至:{{ $formatDate(user.vipEndDate) }}
  24. </view>
  25. </view>
  26. <image class="vipBg" src="/static/image/agent/member/vip_bg.png" mode="aspectFit"></image>
  27. </view>
  28. </view>
  29. <view class="content es-bc-white">
  30. <view class="u-f-ajc u-f-jsb">
  31. <view class="content-card u-f-ajc u-f-fc" v-for="(item,index) in dataList" :key="index"
  32. @tap="changePackage(index)" :class="[pickIndex==index?'active':'es-bc-white']">
  33. <view class="es-fs-32 es-fw " :class="[pickIndex==index?'color995316':'es-c-22']">
  34. {{item.packageName}}
  35. </view>
  36. <view class="es-mt-14" :class="[pickIndex==index?'colorFE4D46':'colorD59B6D']">
  37. <text class="es-fs-40 es-fw-500 es-mr-4">¥</text>
  38. <text class="es-fs-64 es-fw ">{{item.sellPrice}}</text>
  39. </view>
  40. <view class="es-fs-24 color9A9A99 es-mt-8 delete-line">
  41. 原价{{item.price}}元
  42. </view>
  43. <view class="es-mt-18 content-card-btn es-fs-24 es-br-32"
  44. :class="[pickIndex==index?'es-c-white active-btn':'es-bc-white colorD59B6D']">
  45. {{descText[index]}}
  46. </view>
  47. </view>
  48. </view>
  49. <view class="priceBox es-mt-32" v-if="couponTotal>0">
  50. <view class="u-f">
  51. <view class="es-fs-24 u-f-ajc es-mr-12 es-fw-500 es-br-16 color995316 priceBox-tip">
  52. 开通可得
  53. </view>
  54. <view class="es-fs-36 es-fw-bold colorFFF3DE es-mr-26">
  55. {{couponTotal}}张通用红包
  56. </view>
  57. <view class="u-f es-ae yuanBox">
  58. <view class="es-fs-60 es-fw-bold colorFFF3DE">
  59. {{couponOverallPrice}}
  60. </view>
  61. <view class="es-fs-20 es-fw-bold colorFF261D yuan u-f-ajc es-mb-20">
  62. </view>
  63. </view>
  64. </view>
  65. <view class="es-mt-30 u-f priceBox-price">
  66. <view class="es-mr-8 es-br-16 colorFE4D46 u-f-ajc u-f-fc priceBox-price-list"
  67. v-for="(item,index) in fsCouponList" :key="index">
  68. <view class="">
  69. <text class="es-fs-32">¥</text>
  70. <text class="es-fs-44 es-fw-bold">{{item.price}}</text>
  71. </view>
  72. <view class="u-f-ajc ">
  73. <image class="red_envelope" src="/static/image/agent/member/red_envelope_list_bg.png"
  74. mode=""></image>
  75. </view>
  76. <view class="es-mt-4 es-fs-24" v-if="item.minPrice>0">
  77. 满{{item.minPrice}}元可用
  78. </view>
  79. </view>
  80. </view>
  81. <view class="priceBox-btn es-mt-24 u-f-ajc es-mr-24" v-if="false">
  82. <text class="es-fs-36 es-fw-500 es-mr-14 colorFE4D46">一键领取优惠券</text>
  83. <text class="es-fs-24 es-fw-600 es-mr-6 priceBox-btn-bg0 es-c-white">{{timeArr.hours}}</text>
  84. <text class="es-fs-24 es-fw-600 es-mr-6">:</text>
  85. <text class="es-fs-24 es-fw-600 es-mr-6 priceBox-btn-bg0 es-c-white">{{timeArr.minutes}}</text>
  86. <text class="es-fs-24 es-fw-600 es-mr-6">:</text>
  87. <text class="es-fs-24 es-fw-600 es-mr-10 priceBox-btn-bg0 es-c-white">{{timeArr.seconds}}</text>
  88. <text class="es-fs-24 es-c-22">后结束</text>
  89. </view>
  90. </view>
  91. <view class="es-mt-32 u-f-ajc">
  92. <view class="left-line left-lineBg es-mr-24"></view>
  93. <view class="es-fs-40 es-c-22 es-fw es-mr-24">
  94. 会员六大特权
  95. </view>
  96. <view class="left-line right-line right-lineBg"></view>
  97. </view>
  98. <scroll-view scroll-x="true" class="scroll-X">
  99. <view class="es-mt-32 u-f">
  100. <view class="es-mr-64 u-f-ajc u-f-fc" v-for="(item,index) in list" :key="index">
  101. <view class="u-f-ajc">
  102. <image class="es-br-ban es-icon-96" :src="item.imageUrl" mode="">
  103. </image>
  104. </view>
  105. <view class="u-f-ajc es-mt-12 es-fs-24 color4C2B0A" :style="{whiteSpace:'nowrap'}">
  106. {{item.title}}
  107. </view>
  108. </view>
  109. </view>
  110. </scroll-view>
  111. </view>
  112. <view class="fixed es-bc-white u-f-ajc u-f-fc">
  113. <view class="es-fs-40 es-fw-600 fixed-btn u-f-ajc" @tap="payFun">
  114. ¥{{checkPrice}}/{{desc[pickIndex]}} 立即开通
  115. <view class="fixed-btn-text es-c-white es-fs-24 u-f-ajc">
  116. {{descText[pickIndex]}}
  117. </view>
  118. </view>
  119. <view class="es-mt-24">
  120. <text class="es-fs-24 es-c-75">开通即同意</text>
  121. <text class="es-fs-24 colorD59B6D" @tap="openH5(0)">《会员服务协议》</text>
  122. </view>
  123. </view>
  124. <uni-popup ref="popPayType" type="bottom" borderRadius="10rpx 10rpx 0px 0px">
  125. <view class="pay-box">
  126. <view class="title">请选择支付方式</view>
  127. <view class="pay-list">
  128. <view class="pay-item wx" @click="doBuy(1)">
  129. <image src="/static/images/wx.png"></image>
  130. <view class="name">微信支付</view>
  131. </view>
  132. <view class="pay-item alipay" @click="doBuy(2)">
  133. <image src="/static/images/alipay.png"></image>
  134. <view class="name">支付宝支付</view>
  135. </view>
  136. </view>
  137. </view>
  138. </uni-popup>
  139. </view>
  140. </template>
  141. <script>
  142. import {
  143. getIOSPayStatus
  144. } from '@/api/common.js';
  145. import {
  146. getUserInfo,
  147. getCouponsUnderVipPackage
  148. } from '@/api/user'
  149. import {
  150. getPackageList,
  151. createVipOrder,
  152. vipZfbPayment,
  153. getVipOrderById,
  154. applePayment,
  155. vipWxPayment,
  156. setIapCertificate
  157. } from '@/api/course'
  158. export default {
  159. data() {
  160. return {
  161. statusBarHeight: '',
  162. descText: ['新客体验', '限时优惠', '一单回本'],
  163. desc: ['月', '季', '年'],
  164. active: 0,
  165. list: [{
  166. imageUrl: '/static/image/agent/member/coupon_icon.png',
  167. title: '优惠券'
  168. }, {
  169. imageUrl: '/static/image/agent/member/system_testing_icon.png',
  170. title: '体制检测'
  171. }, {
  172. imageUrl: '/static/image/agent/member/health_encyclopedia_icon.png',
  173. title: '养生百科'
  174. }, {
  175. imageUrl: '/static/image/agent/member/classic_medical_books_icon.png',
  176. title: '经典医书'
  177. }, {
  178. imageUrl: '/static/image/agent/member/multi_device_login_icon.png',
  179. title: '多设备登录'
  180. }, {
  181. imageUrl: '/static/image/agent/member/remove_ads_icon.png',
  182. title: '去除广告'
  183. }, ],
  184. timer: null,
  185. timeArr: {},
  186. dataList: [],
  187. pickIndex: 0,
  188. packageItem: {
  189. sellPrice: 0,
  190. price: 0
  191. },
  192. checkPrice: 0.0,
  193. payTypes: ["微信支付", "支付宝支付"],
  194. payType: 1, //微信支付:1 支付宝支付:2
  195. user: {
  196. avatar: "/static/images/detault_head.png",
  197. userName: "",
  198. phone: "",
  199. nickName: "",
  200. },
  201. order: null,
  202. showPayTips: false,
  203. agree: false,
  204. isAgreePrivacy: false,
  205. isIos: false,
  206. showIOSPay: 0,
  207. isCanPay: true,
  208. iapChannel: null,
  209. restoreFlag: false,
  210. appleProductId: '',
  211. tzCashier: null,
  212. userInfo: null,
  213. couponTotal: 0,
  214. couponOverallPrice: 0,
  215. fsCouponList: [],
  216. }
  217. },
  218. // onBackPress() {
  219. // // 手动调用返回方法
  220. // uni.navigateBack({ delta: 1});
  221. // // 阻止默认的返回行为
  222. // return true;
  223. // },
  224. onLoad(options) {
  225. // #ifdef APP-PLUS
  226. this.tzCashier = uni.requireNativePlugin("TZBank-Cashier");
  227. this.isIos = this.$isIos();
  228. this.userInfo = JSON.parse(uni.getStorageSync("userInfo"));
  229. if (this.isIos) {
  230. this.getIOSPayStatusFun()
  231. } else {
  232. this.isAgreePrivacy = plus.runtime.isAgreePrivacy();
  233. }
  234. // #endif
  235. this.initData();
  236. const systemInfo = uni.getSystemInfoSync();
  237. this.statusBarHeight = systemInfo.statusBarHeight;
  238. },
  239. onShow() {
  240. if (this.showPayTips) {
  241. this.$refs.popTip.open();
  242. this.showPayTips = false;
  243. }
  244. this.restoreComplateRequest()
  245. },
  246. onUnload() {
  247. const subNVue = uni.getSubNVueById('privilege');
  248. if (subNVue) {
  249. setTimeout(e => {
  250. subNVue.show();
  251. }, 200);
  252. }
  253. },
  254. methods: {
  255. toBack() {
  256. uni.navigateBack()
  257. },
  258. payFun() {
  259. this.$refs.popPayType.open()
  260. },
  261. async getCouponsUnderVipPackageFun() {
  262. const res = await getCouponsUnderVipPackage({
  263. packageId: this.dataList[this.pickIndex].packageId
  264. })
  265. if (res.code == 200) {
  266. this.couponTotal = res.data.couponTotal
  267. this.couponOverallPrice = res.data.couponOverallPrice
  268. this.fsCouponList = res.data.fsCouponList
  269. } else {
  270. uni.showToast({
  271. icon: 'none',
  272. title: res.msg
  273. })
  274. }
  275. },
  276. padZero(num) {
  277. return num < 10 ? `0${num}` : num.toString();
  278. },
  279. formatCountdown(seconds) {
  280. // 1. 先校验输入:确保是有效正整数,避免负数/非数字导致计算错误
  281. const totalSeconds = Math.max(0, Math.floor(Number(seconds) || 0));
  282. // 2. 重新梳理计算逻辑(核心修复)
  283. const hours = Math.floor(totalSeconds / 3600);
  284. const remainingAfterHours = totalSeconds % 3600; // 小时取余后剩余的秒数
  285. const minutes = Math.floor(remainingAfterHours / 60);
  286. const secs = remainingAfterHours % 60;
  287. // 3. 返回格式化结果(补零+原始值)
  288. return {
  289. hours: this.padZero(hours),
  290. minutes: this.padZero(minutes),
  291. seconds: this.padZero(secs),
  292. total: totalSeconds // 确保total是处理后的有效数值
  293. };
  294. },
  295. updateCountdown(now, targetTime) {
  296. console.log(now, targetTime);
  297. const distance = targetTime - now;
  298. console.log('distance', distance);
  299. // 时间计算
  300. const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)) || '00';
  301. const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)) || '00';
  302. const seconds = Math.floor((distance % (1000 * 60)) / 1000) || '00';
  303. // 显示倒计时
  304. console.log(hours + "小时 " + minutes + "分钟 " + seconds + "秒 ");
  305. // 如果倒计时结束,显示消息并停止计时器
  306. if (distance < 0) {
  307. clearInterval(this.timer);
  308. }
  309. return {
  310. hours,
  311. minutes,
  312. seconds
  313. }
  314. },
  315. timingFun() {
  316. const now = new Date().getTime();
  317. const end = now + 600000
  318. this.timer = setInterval(this.updateCountdown(now, end), 1000)
  319. },
  320. getIOSPayStatusFun() {
  321. getIOSPayStatus().then(res => {
  322. if (res.code == 200) {
  323. this.showIOSPay = res.iosPayStatus
  324. }
  325. })
  326. },
  327. initData() {
  328. this.getPackageList();
  329. this.getUserInfo();
  330. },
  331. getPackageList() {
  332. getPackageList().then(res => {
  333. if (res.code == 200) {
  334. this.dataList = res.data;
  335. this.packageItem = this.dataList[0];
  336. this.checkPrice = this.packageItem.sellPrice;
  337. this.appleProductId = this.packageItem.appleProductId
  338. this.getCouponsUnderVipPackageFun()
  339. }
  340. },
  341. rej => {}
  342. );
  343. },
  344. doBuy(type) {
  345. this.payType = type
  346. this.createVipOrder();
  347. },
  348. createVipOrder() {
  349. // if (!this.agree) {
  350. // uni.showToast({
  351. // title: "请同意相关协议",
  352. // icon: 'none'
  353. // });
  354. // return
  355. // }
  356. if (!this.$isLogin()) {
  357. this.$showLoginPage();
  358. return;
  359. }
  360. if (this.isIos && this.showIOSPay != 1) {
  361. uni.showToast({
  362. title: '请开通苹果支付',
  363. icon: 'none'
  364. });
  365. return
  366. }
  367. if (this.isIos && this.showIOSPay == 1) {
  368. this.payType = 2
  369. }
  370. uni.showLoading({
  371. title: ""
  372. });
  373. let params = {
  374. "packageId": this.packageItem.packageId,
  375. "payType": this.payType
  376. };
  377. createVipOrder(params).then(res => {
  378. console.log("qxj createVipOrder res:" + JSON.stringify(res));
  379. uni.hideLoading();
  380. this.$refs.popPayType.close()
  381. if (res.code == 200) {
  382. this.order = res.order;
  383. console.log("qxj payType", this.payType);
  384. if (this.payType == 1) { //微信支付
  385. this.doWxPay();
  386. } else if (this.payType == 2 && this.isIos) { //苹果
  387. this.doApplePay()
  388. } else { //支付宝
  389. this.doAlipay();
  390. }
  391. } else {
  392. uni.showToast({
  393. title: res.msg,
  394. icon: 'none'
  395. });
  396. }
  397. },
  398. rej => {}
  399. );
  400. },
  401. changePackage(index) {
  402. this.pickIndex = index;
  403. this.packageItem = this.dataList[index];
  404. this.checkPrice = this.packageItem.sellPrice;
  405. this.appleProductId = this.packageItem.appleProductId
  406. this.getCouponsUnderVipPackageFun()
  407. },
  408. changePayType(index) {
  409. this.payType = index + 1;
  410. },
  411. getUserInfo() {
  412. let that = this;
  413. getUserInfo().then(res => {
  414. if (res.code == 200) {
  415. if (res.user != null) {
  416. uni.setStorageSync('userInfo', JSON.stringify(res.user));
  417. this.user = res.user;
  418. } else {
  419. uni.showToast({
  420. icon: 'none',
  421. title: res.msg,
  422. });
  423. }
  424. }
  425. },
  426. rej => {}
  427. );
  428. },
  429. doAlipay() {
  430. var data = {
  431. orderId: this.order.orderId
  432. };
  433. let that = this;
  434. // #ifdef APP-PLUS
  435. uni.showLoading();
  436. vipZfbPayment(data).then(res => {
  437. uni.hideLoading();
  438. // that.$refs.popPayType.close();
  439. that.$refs.popTip.open();
  440. if (res.code == 200) {
  441. if (res.type == "tz") {
  442. const match = res.data.body.url.match(/[\?&]businessCstNo=([^&]+)/);
  443. const businessCstNo = match ? match[1] : null;
  444. console.log("qxj tzCashier:" + this.tzCashier + " businessCstNo:" + businessCstNo);
  445. this.tzCashier.pay({
  446. env: 0,
  447. wxMiniProgramType: 0,
  448. wxAppId: 'wx703c4bd07bbd1695',
  449. wxUniversalLink: "https://yjf.runtzh.com/",
  450. orderFlowNo: res.data.body.orderFlowNo,
  451. businessCstNo: businessCstNo,
  452. platMerCstNo: res.data.body.platMerCstNo
  453. }, (res) => {
  454. uni.$emit('closePrivilege', {});
  455. that.showPayTips = true;
  456. });
  457. } else if (res.type == 'hf') {
  458. if (uni.getSystemInfoSync().platform == 'android') {
  459. var alipayScheme = 'alipays://platformapi/startApp?&saId=10000007&qrcode=' + res
  460. .data.qr_code;
  461. } else {
  462. var alipayScheme = 'alipay://platformapi/startApp?&saId=10000007&qrcode=' + res
  463. .data.qr_code;
  464. }
  465. // 在uni-app中使用plus.runtime.openURL打开URL
  466. plus.runtime.openURL(alipayScheme, function(error) {
  467. });
  468. uni.$emit('closePrivilege', {});
  469. that.showPayTips = true;
  470. }
  471. } else {
  472. uni.showToast({
  473. title: res.msg,
  474. icon: 'none'
  475. })
  476. }
  477. },
  478. rej => {}
  479. );
  480. // #endif
  481. },
  482. doWxPay() {
  483. var data = {
  484. orderId: this.order.orderId
  485. };
  486. let that = this;
  487. uni.showLoading();
  488. //眺收银台
  489. // vipWxPayment(data).then(res => {
  490. // uni.hideLoading();
  491. // //that.$refs.popPayType.close();
  492. // that.$refs.popTip.open();
  493. // if(res.code==200){
  494. // console.log('weixcin',res)
  495. // if(res.type=="tz"){
  496. // let businessCstNo=that.userInfo.userId;
  497. // if(!!res.data.body.url){
  498. // const match = res.data.body.url.match(/[\?&]businessCstNo=([^&]+)/);
  499. // businessCstNo = match ? match[1] : null;
  500. // }
  501. // console.log("qxj tzCashier:"+this.tzCashier+" businessCstNo:"+businessCstNo);
  502. // this.tzCashier.pay({
  503. // env:0,
  504. // wxMiniProgramType:0,
  505. // wxAppId:"wx703c4bd07bbd1695",
  506. // wxUniversalLink:"https://yjf.runtzh.com/",
  507. // orderFlowNo:res.data.body.orderFlowNo,
  508. // businessCstNo:businessCstNo,
  509. // platMerCstNo:res.data.body.platMerCstNo
  510. // },(res)=>{
  511. // console.log('weixcin',res)
  512. // uni.$emit('closePrivilege', {});
  513. // that.showPayTips=true;
  514. // });
  515. // }
  516. // else if(res.type=='hf'){
  517. // uni.$emit('closePrivilege', {});
  518. // that.showPayTips=true;
  519. // }
  520. // }
  521. // else{
  522. // uni.showToast({title:res.msg,icon:'none'})
  523. // }
  524. // },
  525. // rej => {}
  526. // );
  527. //跳转小程序支付
  528. plus.share.getServices(function(res) {
  529. var sweixin = null;
  530. for (var i = 0; i < res.length; i++) {
  531. var t = res[i];
  532. if (t.id == 'weixin') {
  533. sweixin = t;
  534. }
  535. }
  536. if (sweixin) {
  537. let path = '/pages_order/userVipOrderPayment?orderId=' + that.order.orderId +
  538. "&payMethod=app";
  539. console.log('调起小程序 path:' + path);
  540. //唤起微信跳转小程序
  541. sweixin.launchMiniProgram({
  542. id: "gh_feb7753a310b", //gh_7a6a32e5ef61 御君方互医
  543. path: '/pages_order/userVipOrderPayment?orderId=' + that.order.orderId +
  544. "&payMethod=app",
  545. type: 0 // 微信小程序版本类型,可取值: 0-正式版; 1-测试版; 2-体验版。 默认值为0。
  546. }, function() {
  547. console.log("微信唤起成功");
  548. return true;
  549. }, function(e) {
  550. console.log("微信唤起失败", e);
  551. uni.showToast({
  552. title: '微信唤起失败,请检查是否有微信应用',
  553. icon: 'none'
  554. });
  555. return false;
  556. });
  557. that.showPayTips = true;
  558. uni.$emit('closePrivilege', {});
  559. } else {
  560. uni.showToast({
  561. title: '微信唤起失败,请检查是否有微信应用',
  562. icon: 'none',
  563. duration: 3000
  564. });
  565. return false;
  566. }
  567. }, function(res) {
  568. console.log(JSON.stringify(res));
  569. });
  570. },
  571. getVipOrderById() {
  572. getVipOrderById(this.order.orderId).then(res => {
  573. this.$refs.popTip.close();
  574. if (res.code == 200) {
  575. if (res.data.status == 1 || res.data.payTime != null) {
  576. // #ifdef APP-PLUS
  577. if (plus.runtime.channel == "baidu") { //获取渠道标识
  578. let bdCmdType = uni.getStorageSync("bdCmdType");
  579. if (bdCmdType != null && parseInt(bdCmdType) <= 2) {
  580. //this.$registerIdCode("orders",2,res.data.payMoney.toString()); //已下单
  581. }
  582. }
  583. // #endif
  584. this.getUserInfo();
  585. uni.showToast({
  586. title: "支付成功",
  587. icon: 'success'
  588. });
  589. } else {
  590. uni.showToast({
  591. title: "支付失败",
  592. icon: 'error'
  593. });
  594. }
  595. }
  596. setTimeout(() => {
  597. this.$navBack();
  598. }, 2000);
  599. },
  600. rej => {}
  601. );
  602. },
  603. openH5(index) {
  604. uni.setStorageSync('url', index == 0 ? "https://userapp.his.cdwjyyh.com/web/userAgreement" :
  605. "https://userapp.hbhdt.top/web/vipAutomaticService");
  606. uni.navigateTo({
  607. url: "/pages/index/h5"
  608. })
  609. },
  610. closeTip() {
  611. this.$refs.popTip.close();
  612. this.getVipOrderById();
  613. },
  614. confirmTip() {
  615. uni.showLoading({
  616. title: "请稍侯...",
  617. mask: true
  618. });
  619. setTimeout(() => {
  620. uni.hideLoading();
  621. this.getVipOrderById();
  622. uni.$emit('refreshUser', {});
  623. }, 2000);
  624. },
  625. handleAgree() { // 同意
  626. this.agree = !this.agree
  627. if (this.isIos) {
  628. if (this.agree) {
  629. plus.runtime.agreePrivacy()
  630. } else {
  631. plus.runtime.disagreePrivacy();
  632. }
  633. }
  634. },
  635. doApplePay() {
  636. var data = {
  637. orderId: this.order.orderId
  638. };
  639. let that = this;
  640. uni.showLoading({
  641. title: ""
  642. });
  643. applePayment(data).then(res => {
  644. uni.hideLoading();
  645. console.log("applePayment===", res)
  646. if (res.code == 200) {
  647. this.checkApplePay(res.payCode)
  648. } else {
  649. uni.showLoading({
  650. title: res.msg,
  651. icon: none
  652. })
  653. }
  654. }).catch(err => {
  655. uni.hideLoading();
  656. })
  657. },
  658. checkApplePay(payCode) {
  659. const that = this
  660. uni.showLoading({
  661. title: '检测支付环境...',
  662. mask: true
  663. })
  664. uni.getProvider({
  665. service: 'payment',
  666. success: (res) => {
  667. let iapChannel = res.providers.find((channel) => channel.id === 'appleiap');
  668. that.iapChannel = iapChannel
  669. if (!iapChannel) {
  670. console.log('Apple IAP channel not found. Check device & configuration.');
  671. uni.hideLoading()
  672. uni.showToast({
  673. title: "不支持苹果支付",
  674. icon: 'none'
  675. })
  676. return;
  677. }
  678. // 获取订单信息,必须调用此方法才能进行 iap 支付
  679. iapChannel.requestOrder([that.appleProductId], function(orderList) {
  680. console.log('requestOrder success666: ', orderList)
  681. that.applePay(payCode)
  682. }, function(e) {
  683. uni.showToast({
  684. title: "获取产品信息失败",
  685. icon: 'none'
  686. })
  687. console.log('requestOrder failed: ' + JSON.stringify(e));
  688. })
  689. },
  690. fail: (err) => {
  691. console.log('Failed to get payment provider:', err);
  692. uni.hideLoading()
  693. uni.showToast({
  694. title: "获取支付通道失败",
  695. icon: 'none'
  696. })
  697. }
  698. });
  699. },
  700. // 请求是否有已完成未关闭的订单
  701. restoreComplateRequest() {
  702. const that = this
  703. if (this.iapChannel) {
  704. this.iapChannel.restoreComplateRequest({
  705. manualFinishTransaction: true, // 3.5.1+ 支持,设置此参数后需要开发者主动关闭订单,参见下面的关闭订单方法 finishTransaction()
  706. username: "USERID_" + that.user.userId
  707. }, function(res) {
  708. // res 格式为数组存放恢复的IAP商品交易信息对象 IAPTransaction,需要将返回的支付凭证传给后端进行二次认证
  709. //如果有并且状态为已支付则请求关闭并回调给后端
  710. console.log("已完成未关闭的订单信息:", res)
  711. if (res.length > 0) {
  712. //轮询关闭订单
  713. res.map(item => {
  714. that.finishTransaction(item, that.iapChannel)
  715. })
  716. }
  717. });
  718. }
  719. },
  720. // 关闭订单
  721. finishTransaction(transaction, iapChannel) {
  722. console.log("==finishTransaction===")
  723. return new Promise((resolve, reject) => {
  724. this.iapChannel.finishTransaction(transaction, (res) => {
  725. console.log("==fresolve inishTransaction===", res)
  726. resolve(res);
  727. }, (err) => {
  728. console.log("==err inishTransaction===", err)
  729. reject(err);
  730. });
  731. });
  732. },
  733. //苹果支付
  734. applePay(payCode) {
  735. console.log("苹果支付", this.order.orderId, payCode)
  736. let that = this
  737. uni.showLoading({
  738. title: '支付中...',
  739. mask: true
  740. })
  741. this.restoreFlag = true
  742. uni.requestPayment({
  743. provider: 'appleiap',
  744. orderInfo: {
  745. productid: that.appleProductId,
  746. username: 'USERID_' + this.user.userId, // 透传参数,一般用于标记订单和用户的关系,向苹果服务器二次验证票据时返回此字段
  747. quantity: 1, // 购买数量,至少大于等于 1
  748. manualFinishTransaction: true,
  749. optimize: true // 设置 optimize: true 解决丢单问题
  750. },
  751. async success(res) {
  752. console.log("苹果支付===", res)
  753. that.restoreFlag = false
  754. // {
  755. // "payment": {
  756. // "productid": "001",
  757. // "quantity": "1",
  758. // "username": "ORDERID562"
  759. // },
  760. // "transactionDate": "2025-07-02 18:20:37",
  761. // "transactionIdentifier": "2000000953130653",
  762. // "transactionReceipt": "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",
  763. // "transactionState": "1",
  764. // "errMsg": "requestPayment:ok"
  765. // }
  766. if (res.transactionState == '1') {
  767. //调用后端接口验签
  768. let data = {
  769. payCode: payCode,
  770. transactionId: res.transactionIdentifier,
  771. receipt: res.transactionReceipt,
  772. chooseEnv: false, // 是否选择正式环境
  773. payclassifyId: that.appleProductId,
  774. classify: 5, // 5:appvip,course
  775. }
  776. that.submitMisson(data, res)
  777. }
  778. },
  779. fail(e) {
  780. console.log('调起苹果支付失败:', e)
  781. that.isCanPay = true
  782. uni.showLoading({
  783. title: '支付失败',
  784. icon: "error"
  785. })
  786. },
  787. complete() {
  788. that.isCanPay = true
  789. uni.hideLoading()
  790. }
  791. })
  792. },
  793. // 苹果内购二次校验
  794. submitMisson(data, transaction) {
  795. const that = this
  796. uni.showLoading({
  797. title: '正在处理支付结果...',
  798. mask: true
  799. })
  800. setIapCertificate(data).then(async res => {
  801. uni.hideLoading()
  802. if (res.code == 200) {
  803. //给支付按钮解锁
  804. that.isCanPay = true
  805. console.log("submitMisson===", res)
  806. if (res.status == 1 || res.payTime != null) {
  807. // #ifdef APP-PLUS
  808. if (plus.runtime.channel == "baidu") { //获取渠道标识
  809. let bdCmdType = uni.getStorageSync("bdCmdType");
  810. if (bdCmdType != null && parseInt(bdCmdType) <= 2) {
  811. //this.$registerIdCode("orders",2,res.data.payMoney.toString()); //已下单
  812. }
  813. }
  814. // #endif
  815. that.getUserInfo();
  816. await that.finishTransaction(transaction)
  817. uni.showToast({
  818. title: "支付成功",
  819. icon: 'success'
  820. });
  821. } else {
  822. uni.showToast({
  823. title: "支付失败",
  824. icon: 'error'
  825. });
  826. }
  827. }
  828. }).catch(() => {
  829. uni.hideLoading()
  830. })
  831. }
  832. }
  833. }
  834. </script>
  835. <style scoped lang="scss">
  836. .container {
  837. background: #141517;
  838. height: auto;
  839. min-height: 100vh;
  840. padding-bottom: 206rpx;
  841. overflow-y: scroll;
  842. overflow-x: hidden;
  843. display: flex;
  844. flex-direction: column;
  845. }
  846. .info {
  847. .info-box {
  848. position: relative;
  849. .vipBg {
  850. position: absolute;
  851. right: -64rpx;
  852. bottom: -160rpx;
  853. }
  854. }
  855. .w264 {
  856. width: 264rpx;
  857. }
  858. .avatar {
  859. padding: 4rpx;
  860. }
  861. }
  862. .content {
  863. margin-top: 92rpx;
  864. padding: 40rpx 32rpx 40rpx;
  865. border-radius: 40rpx 40rpx 0 0;
  866. flex: 1;
  867. .es-mr-64 {
  868. margin-right: 64rpx;
  869. }
  870. .active {
  871. background: linear-gradient(135deg, #FEF7E7 0%, #FFEEE5 100%);
  872. border-radius: 24rpx 24rpx 24rpx 24rpx;
  873. border: 4rpx solid;
  874. border-image: linear-gradient(135deg, rgba(254, 223, 179, 1), rgba(254, 224, 189, 1)) 4 4;
  875. }
  876. .content-card {
  877. padding: 32rpx;
  878. border-radius: 24rpx;
  879. border: 4rpx solid #ECECEC;
  880. .delete-line {
  881. text-decoration: line-through;
  882. }
  883. .color9A9A99 {
  884. color: #9A9A99;
  885. }
  886. .content-card-btn {
  887. padding: 12rpx 30rpx;
  888. border: 1rpx solid #D59B6D;
  889. }
  890. .active-btn {
  891. border: none;
  892. background: linear-gradient(270deg, #FE6300 0%, #FE9D00 100%);
  893. }
  894. }
  895. // 价格
  896. .priceBox {
  897. padding: 24rpx 0 24rpx 24rpx;
  898. background-image: url('/static/image/agent/member/frame-bg.png');
  899. background-repeat: no-repeat;
  900. background-size: 100% 100%;
  901. position: relative;
  902. .priceBox-tip {
  903. padding: 4rpx 12rpx;
  904. background: linear-gradient(90deg, #FEF1E5 0%, #FFE6B5 100%);
  905. border-radius: 8rpx;
  906. }
  907. .yuanBox {
  908. position: absolute;
  909. top: 0;
  910. right: 48rpx;
  911. }
  912. .yuan {
  913. width: 24rpx;
  914. height: 24rpx;
  915. background: #FFF3DE;
  916. border-radius: 4rpx;
  917. }
  918. .colorFFF3DE {
  919. color: #FFF3DE;
  920. }
  921. .priceBox-price {
  922. overflow-x: auto;
  923. overflow-y: hidden;
  924. .priceBox-price-list {
  925. flex-shrink: 0;
  926. width: 164rpx;
  927. height: 164rpx;
  928. background: #FFFCF6;
  929. .red_envelope {
  930. width: 88rpx;
  931. height: 17rpx;
  932. }
  933. }
  934. }
  935. .priceBox-btn {
  936. height: 96rpx;
  937. background: linear-gradient(180deg, #FFF4D5 0%, #FFE5B1 100%);
  938. border-radius: 16rpx;
  939. .priceBox-btn-bg0 {
  940. padding: 8rpx;
  941. // width: 40rpx;
  942. // height: 40rpx;
  943. background: #222222;
  944. border-radius: 8rpx;
  945. }
  946. }
  947. }
  948. .left-line {
  949. width: 120rpx;
  950. height: 6rpx;
  951. border-radius: 3rpx;
  952. }
  953. .left-lineBg {
  954. background: linear-gradient(90deg, rgba(255, 247, 226, 0) 0%, #F7D3B6 100%);
  955. }
  956. .right-lineBg {
  957. background: linear-gradient(90deg, #F7D3B6 0%, rgba(255, 247, 226, 0) 100%);
  958. }
  959. .color4C2B0A {
  960. color: #4C2B0A;
  961. }
  962. }
  963. .colorFF261D {
  964. color: #FF261D;
  965. }
  966. .color995316 {
  967. color: #995316;
  968. }
  969. .colorFE4D46 {
  970. color: #FE4D46;
  971. }
  972. .colorD59B6D {
  973. color: #D59B6D;
  974. }
  975. .fixed {
  976. position: fixed;
  977. bottom: 0;
  978. box-shadow: 0rpx 0rpx 8rpx 6rpx rgba(0, 0, 0, 0.05);
  979. border-radius: 40rpx 40rpx 0rpx 0rpx;
  980. padding: 32rpx;
  981. width: 100vw;
  982. box-sizing: border-box;
  983. .fixed-btn {
  984. height: 104rpx;
  985. width: 100%;
  986. background: linear-gradient(90deg, #E8C591 0%, #F5DEB2 100%);
  987. box-shadow: 0rpx 12rpx 11rpx 0rpx rgba(200, 156, 105, 0.2);
  988. border-radius: 52rpx 52rpx 52rpx 52rpx;
  989. color: #995316;
  990. position: relative;
  991. .fixed-btn-text {
  992. position: absolute;
  993. top: -24rpx;
  994. right: 26rpx;
  995. width: 128rpx;
  996. height: 56rpx;
  997. background: linear-gradient(270deg, #FE6300 0%, #FE9D00 100%);
  998. border-radius: 32rpx 32rpx 32rpx 0;
  999. }
  1000. }
  1001. }
  1002. .pay-box {
  1003. border-radius: 30rpx 30rpx 0rpx 0rpx;
  1004. padding: 30rpx;
  1005. height: 350rpx;
  1006. background-color: #fff;
  1007. width: 100%;
  1008. display: flex;
  1009. flex-direction: column;
  1010. text-align: center;
  1011. justify-content: flex-start;
  1012. .title {
  1013. font-size: 32rpx;
  1014. font-weight: bold;
  1015. color: #111;
  1016. }
  1017. .pay-list {
  1018. margin-top: 50rpx;
  1019. display: flex;
  1020. text-align: center;
  1021. justify-content: center;
  1022. .pay-item {
  1023. margin: 10rpx;
  1024. padding: 30rpx 0rpx;
  1025. border-radius: 60rpx;
  1026. background-color: green;
  1027. flex: 1;
  1028. display: flex;
  1029. text-align: center;
  1030. justify-content: center;
  1031. image {
  1032. width: 40rpx;
  1033. height: 40rpx;
  1034. }
  1035. .name {
  1036. margin-left: 15rpx;
  1037. font-size: 32rpx;
  1038. font-weight: bold;
  1039. color: #fff;
  1040. }
  1041. }
  1042. .wx {
  1043. background-color: #09ba08;
  1044. }
  1045. .alipay {
  1046. background-color: #04a9ed;
  1047. }
  1048. }
  1049. }
  1050. </style>