choosePayment.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836
  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. let api;
  486. if (this.exportFlag) {
  487. api = this.$u.api.parkingWechatPayApi;
  488. } else if (this.projectFlag === 'zhijin') {
  489. api = this.$u.api.wechatPayApiV1;
  490. } else {
  491. api = this.$u.api.wechatPayApi;
  492. }
  493. api({ ...params }).then((res) => {
  494. if (res.code !== 200) {
  495. return;
  496. }
  497. if (!res.data.needPay) {
  498. this.showToast('无需支付', 'info');
  499. setTimeout(() => {
  500. uni.hideLoading();
  501. location.reload();
  502. }, 1000);
  503. return;
  504. }
  505. $wxPay.weixinPay(res.data.wx).then((r) => {
  506. const messageMap = {
  507. 0: '成功',
  508. 1: '已取消支付',
  509. 2: '支付失败,请检查!'
  510. };
  511. switch (Number(r.code)) {
  512. case 0: // 成功
  513. //#ifdef H5
  514. location.reload();
  515. //#endif
  516. break;
  517. case 1: // 取消
  518. if (this.isCancelCoupon) {
  519. this.cancelCoupon(messageMap[r.code]);
  520. } else {
  521. this.showToast(messageMap[r.code], 'info');
  522. }
  523. break;
  524. case 2: // 支付失败
  525. this.showToast(messageMap[r.code], 'error');
  526. break;
  527. }
  528. });
  529. });
  530. },
  531. /**
  532. * @description: 取消优惠券
  533. * @param {*} msg
  534. * @return {*}
  535. */
  536. async cancelCoupon(msg) {
  537. try {
  538. const { code } = await this.$u.api.updateCouponStatusApi({ orderList: this.curOrderList });
  539. if (code === 200) {
  540. this.showToast(msg, 'info');
  541. location.reload();
  542. }
  543. } catch (error) {}
  544. },
  545. /**
  546. * @description: 微信包月支付
  547. * @return {*}
  548. */
  549. wechatMonthPay() {
  550. this.$u.api.wechatMonthlyPayapi({ monthId: this.monthId, openid: this.vuex_wxinfo.openId }).then((response) => {
  551. if (response.code === 200) {
  552. $wxPay.weixinPay(response.data.wx).then((res) => {
  553. this.handleMonthlyPay.call(this, res);
  554. });
  555. }
  556. });
  557. },
  558. /**
  559. * @description: 微信包月支付响应处理
  560. * @param {*} response
  561. * @return {*}
  562. */
  563. handleMonthlyPay(response) {
  564. const messageMap = {
  565. 0: { title: '成功', jumpUrl: this.jumpUrl },
  566. 1: { title: '已取消支付' },
  567. 2: { title: '支付失败,请检查!', type: 'error' }
  568. };
  569. const message = messageMap[Number(response.code)];
  570. this.showToast(message.title, message.type || 'info');
  571. if (message.jumpUrl) {
  572. location.href = message.jumpUrl;
  573. }
  574. },
  575. /**
  576. * 直接通过后台获取贵阳银行微信支付地址
  577. * @param {Array} list 需要支付的订单组合数组
  578. * @param {Number} deviceNo 设备编号(在停车锁部分需要)
  579. * */
  580. async getWXPayByJava(orderList, deviceNo) {
  581. try {
  582. let params = {
  583. orderList,
  584. openid: this.vuex_wxinfo.openId,
  585. jumpUrl: this.jumpUrl,
  586. deviceNo: deviceNo ? deviceNo : null,
  587. payeeId: this.payeeId,
  588. payeeName: this.payeeName,
  589. pursueType: this.pursueType,
  590. vehicleNo: this.vehicleNo,
  591. sanPay: this.sanPay
  592. };
  593. const api = this.exportFlag ? 'polyPayExportApi' : 'ordinaryWxPay'; // 优化代码
  594. const res = await this.$u.api[api](params);
  595. if (res.code === 200) {
  596. if (res.data.needPay) {
  597. localStorage.setItem('jumpUrl', this.jumpUrl);
  598. location.href = res.data.qrCodeUrl;
  599. } else {
  600. this.showToast('无需支付', 'info');
  601. setTimeout(() => {
  602. location.href = this.jumpUrl;
  603. }, 1000);
  604. }
  605. } else {
  606. uni.hideLoading();
  607. }
  608. } catch (err) {
  609. // this.showToast(`无法调起${this.alipayEnv ? '支付宝' : this.wxEnv ? '微信' : '聚合'}支付!`, 'error');
  610. }
  611. },
  612. /**
  613. * @description: 镇宁微信支付
  614. * @param {*} orderList
  615. * @param {*} deviceNo
  616. * @return {*}
  617. */
  618. async znWechatPay() {
  619. try {
  620. const params = {
  621. orderList: this.curOrderList,
  622. openid: '',
  623. jumpUrl: this.jumpUrl,
  624. deviceNo: this.deviceNo ? this.deviceNo : null,
  625. payeeId: this.payeeId,
  626. payeeName: this.payeeName,
  627. pursueType: this.pursueType
  628. };
  629. const res = await this.$u.api.ordinaryWxPay(params);
  630. if (res.code === 200) {
  631. const { needPay, qrCodeUrl } = res.data;
  632. if (needPay) {
  633. localStorage.setItem('jumpUrl', this.jumpUrl);
  634. location.href = qrCodeUrl;
  635. } else {
  636. this.showToast('无需支付', 'info');
  637. setTimeout(() => {
  638. location.href = this.jumpUrl;
  639. }, 1000);
  640. }
  641. } else {
  642. uni.hideLoading();
  643. }
  644. } catch (err) {
  645. this.showToast('无法调起微信支付!', 'error');
  646. }
  647. },
  648. /**
  649. * @description: 镇宁聚合
  650. * @return {*}
  651. */
  652. async getWXMonthPayByJava() {
  653. const { monthId, jumpUrl } = this;
  654. try {
  655. const res = await this.$u.api.monthlyWxPay({ monthId, jumpUrl });
  656. if (res.code === 200) {
  657. localStorage.setItem('jumpUrl', jumpUrl);
  658. location.href = res.data.qrCodeUrl;
  659. }
  660. } catch (err) {
  661. // this.showToast('无法调起支付!', 'error');
  662. }
  663. },
  664. /**
  665. * 支付弹框关闭触发
  666. * @date 2023-02-17
  667. * @returns {any}
  668. */
  669. modalClose() {
  670. Object.assign(this, {
  671. payWayPop: false,
  672. wxEnv: true,
  673. alipayEnv: true,
  674. radioCurrent: '',
  675. orderMoney: '',
  676. isShowCoupon: false,
  677. isCancelCoupon: false,
  678. couponPopup: {
  679. show: false,
  680. couponList: [],
  681. radioCurrent: '',
  682. background: {
  683. backgroundColor: '#008CFF'
  684. },
  685. currentCoupon: {}
  686. }
  687. });
  688. this.$emit('closePaymentMethod');
  689. },
  690. /**
  691. * 关闭优惠券弹框
  692. * @date 2023-02-17
  693. * @returns {any}
  694. */
  695. customBack() {
  696. this.couponPopup.show = false;
  697. },
  698. /**
  699. * 优惠券单选触发
  700. * @date 2023-02-17
  701. * @param {any} val
  702. * @returns {any}
  703. */
  704. couponRadioChange(val) {
  705. // this.couponPopup.radioCurrent = val.detail.value;
  706. // this.couponPopup.currentCoupon = this.couponPopup.couponList.find((item) => item.id === this.couponPopup.radioCurrent);
  707. },
  708. couponItemClick(item) {
  709. this.couponPopup.radioCurrent = item.id === this.couponPopup.radioCurrent ? '' : item.id;
  710. },
  711. /**
  712. * 优惠券确认
  713. * @date 2023-02-17
  714. * @returns {any}
  715. */
  716. confimCoupon() {
  717. this.couponPopup.currentCoupon = this.couponPopup.radioCurrent
  718. ? this.couponPopup.couponList.find((item) => item.id === this.couponPopup.radioCurrent)
  719. : {};
  720. this.couponPopup.show = false;
  721. },
  722. /**
  723. * 立即支付
  724. * @date 2023-02-17
  725. * @returns {any}
  726. */
  727. async immediatePayment() {
  728. if (this.isIndoor) {
  729. const relationObj = {
  730. weixin: 'wechat',
  731. gzyh: 'quick',
  732. juhe: 'poly'
  733. };
  734. this.indoorPayment(relationObj[this.radioCurrent]);
  735. } else {
  736. const paymentMethods = {
  737. weixin: this.isMonthPay ? this.wechatMonthPay : this.wechatPay,
  738. gzyh: this.isMonthPay ? this.gyBankMonthPay : this.gyBankPay,
  739. juhe: this.isMonthPay ? this.juheMonthPay : this.juhePay,
  740. weixinzn: this.isMonthPay ? this.getWXMonthPayByJava : this.znWechatPay
  741. };
  742. const paymentMethod = paymentMethods[this.radioCurrent];
  743. if (paymentMethod) {
  744. await paymentMethod.call(this);
  745. }
  746. }
  747. },
  748. /**
  749. * @description: 室内支付
  750. * @param {*} payMode
  751. * @return {*}
  752. */
  753. async indoorPayment(payMode) {
  754. const { curOrderList, couponPopup, vuex_wxinfo, jumpUrl } = this;
  755. const params = {
  756. orderList: curOrderList,
  757. payMode,
  758. couponMemberId: couponPopup?.radioCurrent,
  759. openid: vuex_wxinfo?.openId,
  760. sanPay: true,
  761. jumpUrl
  762. };
  763. const { code, data } = await this.$u.api.indoorPaymentApi({ ...params });
  764. if (code === 200) {
  765. if (data?.needPay) {
  766. switch (payMode) {
  767. case 'wechat': // 微信支付
  768. $wxPay.weixinPay(data?.wechat?.wx).then((r) => {
  769. const messageMap = {
  770. 0: '成功',
  771. 1: '已取消支付',
  772. 2: '支付失败,请检查!'
  773. };
  774. switch (Number(r.code)) {
  775. case 0: // 成功
  776. //#ifdef H5
  777. this.jumpUrl ? (location.href = `${this.jumpUrl}&polyOrderId=${data.polyOrderId}`) : location.reload();
  778. //#endif
  779. break;
  780. case 1: // 取消
  781. if (this.isCancelCoupon) {
  782. this.cancelCoupon(messageMap[r.code]);
  783. } else {
  784. this.showToast(messageMap[r.code], 'info');
  785. }
  786. break;
  787. case 2: // 支付失败
  788. this.showToast(messageMap[r.code], 'error');
  789. break;
  790. }
  791. });
  792. break;
  793. case 'quick': // 快捷支付
  794. location.href = data?.quick;
  795. break;
  796. case 'poly':
  797. localStorage.setItem('jumpUrl', this.jumpUrl);
  798. location.href = data?.poly;
  799. break;
  800. }
  801. } else {
  802. this.showToast('无需支付', 'info');
  803. setTimeout(() => {
  804. this.jumpUrl ? (location.href = `${this.jumpUrl}&polyOrderId=${data.polyOrderId}`) : location.reload();
  805. }, 1000);
  806. }
  807. }
  808. },
  809. /**
  810. * 计算剩余时间
  811. * @date 2022-02-17
  812. * @param {any} datetime
  813. * @returns {any}
  814. */
  815. calcValidity(startTime, endTime) {
  816. let endTimeStr = new Date(endTime).valueOf(),
  817. nowTimeStr = new Date(startTime).valueOf() < Date.now() ? Date.now() : new Date(startTime).valueOf(),
  818. remainTimeStr = endTimeStr - nowTimeStr,
  819. day = Math.floor(remainTimeStr / (1000 * 3600 * 24)),
  820. dayOver = remainTimeStr % (1000 * 3600 * 24),
  821. hours = Math.floor(dayOver / (3600 * 1000)),
  822. hourOver = dayOver % (3600 * 1000),
  823. minutes = Math.floor(hourOver / (60 * 1000));
  824. return `${day}天${hours}小时${minutes}分`;
  825. },
  826. getDifference(a, b) {
  827. return a > b ? a - b : 0;
  828. }
  829. }
  830. };
  831. </script>
  832. <style lang="scss" scoped>
  833. @import './choosePayment.scss';
  834. </style>