@activity-maker/popup-checkstand v1.0.0

@activity-maker/popup-checkstand

说明文档

https://alidocs.dingtalk.com/i/team/Y7kmb58PWN4MXLq2/docs/Y7kmbE5yabbMWXLq

数据持久化

localstorage 缓存上一次支付成功方法: payMethod => {"rawData":"ALIPAY"}

API

import popupCheckstand, {
  lyConfigApiList,
  useInitPayPopup,
} from '@activity-maker/popup-checkstand';

popupCheckstand

PopupCheckstandParams extends PopPayCallbackParams

lyConfigApiList

浮层收银台需要 lysdk 的方法参数

属性意义参考 lysdk

'payment.zf1', 'payment.zf2', 'payment.abcPay', 'payment.unionPay', 'payment.spdbPay', 'payment.isUnionPayInstalled', 'page.pullToRefresh', 'page.stopPullToRefresh', 'device.getDeviceInfo', 'storage.setItem', 'storage.getItem', 'payment.ccbPay', 'payment.bocPay', 'statistic.ubtSource',

useInitPayPopup

初始化浮层收银台暴露下单并唤起浮层收银台方法

const { cancelOrder, destroy, popPay } = useInitPayPopup(
  (config: UsePayConfig = {}),
);

UsePayConfig extends Omit<PopPayParams, 'orderItems' | 'context' | 'promotionItems'>

全局的基本配置，如果在调用支付组件中没有传对应的参数，会从这个全局配置中读取。

PopPayParams extends PopupCheckstandParams

公共回调

PopPayCallbackParams

• /** 关闭回调 */ onClose?: () => void;
• /** 打开回调 _/ onShow?: () => void;
• /** 支付方式选择回调 _/ onSelectMethod?: (params: { selectedMethod: string; orderNo: string; }) => void;
• /** 确认支付前回调 */ onPayBefore?: (params: { selectedMethod: string; orderNo: string }) => void;
• /** 支付成功回调 _/ onPaySuccess?: (params: { selectedMethod: string; orderNo: string }) => void;
• /** 支付过程发生错误回调 _/ onPayError?: (params: { selectedMethod?: string; orderNo: string; errorCode: string | number; errorMessage: string; payScene: '1' | '2'; }) => void;

Demo

import PopupCheckstand, {
  lyConfigApiList,
  useInitPayPopup,
} from '@activity-maker/popup-checkstand';

openId = PopupCheckstand.checkWeChatAuth(17); // 微信授权

PopupCheckstand.show({
  cashierInfo: value.cashierInfo,
  thirdPartyId: 17,
  paymentBtnStyle: {
    background: 'linear-gradient(180.02deg, #FFDD12 0.03%, #FFBE1D 100.75%)',
  },
  onShow: (params: any) => {
    console.log('onShow', params);
  },
  onPayBefore: (params: any) => {
    console.log('onPayBefore', params);
  },
  onSelectMethod: (params: any) => {
    console.log('onSelectMethod', params);
  },
  onPaySuccess: (params: any) => {
    console.log('onPaySuccess', params);
  },
  onPayError: (params: any) => {
    console.log('onPayError', params);
  },
  payMethodVersion: {
    ABCPAY: {
      name: 'ABCPAY',
      version: '8.3.46.1',
    },
    UNIONPAY: {
      name: 'UNIONPAY',
      version: '9.0.42',
    },
    SPDBPAY: {
      name: 'SPDBPAY',
      version: '6.0.22',
    },
    CCBSTAPAY: {
      name: 'CCBSTAPAY',
      version: '8.0.22',
    },
    BOCPAY: {
      name: 'BOCPAY',
      version: '0.0.22',
    },
  },
});

import { useInitPayPopup } from '@activity-maker/popup-checkstand';

const { destroy, popPay, cancelOrder } = useInitPayPopup({
  onClose: () => {},
});

popPay({
  orderItems: utilFun.getOrderItems({
    itemId: params.id,
    quantity: 1,
  }),
  context: params.context,
  promotionItems: params.promotionItems,
  onPlaceOrderFail: (_errCode: string | number, errMsg: string) => {},
  onPaySuccess: () => {},
  payMethodVersion: {},
});

支付方式

• 'WXPAY' 微信支付
• 'ALIPAY' 支付宝
• 'XIDIAN' 喜点
• 'PCREDIT' 花呗
• 'CCBPAY' 建行
• 'jdPay' 京东支付 TODO: 暂时不展示
• 'ABCPAY' 农行支付
• 'UNIONPAY' 银联支付
• 'SPDBPAY' 浦发支付
• 'DCPAY' 数字货币
• 'CCBSTAPAY' 建行二三类户
• 'BOCPAY' 中国银行
• 'CMHBPAY' 和包支付