choosePayment.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828
  1. <template>
  2. <view>
  3. <u-modal
  4. v-model="payWayPop"
  5. :title-style="{ color: '#1E1E1E', fontSize: '34rpx' }"
  6. title="选择支付方式"
  7. width="600rpx"
  8. :show-confirm-button="false"
  9. :show-cancel-button="false"
  10. :mask-close-able="true"
  11. @input="modalClose"
  12. >
  13. <view class="pay-content">
  14. <view class="pay-list">
  15. <radio-group @change="payRadioChange">
  16. <template v-if="projectFlag !== 'zhenning' && ((projectFlag === 'wudang' && orderType === 'road') || projectFlag !== 'wudang')">
  17. <!-- #ifdef H5 || MP-WEIXIN -->
  18. <view class="pay-list-item" v-if="wxEnv" @click="payRadioClick('weixin')">
  19. <view class="pay-list-item-image">
  20. <image class="image" src="/static/img/wechat-icon-new.png" mode="aspectFit" />
  21. <view>微信支付</view>
  22. </view>
  23. <view class="radioBox">
  24. <radio color="#2DCF8C" value="weixin" :checked="'weixin' === radioCurrent" />
  25. </view>
  26. </view>
  27. <template v-if="!wxEnv && orderType === 'parking' && isMonthPay">
  28. <view class="pay-list-item flex-center">暂无可用支付方式</view>
  29. </template>
  30. <!-- #endif -->
  31. </template>
  32. <template v-if="alipayEnv && projectFlag === 'puding' && projectFlag !== 'zhijin'">
  33. <view class="pay-list-item" @click="payRadioClick('juhe')">
  34. <view class="pay-list-item-image">
  35. <image class="image" src="/static/img/alipay-icon-new.png" mode="aspectFit" />
  36. <view>支付宝支付<text>随机立减最高10元</text></view>
  37. </view>
  38. <view class="radioBox">
  39. <radio color="#2DCF8C" value="juhe" :checked="'juhe' === radioCurrent" />
  40. </view>
  41. </view>
  42. </template>
  43. <!-- 贵州银行(快捷) 开始 -->
  44. <view v-if="projectFlag === 'wudang'">
  45. <view class="pay-list-item" @click="payRadioClick('gzyh')" v-if="orderType === 'parking' || isMonthPay">
  46. <view class="pay-list-item-image">
  47. <image class="image" src="/static/img/gy-icon-new.png" mode="aspectFit" />
  48. <view>贵州银行</view>
  49. </view>
  50. <view class="radioBox">
  51. <radio color="#2DCF8C" value="gzyh" :checked="'gzyh' === radioCurrent" />
  52. </view>
  53. </view>
  54. </view>
  55. <view v-else>
  56. <view class="pay-list-item" @click="payRadioClick('gzyh')" v-if="orderType !== 'parking' || isMonthPay">
  57. <view class="pay-list-item-image">
  58. <image class="image" src="/static/img/gy-icon-new.png" mode="aspectFit" />
  59. <view>贵州银行</view>
  60. </view>
  61. <view class="radioBox">
  62. <radio color="#2DCF8C" value="gzyh" :checked="'gzyh' === radioCurrent" />
  63. </view>
  64. </view>
  65. </view>
  66. <!-- 贵州银行(快捷) 结束 -->
  67. <template v-if="projectFlag === 'zhenning' && projectFlag !== 'zhijin'">
  68. <view class="pay-list-item" @click="payRadioClick('weixinzn')">
  69. <view class="pay-list-item-image">
  70. <image class="image" src="/static/img/wechat-icon-new.png" mode="aspectFit" />
  71. <view>微信/支付宝</view>
  72. </view>
  73. <view class="radioBox">
  74. <radio color="#2DCF8C" value="weixinzn" :checked="'weixinzn' === radioCurrent" />
  75. </view>
  76. </view>
  77. </template>
  78. <template v-if="!alipayEnv && projectFlag !== 'zhenning' && ((orderType !== 'parking'||projectFlag == 'wudang') || isMonthPay) &&!(projectFlag == 'wudang'&&orderType == 'road')">
  79. <view class="pay-list-item" @click="payRadioClick('juhe')">
  80. <view class="pay-list-item-image" v-if="projectFlag == 'wudang'">
  81. <image class="image" src="/static/img/juhe-icon-new.png" mode="aspectFit" />
  82. <view v-if="projectFlag == 'wudang'">微信/支付宝</view>
  83. </view>
  84. <view class="pay-list-item-image" v-else>
  85. <image class="image" src="/static/img/juhe-icon-new.png" mode="aspectFit" />
  86. <view>聚合支付</view>
  87. </view>
  88. <view class="radioBox">
  89. <radio color="#2DCF8C" value="juhe" :checked="'juhe' === radioCurrent" />
  90. </view>
  91. </view>
  92. </template>
  93. </radio-group>
  94. </view>
  95. <view class="pay-coupon" v-if="radioCurrent === 'weixin' && isShowCoupon">
  96. <u-cell-group :border="false">
  97. <u-cell-item
  98. icon=""
  99. title="优惠券"
  100. :value="couponPopup.currentCoupon.couponName || (couponPopup.couponList.length ? '暂未选择优惠券' : '无可用优惠券')"
  101. :border-bottom="false"
  102. @click="chooseCoupon"
  103. ></u-cell-item>
  104. </u-cell-group>
  105. </view>
  106. <view class="pay-money">
  107. <text class="discount-money" v-if="couponPopup.currentCoupon.couponContent && radioCurrent === 'weixin'"
  108. >¥ {{ getDifference(orderMoney, couponPopup.currentCoupon.couponContent).toFixed(2) }}</text
  109. >
  110. <text class="original-money" :class="couponPopup.currentCoupon.couponContent && radioCurrent === 'weixin' && 'original-discount-money'"
  111. >¥ {{ orderMoney }}</text
  112. >
  113. </view>
  114. <view class="pay-btn">
  115. <u-button type="primary" shape="circle" :disabled="!radioCurrent" @tap="$u.debounce(immediatePayment, 1500, true)">立即支付</u-button>
  116. </view>
  117. </view>
  118. </u-modal>
  119. <!-- 选择优惠券弹框 -->
  120. <u-popup v-model="couponPopup.show" mode="top" length="100%">
  121. <view class="coupon-popup">
  122. <u-navbar
  123. back-text=""
  124. title="我的优惠券"
  125. :background="couponPopup.background"
  126. title-color="#fff"
  127. back-icon-color="#fff"
  128. :custom-back="customBack"
  129. />
  130. <view class="coupon-popup-list">
  131. <template v-if="couponPopup.couponList.length">
  132. <radio-group @change="couponRadioChange">
  133. <view class="coupon-popup-list-item" v-for="(item, index) in couponPopup.couponList" :key="index">
  134. <view class="coupon-popup-list-item-top">
  135. <view class="coupon-popup-list-item-top-left">
  136. <view class="cplitl-left">
  137. <view>
  138. <text>¥</text>
  139. <text>{{ item.couponContent }}</text>
  140. </view>
  141. <view class="cplitl-left-bottom">{{ Number(item.threshold) > 0 ? `停车时长满${item.threshold}分钟` : '无门槛' }}</view>
  142. </view>
  143. <view class="cplitl-right">
  144. <view>{{ item.couponName }}</view>
  145. <view>有限期:剩余{{ calcValidity(item.startTime, item.endTime) }}</view>
  146. </view>
  147. </view>
  148. <view class="coupon-popup-list-item-top-right">
  149. <radio color="#FF6D6D" :value="item.id" :checked="item.id === couponPopup.radioCurrent" @click="couponItemClick(item)" />
  150. </view>
  151. </view>
  152. <view class="coupon-popup-list-item-bottom">
  153. 适用停车点:
  154. <template v-if="item.parkList">
  155. <template v-if="item.parkList.length > 1"> 适用多个停车点 </template>
  156. <template v-else> 仅限{{ item.parkList.map((item) => item.parkName).join('、') }} </template>
  157. <template v-if="item.parkList && item.parkList.length > 1">
  158. <view class="cplib-point">
  159. <u-read-more
  160. text-indent="0"
  161. show-height="0"
  162. :toggle="true"
  163. :shadow-style="{ backgroundImage: 'none' }"
  164. fontSize="20rpx"
  165. close-text="展开所有停车点"
  166. >
  167. <view class="cplib-point-content">{{ item.parkList.map((item) => item.parkName).join('、') }}</view>
  168. </u-read-more>
  169. </view>
  170. </template>
  171. </template>
  172. </view>
  173. </view>
  174. </radio-group>
  175. </template>
  176. <template v-else>
  177. <u-empty text="没有适合的优惠券" mode="coupon" margin-top="300"></u-empty>
  178. </template>
  179. </view>
  180. <view class="coupon-popup-btn">
  181. <u-button type="primary" shape="circle" @click="confimCoupon">确 定</u-button>
  182. </view>
  183. </view>
  184. </u-popup>
  185. <u-toast ref="uToast" />
  186. </view>
  187. </template>
  188. <script>
  189. import { getEnvIsWx, getEnvIsAlipay } from '@/utils/judgEnvironment.js';
  190. import $wxPay from '@/utils/wxPay.js';
  191. export default {
  192. props: {
  193. // 订单数组
  194. curOrderList: {
  195. type: Array,
  196. default: null
  197. },
  198. // 设备编号
  199. deviceNo: {
  200. type: String,
  201. default: null
  202. },
  203. // 地磁支付需要字段
  204. payeeId: {
  205. type: String,
  206. default: undefined
  207. },
  208. // 地磁支付需要字段
  209. payeeName: {
  210. type: String,
  211. default: undefined
  212. },
  213. // 扫码支付需要字段
  214. sanPay: {
  215. type: Boolean,
  216. default: false
  217. },
  218. // 追缴类型
  219. pursueType: {
  220. type: String,
  221. default: undefined
  222. },
  223. // 车牌号
  224. vehicleNo: {
  225. type: String,
  226. default: undefined
  227. },
  228. // 跳转页面
  229. jumpUrl: {
  230. type: String,
  231. default: null
  232. },
  233. // 出口扫码 接口不一样
  234. exportFlag: {
  235. type: Boolean,
  236. default: false
  237. },
  238. // 区分包月支付
  239. isMonthPay: {
  240. type: Boolean,
  241. default: false
  242. },
  243. // 包月id
  244. monthId: {
  245. type: String,
  246. default: null
  247. },
  248. // 室内扫码
  249. isIndoor: {
  250. type: Boolean,
  251. default: false
  252. }
  253. },
  254. data() {
  255. return {
  256. // 支付弹框显示
  257. payWayPop: false,
  258. // 是否微信环境
  259. wxEnv: true,
  260. // 支付宝环境
  261. alipayEnv: true,
  262. // 支付方式选择
  263. radioCurrent: '',
  264. // 订单金额
  265. orderMoney: '',
  266. // 显示优惠券选项
  267. isShowCoupon: false,
  268. // 是否取消优惠券标识
  269. isCancelCoupon: false,
  270. // 选择优惠券弹框
  271. couponPopup: {
  272. // 弹框标识
  273. show: false,
  274. // 优惠券列表
  275. couponList: [],
  276. // 优惠券选中项value
  277. radioCurrent: '',
  278. // navbar背景
  279. background: {
  280. backgroundColor: '#008CFF'
  281. },
  282. // 优惠券选中项
  283. currentCoupon: {}
  284. },
  285. // 订单类型
  286. orderType: 'road'
  287. };
  288. },
  289. methods: {
  290. /**
  291. * 打开弹框触发
  292. * @date 2023-02-17
  293. * @param {any} details
  294. * @param {any} numType single 单笔订单 multiple 多比订单 用于区分多笔订单不能使用优惠券
  295. * @param {any} orderType road 路段订单 parking 停车场订单 用于区分路段订单不使用优惠券
  296. * @returns {any}
  297. */
  298. openPopup(details, numType = 'single', orderType = 'road') {
  299. // 获取环境信息
  300. this.wxEnv = getEnvIsWx();
  301. // 判断支付宝环境
  302. this.alipayEnv = getEnvIsAlipay();
  303. this.orderType = orderType;
  304. if (this.projectFlag === 'zhenning') {
  305. this.radioCurrent = 'weixinzn';
  306. }
  307. if (this.projectFlag === 'wudang') {
  308. if(this.orderType == 'road'){
  309. this.radioCurrent = 'weixin';
  310. }else{
  311. this.radioCurrent = 'juhe';
  312. }
  313. }
  314. if (this.projectFlag === 'zhijin') {
  315. if (this.wxEnv) {
  316. this.radioCurrent = 'weixin';
  317. } else if (this.orderType !== 'parking' || this.isMonthPay) {
  318. this.radioCurrent = 'juhe';
  319. }
  320. }
  321. if (this.projectFlag === 'puding') {
  322. if (this.wxEnv) {
  323. this.radioCurrent = 'weixin';
  324. } else {
  325. this.radioCurrent = 'juhe';
  326. }
  327. }
  328. // 打开弹出层
  329. this.payWayPop = true;
  330. // 计算订单金额
  331. this.orderMoney = details.payAmount.toFixed(2);
  332. // 如果是单个停车订单,且是路边停车,且不是月卡支付,则显示优惠券
  333. // console.table({numType:numType,orderType:orderType,isMonthPay:!this.isMonthPay,wxEnv:this.wxEnv});
  334. if (numType === 'single' && orderType === 'road' && !this.isMonthPay && this.wxEnv) {
  335. this.isShowCoupon = true;
  336. this.isCancelCoupon = true;
  337. // if(this.projectFlag !== 'zhenning'){
  338. // this.getCouponList(details.id);
  339. // }
  340. //puding zhenning wudang zhijin
  341. const excludedFlags = ['puding'];//有优惠券的项目,才请求优惠券接口
  342. if (excludedFlags.includes(this.projectFlag)) {
  343. this.getCouponList(details.id);
  344. }
  345. }
  346. },
  347. /**
  348. * 获取优惠券列表
  349. * @date 2023-02-17
  350. * @param {any} orderId
  351. * @returns {any}
  352. */
  353. getCouponList(orderId) {
  354. this.$u.api.getCouponByOrderIdApi({ orderId:orderId,payAmount:this.orderMoney }).then((res) => {
  355. console.log('getCouponList',res);
  356. this.couponPopup.couponList = res?.data.list ?? [];
  357. if(this.couponPopup.couponList.length>0){//优惠券选择处应自动默认最大额度的优惠券进行显示(后台排序了)
  358. this.couponPopup.currentCoupon = this.couponPopup.couponList[0];
  359. this.couponPopup.radioCurrent = this.couponPopup.couponList[0].id;
  360. }
  361. // console.log(' this.couponPopup.couponList', this.couponPopup.couponList);
  362. });
  363. },
  364. /**
  365. * 选中支付类型
  366. * @date 2023-02-17
  367. * @param {any} {detail}
  368. * @returns {any}
  369. */
  370. payRadioChange({ detail }) {
  371. this.radioCurrent = detail.value;
  372. },
  373. payRadioClick(value) {
  374. this.radioCurrent = value;
  375. },
  376. /**
  377. * 选中优惠券
  378. * @date 2023-02-17
  379. * @returns {any}
  380. */
  381. chooseCoupon() {
  382. this.couponPopup.show = true;
  383. },
  384. /**
  385. * 贵阳银行支付
  386. * @param {Array} orderList 需要支付的订单号组成的数组
  387. * @param {String} deviceNo 设备编号(只有车位锁部分有)
  388. * */
  389. async gyBankPay() {
  390. const params = {
  391. orderList: this.curOrderList,
  392. deviceNo: this.deviceNo,
  393. jumpUrl: this.jumpUrl,
  394. payeeId: this.payeeId,
  395. payeeName: this.payeeName,
  396. pursueType: this.pursueType,
  397. vehicleNo: this.vehicleNo,
  398. sanPay: this.sanPay
  399. };
  400. const apiCall = this.exportFlag ? this.$u.api.quickPayExportApi : this.$u.api.payGzbank;
  401. try {
  402. const res = await apiCall({ ...params });
  403. if (res.data.needPay) {
  404. location.href = res.data.url;
  405. } else {
  406. this.showToast('无需支付', 'info');
  407. setTimeout(() => {
  408. location.reload();
  409. }, 1000);
  410. }
  411. } catch (err) {
  412. // this.showToast(err.msg, 'error');
  413. }
  414. },
  415. /**
  416. * @description: 贵阳银行包月支付
  417. * @return {*}
  418. */
  419. async gyBankMonthPay() {
  420. try {
  421. const res = await this.$u.api.monthPay({ monthId: this.monthId, jumpUrl: this.jumpUrl });
  422. if (res.code === 200) {
  423. location.href = res?.data?.url;
  424. }
  425. } catch (err) {
  426. this.showToast('无法调起支付', 'error');
  427. }
  428. },
  429. /**
  430. * @description: 显示报错信息
  431. * @param {*} title
  432. * @param {*} type
  433. * @return {*}
  434. */
  435. showToast(title, type = 'error') {
  436. this.$refs.uToast.show({ title, type });
  437. },
  438. /**
  439. * 聚合支付
  440. * */
  441. juhePay() {
  442. this.getWXPayByJava(this.curOrderList, this.deviceNo);
  443. },
  444. /**
  445. * @description: 聚合包月支付
  446. * @return {*}
  447. */
  448. async juheMonthPay() {
  449. const params = { monthId: this.monthId, jumpUrl: this.jumpUrl };
  450. try {
  451. const res = await this.$u.api.monthlyWxPay({ ...params });
  452. if (res.code === 200) {
  453. localStorage.setItem('jumpUrl', this.jumpUrl);
  454. location.href = res.data.qrCodeUrl;
  455. }
  456. } catch (err) {
  457. // this.showToast(`无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`, type: 'error');
  458. }
  459. },
  460. /**
  461. * 微信支付处理参数
  462. */
  463. wechatPay() {
  464. const params = {
  465. orderList: this.curOrderList,
  466. openid: this.vuex_wxinfo.openId,
  467. deviceNo: this.deviceNo || undefined,
  468. payeeId: this.payeeId || undefined,
  469. payeeName: this.payeeName || undefined,
  470. vehicleNo: this.vehicleNo,
  471. sanPay: this.sanPay
  472. };
  473. if (this.couponPopup.radioCurrent) {
  474. params.couponMemberId = this.couponPopup.radioCurrent;
  475. }
  476. this.handleWxPay.call(this, params);
  477. },
  478. /**
  479. * @description: 微信支付
  480. * @param {*} params
  481. * @return {*}
  482. */
  483. handleWxPay(params) {
  484. const api = this.exportFlag ? this.$u.api.parkingWechatPayApi : this.$u.api.wechatPayApi;
  485. api({ ...params }).then((res) => {
  486. if (res.code !== 200) {
  487. return;
  488. }
  489. if (!res.data.needPay) {
  490. this.showToast('无需支付', 'info');
  491. setTimeout(() => {
  492. uni.hideLoading();
  493. location.reload();
  494. }, 1000);
  495. return;
  496. }
  497. $wxPay.weixinPay(res.data.wx).then((r) => {
  498. const messageMap = {
  499. 0: '成功',
  500. 1: '已取消支付',
  501. 2: '支付失败,请检查!'
  502. };
  503. switch (Number(r.code)) {
  504. case 0: // 成功
  505. //#ifdef H5
  506. location.reload();
  507. //#endif
  508. break;
  509. case 1: // 取消
  510. if (this.isCancelCoupon) {
  511. this.cancelCoupon(messageMap[r.code]);
  512. } else {
  513. this.showToast(messageMap[r.code], 'info');
  514. }
  515. break;
  516. case 2: // 支付失败
  517. this.showToast(messageMap[r.code], 'error');
  518. break;
  519. }
  520. });
  521. });
  522. },
  523. /**
  524. * @description: 取消优惠券
  525. * @param {*} msg
  526. * @return {*}
  527. */
  528. async cancelCoupon(msg) {
  529. try {
  530. const { code } = await this.$u.api.updateCouponStatusApi({ orderList: this.curOrderList });
  531. if (code === 200) {
  532. this.showToast(msg, 'info');
  533. location.reload();
  534. }
  535. } catch (error) {}
  536. },
  537. /**
  538. * @description: 微信包月支付
  539. * @return {*}
  540. */
  541. wechatMonthPay() {
  542. this.$u.api.wechatMonthlyPayapi({ monthId: this.monthId, openid: this.vuex_wxinfo.openId }).then((response) => {
  543. if (response.code === 200) {
  544. $wxPay.weixinPay(response.data.wx).then((res) => {
  545. this.handleMonthlyPay.call(this, res);
  546. });
  547. }
  548. });
  549. },
  550. /**
  551. * @description: 微信包月支付响应处理
  552. * @param {*} response
  553. * @return {*}
  554. */
  555. handleMonthlyPay(response) {
  556. const messageMap = {
  557. 0: { title: '成功', jumpUrl: this.jumpUrl },
  558. 1: { title: '已取消支付' },
  559. 2: { title: '支付失败,请检查!', type: 'error' }
  560. };
  561. const message = messageMap[Number(response.code)];
  562. this.showToast(message.title, message.type || 'info');
  563. if (message.jumpUrl) {
  564. location.href = message.jumpUrl;
  565. }
  566. },
  567. /**
  568. * 直接通过后台获取贵阳银行微信支付地址
  569. * @param {Array} list 需要支付的订单组合数组
  570. * @param {Number} deviceNo 设备编号(在停车锁部分需要)
  571. * */
  572. async getWXPayByJava(orderList, deviceNo) {
  573. try {
  574. let params = {
  575. orderList,
  576. openid: this.vuex_wxinfo.openId,
  577. jumpUrl: this.jumpUrl,
  578. deviceNo: deviceNo ? deviceNo : null,
  579. payeeId: this.payeeId,
  580. payeeName: this.payeeName,
  581. pursueType: this.pursueType,
  582. vehicleNo: this.vehicleNo,
  583. sanPay: this.sanPay
  584. };
  585. const api = this.exportFlag ? 'polyPayExportApi' : 'ordinaryWxPay'; // 优化代码
  586. const res = await this.$u.api[api](params);
  587. if (res.code === 200) {
  588. if (res.data.needPay) {
  589. localStorage.setItem('jumpUrl', this.jumpUrl);
  590. location.href = res.data.qrCodeUrl;
  591. } else {
  592. this.showToast('无需支付', 'info');
  593. setTimeout(() => {
  594. location.href = this.jumpUrl;
  595. }, 1000);
  596. }
  597. } else {
  598. uni.hideLoading();
  599. }
  600. } catch (err) {
  601. // this.showToast(`无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`, 'error');
  602. }
  603. },
  604. /**
  605. * @description: 镇宁微信支付
  606. * @param {*} orderList
  607. * @param {*} deviceNo
  608. * @return {*}
  609. */
  610. async znWechatPay() {
  611. try {
  612. const params = {
  613. orderList: this.curOrderList,
  614. openid: '',
  615. jumpUrl: this.jumpUrl,
  616. deviceNo: this.deviceNo ? this.deviceNo : null,
  617. payeeId: this.payeeId,
  618. payeeName: this.payeeName,
  619. pursueType: this.pursueType
  620. };
  621. const res = await this.$u.api.ordinaryWxPay(params);
  622. if (res.code === 200) {
  623. const { needPay, qrCodeUrl } = res.data;
  624. if (needPay) {
  625. localStorage.setItem('jumpUrl', this.jumpUrl);
  626. location.href = qrCodeUrl;
  627. } else {
  628. this.showToast('无需支付', 'info');
  629. setTimeout(() => {
  630. location.href = this.jumpUrl;
  631. }, 1000);
  632. }
  633. } else {
  634. uni.hideLoading();
  635. }
  636. } catch (err) {
  637. this.showToast('无法调起微信支付!', 'error');
  638. }
  639. },
  640. /**
  641. * @description: 镇宁聚合
  642. * @return {*}
  643. */
  644. async getWXMonthPayByJava() {
  645. const { monthId, jumpUrl } = this;
  646. try {
  647. const res = await this.$u.api.monthlyWxPay({ monthId, jumpUrl });
  648. if (res.code === 200) {
  649. localStorage.setItem('jumpUrl', jumpUrl);
  650. location.href = res.data.qrCodeUrl;
  651. }
  652. } catch (err) {
  653. // this.showToast('无法调起支付!', 'error');
  654. }
  655. },
  656. /**
  657. * 支付弹框关闭触发
  658. * @date 2023-02-17
  659. * @returns {any}
  660. */
  661. modalClose() {
  662. Object.assign(this, {
  663. payWayPop: false,
  664. wxEnv: true,
  665. alipayEnv: true,
  666. radioCurrent: '',
  667. orderMoney: '',
  668. isShowCoupon: false,
  669. isCancelCoupon: false,
  670. couponPopup: {
  671. show: false,
  672. couponList: [],
  673. radioCurrent: '',
  674. background: {
  675. backgroundColor: '#008CFF'
  676. },
  677. currentCoupon: {}
  678. }
  679. });
  680. this.$emit('closePaymentMethod');
  681. },
  682. /**
  683. * 关闭优惠券弹框
  684. * @date 2023-02-17
  685. * @returns {any}
  686. */
  687. customBack() {
  688. this.couponPopup.show = false;
  689. },
  690. /**
  691. * 优惠券单选触发
  692. * @date 2023-02-17
  693. * @param {any} val
  694. * @returns {any}
  695. */
  696. couponRadioChange(val) {
  697. // this.couponPopup.radioCurrent = val.detail.value;
  698. // this.couponPopup.currentCoupon = this.couponPopup.couponList.find((item) => item.id === this.couponPopup.radioCurrent);
  699. },
  700. couponItemClick(item) {
  701. this.couponPopup.radioCurrent = item.id === this.couponPopup.radioCurrent ? '' : item.id;
  702. },
  703. /**
  704. * 优惠券确认
  705. * @date 2023-02-17
  706. * @returns {any}
  707. */
  708. confimCoupon() {
  709. this.couponPopup.currentCoupon = this.couponPopup.radioCurrent
  710. ? this.couponPopup.couponList.find((item) => item.id === this.couponPopup.radioCurrent)
  711. : {};
  712. this.couponPopup.show = false;
  713. },
  714. /**
  715. * 立即支付
  716. * @date 2023-02-17
  717. * @returns {any}
  718. */
  719. async immediatePayment() {
  720. if (this.isIndoor) {
  721. const relationObj = {
  722. weixin: 'wechat',
  723. gzyh: 'quick',
  724. juhe: 'poly'
  725. };
  726. this.indoorPayment(relationObj[this.radioCurrent]);
  727. } else {
  728. const paymentMethods = {
  729. weixin: this.isMonthPay ? this.wechatMonthPay : this.wechatPay,
  730. gzyh: this.isMonthPay ? this.gyBankMonthPay : this.gyBankPay,
  731. juhe: this.isMonthPay ? this.juheMonthPay : this.juhePay,
  732. weixinzn: this.isMonthPay ? this.getWXMonthPayByJava : this.znWechatPay
  733. };
  734. const paymentMethod = paymentMethods[this.radioCurrent];
  735. if (paymentMethod) {
  736. await paymentMethod.call(this);
  737. }
  738. }
  739. },
  740. /**
  741. * @description: 室内支付
  742. * @param {*} payMode
  743. * @return {*}
  744. */
  745. async indoorPayment(payMode) {
  746. const { curOrderList, couponPopup, vuex_wxinfo, jumpUrl } = this;
  747. const params = {
  748. orderList: curOrderList,
  749. payMode,
  750. couponMemberId: couponPopup?.radioCurrent,
  751. openid: vuex_wxinfo?.openId,
  752. sanPay: true,
  753. jumpUrl
  754. };
  755. const { code, data } = await this.$u.api.indoorPaymentApi({ ...params });
  756. if (code === 200) {
  757. if (data?.needPay) {
  758. switch (payMode) {
  759. case 'wechat': // 微信支付
  760. $wxPay.weixinPay(data?.wechat?.wx).then((r) => {
  761. const messageMap = {
  762. 0: '成功',
  763. 1: '已取消支付',
  764. 2: '支付失败,请检查!'
  765. };
  766. switch (Number(r.code)) {
  767. case 0: // 成功
  768. //#ifdef H5
  769. this.jumpUrl ? (location.href = `${this.jumpUrl}&polyOrderId=${data.polyOrderId}`) : location.reload();
  770. //#endif
  771. break;
  772. case 1: // 取消
  773. if (this.isCancelCoupon) {
  774. this.cancelCoupon(messageMap[r.code]);
  775. } else {
  776. this.showToast(messageMap[r.code], 'info');
  777. }
  778. break;
  779. case 2: // 支付失败
  780. this.showToast(messageMap[r.code], 'error');
  781. break;
  782. }
  783. });
  784. break;
  785. case 'quick': // 快捷支付
  786. location.href = data?.quick;
  787. break;
  788. case 'poly':
  789. localStorage.setItem('jumpUrl', this.jumpUrl);
  790. location.href = data?.poly;
  791. break;
  792. }
  793. } else {
  794. this.showToast('无需支付', 'info');
  795. setTimeout(() => {
  796. this.jumpUrl ? (location.href = `${this.jumpUrl}&polyOrderId=${data.polyOrderId}`) : location.reload();
  797. }, 1000);
  798. }
  799. }
  800. },
  801. /**
  802. * 计算剩余时间
  803. * @date 2022-02-17
  804. * @param {any} datetime
  805. * @returns {any}
  806. */
  807. calcValidity(startTime, endTime) {
  808. let endTimeStr = new Date(endTime).valueOf(),
  809. nowTimeStr = new Date(startTime).valueOf() < Date.now() ? Date.now() : new Date(startTime).valueOf(),
  810. remainTimeStr = endTimeStr - nowTimeStr,
  811. day = Math.floor(remainTimeStr / (1000 * 3600 * 24)),
  812. dayOver = remainTimeStr % (1000 * 3600 * 24),
  813. hours = Math.floor(dayOver / (3600 * 1000)),
  814. hourOver = dayOver % (3600 * 1000),
  815. minutes = Math.floor(hourOver / (60 * 1000));
  816. return `${day}天${hours}小时${minutes}分`;
  817. },
  818. getDifference(a, b) {
  819. return a > b ? a - b : 0;
  820. }
  821. }
  822. };
  823. </script>
  824. <style lang="scss" scoped>
  825. @import './choosePayment.scss';
  826. </style>