zhywpt-sp/subpackage/after-sale/replace-equipment/product-detail.vue

<template>
	<image style="
      margin-top: 20rpx;
      width: 100%;
      height: 240rpx;
      background-color: #eeeeee;
    " :src="`${$imgUrl}applyCard/car-service.png`"></image>
	<view class="title"> 微信车主服务 </view>
	<view class="value">
		<view class="content_1">
			微信车主服务是微信支付为车主用户提供的安全便捷的智慧服务
		</view>
		<view class="content_2">
			本次将为安徽高灯微行科技有限公司开启免密支付服务，后续相关的费用将通过微信车主服务从你的微信支付账户扣除
		</view>
	</view>
	<view class="action">
		<button type="default" class="button" @click="savaHandle()">
			开通服务
		</button>
	</view>
</template>

<script setup lang="ts">
	import { onLoad, onShow } from "@dcloudio/uni-app";
	import { reactive } from "vue";
	import { etcQYAction, getOpenidApi } from "@/utils/network/api.js";
	import { request } from "@/utils/network/request.js";

	import { stringToJson } from "@/utils/network/encryption";
	import { fileURL } from "@/datas/fileURL.js";
	import navBar from "../../components/nav-bar/nav-bar2.vue";
	import navBgCar from "./components/nav-bg-car4";
	import { getItem, StorageKeys } from "@/utils/storage.ts";
	import { msg } from "@/utils/utils";
	import {
		checkOrderStatus,
		orderPay,
		wechatAppID,
		wechatPayConfigId,
		wechatSecret,
	} from "@/utils/network/api";
	const imgURL = `${fileURL}image/`;

	const savaHandle = () => {
		// var data = {
		// 	orderId: state.orderId,
		// 	subOpenId: state.openid
		// }
		// const options = {
		// 	type: 2,
		// 	data: data,
		// 	method: 'POST',
		// 	showLoading: true,
		// }
		// request(etcQYAction, options).then((res) => {
		// 	const data = stringToJson(res.bizContent);
		// 	uni.navigateToMiniProgram({
		// 		appId: data.appId,
		// 		path: data.path,
		// 		extraData: {
		// 			appid: data.appid,
		// 			sub_appid: data.subAppid,
		// 			mch_id: data.mchId,
		// 			sub_mch_id: data.subMchId,
		// 			nonce_str: data.nonceStr,
		// 			sign_type: "HMAC-SHA256",
		// 			sign: data.sign,
		// 			trade_scene: data.tradeScene,
		// 			plate_number: data.plateNum,
		// 			sub_openid: data.subOpenId,
		// 			channel_type: data.channelType,
		// 		},
		// 		success(res) {
		// 			console.log(res);
		// 		},
		// 		complete(res) {
		// 		},
		// 		fail(res) {
		// 			// 未成功跳转到车主小程序
		// 		},
		// 	});
		// })
	};
	const state = reactive({
		openid: "",
		orderId: "",
	});
	onLoad((option : any) => {
		getOpenID();
		state.orderId = option.orderId;
	});
	//获取微信小程序openid
	const getOpenID = () => {
		uni.login({
			provider: "weixin",
			success: function (e) {
				getOpenid(e.code)
				// uni.request({
				//   url: `https://api.weixin.qq.com/sns/jscode2session?appid=${wechatAppID}&secret=${wechatSecret}&js_code=${e.code}&grant_type=authorization_code`,
				//   success: (res: any) => {
				//     state.openid = res.data.openid;
				//   },
				// });
			},
		});
	};
	const getOpenid = (code) => {
		const options = {
			type: 2,
			data: {
				"jsCode": code
			},
			method: "POST",
			showLoading: true,
		};
		// #ifdef MP-WEIXIN
		request(getOpenidApi, options).then((res) => {
			const result = stringToJson(res.bizContent);
			console.log("获取微信小程序openid", result);
			const openidData = stringToJson(result.data);
			// setItem("QYorder", result.data);
			state.openid = openidData.openid
		});
		// #endif
	}
</script>

<style lang="scss" scoped>
	.action {
		margin-top: 40rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		padding-bottom: 30rpx;

		.button {
			height: 80rpx;
			background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%);
			border-radius: 40rpx;
			font-size: 32rpx;
			font-weight: 400;
			color: #ffffff;
			line-height: 80rpx;
		}
	}

	.title {
		text-align: center;
		margin-top: 15rpx;
		font-size: 36rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #333333;
		line-height: 36rpx;
	}

	.value {
		padding: 0rpx 60rpx;
	}

	.content_1 {
		margin-top: 60rpx;
		font-size: 30rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #666666;
		line-height: 58rpx;
	}

	.content_2 {
		margin-top: 50rpx;
		font-size: 30rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: #666666;
		line-height: 58rpx;
	}
</style>