zhouyanli/property-resident-side
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增用户隐私协议

Browse Source
This commit is contained in:
zhouyanli
2026-04-28 08:50:00 +08:00
parent 5936da5547
commit d02af4a8b4
5 changed files with 199 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
property-uniapp-project/pageSubPack/loginSub/login.vue
View File

@@ -49,20 +49,22 @@
</view>
<!-- 协议勾选 -->
<view class="agreement-item" @click="toggleAgreement">
<uni-icons
type="checkbox-filled"
size="24"
color="#007aff"
v-if="agreeAgreement"
></uni-icons>
<uni-icons
type="checkbox"
size="24"
color="#999"
v-else
></uni-icons>
<text class="agreement-text">我已阅读并同意《用户隐私政策》</text>
<view class="agreement-item" >
<view @click="toggleAgreement">
<uni-icons
type="checkbox-filled"
size="24"
color="#007aff"
v-if="agreeAgreement"
></uni-icons>
<uni-icons
type="checkbox"
size="24"
color="#999"
v-else
></uni-icons>
</view>
<text class="agreement-text" @click.stop="goToPrivacy">我已阅读并同意<text class="agreePrivacy" :class="{active:isClicked}">《用户隐私政策》</text></text>
</view>
<!-- 登录按钮 -->
@@ -98,6 +100,8 @@ const agreeAgreement = ref(false); // 默认勾选
const countDown = ref(0);
// 定时器
let timer = null;
// 控制点击变色
const isClicked = ref(false)
// ========== 计算属性 ==========
// 是否可以获取验证码（手机号格式正确）
@@ -124,6 +128,14 @@ const checkForm = () => {
const toggleAgreement = () => {
agreeAgreement.value = !agreeAgreement.value;
};
// 跳转隐私协议
const goToPrivacy = () => {
// 点击变色
isClicked.value = true
uni.navigateTo({
url:'/pageSubPack/loginSub/privacy',
})
}
// 获取验证码
const getVerifyCode = () => {
@@ -167,7 +179,7 @@ const getVerifyCode = () => {
// 登录处理
const handleLogin = () => {
if (!canLogin.value) return;
uni.showLoading({ title: '登录中...', mask: true });
// uni.showLoading({ title: '登录中...', mask: true });
let params = {
phone:phoneNumber.value,
smsCode:'123456',
@@ -327,7 +339,12 @@ onUnmounted(() => {
color: #666;
margin-left: 10rpx;
}
.agreePrivacy{
color: #666;
}
.agreePrivacy.active{
color: #2F77FD;
}
/* 登录按钮 */
.login-btn {
width: 100%;

52
property-uniapp-project/pageSubPack/loginSub/pwd-login.vue
View File

@@ -29,20 +29,25 @@
<!-- 协议勾选 + 忘记密码 -->
<view class="agreement-wrap">
<view class="agreement-item" @click="toggleAgreement">
<uni-icons
type="checkbox-filled"
size="24"
color="#007aff"
v-if="agreeAgreement"
></uni-icons>
<uni-icons
type="checkbox"
size="24"
color="#999"
v-else
></uni-icons>
<text class="agreement-text">我已阅读并同意《用户隐私政策》</text>
<view class="agreement-item">
<view @click="toggleAgreement">
<uni-icons
type="checkbox-filled"
size="24"
color="#007aff"
v-if="agreeAgreement"
></uni-icons>
<uni-icons
type="checkbox"
size="24"
color="#999"
v-else
></uni-icons>
</view>
<text class="agreement-text" @click.stop="goToPrivacy">我已阅读并同意
<text class="agreePrivacy" :class="{ active:isClicked }">《用户隐私政策》</text>
</text>
</view>
<navigator class="forget-pwd" url="/pageSubPack/loginSub/forget-pwd">忘记密码？</navigator>
</view>
@@ -74,6 +79,8 @@ const phoneNumber = ref('');
const password = ref('');
const agreeAgreement = ref(false); // 默认勾选
const placeholderStyle = ref('font-size:24rpx')
// 控制点击变色
const isClicked = ref(false)
// 计算属性：是否可登录（帐号+密码+协议都满足）
const canLogin = computed(() => {
@@ -87,6 +94,15 @@ const toggleAgreement = () => {
agreeAgreement.value = !agreeAgreement.value;
};
// 跳转隐私协议
const goToPrivacy = () => {
// 点击变色
isClicked.value = true
uni.navigateTo({
url:'/pageSubPack/loginSub/privacy',
})
}
// 检查表单
const checkForm = () => {};
@@ -113,7 +129,7 @@ const handleLogin = () => {
uni.showToast({ title: '请勾选协议', icon: 'none' });
return;
}
uni.showLoading({ title: '登录中...', mask: true });
// uni.showLoading({ title: '登录中...', mask: true });
let params = {
username:phoneNumber.value,
password:password.value
@@ -220,6 +236,12 @@ const handleLogin = () => {
color: #666;
margin-left: 10rpx;
}
.agreePrivacy{
color: #666;
}
.agreePrivacy.active{
color: #2F77FD;
}
.forget-pwd {
font-size: 28rpx;

189
property-uniapp-project/pageSubPack/visitor/visitor-add.vue
View File

@@ -1,11 +1,5 @@
<template>
<view class="visitor-invite">
<!-- 顶部导航 -->
<!-- <view class="nav-bar">
<uni-icons type="left" size="20" color="#000" @click="navigateBack"></uni-icons>
<view class="nav-title">访客邀请</view>
</view> -->
<!-- 标签切换：车辆来访/人员来访 -->
<view class="tab-wrap">
<view
@@ -27,8 +21,8 @@
<!-- 表单区域 -->
<view class="form-wrap">
<!-- 房屋信息 -->
<view class="section-title">房屋信息</view>
<view class="form-section">
<view class="section-title">房屋信息</view>
<view class="form-item">
<view class="label">
<text class="required">*</text>来访地址
@@ -41,8 +35,9 @@
</view>
<!-- 访客信息 -->
<view class="section-title">访客信息</view>
<view class="form-section">
<view class="section-title">访客信息</view>
<view class="form-item">
<view class="label">访客姓名</view>
<input
@@ -103,14 +98,15 @@
</view>
<!-- 有效期 -->
<view class="section-title">有效期</view>
<view class="form-section">
<view class="section-title">有效期</view>
<view class="form-item">
<view class="label">
<text class="required">*</text>来访时间
</view>
<view class="value">
<uni-datetime-picker type="datetime" v-model="visitTime" @change="changeLog" :border="false"/>
<uni-datetime-picker type="datetime" v-model="form.visitTime" @change="handleTimeChange('visit')" :border="false"/>
</view>
</view>
<view class="form-item">
@@ -118,11 +114,11 @@
<text class="required">*</text>离开时间
</view>
<view class="value">
<uni-datetime-picker type="datetime" v-model="leaveTime" @change="changeLog" :border="false"/>
<uni-datetime-picker type="datetime" v-model="form.leaveTime" @change="handleTimeChange('leave')" :border="false"/>
</view>
</view>
<view class="tips">预计来访时间和预计离开时间间隔不能超过24小时</view>
<view class="tips">车辆停留请勿超出有效期，需及时驶出小区</view>
<view class="tips-2">车辆停留请勿超出有效期，需及时驶出小区</view>
</view>
</view>
@@ -176,31 +172,30 @@
</view>
</view>
</uni-popup>
</view>
</template>
<script setup>
import { ref, reactive} from 'vue';
import{onLoad } from "@dcloudio/uni-app"
import moment from 'moment';
// 标签激活状态
const activeTab = ref('car');
// 表单数据
// 表单数据（完全保留原有默认值）
const form = reactive({
address: '桂花园（别墅）2号楼2层', // 来访地址默认值
name: '', // 访客姓名
gender: '男', // 性别默认值
phone: '', // 联系方式
carNumber: ['', '', '', '', '', '', ''], // 车牌号（7位）
peopleNum: '', // 随行人数
visitTime: '', // 来访时间默认值
leaveTime: '' // 离开时间
address: '',
name: '',
gender: '',
phone: '',
carNumber: ['', '', '', '', '', '', ''],
peopleNum: '',
visitTime: '',
leaveTime: ''
});
// 地址列表（模拟数据）
// 地址列表（原数据不变）
const addressList = ref([
'桂花园（别墅）1号楼1层',
'桂花园（别墅）2号楼2层'
@@ -209,31 +204,23 @@ const addressList = ref([
// 性别列表
const genderList = ref(['男', '女']);
// 弹窗/选择器实例
// 弹窗实例
const addressModalRef = ref(null);
const genderModalRef = ref(null);
const timePickerRef = ref(null);
// 标记当前选择的是来访/离开时间
const currentTimeType = ref('');
// 页面初始化
onLoad(() => {
// 可在这里请求接口获取地址/默认时间等数据
// 用moment设置默认时间，格式与原逻辑一致
// const now = moment();
// form.visitTime = now.format('YYYY-MM-DD HH:mm');
// 默认离开时间为1小时后
// form.leaveTime = now.clone().add(1, 'hours').format('YYYY-MM-DD HH:mm');
});
// 切换tab
const switchTab = (tab) => {
activeTab.value = tab;
// 切换Tab后重置表单
resetForm();
// nextTick(() =>{
// })
};
// 返回上一页
const navigateBack = () => {
uni.navigateBack();
};
// 打开地址弹窗
@@ -263,32 +250,69 @@ const selectGender = (item) => {
genderModalRef.value.close();
};
// 打开时间选择器
// const openTimePicker = (type) => {
// currentTimeType.value = type;
// timePickerRef.value.open();
// };
// 校验来访/离开时间间隔
const checkTimeInterval = () => {
// 用moment处理时间
const handleTimeChange = (type) => {
if (!form.visitTime || !form.leaveTime) return;
const visitTime = new Date(form.visitTime).getTime();
const leaveTime = new Date(form.leaveTime).getTime();
const diffHours = (leaveTime - visitTime) / (1000 * 60 * 60);
const visitMoment = moment(form.visitTime);
const leaveMoment = moment(form.leaveTime);
// 校验1：离开时间不能早于来访时间
if (leaveMoment.isBefore(visitMoment)) {
uni.showToast({
title: '离开时间不能早于来访时间',
icon: 'none'
});
form.leaveTime = visitMoment.clone().add(1, 'hours').format('YYYY-MM-DD HH:mm');
return;
}
// 校验2：间隔不超过24小时
const diffHours = leaveMoment.diff(visitMoment, 'hours', true);
if (diffHours > 24) {
uni.showToast({
title: '时间间隔不能超过24小时',
icon: 'none'
});
form.leaveTime = '';
form.leaveTime = visitMoment.clone().add(24, 'hours').format('YYYY-MM-DD HH:mm');
}
};
// 表单提交
// 提交前时间校验
const checkTimeInterval = () => {
if (!form.visitTime) {
uni.showToast({ title: '请选择来访时间', icon: 'none' });
return false;
}
if (!form.leaveTime) {
uni.showToast({ title: '请选择离开时间', icon: 'none' });
return false;
}
const visitMoment = moment(form.visitTime);
const leaveMoment = moment(form.leaveTime);
if (!visitMoment.isValid() || !leaveMoment.isValid()) {
uni.showToast({ title: '时间格式错误，请重新选择', icon: 'none' });
return false;
}
if (leaveMoment.isBefore(visitMoment)) {
uni.showToast({ title: '离开时间不能早于来访时间', icon: 'none' });
return false;
}
const diffHours = leaveMoment.diff(visitMoment, 'hours', true);
if (diffHours > 24) {
uni.showToast({ title: '时间间隔不能超过24小时', icon: 'none' });
return false;
}
return true;
};
// 表单提交（仅替换时间校验逻辑，其余完全不变）
const submitForm = () => {
// 必填项校验
if (!form.phone) {
uni.showToast({ title: '请输入访客联系方式', icon: 'none' });
return;
@@ -297,7 +321,7 @@ const submitForm = () => {
uni.showToast({ title: '请输入正确的手机号', icon: 'none' });
return;
}
if (activeTab === 'car' && form.carNumber.join('').length < 8) {
if (activeTab === 'car' && form.carNumber.join('').length < 7) {
uni.showToast({ title: '请填写完整车牌号', icon: 'none' });
return;
}
@@ -309,10 +333,10 @@ const submitForm = () => {
uni.showToast({ title: '请选择离开时间', icon: 'none' });
return;
}
checkTimeInterval();
if (!form.leaveTime) return; // 时间校验失败则终止提交
// 时间校验
if (!checkTimeInterval()) return;
// 提交逻辑（替换为实际接口请求）
uni.showLoading({ title: '提交中...' });
setTimeout(() => {
uni.hideLoading();
@@ -321,22 +345,22 @@ const submitForm = () => {
icon: 'success'
});
}, 1000);
};
// 重置表单
const resetForm = () => {
form.address = '';
form.name = '';
form.gender = '';
form.phone = '';
form.carNumber = '';
form.escortNum = '';
form.visitTime = '';
form.leaveTime = '';
form.carNumber = ['', '', '', '', '', '', '']; // 重置车牌号输入
};
// 重置表单
const resetForm = () => {
form.address = '';
form.name = '';
form.gender = '';
form.phone = '';
form.carNumber = ['', '', '', '', '', '', ''];
form.peopleNum = '';
form.visitTime = '';
form.leaveTime = '';
};
</script>
<style scoped>
.visitor-invite {
background-color: #f5f5f5;
@@ -385,22 +409,23 @@ const submitForm = () => {
padding: 20rpx 40rpx;
}
.section-title {
font-size: 32rpx;
font-size: 28rpx;
font-weight: 500;
margin-bottom: 20rpx;
/* margin-bottom: 20rpx; */
margin: 30rpx 40rpx 10rpx;
}
.form-item {
display: flex;
align-items: center;
padding: 20rpx 0;
padding: 30rpx 0;
border-bottom: 1rpx solid #f0f0f0;
}
.form-item:last-child {
border-bottom: none;
}
.label {
width: 200rpx;
font-size: 30rpx;
width: 205rpx;
font-size: 32rpx;
color: #333;
}
.required {
@@ -440,13 +465,19 @@ const submitForm = () => {
.tips {
font-size: 24rpx;
color: #999;
margin-top: 10rpx;
margin-top: 44rpx;
text-align: center;
}
.tips-2{
font-size: 24rpx;
color: #999;
margin: 20rpx;
text-align: center;
}
/* 底部按钮 */
.btn-wrap {
padding: 20rpx;
padding: 20rpx 40rpx 50rpx;
}
.submit-btn {
background-color: #007aff;

7
property-uniapp-project/pages.json
View File

@@ -69,6 +69,13 @@
"navigationBarTitleText": "修改密码",
"navigationStyle": "custom"
}
},
{
"path": "privacy",
"style": {
"navigationBarTitleText": "用户隐私政策"
// "navigationStyle": "custom"
}
}
]
},

19
property-uniapp-project/pages/index/index.vue
View File

@@ -50,7 +50,7 @@
<up-col span="3">
<view class="demo-layout bg-purple openClass" @click="openDoorClick">
<view class="iconClass">
<image src="http://47.104.199.163:9090/images/home/openDoor.png" mode="" style="width: 70px;height: 70px;border-radius: 8px;"></image>
<image src="http://47.104.199.163:9090/images/home/openDoor.png" class="iconClass-img"></image>
</view>
<view class="title-dome-calss">一键开门</view>
</view>
@@ -58,7 +58,7 @@
<up-col span="3">
<view class="demo-layout bg-purple-light openClass" @click="payMentClick">
<view class="iconClass">
<image src="http://47.104.199.163:9090/images/home/lifePay.png" mode="" style="width: 70px;height: 70px;border-radius: 8px;"></image>
<image src="http://47.104.199.163:9090/images/home/lifePay.png" class="iconClass-img"></image>
</view>
<view class="title-dome-calss">生活缴费</view>
</view>
@@ -66,7 +66,7 @@
<up-col span="3">
<view class="demo-layout bg-purple openClass" @click="onlineRepairClick">
<view class="iconClass">
<image src="http://47.104.199.163:9090/images/home/repair.png" mode="" style="width: 70px;height: 70px;border-radius: 8px;"></image>
<image src="http://47.104.199.163:9090/images/home/repair.png" class="iconClass-img"></image>
</view>
<view class="title-dome-calss">在线报修</view>
</view>
@@ -74,7 +74,7 @@
<up-col span="3">
<view class="demo-layout bg-purple-light openClass" @click="visitorClick">
<view class="iconClass">
<image src="http://47.104.199.163:9090/images/home/visitorInvite.png" mode="" style="width: 70px;height: 70px;border-radius: 8px;"></image>
<image src="http://47.104.199.163:9090/images/home/visitorInvite.png" class="iconClass-img"></image>
</view>
<view class="title-dome-calss">访客邀请</view>
</view>
@@ -483,15 +483,20 @@ const moreClick = () =>{
align-items: center;
margin-top: 20rpx;
.iconClass{
width: 130rpx;
height: 130rpx;
width: 88rpx;
height: 88rpx;
border-radius: 10rpx;
// opacity: 0.4;
}
.iconClass-img{
width: 100%;
height: 100%;
border-radius: 8px
}
.title-dome-calss{
margin-top: 10rpx;
font-size: 13px;
font-size: 28rpx;
color: #000;
}
}