Browse Source

支付宝适配

yxb
skx 1 year ago
parent
commit
fefec8d8f7

+ 5
- 1
pages/order/components/order-list-item-new.vue View File



</view> </view>
<!-- 待支付 --> <!-- 待支付 -->
<view class="btns" v-if="item.orderStep == OrderStatus.待加购权益">
<view class="btns" v-if="item.orderStep == OrderStatus.待加购权益&& item.isValueCard == 1">
<view class="btn btn-normal" @click.stop="gotoCancelOrder(item)">取消订单</view> <view class="btn btn-normal" @click.stop="gotoCancelOrder(item)">取消订单</view>
<view class="btn btn-primary" @click.stop="gotoEditUserOrUnitInfo(item)">加购权益</view> <view class="btn btn-primary" @click.stop="gotoEditUserOrUnitInfo(item)">加购权益</view>
</view> </view>
<view class="btns" v-if="item.orderStep == OrderStatus.待加购权益&& item.isValueCard != 1">
<view class="btn btn-normal" @click.stop="gotoCancelOrder(item)">取消订单</view>
<view class="btn btn-primary" @click.stop="gotoOrderDetails(item)">支付</view>
</view>
<view class="btns" v-if="item.orderStep == OrderStatus.待支付2"> <view class="btns" v-if="item.orderStep == OrderStatus.待支付2">
<view class="btn btn-normal" @click.stop="gotoCancelOrder(item)">取消订单</view> <view class="btn btn-normal" @click.stop="gotoCancelOrder(item)">取消订单</view>
<view class="btn btn-primary" @click.stop="gotoOrderDetails(item)">支付</view> <view class="btn btn-primary" @click.stop="gotoOrderDetails(item)">支付</view>

+ 13
- 4
subpackage/orders/cancel-order.vue View File

import { onLoad } from "@dcloudio/uni-app"; import { onLoad } from "@dcloudio/uni-app";
import { request } from "@/utils/network/request.js"; import { request } from "@/utils/network/request.js";
import { msg, confirm, getOrderStatusName } from "@/utils/utils"; import { msg, confirm, getOrderStatusName } from "@/utils/utils";
import { cancelOrder } from "@/utils/network/api";
import { cancelOrder,cancelOrderNew } from "@/utils/network/api";
import { getItem, StorageKeys } from "@/utils/storage"; import { getItem, StorageKeys } from "@/utils/storage";


const config = { const config = {
method: "POST", method: "POST",
showLoading: true, showLoading: true,
}; };
request(cancelOrder, options).then((res) => {
cancelOrderSuccess();
});
// #ifdef MP-WEIXIN
request(cancelOrder, options).then((res) => {
cancelOrderSuccess();
});
// #endif
// #ifdef MP-ALIPAY
request(cancelOrderNew, options).then((res) => {
cancelOrderSuccess();
});
// #endif
}, },
"取消确认" "取消确认"
); );

+ 8
- 0
subpackage/orders/car-release.vue View File

// url: `/subpackage/orders/release-products?orderId=${state.form.orderId // url: `/subpackage/orders/release-products?orderId=${state.form.orderId
// }&clientFee=${getItem("clientFee")}&&id=${getItem("productId")}`, // }&clientFee=${getItem("clientFee")}&&id=${getItem("productId")}`,
// }); // });
// #ifdef MP-ALIPAY
uni.redirectTo({
url: `/subpackage/orders/order_payment?orderId=${state.form.orderId}`,
});
// #endif
// #ifdef MP-WEIXIN
uni.redirectTo({ uni.redirectTo({
url: `/subpackage/orders/sign-up?orderId=${state.form.orderId}&&clientFee=${getItem("clientFee")}&&id=${getItem("productId")}`, url: `/subpackage/orders/sign-up?orderId=${state.form.orderId}&&clientFee=${getItem("clientFee")}&&id=${getItem("productId")}`,
}); });
// #endif
} }
}else{ }else{
// 不签约 // 不签约

+ 25
- 0
subpackage/orders/mpng-payment.vue View File

<template>
<view class="content-value">
<web-view :src="state.urls"></web-view>
</view>
</template>

<script setup lang="ts">
import { reactive } from "vue";
import {
onLoad,
} from "@dcloudio/uni-app";
// let urls = "http://yunbanktest.bankcomm.com/tcipp/pmss/cipp.jsp?qrCode=https://qr.95516.com/03010000/ncipp/0bcei5qb20230914115204";
let urls = "";
const state = reactive({
urls: "",
});
onLoad((option: any) => {
state.urls = decodeURIComponent("http://yunbanktest.bankcomm.com/tcipp/pmss/cipp.jsp'," + '?qrCode=' + option.url)
console.log(urls)
});
</script>

<style >
</style>

+ 579
- 0
subpackage/orders/order_payment.vue View File

<template>
<navBar title="订单支付" :scrollTop="scrollTop"></navBar>
<navBgCar></navBgCar>
<view class="content-value">
<view @click="savaHandle(item)" class="ul-item" v-for="(item, index) in state.dataArray" :key="index">
<image style="width: 100%; height: 170rpx; border-radius: 20rpx"
:src="`${$imgUrl}applyCard/product-bg.png`"></image>
<view class="item-value">
<image class="icon-tip" :src="`${$imgUrl}applyCard/wechat.png`"></image>
<view class="content">
<view class="title">
{{ item.payName }}
</view>
<!-- 1记账卡2储值卡3记存卡 -->
<!-- <view style="margin-top: 15rpx" class="tip" v-if="item.cardType=='1'">
记账卡
</view> -->
<view style="margin-top: 15rpx" class="tip">
{{ item.payStatusName }}
</view>
</view>
<view class="money">
¥:{{ item.fee * 0.01 }}
</view>
</view>
</view>
<!-- <view class="bottomTip"> 到底啦!敬请期待其他产品! </view> -->
</view>
<!-- <u-popup mode="center" v-model="state.choiceCardShow" closeable>
<view class="squire">
<view class="mask-title" :style="{ '--color': color }">选择办理卡类型</view>

<view class="as-layout-horizontal">
<view v-for="(item, index) in state.radiolist1" :key="index" :label="item.disabled" :name="item.name"
@click="radioChange(item.name)"
style="width: 100%;display: flex;align-items: center;margin-bottom: 30rpx;">
<view class="as-layout-vertical as-gravity-center">
<image style="width: 140rpx; height: 100rpx; border-radius: 20rpx;margin-right: 20rpx;"
:src="`${$imgUrl}card2.png`" mode="aspectFill"></image>
<view style="margin-top: 20rpx;">
{{item.name}}
</view>
</view>
</view>
</view>

</view>
</u-popup> -->
</template>

<script setup lang="ts">
import { onLoad, onPageScroll } from "@dcloudio/uni-app";
import { reactive, ref } from "vue";
import { PAYDETECTION,
PAYMENTORDERAPPLY,
wechatAppID,
wechatSecret,
CardBillQuery,
CardBillPlaceOrder,
CardBillPayStatus,
wechatPayConfigId,
aliPayConfigId,
obtainUserId } 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 navBgCar from "./components/nav-bg-car1";
import navBar from "@/components/nav-bar/nav-bar2.vue";
import { getItem, StorageKeys, setItem } from "@/utils/storage.ts";
import { msg } from "@/utils/utils";
const imgURL = `${fileURL}image/`;
// import { setItem } from "@/utils/storage";

let logo
const scrollTop = ref(0); //滚动距离
// 单选默认数据
// let flag = ref(true)
// 单选
const radioChange = (n) => {
console.log('radioChange', n);
if (n == '记账卡') {
state.isValueCard = 2
} else if (n == '储值卡') {
state.isValueCard = 1
} else {
state.isValueCard = 3
}
uni.redirectTo({
url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isSign=${state.isSign}&isValueCard=${state.isValueCard}`,
});
}
const savaHandle = (val) => {
// console.log("vAL", val)
// setItem("clientFee", val.clientFee);
// setItem("promoteId", val.promoteId);
// setItem("isValueCard", val.isValueCard);
// state.isSign = val.isSign;
// // 判断是几张卡
// console.log("val.cardTypeArr.split(", ")", val.cardTypeArr.split(","))
// // if (val.promoteName.indexOf('选装') != -1) {
// // if (val.cardTypeArr.split(",")[0] == "记账卡") {
// // state.isValueCard = 2
// // } else if (val.cardTypeArr.split(",")[0] == '储值卡') {
// // state.isValueCard = 1
// // } else {
// // state.isValueCard = 3
// // }
// // uni.redirectTo({
// // url: `/subpackage/orders/verify/verify-phone/verify-phone?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isValueCard=${state.isValueCard}`,
// // });
// // return
// // }

// if (val.cardTypeArr.split(",").length == 1) {
// if (val.cardTypeArr.split(",")[0] == "记账卡") {
// state.isValueCard = 2
// } else if (val.cardTypeArr.split(",")[0] == '储值卡') {
// state.isValueCard = 1
// } else {
// state.isValueCard = 3
// }
// uni.redirectTo({
// url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isValueCard=${state.isValueCard}`,
// });
// } else {
// state.radiolist1 = [];
// // 处理卡的数据
// for (var i = 0; i < val.cardTypeArr.split(",").length; i++) {
// const obj = {};
// obj["name"] = val.cardTypeArr.split(",")[i];
// obj["disabled"] = false;
// state.radiolist1.push(obj)
// }
// state.choiceCardShow = true;
// console.log("state.radiolist1", state.radiolist1)
// }
if (val.payStatus === 'UNPAY') {
// #ifdef MP-ALIPAY
my.getAuthCode({
scopes: 'auth_base',
success: res => {
const optionsUser = {
type: 2,
data: {
payConfigId: aliPayConfigId,
code: res.authCode
},
method: "POST",
showLoading: true,
};
console.log('支付宝用户编号请求:',optionsUser)
request(obtainUserId, optionsUser).then((res) => {
console.log('支付宝用户编号返回:',res)
const data = stringToJson(res.bizContent);
const optionsali = {
type: 2,
data: {
orderId:state.orderId,
wxOpenid: data.openId,
payType:val.payType
},
method: "POST",
showLoading: true,
};
console.log('支付下单请求:',optionsali)
request(PAYMENTORDERAPPLY, optionsali).then((res) => {
console.log('支付下单返回:',res)
const data = stringToJson(res.bizContent);
my.tradePay ({
// 调用统一收单交易创建接口(alipay.trade.create),获得返回字段支付宝交易号 trade_no
tradeNO: data.tranPackage,
success: res => {
console.log("支付成功", res);
refresh();
},
fail: res => {
console.log("支付失败", res);
},
});
});
});
},
fail: err => {
console.log('my.getAuthCode 调用失败', err)
}
});
// #endif
}
};
const refresh = () =>{
var data = {
orderId: state.orderId,
source: 'ALI' //请求方来源
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};
console.log("输出内容", options);
request(PAYDETECTION, options).then((res) => {
// console.log(res.bizContent);
const data = stringToJson(res.bizContent);
console.log(data);
// console.log(typeof(data));
if(data.paymentStatus == 'ALLSUCCESS'){
uni.redirectTo({
url: `/subpackage/orders/sign-up-ali?orderId=${state.orderId}`,
});
}
state.dataArray = data.datas;
// HANDLE("办理费",1){},
// MARGIN("保证金",2){},
// PRESTORE("预存金",3){},
// EQUITY("权益费",4){},
for(let i = 0;i < state.dataArray.length;i++){
if(state.dataArray[i].payType === 'HANDLE'){
state.dataArray[i].payName = '办理费'
}else if(state.dataArray[i].payType === 'MARGIN'){
state.dataArray[i].payName = '保证金'
}else if(state.dataArray[i].payType === 'PRESTORE'){
state.dataArray[i].payName = '预存金'
}else if(state.dataArray[i].payType === 'EQUITY'){
state.dataArray[i].payName = '权益费'
}else {
state.dataArray[i].payName = '未知费'
}
// SUCCESS("支付成功",1){},
// PAYING("支付中",2){},
// FAILED("支付失败",3){},
// UNPAY("未支付",4){},
// CLOSED("已关闭",5){},
// CANCELED("已撤销",6){},
// REFUND("转入退费",7){},
if(state.dataArray[i].payStatus === 'SUCCESS'){
state.dataArray[i].payStatusName = '已支付'
}else if(state.dataArray[i].payStatus === 'PAYING'){
state.dataArray[i].payStatusName = '支付中'
}else if(state.dataArray[i].payStatus === 'FAILED'){
state.dataArray[i].payStatusName = '支付失败'
}else if(state.dataArray[i].payStatus === 'UNPAY'){
state.dataArray[i].payStatusName = '未支付'
}else if(state.dataArray[i].payStatus === 'CLOSED'){
state.dataArray[i].payStatusName = '已关闭'
}else if(state.dataArray[i].payStatus === 'CANCELED'){
state.dataArray[i].payStatusName = '已撤销'
}else if(state.dataArray[i].payStatus === 'REFUND'){
state.dataArray[i].payStatusName = '转入退费'
}else{
state.dataArray[i].payStatusName = '未知'
}
}
console.log("state.dataArray", state.dataArray)
});
}

onLoad((option : any) => {
state.orderId = option.orderId;
// state.userType = option.userType;
// state.vehiclePlateColor = option.vehiclePlateColor;
// state.userType = option.userType;
// state.type = option.type;
// option.orderId;
var data = {
orderId: state.orderId,
source: 'ALI' //请求方来源
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};
console.log("输出内容", options);
request(PAYDETECTION, options).then((res) => {
// console.log(res.bizContent);
const data = stringToJson(res.bizContent);
console.log(data);
// console.log(typeof(data));
if(data.paymentStatus == 'ALLSUCCESS'){
uni.redirectTo({
url: `/subpackage/orders/sign-up-ali?orderId=${state.orderId}`,
});
}
state.dataArray = data.datas;
// HANDLE("办理费",1){},
// MARGIN("保证金",2){},
// PRESTORE("预存金",3){},
// EQUITY("权益费",4){},
for(let i = 0;i < state.dataArray.length;i++){
if(state.dataArray[i].payType === 'HANDLE'){
state.dataArray[i].payName = '办理费'
}else if(state.dataArray[i].payType === 'MARGIN'){
state.dataArray[i].payName = '保证金'
}else if(state.dataArray[i].payType === 'PRESTORE'){
state.dataArray[i].payName = '预存金'
}else if(state.dataArray[i].payType === 'EQUITY'){
state.dataArray[i].payName = '权益费'
}else {
state.dataArray[i].payName = '未知费'
}
// SUCCESS("支付成功",1){},
// PAYING("支付中",2){},
// FAILED("支付失败",3){},
// UNPAY("未支付",4){},
// CLOSED("已关闭",5){},
// CANCELED("已撤销",6){},
// REFUND("转入退费",7){},
if(state.dataArray[i].payStatus === 'SUCCESS'){
state.dataArray[i].payStatusName = '办理费'
}else if(state.dataArray[i].payStatus === 'PAYING'){
state.dataArray[i].payStatusName = '支付中'
}else if(state.dataArray[i].payStatus === 'FAILED'){
state.dataArray[i].payStatusName = '支付失败'
}else if(state.dataArray[i].payStatus === 'UNPAY'){
state.dataArray[i].payStatusName = '未支付'
}else if(state.dataArray[i].payStatus === 'CLOSED'){
state.dataArray[i].payStatusName = '已关闭'
}else if(state.dataArray[i].payStatus === 'CANCELED'){
state.dataArray[i].payStatusName = '已撤销'
}else if(state.dataArray[i].payStatus === 'REFUND'){
state.dataArray[i].payStatusName = '转入退费'
}else{
state.dataArray[i].payStatusName = '未知'
}
}
console.log("state.dataArray", state.dataArray)
});
});

//监听页面滚动
onPageScroll((e) => {
scrollTop.value = e.scrollTop;
});

const productReCodeAction = (id) => {
var data = {
productId: id,
orderId: state.orderId,
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};

return new Promise(async (resolve, reject) => {
const res = await request(productReCode, options);
const data = stringToJson(res.bizContent);
resolve(data);
}).catch((error) => {
reject(error);
});
};

const state = reactive({
isValueCard: 1, //卡的类型
radiolist1: [], //选择卡的数据列表
choiceCardShow: false, //选择卡的弹出框
isSign: '',
orderId: "",
userType: 1, //1 个人 2单位
type: 0, //0 客车 1货车
vehiclePlateColor: "",
data: {
show: false,
src: imgURL + "applyCard/edit.png",
},
dataArray: [],
list: [
{
bg: imgURL + "applyCard/product-bg.png",
icon: imgURL + "applyCard/wechat.png",
title: "【货车】微信车主服务",
tip: "绑定微信支付,无需绑定银行卡",
},
],
});
</script>

<style lang="scss" scoped>
::v-deep .u-radio {
display: flex !important;
align-items: center !important;
float: none !important;
}

::v-deep .u-icon__icon {
top: -4px !important;
}

.bottomTip {
margin-top: 100rpx;
text-align: center;
font-size: 28rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #b3b3b3;
}

.content-value {
position: relative;
// margin-top: -50rpx;
padding: 0rpx 30rpx;
position: relative;

.img-pos {
position: absolute;
left: 500rpx;
top: -38rpx;
right: 50rpx;

.img-flex {
display: flex;
justify-content: space-between;
align-items: center;

.car-img {
width: 86rpx;
height: 42rpx;
}

.flag-img {
width: 30rpx;
height: 35rpx;
}
}
}
}

.flex {
display: flex;
align-items: center;
}

.action {
margin-top: 30rpx;
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;
}
}

.action-btn {
margin-left: 45rpx;
width: 121rpx;
height: 61rpx;
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 30rpx;
background: rgba(255, 255, 255, 0.2);

text-align: center;
font-size: 30rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
line-height: 61rpx;
}

.tag1 {
padding: 5rpx;
background: rgba(0, 179, 139, 0.5);
border-radius: 6rpx;
font-size: 22rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
}

.tag3 {
padding: 5rpx;
background: rgba(139, 112, 228, 0.5);
border-radius: 6rpx;
font-size: 22rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
}

.tag2 {
padding: 5rpx;
background: rgba(249, 97, 60, 0.5);
border-radius: 6rpx;
font-size: 22rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
}

.ul-item {
padding: 5px 20rpx;
display: flex;
align-items: center;

.item-value {
padding: 20rpx;
position: absolute;
display: flex;
align-items: center;
// justify-content: space-around;
width: 80%;

.content {
width: 51%;

.title {
font-size: 32rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;

}

.tip {
font-size: 24rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
}
}
}

.icon-tip {
width: 100rpx;
height: 100rpx;
}

.content {
margin-left: 40rpx;
}
}

.money {
color: white;
// float: right;
}

::v-deep .u-mode-center-box {
border-radius: 10rpx;
}

.squire {
padding: 30rpx 30rpx 50rpx 50rpx;
}

.mask-close {
text-align: right;
}

.icon-closed {
width: 48rpx;
height: 48rpx;
}

.mask-title {
text-align: center;
font-size: 32rpx;
color: $uni-text-color-black;
margin-bottom: 50rpx;
}
</style>

+ 8
- 0
subpackage/orders/release-products.vue View File

}; };
const qianyueAction = (val) => { const qianyueAction = (val) => {
console.log(val); console.log(val);
// #ifdef MP-ALIPAY
uni.navigateTo({
url: `/subpackage/orders/sign-up-ali?orderId=${state.orderId}`,
});
// #endif
// #ifdef MP-WEIXIN
uni.navigateTo({ uni.navigateTo({
url: `/subpackage/orders/sign-up?orderId=${state.orderId}&&clientFee=${state.clientFee}&&id=${state.id}`, url: `/subpackage/orders/sign-up?orderId=${state.orderId}&&clientFee=${state.clientFee}&&id=${state.id}`,
}); });
// #endif
}; };
onLoad((option: any) => { onLoad((option: any) => {
state.orderId = option.orderId; state.orderId = option.orderId;

+ 201
- 0
subpackage/orders/sign-up-ali.vue View File

<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 class="content_3">
注:签约成功后请返回本页面,再次点击开通服务
</view>
</view>
<view class="action">
<button type="default" class="button" @click="savaHandle()">
开通服务
</button>
<!-- <button type="default" class="button" @click="addInterestsList()">
加购权益
</button> -->
</view>
</template>

<script setup lang="ts">
import { onLoad, onShow } from "@dcloudio/uni-app";
import { reactive } from "vue";
import { etcQYAction } 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 { setItem } from "@/utils/storage";
import { msg, confirm, getOrderStatusName } from "@/utils/utils";
import {
checkOrderStatus,
orderPay,
wechatAppID,
wechatPayConfigId,
wechatSecret,
} from "@/utils/network/api";
const imgURL = `${fileURL}image/`;

const state = reactive({
openid: "",
orderId: "",
id: "",
clientFee: "",
code:""
});
onLoad((option: any) => {
state.orderId = option.orderId;
});


const addInterestsList=()=>{
uni.navigateTo({
url:`/subpackage/orders/interestsList?orderId=${state.orderId}&&clientFee=${state.clientFee}&&id=${state.id}`
});
}
const savaHandle = () => {
my.getAuthCode({
scopes: 'auth_user',
success: res => {
// 获取需要的用户信息
state.code = res.authCode
console.log("code*******", state.code);
//如果获取openId成功
if (state.code) {
var data = {
orderId: state.orderId,
code: state.code,
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};
request(etcQYAction, options).then((res) => {
console.log("res*******", res);
const data = stringToJson(res.bizContent);
console.log("data*******", data);
if (data.signStatus === "WAIT_SIGN") {
//待签约
my.ap.navigateToAlipayPage({
path: "https://render.alipay.com/p/yuyan/180020010001250649/sign.html?orderId="+data.alipayOrderId
});
}else if (data.signStatus === "SIGNED") {
//已签约
msg("已签约");
confirm(
"您已完成签约,等待业务员审核发货",
() => {
uni.$emit("refreshOrder");
uni.navigateBack();
},
"已完成签约",
false
);
}else if (data.signStatus === "UNSIGN") {
//已解约
msg("已解约");
confirm(
"您已解约!",
() => {
uni.$emit("refreshOrder");
uni.navigateBack();
},
"您已解约",
false
);
}
});
} else {
//如果获取openId失败
uni.showToast({
title: "网络异常,请重试!",
icon: "none",
duration: 1000,
});
return;
}
},
fail: err => {
console.log('my.getAuthCode 调用失败', err)
}
});
}
</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;
}

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

+ 167
- 0
subpackage/personal-center/setting/change-phone-code-ali.vue View File

<!-- 注册第2步 -->
<template>
<view class="register-main">
<!-- <view class="title">请输入验证码</view>
<view class="hint">验证码已发送至:{{ phone }}</view>
<view class="input-code">
<verification-code-input v-model="code"></verification-code-input>
</view>
<view class="hint2">
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view>
<view class="grey" @click="sendRegisterCode">{{
codeDuration === 0 ? "重新发送验证码" : "秒后可重新发送验证码"
}}</view>
</view> -->
<view class="title">验证码</view>
<view class="input-code">
<input class="input" v-model="code" placeholder="请输入验证码" placeholder-class="form-placeholder"
maxlength="6" type="number" />
</view>
</view>

<view class="btn">
<submit-button title="更换手机号" @submit="nextStep"></submit-button>
</view>
</template>

<script setup lang="ts">
import {
msg,
navTo
} from "@/utils/utils";
import {
onLoad
} from "@dcloudio/uni-app";
import {
ref
} from "vue";
import {
request
} from "@/utils/network/request";
import {
sendCode,
changePhone
} from "@/utils/network/api.js";
import {
useUserStore
} from '@/stores/user';
const userStore = useUserStore();
const {
loginOutNoConfirm
} = userStore;
//上个界面传递的电话号码
const phone = ref("");
const code = ref(null);

//倒计时时常
const codeDuration = ref(0);
let interval = null;

onLoad((options) => {
phone.value = options.phone;
codeInterval();
});

/* 验证码倒计时 */
const codeInterval = () => {
codeDuration.value = 60;
interval = setInterval(() => {
codeDuration.value--;
if (codeDuration.value === 0) {
if (interval) {
clearInterval(interval);
interval = null;
}
}
}, 1000);
};

/* 发送验证码 */
const sendRegisterCode = () => {
if (codeDuration.value !== 0) {
return;
}
const options = {
type: 2,
data: {
mobile: phone.value
},
method: "POST",
showLoading: true,
};
request(sendCode, options).then((res) => {
msg("验证码发送成功!");
codeInterval();
});
};

/* 下一步 */
const nextStep = () => {
if (!code.value) {
msg("请先输入验证码!");
return;
}

const options = {
type: 2,
data: {
mobile: phone.value,
verificationCode: code.value
},
method: "POST",
showLoading: true,
};
request(changePhone, options).then((res) => {
msg("更改手机号成功");
codeInterval();
var pages = getCurrentPages().length;
uni.navigateBack({
delta: pages,
});
loginOutNoConfirm()
});
};
</script>

<style lang="scss" scoped>
.register-main {
border-top: 1rpx solid #dcdcdc;
padding: 78rpx 30rpx 50rpx;

.title {
font-size: 32rpx;
color: #333333;
font-weight: 600;
}

.hint {
font-size: 24rpx;
color: #999999;
margin-top: 20rpx;
}
}

.input-code {
margin: 100rpx -10rpx 0px;
}

.hint2 {
margin-top: 40rpx;
display: flex;

.green {
font-size: 28rpx;
color: #00b38b;
}

.grey {
font-size: 24rpx;
color: #999999;
margin-left: 16rpx;
}
}

.btn {
margin: 200rpx 40rpx 0px;
}
</style>

+ 1
- 0
utils/network/api.js View File

export const orderPay = "56"; //订单支付下单 export const orderPay = "56"; //订单支付下单
export const checkOrderStatus = "57"; //订单支付结果查询接口 export const checkOrderStatus = "57"; //订单支付结果查询接口
export const cancelOrder = "7"; //取消订单 export const cancelOrder = "7"; //取消订单
export const cancelOrderNew = "7fba19ba5d354c0ea5c443f9b5c66cdf"; //取消订单(新)
export const receiveOrder = "155"; //订单完成收货 export const receiveOrder = "155"; //订单完成收货
export const getLogistics = "30"; //获取所有的快递公司信息 export const getLogistics = "30"; //获取所有的快递公司信息
export const editOrderAddr = '164'; //订单修改收货地址 export const editOrderAddr = '164'; //订单修改收货地址

Loading…
Cancel
Save