|
@@ -1,37 +1,23 @@
|
|
|
<template>
|
|
|
<view class="success-container">
|
|
|
- <!-- 成功图标 -->
|
|
|
- <view class="success-icon">
|
|
|
- <view class="icon-circle">
|
|
|
- <text class="iconfont icon-check">✓</text>
|
|
|
- </view>
|
|
|
- <text class="success-text">面试报名成功</text>
|
|
|
+ <!-- 用户头像 -->
|
|
|
+ <view class="avatar-container">
|
|
|
+ <view class="avatar-circle"></view>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 面试信息 -->
|
|
|
- <view class="interview-info">
|
|
|
- <view class="info-title">面试信息</view>
|
|
|
- <view class="info-item">
|
|
|
- <text class="label">面试时间:</text>
|
|
|
- <text class="value">2024/06/28 14:48</text>
|
|
|
- </view>
|
|
|
- <view class="info-item time-end">
|
|
|
- <text class="value">2024/06/28 16:47</text>
|
|
|
- </view>
|
|
|
- <view class="info-item">
|
|
|
- <text class="label">面试公司:</text>
|
|
|
- <text class="value">敏龙科技集团有限公司</text>
|
|
|
- </view>
|
|
|
+ <!-- 面试结束提示 -->
|
|
|
+ <view class="interview-status">
|
|
|
+ <text class="status-text">AI面试已结束</text>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 底部按钮 -->
|
|
|
- <view class="btn-container">
|
|
|
- <button class="start-btn" @click="startInterview">开始面试</button>
|
|
|
+ <!-- 提示信息 -->
|
|
|
+ <view class="tips-container">
|
|
|
+ <text class="tips-text">本次面试的全部环节已结束,非常感谢您的参与</text>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 底部提示 -->
|
|
|
- <view class="bottom-tips">
|
|
|
- <text>本次面试将在约定时间内有效,请按时参加面试</text>
|
|
|
+ <!-- 底部按钮 -->
|
|
|
+ <view class="btn-container">
|
|
|
+ <button class="confirm-btn" @click="goBack">我知道了</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
@@ -49,14 +35,12 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- startInterview() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/interview-notice/interview-notice',
|
|
|
- fail: (err) => {
|
|
|
- console.error('页面跳转失败:', err);
|
|
|
- uni.showToast({
|
|
|
- title: '页面跳转失败',
|
|
|
- icon: 'none'
|
|
|
+ goBack() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1,
|
|
|
+ fail: () => {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pages/index/index'
|
|
|
});
|
|
|
}
|
|
|
});
|
|
@@ -69,89 +53,74 @@ export default {
|
|
|
.success-container {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
min-height: 100vh;
|
|
|
- background-color: #f5f7fa;
|
|
|
+ background-color: #ffffff;
|
|
|
padding: 30rpx;
|
|
|
}
|
|
|
|
|
|
-.success-icon {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- margin: 60rpx 0;
|
|
|
+.avatar-container {
|
|
|
+ margin-top: 100rpx;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
}
|
|
|
|
|
|
-.icon-circle {
|
|
|
- width: 120rpx;
|
|
|
- height: 120rpx;
|
|
|
- background-color: #4cd137;
|
|
|
+.avatar-circle {
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx;
|
|
|
+ background-color: #f5f5f5;
|
|
|
border-radius: 50%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 20rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.icon-check {
|
|
|
- color: white;
|
|
|
- font-size: 60rpx;
|
|
|
- font-weight: bold;
|
|
|
-}
|
|
|
-
|
|
|
-.success-text {
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
|
|
|
-.interview-info {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 12rpx;
|
|
|
- padding: 30rpx;
|
|
|
- margin-bottom: 40rpx;
|
|
|
+.avatar-circle::after {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ bottom: -30rpx;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ width: 120rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background-color: #f5f5f5;
|
|
|
+ border-radius: 60rpx 60rpx 0 0;
|
|
|
}
|
|
|
|
|
|
-.info-title {
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: bold;
|
|
|
+.interview-status {
|
|
|
+ margin-top: 60rpx;
|
|
|
margin-bottom: 20rpx;
|
|
|
}
|
|
|
|
|
|
-.info-item {
|
|
|
- display: flex;
|
|
|
- margin: 15rpx 0;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #333;
|
|
|
+.status-text {
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #007AFF;
|
|
|
+ font-weight: normal;
|
|
|
}
|
|
|
|
|
|
-.time-end {
|
|
|
- margin-top: -10rpx;
|
|
|
- padding-left: 120rpx;
|
|
|
+.tips-container {
|
|
|
+ padding: 0 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 60rpx;
|
|
|
}
|
|
|
|
|
|
-.label {
|
|
|
- color: #666;
|
|
|
- width: 120rpx;
|
|
|
+.tips-text {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #999999;
|
|
|
+ line-height: 1.5;
|
|
|
}
|
|
|
|
|
|
.btn-container {
|
|
|
- margin: 40rpx 0;
|
|
|
+ margin-top: 80rpx;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 40rpx;
|
|
|
}
|
|
|
|
|
|
-.start-btn {
|
|
|
+.confirm-btn {
|
|
|
width: 100%;
|
|
|
height: 90rpx;
|
|
|
line-height: 90rpx;
|
|
|
- background-color: #6c5ce7;
|
|
|
- color: #fff;
|
|
|
+ background-color: #ffffff;
|
|
|
+ color: #333333;
|
|
|
border-radius: 45rpx;
|
|
|
font-size: 32rpx;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-tips {
|
|
|
- text-align: center;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #999;
|
|
|
- margin-top: 20rpx;
|
|
|
+ border: 1px solid #e0e0e0;
|
|
|
}
|
|
|
</style>
|