You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
287 lines
6.3 KiB
287 lines
6.3 KiB
<template>
|
|
<view class="content">
|
|
<u-navbar title="优享驾培" :custom-back="goApp"></u-navbar>
|
|
<view class="content">
|
|
<view class="topCon">
|
|
<view class="tag" @click="$goPage('/pages/payRecords/payRecords')">
|
|
<image src="@/static/images/home_img_pay@2x.png" mode=""></image>
|
|
</view>
|
|
<view class="cardBox">
|
|
<view class="card">
|
|
<view class="h1">
|
|
<view class="h1Icon">
|
|
<image src="@/static/images/home_icon_btzuo@3x.png" mode=""></image>
|
|
</view>
|
|
<view class="txt">专属服务与优惠</view>
|
|
<view class="h1Icon">
|
|
<image src="@/static/images/home_icon_btyou@3x.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<view class="item_Box">
|
|
<view class="h2">优质的服务</view>
|
|
<view class="text">1.专属优享驾培服务团队，优秀教练员施教；</view>
|
|
<view class="text">2.提供“一人一方案”培训教学、考试服务。</view>
|
|
</view>
|
|
<view class="item_Box">
|
|
<view class="h2">优惠的价格</view>
|
|
<view class="text">1.为工会会员，提供9.5折专享优惠价格；</view>
|
|
<view class="text">2.工会会员可为家庭成员代报名，同享9.5折。</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="listCon">
|
|
<view class="h1">
|
|
<view class="h1Icon">
|
|
<image src="@/static/images/home_icon_btzuo@3x.png" mode=""></image>
|
|
</view>
|
|
<view class="txt">优质驾校</view>
|
|
<view class="h1Icon">
|
|
<image src="@/static/images/home_icon_btyou@3x.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
<view class="area">
|
|
<view class="areaLab">选择区/县</view>
|
|
<view class="areaChoose" @click="show=true">
|
|
<view class="txt">{{ regionName }}</view>
|
|
<view class="iconImg">
|
|
<image src="@/static/images/home_icon_xiahei@3x.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<list :listData="listData" />
|
|
<view class="" style="padding: 40rpx 0 0 0; ">
|
|
<u-loadmore :status="status" icon-type="circle" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<u-picker mode="selector" v-model="show" :range="region" @confirm="confirmRegion"
|
|
range-key="regionName"></u-picker>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import list from './comp/list.vue'
|
|
import indexApi from '@/api/index.js'
|
|
export default {
|
|
components: {
|
|
list
|
|
},
|
|
data() {
|
|
return {
|
|
status: 'loadmore',
|
|
queryParams: {
|
|
pageIndex: 1,
|
|
pageSize: 30,
|
|
lat: 30.27419537786047,
|
|
trainingScope: '',
|
|
lng: 120.20633397715788,
|
|
schoolName: ''
|
|
},
|
|
show: false,
|
|
listData: [],
|
|
region: [],
|
|
regionName: '杭州市'
|
|
}
|
|
},
|
|
|
|
onLoad() {
|
|
this.listInit()
|
|
this.queryRegionByParentCodeFn()
|
|
const latLng = this.$u.utils.getLocation()
|
|
this.queryParams.lat = latLng.lat
|
|
this.queryParams.lng = latLng.lng
|
|
|
|
this.$u.utils.appPostMessage("encryption_user_msg_type");
|
|
|
|
//Android和iOS获取⽤户信息回调
|
|
window.arouseNativeMsg = function(data) {
|
|
if(data) {
|
|
|
|
}
|
|
}
|
|
},
|
|
onReachBottom() {
|
|
if (this.status == 'nomore') return
|
|
this.queryTrainingSchoolListFromAppFn()
|
|
},
|
|
onPullDownRefresh() {
|
|
this.listInit()
|
|
setTimeout(() => {
|
|
uni.stopPullDownRefresh()
|
|
}, 1500)
|
|
},
|
|
methods: {
|
|
goApp() {
|
|
this.$u.utils.appPostMessage("backToApp");
|
|
},
|
|
listInit() {
|
|
this.status == 'loadmore'
|
|
this.queryParams.pageIndex = 1
|
|
this.listData = []
|
|
this.queryTrainingSchoolListFromAppFn()
|
|
},
|
|
// 选择区域
|
|
confirmRegion(i) {
|
|
let index = i[0]
|
|
let item = this.region[index]
|
|
this.queryParams.district = item.regionCode
|
|
this.regionName = item.regionName
|
|
this.listInit()
|
|
},
|
|
// 获取区域数据
|
|
async queryRegionByParentCodeFn() {
|
|
const [nulls, res] = await indexApi.queryRegionByParentCode()
|
|
this.region = res.data
|
|
},
|
|
// 列表
|
|
async queryTrainingSchoolListFromAppFn() {
|
|
let obj = {}
|
|
for (let key in this.queryParams) {
|
|
if (this.queryParams[key]) {
|
|
obj[key] = this.queryParams[key]
|
|
}
|
|
}
|
|
const [nulls, res] = await indexApi.queryTrainingSchoolListFromApp(obj)
|
|
this.queryParams.pageIndex++
|
|
this.listData.push(...res.data)
|
|
console.log('驾校列表')
|
|
console.log(res.data)
|
|
if (res.data.length < this.queryParams.pageSize) this.status = 'nomore'
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
.h1 {
|
|
display: flex;
|
|
justify-content: center;
|
|
height: 96rpx;
|
|
align-items: center;
|
|
|
|
.h1Icon {
|
|
width: 36rpx;
|
|
height: 20rpx;
|
|
}
|
|
|
|
.txt {
|
|
font-size: 32rpx;
|
|
color: #333;
|
|
padding: 0 12rpx;
|
|
}
|
|
}
|
|
|
|
.topCon {
|
|
width: 100%;
|
|
height: 792rpx;
|
|
padding: 0 32rpx;
|
|
background: url('../../static/images/home_bg_dingbu@3x.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
position: relative;
|
|
|
|
.tag {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 96rpx;
|
|
width: 40rpx;
|
|
height: 146rpx;
|
|
}
|
|
|
|
.cardBox {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0rpx;
|
|
width: 100%;
|
|
height: 504rpx;
|
|
padding: 0 32rpx;
|
|
|
|
.card {
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
padding: 0 24rpx 24rpx 24rpx;
|
|
|
|
|
|
.item_Box {
|
|
width: 100%;
|
|
height: 180rpx;
|
|
background: #F2F9FF;
|
|
border-radius: 16rpx;
|
|
padding: 24rpx 0 0 0;
|
|
color: #333;
|
|
margin-bottom: 16rpx;
|
|
|
|
.h2 {
|
|
font-size: 32rpx;
|
|
position: relative;
|
|
padding: 0 0 8rpx 26rpx;
|
|
font-weight: 600;
|
|
|
|
&::before {
|
|
position: absolute;
|
|
content: '';
|
|
left: 0;
|
|
top: 8rpx;
|
|
width: 6rpx;
|
|
height: 28rpx;
|
|
background: #1989FA;
|
|
border-radius: 0px 6rpx 6rpx 0px;
|
|
|
|
}
|
|
}
|
|
|
|
.text {
|
|
font-size: 28rpx;
|
|
padding: 2rpx 26rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.listCon {
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
border-radius: 32rpx 32rpx 0px 0px;
|
|
padding: 0 32rpx 32rpx 32rpx;
|
|
margin-top: 32rpx;
|
|
|
|
.area {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
color: #686B73;
|
|
margin-bottom: 40rpx;
|
|
|
|
.areaLab {
|
|
font-size: 28rpx;
|
|
color: #686B73;
|
|
margin-right: 16rpx;
|
|
}
|
|
|
|
.areaChoose {
|
|
height: 56rpx;
|
|
background: #F6F7F8;
|
|
border-radius: 8rpx;
|
|
padding: 8rpx 16rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.txt {
|
|
font-size: 28rpx;
|
|
color: #686B73;
|
|
}
|
|
|
|
.iconImg {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
margin-left: 8rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
</style>
|