Browse Source

写页面

master
unknown 8 months ago
parent
commit
2bb95cfb3f
  1. 2
      App.vue
  2. 4
      components/UserTab/UserTab.vue
  3. 125
      components/timeScreen/timeScreen.vue
  4. 51
      pages.json
  5. 38
      pages/recordEntry/examine/examineRecord/examineRecord.vue
  6. 188
      pages/tabbar/examSimulation/comp/coach.vue
  7. 153
      pages/tabbar/examSimulation/comp/examSimulation.vue
  8. 183
      pages/tabbar/examSimulation/index.vue
  9. 98
      pages/userCenter/forgetPwd/forgetPwd.vue
  10. 281
      pages/userCenter/login/login.vue
  11. 40
      pages/userCenter/login/loginByPhone.vue
  12. 2
      pages/userCenter/personaInfo/personaInfo.vue
  13. BIN
      static/images/coach/screen.png

2
App.vue

@ -2,7 +2,7 @@
export default {
onLaunch: function() {
console.log('App Launch')
// uni.hideTabBar();
uni.hideTabBar();
},
onShow: function() {
console.log('App Show')

4
components/UserTab/UserTab.vue

@ -93,8 +93,8 @@
{
"pagePath": "/pages/tabbar/examSimulation/index",
"text": "预约记录",
"iconPath": "../../static/images/tabbar/xy.png",
"selectedIconPath": "../../static/images/tabbar/xyActive.png"
"iconPath": "../../static/images/tabbar/kc.png",
"selectedIconPath": "../../static/images/tabbar/kcActive.png"
},
{
"pagePath": "/pages/tabbar/mine/index",

125
components/timeScreen/timeScreen.vue

@ -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>

51
pages.json

@ -47,29 +47,7 @@
}
],
"subPackages": [
{
"root": "pages/userCenter",
"pages": [
{
"path": "login/login",
"style": {
"navigationBarTitleText": "登录",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "login/loginByPhone",
"style": {
"navigationBarTitleText": "手机号登录",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
}
]
},
{
"root": "pages/indexEntry",
"pages": [
@ -207,6 +185,33 @@
"root": "pages/userCenter",
"pages": [
{
"path": "login/login",
"style": {
"navigationBarTitleText": "登录",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "login/loginByPhone",
"style": {
"navigationBarTitleText": "手机号登录",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "forgetPwd/forgetPwd",
"style": {
"navigationBarTitleText": "修改密码",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"backgroundTextStyle": "dark"
}
},
{
"path": "personaInfo/personaInfo",
"style": {
"navigationBarTitleText": "",

38
pages/recordEntry/examine/examineRecord/examineRecord.vue

@ -16,7 +16,15 @@
<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">12条记录</view>
<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>
@ -63,12 +71,29 @@
background: #1989FA;
padding-bottom: 20rpx;
}
.total {
font-size: 24rpx;
color: #686B73;
text-align: right;
line-height: 70rpx;
.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;
}
@ -87,6 +112,7 @@
text-align: center;
line-height: 72rpx;
color: #ADADAD;
font-size: 28rpx;
&.active {
background: rgba(25,137,250,0.1);
border-radius: 16rpx;

188
pages/tabbar/examSimulation/comp/coach.vue

@ -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>

153
pages/tabbar/examSimulation/comp/examSimulation.vue

@ -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>

183
pages/tabbar/examSimulation/index.vue

@ -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>

98
pages/userCenter/forgetPwd/forgetPwd.vue

@ -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>

281
pages/userCenter/login/login.vue

@ -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;
}
.oneBtn {
line-height: 112rpx;
height: 112rpx;
border-top: 1px solid #E8E9EC;
text-align: center;
font-size: 36rpx;
color: $themC;
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);
}
}
.radioWrap {
display: flex;
align-items: center;
margin-top: 40rpx;
.privacyText {
font-size: 24rpx;
color: #888E94;
text {
color: $themC;
}
}
}
}
}
</style>

40
pages/userCenter/login/loginByPhone.vue

@ -5,35 +5,30 @@
<u-icon name="arrow-left" color="#333" size="28"></u-icon>
</view>
</view>
<view class="title">短信验证码登录</view>
<view class="title">
<image src="@/static/images/userCenter/loginTitle.png" mode=""></image>
</view>
<view class="form">
<view class="form-item">
<view class="prefix">
<view class="jia">+</view>
<view class="num">86</view>
<view class="" style="margin: 0 32rpx 0 12rpx;">
<u-icon name="arrow-down" color="#333" size="16" ></u-icon>
</view>
</view>
<view class="inputBox my">
<u--input placeholder="请输入手机号" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
<u--input placeholder="请输入登录账号" border="none" clearable type="number" maxlength="11" v-model="FormData.phone"></u--input>
</view>
</view>
<view class="form-item">
<view class="inputBox my">
<u--input placeholder="请输入验证码" border="none" clearable style="height: 100%;" :clearable="false" v-model="FormData.code"></u--input>
<u--input placeholder="请输入密码" border="none" clearable style="height: 100%;" :clearable="false" v-model="FormData.password"></u--input>
</view>
<view class="code" @tap='goSms' :class="{active: isPhone&&!codeOn}">{{codeText}}</view>
</view>
<view class="forgetTps" @click="$u.toast('请联系管理员重置密码!')">忘记密码</view>
<view class="loginBtn" :class="{active: btnHighlight}" @click="submitFn"> </view>
<view class="radioWrap">
<!-- <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>
</view>
</template>
@ -57,7 +52,7 @@
return uni.$u.test.mobile(this.FormData.phone)
},
btnHighlight() {
return this.isPhone&&uni.$u.test.code(this.FormData.code, 4)
return this.isPhone&&this.FormData.password
}
},
methods: {
@ -102,7 +97,7 @@
val = 3
}
this.$store.commit('upDateIdentity', val)
uni.switchTab({
uni.reLaunch({
url: '/pages/tabbar/statistics/index'
})
}
@ -125,11 +120,9 @@
}
.title {
font-size: 48rpx;
color: #333;
padding: 92rpx 0;
text-align: center;
font-weight: 600;
width: 658rpx;
height: 94rpx;
margin: 130rpx auto 114rpx auto;
}
.form {
@ -162,7 +155,12 @@
}
}
}
.forgetTps {
font-size: 28rpx;
color: $themC;
margin-top: -20rpx;
text-align: right;
}
.loginBtn {
width: 100%;
height: 112rpx;

2
pages/userCenter/personaInfo/personaInfo.vue

@ -37,7 +37,7 @@
<view class="btnBox">
<view class="logout" @click="$goPage('/pages/userCenter/login/login')">退出登录</view>
<view class="logout">修改密码</view>
<view class="logout" @click="$goPage('/pages/userCenter/forgetPwd/forgetPwd')">修改密码</view>
</view>

BIN
static/images/coach/screen.png

After

Width: 28  |  Height: 28  |  Size: 904 B

Loading…
Cancel
Save