|
@@ -0,0 +1,242 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <view class="registration_success">
|
|
|
|
|
+ <nav-bar title="模考报名成功"></nav-bar>
|
|
|
|
|
+ <view class="exam_success">
|
|
|
|
|
+ <image class="imgs" src="../static/icon_success.png"></image>
|
|
|
|
|
+ <text class="success_word">报名成功</text>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="exam_times">
|
|
|
|
|
+ <view class="time_title">模考大练兵 比拼赢大奖</view>
|
|
|
|
|
+ <view class="time_range">活动时间:{{ startTime | formate('yyyy年mm月dd日')}}-{{ endTime | formate('yyyy年mm月dd日')}}</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="mains">
|
|
|
|
|
+ <view class="gives">
|
|
|
|
|
+ 送价值1109元一建《冲刺黄金包》 提分必备神器
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="middles">
|
|
|
|
|
+ <view class="qr_codes">
|
|
|
|
|
+ <image class="code" src="../static/erCode.png"></image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="discern">长按识别二维码 加活动专属微信号</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="middle_line">
|
|
|
|
|
+ <view class="half_cir_left"></view>
|
|
|
|
|
+ <view class="line"></view>
|
|
|
|
|
+ <view class="half_cir_rig"></view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="flows">
|
|
|
|
|
+ <view class="f_title">活动流程</view>
|
|
|
|
|
+ <view class="f_lines">
|
|
|
|
|
+
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="distance_time">
|
|
|
|
|
+ <view class="time_item">
|
|
|
|
|
+ 距模考开始时间还有:
|
|
|
|
|
+ <u-count-down :timestamp="startTime" :show-days="true" separator="zh"
|
|
|
|
|
+ :show-hours="false" :show-minutes="false" :show-seconds="false" font-size="28"
|
|
|
|
|
+ bg-color="#DFECFD" separator-color="#222222" color="#222222" separator-size="28">
|
|
|
|
|
+ </u-count-down>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="time_item">
|
|
|
|
|
+ 距模考结束时间还有:
|
|
|
|
|
+ <u-count-down :timestamp="endTime" :show-days="true" separator="zh"
|
|
|
|
|
+ :show-hours="false" :show-minutes="false" :show-seconds="false" font-size="28"
|
|
|
|
|
+ bg-color="#DFECFD" separator-color="#222222" color="#222222" separator-size="28">
|
|
|
|
|
+ </u-count-down>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="time_item">活动咨询电话:020-87085982/87085982</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="exam_entry">
|
|
|
|
|
+ <text class="entrys">考试入口:</text>请进入祥粤云学堂小程序或者网站, 在个人中心找到模考功能进行考试。
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script>
|
|
|
|
|
+var curTime = new Date().getTime() // 当前时间的时间戳
|
|
|
|
|
+export default {
|
|
|
|
|
+ name: 'registrationSuccess',
|
|
|
|
|
+ data() {
|
|
|
|
|
+ return {
|
|
|
|
|
+ startTime: '',
|
|
|
|
|
+ endTime: '',
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ onLoad(option) {
|
|
|
|
|
+ console.log('option: ', option)
|
|
|
|
|
+ // option.startTime * 1000 ,1662087489
|
|
|
|
|
+ this.startTime = option.startTime - parseInt(curTime/1000)
|
|
|
|
|
+ this.endTime = option.endTime - parseInt(curTime/1000)
|
|
|
|
|
+ },
|
|
|
|
|
+ onShow() {
|
|
|
|
|
+
|
|
|
|
|
+ },
|
|
|
|
|
+}
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style>
|
|
|
|
|
+page {
|
|
|
|
|
+ background-color: #DFECFD;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|
|
|
|
|
+
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
|
+.registration_success {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+}
|
|
|
|
|
+.exam_success {
|
|
|
|
|
+ margin-top: 68rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ .imgs {
|
|
|
|
|
+ width: 56rpx;
|
|
|
|
|
+ height: 56rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ .success_word {
|
|
|
|
|
+ font-size: 48rpx;
|
|
|
|
|
+ font-weight: 800;
|
|
|
|
|
+ color: #01D38A;
|
|
|
|
|
+ margin-left: 16rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+.exam_times {
|
|
|
|
|
+ margin-top: 92rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ .time_title {
|
|
|
|
|
+ font-size: 48rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #3487FF;
|
|
|
|
|
+ }
|
|
|
|
|
+ .time_range {
|
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
|
+ font-weight: 500;
|
|
|
|
|
+ color: #222222;
|
|
|
|
|
+ margin-top: 12rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+.mains {
|
|
|
|
|
+ width: 670rpx;
|
|
|
|
|
+ height: 874rpx;
|
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
|
+ margin-top: 36rpx;
|
|
|
|
|
+ .gives {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 160rpx;
|
|
|
|
|
+ padding: 32rpx 60rpx;
|
|
|
|
|
+ background-color: #3F8DFD;
|
|
|
|
|
+ font-size: 36rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #FFFFFF;
|
|
|
|
|
+ line-height: 48rpx;
|
|
|
|
|
+ border-radius: 16rpx 16rpx 0rpx 0rpx;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ }
|
|
|
|
|
+ .middles {
|
|
|
|
|
+ margin-top: 48rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ .qr_codes {
|
|
|
|
|
+ width: 268rpx;
|
|
|
|
|
+ height: 268rpx;
|
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
|
+ border-radius: 24rpx;
|
|
|
|
|
+ border: 4rpx solid #91BEFF;
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+ .code {
|
|
|
|
|
+ width: 248rpx;
|
|
|
|
|
+ height: 248rpx;
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 6rpx;
|
|
|
|
|
+ left: 6rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .discern {
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #222222;
|
|
|
|
|
+ margin-top: 24rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .middle_line {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ margin-top: 28rpx;
|
|
|
|
|
+ .half_cir_left {
|
|
|
|
|
+ width: 20rpx;
|
|
|
|
|
+ height: 40rpx;
|
|
|
|
|
+ border-radius: 0rpx 20rpx 20rpx 0rpx;
|
|
|
|
|
+ background-color: #DFECFD;
|
|
|
|
|
+ }
|
|
|
|
|
+ .half_cir_rig {
|
|
|
|
|
+ width: 20rpx;
|
|
|
|
|
+ height: 40rpx;
|
|
|
|
|
+ border-radius: 20rpx 0rpx 0rpx 20rpx;
|
|
|
|
|
+ background-color: #DFECFD;
|
|
|
|
|
+ }
|
|
|
|
|
+ .line {
|
|
|
|
|
+ width: 588rpx;
|
|
|
|
|
+ height: 2rpx;
|
|
|
|
|
+ border-bottom: 2rpx dashed #C4DCFF;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .flows {
|
|
|
|
|
+ margin-top: 18rpx;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ .f_title {
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #222222;
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ top: 0rpx;
|
|
|
|
|
+ left: 0rpx;
|
|
|
|
|
+ &::after {
|
|
|
|
|
+ content: '';
|
|
|
|
|
+ width: 32rpx;
|
|
|
|
|
+ height: 8rpx;
|
|
|
|
|
+ background: #3F8DFD;
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ bottom: -8rpx;
|
|
|
|
|
+ left: 40rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+.distance_time {
|
|
|
|
|
+ margin-top: 56rpx;
|
|
|
|
|
+ .time_item {
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ color: #222222;
|
|
|
|
|
+ margin-bottom: 24rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+.exam_entry {
|
|
|
|
|
+ margin-top: 22rpx;
|
|
|
|
|
+ margin-bottom: 100rpx;
|
|
|
|
|
+ width: 686rpx;
|
|
|
|
|
+ height: 128rpx;
|
|
|
|
|
+ background: #3F8DFD;
|
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
|
+ padding: 20rpx 50rpx;
|
|
|
|
|
+ color: #fff;
|
|
|
|
|
+ line-height: 44rpx;
|
|
|
|
|
+ .entrys {
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ color: #FFFFFF;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|