326 lines
11 KiB
Vue
326 lines
11 KiB
Vue
![]() |
<template>
|
|||
|
<view class="page flex-col">
|
|||
|
<view class="w750 flex-col align-center">
|
|||
|
<view class="swiper1 flex-col">
|
|||
|
<view class="swiper">
|
|||
|
<u-swiper height="322rpx" :list="list" keyName="swiperPicture" :autoplay="true" circular
|
|||
|
radius="20"></u-swiper>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="image-wrapper_2 flex-row justify-between">
|
|||
|
<image class="thumbnail_1" :src="imagesUrl+'signup.png'"
|
|||
|
@click="goPage('/subSchoolPages/registration/registration')" />
|
|||
|
|
|||
|
<image class="thumbnail_2" :src="imagesUrl+'study.png'"
|
|||
|
@click="goPage('/subSchoolPages/appointment/appointment?tab=0')" />
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="w700 flex-row align-center justify-between padding-left padding-right radius"
|
|||
|
style="margin:20rpx auto 0;height: 180rpx;background-image: linear-gradient(-81deg,rgba(255, 255, 255, 1) 0,rgba(255, 255, 255, 1) 0,rgba(225, 235, 255, 1) 100%,rgba(225, 235, 255, 1) 100%);"
|
|||
|
@click="this.$tab.navigateTo('/subNoticePages/list/list?noticeType=6')">
|
|||
|
<u--image :src="imagesUrl+'notice.png'" width="127rpx" height="123rpx"></u--image>
|
|||
|
<view class="margin-top" style="width: 480rpx;">
|
|||
|
<u-notice-bar :text="notice" direction="column" speed="250" color="#000" bgColor="none" icon="false"
|
|||
|
fontSize="32rpx" :customStyle="{}"></u-notice-bar>
|
|||
|
<text class="text-lg text-bold">{{notice.noticeTitle}}</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view
|
|||
|
class="w700 flex-row align-center justify-between padding-left padding-right bg-white radius margin-top"
|
|||
|
style="height: 120rpx;">
|
|||
|
<view class="flex-row align-center" @click="goPage('/subSchoolPages/appointment/appointment?tab=1')">
|
|||
|
<image :src="imagesUrl+'flower.png'" mode="widthFix" style="width: 33rpx;margin-right:10rpx">
|
|||
|
</image>
|
|||
|
<text class="text-group_3">预约练车</text>
|
|||
|
</view>
|
|||
|
<view class="flex-row align-center" @click="goPage('/subSchoolPages/star/star')">
|
|||
|
<u-icon name="thumb-up-fill" color="#fe6178" size="56rpx"></u-icon>
|
|||
|
<text class="text-group_3">明星教练</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="section_6 flex-row" @click="$map.openMap('蓝安驾校', schoolLatitude, schoolLongitude)">
|
|||
|
<view class="image-wrapper_1 flex-col">
|
|||
|
<image class="label_1" :src="imagesUrl+'location.png'" />
|
|||
|
</view>
|
|||
|
<text class="text_6">{{ schoolAddress }}</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="group_4 flex-col justify-between align-center">
|
|||
|
<view style="width: 700rpx; margin: 20rpx 0;">
|
|||
|
<u-tabs :list="tabs" :scrollable="false" lineColor="transparent" :activeStyle="{
|
|||
|
color: '#fff',
|
|||
|
background: 'linear-gradient(104deg, rgba(44, 142, 211, 1) 0,rgba(44, 142, 211, 1) 0,rgba(39, 85, 148, 1) 100%,rgba(39, 85, 148, 1) 100%)',
|
|||
|
borderRadius: '23px',
|
|||
|
padding:'10rpx 25rpx',
|
|||
|
fontSize:'25rpx'
|
|||
|
}" :inactiveStyle="{
|
|||
|
color: '#000',
|
|||
|
padding:'10rpx',
|
|||
|
fontSize:'25rpx',
|
|||
|
padding:'5rpx 20rpx',
|
|||
|
}" @click="changeTab">
|
|||
|
</u-tabs>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="margin-xs">
|
|||
|
<view class="flex-col text-black align-start w700 padding-left padding-right margin-bottom"
|
|||
|
v-show="currIndex == 0">
|
|||
|
<text class="text-bold text-xxl margin-bottom">报名须知</text>
|
|||
|
<text class="text-xl margin-bottom-xs text-bold">• 初次申领C1/C2/D驾照需符合以下条件:</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">1.身份证 (18-70岁)</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">2.体检表(驾校可办理)</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">3.相片(驾校可办理)</text>
|
|||
|
<text class="text-xl margin-bottom-xs text-bold">• 增驾学员需符合以下条件:</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">1.身份证 (18-70岁)</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">2.体检表(驾校可办理)</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">3.相片(驾校可办理)</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">4.泸州以外的驾驶证需要先转入泸州市。</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">5.上个记分周期未扣满12分。</text>
|
|||
|
|
|||
|
<text class="text-xl margin-bottom-xs text-bold">• 报名后需要下载两个APP软件:</text>
|
|||
|
<text class="margin-bottom-xs text-lg margin-left-sm">1.驾考宝典 2.交管12123</text>
|
|||
|
</view>
|
|||
|
<view class="flex-col text-black align-center w700 padding-left padding-right margin-bottom"
|
|||
|
v-show="currIndex == 1">
|
|||
|
<text class="text-bold text-xxl margin-bottom">学车流程</text>
|
|||
|
<view class="flex-col align-center process-view">
|
|||
|
<text class="process text-bold text-lg margin-bottom">报名缴费</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">体检、面签</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">报名资格审核</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">入班</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目一理论视频学习</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目一考试</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目二场地驾驶技能训练</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目二考试</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目三实际道路训练+科目四理论视频学习</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目三考试</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">科目四考试</text>
|
|||
|
<text class="process text-bold text-lg margin-bottom">领证</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="flex-col text-black align-center w700 padding-left padding-right margin-bottom"
|
|||
|
v-show="currIndex == 2">
|
|||
|
<text class="text-bold text-xxl margin-bottom">报名方法 (C1/C2证)</text>
|
|||
|
<view class="padding text-xl radius margin-bottom"
|
|||
|
style="background-color: rgba(235, 243, 255, 1);">
|
|||
|
<text>1.携带身份证,联系所选教练,由教练带至驾校报名办公室办理报名手续。</text>
|
|||
|
</view>
|
|||
|
<view class="padding text-xl radius margin-bottom "
|
|||
|
style="background-color: rgba(235, 243, 255, 1);">
|
|||
|
<text> 2.携带身份证,直接到驾校报名办公室办理报名手续。驾校将根据您的工作性质、性别、需求安排最合适的教练。</text>
|
|||
|
<text style="display: block;"> 办公室联系电话:18715738834</text>
|
|||
|
</view>
|
|||
|
<view class="padding text-xl radius" style="background-color: rgba(235, 243, 255, 1);">
|
|||
|
<text> 3.在驾校页面,点击下方宣传图片后,填写信息直接报名!信息提交后,驾校工作人员会尽快联系你。驾校将根据您的工作性质、性别、需求安排最合适的教练。</text>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="zhongji">
|
|||
|
<image class="image_12" :src="imagesUrl+'jxtel.png'" @click="call">
|
|||
|
<view class="baizi">{{tel}}</view>
|
|||
|
</view>
|
|||
|
<image class="image_4" :src="imagesUrl+'user_level.png'" @click="goPage('/pages/tabBar/mine/rules')" />
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
<script>
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
tel: '',
|
|||
|
imagesUrl: getApp().globalData.config.imagesUrl,
|
|||
|
baseUrl: getApp().globalData.config.baseUrl,
|
|||
|
constants: {},
|
|||
|
list: [],
|
|||
|
currIndex: 0,
|
|||
|
tabs: [{
|
|||
|
name: '报名须知'
|
|||
|
}, {
|
|||
|
name: '学车流程',
|
|||
|
}, {
|
|||
|
name: '报名方法'
|
|||
|
}],
|
|||
|
schoolAddress: '',
|
|||
|
schoolLatitude: '',
|
|||
|
schoolLongitude: '',
|
|||
|
notice: ''
|
|||
|
|
|||
|
};
|
|||
|
},
|
|||
|
onLoad() {
|
|||
|
this.getSwpier();
|
|||
|
this.getConfig()
|
|||
|
this.getNotice()
|
|||
|
},
|
|||
|
methods: {
|
|||
|
// 获取轮播图
|
|||
|
async getSwpier() {
|
|||
|
const res = await this.$request({
|
|||
|
url: '/system/swiper/listWx',
|
|||
|
data: {
|
|||
|
moudleName: '驾校'
|
|||
|
}
|
|||
|
})
|
|||
|
for (let i = 0; i < res.rows.length; i++) {
|
|||
|
res.rows[i].swiperPicture = getApp().globalData.config.baseUrl + res.rows[i].swiperPicture;
|
|||
|
res.rows[i].title = res.rows[i].swiperName
|
|||
|
}
|
|||
|
this.list = res.rows
|
|||
|
},
|
|||
|
// 获取配置:电话
|
|||
|
async getConfig() {
|
|||
|
const res = await this.$request({
|
|||
|
url: '/system/shopconfig/listWx'
|
|||
|
})
|
|||
|
console.log('电话', res.rows[0]);
|
|||
|
this.schoolAddress = res.rows[0].schoolAddress
|
|||
|
this.schoolLatitude = res.rows[0].schoolLatitude;
|
|||
|
this.schoolLongitude = res.rows[0].schoolLongitude;
|
|||
|
this.tel = this.addHyphenEveryThreeChars(res.rows[0].schoolTel)
|
|||
|
},
|
|||
|
addHyphenEveryThreeChars(str) {
|
|||
|
let modifiedPhoneNumber = str.replace(/(\d{3})(\d{4})(\d{4})/, "$1-$2-$3");
|
|||
|
return modifiedPhoneNumber;
|
|||
|
},
|
|||
|
call() {
|
|||
|
uni.makePhoneCall({
|
|||
|
phoneNumber: this.tel, //电话号码
|
|||
|
success: function(e) {
|
|||
|
console.log(e);
|
|||
|
},
|
|||
|
fail: function(e) {
|
|||
|
console.log(e);
|
|||
|
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
changeTab(item) {
|
|||
|
this.currIndex = item.index
|
|||
|
},
|
|||
|
goPage(path) {
|
|||
|
this.$tab.navigateTo(path)
|
|||
|
},
|
|||
|
// 获取公告
|
|||
|
async getNotice() {
|
|||
|
const res = await this.$request({
|
|||
|
url: '/system/notice/listWx',
|
|||
|
data: {
|
|||
|
noticeType: 6,
|
|||
|
pageSize: 5
|
|||
|
}
|
|||
|
})
|
|||
|
let notice = []
|
|||
|
for (let i = 0; i < res.rows.length; i++) {
|
|||
|
notice.push(
|
|||
|
res.rows[i].noticeTitle
|
|||
|
)
|
|||
|
}
|
|||
|
this.notice = notice;
|
|||
|
},
|
|||
|
// 打开公告
|
|||
|
openNoticePop(noticeTitle, noticeContent, createTime) {
|
|||
|
this.noticePopShow = true
|
|||
|
this.currNotice = {
|
|||
|
noticeTitle,
|
|||
|
noticeContent,
|
|||
|
createTime
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
},
|
|||
|
};
|
|||
|
</script>
|
|||
|
<style scoped lang="scss">
|
|||
|
@import './index.rpx.css';
|
|||
|
|
|||
|
.nickname-pop {
|
|||
|
width: 680rpx;
|
|||
|
padding: 70rpx 50rpx 0rpx;
|
|||
|
background: #242a38;
|
|||
|
border-radius: 10rpx;
|
|||
|
}
|
|||
|
|
|||
|
.nickname-input {
|
|||
|
width: 100%;
|
|||
|
font-size: 26rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
align-items: center;
|
|||
|
}
|
|||
|
|
|||
|
.nickname-label {
|
|||
|
font-size: 30rpx;
|
|||
|
display: block;
|
|||
|
margin-bottom: 5rpx;
|
|||
|
text-align: center;
|
|||
|
color: #d2c3af;
|
|||
|
}
|
|||
|
|
|||
|
.input-style {
|
|||
|
border-bottom: 1px solid #d2c3af;
|
|||
|
display: block;
|
|||
|
width: 100%;
|
|||
|
height: 60rpx;
|
|||
|
color: #d2c3af;
|
|||
|
}
|
|||
|
|
|||
|
.button-style {
|
|||
|
width: 600rpx;
|
|||
|
margin: 40rpx auto;
|
|||
|
}
|
|||
|
|
|||
|
.zhongji {
|
|||
|
width: 100%;
|
|||
|
height: 120px;
|
|||
|
position: relative;
|
|||
|
|
|||
|
image {
|
|||
|
position: absolute;
|
|||
|
transform: translate(-50%);
|
|||
|
left: 50%;
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.baizi {
|
|||
|
position: absolute;
|
|||
|
transform: translate(-50%);
|
|||
|
left: 50%;
|
|||
|
top: 35px;
|
|||
|
// left: 25%;
|
|||
|
font-size: 26px;
|
|||
|
text-shadow: 0px 0px 7px #42464C;
|
|||
|
font-family: HuXiaoBo-NanShen;
|
|||
|
font-weight: 600;
|
|||
|
z-index: 99;
|
|||
|
color: white;
|
|||
|
font-style: italic
|
|||
|
}
|
|||
|
|
|||
|
.image_12 {
|
|||
|
width: 95%;
|
|||
|
height: 204rpx;
|
|||
|
margin: 0 auto;
|
|||
|
}
|
|||
|
|
|||
|
.process-view {
|
|||
|
background-image: linear-gradient(to bottom, #79baff 50%, #79baff 50%);
|
|||
|
background-position: center;
|
|||
|
background-size: 8px 100%;
|
|||
|
/* 调整条纹的高度 */
|
|||
|
background-repeat: repeat-y;
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.process {
|
|||
|
display: block;
|
|||
|
border-radius: 20rpx;
|
|||
|
background: #d8e7fd;
|
|||
|
color: #2163bd;
|
|||
|
padding: 10rpx 30rpx;
|
|||
|
}
|
|||
|
</style>
|