2025-02-20 17:21:36 +08:00
|
|
|
|
<template>
|
2025-06-13 17:30:28 +08:00
|
|
|
|
<view class="backgroundContainer">
|
|
|
|
|
<image class="title-img" src="/static/logo.png" />
|
|
|
|
|
<view class="title-font">NU护理单元</view>
|
|
|
|
|
<view class="title-text">开满郁金花的家</view>
|
|
|
|
|
<view class="input-father">
|
|
|
|
|
<view class="add">+86</view>
|
|
|
|
|
<view class="shu"></view>
|
|
|
|
|
<input style="font-size: 27rpx;" type="number" v-model="form.phone" maxlength="11" placeholder="请输入手机号" />
|
|
|
|
|
</view>
|
|
|
|
|
<view class="input-father">
|
|
|
|
|
<input class="password" type="text" v-model="form.password" maxlength="10" placeholder="请输入密码" />
|
|
|
|
|
</view>
|
|
|
|
|
<view class="input-father-blue" @click="jumpTo(`/pages/index/index`)">
|
|
|
|
|
验证并登录
|
|
|
|
|
</view>
|
|
|
|
|
<view class="under-container-title">
|
|
|
|
|
<view :class="isTarget ? 'radio-circle-target' : 'radio-circle'" @click="isTarget = !isTarget"></view>
|
|
|
|
|
<view style="margin-left: 17rpx;" class="radio-circle-font" @click="isTarget = !isTarget">我已阅读并同意</view>
|
|
|
|
|
<view class="radio-circle-blue" @click="showPopup=true">
|
|
|
|
|
《用户协议》
|
|
|
|
|
</view>
|
|
|
|
|
<view class="radio-circle-blue" @click="showPopup=true">
|
|
|
|
|
《隐私政策》
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<!-- 弹出层 -->
|
|
|
|
|
<view v-if="showPopup" class="popup-wrapper">
|
|
|
|
|
<view class="mask" @click="closePopup"></view>
|
|
|
|
|
<view class="box">
|
|
|
|
|
<view class="box-title">
|
|
|
|
|
服务条款和隐私保护提示
|
|
|
|
|
</view>
|
|
|
|
|
<view class="font-father">
|
|
|
|
|
<view class="">
|
|
|
|
|
欢迎使用护理单元app!
|
|
|
|
|
</view>
|
|
|
|
|
<view style="text-indent: 2em;">
|
|
|
|
|
我们将通过<text class="text-blue">《用户协议》</text>和<text class="text-blue">《隐私政策》</text>,帮助您了解我们为您提供的服务、我们如何处理个人信息以及您享有的权利。我们会严格按照相关法律法规要求,采取各种安全措施来保护您的个人信息。
|
|
|
|
|
</view>
|
|
|
|
|
<view style="margin: 30rpx 0;">
|
|
|
|
|
点击“同意”按钮,表示您已知情并同意以上协议和以下约定。
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- <button class="btn" @click="closePopup">关闭</button>
|
|
|
|
|
<button class="btn btn-confirm" @click="onConfirm">确定</button> -->
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<!-- 自动更新组件 -->
|
|
|
|
|
<zy-update ref="zyupgrade" :noticeflag="true" theme="blue" :h5preview="false" oldversion="1.0.0"
|
|
|
|
|
:appstoreflag="true" :autocheckupdate="true"></zy-update>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</template>
|
|
|
|
|
|
2025-06-13 17:30:28 +08:00
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick, reactive } from 'vue';
|
|
|
|
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
|
|
|
|
import ZyUpdate from '@/component/zy-upgrade/zy-upgrade.vue'
|
|
|
|
|
const zyupgrade = ref(null);
|
|
|
|
|
const isTarget = ref(false);
|
|
|
|
|
|
|
|
|
|
const form = reactive({
|
|
|
|
|
phone: "",
|
|
|
|
|
password: ""
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const showPopup = ref(false)
|
|
|
|
|
|
|
|
|
|
function closePopup() {
|
|
|
|
|
showPopup.value = false
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function onConfirm() {
|
|
|
|
|
uni.showToast({ title: '已确认', icon: 'success' })
|
|
|
|
|
closePopup()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function isLength11(str) {
|
|
|
|
|
return typeof str === 'string' && str.length === 11;
|
|
|
|
|
}
|
|
|
|
|
const jumpTo = (url : string) => {
|
|
|
|
|
if (!form.password || !form.phone) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: "请完善信息",
|
|
|
|
|
icon: 'error',
|
|
|
|
|
duration: 2000
|
|
|
|
|
})
|
|
|
|
|
} else if (isLength11(form.phone)) {
|
|
|
|
|
uni.showToast({
|
|
|
|
|
title: "手机号不足11位",
|
|
|
|
|
icon: 'error',
|
|
|
|
|
duration: 2000
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
url: url
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 生命周期钩子
|
|
|
|
|
onLoad(() => {
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 生命周期钩子
|
|
|
|
|
onShow(() => {
|
|
|
|
|
zyupgrade.value?.check_update()
|
|
|
|
|
});
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</script>
|
|
|
|
|
|
2025-06-13 17:30:28 +08:00
|
|
|
|
<style scoped lang="less">
|
|
|
|
|
.backgroundContainer {
|
|
|
|
|
display: flex;
|
|
|
|
|
position: relative;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100vh;
|
|
|
|
|
background: url("/static/index/lightbgcnew.png") center/cover, rgba(255, 255, 255, 0.6);
|
|
|
|
|
background-blend-mode: screen;
|
|
|
|
|
background-size: cover;
|
|
|
|
|
background-position: center center;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
|
|
.title-img {
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
height: 100rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title-font {
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
font-size: 34rpx;
|
|
|
|
|
color: #333333;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title-text {
|
|
|
|
|
margin-left: 3rpx;
|
|
|
|
|
margin-top: 5rpx;
|
|
|
|
|
font-size: 23rpx;
|
|
|
|
|
color: #777777;
|
|
|
|
|
letter-spacing: 5rpx;
|
|
|
|
|
margin-bottom: 80rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.input-father {
|
|
|
|
|
height: 90rpx;
|
|
|
|
|
width: 550rpx;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.input-father-blue {
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
height: 90rpx;
|
|
|
|
|
width: 550rpx;
|
|
|
|
|
background: linear-gradient(to right, #00C9FF, #0076FF);
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.under-container-title {
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-top: 80rpx;
|
|
|
|
|
// margin-bottom: 40rpx;
|
|
|
|
|
align-items: center;
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
|
|
|
|
.radio-circle-blue {
|
|
|
|
|
color: #0083FF;
|
|
|
|
|
margin-top: 3rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.radio-circle-font {
|
|
|
|
|
color: #5A607F;
|
|
|
|
|
// margin-left: 18rpx;
|
|
|
|
|
margin-top: 3rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.radio-circle {
|
|
|
|
|
position: relative;
|
|
|
|
|
margin-top: 2rpx;
|
|
|
|
|
width: 40rpx;
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
border: 2rpx solid #C0C5D9;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.radio-circle-target {
|
|
|
|
|
position: relative;
|
|
|
|
|
margin-top: 2rpx;
|
|
|
|
|
width: 40rpx;
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
border: 2rpx solid #C0C5D9;
|
|
|
|
|
background-color: transparent;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.radio-circle-target::after {
|
|
|
|
|
content: "";
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
height: 30rpx;
|
|
|
|
|
background-color: #00C9FF;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.add {
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shu {
|
|
|
|
|
background-color: #d2d5d7;
|
|
|
|
|
width: 2rpx;
|
|
|
|
|
height: 35rpx;
|
|
|
|
|
margin: 0 20rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.password {
|
|
|
|
|
font-size: 27rpx;
|
|
|
|
|
margin-left: 30rpx;
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.popup-wrapper {
|
|
|
|
|
position: fixed;
|
|
|
|
|
inset: 0;
|
|
|
|
|
z-index: 1000;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.mask {
|
|
|
|
|
position: absolute;
|
|
|
|
|
inset: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.box {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 50%;
|
|
|
|
|
left: 50%;
|
|
|
|
|
transform: translate(-50%, -50%);
|
|
|
|
|
width: 800rpx;
|
|
|
|
|
height: 1000rpx;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding: 0 65rpx;
|
|
|
|
|
|
|
|
|
|
.box-title {
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
margin: 60rpx 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.font-father {
|
|
|
|
|
line-height: 50rpx;
|
|
|
|
|
}
|
|
|
|
|
.text-blue{
|
|
|
|
|
color: #0083FF;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|