Skip to content

U
uni-starter

言程序plus / uni-starter
与 Fork 源项目一致

Fork自 DCloud / uni-starter

通知 1
Star 0
Fork 0
U
uni-starter
提交 85cf8673 编写于 作者: L linju
浏览文件
操作

213

上级 05a2bca1 4102167b
隐藏空白更改
内联 并排
Showing with 392 addition and 80 deletion
uni_modules/uni-login-page/common/loginPage.css 0 → 100644
浏览文件 @ 85cf8673
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
flex: 1;
height: 100%;
}
/* #endif */
.wrap {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
flex: 1;
width: 750rpx;
background-color: #fff;
}
.wrap-content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex: 1;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.content {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
width: 630rpx;
flex-direction: column;
}
.content-top-title {
font-size: 32rpx;
font-weight: 600;
padding-top: 50rpx;
}
.hidden,
page {
background-color: transparent;
}
.login-iknow {
padding-top: 24rpx;
padding-bottom: 48rpx;
}
.phone-input-box {
height: 85rpx;
background-color: #f9f9f9;
border-radius: 6rpx;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
}
.phone-area {
padding: 0 20rpx;
font-size: 30rpx;
}
.phone-input {
flex: 1;
border-left-width: 1px;
border-left-color: #d7d9d8;
padding: 0 20rpx;
font-size: 30rpx;
}
.tip-text {
padding-top: 20rpx;
padding-bottom: 36rpx;
color: #8a8f8b;
font-size: 26rpx;
}
.send-btn-box {
height: 85rpx;
background-color: #d8d8da;
margin-bottom: 50rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
width: 630rpx;
justify-content: center;
align-items: center;
border-radius: 6rpx;
}
.send-btn-text {
color: #fff;
}
.send-btn-active {
background-color: #007aff;
}
.auth-box {
width: 630rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.login-text {
color: #1c436e;
font-size: 26rpx;
}
.hover {
opacity: 0.8;
}
uni_modules/uni-login-page/components/login-action-sheet/login-action-sheet.vue
浏览文件 @ 85cf8673
<template> <template>
<uni-popup ref="actionSheet" type="bottom"> <uni-popup ref="actionSheet" type="bottom">
<view class="flex w-750 action-sheet-box bg-white"> <view class="action-sheet-box">
<view class="flex flex-row flex-nowrap align-center justify-center auth-item" @click="clickItem(item)" <view class="auth-wrap auth-item" @click="clickItem(item)"
hover-class="hover" v-for="(item, index) in providerList" :key="index"> hover-class="hover" v-for="(item, index) in providerList" :key="index">
<image :src="item.image" class="login-logo"></image> <image :src="item.image" class="login-logo"></image>
<text class="px-1 font-28">{{providerName[item.value]}}</text> <text class="auth-text">{{providerName[item.value]}}</text>
</view> </view>
<view class="cancel-line"></view> <view class="cancel-line"></view>
<view class="flex flex-row flex-nowrap align-center justify-center cancel-item" @click="clickItem(item)"> <view class="auth-wrap cancel-item" @click="clickItem(item)">
<text class="font-28">取消</text> <text class="auth-text">取消</text>
</view> </view>
</view> </view>
</uni-popup> </uni-popup>
...@@ -88,19 +88,32 @@ ...@@ -88,19 +88,32 @@
} }
</script> </script>
<style> <style scoped>
@import url("../../common/myStyle.css");
.action-sheet-box { .action-sheet-box {
border-top-left-radius: 20rpx; border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx; border-top-right-radius: 20rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
width: 750rpx;
background-color: #fff;
} }
.login-logo { .login-logo {
width: 42rpx; width: 42rpx;
height: 42rpx; height: 42rpx;
} }
.auth-wrap{
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
}
.auth-item { .auth-item {
border-bottom-width: 1px; border-bottom-width: 1px;
border-bottom-color: #F1F1F1; border-bottom-color: #F1F1F1;
...@@ -115,5 +128,9 @@ ...@@ -115,5 +128,9 @@
width: 750rpx; width: 750rpx;
height: 10rpx; height: 10rpx;
background-color: #F1F1F1; background-color: #F1F1F1;
}
.auth-text{
padding: 0 10rpx;
font-size: 28rpx;
} }
</style> </style>
uni_modules/uni-login-page/components/login-ikonw/login-ikonw.vue
浏览文件 @ 85cf8673
<template> <template>
<view class="flex flex-row flex-wrap"> <view class="login-iknow-wrap">
<text class="text-sub font-26" v-for="(t, i) in innerText" :key="i" :class="t.to?'link-color':''" <text class="text-sub" v-for="(t, i) in innerText" :key="i" :class="t.to?'link-color':''"
@click="clickLink(t)">{{t.text || t}}</text> @click="clickLink(t)">{{t.text || t}}</text>
</view> </view>
</template> </template>
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
}, },
link: { link: {
type: Array, type: Array,
default: [] default: ()=>[]
} }
}, },
data() { data() {
...@@ -69,9 +69,18 @@ ...@@ -69,9 +69,18 @@
} }
</script> </script>
<style> <style scoped>
@import url("../../common/myStyle.css"); .login-iknow-wrap{
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
flex-wrap: wrap;
}
.text-sub{
color: #8a8f8b;
font-size: 26rpx;
}
.link-color { .link-color {
color: #04498c; color: #04498c;
} }
......
uni_modules/uni-login-page/components/login-short-code/login-short-code.vue
浏览文件 @ 85cf8673
<template> <template>
<view class="flex justify-center align-center short-code-btn" hover-class="hover" @click="clickBtn"> <view class="short-code-btn" hover-class="hover" @click="clickBtn">
<text class="font-28">{{innerText}}</text> <text class="inner-text" :class="reverseNumber==0?'inner-text-active':''">{{innerText}}</text>
</view> </view>
</template> </template>
...@@ -70,11 +70,20 @@ ...@@ -70,11 +70,20 @@
} }
</script> </script>
<style> <style scoped>
@import url("../../common/myStyle.css");
.short-code-btn { .short-code-btn {
width: 200rpx; width: 200rpx;
height: 85rpx; height: 85rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
.inner-text{
font-size: 28rpx;
}
.inner-text-active{
color: #007aff;
} }
</style> </style>
uni_modules/uni-login-page/pages/index/index.vue
浏览文件 @ 85cf8673
...@@ -5,14 +5,14 @@ ...@@ -5,14 +5,14 @@
<view class="content"> <view class="content">
<!-- 顶部文字 --> <!-- 顶部文字 -->
<text class="content-top-title">登陆后即可展示自己</text> <text class="content-top-title">登陆后即可展示自己</text>
<login-ikonw class="lgnin-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw> <login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<view class="phone-input-box"> <view class="phone-input-box">
<picker mode="selector" :range="phoneArea" @change="selectPhoneArea"> <picker mode="selector" :range="phoneArea" @change="selectPhoneArea">
<text class="phone-area">{{currenPhoneArea}}</text> <text class="phone-area">{{currenPhoneArea}}</text>
</picker> </picker>
<input type="number" class="phone-input" placeholder="请输入手机号" <input type="number" class="phone-input" maxlength="11" placeholder="请输入手机号"
v-model="phoneNumber" /> v-model="phoneNumber" />
</view> </view>
...@@ -95,6 +95,7 @@ ...@@ -95,6 +95,7 @@
</script> </script>
<style> <style>
<<<<<<< HEAD
page { page {
background: transparent; background: transparent;
} }
...@@ -131,11 +132,13 @@ ...@@ -131,11 +132,13 @@
width: 630rpx; width: 630rpx;
flex-direction: column; flex-direction: column;
} }
=======
@import url("../../common/loginPage.css");
>>>>>>> 4102167b2d3d22ebf4994a07a5b8421d8539345c
.content-top-title{ .content-top-title{
font-size: 32rpx; text-align: center;
font-weight: 600;
padding-top: 50rpx;
} }
<<<<<<< HEAD
@import url("../../common/myStyle.css"); @import url("../../common/myStyle.css");
.lgnin-iknow { .lgnin-iknow {
...@@ -150,59 +153,9 @@ ...@@ -150,59 +153,9 @@
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
=======
.login-iknow{
>>>>>>> 4102167b2d3d22ebf4994a07a5b8421d8539345c
justify-content: center; justify-content: center;
}
.phone-area{
padding: 0 20rpx;
font-size: 30rpx;
}
.phone-input {
border-left-width: 1px;
border-left-color: #d7d9d8;
padding: 0 20rpx;
font-size: 30rpx;
}
.tip-text {
padding-top: 20rpx;
padding-bottom: 36rpx;
color: #8a8f8b;
font-size: 26rpx;
}
.send-btn-box {
height: 85rpx;
background-color: #d8d8da;
margin-bottom: 50rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
width: 630rpx;
justify-content: center;
align-items: center;
border-radius: 6rpx;
}
.send-btn-text{
color: #fff;
}
.send-btn-active {
background-color: #007aff;
}
.auth-box{
width: 630rpx;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.login-text {
color: #1c436e;
font-size: 26rpx;
} }
</style> </style>
\ No newline at end of file
uni_modules/uni-login-page/pages/index/pwd-login.nvue → uni_modules/uni-login-page/pages/index/pwd-login.vue
浏览文件 @ 85cf8673
<template> <template>
<view class="flex flex-column flex-1 w-750 bg-white"> <view class="wrap">
<view class="flex-1 flex flex-column justify-start align-center"> <view class="wrap-content">
<view class="w-630 flex flex-column"> <view class="content">
<!-- 顶部文字 --> <!-- 顶部文字 -->
<text class="font-32 font-blod pt-5">手机号密码登录</text> <text class="content-top-title">手机号密码登录</text>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<view class="phone-input-box round flex flex-row flex-nowrap align-center justify-center mt-5"> <view class="phone-input-box">
<picker mode="selector" :range="phoneArea" @change="selectPhoneArea"> <picker mode="selector" :range="phoneArea" @change="selectPhoneArea">
<text class="px-2 font-30">{{currenPhoneArea}}</text> <text class="phone-area">{{currenPhoneArea}}</text>
</picker> </picker>
<input type="number" class="flex-1 phone-input px-2 font-30" placeholder="请输入手机号" <input type="number" class="phone-input" placeholder="请输入手机号" maxlength="11" v-model="phoneNumber" />
v-model="phoneNumber" />
</view> </view>
<view class="phone-input-box round flex flex-row flex-nowrap align-center justify-center mt-2"> <view class="phone-input-box">
<input type="password" :password="true" class="flex-1 px-2 font-30" placeholder="请输入密码" <input type="password" :password="true" class="phone-input pwd-input" placeholder="请输入密码"
v-model="password" /> v-model="password" />
</view> </view>
<login-ikonw class="lgnin-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw> <login-ikonw class="login-iknow" :link="link" text="登录即表示同意用户协议和隐私政策"></login-ikonw>
<!-- 发送按钮 --> <!-- 发送按钮 -->
<view class="send-btn-box flex w-630 justify-center align-center round" hover-class="hover" <view class="send-btn-box" hover-class="hover"
@click="pwdLogin" :class="canLogin?'send-btn-active':''"> @click="pwdLogin" :class="canLogin?'send-btn-active':''">
<text class="text-white">登录</text> <text class="send-btn-text">登录</text>
</view> </view>
<!-- 忘记密码 --> <!-- 忘记密码 -->
<view class="flex flex-row flex-nowrap"> <view class="auth-box">
<text class="font-26 text-sub">忘记了?</text> <text class="login-text login-text-sub">忘记了?</text>
<text class="font-26 login-text" @click="toRetrievePwd">找回密码</text> <text class="login-text" @click="toRetrievePwd">找回密码</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -95,39 +94,14 @@ ...@@ -95,39 +94,14 @@
</script> </script>
<style> <style>
@import url("../../common/myStyle.css"); @import url("../../common/loginPage.css");
.phone-input-box{
.lgnin-iknow { margin-top: 20rpx;
padding-top: 24rpx; }
padding-bottom: 36rpx; .auth-box{
} justify-content: flex-start;
}
.phone-input-box { .login-text-sub{
height: 85rpx; color: #8a8f8b;
background-color: #f9f9f9;
}
.phone-input {
border-left-width: 1px;
border-left-color: #d7d9d8;
}
.tip-text {
padding-top: 20rpx;
padding-bottom: 36rpx;
}
.send-btn-box {
height: 85rpx;
background-color: #d8d8da;
margin-bottom: 50rpx;
}
.send-btn-active {
background-color: #007aff;
}
.login-text {
color: #1c436e;
} }
</style> </style>
uni_modules/uni-login-page/pages/index/pwd-retrieve.nvue → uni_modules/uni-login-page/pages/index/pwd-retrieve.vue
浏览文件 @ 85cf8673
<template> <template>
<view class="flex flex-column flex-1 w-750 bg-white"> <view class="wrap">
<view class="flex-1 flex flex-column justify-start align-center"> <view class="wrap-content">
<view class="w-630 flex flex-column"> <view class="content">
<!-- 顶部文字 --> <!-- 顶部文字 -->
<text class="font-32 font-blod pt-5">手机号密码登录</text> <text class="content-top-title">手机号密码登录</text>
<login-ikonw class="lgnin-iknow" :text="tipText"></login-ikonw> <login-ikonw class="login-iknow" :text="tipText"></login-ikonw>
<!-- 登录框 (选择手机号所属国家和地区需要另行实现) --> <!-- 登录框 (选择手机号所属国家和地区需要另行实现) -->
<view class="phone-input-box round flex flex-row flex-nowrap align-center justify-center"> <view class="phone-input-box">
<input type="number" :maxlength="6" class="flex-1 phone-input px-2 font-30" placeholder="请输入验证码" <input type="number" :maxlength="6" class="phone-input" placeholder="请输入验证码"
v-model="phoneCode" /> v-model="phoneCode" />
<login-short-code @getCode="getCode"></login-short-code> <login-short-code @getCode="getCode"></login-short-code>
</view> </view>
<view class="phone-input-box round flex flex-row flex-nowrap align-center justify-center mt-2"> <view class="phone-input-box">
<input type="password" :password="true" class="flex-1 px-2 font-30" placeholder="请输入密码" <input type="password" :password="true" class="phone-input" placeholder="请输入密码"
v-model="password" /> v-model="password" />
</view> </view>
<!-- 发送按钮 --> <!-- 发送按钮 -->
<view class="send-btn-box flex w-630 justify-center align-center round mt-5" hover-class="hover" <view class="send-btn-box" hover-class="hover"
@click="pwdLogin" :class="canSubmit?'send-btn-active':''"> @click="submit" :class="canSubmit?'send-btn-active':''">
<text class="text-white">完成</text> <text class="send-btn-text">完成</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -69,42 +69,26 @@ ...@@ -69,42 +69,26 @@
}); });
// 发送成功后开启倒计时 // 发送成功后开启倒计时
done(); done();
},
/**
* 完成并提交
*/
submit(){
} }
} }
} }
</script> </script>
<style> <style>
@import url("../../common/myStyle.css"); @import url("../../common/loginPage.css");
.phone-input-box{
.lgnin-iknow { margin-top: 20rpx;
padding-top: 24rpx; }
padding-bottom: 36rpx; .phone-input{
} border-left-width: 0;
}
.phone-input-box { .send-btn-box{
height: 85rpx; margin-top: 50rpx;
background-color: #f9f9f9;
}
.phone-input {}
.tip-text {
padding-top: 20rpx;
padding-bottom: 36rpx;
}
.send-btn-box {
height: 85rpx;
background-color: #d8d8da;
margin-bottom: 50rpx;
}
.send-btn-active {
background-color: #007aff;
}
.login-text {
color: #1c436e;
} }
</style> </style>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或