Skip to content

杨炀 / ztx_wx_gzt

Go to a project
Toggle navigation
Toggle navigation pinning
639e5f51 by 张猛
Options

开票

1 parent 05dfbe51
Inline Side-by-side
Showing 1 changed file with 125 additions and 108 deletions
login/loginC.vue
......@@ -12,35 +12,35 @@
<view class="loginbox">
<view class="loginNav">
<!-- 激活背景：全屏宽 -->
<image
v-if="isActive === 0"
:src="config.baseUrl_api+'/fs/static/lg/tab01.png'"
<image
v-if="isActive === 0"
:src="config.baseUrl_api+'/fs/static/lg/tab01.png'"
class="tab-active"
/>
<image
v-if="isActive === 1"
:src="config.baseUrl_api+'/fs/static/lg/tab02.png'"
<image
v-if="isActive === 1"
:src="config.baseUrl_api+'/fs/static/lg/tab02.png'"
class="tab-active"
/>
<!-- 未激活：小图、顶部10rpx、边距10rpx -->
<image
v-if="isActive === 1"
:src="config.baseUrl_api+'/fs/static/lg/tab01_dwn.png'"
<image
v-if="isActive === 1"
:src="config.baseUrl_api+'/fs/static/lg/tab01_dwn.png'"
class="tab-inactive-left"
/>
<image
v-if="isActive === 0"
:src="config.baseUrl_api+'/fs/static/lg/tab02_dwn.png'"
<image
v-if="isActive === 0"
:src="config.baseUrl_api+'/fs/static/lg/tab02_dwn.png'"
class="tab-inactive-right"
/>
<!-- 文字层：居中、不平均分配 -->
<view class="tab-text-wrap">
<view class="text-item text-left" :class="{active:isActive===0}" @click="changeActive(0)">
<view :class="{active:isActive===0}" class="text-item text-left" @click="changeActive(0)">
密码登录
</view>
<view class="text-item text-right" :class="{active:isActive===1}" @click="changeActive(1)">
<view :class="{active:isActive===1}" class="text-item text-right" @click="changeActive(1)">
短信登录
</view>
</view>
......@@ -62,7 +62,7 @@
<view class="round-input-item">
<image :src="config.baseUrl_api+'/fs/static/lg/tag03.png'" class="icon"></image>
<uni-easyinput v-model="form.code" :styles="inputstyle" placeholder="请填入计算结果"/>
<image :src="codeUrl" @click="getCode" class="code-img"/>
<image :src="codeUrl" class="code-img" @click="getCode"/>
</view>
</form>
<!-- 短信登录 -->
......@@ -74,7 +74,7 @@
<view class="round-input-item">
<image :src="config.baseUrl_api+'/fs/static/lg/tag03.png'" class="icon"></image>
<uni-easyinput v-model="form2.captcha" :styles="inputstyle" placeholder="图形验证码"/>
<image :src="codeUrl" @click="getCode" class="code-img"/>
<image :src="codeUrl" class="code-img" @click="getCode"/>
</view>
<view class="round-input-item">
<image :src="config.baseUrl_api+'/fs/static/lg/tag02.png'" class="icon"></image>
......@@ -91,8 +91,8 @@
<button class="btn btn-register" @click="goRegister">注册</button>
<button class="btn btn-login" @click="login">登录</button>
</view>
<view class="text-center mt20 f26" >仅供中国跆拳道协会会员单位登录使用</view>
<view class="text-center mt20 f26">仅供中国跆拳道协会会员单位登录使用</view>
</view>
<!-- <view class="wNumber">
技术服务热线：
......@@ -104,27 +104,37 @@
</view>
<view class="fixedagree">
<!-- <text>仅供中国跆拳道协会会员单位登录使用</text> -->
<view class="wNumber">
技术服务热线：
<text @click="call('15606190026')">15606190026</text>
/
<text @click="call('15305299762')">15305299762</text>
</view>
<view class="wNumber">
技术服务热线：
<text @click="call('15606190026')">15606190026</text>
/
<text @click="call('15305299762')">15305299762</text>
</view>
</view>
<!-- 注册提示弹框 -->
<uni-popup ref="registerPopup" type="center" :mask-click="false">
<uni-popup ref="registerPopup" :mask-click="false" type="center">
<view class="register-popup">
<view class="popup-title">系统提示</view>
<view class="popup-content">
<view class="popup-text">尊敬的用户，您好！</view>
<view class="popup-text">在开始注册团体会员前，请您提前准备好以下材料，以便顺利完成申请：</view>
<view class="popup-item"><text class="popup-num ml10">1.</text>单位营业执照</view>
<view class="popup-item">
<text class="popup-num ml10">1.</text>
单位营业执照
</view>
<view class="popup-desc">请提供清晰的营业执照原件照片或扫描件（加盖公章更佳）</view>
<view class="popup-item"><text class="popup-tip">! </text><text class="popup-num"> 2.</text>法人身份证正反面照片</view>
<view class="popup-item">
<text class="popup-tip">!</text>
<text class="popup-num"> 2.</text>
法人身份证正反面照片
</view>
<view class="popup-desc">请分别上传身份证正面及反面清晰照片</view>
<view class="popup-desc">确保信息完整、无遮挡、无模糊</view>
<view class="popup-item"><text class="popup-num ml10">3.</text>机构照片</view>
<view class="popup-item">
<text class="popup-num ml10">3.</text>
机构照片
</view>
<view class="popup-desc">请提供体现单位实际经营或办公环境的照片1-2张</view>
<view class="popup-desc">如门头、办公场所、活动场地等（能展示机构真实存在即可）</view>
</view>
......@@ -138,10 +148,10 @@
</template>
<script setup>
import { onLoad, onReady } from '@dcloudio/uni-app';
import { ref, nextTick } from 'vue'
import {onLoad, onReady} from '@dcloudio/uni-app';
import {ref, nextTick} from 'vue'
import config from '@/config.js'
import { getCodeImg, getSmsCodeImg, pcLogin, loginByPhone } from '@/common/login.js'
import {getCodeImg, getSmsCodeImg, pcLogin, loginByPhone} from '@/common/login.js'
const isActive = ref(0)
const agree = ref(false)
......@@ -197,37 +207,37 @@ function changeActive(n) {
function login() {
if (isActive.value == 0) {
if (!form.value.username) {
uni.showToast({ title: '账号不能为空', icon: 'none' })
uni.showToast({title: '账号不能为空', icon: 'none'})
return
}
if (!form.value.password) {
uni.showToast({ title: '密码不能为空', icon: 'none' })
uni.showToast({title: '密码不能为空', icon: 'none'})
return
}
if (!form.value.code) {
uni.showToast({ title: '验证码不能为空', icon: 'none' })
uni.showToast({title: '验证码不能为空', icon: 'none'})
return
}
if (loading.value) return;
loading.value = true
pcLogin(form.value).then((res) => {
app.globalData.isLogin = true
uni.redirectTo({ url: '/pages/index/home' })
uni.redirectTo({url: '/pages/index/home'})
}).finally(() => {
loading.value = false
})
} else if (isActive.value == 1) {
if (!form2.value.telNo) {
uni.showToast({ title: '手机号不能为空', icon: 'none' })
uni.showToast({title: '手机号不能为空', icon: 'none'})
return
}
var pattern = /^1[3456789]\d{9}$/;
if (!pattern.test(form2.value.telNo)) {
uni.showToast({ title: '请输入正确的手机号', duration: 2000, icon: 'none' })
uni.showToast({title: '请输入正确的手机号', duration: 2000, icon: 'none'})
return
}
if (!form2.value.code) {
uni.showToast({ title: '短信验证码不能为空', icon: 'none' })
uni.showToast({title: '短信验证码不能为空', icon: 'none'})
return
}
if (loading.value) return;
......@@ -236,7 +246,7 @@ function login() {
.then(() => {
loading.value = false
app.globalData.isLogin = true
uni.redirectTo({ url: '/pages/index/home' })
uni.redirectTo({url: '/pages/index/home'})
}).finally(() => {
loading.value = false
})
......@@ -257,7 +267,7 @@ function closeRegisterPopup() {
function confirmRegister() {
registerPopup.value.close()
uni.navigateTo({ url: '/login/register' })
uni.navigateTo({url: '/login/register'})
}
function getCode() {
......@@ -271,16 +281,16 @@ function getCode() {
function getCaptchaSms() {
if (!form2.value.telNo) {
uni.showToast({ title: '手机号不能为空', icon: 'none' })
uni.showToast({title: '手机号不能为空', icon: 'none'})
return
}
var pattern = /^1[3456789]\d{9}$/;
if (!pattern.test(form2.value.telNo)) {
uni.showToast({ title: '请输入正确的手机号', duration: 2000, icon: 'none' })
uni.showToast({title: '请输入正确的手机号', duration: 2000, icon: 'none'})
return
}
if (!form2.value.captcha) {
uni.showToast({ title: '图形验证码不能为空', icon: 'none' })
uni.showToast({title: '图形验证码不能为空', icon: 'none'})
return
}
......@@ -289,7 +299,7 @@ function getCaptchaSms() {
telNo: form2.value.telNo,
code: form2.value.captcha
}).then(res => {
uni.showToast({ title: res.data.msg, icon: 'none' })
uni.showToast({title: res.data.msg, icon: 'none'})
countDown.value.start = true
})
}
......@@ -301,7 +311,7 @@ function timeup() {
}
function call(num) {
uni.makePhoneCall({ phoneNumber: num })
uni.makePhoneCall({phoneNumber: num})
}
</script>
......@@ -355,7 +365,7 @@ function call(num) {
margin: 30rpx auto -53rpx;
position: relative;
overflow: visible;
// 选中：全屏宽
.tab-active {
position: absolute;
......@@ -365,73 +375,73 @@ function call(num) {
height: 100%;
z-index: 3;
}
// 未选中-左侧：顶部10rpx
.tab-inactive-left {
position: absolute;
position: absolute;
left: 10rpx;
top: 10rpx;
width: 300rpx;
height: 109rpx;
z-index: 2;
}
}
}
// 未选中-右侧：顶部10rpx + 右侧留10rpx边距
.tab-inactive-right {
position: absolute;
right: 10rpx;
top: 10rpx;
width: 300rpx;
height: 113rpx;
z-index: 2;
}
// 未选中-右侧：顶部10rpx + 右侧留10rpx边距
.tab-inactive-right {
position: absolute;
right: 10rpx;
top: 10rpx;
width: 300rpx;
height: 113rpx;
z-index: 2;
}
// 文字层：不flex平分，绝对定位居中
.tab-text-wrap {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 3;
pointer-events: none;
}
// 文字层：不flex平分，绝对定位居中
.tab-text-wrap {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 3;
pointer-events: none;
}
.text-item {
position: absolute;
top: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 32rpx;
color: #333;
pointer-events: auto;
}
.text-item {
position: absolute;
top: 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 32rpx;
color: #333;
pointer-events: auto;
}
// 密码登录：靠左区域居中
.text-left {
left: 0;
width: 30%;
height: 100rpx;
transform: translateX(15%);
}
// 密码登录：靠左区域居中
.text-left {
left: 0;
width: 30%;
height: 100rpx;
transform: translateX(15%);
}
// 短信登录：靠右区域居中
.text-right {
right: 0;
width: 30%;
height: 100rpx;
transform: translateX(-12%);
}
// 短信登录：靠右区域居中
.text-right {
right: 0;
width: 30%;
height: 100rpx;
transform: translateX(-12%);
}
// 选中文字颜色
.text-item.active {
color: #AD181F;
font-weight: 500;
width: 50%;
}
// 选中文字颜色
.text-item.active {
color: #AD181F;
font-weight: 500;
width: 50%;
}
/* ======================================================= */
......@@ -449,6 +459,7 @@ function call(num) {
justify-content: space-between;
margin: 30rpx 0;
font-size: 28rpx;
image {
width: 30rpx;
height: 30rpx;
......@@ -466,6 +477,7 @@ function call(num) {
text-align: center;
margin: 30rpx 0 0;
font-size: 30rpx;
.btn-red {
border-radius: 20rpx;
width: 600rpx;
......@@ -493,18 +505,18 @@ function call(num) {
border-bottom: 1rpx solid #eee;
background: transparent;
padding: 0;
.icon {
width: 40rpx;
height: 40rpx;
margin-right: 16rpx;
flex-shrink: 0;
}
uni-easyinput {
flex: 1;
}
// 图形验证码
.code-img {
width: 160rpx;
......@@ -512,7 +524,7 @@ function call(num) {
margin-left: 16rpx;
flex-shrink: 0;
}
text {
font-size: 28rpx;
color: #014A9F;
......@@ -529,6 +541,7 @@ function call(num) {
font-size: 24rpx;
width: 100vw;
justify-content: center;
image {
width: 40rpx;
height: 40rpx;
......@@ -637,8 +650,9 @@ function call(num) {
.btn-group {
display: flex;
justify-content: space-between;
gap: 60rpx;
gap: 20rpx;
margin-top: 50rpx;
.btn {
flex: 1;
height: 88rpx;
......@@ -647,17 +661,20 @@ function call(num) {
font-weight: 500;
border-radius: 20rpx;
border: none;
&::after {
border: none;
}
}
.btn-register {
background: #D4B87A;
color: #fff;
}
.btn-login {
background: #AD181F;
color: #fff;
}
}
</style>
\ No newline at end of file
</style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!