13 changed files with 810 additions and 355 deletions
-
2App.vue
-
4components/UserTab/UserTab.vue
-
125components/timeScreen/timeScreen.vue
-
51pages.json
-
38pages/recordEntry/examine/examineRecord/examineRecord.vue
-
188pages/tabbar/examSimulation/comp/coach.vue
-
153pages/tabbar/examSimulation/comp/examSimulation.vue
-
183pages/tabbar/examSimulation/index.vue
-
98pages/userCenter/forgetPwd/forgetPwd.vue
-
281pages/userCenter/login/login.vue
-
40pages/userCenter/login/loginByPhone.vue
-
2pages/userCenter/personaInfo/personaInfo.vue
-
BINstatic/images/coach/screen.png
@ -0,0 +1,125 @@ |
|||
<template> |
|||
<view class="popupCon"> |
|||
<view class="popTab"> |
|||
<view class="tabItem" :class="{active: currentPopTab==1}" @click="changePopTab(1)">月份选择</view> |
|||
<view class="tabItem" :class="{active: currentPopTab==2}" @click="changePopTab(2)">自定义时间</view> |
|||
</view> |
|||
<view class="timer"> |
|||
<view class="tabCon" v-if="currentPopTab==1"> |
|||
<view class="dateBtn" @click="showDatePickerFn(1)" :class="{hui: !date1}">{{ date1 }}</view> |
|||
<!-- <u-datetime-picker-my |
|||
:show="show" |
|||
v-model="value1" |
|||
mode="year-month" |
|||
:showToolbar="false" |
|||
:visibleItemCount="4" |
|||
@confirm="confirm" |
|||
></u-datetime-picker-my> --> |
|||
</view> |
|||
<view class="tabCon" v-else> |
|||
<view class="dateBtn" :class="{hui: !date2}" @click="showDatePickerFn(2)">{{ date2 }}</view> |
|||
<view class="to">至</view> |
|||
<view class="dateBtn" :class="{hui: !date3}" @click="showDatePickerFn(3)">{{ date3 }}</view> |
|||
</view> |
|||
<view class="btnBg" @click="selectDateClick">确定</view> |
|||
<!-- <u-picker-my></u-picker-my> --> |
|||
</view> |
|||
<u-datetime-picker |
|||
:show="showDatePicker" |
|||
v-model="value1" |
|||
mode="year-month" |
|||
:visibleItemCount="4" |
|||
:closeOnClickOverlay="false" |
|||
@confirm="confirmDatePicker" |
|||
></u-datetime-picker> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
currentPopTab: 1, |
|||
showDatePicker: false, |
|||
value1: '', |
|||
currentBtnDate: '' |
|||
} |
|||
}, |
|||
methods: { |
|||
// 1打开时间选择器 |
|||
showDatePickerFn(num) { |
|||
this.showDate = false |
|||
this.showDatePicker = true |
|||
this.currentBtnDate = num |
|||
}, |
|||
// 2选择时间选择器里的时间 |
|||
confirmDatePicker(val) { |
|||
this.showDatePicker = false |
|||
let date = uni.$u.date(val.value, 'yyyy-mm-dd') |
|||
if(this.currentBtnDate==1) { |
|||
date = uni.$u.date(val.value, 'yyyy-mm') |
|||
} |
|||
this['date'+this.currentBtnDate] = date |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
.popupCon { |
|||
height: 430rpx; |
|||
.popTab { |
|||
display: flex; |
|||
padding: 40rpx 32rpx; |
|||
.tabItem { |
|||
font-size: 32rpx; |
|||
color: #333; |
|||
margin-right: 60rpx; |
|||
&.active { |
|||
color: $themC; |
|||
position: relative; |
|||
&::before { |
|||
content: ''; |
|||
position: absolute; |
|||
bottom: -20rpx; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
width: 128rpx; |
|||
height: 4rpx; |
|||
background: #1989FA; |
|||
border-radius: 3rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.tabCon { |
|||
display: flex; |
|||
align-items: center; |
|||
padding-left: 32rpx; |
|||
padding-top: 20rpx; |
|||
.dateBtn { |
|||
width: 280rpx; |
|||
height: 80rpx; |
|||
border-radius: 10rpx; |
|||
border: 2rpx solid #1989FA; |
|||
line-height: 80rpx; |
|||
text-align: center; |
|||
color: $themC; |
|||
font-size: 32rpx; |
|||
&.hui { |
|||
border: 2rpx solid #E8E9EC; |
|||
} |
|||
} |
|||
.to { |
|||
font-size: 32rpx; |
|||
margin: 0 40rpx; |
|||
} |
|||
} |
|||
|
|||
.btnBg { |
|||
width: 396rpx; |
|||
margin: 34rpx auto 42rpx auto; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,188 @@ |
|||
<template> |
|||
<view class="pageBgImg pad"> |
|||
<view class="searchBox"> |
|||
<searchRow placeholder="搜索学员姓名、学员手机号、考场名称"></searchRow> |
|||
</view> |
|||
<view class="card"> |
|||
<view class="verified_today"> |
|||
<view class="leftVerified"> |
|||
<view class="num_row"> |
|||
<view class="num">7</view> |
|||
<view class="unit">个</view> |
|||
</view> |
|||
<view class="txtLab">今日待核销</view> |
|||
</view> |
|||
<view class="rightBtn"> |
|||
<view class="objBtn">科目二：3</view> |
|||
<view class="objBtn">科目二：7</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="card_flex"> |
|||
<view class="card" v-for="(item,index) in 4" :key="index"> |
|||
<view class="flex-b" style="padding: 32rpx 0;"> |
|||
<view class="leftText"> |
|||
<view class="lab">指标总量</view> |
|||
<view class="num_row"> |
|||
<view class="num">7</view> |
|||
<view class="unit">个</view> |
|||
</view> |
|||
</view> |
|||
<view class="rightTxt"> |
|||
<view class="text_row"> |
|||
<view class="dian yellow"></view> |
|||
<view class="text">科目二：100</view> |
|||
</view> |
|||
<view class="text_row"> |
|||
<view class="dian"></view> |
|||
<view class="text">科目二：100</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="flex-b"> |
|||
<view class="h1">预约记录</view> |
|||
<moreRight text="更多" @click.native="$goPage('/pages/recordEntry/examine/examineRecord/examineRecord')"></moreRight> |
|||
</view> |
|||
<view class="card"> |
|||
<appointItem /> |
|||
</view> |
|||
<UserTab name ='考场模拟'></UserTab> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return {} |
|||
}, |
|||
onLoad() {}, |
|||
onShow() { |
|||
uni.hideTabBar(); |
|||
}, |
|||
methods: { |
|||
goPage() {} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
.searchBox { |
|||
padding: 140rpx 0 24rpx 0; |
|||
} |
|||
.h1 { |
|||
line-height: 92rpx; |
|||
} |
|||
.card { |
|||
padding: 0 28rpx; |
|||
margin-bottom: 20rpx; |
|||
.verified_today { |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 20rpx 0; |
|||
.leftVerified { |
|||
flex: 1; |
|||
text-align: center; |
|||
.num_row { |
|||
display: flex; |
|||
justify-content: center; |
|||
color: $themC; |
|||
.num { |
|||
font-size: 56rpx; |
|||
} |
|||
|
|||
.unit { |
|||
font-size: 24rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
} |
|||
.txtLab { |
|||
font-size: 28rpx; |
|||
color: #686B73; |
|||
margin-top: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.rightBtn { |
|||
width: 224rpx; |
|||
.objBtn { |
|||
width: 100%; |
|||
height: 76rpx; |
|||
background: rgba(25,137,250,0.1); |
|||
border-radius: 8rpx; |
|||
line-height: 76rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: $themC; |
|||
&:first-child { |
|||
margin-bottom: 8rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card_flex { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
.card { |
|||
width: 48.8%; |
|||
.leftText { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
color: $themC; |
|||
.lab { |
|||
font-size: 24rpx; |
|||
} |
|||
|
|||
.num_row { |
|||
display: flex; |
|||
margin-top: 10rpx; |
|||
.num { |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.unit { |
|||
font-size: 24rpx; |
|||
margin-top: 8rpx; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.rightTxt { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
.text_row { |
|||
display: flex; |
|||
align-items: center; |
|||
&:first-child { |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.dian { |
|||
width: 8rpx; |
|||
height: 8rpx; |
|||
background: #0D9269; |
|||
border-radius: 4rpx; |
|||
margin-right: 10rpx; |
|||
&.yellow { |
|||
background: #FA7919; |
|||
} |
|||
} |
|||
|
|||
.text { |
|||
font-size: 24rpx; |
|||
color: #333; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,153 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view class="blueBg"> |
|||
<topNavbar title="预约记录"></topNavbar> |
|||
<view class="pad"> |
|||
<view class="searchBox"> |
|||
<searchRow placeholder="搜索学员姓名、学员手机号、考场名称"></searchRow> |
|||
</view> |
|||
<view class="tabs"> |
|||
<view class="tab" @click="changeTab(1)" :class="{active: currentTab==1}">待核销</view> |
|||
<view class="tab" @click="changeTab(2)" :class="{active: currentTab==2}">已核销</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="navs"> |
|||
<view class="nav" v-for="(item,index) in tabsList" :key="index" :class="{active: currentNav==item.id}" @click="changeNav(item)">{{ item.text }}</view> |
|||
</view> |
|||
<view class="pad"> |
|||
<view class="total_row"> |
|||
<view class="total">12条记录</view> |
|||
<view class="screen"> |
|||
<view class="text">筛选</view> |
|||
<view class="icon"> |
|||
<image src="@/static/images/coach/screen.png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="card" @click="goPage"> |
|||
<appointItem /> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
currentTab: 1, |
|||
currentNav: 1, |
|||
tabsList: [ |
|||
{id: 1, text: '全部'}, |
|||
{id: 2, text: '科目二'}, |
|||
{id: 3, text: '科目三'}, |
|||
] |
|||
} |
|||
}, |
|||
methods: { |
|||
changeTab(num) { |
|||
console.log(num) |
|||
this.currentTab = num |
|||
}, |
|||
changeNav(item) { |
|||
this.currentNav = item.id |
|||
}, |
|||
goPage() { |
|||
console.log('------------') |
|||
this.$goPage('/pages/recordEntry/examine/examineRecord/detail/detail') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.main { |
|||
width: 100%; |
|||
min-height: 100vh; |
|||
background: #f3f3f3; |
|||
.blueBg { |
|||
background: #1989FA; |
|||
padding-bottom: 20rpx; |
|||
} |
|||
.total_row { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
height: 82rpx; |
|||
align-items: center; |
|||
.total { |
|||
font-size: 24rpx; |
|||
color: #686B73; |
|||
text-align: right; |
|||
line-height: 82rpx; |
|||
} |
|||
.screen { |
|||
display: flex;align-items: center; |
|||
color: $themC; |
|||
margin-left: 8rpx; |
|||
font-size: 28rpx; |
|||
.icon { |
|||
width: 24rpx; |
|||
height: 24rpx; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card { |
|||
padding: 0 20rpx; |
|||
} |
|||
} |
|||
.searchBox { |
|||
padding: 24rpx 0 20rpx 0; |
|||
} |
|||
.tabs { |
|||
display: flex; |
|||
width: 100%; |
|||
height: 72rpx; |
|||
background: #FFFFFF; |
|||
border-radius: 16rpx; |
|||
.tab { |
|||
flex: 1; |
|||
text-align: center; |
|||
line-height: 72rpx; |
|||
color: #ADADAD; |
|||
font-size: 28rpx; |
|||
&.active { |
|||
background: rgba(25,137,250,0.1); |
|||
border-radius: 16rpx; |
|||
border: 2rpx solid #1989FA; |
|||
color: $themC; |
|||
font-weight: 600; |
|||
} |
|||
} |
|||
} |
|||
.navs { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
color: #fff; |
|||
font-size: 28rpx; |
|||
padding: 0rpx 108rpx 0rpx 130rpx; |
|||
color: $themC; |
|||
background: #fff; |
|||
height: 100rpx; |
|||
.nav { |
|||
line-height: 100rpx; |
|||
&.active { |
|||
font-weight: 500; |
|||
position: relative; |
|||
&::before { |
|||
position: absolute; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
bottom: 20rpx; |
|||
content: ''; |
|||
width: 56rpx; |
|||
height: 6rpx; |
|||
background: $themC; |
|||
border-radius: 3rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,188 +1,23 @@ |
|||
<template> |
|||
<view class="pageBgImg pad"> |
|||
<view class="searchBox"> |
|||
<searchRow placeholder="搜索学员姓名、学员手机号、考场名称"></searchRow> |
|||
</view> |
|||
<view class="card"> |
|||
<view class="verified_today"> |
|||
<view class="leftVerified"> |
|||
<view class="num_row"> |
|||
<view class="num">7</view> |
|||
<view class="unit">个</view> |
|||
</view> |
|||
<view class="txtLab">今日待核销</view> |
|||
</view> |
|||
<view class="rightBtn"> |
|||
<view class="objBtn">科目二：3</view> |
|||
<view class="objBtn">科目二：7</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="card_flex"> |
|||
<view class="card" v-for="(item,index) in 4" :key="index"> |
|||
<view class="flex-b" style="padding: 32rpx 0;"> |
|||
<view class="leftText"> |
|||
<view class="lab">指标总量</view> |
|||
<view class="num_row"> |
|||
<view class="num">7</view> |
|||
<view class="unit">个</view> |
|||
</view> |
|||
</view> |
|||
<view class="rightTxt"> |
|||
<view class="text_row"> |
|||
<view class="dian yellow"></view> |
|||
<view class="text">科目二：100</view> |
|||
</view> |
|||
<view class="text_row"> |
|||
<view class="dian"></view> |
|||
<view class="text">科目二：100</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="flex-b"> |
|||
<view class="h1">预约记录</view> |
|||
<moreRight text="更多" @click.native="$goPage('/pages/recordEntry/examine/examineRecord/examineRecord')"></moreRight> |
|||
</view> |
|||
<view class="card"> |
|||
<appointItem /> |
|||
</view> |
|||
<UserTab name ='考场模拟'></UserTab> |
|||
<view class="main"> |
|||
<coachIdentity v-if="identity==1"/> |
|||
<examineRecord v-if="identity==3"/> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import coachIdentity from './comp/coach.vue' |
|||
import examineRecord from '../../recordEntry/examine/examineRecord/examineRecord' |
|||
export default { |
|||
components: { coachIdentity,examineRecord }, |
|||
data() { |
|||
return {} |
|||
}, |
|||
onLoad() {}, |
|||
onShow() { |
|||
uni.hideTabBar(); |
|||
}, |
|||
methods: { |
|||
goPage() {} |
|||
return { |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
.searchBox { |
|||
padding: 140rpx 0 24rpx 0; |
|||
} |
|||
.h1 { |
|||
line-height: 92rpx; |
|||
} |
|||
.card { |
|||
padding: 0 28rpx; |
|||
margin-bottom: 20rpx; |
|||
.verified_today { |
|||
display: flex; |
|||
align-items: center; |
|||
padding: 20rpx 0; |
|||
.leftVerified { |
|||
flex: 1; |
|||
text-align: center; |
|||
.num_row { |
|||
display: flex; |
|||
justify-content: center; |
|||
color: $themC; |
|||
.num { |
|||
font-size: 56rpx; |
|||
} |
|||
|
|||
.unit { |
|||
font-size: 24rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
} |
|||
.txtLab { |
|||
font-size: 28rpx; |
|||
color: #686B73; |
|||
margin-top: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.rightBtn { |
|||
width: 224rpx; |
|||
.objBtn { |
|||
width: 100%; |
|||
height: 76rpx; |
|||
background: rgba(25,137,250,0.1); |
|||
border-radius: 8rpx; |
|||
line-height: 76rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: $themC; |
|||
&:first-child { |
|||
margin-bottom: 8rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.card_flex { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
flex-wrap: wrap; |
|||
.card { |
|||
width: 48.8%; |
|||
.leftText { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
color: $themC; |
|||
.lab { |
|||
font-size: 24rpx; |
|||
} |
|||
|
|||
.num_row { |
|||
display: flex; |
|||
margin-top: 10rpx; |
|||
.num { |
|||
font-size: 40rpx; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.unit { |
|||
font-size: 24rpx; |
|||
margin-top: 8rpx; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.rightTxt { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
.text_row { |
|||
display: flex; |
|||
align-items: center; |
|||
&:first-child { |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.dian { |
|||
width: 8rpx; |
|||
height: 8rpx; |
|||
background: #0D9269; |
|||
border-radius: 4rpx; |
|||
margin-right: 10rpx; |
|||
&.yellow { |
|||
background: #FA7919; |
|||
} |
|||
} |
|||
|
|||
.text { |
|||
font-size: 24rpx; |
|||
color: #333; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,98 @@ |
|||
<template> |
|||
<view class="pageBgImg"> |
|||
<topNavbar title="修改密码"></topNavbar> |
|||
<view class="form pad"> |
|||
<view class="card"> |
|||
<view class="form-item"> |
|||
<view class="lab">原密码</view> |
|||
<view class="inputBox my"> |
|||
<u-input placeholder="输入旧密码" v-model="FormData.oldPwd" border="none"></u-input> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="card"> |
|||
<view class="form-item border"> |
|||
<view class="lab">新密码</view> |
|||
<view class="inputBox my"> |
|||
<u-input placeholder="输入新密码" v-model="FormData.pwd1" border="none"></u-input> |
|||
</view> |
|||
</view> |
|||
<view class="form-item"> |
|||
<view class="lab">新密码</view> |
|||
<view class="inputBox my"> |
|||
<u-input placeholder="再次输入新密码" v-model="FormData.pwd2" border="none"></u-input> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="btnBg" :class="{hui: !highlight}">确认修改</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
FormData: { |
|||
oldPwd: '', |
|||
pwd1: '', |
|||
pwd2: '', |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
highlight() { |
|||
let { FormData } = this |
|||
if(FormData.oldPwd&&FormData.pwd1&&FormData.pwd2) { |
|||
return true |
|||
}else { |
|||
return false |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.pageBgImg { |
|||
|
|||
|
|||
.form { |
|||
.card { |
|||
padding: 0 20rpx; |
|||
margin-bottom: 20rpx; |
|||
.form-item { |
|||
height: 104rpx; |
|||
line-height: 104rpx; |
|||
font-size: 28rpx; |
|||
color: #333; |
|||
display: flex; |
|||
align-items: center; |
|||
&.border { |
|||
border-bottom: 1px solid #F6F6F6; |
|||
} |
|||
.lab { |
|||
width: 180rpx; |
|||
} |
|||
|
|||
.inputBox { |
|||
flex: 1; |
|||
u-input { |
|||
|
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btnBg { |
|||
width: 396rpx; |
|||
margin: 136rpx auto; |
|||
&.hui { |
|||
opacity: 0.3; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -1,167 +1,194 @@ |
|||
<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 class="u-back-top"> |
|||
<view class="backBox"> |
|||
<u-icon name="arrow-left" color="#333" size="28"></u-icon> |
|||
</view> |
|||
</view> |
|||
<view style="margin-top: 40rpx;"> |
|||
<privacyRadion :isCheck="isCheck" @changeRadio="changeRadio"></privacyRadion> |
|||
<view class="title"> |
|||
<image src="@/static/images/userCenter/loginTitle.png" mode=""></image> |
|||
</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 class="form"> |
|||
<view class="form-item"> |
|||
<view class="inputBox my"> |
|||
<u--input placeholder="请输入登录账号" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input> |
|||
</view> |
|||
</view> |
|||
|
|||
</u-popup> |
|||
<view class="form-item"> |
|||
<view class="inputBox my"> |
|||
<u--input placeholder="请输入密码" border="none" clearable style="height: 100%;" :clearable="false" v-model="FormData.password"></u--input> |
|||
</view> |
|||
</view> |
|||
<view class="forgetTps" @click="$u.toast('请联系管理员重置密码！')">忘记密码</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> --> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { getLoginCode } from '@/config/api.js' |
|||
export default { |
|||
data() { |
|||
return { |
|||
isCheck: false, |
|||
show: false, |
|||
decodePhoneParams: {} |
|||
codeText: '获取验证码', |
|||
FormData: {}, |
|||
codeOn: false |
|||
} |
|||
}, |
|||
onLoad() { |
|||
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; |
|||
} |
|||
|
|||
}, |
|||
computed: { |
|||
isPhone() { |
|||
return uni.$u.test.mobile(this.FormData.phone) |
|||
}, |
|||
btnHighlight() { |
|||
return this.isPhone&&this.FormData.password |
|||
} |
|||
}, |
|||
methods: { |
|||
// 是否选择协议 |
|||
changeRadio(val) { |
|||
this.isCheck = val |
|||
groupChangeEnvnt(e) { |
|||
this.isCheck = e.value |
|||
console.log('是否选择协议', this.isCheck) |
|||
}, |
|||
init() { |
|||
uni.login({ |
|||
provider: 'weixin', |
|||
"onlyAuthorize": true, |
|||
success: function (loginRes) { |
|||
console.log('11') |
|||
console.log(loginRes) |
|||
// 登录成功 |
|||
uni.getUserInfo({ |
|||
provider: 'weixin', |
|||
success: function(info) { |
|||
// 获取用户信息成功, info.authResult保存用户信息 |
|||
console.log('11') |
|||
console.log(info) |
|||
} |
|||
}) |
|||
}, |
|||
fail: function (err) { |
|||
// 登录授权失败 |
|||
// err.code是错误码 |
|||
} |
|||
}); |
|||
// 发送短信验证码 |
|||
async goSms() { |
|||
const { |
|||
FormData |
|||
} = this |
|||
if (!FormData.phone) return this.$u.toast('请输入手机号'); |
|||
if (!this.isPhone) return this.$u.toast('手机号格式有误'); |
|||
if (this.codeOn) return |
|||
const data = await getLoginCode({ |
|||
codeType: 1, |
|||
phone: FormData.phone, |
|||
}) |
|||
console.log(data) |
|||
// 获取验证码 |
|||
var time = 60; |
|||
var timer = setInterval(() => { |
|||
time--; |
|||
this.codeText = time + "秒后重新发送" |
|||
this.codeOn = true; |
|||
if (time == 0) { |
|||
clearInterval(timer); |
|||
this.codeText = "获取验证码"; |
|||
this.codeOn = false; |
|||
} |
|||
}, 1000); |
|||
}, |
|||
|
|||
submitFn() { |
|||
let val = 1 |
|||
if(this.FormData.phone=='18267103167') { |
|||
val = 1 |
|||
}else if(this.FormData.phone=='18267103168') { |
|||
val = 2 |
|||
}else { |
|||
val = 3 |
|||
} |
|||
this.$store.commit('upDateIdentity', val) |
|||
uni.reLaunch({ |
|||
url: '/pages/tabbar/statistics/index' |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
|
|||
.main { |
|||
width: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
min-height: 100vh; |
|||
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; |
|||
} |
|||
.u-back-top { |
|||
padding: 32rpx 0 0 0; |
|||
.backBox { |
|||
padding: 24rpx; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.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%); |
|||
.title { |
|||
width: 658rpx; |
|||
height: 94rpx; |
|||
margin: 130rpx auto 114rpx auto; |
|||
} |
|||
|
|||
.msg { |
|||
font-size: 28rpx; |
|||
color: #686B73; |
|||
padding: 0 0 30rpx 0; |
|||
text-align: center; |
|||
} |
|||
.form { |
|||
padding: 0 46rpx; |
|||
.form-item { |
|||
height: 112rpx; |
|||
background: #F4F7FF; |
|||
border-radius: 16rpx; |
|||
width: 100%; |
|||
line-height: 112rpx; |
|||
display: flex; |
|||
margin-bottom: 40rpx; |
|||
padding: 0 40rpx; |
|||
.prefix { |
|||
display: flex; |
|||
align-items: center; |
|||
font-size: 32rpx; |
|||
color: #333; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
.inputBox { |
|||
flex: 1; |
|||
} |
|||
.code { |
|||
color: #BBBBBB; |
|||
margin-left: 30rpx; |
|||
&.active { |
|||
color: $themC |
|||
} |
|||
} |
|||
} |
|||
.forgetTps { |
|||
font-size: 28rpx; |
|||
color: $themC; |
|||
margin-top: -20rpx; |
|||
text-align: right; |
|||
} |
|||
.loginBtn { |
|||
width: 100%; |
|||
height: 112rpx; |
|||
background: rgba(25,137,250,0.3); |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
line-height: 112rpx; |
|||
font-size: 32rpx; |
|||
font-weight: 600; |
|||
color: #fff; |
|||
margin-top: 100rpx; |
|||
&.active { |
|||
background: rgba(25,137,250,1); |
|||
} |
|||
} |
|||
|
|||
.oneBtn { |
|||
line-height: 112rpx; |
|||
height: 112rpx; |
|||
border-top: 1px solid #E8E9EC; |
|||
text-align: center; |
|||
font-size: 36rpx; |
|||
color: $themC; |
|||
font-weight: 600; |
|||
.radioWrap { |
|||
display: flex; |
|||
align-items: center; |
|||
margin-top: 40rpx; |
|||
.privacyText { |
|||
font-size: 24rpx; |
|||
color: #888E94; |
|||
text { |
|||
color: $themC; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: 28 | Height: 28 | Size: 904 B |
Write
Preview
Loading…
Cancel
Save
Reference in new issue