Browse Source

定位与扫码

master
unknown 1 year ago
parent
commit
8a214f7b32
  1. 15
      common/js/mixins.js
  2. 8
      common/js/uniExport.js
  3. 2
      common/js/utils.js
  4. 79
      components/privacyPopup/privacyPopup.vue
  5. 35
      components/privacyRadion/privacyRadion.vue
  6. 9
      main.js
  7. 11
      manifest.json
  8. 2
      pages.json
  9. 642
      pages/tabbar/index/index.vue
  10. 8
      pages/tabbar/learnCar/index.vue
  11. 98
      pages/tabbar/mine/index.vue
  12. 144
      pages/userCenter/login/login.vue
  13. 40
      pages/userCenter/login/loginByPhone.vue
  14. BIN
      static/images/bigImg/topbg.png
  15. BIN
      static/images/userCenter/btn_shouye_nor@2x.png
  16. BIN
      static/images/userCenter/btn_wode_cli@2x.png
  17. BIN
      static/images/userCenter/btn_xueche_nor@2x.png
  18. BIN
      static/images/userCenter/home_icon_biangen@2x.png
  19. BIN
      static/images/userCenter/home_icon_shenqingtuixue@2x.png
  20. BIN
      static/images/userCenter/home_icon_tgzhuanxiao@2x.png
  21. BIN
      static/images/userCenter/ic_chaxun@2x.png
  22. BIN
      static/images/userCenter/ic_dingdan@2x.png
  23. BIN
      static/images/userCenter/ic_erweima@2x.png
  24. BIN
      static/images/userCenter/ic_hetong@2x.png
  25. BIN
      static/images/userCenter/ic_pingjia@2x.png
  26. BIN
      static/images/userCenter/ic_shenghuo@2x.png
  27. BIN
      static/images/userCenter/ic_shoucang@2x.png
  28. BIN
      static/images/userCenter/ic_shuju@2x.png
  29. BIN
      static/images/userCenter/ic_yuyue@2x.png
  30. BIN
      static/images/userCenter/loginTitle.png
  31. BIN
      static/images/userCenter/title_1.png
  32. BIN
      static/images/userCenter/topbg.png
  33. BIN
      static/images/登录流程切图/__MACOSX/登录流程切图/._.DS_Store
  34. BIN
      static/images/登录流程切图/__MACOSX/登录流程切图/._btn_1.png
  35. BIN
      static/images/登录流程切图/登录流程切图/.DS_Store
  36. BIN
      static/images/登录流程切图/登录流程切图/bg_1.png
  37. BIN
      static/images/登录流程切图/登录流程切图/btn_1.png
  38. BIN
      static/images/登录流程切图/登录流程切图/btn_2.png
  39. BIN
      static/images/登录流程切图/登录流程切图/title_1.png
  40. 22
      store/getters.js
  41. 58
      store/index.js
  42. 104
      store/modules/user.js

15
common/js/mixins.js

@ -0,0 +1,15 @@
import { mapState } from 'vuex'
export default {
computed: {
...mapState({
city: state=> state.user.vuex_cityInfo.city,
vuex_cityInfo: state=> state.user.vuex_cityInfo
}),
},
data() {
return {
}
}
}

8
common/js/uniExport.js

@ -0,0 +1,8 @@
export let goPage = (url, params={}, type='navigateTo')=> {
uni.$u.route({
url,
params,
type
})
}

2
common/js/utils.js

@ -76,6 +76,8 @@ const install = (Vue, vm) => {
const day = date.getDate()
return `${year}${splitor}${addZeroPrefix(month)}${splitor}${addZeroPrefix(day)}`
}

79
components/privacyPopup/privacyPopup.vue

@ -0,0 +1,79 @@
<template>
<view class="privacyPopup">
<view class="h1">个人信息保护声明</view>
<view class="content">
<view class="nickName">亲爱的用户</view>
<view class="text">
感谢您信任并使用江西驾考公共服
务平台小程序我们深知个人信息对您
的重要性非常重视您的个人信息和隐
私保护并会尽全力保护您的个人信息
安全可靠我们承诺我们将按业界成
熟的安全标准采取相应的安全保护措
隐私政策帮助您了解我们收集使
存储和共享个人信息的情况
在您注册成为学员的过程中您需要
</view>
</view>
<view class="btnBox">
<view class="btn" @click="$emit('disagree')">不同意</view>
<view class="btn right" @click="$emit('agree')">同意</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.privacyPopup {
width: 558rpx;
// height: 762rpx;
position: relative;
background: linear-gradient(180deg, #C1DFFE 0%, #FFFFFF 20%);
border-radius: 16rpx;
.h1 {
padding: 42rpx 0 0 0;
font-size: 36rpx;
color: #333;
text-align: center;
font-weight: 600;
}
.content {
padding: 30rpx 30rpx 120rpx 30rpx;
font-size: 28rpx;
color: #333;
.nickName {
z-index: 2em;
}
.text {
margin-top: 16rpx;
z-index: 2em;
}
}
.btnBox {
width: 100%;
height: 110rpx;
border-top: 1rpx solid #E8E9EC;
display: flex;
padding: 30rpx 0;
position: absolute;
left: 0;
bottom: 0;
.btn {
flex: 1;
text-align: center;
color: #ADADAD;
font-size: 36rpx;
}
.btn.right {
color: $themC;
}
}
}
</style>

35
components/privacyRadion/privacyRadion.vue

@ -0,0 +1,35 @@
<template>
<view class="radioWrap">
<u-checkbox-group @change="changeRadio">
<u-checkbox v-model="isCheck" shape="circle" label="已阅读并同意" :labelSize="12" ></u-checkbox>
</u-checkbox-group>
<view class="privacyText">
<text>用户协议</text> <text>隐私协议</text>
</view>
</view>
</template>
<script>
export default {
props: ['isCheck'],
methods: {
changeRadio(val) {
this.$emit('changeRadio', val)
}
}
}
</script>
<style lang="scss" scoped>
.radioWrap {
display: flex;
align-items: center;
.privacyText {
font-size: 24rpx;
color: #888E94;
text {
color: $themC;
}
}
}
</style>

9
main.js

@ -2,10 +2,11 @@ import App from './App'
import Vue from 'vue'
import store from './store';
// import config from "./utils/config.js"
// import {storage, goPage} from "./utils/utils.js"
// Vue.prototype.$config = config;
// Vue.prototype.$goPage = goPage;
import { goPage } from './common/js/uniExport.js'
Vue.prototype.$goPage = goPage;
import mixin from "./common/js/mixins.js"
Vue.mixin(mixin)
import './uni.promisify.adaptor'
Vue.config.productionTip = false

11
manifest.json

@ -52,15 +52,20 @@
"mp-weixin" : {
"appid" : "wx2d71605af3b620e6",
"setting" : {
"urlCheck" : false,
"es6" : true
"urlCheck": true,
"es6": true,
"postcss": true,
"minified": true
},
"usingComponents" : true,
"permission" : {
"scope.userLocation" : {
"desc" : "查询用户地理位置,推荐本地驾校,提高用户服务"
}
}
},
"requiredPrivateInfos": [
"getLocation"
]
},
"mp-alipay" : {
"usingComponents" : true

2
pages.json

@ -69,7 +69,7 @@
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "学车小程序",
"navigationBarTitleText": "",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},

642
pages/tabbar/index/index.vue

@ -1,15 +1,30 @@
<template>
<view class="main pageBg">
<view style="background-color: #2170FD; width: 100%;height: 20rpx;"></view>
<!-- <u-navbar title=" " :bgColor="bgColor" :autoBack="false">
<view class="" slot="left">
<view class="flex">
<view class="adrsIcon">
<image src="@/static/images/index/dingwei.png" mode=""></image>
</view>
<view class="adr">{{ vuex_cityInfo.city }} </view>
</view>
</view>
<view class="rightScan" slot="right">
<view class="scan" @click="scanCodeFn">
<image src="@/static/images/index/scan.png" mode=""></image>
</view>
</view>
</u-navbar> -->
<view class="TopCon">
<view class="status_bar" ></view>
<view class="status_bar"></view>
<!-- 地址扫一扫 -->
<view class="flex-b">
<view class="flex">
<view class="adrsIcon">
<image src="@/static/images/index/dingwei.png" mode=""></image>
</view>
<view class="adr">南昌市</view>
<view class="adr">{{ vuex_cityInfo.city }} </view>
</view>
<view class="scan" @click="scanCodeFn">
<image src="@/static/images/index/scan.png" mode=""></image>
@ -23,7 +38,8 @@
<image src="@/static/images/index/searchIcon.png" mode=""></image>
</view>
<view class="inputBox">
<u--input placeholder="搜索驾校、教练…" border="none" clearable v-model="keywords" :color="'#fff'" placeholderClass="placeholderClassFFF"></u--input>
<u--input placeholder="搜索驾校、教练…" border="none" clearable v-model="keywords" :color="'#fff'"
placeholderClass="placeholderClassFFF"></u--input>
</view>
</view>
</view>
@ -53,9 +69,10 @@
</view>
</view>
</view>
<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="swiperInfo" :current="current" :mode="mode" style="height: 230rpx;"
:dots-styles="dotsStyles" field="content">
<swiper class="swiper-box" @change="change" :current="swiperDotIndex" style="height: 230rpx;">
<uni-swiper-dot class="uni-swiper-dot-box" @clickItem=clickItem :info="swiperInfo"
:current="current" :mode="mode" style="height: 230rpx;" :dots-styles="dotsStyles"
field="content">
<swiper class="swiper-box" @change="change" :current="swiperDotIndex" style="height: 230rpx;">
<swiper-item v-for="(item, index) in swiperInfo" :key="index">
<view class="swiper-item" :class="'swiper-item' + index">
<view class="flex-b">
@ -90,60 +107,131 @@
</view>
<view style="height: 20rpx;width: 100%;"></view>
</view>
<u-popup :show="showPrivacy" mode="center" :round="20" >
<privacyPopup @disagree="showPrivacy=false" @agree="showPrivacy=false"></privacyPopup>
</u-popup>
</view>
</template>
<script>
export default {
data() {
return {
showPrivacy: true,
keywords: '',
entrySection: [
{text: '我要报名', icon: require('../../../static/images/index/ic_baoming.png'), },
{text: '找驾校', icon: require('../../../static/images/index/ic_jiaxiao.png'), },
{text: '找考场', icon: require('../../../static/images/index/ic_kaochang.png'), },
{text: '找陪练', icon: require('../../../static/images/index/ic_peilian.png'), },
{text: '理论学习', icon: require('../../../static/images/index/ic_lilun.png'), },
entrySection: [{
text: '我要报名',
icon: require('../../../static/images/index/ic_baoming.png'),
},
{
text: '找驾校',
icon: require('../../../static/images/index/ic_jiaxiao.png'),
},
{
text: '找考场',
icon: require('../../../static/images/index/ic_kaochang.png'),
},
{
text: '找陪练',
icon: require('../../../static/images/index/ic_peilian.png'),
},
{
text: '理论学习',
icon: require('../../../static/images/index/ic_lilun.png'),
},
],
serviceSector: [
{text: '学车指南', tps:'政府平台 一站服务', icon: require('../../../static/images/index/img_1@2x.png'), url: ''},
{text: '公益视频', tps:'立体呈现 学驾无忧', icon: require('../../../static/images/index/img_2@2x.png'), url: ''},
{text: '合格率排行', tps:'官方数据 阳光透明', icon: require('../../../static/images/index/img_3@2x.png'), url: ''},
{text: '行业政策', tps:'权威发布 精准解读', icon: require('../../../static/images/index/img_4@2x.png'), url: ''},
{text: '质量信誉排行', tps:'官方数据 阳光透明', icon: require('../../../static/images/index/img_5@2x.png'), url: ''},
{text: '咨询投诉', tps:'畅达沟通 听取民声', icon: require('../../../static/images/index/img_6@2x.png'), url: ''},
serviceSector: [{
text: '学车指南',
tps: '政府平台 一站服务',
icon: require('../../../static/images/index/img_1@2x.png'),
url: ''
},
{
text: '公益视频',
tps: '立体呈现 学驾无忧',
icon: require('../../../static/images/index/img_2@2x.png'),
url: ''
},
{
text: '合格率排行',
tps: '官方数据 阳光透明',
icon: require('../../../static/images/index/img_3@2x.png'),
url: ''
},
{
text: '行业政策',
tps: '权威发布 精准解读',
icon: require('../../../static/images/index/img_4@2x.png'),
url: ''
},
{
text: '质量信誉排行',
tps: '官方数据 阳光透明',
icon: require('../../../static/images/index/img_5@2x.png'),
url: ''
},
{
text: '咨询投诉',
tps: '畅达沟通 听取民声',
icon: require('../../../static/images/index/img_6@2x.png'),
url: ''
},
],
swiperDotIndex: 1,
current: 1,
mode: 'default',
swiperInfo: [
{img: require('../../../static/images/index/ic_lilun.png'),text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',date: '2023/08/09' },
{img: require('../../../static/images/index/ic_lilun.png'),text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',date: '2023/08/10' },
{img: require('../../../static/images/index/ic_lilun.png'),text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',date: '2023/08/11' },
swiperInfo: [{
img: require('../../../static/images/index/ic_lilun.png'),
text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',
date: '2023/08/09'
},
{
img: require('../../../static/images/index/ic_lilun.png'),
text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',
date: '2023/08/10'
},
{
img: require('../../../static/images/index/ic_lilun.png'),
text: '2023年6月份江西省机动车驾驶培训机构考试合格率的通报',
date: '2023/08/11'
},
],
dotsStyles: {
backgroundColor: '#E8E9EC',
border: '1px #E8E9EC solid',
color: '#fff',
selectedBackgroundColor: '#1989FA',
selectedBorder: '1px #1989FA solid'
},
backgroundColor: '#E8E9EC',
border: '1px #E8E9EC solid',
color: '#fff',
selectedBackgroundColor: '#1989FA',
selectedBorder: '1px #1989FA solid'
},
bgColor: 'transparent'
}
},
onLoad() {
async onLoad() {
// await this.$store.dispatch('getCity')
// console.log(' ')
// console.log(this.$store.state.user.vuex_cityInfo.city)
},
onShow() {
// this.initFn()
},
computed: {
// joe() {
// return ''
// }
},
methods: {
close() {
},
open() {
},
//
scanCodeFn() {
let _this = this
uni.scanCode({
success: function (res) {
success: function(res) {
console.log('条码类型:' + res.scanType);
console.log('条码内容:' + res.result);
_this.$store.commit('updateWebVeiwUrl', res.result)
@ -166,11 +254,11 @@
},
initFn() {
uni.requestSubscribeMessage({
tmplIds: ['0yaIdyI9NlHvGYwb3IIaIQq6uBhulYGN-rGVnJk4hZ4'],
success (res) {
console.log('消息是否有权限呢')
console.log(res)
}
tmplIds: ['0yaIdyI9NlHvGYwb3IIaIQq6uBhulYGN-rGVnJk4hZ4'],
success(res) {
console.log('消息是否有权限呢')
console.log(res)
}
})
}
}
@ -179,226 +267,258 @@
<style lang="scss" scoped>
.main {
width: 100%;
.TopCon {
width: 100%;
height: 476rpx;
// background: url('../../../static/images/bigImg/index_banner.png') no-repeat;
background: url('http://192.168.1.20:81/zhili/image/20230809/e7086ccf82ed4aa09d156f2590a50fba.png') no-repeat;
background-size: 100% 100%;
position: relative;
.flex-b {
padding: 10rpx 212rpx 0 50rpx;
.flex {
.adrsIcon {
width: 26rpx;
height: 38rpx;
margin-top: 4rpx;
}
.adr {
padding-left: 14rpx;
font-size: 28rpx;
color: #fff;
}
}
.scan {
width: 64rpx;
height: 64rpx;
}
}
.searchCon {
position: absolute;
left: 0;
bottom: 68rpx;
padding: 0 28rpx;
width: 100%;
.searchBg {
background: #8ABAED;
width: 100%;
height: 72rpx;
border-radius: 16rpx;
line-height: 72rpx;
.flex {
height: 100%;
padding: 0 28rpx;
.searchIcon {
width: 40rpx;
height: 40rpx;
}
.inputBox {
padding-left: 28rpx;
flex: 1;
color: #fff;
font-size: 28rpx;
}
}
}
}
}
.card {
background: #FFFFFF;
border-radius: 16rpx;
margin-bottom: 20rpx;
&.traTop {
// transform: translateY(-40rpx);
margin-top: -40rpx;
position: relative;
z-index: 9;
}
.ul {
height: 236rpx;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20rpx;
.li {
flex: 1;
display: flex;
align-items: center;
flex-direction: column;
.icon {
width: 92rpx;
height: 92rpx;
}
.name {
font-size: 26rpx;
color: #333;
padding-top: 20rpx;
text-align: center;
}
}
}
}
.information {
padding: 0 20rpx;
height: 320rpx;
.border {
height: 86rpx;
border-bottom: 2px dashed #E8E9EC;
.h1 {
font-size: 28rpx;
color: #333;
}
.more {
font-size: 24rpx;
display: flex;
.text {
// margin-right: 8rpx;
color: #686B73;
}
}
}
.swiper-item {
height: 148rpx;
.flex-b {
padding: 30rpx 0 28rpx 0;
.imgBox {
width: 184rpx;
height: 148rpx;
background: linear-gradient(180deg, rgba(0,122,255,0.5) 0%, #007AFF 100%);
border-radius: 6rpx;
overflow: hidden;
}
.rightText {
flex: 1;
padding: 0 0 0 30rpx;
height: 148rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.text {
font-size: 24rpx;
color: #333;
}
.date {
text-align: right;
font-size: 20rpx;
color: #686B73;
}
}
}
}
}
.serviceCon {
width: 100%;
padding-bottom: 20rpx;
.h1 {
font-size: 28rpx;
color: #333;
padding: 0 0 0 20rpx;
font-weight: 500;
line-height: 90rpx;
}
.ul2 {
padding: 0 20rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.li2 {
width: 48.8%;
display: flex;
align-items: center;
padding: 14rpx 0 14rpx 14rpx;
margin-bottom: 20rpx;
border-radius: 16rpx;
height: 160rpx;
&.li2Bg0 {
background: linear-gradient(180deg, #F7FBFF 0%, #EFF6FF 100%);
}
&.li2Bg1 {
background: linear-gradient(180deg, #FFFAF3 0%, #FFF4EA 100%);
}
&.li2Bg2 {
background: linear-gradient(180deg, #F4FFF5 0%, #F3FFED 100%);
}
&.li2Bg3 {
background: linear-gradient(180deg, #EFFFF9 0%, #E3FFF5 100%);
}
&.li2Bg4 {
background: linear-gradient(180deg, #FAF9FF 0%, #F9F5FF 100%);
}
&.li2Bg5 {
background: linear-gradient(180deg, #FCF9FB 0%, #FFF5F8 100%);
}
.icon {
width: 80rpx;
height: 80rpx;
}
.textCon {
// flex: 1;
padding-left: 16rpx;
.text {
font-size: 32rpx;
color: #333;
font-weight: 500;
}
.tps {
margin-top: 6rpx;
font-size: 20rpx;
color: #949494;
}
}
}
}
}
}
</style>
.flex {
.adrsIcon {
width: 26rpx;
height: 38rpx;
margin-top: 4rpx;
}
.adr {
padding-left: 14rpx;
font-size: 28rpx;
color: #fff;
}
}
.rightScan {
padding-right: 190rpx;
}
.scan {
width: 64rpx;
height: 64rpx;
}
.TopCon {
width: 100%;
height: 476rpx;
background: url('../../../static/images/bigImg/index_banner.png') no-repeat;
background: url('http://192.168.1.20:81/zhili/image/20230809/e7086ccf82ed4aa09d156f2590a50fba.png') no-repeat;
background-size: 100% 100%;
position: relative;
.flex-b {
padding: 10rpx 212rpx 0 50rpx;
}
.searchCon {
position: absolute;
left: 0;
bottom: 68rpx;
padding: 0 28rpx;
width: 100%;
.searchBg {
background: #8ABAED;
width: 100%;
height: 72rpx;
border-radius: 16rpx;
line-height: 72rpx;
.flex {
height: 100%;
padding: 0 28rpx;
.searchIcon {
width: 40rpx;
height: 40rpx;
}
.inputBox {
padding-left: 28rpx;
flex: 1;
color: #fff;
font-size: 28rpx;
}
}
}
}
}
.card {
background: #FFFFFF;
border-radius: 16rpx;
margin-bottom: 20rpx;
&.traTop {
// transform: translateY(-40rpx);
margin-top: -40rpx;
position: relative;
z-index: 9;
}
.ul {
height: 236rpx;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 20rpx;
.li {
flex: 1;
display: flex;
align-items: center;
flex-direction: column;
.icon {
width: 92rpx;
height: 92rpx;
}
.name {
font-size: 26rpx;
color: #333;
padding-top: 20rpx;
text-align: center;
}
}
}
}
.information {
padding: 0 20rpx;
height: 320rpx;
.border {
height: 86rpx;
border-bottom: 2px dashed #E8E9EC;
.h1 {
font-size: 28rpx;
color: #333;
}
.more {
font-size: 24rpx;
display: flex;
.text {
// margin-right: 8rpx;
color: #686B73;
}
}
}
.swiper-item {
height: 148rpx;
.flex-b {
padding: 30rpx 0 28rpx 0;
.imgBox {
width: 184rpx;
height: 148rpx;
background: linear-gradient(180deg, rgba(0, 122, 255, 0.5) 0%, #007AFF 100%);
border-radius: 6rpx;
overflow: hidden;
}
.rightText {
flex: 1;
padding: 0 0 0 30rpx;
height: 148rpx;
display: flex;
flex-direction: column;
justify-content: space-between;
.text {
font-size: 24rpx;
color: #333;
}
.date {
text-align: right;
font-size: 20rpx;
color: #686B73;
}
}
}
}
}
.serviceCon {
width: 100%;
padding-bottom: 20rpx;
.h1 {
font-size: 28rpx;
color: #333;
padding: 0 0 0 20rpx;
font-weight: 500;
line-height: 90rpx;
}
.ul2 {
padding: 0 20rpx;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.li2 {
width: 48.8%;
display: flex;
align-items: center;
padding: 14rpx 0 14rpx 14rpx;
margin-bottom: 20rpx;
border-radius: 16rpx;
height: 160rpx;
&.li2Bg0 {
background: linear-gradient(180deg, #F7FBFF 0%, #EFF6FF 100%);
}
&.li2Bg1 {
background: linear-gradient(180deg, #FFFAF3 0%, #FFF4EA 100%);
}
&.li2Bg2 {
background: linear-gradient(180deg, #F4FFF5 0%, #F3FFED 100%);
}
&.li2Bg3 {
background: linear-gradient(180deg, #EFFFF9 0%, #E3FFF5 100%);
}
&.li2Bg4 {
background: linear-gradient(180deg, #FAF9FF 0%, #F9F5FF 100%);
}
&.li2Bg5 {
background: linear-gradient(180deg, #FCF9FB 0%, #FFF5F8 100%);
}
.icon {
width: 80rpx;
height: 80rpx;
}
.textCon {
// flex: 1;
padding-left: 16rpx;
.text {
font-size: 32rpx;
color: #333;
font-weight: 500;
}
.tps {
margin-top: 6rpx;
font-size: 20rpx;
color: #949494;
}
}
}
}
}
}
</style>

8
pages/tabbar/learnCar/index.vue

@ -1,6 +1,8 @@
<template>
<view class="content">
学车
{{$store.state.user.vuex_userInfo.name}}
<button @click="clickFn"> 打我啊 </button>
<!-- <UserTab selectedIndex ='1'></UserTab> -->
</view>
</template>
@ -17,7 +19,11 @@
// uni.hideTabBar();
},
methods: {
goPage() {}
clickFn() {
uni.navigateTo({
url: '/pages/userCenter/login/loginByPhone'
})
}
}
}
</script>

98
pages/tabbar/mine/index.vue

@ -1,6 +1,42 @@
<template>
<view class="content">
我的
<view class="content pageBg">
<!-- 学员名字 -->
<view class="top_row flex-b">
<view class="flex">
<view class="userName">Hi大乔</view>
<view class="arrowIcon">
<image src="../../../static/images/userCenter/loginTopBg.png" mode=""></image>
</view>
</view>
<view class="scanCode">
<image src="../../../static/images/userCenter/loginTopBg.png" mode=""></image>
</view>
</view>
<!-- 学车进度 -->
<view class="userProgress">
</view>
<!-- 我的相关入口 -->
<view class="ul">
<view class="li">
<view class="icon">
<image src="../../../static/logo.png" mode=""></image>
</view>
<view class="text">我的预约</view>
</view>
</view>
<!-- 业务办理 -->
<view class="business ">
<view class="h1">业务办理</view>
<view class="card">
<view class="item">
<view class="icon">
<image src="../../../static/logo.png" mode=""></image>
</view>
<view class="text">学时查询</view>
</view>
</view>
</view>
<!-- <UserTab selectedIndex ='2'></UserTab> -->
</view>
</template>
@ -26,6 +62,62 @@
<style lang="scss" scoped>
.content {
width: 100vw;
height: 100%;
min-height: 100vh;
background: url('../../../static/images/bigImg/topbg.png') no-repeat;
background-size: 100% 362rpx;
}
.content {
width: 100%;
.top_row {
.flex {
.userName {
}
.arrowIcon {
}
}
.scanCode {
}
}
.userProgress {
}
.ul {
.li {
.icon {
}
.text {
}
}
}
.business {
.h1 {
}
.card {
.item {
.icon {
}
.text {
}
}
}
}
}
</style>

144
pages/userCenter/login/login.vue

@ -1,6 +1,27 @@
<template>
<view class="main">
登录方式
<view class="h1Img">
<image src="../../../static/images/userCenter/loginTitle.png" mode=""></image>
</view>
<view class="btnCon">
<view class="btn">手机号快捷登录</view>
<!-- <button type="success" size="mini" style="margin-top: 15rpx;" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" text="获取手机号">获取手机号</button> -->
<view class="btn border" @click="$goPage('/pages/userCenter/login/loginByPhone');">手机号登录/注册</view>
</view>
<view style="margin-top: 40rpx;">
<privacyRadion :isCheck="isCheck" @changeRadio="changeRadio"></privacyRadion>
</view>
<u-popup :show="show" :round="10" mode="center" >
<view class="">
<view class="popupCon">
<view class="h1"> </view>
<view class="msg">授权手机号我们才能继续为您 <br>提供服务哦~</view>
<view class="oneBtn">我知道了</view>
</view>
</view>
</u-popup>
</view>
</template>
@ -8,14 +29,48 @@
export default {
data() {
return {
isCheck: false,
show: false,
decodePhoneParams: {}
}
},
onLoad() {
// this.init()
this.getCode()
// uni.getLocation({
// type: 'wgs84',
// success: function (res) {
// console.log(res)
// console.log('' + res.longitude);
// console.log('' + res.latitude);
// }
// });
},
methods: {
// code
getCode() {
uni.login({
provider: 'weixin',
success: loginRes => {
this.decodePhoneParams.code = loginRes.code
console.log('loginRes')
console.log(loginRes)
}
});
},
//
async getPhoneNumber(e) {
await this.getCode();
console.log('获取手机号')
console.log(e)
if(!this.decodePhoneParams.code || !e.detail.encryptedData){
return false;
}
},
//
changeRadio(val) {
this.isCheck = val
},
init() {
uni.login({
provider: 'weixin',
@ -45,27 +100,68 @@
</script>
<style lang="scss" scoped>
// .radioWrap {
// display: flex;
// justify-content: flex-start;
// align-items: center;
// /deep/.radio-btn {
// margin-right: -9rpx !important;
// }
.main {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
background: url('../../../static/images/userCenter/loginTopBg.png') no-repeat;
background-size: 100% 360rpx;
.h1Img {
width: 658rpx;
height: 94rpx;
margin: 288rpx 0 120rpx 0;
}
.btnCon {
.btn {
width: 396rpx;
height: 72rpx;
background: #1989FA;
border-radius: 8rpx;
color: #fff;
margin-bottom: 32rpx;
text-align: center;
line-height: 72rpx;
font-size: 28rpx;
&.border {
background: rgba(25,137,250,0.1);
border: 2rpx solid #1989FA;
color: $themC;
}
}
}
}
// radio {
// zoom: .8;
// }
.popupCon {
width: 558rpx;
height: 344rpx;
border-radius: 16rpx;
overflow: hidden;
.h1 {
line-height: 124rpx;
text-align: center;
font-size: 36rpx;
font-weight: 600;
height: 124rpx;
width: 100%;
background: linear-gradient(180deg, #C1DFFE 0%, #FFFFFF 100%);
}
// view:nth-child(2) {
// font-size: 24rpx;
// color: #bfbfbf;
// }
.msg {
font-size: 28rpx;
color: #686B73;
padding: 0 0 30rpx 0;
text-align: center;
}
// text {
// color: #218DFF;
// font-size: 24rpx;
// }
// }
.oneBtn {
line-height: 112rpx;
height: 112rpx;
border-top: 1px solid #E8E9EC;
text-align: center;
font-size: 36rpx;
color: $themC;
font-weight: 600;
}
}
</style>

40
pages/userCenter/login/loginByPhone.vue

@ -1,10 +1,11 @@
<template>
<view class="main">
<view class="u-back-top">
<!-- <view class="u-back-top">
<view class="backBox">
<u-icon name="arrow-left" color="#333" size="28"></u-icon>
</view>
</view>
</view> -->
<u-navbar title=" " @leftClick="leftClick" :bgColor="bgColor" :autoBack="true"></u-navbar>
<view class="title">短信验证码登录</view>
<view class="form">
<view class="form-item">
@ -26,13 +27,8 @@
<view class="code" @tap='goSms' :class="{active: isPhone&&!codeOn}">{{codeText}}</view>
</view>
<view class="loginBtn" :class="{active: btnHighlight}" @click="submitFn"> </view>
<view class="radioWrap">
<u-checkbox-group >
<u-checkbox v-model="isCheck" shape="circle" label="已阅读并同意" :labelSize="12" ></u-checkbox>
</u-checkbox-group>
<view class="privacyText">
<text>用户协议</text> <text>隐私协议</text>
</view>
<view style="margin-top: 40rpx;">
<privacyRadion :isCheck="isCheck" @changeRadio="changeRadio"></privacyRadion>
</view>
</view>
</view>
@ -46,7 +42,8 @@
isCheck: false,
codeText: '获取验证码',
FormData: {},
codeOn: false
codeOn: false,
bgColor: 'transparent'
}
},
onLoad() {
@ -61,10 +58,12 @@
}
},
methods: {
leftClick() {
console.log('leftClick');
},
//
groupChangeEnvnt(e) {
this.isCheck = e.value
console.log('是否选择协议', this.isCheck)
changeRadio(val) {
this.isCheck = val
},
//
async goSms() {
@ -118,7 +117,7 @@
.title {
font-size: 48rpx;
color: #333;
padding: 92rpx 0;
padding: 202rpx 0 80rpx 0;
text-align: center;
font-weight: 600;
}
@ -170,18 +169,7 @@
}
}
.radioWrap {
display: flex;
align-items: center;
margin-top: 40rpx;
.privacyText {
font-size: 24rpx;
color: #888E94;
text {
color: $themC;
}
}
}
}
}
</style>

BIN
static/images/bigImg/topbg.png

After

Width: 750  |  Height: 362  |  Size: 130 KiB

BIN
static/images/userCenter/btn_shouye_nor@2x.png

After

Width: 56  |  Height: 56  |  Size: 2.8 KiB

BIN
static/images/userCenter/btn_wode_cli@2x.png

After

Width: 56  |  Height: 56  |  Size: 1.3 KiB

BIN
static/images/userCenter/btn_xueche_nor@2x.png

After

Width: 56  |  Height: 56  |  Size: 1.8 KiB

BIN
static/images/userCenter/home_icon_biangen@2x.png

After

Width: 48  |  Height: 48  |  Size: 2.2 KiB

BIN
static/images/userCenter/home_icon_shenqingtuixue@2x.png

After

Width: 48  |  Height: 48  |  Size: 705 B

BIN
static/images/userCenter/home_icon_tgzhuanxiao@2x.png

After

Width: 48  |  Height: 48  |  Size: 865 B

BIN
static/images/userCenter/ic_chaxun@2x.png

After

Width: 48  |  Height: 48  |  Size: 1.0 KiB

BIN
static/images/userCenter/ic_dingdan@2x.png

After

Width: 68  |  Height: 68  |  Size: 2.1 KiB

BIN
static/images/userCenter/ic_erweima@2x.png

After

Width: 40  |  Height: 40  |  Size: 1.4 KiB

BIN
static/images/userCenter/ic_hetong@2x.png

After

Width: 68  |  Height: 68  |  Size: 2.2 KiB

BIN
static/images/userCenter/ic_pingjia@2x.png

After

Width: 68  |  Height: 68  |  Size: 2.3 KiB

BIN
static/images/userCenter/ic_shenghuo@2x.png

After

Width: 68  |  Height: 68  |  Size: 3.0 KiB

BIN
static/images/userCenter/ic_shoucang@2x.png

After

Width: 68  |  Height: 68  |  Size: 3.1 KiB

BIN
static/images/userCenter/ic_shuju@2x.png

After

Width: 68  |  Height: 68  |  Size: 2.8 KiB

BIN
static/images/userCenter/ic_yuyue@2x.png

After

Width: 68  |  Height: 68  |  Size: 3.1 KiB

BIN
static/images/userCenter/loginTitle.png

After

Width: 658  |  Height: 94  |  Size: 19 KiB

BIN
static/images/userCenter/title_1.png

Before

Width: 329  |  Height: 47  |  Size: 8.8 KiB

BIN
static/images/userCenter/topbg.png

After

Width: 750  |  Height: 362  |  Size: 130 KiB

BIN
static/images/登录流程切图/__MACOSX/登录流程切图/._.DS_Store

BIN
static/images/登录流程切图/__MACOSX/登录流程切图/._btn_1.png

BIN
static/images/登录流程切图/登录流程切图/.DS_Store

BIN
static/images/登录流程切图/登录流程切图/bg_1.png

Before

Width: 375  |  Height: 180  |  Size: 36 KiB

BIN
static/images/登录流程切图/登录流程切图/btn_1.png

Before

Width: 16  |  Height: 16  |  Size: 461 B

BIN
static/images/登录流程切图/登录流程切图/btn_2.png

Before

Width: 16  |  Height: 16  |  Size: 567 B

BIN
static/images/登录流程切图/登录流程切图/title_1.png

Before

Width: 329  |  Height: 47  |  Size: 8.8 KiB

22
store/getters.js

@ -1,21 +1,7 @@
// export default {
// userInfo: state => state.user.userInfo,
// pushMessage: state => state.push.pushMessage,
// currentAdd: state=>{
// };
export default {
city: state => state.user.vuex_cityInfo.city,
pushMessage: state => state.push.pushMessage,
getCurrentAdd: function (state) {
//返回一个函数用于接收
return function (id) {
let add = state.add.addList.find(item => item.id == id)
if(add) {
return add
}else {
return {}
}
}
}
};
}

58
store/index.js

@ -6,74 +6,18 @@ import getters from './getters';
Vue.use(Vuex);
const store = new Vuex.Store({
state: {
currentSchool: '',
userInfo: {},
latLng: {},
classChooseItem: {},
pdfUrl: '',
webViewUrl: '',
havePay: 0, //tabbar 页面是否显示报错小图标
currentMyMsg: {},
billPrice: 0, //开发票的id
TrainingOrderId: '', //退款流程里的驾校id
bankInfo: {
realName: uni.getStorageSync('userInfo').realName,
phoneCode: ''
},
chooseCoachItem: {
coachId: ''
}, //报名时选择的教练
realAuthsuccee: false,
},
getters,
mutations: {
// 选择学校
upDateTrainingSchoolId(state, currentSchool) {
state.currentSchool = currentSchool
},
// webViewUrl
updateWebVeiwUrl(state, url) {
state.webViewUrl = url
},
// 更新用户信息
upDateUserInfo(state, userInfo) {
state.userInfo = userInfo
},
updatePushMyMsg(state, item) {
state.currentMyMsg = item
},
upDateBillPrice(state, billPrice) {
state.billPrice = billPrice
},
upDateTrainingOrderId(state, trainingOrderId) {
state.trainingOrderId = trainingOrderId
},
// tabbar 页面是否显示报错小图标
updateHavePay(state, havePay) {
state.havePay = havePay
},
// 报名时选择教练
upDateCoachItem(state, item) {
state.chooseCoachItem = item
},
// 申请退款时的银行卡信息
upDateBankInfo(state, obj) {
for (let k in obj) {
if (state.bankInfo[k]) {
state.bankInfo[k] = obj[k]
} else {
uni.$set(state.bankInfo, k, obj[k])
}
}
},
// 更新经纬度
updateLatLng(state, item) {
state.latLng = item
},
},

104
store/modules/user.js

@ -1,31 +1,99 @@
import qqmapWx from '../../common/sdk/qqmap-wx-jssdk.min.js'; // 引入
import addApi from '../../common/sdk/qqmap-wx-jssdk.min.js'; // 引入
const user = {
state: {
addList: []
vuex_cityInfo: uni.getStorageSync('vuex_cityInfo') ? uni.getStorageSync('vuex_cityInfo') : {city: '杭州市'},
vuex_userInfo: uni.getStorageSync('vuex_userInfo') ? uni.getStorageSync('vuex_userInfo') : {},
},
mutations: {
// 更新广告列表
upDateAddList(state, list) {
state.addList = list
},
update_vuex_cityInfo(state, payload) {
state.vuex_cityInfo = payload
uni.setStorageSync('vuex_cityInfo', payload);
}
},
actions: {
// 点击广告
async addClick({commit, dispatch}, curAdd) {
// await dispatch('updateStatistics')
curAdd.clicks ++
if(!curAdd.adBannerDO.jumpUrl) {
return false
}
commit('updateWebVeiwUrl', curAdd.adBannerDO.jumpUrl)
uni.navigateTo({
url:'/pages/commeWebView/addWebView'
getCity({commit}) {
return new Promise((resolve, reject) => {
// #ifdef APP-PLUS||H5
getCityInfo(resolve, reject,commit)
// #endif
// #ifdef MP-WEIXIN
uni.authorize({
scope: 'scope.userLocation',
success() {
getCityInfo(resolve, reject,commit)
},
fail: function(res4) {
uni.showModal({
title: '提示',
content: '小程序想要获取您的地里位置',
success: function(res) {
if (res.confirm) {
uni.openSetting({
success(res) {
getCityInfo(resolve, reject,commit)
}
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
})
},
})
// #endif
})
},
}
}
export default user
export default user
function getCityInfo(resolve, reject, commit) {
uni.showLoading({
title: '加载中...'
})
var qqmapKey = new qqmapWx({
key: '2BTBZ-6BQRB-ZG4UG-NOYYG-KZMH7-B4BYN'
})
uni.getLocation({
type: 'wgs84',
// type: 'gcj02',
success: function(res) {
console.log('当前位置的经度:' + res.longitude);
console.log('当前位置的纬度:' + res.latitude);
qqmapKey.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success(res2) {
// console.log('城市信息')
// console.log(res2.result)
let result = res2.result
let obj = {
latitude: res.latitude,
longitude: res.longitude,
city: result.address_component.city,
cityCode: result.ad_info.adcode,
province: result.address_component.province,
district: result.address_component.district
}
commit('update_vuex_cityInfo', obj)
resolve(obj)
uni.hideLoading();
},
fail: function(res3) {
reject(res3)
uni.hideLoading();
},
})
},
fail(e) {
console.log(e)
}
})
}
Loading…
Cancel
Save