|
|
@@ -1,43 +1,44 @@
|
|
|
<template>
|
|
|
<view class="normal-login-container">
|
|
|
- <view class="wave-container">
|
|
|
- <image
|
|
|
- src="/static/login 13780@1x.png"
|
|
|
- mode="widthFix"
|
|
|
- class="wave-img"
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
+ <image
|
|
|
+ src="/static/login13785@1x.png"
|
|
|
+ mode="widthFix"
|
|
|
+ class="wave-img"
|
|
|
+ ></image>
|
|
|
|
|
|
<view class="logo-content">
|
|
|
<image :src="imagePath" mode="aspectFit" class="logo-image"></image>
|
|
|
<text class="title">金邻助家</text>
|
|
|
</view>
|
|
|
|
|
|
- <image src="/static/13779@1x.png" mode="widthFix" class="house-illustration"></image>
|
|
|
+ <image
|
|
|
+ src="/static/13779@1x.png"
|
|
|
+ mode="widthFix"
|
|
|
+ class="house-illustration"
|
|
|
+ ></image>
|
|
|
|
|
|
<view class="slogan-content">
|
|
|
<text class="slogan-text">着力打造全国居家服务行业标准</text>
|
|
|
<text class="slogan-text">和建立综合信用评价体系</text>
|
|
|
</view>
|
|
|
|
|
|
- <view class="actions-container">
|
|
|
- <up-button
|
|
|
- custom-style="{ 'background-color': '#623F34', 'color': '#FFFFFF', 'border-radius': '25px', 'height': '50px', 'line-height': '50px', 'fontSize': '18px' }"
|
|
|
- class="login-button" @click="handleLogin">微信授权登录</up-button>
|
|
|
+ <!-- <view class="actions-container">
|
|
|
+ <up-button @click="handleLogin" :customStyle="WeChat"
|
|
|
+ >微信授权登录</up-button
|
|
|
+ >
|
|
|
<view class="xieyi text-center">
|
|
|
<up-checkbox
|
|
|
- label="我已认真阅读、理解并同意"
|
|
|
- name="agree"
|
|
|
- usedAlone
|
|
|
- v-model:checked="checkboxValue"
|
|
|
- class="text-grey1"
|
|
|
- >
|
|
|
- </up-checkbox>
|
|
|
- <!-- <text class="text-grey1">我已认真阅读、理解并同意</text> -->
|
|
|
+ label="我已认真阅读、理解并同意"
|
|
|
+ name="agree"
|
|
|
+ usedAlone
|
|
|
+ v-model:checked="checkboxValue"
|
|
|
+ class="text-grey1"
|
|
|
+ >
|
|
|
+ </up-checkbox>
|
|
|
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
|
|
|
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -70,6 +71,20 @@ const handleUserRegister = () => {
|
|
|
router.push('/pages/register') // 替换为实际的路由跳转逻辑
|
|
|
}
|
|
|
|
|
|
+const WeChat = {
|
|
|
+ width: '280rpx',
|
|
|
+ height: '96rpx',
|
|
|
+ opacity: 1,
|
|
|
+ background: '#0E0404',
|
|
|
+ color: '#FFFFFF',
|
|
|
+ borderRadius: '48rpx',
|
|
|
+ fontWeight: '500',
|
|
|
+ fontSize: '32rpx',
|
|
|
+ marginLeft: '48rpx',
|
|
|
+ marginRight: '422rpx',
|
|
|
+ marginBottom: '32rpx',
|
|
|
+}
|
|
|
+
|
|
|
// 隐私协议
|
|
|
const handlePrivacy = () => {
|
|
|
uni.navigateTo({
|
|
|
@@ -86,15 +101,15 @@ const handleUserAgrement = () => {
|
|
|
|
|
|
// 登录方法
|
|
|
const handleLogin = async () => {
|
|
|
- console.log('checkboxValue',checkboxValue);
|
|
|
-
|
|
|
- if(!checkboxValue.value){
|
|
|
+ console.log('checkboxValue', checkboxValue)
|
|
|
+
|
|
|
+ if (!checkboxValue.value) {
|
|
|
uni.showToast({
|
|
|
title: '请先阅读并同意相关协议',
|
|
|
icon: 'none',
|
|
|
})
|
|
|
|
|
|
- return;
|
|
|
+ return
|
|
|
}
|
|
|
uni.showLoading({
|
|
|
title: '登录中，请耐心等待...',
|
|
|
@@ -173,128 +188,91 @@ onMounted(() => {
|
|
|
backgroundColor: 'rgba(0,0,0,0)',
|
|
|
animation: {
|
|
|
duration: 0,
|
|
|
- timingFunc: 'easeIn'
|
|
|
- }
|
|
|
+ timingFunc: 'easeIn',
|
|
|
+ },
|
|
|
})
|
|
|
})
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.wave-container{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- z-index: 0;
|
|
|
- .wave-img{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- }
|
|
|
-}
|
|
|
-.radio-view{
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-.radio-active {
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
.normal-login-container {
|
|
|
- width: 100%;
|
|
|
- min-height: 100vh;
|
|
|
+ // border: 2px solid red;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 1624rpx;
|
|
|
+ // width: 100vw;
|
|
|
+ // height: 100vh;
|
|
|
+ border-radius: 48rpx;
|
|
|
+ background: linear-gradient(156deg, #f5c954 -4%, #f66c44 110%);
|
|
|
position: relative;
|
|
|
+ .wave-img {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ }
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
- overflow: hidden;
|
|
|
- padding-top: var(--status-bar-height);
|
|
|
- box-sizing: border-box;
|
|
|
}
|
|
|
|
|
|
.logo-content {
|
|
|
- margin-top: calc(100rpx + var(--status-bar-height));
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
- position: relative;
|
|
|
- z-index: 1;
|
|
|
-
|
|
|
.logo-image {
|
|
|
- width: 90rpx;
|
|
|
- height: 90rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
+ width: 90px;
|
|
|
+ height: 78px;
|
|
|
+ margin-top: 47rpx;
|
|
|
+ margin-bottom: -10rpx;
|
|
|
+ margin-right: 300rpx;
|
|
|
+ margin-left: 300rpx;
|
|
|
}
|
|
|
-
|
|
|
.title {
|
|
|
- font-family: PingFang SC;
|
|
|
- font-size: 38rpx;
|
|
|
+ width: 184rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ font-family: Poppins;
|
|
|
+ font-size: 46rpx;
|
|
|
font-weight: 600;
|
|
|
- line-height: 38rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ letter-spacing: normal;
|
|
|
color: #ffffff;
|
|
|
- text-align: center;
|
|
|
- text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
|
|
|
+ z-index: 1;
|
|
|
+ margin-top: 0;
|
|
|
+ margin-bottom: 77rpx;
|
|
|
+ margin-right: 300rpx;
|
|
|
+ margin-left: 300rpx;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.house-illustration {
|
|
|
- width: 560rpx;
|
|
|
- margin-top: 60rpx;
|
|
|
- margin-bottom: 40rpx;
|
|
|
- position: relative;
|
|
|
- z-index: 1;
|
|
|
+ width: 720rpx;
|
|
|
+ height: 334rpx;
|
|
|
+ margin-top: 0;
|
|
|
+ margin-bottom: 148rpx;
|
|
|
+ margin-right: 136rpx;
|
|
|
+ margin-left: 136rpx;
|
|
|
}
|
|
|
|
|
|
.slogan-content {
|
|
|
- text-align: center;
|
|
|
- position: relative;
|
|
|
+ margin-top: 0;
|
|
|
+ margin-bottom: 148rpx;
|
|
|
+ margin-right: 300rpx;
|
|
|
+ margin-left: 300rpx;
|
|
|
z-index: 1;
|
|
|
-
|
|
|
.slogan-text {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #593931;
|
|
|
- line-height: 38rpx;
|
|
|
- display: block;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.actions-container {
|
|
|
- width: 100%;
|
|
|
- padding: 0 40rpx;
|
|
|
- position: absolute;
|
|
|
- bottom: 80rpx;
|
|
|
- left: 0;
|
|
|
- z-index: 1;
|
|
|
-
|
|
|
- .login-button {
|
|
|
- width: 100%;
|
|
|
- height: 88rpx;
|
|
|
- line-height: 88rpx;
|
|
|
- border-radius: 44rpx !important;
|
|
|
- background-color: #623f34 !important;
|
|
|
- color: #ffffff !important;
|
|
|
- font-size: 32rpx !important;
|
|
|
- font-weight: 400;
|
|
|
- }
|
|
|
-
|
|
|
- .xieyi {
|
|
|
- margin-top: 24rpx;
|
|
|
- text-align: center;
|
|
|
display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
+ flex-direction: column;
|
|
|
align-items: center;
|
|
|
- justify-content: center;
|
|
|
- .text-grey1 {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333333;
|
|
|
- }
|
|
|
-
|
|
|
- .text-blue {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #1a88ff;
|
|
|
- margin: 0 4rpx;
|
|
|
- }
|
|
|
+ width: 448rpx;
|
|
|
+ height: 104rpx;
|
|
|
+ font-family: Poppins;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ line-height: 52rpx;
|
|
|
+ text-align: center;
|
|
|
+ letter-spacing: normal;
|
|
|
+ color: #824727;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
</style>
|
jiayubo
