// index.json
{
  "usingComponents": {
    "pay-button-sdk": "tta5a3d31e3aecfb9b11://pay-button"
  }
}

// index.ttml
<pay-button-sdk  
  mode="{{2}}"  
  goods-type="{{1}}"  
  goods-id="xxxx"  
  bind:getgoodsinfo="getGoodsInfo"  
  bind:placeorder="userLogin"  
  bind:pay="onPay"  
/>

// bind:pay 使用示例
handleContinutePay(event) {
    const { status, outOrderNo, result } = event.detail;
     if (status === 'success') {
        const { code } = result;
        if (code === 0) {
            // 继续支付成功
        } else {
            // 继续支付失败（超时、取消、关闭）
        }
      } else {
      }
}

/**
  * status: 支付状态，'success' | 'fail'
  * orderId: 抖音交易系统内部订单号，类型为 string
  * outOrderNo：开发者系统交易订单号，类型为 string
  * result: 创建订单、tt.pay 支付结果，类型为 object
*/
handlePay(event) {
    const { status , orderId , outOrderNo , result } = event.detail;
    if (status === 'success') {
        const { code } = result;
        if (code === 0) {
            // 支付成功
        }
    } else {
        // 支付失败（超时、取消、关闭）
        const { errMsg } = result;
    }
}

// bind:refund 使用示例 
handleRefund(event) { 
    const { status, result } = event.detail; 
    if (status === 'success') { 
        const { refundId, outRefundNo } = result; 
    } else { 
        const { errMsg } = result; 
    } 
}

// bind:applyrefund 使用示例 
applyRefund(event) { 
    const { orderId } = event.detail; 
    const extra = { orderId }; // 开发者需要透传的参数，可自定义内容 
    return new Promise(resolve => { 
      resolve(extra); 
    }); 
  },

//融合非预约品退款使用示例 
applyRefund(event) { 
                    const { orderId } = event.detail; 
                        const goodsDetail = [
                                        {
                                          itemOrderId:'8000xxxx'//商品单，可在预下单回调itemOrderlist里获取，或通过查询券状态接口获取
                                        }
                                ];
                  const extra = { orderId , goodsDetail};
                     // 开发者需要透传的参数，可自定义内容 
                    console.log(extra,"退款参数打印");
                    return new Promise(resolve => { 
                      resolve(extra); 
                    }); 
                  },

// bind:applyrefund 指定金额退使用示例 
applyRefund(event) { 
    const { orderId } = event.detail; 
    const itemOrderList = [ 
            {itemOrderId:'ot423412',refundAmount:100}, 
            {itemOrderId:'ot423413',refundAmount:200}, 
        ] 
    const extra = { orderId , itemOrderList }; 
    return new Promise(resolve => { 
      resolve(extra);
    }); 
  },

//融合预约订单未预约单独退
applyRefund(event) { 
    const { orderId } = event.detail; 
    const itemOrderList = [ 
      {
        itemOrderId:'800xxx',//商品单，可在预下单回调itemOrderlist里获取，或通过查询券状态接口获取
        refundAmount:100,//退款金额必传，如果使用营销，需传原价
      }
    ];
  const extra = { orderId , itemOrderList }; 
    console.log(extra);
    return new Promise(resolve => { 
      resolve(extra); 
    }); 
  },

//融合预约订单已预约协同退(预约单+商品单)
applyRefund(event) { 
    const { orderId } = event.detail; 
    const itemOrderList = [ 
      {
        itemOrderId:'ot423412',//商品单，可在预下单回调itemOrderlist里获取，或通过查询券状态接口获取
        refundAmount:100, //退款金额必传，如果使用营销，需传原价
        deductFeeAmount: 0, //手续费，作部分退使用。若部分退，需满足deductFeeAmount+refundAmount=totalAmount(订单原价) 如果没有则传0
        refundRelatedItemType: 2 // 协同退时固定传2
      }
    ];
    const refundRelatedOrderDetail = [
      {
        orderId: "book_id", // 预约单号
        refundAmount: 0, // 预约单金额，如果没有则传0
        deductFeeAmount: 0 // 手续费金额，如果没有则传0
      }
    ]
  const extra = { orderId , itemOrderList , refundRelatedOrderDetail }; 
    return new Promise(resolve => { 
      resolve(extra); 
    }); 
  },

<pay-button-sdk 
    id="3" 
    order-status="{{1}}" 
    order-id="{{orderIdForRefund}}" 
    refund-total-amount="{{orderIdForRefundAmount}}" 
    apply-refund-params="{{applyRefundParams}}"
    ...
 />

Page({
    data: {
        ...
        applyRefundParams: {
            orderId: "123456",
            itemOrderList: [ 
                {itemOrderId:'ot423412',refundAmount:100}, 
                {itemOrderId:'ot423413'}, 
            ] 
        }
    },
})

// bind:getgoodsinfo 使用示例 
// 非商品库商品 
getGoodsInfo(event) { 
    const { goodsId } = event.detail; 
    return new Promise(resolve => { 
      // 在此处开发者可以进行商品数据请求，获取商品信息 
      // 然后将商品信息传入 resolve 函数 
      resolve({ 
        currentPrice: 9900, 
        goodsName: '循礼门M+丨【释集烤肉】99元  原价206.4元超值套餐', 
        goodsPhoto: `https://p11.douyinpic.com/img/aweme-poi/product/spu/c050
          f399ac447daf2715e11e6976c2e2~noop.jpeg?from=3303174740`, 
        goodsLabels: [ 
            {type: 'EXPIRED_RETURNS'}, // 过期退 
            {type: 'REFUND_ANYTIME'}, // 随时退 
            {type: 'BOOK_IN_ADVANCE', value: 2} // 提前2日预约 
        ], 
        minLimits: 1, 
        maxLimits: 2, 
        dateRule: '周一至周日可用',
        relationType: 1,
        validation: { 
            phoneNumber: { 
                required: true  // 手机号是否必填, 为 true则必填，false选填，默认选填 
            },
            reservationType: 1,
            reservationCount: 2,
        }, 
        extra: {}, 
        tradeOption:{ 
            life_trade_flag :1, // 0：非融合链路（默认值）  1：走融合链路（标准融合/完全融合）
            is_use_tag :true // 泛知识是否接入交易规则，true：接入 false：不接入（默认值） 
        }, 
        // 在 bind:getgoodsinfo 返回的 promise 的 resolve 函数中新增 marketingVersion 字段 
        marketingVersion: 2, 
      }); 
    }); 
} 
 
// 商品库商品 
getGoodsInfo(event) { 
    return new Promise(resolve => { 
        // 在此处开发者可以进行商品数据请求，获取商品信息 
        // 然后将商品信息传入 resolve 函数 
        resolve({ 
            minLimits: 1, 
            maxLimits: 2, 
            dateRule: '周一至周日可用', 
            relationType: 1,
            validation: { 
                phoneNumber: { 
                    required: true  // 手机号是否必填 
                },
                reservationType: 1,
                reservationCount: 2,
            }, 
            // 在 bind:getgoodsinfo 返回的 promise 的 resolve 函数中新增 marketingVersion 字段 
            marketingVersion: 2, 
        }); 
    }) 
}

userLogin(event) {
const { goodsId , goodsType } = event.detail
    return new Promise((resolve, reject) => {
        tt.login({
            success() {
                // 用户登录成功并获取信息，则调用 resolve 函数，跳转至提单页
                resolve();
            },
            fail() {
                // 用户登录失败，则跳转提单页失败
                reject();
            }
        });
    });
  },

// 错误信息含义见下文 bind:error报错信息
handleError(event) {
    const { errMsg, errNo} = event.detail;
}

<pay-button 
    ... //任意模式下均可使用bind:error
    bind:error="handleError"
/>

errorHandler(event){
    const { errNo , errMsg } = event.detail
    // do something
    // errNo（错误码，对应某种具体报错原因）
    // errMsg（报错信息）
}

// app.js
/**
  * desc: 主题色配置
  * borderRadius：按钮圆角大小，默认 8rpx
  * backgroundColor：按钮背景色 + 退款原因选中背景色，默认 #FE2C55
  * fontColor：按钮字体颜色，默认 #ffffff
*/
getThemeConfig() {
    return {
        borderRadius: '8rpx',  // string
        backgroundColor: '#FE2C55',  // string
        fontColor: '#ffffff', // string
    }
}

// app.js
/**
  * desc: 获取手机号
  * params：加密数据
  * success：成功回调
  * fail： 失败回调
*/
getPhoneNumber({ params, success, fail }) {
    const { iv, encryptedData } = params;
    // ...
    // 开发者服务端解密 encryptedData，得到手机号
    // ...
    const result = {
        phoneNumber: '13580006666',
    }
    // 回调前端模板
    success(result)
}

<pay-button 
    order-status="{{0}}" 
    order-id="xxx" 
    bind:pay="onContinutePay" 
/>

<pay-button 
  order-status="{{1}}" 
  order-id="xxx" 
  bind:refund="onRefund" 
  bind:applyrefund="applyRefund"
/>

// 示例：老订单申请退款 200 元 
<!-- 
    使用交易模板 1.0 生成的老订单，申请退款需要 refudnrefund-total-amount 
    若无需传入 extra 参数，则无需 bind:applyrefund 方法 
--> 
<pay-button 
  order-status="{{1}}" 
  order-id="xxx" 
  bind:refund="onRefund" 
  bind:applyrefund="applyRefund" 
  refund-total-amount="{{20000}}" 
/>

<pay-button 
    order-status="{{2}}" 
    refund-id="xxx" 
/>

<pay-button 
    order-status="{{3}}" 
    refund-id="xxx" 
/>

<pay-button 
    order-status="{{4}}" 
    refund-id="xxx" 
/>

<!-- 商品库商品 --> 
<pay-button 
  mode="{{2}}" 
  goods-type="{{1}}" 
  goods-id="xxxx" 
  bind:getgoodsinfo="getGoodsInfo" 
  bind:placeorder="userLogin" 
  bind:pay="onPay" 
/> 
 
<!-- 非商品库商品 --> 
<pay-button 
  mode="{{2}}" 
  goods-type="{{2}}" 
  goods-id="xxxx" 
  bind:getgoodsinfo="getGoodsInfo" 
  bind:placeorder="userLogin" 
  bind:pay="onPay" 
/>