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. 204
      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. 102
      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

@ -81,6 +81,8 @@ const install = (Vue, vm) => {
vm.$u.utils = { vm.$u.utils = {
openMap, openMap,
getLocation, getLocation,

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 Vue from 'vue'
import store from './store'; 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' import './uni.promisify.adaptor'
Vue.config.productionTip = false Vue.config.productionTip = false

11
manifest.json

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

2
pages.json

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

204
pages/tabbar/index/index.vue

@ -1,15 +1,30 @@
<template> <template>
<view class="main pageBg"> <view class="main pageBg">
<view style="background-color: #2170FD; width: 100%;height: 20rpx;"></view> <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="TopCon">
<view class="status_bar" ></view>
<view class="status_bar"></view>
<!-- 地址扫一扫 --> <!-- 地址扫一扫 -->
<view class="flex-b"> <view class="flex-b">
<view class="flex"> <view class="flex">
<view class="adrsIcon"> <view class="adrsIcon">
<image src="@/static/images/index/dingwei.png" mode=""></image> <image src="@/static/images/index/dingwei.png" mode=""></image>
</view> </view>
<view class="adr">南昌市</view>
<view class="adr">{{ vuex_cityInfo.city }} </view>
</view> </view>
<view class="scan" @click="scanCodeFn"> <view class="scan" @click="scanCodeFn">
<image src="@/static/images/index/scan.png" mode=""></image> <image src="@/static/images/index/scan.png" mode=""></image>
@ -23,7 +38,8 @@
<image src="@/static/images/index/searchIcon.png" mode=""></image> <image src="@/static/images/index/searchIcon.png" mode=""></image>
</view> </view>
<view class="inputBox"> <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> </view>
</view> </view>
@ -53,8 +69,9 @@
</view> </view>
</view> </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">
<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 class="swiper-box" @change="change" :current="swiperDotIndex" style="height: 230rpx;">
<swiper-item v-for="(item, index) in swiperInfo" :key="index"> <swiper-item v-for="(item, index) in swiperInfo" :key="index">
<view class="swiper-item" :class="'swiper-item' + index"> <view class="swiper-item" :class="'swiper-item' + index">
@ -90,38 +107,94 @@
</view> </view>
<view style="height: 20rpx;width: 100%;"></view> <view style="height: 20rpx;width: 100%;"></view>
</view> </view>
<u-popup :show="showPrivacy" mode="center" :round="20" >
<privacyPopup @disagree="showPrivacy=false" @agree="showPrivacy=false"></privacyPopup>
</u-popup>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
showPrivacy: true,
keywords: '', 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, swiperDotIndex: 1,
current: 1, current: 1,
mode: 'default', 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: { dotsStyles: {
backgroundColor: '#E8E9EC', backgroundColor: '#E8E9EC',
@ -130,20 +203,35 @@
selectedBackgroundColor: '#1989FA', selectedBackgroundColor: '#1989FA',
selectedBorder: '1px #1989FA solid' 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() { onShow() {
// this.initFn()
},
computed: {
// joe() {
// return ''
// }
}, },
methods: { methods: {
close() {
},
open() {
},
// //
scanCodeFn() { scanCodeFn() {
let _this = this let _this = this
uni.scanCode({ uni.scanCode({
success: function (res) {
success: function(res) {
console.log('条码类型:' + res.scanType); console.log('条码类型:' + res.scanType);
console.log('条码内容:' + res.result); console.log('条码内容:' + res.result);
_this.$store.commit('updateWebVeiwUrl', res.result) _this.$store.commit('updateWebVeiwUrl', res.result)
@ -167,7 +255,7 @@
initFn() { initFn() {
uni.requestSubscribeMessage({ uni.requestSubscribeMessage({
tmplIds: ['0yaIdyI9NlHvGYwb3IIaIQq6uBhulYGN-rGVnJk4hZ4'], tmplIds: ['0yaIdyI9NlHvGYwb3IIaIQq6uBhulYGN-rGVnJk4hZ4'],
success (res) {
success(res) {
console.log('消息是否有权限呢') console.log('消息是否有权限呢')
console.log(res) console.log(res)
} }
@ -179,20 +267,9 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.main { .main {
width: 100%; 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 { .flex {
.adrsIcon { .adrsIcon {
width: 26rpx; width: 26rpx;
@ -207,10 +284,27 @@
} }
} }
.rightScan {
padding-right: 190rpx;
}
.scan { .scan {
width: 64rpx; width: 64rpx;
height: 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 { .searchCon {
@ -219,15 +313,18 @@
bottom: 68rpx; bottom: 68rpx;
padding: 0 28rpx; padding: 0 28rpx;
width: 100%; width: 100%;
.searchBg { .searchBg {
background: #8ABAED; background: #8ABAED;
width: 100%; width: 100%;
height: 72rpx; height: 72rpx;
border-radius: 16rpx; border-radius: 16rpx;
line-height: 72rpx; line-height: 72rpx;
.flex { .flex {
height: 100%; height: 100%;
padding: 0 28rpx; padding: 0 28rpx;
.searchIcon { .searchIcon {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
@ -250,23 +347,27 @@
background: #FFFFFF; background: #FFFFFF;
border-radius: 16rpx; border-radius: 16rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
&.traTop { &.traTop {
// transform: translateY(-40rpx); // transform: translateY(-40rpx);
margin-top: -40rpx; margin-top: -40rpx;
position: relative; position: relative;
z-index: 9; z-index: 9;
} }
.ul { .ul {
height: 236rpx; height: 236rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 0 20rpx; padding: 0 20rpx;
.li { .li {
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: column; flex-direction: column;
.icon { .icon {
width: 92rpx; width: 92rpx;
height: 92rpx; height: 92rpx;
@ -281,33 +382,41 @@
} }
} }
} }
.information { .information {
padding: 0 20rpx; padding: 0 20rpx;
height: 320rpx; height: 320rpx;
.border { .border {
height: 86rpx; height: 86rpx;
border-bottom: 2px dashed #E8E9EC; border-bottom: 2px dashed #E8E9EC;
.h1 { .h1 {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
} }
.more { .more {
font-size: 24rpx; font-size: 24rpx;
display: flex; display: flex;
.text { .text {
// margin-right: 8rpx; // margin-right: 8rpx;
color: #686B73; color: #686B73;
} }
} }
} }
.swiper-item { .swiper-item {
height: 148rpx; height: 148rpx;
.flex-b { .flex-b {
padding: 30rpx 0 28rpx 0; padding: 30rpx 0 28rpx 0;
.imgBox { .imgBox {
width: 184rpx; width: 184rpx;
height: 148rpx; height: 148rpx;
background: linear-gradient(180deg, rgba(0,122,255,0.5) 0%, #007AFF 100%);
background: linear-gradient(180deg, rgba(0, 122, 255, 0.5) 0%, #007AFF 100%);
border-radius: 6rpx; border-radius: 6rpx;
overflow: hidden; overflow: hidden;
} }
@ -319,6 +428,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
.text { .text {
font-size: 24rpx; font-size: 24rpx;
color: #333; color: #333;
@ -338,6 +448,7 @@
.serviceCon { .serviceCon {
width: 100%; width: 100%;
padding-bottom: 20rpx; padding-bottom: 20rpx;
.h1 { .h1 {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
@ -351,6 +462,7 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
.li2 { .li2 {
width: 48.8%; width: 48.8%;
display: flex; display: flex;
@ -359,24 +471,31 @@
margin-bottom: 20rpx; margin-bottom: 20rpx;
border-radius: 16rpx; border-radius: 16rpx;
height: 160rpx; height: 160rpx;
&.li2Bg0 { &.li2Bg0 {
background: linear-gradient(180deg, #F7FBFF 0%, #EFF6FF 100%); background: linear-gradient(180deg, #F7FBFF 0%, #EFF6FF 100%);
} }
&.li2Bg1 { &.li2Bg1 {
background: linear-gradient(180deg, #FFFAF3 0%, #FFF4EA 100%); background: linear-gradient(180deg, #FFFAF3 0%, #FFF4EA 100%);
} }
&.li2Bg2 { &.li2Bg2 {
background: linear-gradient(180deg, #F4FFF5 0%, #F3FFED 100%); background: linear-gradient(180deg, #F4FFF5 0%, #F3FFED 100%);
} }
&.li2Bg3 { &.li2Bg3 {
background: linear-gradient(180deg, #EFFFF9 0%, #E3FFF5 100%); background: linear-gradient(180deg, #EFFFF9 0%, #E3FFF5 100%);
} }
&.li2Bg4 { &.li2Bg4 {
background: linear-gradient(180deg, #FAF9FF 0%, #F9F5FF 100%); background: linear-gradient(180deg, #FAF9FF 0%, #F9F5FF 100%);
} }
&.li2Bg5 { &.li2Bg5 {
background: linear-gradient(180deg, #FCF9FB 0%, #FFF5F8 100%); background: linear-gradient(180deg, #FCF9FB 0%, #FFF5F8 100%);
} }
.icon { .icon {
width: 80rpx; width: 80rpx;
height: 80rpx; height: 80rpx;
@ -385,6 +504,7 @@
.textCon { .textCon {
// flex: 1; // flex: 1;
padding-left: 16rpx; padding-left: 16rpx;
.text { .text {
font-size: 32rpx; font-size: 32rpx;
color: #333; color: #333;
@ -400,5 +520,5 @@
} }
} }
} }
}
}
</style> </style>

8
pages/tabbar/learnCar/index.vue

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

98
pages/tabbar/mine/index.vue

@ -1,6 +1,42 @@
<template> <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> --> <!-- <UserTab selectedIndex ='2'></UserTab> -->
</view> </view>
</template> </template>
@ -26,6 +62,62 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100vw; 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> </style>

144
pages/userCenter/login/login.vue

@ -1,6 +1,27 @@
<template> <template>
<view class="main"> <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> </view>
</template> </template>
@ -8,14 +29,48 @@
export default { export default {
data() { data() {
return { return {
isCheck: false,
show: false,
decodePhoneParams: {}
} }
}, },
onLoad() { onLoad() {
// this.init()
this.getCode()
// uni.getLocation({
// type: 'wgs84',
// success: function (res) {
// console.log(res)
// console.log('' + res.longitude);
// console.log('' + res.latitude);
// }
// });
}, },
methods: { 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() { init() {
uni.login({ uni.login({
provider: 'weixin', provider: 'weixin',
@ -45,27 +100,68 @@
</script> </script>
<style lang="scss" scoped> <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> </style>

40
pages/userCenter/login/loginByPhone.vue

@ -1,10 +1,11 @@
<template> <template>
<view class="main"> <view class="main">
<view class="u-back-top">
<!-- <view class="u-back-top">
<view class="backBox"> <view class="backBox">
<u-icon name="arrow-left" color="#333" size="28"></u-icon> <u-icon name="arrow-left" color="#333" size="28"></u-icon>
</view> </view>
</view>
</view> -->
<u-navbar title=" " @leftClick="leftClick" :bgColor="bgColor" :autoBack="true"></u-navbar>
<view class="title">短信验证码登录</view> <view class="title">短信验证码登录</view>
<view class="form"> <view class="form">
<view class="form-item"> <view class="form-item">
@ -26,13 +27,8 @@
<view class="code" @tap='goSms' :class="{active: isPhone&&!codeOn}">{{codeText}}</view> <view class="code" @tap='goSms' :class="{active: isPhone&&!codeOn}">{{codeText}}</view>
</view> </view>
<view class="loginBtn" :class="{active: btnHighlight}" @click="submitFn"> </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> </view>
</view> </view>
@ -46,7 +42,8 @@
isCheck: false, isCheck: false,
codeText: '获取验证码', codeText: '获取验证码',
FormData: {}, FormData: {},
codeOn: false
codeOn: false,
bgColor: 'transparent'
} }
}, },
onLoad() { onLoad() {
@ -61,10 +58,12 @@
} }
}, },
methods: { methods: {
leftClick() {
console.log('leftClick');
},
// //
groupChangeEnvnt(e) {
this.isCheck = e.value
console.log('是否选择协议', this.isCheck)
changeRadio(val) {
this.isCheck = val
}, },
// //
async goSms() { async goSms() {
@ -118,7 +117,7 @@
.title { .title {
font-size: 48rpx; font-size: 48rpx;
color: #333; color: #333;
padding: 92rpx 0;
padding: 202rpx 0 80rpx 0;
text-align: center; text-align: center;
font-weight: 600; 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> </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 { export default {
city: state => state.user.vuex_cityInfo.city,
pushMessage: state => state.push.pushMessage, 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); Vue.use(Vuex);
const store = new Vuex.Store({ const store = new Vuex.Store({
state: { state: {
currentSchool: '',
userInfo: {},
latLng: {},
classChooseItem: {},
pdfUrl: '',
webViewUrl: '', webViewUrl: '',
havePay: 0, //tabbar 页面是否显示报错小图标
currentMyMsg: {},
billPrice: 0, //开发票的id
TrainingOrderId: '', //退款流程里的驾校id
bankInfo: {
realName: uni.getStorageSync('userInfo').realName,
phoneCode: ''
},
chooseCoachItem: {
coachId: ''
}, //报名时选择的教练
realAuthsuccee: false,
}, },
getters, getters,
mutations: { mutations: {
// 选择学校
upDateTrainingSchoolId(state, currentSchool) {
state.currentSchool = currentSchool
},
// webViewUrl // webViewUrl
updateWebVeiwUrl(state, url) { updateWebVeiwUrl(state, url) {
state.webViewUrl = 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
},
}, },

102
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 = { const user = {
state: { state: {
addList: []
vuex_cityInfo: uni.getStorageSync('vuex_cityInfo') ? uni.getStorageSync('vuex_cityInfo') : {city: '杭州市'},
vuex_userInfo: uni.getStorageSync('vuex_userInfo') ? uni.getStorageSync('vuex_userInfo') : {},
}, },
mutations: { mutations: {
// 更新广告列表
upDateAddList(state, list) {
state.addList = list
},
update_vuex_cityInfo(state, payload) {
state.vuex_cityInfo = payload
uni.setStorageSync('vuex_cityInfo', payload);
}
}, },
actions: { actions: {
// 点击广告
async addClick({commit, dispatch}, curAdd) {
// await dispatch('updateStatistics')
curAdd.clicks ++
if(!curAdd.adBannerDO.jumpUrl) {
return false
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('用户点击取消');
}
} }
commit('updateWebVeiwUrl', curAdd.adBannerDO.jumpUrl)
uni.navigateTo({
url:'/pages/commeWebView/addWebView'
})
},
})
// #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