Skip to content

U
uni-starter

德宏大魔王 / uni-starter
与 Fork 源项目一致

Fork自 DCloud / uni-starter

通知 1
Star 0
Fork 0
U
uni-starter
提交 948370a8 编写于 作者: DCloud_JSON's avatar DCloud_JSON
浏览文件
操作

简化逻辑

上级 de483cde
隐藏空白更改
内联 并排
Showing with 639 addition and 378 deletion
baseapp.config.js
浏览文件 @ 948370a8
...@@ -18,7 +18,7 @@ module.exports = { ...@@ -18,7 +18,7 @@ module.exports = {
"/uni_modules/uni-news-favorite/pages/uni-news-favorite/list", "/uni_modules/uni-news-favorite/pages/uni-news-favorite/list",
"/pages/ucenter/edit/uploadCutImageToUnicloud" "/pages/ucenter/edit/uploadCutImageToUnicloud"
], ],
"login": ["univerify", "smsCode", "username", "weixin", "apple"] //默认就是短信验证码登陆 "login": [ "smsCode","univerify", "username", "weixin", "apple"] //默认就是短信验证码登陆
}, },
"about": { "about": {
"appName": "base-app", "appName": "base-app",
......
common/extiLogin.js 0 → 100644
浏览文件 @ 948370a8
export default function(result){
uni.showToast({
title: '登陆成功',
icon: 'none'
});
console.log('登陆成功',result);
uni.setStorageSync('uni_id_uid', result.uid)
uni.setStorageSync('uni_id_token', result.token)
uni.setStorageSync('uni_id_token_expired', result.tokenExpired)
//delete result.userInfo.token
// this.setUserInfo(result.userInfo)
var delta = 0//判断需要返回几层
let pages = getCurrentPages();
// console.log(pages);
pages.forEach((page,index)=>{
// console.log(pages[pages.length-index-1].route.split('/')[2]);
pages[pages.length-index-1].route.split('/')
if(pages[pages.length-index-1].route.split('/')[2] == 'login-page'){
delta ++
}
})
// console.log('判断需要返回几层',delta);
uni.navigateBack({delta})
}
\ No newline at end of file
components/send-sms-code/send-sms-code.vue
浏览文件 @ 948370a8
...@@ -79,8 +79,8 @@ ...@@ -79,8 +79,8 @@
{ {
"mobile": this.phone, "mobile": this.phone,
"type": this.codeType "type": this.codeType
},(data,result)=>{ },result=>{
console.log(data,result); console.log(result);
uni.showToast({ uni.showToast({
title: "短信验证码发送成功", title: "短信验证码发送成功",
icon: 'none' icon: 'none'
......
components/uni-agreements/uni-agreements.vue 0 → 100644
浏览文件 @ 948370a8
<template>
<view class="root">
<text>登陆即表示同意</text>
<template v-for="(agreement,index) in agreements">
<text class="agreement" @click="navigateTo(agreement)">{{agreement.title}}</text>
<text class="hint" v-if="agreements.length-1>index">和</text>
</template>
</view>
</template>
<script>
export default {
name:"uni-agreements",
computed:{
agreements(){
return getApp().config.about.agreements
}
},
methods:{
navigateTo({url,title}){
uni.navigateTo({
url: '/pages/common/webview/webview?url='+url+'&title='+title,
success: res => {},
fail: () => {},
complete: () => {}
});
}
},
data() {
return {
};
}
}
</script>
<style>
.root{
flex-direction: row;
font-size: 28rpx;
color: #8a8f8b;
}
.agreement{
color:#04498c;
}
</style>
components/uni-quick-login/uni-quick-login.vue
浏览文件 @ 948370a8
...@@ -120,7 +120,7 @@ ...@@ -120,7 +120,7 @@
}), }),
getRoute(n = 0) { getRoute(n = 0) {
let pages = getCurrentPages(); let pages = getCurrentPages();
console.log('route-pages-length', pages.length); // console.log('route-pages-length', pages.length);
if (n > pages.length) { if (n > pages.length) {
return '' return ''
} }
...@@ -211,7 +211,7 @@ ...@@ -211,7 +211,7 @@
}, },
quickLogin(params, type) { //联网验证登陆 quickLogin(params, type) { //联网验证登陆
console.log(params, type); console.log(params, type);
this.request('user-center/login_by_' + type, params, (data, result) => { this.request('user-center/login_by_' + type, params, result => {
console.log(result); console.log(result);
if (result.code === 0) { if (result.code === 0) {
if (type == 'univerify') { if (type == 'univerify') {
...@@ -251,7 +251,10 @@ ...@@ -251,7 +251,10 @@
.quick-login-box { .quick-login-box {
flex-direction: row; flex-direction: row;
width: 750rpx; width: 750rpx;
justify-content: space-around; justify-content: space-around;
position: fixed;
bottom: 10rpx;
left: 0;
} }
.item { .item {
......
js_sdk/request.js
浏览文件 @ 948370a8
...@@ -23,7 +23,7 @@ export default function request(name,params,callback=false,{showLoading=false,lo ...@@ -23,7 +23,7 @@ export default function request(name,params,callback=false,{showLoading=false,lo
const {result:{data,code}} = e const {result:{data,code}} = e
console.log(data,code); console.log(data,code);
resolve(e) resolve(e)
return callback(data,e.result,e) return callback(e.result,e)
}, },
fail(err){ fail(err){
reject(err) reject(err)
......
pages.json
浏览文件 @ 948370a8
...@@ -100,25 +100,26 @@ ...@@ -100,25 +100,26 @@
// #endif // #endif
} }
}, { },
"path": "pages/ucenter/agree-list/agree-list", // {
"style": { // "path": "pages/ucenter/agree-list/agree-list",
"navigationBarTitleText": "政策与协议" // "style": {
} // "navigationBarTitleText": "政策与协议"
// }
}, {
"path": "pages/ucenter/agree-list/privacy/privacy",
"style": {
"navigationBarTitleText": "隐私政策"
}
}, { // }, {
"path": "pages/ucenter/agree-list/service/service", // "path": "pages/ucenter/agree-list/privacy/privacy",
"style": { // "style": {
"navigationBarTitleText": "服务协议" // "navigationBarTitleText": "隐私政策"
} // }
}, { // }, {
// "path": "pages/ucenter/agree-list/service/service",
// "style": {
// "navigationBarTitleText": "服务协议"
// }
// },
{
"path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup", "path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup",
"style": { "style": {
"disableScroll": true, "disableScroll": true,
......
pages/ucenter/edit/bind-mobile/bind-mobile.vue
浏览文件 @ 948370a8
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
this.request('user-center/bind_mobile_by_sms', { this.request('user-center/bind_mobile_by_sms', {
"mobile": this.formData.phone, "mobile": this.formData.phone,
"code": this.formData.code "code": this.formData.code
}, (data, result) => { }, result=> {
console.log(result); console.log(result);
this.setUserInfo({"mobile":result.mobile}) this.setUserInfo({"mobile":result.mobile})
uni.showToast({ uni.showToast({
......
pages/ucenter/edit/edit.vue
浏览文件 @ 948370a8
...@@ -71,7 +71,7 @@ ...@@ -71,7 +71,7 @@
console.log(e.authResult); console.log(e.authResult);
this.request('user-center/bind_mobile_by_univerify', this.request('user-center/bind_mobile_by_univerify',
e.authResult, e.authResult,
(data, result) => result=>
{ {
console.log(result); console.log(result);
if(result.code===0){ if(result.code===0){
......
pages/ucenter/login-page/common/login-page.css 0 → 100644
浏览文件 @ 948370a8
.content{
padding:0 50rpx;
width: 750rpx;
flex: 1;
}
.input-box{
padding:0 15px;
margin-top: 15px;
background-color: #F8F8F8;
border-radius: 6px;
font-size: 28rpx;
}
.get-code{
margin: 0;
margin-top:15px;
background-color: #007aff;
color: #FFFFFF;
}
.input-box,.get-code{
height: 50px;
line-height: 50px;
}
.title{
text-align: center;
padding-bottom: 5px;
}
.tip{
color: #666666;
font-size: 26rpx;
margin: 6px 0;
}
.easyinput{
background-color: #F8F8F8;
}
.send-btn{
height: 85rpx;
width: 100%;
margin-top:15px;
border-radius: 6rpx;
}
.link{
color: #04498c;
}
\ No newline at end of file
pages/ucenter/login-page/common/login-page.mixin.js 0 → 100644
浏览文件 @ 948370a8
import {mapMutations} from 'vuex';
import loginSuccess from './loginSuccess.js';
let mixin = {
methods:{
...mapMutations({
setUserInfo: 'user/login'
}),
loginSuccess(result){
loginSuccess(result)
delete result.userInfo.token
this.setUserInfo(result.userInfo)
}
}
}
export default mixin
\ No newline at end of file
pages/ucenter/login-page/common/loginPage.css
浏览文件 @ 948370a8
...@@ -27,10 +27,6 @@ page { ...@@ -27,10 +27,6 @@ page {
} }
.content { .content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
width: 630rpx;
flex-direction: column; flex-direction: column;
} }
......
pages/ucenter/login-page/common/loginSuccess.js
浏览文件 @ 948370a8
...@@ -12,14 +12,14 @@ export default function(result){ ...@@ -12,14 +12,14 @@ export default function(result){
var delta = 0//判断需要返回几层 var delta = 0//判断需要返回几层
let pages = getCurrentPages(); let pages = getCurrentPages();
console.log(pages); // console.log(pages);
pages.forEach((page,index)=>{ pages.forEach((page,index)=>{
console.log(pages[pages.length-index-1].route.split('/')[2]); // console.log(pages[pages.length-index-1].route.split('/')[2]);
pages[pages.length-index-1].route.split('/') pages[pages.length-index-1].route.split('/')
if(pages[pages.length-index-1].route.split('/')[2] == 'login-page'){ if(pages[pages.length-index-1].route.split('/')[2] == 'login-page'){
delta ++ delta ++
} }
}) })
console.log('判断需要返回几层',delta); // console.log('判断需要返回几层',delta);
uni.navigateBack({delta}) uni.navigateBack({delta})
} }
\ No newline at end of file
pages/ucenter/login-page/index/index copy.vue 0 → 100644
浏览文件 @ 948370a8
<template>
<view class="wrap">
<view class="wrap-content">
<view class="content">
<!-- 顶部文字 -->
<text class="content-top-title">登陆后即可展示自己</text>
<login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-forms ref="form" :value="formData" :rules="rules">
<uni-forms-item name="phone">
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false"
v-model="formData.phone" maxlength="11" placeholder="请输入手机号">
<!-- 当前仅支持中国大陆手机号 -->
<!-- <template slot="left">
<picker mode="selector" :range="phoneArea" @change="selectPhoneArea">
<text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text>
</picker>
</template> -->
</uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :type="canGetShortMsg?'primary':'default'"
@click="sendShortMsg">获取短信验证码</button>
</uni-forms>
<!-- tip -->
<text class="tip-text">未注册的手机号验证通过后将自动注册</text>
<!-- 其他登录方式 -->
<!-- <view class="auth-box" v-if="loginList.includes('password')">
<text class="login-text" hover-class="hover" @click="toPwdLogin">密码登录</text>
<text class="login-text" hover-class="hover" @click="openLoginList">其他登录方式</text>
</view> -->
</view>
</view>
<!-- 登录按钮弹窗 -->
<login-action-sheet ref="loginActionSheet"></login-action-sheet>
<uni-quick-login ref="uniQuickLogin"></uni-quick-login>
</view>
</template>
<script>
var univerify_first,currentWebview;//是否一键登陆优先
import baseappConfig from '@/baseapp.config.js';
import mixin from '../common/loginPage.mixin.js';
var currentPage;
export default {
mixins:[mixin],
data() {
return {
phoneArea: ['+86'],
currenPhoneArea: '+86',
// loginList:[]
}
},
onLoad(e) {
// this.loginList = baseappConfig.router.login
univerify_first = e.univerify_first
//#ifdef APP-PLUS
if(univerify_first){
const pages = getCurrentPages();
currentWebview = pages[pages.length - 1].$getAppWebview();
currentWebview.setStyle({
"top":"2000px"
})
}
//#endif
},
onReady() {
//#ifdef APP-PLUS
if(univerify_first){
console.log('开始一键登陆');
setTimeout(()=>{
this.$refs.uniQuickLogin.login('univerify')
},100)
setTimeout(() => {
currentWebview.setStyle({
titleNView:{
autoBackButton:true,
backgroundColor:"#FFFFFF"
}
})
currentWebview.setStyle({
"top":"0"
})
}, 1500);
}
//#endif
},
computed: {
canGetShortMsg() {
return this.isPhone;
}
},
methods: {
selectPhoneArea(event) {
uni.showToast({
title: '当前仅支持中国大陆手机号',
icon: 'none'
});
// this.currenPhoneArea = this.phoneArea[event.detail.value];
},
sendShortMsg() {
/**
* 发送验证吗
*/
uni.showLoading();
uni.navigateTo({
url: '../phone-code/phone-code?phoneNumber=' + this.formData.phone + '&phoneArea=' +
this.currenPhoneArea,
success: res => {},
fail: () => {},
complete: () => {}
});
},
/**
* 去密码登录页
*/
toPwdLogin() {
uni.navigateTo({
url: '../pwd-login/pwd-login'
})
},
openLoginList() {
this.$refs.loginActionSheet.open();
},
back() {
uni.navigateBack()
}
}
}
</script>
<style>
@import url("../common/loginPage.css");
.content-top-title {
text-align: center;
}
.login-iknow {
justify-content: center;
}
.phone-area {
/* #ifdef APP-NVUE */
border-right-width: 1rpx;
border-right-color: #d7d9d8;
/* #endif */
/* #ifndef APP-NVUE */
border-right: 1rpx solid #d7d9d8;
/* #endif */
}
</style>
pages/ucenter/login-page/index/index.vue
浏览文件 @ 948370a8
<template> <template>
<view class="wrap"> <view class="content">
<view class="wrap-content"> <!-- 顶部文字 -->
<view class="content"> <text class="title">登陆后即可展示自己</text>
<!-- 顶部文字 --> <uni-agreements></uni-agreements>
<text class="content-top-title">登陆后即可展示自己</text> <!-- 登录框 -->
<login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw> <input type="number" class="input-box" :inputBorder="false" v-model="phone" maxlength="11" placeholder="请输入手机号"/>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <button class="get-code" :class="{isPhone}" :disabled="!isPhone" :type="isPhone?'primary':'default'"
<uni-forms ref="form" :value="formData" :rules="rules"> @click="sendShortMsg">获取短信验证码</button>
<uni-forms-item name="phone"> <text class="tip">未注册的手机号验证通过后将自动注册</text>
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false"
v-model="formData.phone" maxlength="11" placeholder="请输入手机号">
<!-- 当前仅支持中国大陆手机号 -->
<!-- <template slot="left">
<picker mode="selector" :range="phoneArea" @change="selectPhoneArea">
<text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text>
</picker>
</template> -->
</uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :disabled="!canGetShortMsg" :type="canGetShortMsg?'primary':'default'"
@click="sendShortMsg">获取短信验证码</button>
</uni-forms>
<!-- tip -->
<text class="tip-text">未注册的手机号验证通过后将自动注册</text>
<!-- 其他登录方式 -->
<!-- <view class="auth-box" v-if="loginList.includes('password')">
<text class="login-text" hover-class="hover" @click="toPwdLogin">密码登录</text>
<text class="login-text" hover-class="hover" @click="openLoginList">其他登录方式</text>
</view> -->
</view>
</view>
<!-- 登录按钮弹窗 --> <!-- 登录按钮弹窗 -->
<login-action-sheet ref="loginActionSheet"></login-action-sheet>
<uni-quick-login ref="uniQuickLogin"></uni-quick-login> <uni-quick-login ref="uniQuickLogin"></uni-quick-login>
</view> </view>
</template> </template>
<script> <script>
var univerify_first,currentWebview;//是否一键登陆优先 var univerify_first,currentWebview;//是否一键登陆优先
import baseappConfig from '@/baseapp.config.js';
import mixin from '../common/loginPage.mixin.js';
var currentPage;
export default { export default {
mixins:[mixin],
data() { data() {
return { return {
phoneArea: ['+86'], phone:"17769516081"
currenPhoneArea: '+86',
// loginList:[]
} }
},
computed: {
isPhone(){
return /^1\d{10}$/.test(this.phone);
}
}, },
onLoad(e) { onLoad(e) {
// this.loginList = baseappConfig.router.login //是否优先启动一键登陆。即：页面一加载就启动一键登录
univerify_first = e.univerify_first univerify_first = e.univerify_first
//#ifdef APP-PLUS //#ifdef APP-PLUS
if(univerify_first){ if(univerify_first){
const pages = getCurrentPages(); const pages = getCurrentPages();
currentWebview = pages[pages.length - 1].$getAppWebview(); currentWebview = pages[pages.length - 1].$getAppWebview();
currentWebview.setStyle({ currentWebview.setStyle({
"top":"2000px" "top":"2000px" //隐藏当前页面窗体
}) })
} }
//#endif //#endif
...@@ -86,68 +60,27 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -86,68 +60,27 @@ import mixin from '../common/loginPage.mixin.js';
} }
//#endif //#endif
}, },
computed: {
canGetShortMsg() {
return this.isPhone;
}
},
methods: { methods: {
selectPhoneArea(event) { sendShortMsg() {
uni.showToast({ // 发送验证吗
title: '当前仅支持中国大陆手机号',
icon: 'none'
});
// this.currenPhoneArea = this.phoneArea[event.detail.value];
},
sendShortMsg() {
/**
* 发送验证吗
*/
uni.showLoading(); uni.showLoading();
uni.navigateTo({ uni.navigateTo({
url: '../phone-code/phone-code?phoneNumber=' + this.formData.phone + '&phoneArea=' + url: '/pages/ucenter/login-page/phone-code/phone-code?phoneNumber=' + this.phone,
this.currenPhoneArea, complete: () => {
success: res => {}, uni.hideLoading();
fail: () => {}, }
complete: () => {}
}); });
}, },
/** //去密码登录页
* 去密码登录页
*/
toPwdLogin() { toPwdLogin() {
uni.navigateTo({ uni.navigateTo({
url: '../pwd-login/pwd-login' url: '../pwd-login/pwd-login'
}) })
},
openLoginList() {
this.$refs.loginActionSheet.open();
},
back() {
uni.navigateBack()
} }
} }
} }
</script> </script>
<style> <style lang="scss">
@import url("../common/loginPage.css"); @import url("../common/login-page.css");
.content-top-title {
text-align: center;
}
.login-iknow {
justify-content: center;
}
.phone-area {
/* #ifdef APP-NVUE */
border-right-width: 1rpx;
border-right-color: #d7d9d8;
/* #endif */
/* #ifndef APP-NVUE */
border-right: 1rpx solid #d7d9d8;
/* #endif */
}
</style> </style>
pages/ucenter/login-page/phone-code/phone-code.vue
浏览文件 @ 948370a8
<template> <template>
<view class="wrap"> <view class="content">
<view class="wrap-content"> <!-- 顶部文字 -->
<view class="content"> <text class="tit">请输入验证码</text>
<!-- 顶部文字 --> <text class="tip">{{tipText}}</text>
<text class="content-top-title">请输入验证码</text> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<login-ikonw class="login-iknow" :text="tipText"></login-ikonw> <uni-easyinput type="number" class="easyinput" :inputBorder="false"
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> v-model="code" maxlength="6" placeholder="请输入验证码">
<uni-forms ref="form" :value="formData" :rules="rules"> <template slot="right">
<uni-forms-item name="phone"> <send-sms-code :phone="phone" ref="sendSmsCode"></send-sms-code>
<!-- <uni-easyinput type="number" class="phone-input-box" :inputBorder="false" </template>
v-model="formData.phone" maxlength="11" placeholder="请输入手机号码"> </uni-easyinput>
</uni-easyinput> --> <button class="send-btn" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false" @click="submit">登录</button>
v-model="formData.code" maxlength="6" placeholder="请输入验证码"> </uni-forms>
<template slot="right"> <uni-quick-login></uni-quick-login>
<send-sms-code :phone="formData.phone" ref="shortCode"></send-sms-code>
</template>
</uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
@click="submit">登录</button>
</uni-forms>
</view>
</view>
<uni-quick-login></uni-quick-login>
</view> </view>
</template> </template>
<script>
<script> import mixin from '../common/login-page.mixin.js';
import mixin from '../common/loginPage.mixin.js'; export default {
export default {
mixins:[mixin], mixins:[mixin],
data() { data() {
return { return {
currenPhoneArea: '', code:'',
phone:''
} }
}, },
computed: { computed: {
tipText() { tipText() {
return `验证码已通过短信发送至${this.currenPhoneArea} ${this.formData.phone}。`; return `验证码已通过短信发送至${this.phone}。`;
}, },
canSubmit() { canSubmit(){
return this.isPhone && this.isCode; return this.code.length==6;
} }
}, },
onLoad({phoneNumber,phoneArea}) { onLoad({phoneNumber,phoneArea}) {
this.formData.phone = phoneNumber; this.phone = phoneNumber||'17769516081';
this.currenPhoneArea = '+' + Number(phoneArea);
}, },
onReady() { onReady() {
this.$refs.shortCode.start(); this.$refs.sendSmsCode.start();
}, },
methods: { methods: {
/** submit(){ //完成并提交
* 完成并提交 this.request('user-center/loginBySms',
*/ {
submit(){ "mobile":this.phone,
uniCloud.callFunction({//联网验证登陆 "code":this.code
"name": "user-center", },
"data": { e=>{
"action": "loginBySms", console.log(e);
"params":{ this.loginSuccess(e)
"mobile":this.formData.phone, }
"code":this.formData.code )
}
},
success:async (e) => {
uni.hideLoading()
console.log(e.result);
if(e.result.code === 0){
this.loginSuccess(e.result)
}else{
uni.showModal({
title: '错误',
content: e.result.msg,
showCancel: false,
confirmText: '知道了',
});
}
},
fail: (err) => {
console.log(err);
uni.showModal({
title: '错误',
content: JSON.stringify(err),
showCancel: false,
confirmText: '知道了',
});
if(err.errCode===30002){
}
},
complete: () => {
uni.hideLoading()
}
})
} }
} }
} }
</script> </script>
<style> <style>
@import url("../common/loginPage.css"); @import url("../common/login-page.css");
.phone-input-box{
margin-top: 10px;
}
</style> </style>
pages/ucenter/login-page/pwd-login/pwd-login copy.vue 0 → 100644
浏览文件 @ 948370a8
<template>
<view class="wrap">
<view class="wrap-content">
<view class="content">
<!-- 顶部文字 -->
<text class="content-top-title">用户名密码登录</text>
<login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<uni-forms ref="form" :value="formData" :rules="rules">
<uni-forms-item name="phone">
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false"
v-model="formData.phone" maxlength="11" placeholder="请输入手机号/用户名">
<template slot="left">
<!-- 当前仅支持中国大陆手机号 -->
<!-- <picker mode="selector" :range="phoneArea" @change="selectPhoneArea"> -->
<text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text>
<!-- </picker> -->
</template>
</uni-easyinput>
</uni-forms-item>
<uni-forms-item name="pwd">
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false"
v-model="formData.pwd" placeholder="请输入密码"></uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :disabled="!canLogin" :type="canLogin?'primary':'default'"
@click="pwdLogin">登录</button>
</uni-forms>
<!-- 忘记密码 -->
<view class="auth-box">
<text class="login-text" @click="toRetrievePwd">忘记密码</text>
<text class="login-text" @click="toRegister">注册账号</text>
</view>
</view>
</view>
<uni-quick-login ref="uniQuickLogin"></uni-quick-login>
</view>
</template>
<script>
import mixin from '../common/loginPage.mixin.js';
export default {
mixins:[mixin],
data() {
return {
phoneArea: ['+86'],
currenPhoneArea: '+86',
}
},
computed: {
canLogin() {
return this.formData.phone.length && this.isPwd;
}
},
methods: {
/**
* 页面跳转，找回密码
*/
toRetrievePwd() {
// if (!this.isPhone) return uni.showToast({
// title: '请输入正确的手机号',
// icon: 'none'
// });
uni.navigateTo({
url: '../pwd-retrieve/pwd-retrieve?phoneNumber=' + (this.isPhone?this.formData.phone:'') + '&phoneArea=' + this.currenPhoneArea
})
},
/**
* 密码登录
*/
pwdLogin() {
// 下边是可以登录
uniCloud.callFunction({
name:"user-center",
"data":{
"action":"login",
"params":{
"username":this.formData.phone,
"password":this.formData.pwd
}
},
success:async (e) => {
uni.hideLoading()
console.log(e.result);
if(e.result.code === 0){
this.loginSuccess(e.result)
}else{
uni.showModal({
title: '错误',
content: e.result.msg,
showCancel: false,
confirmText: '知道了',
});
}
},
fail: (err) => {
console.log(err);
uni.showModal({
title: '错误',
content: JSON.stringify(err),
showCancel: false,
confirmText: '知道了',
});
if(err.errCode===30002){
}
},
complete: () => {
uni.hideLoading()
}
})
},
selectPhoneArea(event) {
uni.showToast({
title: '当前仅支持中国大陆手机号',
icon: 'none'
});
// this.currenPhoneArea = this.phoneArea[event.detail.value];
},
/* 前往注册 */
toRegister(e){
console.log(e);
uni.navigateTo({
url:'/pages/ucenter/login-page/register/register'
})
}
}
}
</script>
<style>
@import url("../common/loginPage.css");
.phone-input-box {
margin-top: 20rpx;
}
.auth-box {
justify-content: space-between;
margin-top: 20px;
}
.login-text-sub {
color: #8a8f8b;
}
.toRegister{
margin-top: 80px;
width: 600rpx;
}
</style>
pages/ucenter/login-page/pwd-login/pwd-login.vue
浏览文件 @ 948370a8
<template> <template>
<view class="wrap"> <view class="content">
<view class="wrap-content"> <!-- 顶部文字 -->
<view class="content"> <text class="title">用户名密码登录</text>
<!-- 顶部文字 --> <uni-agreements></uni-agreements>
<text class="content-top-title">用户名密码登录</text> <input type="number" class="input-box" :inputBorder="false" v-model="username" maxlength="11" placeholder="请输入手机号/用户名"></input>
<login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw> <input type="password" class="input-box" :inputBorder="false" v-model="password" placeholder="请输入密码"></input>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <button class="send-btn" :disabled="!canLogin" :type="canLogin?'primary':'default'" @click="pwdLogin">登录</button>
<uni-forms ref="form" :value="formData" :rules="rules"> <!-- 忘记密码 -->
<uni-forms-item name="phone"> <view class="auth-box">
<uni-easyinput type="number" class="phone-input-box" :inputBorder="false" <text class="link" @click="toRetrievePwd">忘记密码</text>
v-model="formData.phone" maxlength="11" placeholder="请输入手机号/用户名"> <text class="link" @click="toRegister">注册账号</text>
<template slot="left"> </view>
<!-- 当前仅支持中国大陆手机号 --> <uni-quick-login ref="uniQuickLogin"></uni-quick-login>
<!-- <picker mode="selector" :range="phoneArea" @change="selectPhoneArea"> -->
<text class="phone-area" @click="selectPhoneArea">{{currenPhoneArea}}</text>
<!-- </picker> -->
</template>
</uni-easyinput>
</uni-forms-item>
<uni-forms-item name="pwd">
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false"
v-model="formData.pwd" placeholder="请输入密码"></uni-easyinput>
</uni-forms-item>
<button class="send-btn-box" :disabled="!canLogin" :type="canLogin?'primary':'default'"
@click="pwdLogin">登录</button>
</uni-forms>
<!-- 忘记密码 -->
<view class="auth-box">
<text class="login-text" @click="toRetrievePwd">忘记密码</text>
<text class="login-text" @click="toRegister">注册账号</text>
</view>
</view>
</view>
<uni-quick-login ref="uniQuickLogin"></uni-quick-login>
</view> </view>
</template> </template>
<script> <script>
import mixin from '../common/loginPage.mixin.js'; import mixin from '../common/login-page.mixin.js';
export default { export default {
mixins:[mixin], mixins:[mixin],
data() { data() {
return { return {
phoneArea: ['+86'], "password":"",
currenPhoneArea: '+86', "username":""
} }
}, },
computed: { computed: {
canLogin() { canLogin() {
return this.formData.phone.length && this.isPwd; return this.username.length && this.isPwd;
} },
isPwd(){
return /^.{6,20}$/.test(this.password);
},
isPhone(){
return /^1\d{10}$/.test(this.phone);
},
}, },
methods: { methods: {
/** // 页面跳转，找回密码
* 页面跳转，找回密码
*/
toRetrievePwd() { toRetrievePwd() {
// if (!this.isPhone) return uni.showToast({
// title: '请输入正确的手机号',
// icon: 'none'
// });
uni.navigateTo({ uni.navigateTo({
url: '../pwd-retrieve/pwd-retrieve?phoneNumber=' + (this.isPhone?this.formData.phone:'') + '&phoneArea=' + this.currenPhoneArea url: '../pwd-retrieve/pwd-retrieve?phoneNumber=' + (this.isPhone?this.username:'') + '&phoneArea=' + this.currenPhoneArea
}) })
}, },
/** /**
* 密码登录 * 密码登录
*/ */
pwdLogin() { pwdLogin() {
// 下边是可以登录 // 下边是可以登录
uniCloud.callFunction({ this.request('user-center/login',
name:"user-center", {
"data":{ "username":this.username,
"action":"login", "password":this.password
"params":{ },result=>{
"username":this.formData.phone, console.log(result);
"password":this.formData.pwd if(result.code === 0){
} this.loginSuccess(result)
}, }else{
success:async (e) => { uni.showModal({
uni.hideLoading() title: '错误',
console.log(e.result); content: result.msg,
if(e.result.code === 0){ showCancel: false,
this.loginSuccess(e.result) confirmText: '知道了'
}else{ });
uni.showModal({ }
title: '错误', }
content: e.result.msg, )
showCancel: false,
confirmText: '知道了',
});
}
},
fail: (err) => {
console.log(err);
uni.showModal({
title: '错误',
content: JSON.stringify(err),
showCancel: false,
confirmText: '知道了',
});
if(err.errCode===30002){
}
},
complete: () => {
uni.hideLoading()
}
})
},
selectPhoneArea(event) {
uni.showToast({
title: '当前仅支持中国大陆手机号',
icon: 'none'
});
// this.currenPhoneArea = this.phoneArea[event.detail.value];
}, },
/* 前往注册 */ /* 前往注册 */
toRegister(e){ toRegister(e){
...@@ -128,14 +79,15 @@ ...@@ -128,14 +79,15 @@
</script> </script>
<style> <style>
@import url("../common/loginPage.css"); @import url("../common/login-page.css");
.phone-input-box { .auth-box {
margin-top: 20rpx; flex-direction: row;
}
.auth-box {
justify-content: space-between; justify-content: space-between;
margin-top: 20px; margin-top: 20px;
} }
.auth-box .link{
font-size: 26rpx;
}
.login-text-sub { .login-text-sub {
color: #8a8f8b; color: #8a8f8b;
} }
......
pages/ucenter/login-page/pwd-retrieve/pwd-retrieve.vue
浏览文件 @ 948370a8
<template> <template>
<view class="wrap"> <view class="content">
<view class="wrap-content"> <!-- 顶部文字 -->
<view class="content"> <text class="title">重置密码</text>
<!-- 顶部文字 --> <login-ikonw v-show="isPhone" class="login-iknow" :text="tipText"></login-ikonw>
<text class="content-top-title">重置密码</text> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<login-ikonw v-show="isPhone" class="login-iknow" :text="tipText"></login-ikonw> <uni-forms ref="form" :value="formData" :rules="rules">
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <uni-forms-item name="phone">
<uni-forms ref="form" :value="formData" :rules="rules"> <!-- focus规则如果上一页携带来“手机号码”数据就focus验证码输入框，否则focus手机号码输入框 -->
<uni-forms-item name="phone"> <uni-easyinput :focus="!formData.phone.length" type="number" class="easyinput" :inputBorder="false"
<!-- focus规则如果上一页携带来“手机号码”数据就focus验证码输入框，否则focus手机号码输入框 --> v-model="formData.phone" maxlength="11" placeholder="请输入手机号"></uni-easyinput>
<uni-easyinput :focus="!formData.phone.length" type="number" class="phone-input-box" :inputBorder="false" </uni-forms-item>
v-model="formData.phone" maxlength="11" placeholder="请输入手机号"></uni-easyinput> <uni-forms-item name="code">
</uni-forms-item> <uni-easyinput :focus="formData.phone.length!=0" type="number" class="easyinput" :inputBorder="false"
<uni-forms-item name="code"> v-model="formData.code" maxlength="6" placeholder="请输入验证码">
<uni-easyinput :focus="formData.phone.length" type="number" class="phone-input-box" :inputBorder="false" <template slot="right">
v-model="formData.code" maxlength="6" placeholder="请输入验证码"> <send-sms-code ref="shortCode" :phone="formData.phone"></send-sms-code>
<template slot="right"> </template>
<send-sms-code ref="shortCode" :phone="formData.phone"></send-sms-code> </uni-easyinput>
</template> </uni-forms-item>
</uni-easyinput> <uni-forms-item name="pwd">
</uni-forms-item> <uni-easyinput type="password" class="easyinput" :inputBorder="false"
<uni-forms-item name="pwd"> v-model="formData.pwd" placeholder="请输入新密码"></uni-easyinput>
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false" </uni-forms-item>
v-model="formData.pwd" placeholder="请输入新密码"></uni-easyinput> <uni-forms-item name="pwd2">
</uni-forms-item> <uni-easyinput type="password" class="easyinput" :inputBorder="false"
<uni-forms-item name="pwd2"> v-model="formData.pwd2" placeholder="请确认新密码"></uni-easyinput>
<uni-easyinput type="password" class="phone-input-box" :inputBorder="false" </uni-forms-item>
v-model="formData.pwd2" placeholder="请确认新密码"></uni-easyinput> <button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'"
</uni-forms-item> @click="submit">完成</button>
<button class="send-btn-box" :disabled="!canSubmit" :type="canSubmit?'primary':'default'" </uni-forms>
@click="submit">完成</button>
</uni-forms>
</view>
</view>
</view> </view>
</template> </template>
...@@ -42,21 +38,34 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -42,21 +38,34 @@ import mixin from '../common/loginPage.mixin.js';
mixins:[mixin], mixins:[mixin],
data() { data() {
return { return {
currenPhoneArea: ''
} }
}, },
computed: { computed: {
tipText() { tipText() {
return `验证码已通过短信发送至${this.currenPhoneArea} ${this.formData.phone}。密码为6 - 20位` return `验证码已通过短信发送至${this.formData.phone}。密码为6 - 20位`
}, },
canSubmit() { canSubmit() {
return this.isPhone && this.isPwd && this.isCode; return this.isPhone && this.isPwd && this.isCode;
},
isPhone(){
let reg_phone = /^1\d{10}$/;
let isPhone = reg_phone.test(this.formData.phone);
return isPhone;
},
isPwd(){
let reg_pwd = /^.{6,20}$/;
let isPwd = reg_pwd.test(this.formData.pwd);
return isPwd;
},
isCode(){
let reg_code = /^\d{6}$/;
let isCode = reg_code.test(this.formData.code);
return isCode;
} }
}, },
onLoad(event) { onLoad(event) {
if (event && event.phoneNumber) { if (event && event.phoneNumber) {
this.formData.phone = event.phoneNumber; this.formData.phone = event.phoneNumber;
this.currenPhoneArea = '+' + Number(event.phoneArea);
} }
}, },
onReady() { onReady() {
...@@ -75,7 +84,7 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -75,7 +84,7 @@ import mixin from '../common/loginPage.mixin.js';
"mobile":this.formData.phone, "mobile":this.formData.phone,
"code":this.formData.code, "code":this.formData.code,
"password":this.formData.pwd "password":this.formData.pwd
},(data,result)=>{ },result=>{
console.log(result); console.log(result);
uni.showToast({ uni.showToast({
title: result.msg, title: result.msg,
...@@ -92,7 +101,7 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -92,7 +101,7 @@ import mixin from '../common/loginPage.mixin.js';
</script> </script>
<style> <style>
@import url("../common/loginPage.css"); @import url("../common/login-page.css");
.content-top-title{ .content-top-title{
margin-bottom: 6px; margin-bottom: 6px;
} }
......
pages/ucenter/login-page/register/register.vue
浏览文件 @ 948370a8
...@@ -13,15 +13,15 @@ ...@@ -13,15 +13,15 @@
<uni-forms-item name="pwd2" v-model="formData.pwd2" required> <uni-forms-item name="pwd2" v-model="formData.pwd2" required>
<uni-easyinput :inputBorder="false" class="phone-input-box" placeholder="再次输入密码" type="password" v-model="formData.pwd2" trim="both" /> <uni-easyinput :inputBorder="false" class="phone-input-box" placeholder="再次输入密码" type="password" v-model="formData.pwd2" trim="both" />
</uni-forms-item> </uni-forms-item>
<login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw> <uni-agreements></uni-agreements>
<button class="send-btn-box" type="primary" @click="submit">注册并登陆</button> <button class="send-btn" type="primary" @click="submit">注册并登陆</button>
</uni-forms> </uni-forms>
</view> </view>
</template> </template>
<script> <script>
import rules from './validator.js'; import rules from './validator.js';
import mixin from '../common/loginPage.mixin.js'; import mixin from '../common/login-page.mixin.js';
export default { export default {
mixins:[mixin], mixins:[mixin],
data() { data() {
...@@ -56,7 +56,7 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -56,7 +56,7 @@ import mixin from '../common/loginPage.mixin.js';
}) })
}, },
submitForm(value) { submitForm(value) {
this.request('user-center/register',value,(data,result)=>{ this.request('user-center/register',value,result=>{
console.log(result); console.log(result);
if(result.code === 0){ if(result.code === 0){
this.loginSuccess(result) this.loginSuccess(result)
...@@ -71,8 +71,11 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -71,8 +71,11 @@ import mixin from '../common/loginPage.mixin.js';
@import url("../common/loginPage.css"); @import url("../common/loginPage.css");
.uni-container { .uni-container {
padding: 15px; padding: 15px;
}
.send-btn{
margin-top: 5px;
} }
/*
.uni-input-border, .uni-input-border,
.uni-textarea-border { .uni-textarea-border {
width: 100%; width: 100%;
...@@ -107,22 +110,5 @@ import mixin from '../common/loginPage.mixin.js'; ...@@ -107,22 +110,5 @@ import mixin from '../common/loginPage.mixin.js';
border-radius: 4px; border-radius: 4px;
line-height: 1; line-height: 1;
margin: 0; margin: 0;
} } */
.avatar-box {
width: 700rpx;
height: 200rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
.avatar-img {
width: 150rpx;
height: 150rpx;
border-radius: 75rpx;
border: #F8F8F8 solid 3px;
}
</style> </style>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或