<template>
	<view class="page">
		<view class="yh-page-wrap">
			<view class="divider"/>
			<view class="title-tip">测试微信支付</view>
			<view class="tip">测试支付用户id</view>
			<view class="input-phone">
				<yh-icon name="user" :size="48" color="#868889" class="left-icon"></yh-icon>
				<input class="input-phone-form"  type="text" v-model="user_uid" placeholder="请输入测试用户id" placeholder-class="placeholder-text" />
				<yh-icon v-show="user_uid" name="cancel-test" :size="48" class="clear-icon" @tap="hanldeToClear('user_uid')"></yh-icon>
			</view>
			<button size="default"  class="custom-btn" @tap="handleToTestLogin()">测试用户登录</button>
			<view class="tip">测试订单id(不填写为1)</view>
			<view class="input-phone">
				<yh-icon name="order" :size="48" color="#868889" class="left-icon"></yh-icon>
				<input class="input-phone-form"  type="text" v-model="testPayForm.order_id" placeholder="请输入测试订单id" placeholder-class="placeholder-text" />
				<yh-icon v-show="testPayForm.order_id" name="cancel-test" :size="48" class="clear-icon" @tap="hanldeToClear('orderId')"></yh-icon>
			</view>
			<view class="tip">测试支付金额(不填写为1元),默认单位元</view>
			<view class="input-phone">
				<yh-icon name="pay" :size="48" color="#868889" class="left-icon"></yh-icon>
				<input class="input-phone-form"  type="text" v-model="testPayForm.real_pay_amount" placeholder="请输入测试支付金额" placeholder-class="placeholder-text" />
				<yh-icon v-show="testPayForm.real_pay_amount" name="cancel-test" :size="48" class="clear-icon" @tap="hanldeToClear('amount')"></yh-icon>
			</view>
			<button size="default"  class="custom-btn" @tap="handleToPay()">发起支付</button>
		</view>
	</view>
</template>
<script setup>
import {ERROR_PATH,SUCCESS_PATH} from '@/config/image-setting.uts'
// #ifdef WEB
import { isWechat} from '@/utils/wechat.uts'
// #endif
import { setToken,setOpenid,setUserUid} from '@/store/user-store.uts'
import {VITE_APP_TABBAR_HOME_PAGE } from '@/config/page-setting.uts'
import { WechatJsPayNotifyResponse,WechatJsPayNotifyResponseData} from '@/api/youhujun/pay/pay-type.uts'
import type { LoginApiResponse } from '@/api/youhujun/user/login/login-type.uts'
import type {LoginByUserIdParam,TestPayParam} from '@/api/test-type.uts'
import {testPayOrder,loginByUserId} from '@/api/test.uts'

const user_uid = ref<number | null>(null)

const testPayForm = reactive<TestPayParam>({
	order_id:undefined,
	real_pay_amount:undefined,
	pay_type:10
})

const hanldeToClear = (name:string)=>{
	if(name === 'user_uid'){
		user_uid.value = null
	}
	if(name === 'orderId'){
		testPayForm.order_id = undefined
	}
	if(name === 'amount'){
		testPayForm.real_pay_amount = undefined
	}
}

//测试用户登录 
const handleToTestLogin = async ()=>{
	if(!user_uid.value){
		uni.showToast({
		  image: ERROR_PATH,
		  title: '用户id不存在',
		  mask: true,
		  duration: 2000
		})
		return 
	}
	const param:LoginByUserIdParam = {
		user_uid:user_uid.value
	}
	const result:LoginApiResponse | null = await loginByUserId(param)
	
	console.log('登录结果',result)
	if(result){
		const {code,data} = result
		if(code === 0){
			if(data?.token){
				setToken(data?.token)
			}
			if(data?.openid){
				setOpenid(data?.openid)
			}
			if(data?.user_uid){
				setUserUid(Number(data?.user_uid))
			}
		}
	}
}

const WeixinJSBridge = window.WeixinJSBridge as any;

function onBridgeReady(data:WechatJsPayNotifyResponseData)
{
  WeixinJSBridge.invoke('getBrandWCPayRequest', 
  {
	  "appId": data.appId,  //"wx2421b1c4370ecxxx",   //公众号ID，由商户传入    
	  "timeStamp":data.timeStamp,//"1395712654",   //时间戳，自1970年以来的秒数    
	  "nonceStr": data.nonceStr, //"e61463f8efa94090b1f366cccfbbb444",      //随机串    
	  "package":"prepay_id="+data.prepay_id, //"prepay_id=wx21201855730335ac86f8c43d1889123400",
	  "signType": "RSA",     //微信签名方式：    
	  "paySign": data.paySign//"oR9d8PuhnIc+YZ8cBHFCwfgpaK9gd7vaRvkYD7rthRAZ\/X+QBhcCYL21N7cHCTUxbQ+EAt6Uy+lwSN22f5YZvI45MLko8Pfso0jm46v5hqcVwrk6uddkGuT+Cdvu4WBqDzaDjnNa5UK3GfE1Wfl2gHxIIY5lLdUgWFts17D4WuolLLkiFZV+JSHMvH7eaLdT9N5GBovBwu5yYKUR7skR8Fu+LozcSqQixnlEZUfyE55feLOQTUYzLmR9pNtPbPsu6WVhbNHMS3Ss2+AehHvz+n64GDmXxbX++IOBvm2olHu3PsOUGRwhudhVf7UcGcunXt8cqNjKNqZLhLw4jq\/xDg==" //微信签名
  },
  function(res:any) 
  {
	  if (res.err_msg == "get_brand_wcpay_request:ok") 
	  {
		  // 使用以上方式判断前端返回,微信团队郑重提示：
		  //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
		  uni.showToast({
			image: SUCCESS_PATH,
			title: "支付完成",
			mask:true,
			duration:2000
		  })
		  
		  uni.navigateTo({
			url:VITE_APP_TABBAR_HOME_PAGE
		  })
	  }
  });
}
if (typeof WeixinJSBridge  == "undefined") 
{
  if (document.addEventListener) 
  {
	  
	  document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
  } 
  else if (document.attachEvent) 
  {
	  document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
	  document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
  }
} 


//发起支付
const handleToPay = async ()=>{
	// #ifdef WEB
	if(!isWechat()){
		uni.showToast({
			image: ERROR_PATH,
			title: "当前环境不支持支付",
			mask:true,
			duration:2000
		})
		return
	}
	if(!testPayForm.order_id){
		testPayForm.order_id = 1
	}
	if(!testPayForm.real_pay_amount){
		testPayForm.real_pay_amount = 1
	}
	
	const result:WechatJsPayNotifyResponse | null = await testPayOrder(testPayForm)
	
	if(result){
		if(result.code === 0){
			onBridgeReady(result.data)
		}
	}
	// #endif
}
</script>
<style lang="scss" scoped>
.divider{
	width: 100%;
	height:40rpx;
}
.title-tip{
	width: 80%; 
	/* 1. 去掉固定高度，改为自适应内容高度 */
	height: auto; 
	/* 2. 调整行高适配多行（原60rpx单行行高，多行需减小，保证行间距舒适） */
	line-height: 30rpx; 
	/* 3. 核心：强制自动换行属性 */
	word-wrap: break-word; /* 允许长单词换行 */
	word-break: break-all; /* 强制换行（兼容中英文） */
	white-space: normal; /* 恢复默认换行（避免单行强制不换行） */
	/* 原有样式保留 */
	color:  #1E90FF;
	border: 2px solid #FFE4C4;
	text-align: center;
	margin: 0 auto;
	/* 可选：加内边距，让文字和边框有间距，更美观 */
	padding: 10rpx 0;
}
.tip{
	width: 80%; 
	/* 1. 去掉固定高度，改为自适应内容高度 */
	height: auto; 
	/* 2. 调整行高适配多行（原60rpx单行行高，多行需减小，保证行间距舒适） */
	line-height: 30rpx; 
	/* 3. 核心：强制自动换行属性 */
	word-wrap: break-word; /* 允许长单词换行 */
	word-break: break-all; /* 强制换行（兼容中英文） */
	white-space: normal; /* 恢复默认换行（避免单行强制不换行） */
	/* 原有样式保留 */
	color: #BEBEBE;
	border: 2px dotted #FFE4E1;
	text-align: center;
	margin: 0 auto;
	/* 可选：加内边距，让文字和边框有间距，更美观 */
	padding: 10rpx 0;
	margin-top: 20rpx;
}
.custom-btn {
	width: 80%;  
	color: #ffffff;
	background-color: #0D8CE9;
	border-color:  	#D3D3D3;
	margin: 20rpx auto;
}
.input-phone{
	width: 610rpx;
	height: 100rpx;
	background: #F4F5F9;
	border-radius: 114rpx 114rpx 114rpx 114rpx;
	border: 2rpx solid #EBEBEB;
	margin:0 auto;
	margin-top: 20rpx;
	display: flex;
	flex-direction: row;
	.input-phone-form{
		width: 400rpx;
		height: 100rpx;
	}
	
}
.left-icon{
	margin-top: 26rpx;
	margin-left: 48rpx;
	margin-right: 16rpx;
}
.clear-icon{
	margin-top: 26rpx;
	margin-left: 16rpx;
}
.placeholder-text{
	font-family: PingFang SC, PingFang SC;
	font-weight: 400;
	font-size: 28rpx;
	color: #868889;
	line-height: 40rpx;
	text-align: left;
	font-style: normal;
	text-transform: none;
}
</style>