134cad71 by 张猛

会员认证

1 parent d71abcc3
......@@ -35,29 +35,29 @@
</template>
<script setup>
import {
import {
ref
} from 'vue'
import {
} from 'vue'
import {
onLoad
} from '@dcloudio/uni-app'
import to from 'await-to-js'
import * as api from '@/common/api.js'
} from '@dcloudio/uni-app'
import to from 'await-to-js'
import * as api from '@/common/api.js'
const orderInfo = ref({
const orderInfo = ref({
orderId: '',
tradeNo: '',
merchantName: '中国跆拳道协会',
price: ''
})
})
const goBack = () => {
const goBack = () => {
uni.reLaunch({
url: '/myCenter/auth'
url: '/pages/index/home'
})
}
}
onLoad(async (option) => {
onLoad(async (option) => {
// if (option.orderId) {
// const [err, res] = await to(api.getOrderInfo(option.orderId))
// if (!err && res.data) {
......@@ -66,12 +66,12 @@
// orderInfo.value.orderId = option.orderId
// }
// }
})
})
</script>
<style scoped>
/* 全局容器 */
.success-container {
/* 全局容器 */
.success-container {
display: flex;
flex-direction: column;
align-items: center;
......@@ -79,16 +79,16 @@
min-height: 100vh;
background-color: #f8f9fa;
box-sizing: border-box;
}
}
/* 成功图标容器 */
.success-icon {
/* 成功图标容器 */
.success-icon {
margin-bottom: 40rpx;
animation: fadeIn 0.6s ease-out;
}
}
/* 渐变圆形背景 */
.icon-circle {
/* 渐变圆形背景 */
.icon-circle {
width: 180rpx;
height: 180rpx;
border-radius: 50%;
......@@ -100,34 +100,34 @@
box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3);
/* 轻微上浮动效 */
animation: scaleIn 0.8s ease-out;
}
}
/* 对勾图标 */
.check-icon {
/* 对勾图标 */
.check-icon {
font-size: 90rpx;
color: #ffffff;
font-weight: bold;
}
}
/* 支付成功标题 */
.success-title {
/* 支付成功标题 */
.success-title {
font-size: 48rpx;
font-weight: 700;
color: #333333;
margin-bottom: 12rpx;
animation: slideUp 0.6s ease-out;
}
}
/* 副标题 */
.success-subtitle {
/* 副标题 */
.success-subtitle {
font-size: 28rpx;
color: #666666;
margin-bottom: 60rpx;
animation: slideUp 0.8s ease-out;
}
}
/* 订单信息卡片 */
.info-card {
/* 订单信息卡片 */
.info-card {
width: 100%;
background: #ffffff;
border-radius: 20rpx;
......@@ -135,55 +135,55 @@
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05);
margin-bottom: 80rpx;
animation: fadeIn 1s ease-out;
}
}
/* 单个信息项 */
.info-item {
/* 单个信息项 */
.info-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
}
/* 最后一项去掉下划线 */
.info-item:last-child {
/* 最后一项去掉下划线 */
.info-item:last-child {
border-bottom: none;
}
}
/* 标签样式 */
.label {
/* 标签样式 */
.label {
font-size: 32rpx;
color: #666666;
white-space: nowrap;
margin-right: 20rpx;
flex-shrink: 0;
}
}
/* 值样式 */
.value {
/* 值样式 */
.value {
font-size: 32rpx;
color: #333333;
text-align: right;
word-break: break-all;
word-wrap: break-word;
}
}
/* 金额特殊样式 */
.amount {
/* 金额特殊样式 */
.amount {
color: #cd1e27;
font-weight: 600;
}
}
/* 确定按钮区域 */
.confirm-btn-area {
/* 确定按钮区域 */
.confirm-btn-area {
width: 100%;
padding: 0 20rpx;
box-sizing: border-box;
}
}
/* 确定按钮(渐变+动效) */
.confirm-btn {
/* 确定按钮(渐变+动效) */
.confirm-btn {
width: 100%;
height: 90rpx;
line-height: 90rpx;
......@@ -198,20 +198,20 @@
/* 禁止默认样式 */
position: relative;
overflow: hidden;
}
}
/* 按钮点击反馈 */
.confirm-btn::after {
/* 按钮点击反馈 */
.confirm-btn::after {
border: none;
}
}
.confirm-btn:active {
.confirm-btn:active {
transform: scale(0.98);
box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2);
}
}
/* 动画定义 */
@keyframes fadeIn {
/* 动画定义 */
@keyframes fadeIn {
0% {
opacity: 0;
}
......@@ -219,9 +219,9 @@
100% {
opacity: 1;
}
}
}
@keyframes scaleIn {
@keyframes scaleIn {
0% {
transform: scale(0);
}
......@@ -233,9 +233,9 @@
100% {
transform: scale(1);
}
}
}
@keyframes slideUp {
@keyframes slideUp {
0% {
opacity: 0;
transform: translateY(30rpx);
......@@ -245,5 +245,5 @@
opacity: 1;
transform: translateY(0);
}
}
}
</style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!