From d27223d5e2ca059a38bc63260d7446203d747a80 Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Tue, 13 Jan 2026 13:39:36 +0800
Subject: [PATCH] feat:更新小程序
---
uniapps/work-wx/src/subPackages/userDetail/infos/index.vue | 35 ++
uniapps/work-wx/src/pages.json | 6
uniapps/work-wx/src/pages/login/index.vue | 201 +++++----------
uniapps/work-wx/src/subPackages/userDetail/password/index.vue | 221 ++++++++++++++---
uniapps/work-wx/src/subPackages/deviceRegistration/add.vue | 12
uniapps/work-wx/src/subPackages/flightApplication/add.vue | 25 +
uniapps/work-wx/src/pages/user/index.vue | 136 +++++-----
uniapps/work-wx/src/api/user/index.js | 65 ++++-
8 files changed, 424 insertions(+), 277 deletions(-)
diff --git a/uniapps/work-wx/src/api/user/index.js b/uniapps/work-wx/src/api/user/index.js
index 14685d4..a43094a 100644
--- a/uniapps/work-wx/src/api/user/index.js
+++ b/uniapps/work-wx/src/api/user/index.js
@@ -47,19 +47,19 @@
},
})
}
-export const getUserInfo = () => {
- return request({
- url: '/blade-system/user/info',
- method: 'get',
- });
-};
-export const updateInfo = row => {
- return request({
- url: '/blade-system/user/update-info',
- method: 'post',
- data: row,
- });
-};
+// export const getUserInfo = () => {
+// return request({
+// url: '/blade-system/user/info',
+// method: 'get',
+// });
+// };
+// export const updateInfo = row => {
+// return request({
+// url: '/blade-system/user/update-info',
+// method: 'post',
+// data: row,
+// });
+// };
export const updatePassword = (oldPassword, newPassword, newPassword1) => {
return request({
url: '/blade-system/user/update-password',
@@ -98,3 +98,42 @@
data
})
}
+
+export const getUserInfo = () => {
+ return request({
+ url: '/system/user/getInfo',
+ method: 'get',
+ });
+};
+export const updateInfo = row => {
+ return request({
+ url: '/system/user/profile/update',
+ method: 'post',
+ data: row,
+ });
+};
+
+/** 发送重置密码验证码 */
+export const sendResetCode = (phone) => {
+ return request({
+ url: `/system/verificationCode/resetCode/${phone}`,
+ method: 'get',
+ });
+};
+
+/** 根据验证码重置密码 */
+export const resetPassword = (data) => {
+ return request({
+ url: '/system/user/retrievePassword',
+ method: 'post',
+ data: data,
+ });
+};
+
+export const registerUser = (data) => {
+ return request({
+ url: `/system/user/register`,
+ method: 'post',
+ data: data,
+ });
+};
diff --git a/uniapps/work-wx/src/pages.json b/uniapps/work-wx/src/pages.json
index f6784de..2f49cea 100644
--- a/uniapps/work-wx/src/pages.json
+++ b/uniapps/work-wx/src/pages.json
@@ -16,6 +16,12 @@
}
},
{
+ "path": "pages/register/index",
+ "style": {
+ "navigationBarTitleText": "注册",
+ }
+ },
+ {
"path": "pages/equipmentManagement/index",
"style": {
"navigationBarTitleText": "设备管理",
diff --git a/uniapps/work-wx/src/pages/login/index.vue b/uniapps/work-wx/src/pages/login/index.vue
index 1693d5b..40aa57e 100644
--- a/uniapps/work-wx/src/pages/login/index.vue
+++ b/uniapps/work-wx/src/pages/login/index.vue
@@ -2,22 +2,20 @@
<template>
<view class="login-form-wrap">
<image class="logo" :src="logoSvg" />
+ <image class="droneLogo" :src="droneLogSvg" />
<div class="title">低空经济服务一体化平台系统</div>
- <div class="user-name">
- <!-- <image :src="usernameSvg" /> -->
- <input v-model="loginForm.username" placeholder="请输入用户名" />
- </div>
- <div class="pass-word">
- <!-- <image :src="passwordSvg" /> -->
- <input
- v-model="loginForm.password"
- type="password"
- placeholder="请输入密码"
- />
- <image :src="showPasswordSvg" />
- </div>
+ <view class="user-password">
+ <div class="user-name">
+ <input v-model="loginForm.username" placeholder="请输入用户名" />
+ </div>
+ <div class="pass-word">
+ <input v-model="loginForm.password" :type="isShowPassword ? 'text' : 'password'" placeholder="请输入密码"/>
+ <image v-if="!isShowPassword" :src="showPasswordSvg" @click="isShowPassword = !isShowPassword" />
+ <image v-else :src="showPsdSvg" @click="isShowPassword = !isShowPassword" />
+ </div>
+ </view>
<div class="remember-password">
- <label>
+ <view class="remember">
<checkbox-group @change="toggleRemember">
<checkbox
:checked="rememberPassword"
@@ -26,18 +24,13 @@
/>
</checkbox-group>
记住密码
- </label>
+ </view>
+ <view class="forget">
+ 忘记密码
+ </view>
</div>
-
<button class="login-btn" :style="[inputStyle]" @tap="submit">登录</button>
- <button class="wechat-login-btn" @tap="wechatLogin">微信登录</button>
-
- <view class="agreement">
- <label>
- <checkbox :checked="agreed" @click="agreed = !agreed" />
- 同意《用户协议》与《隐私政策》
- </label>
- </view>
+ <view class="register" @click="registerClick">立即注册</view>
</view>
</template>
@@ -51,6 +44,8 @@
import { ref } from "vue";
import logoSvg from "@/static/images/logo.svg";
+import droneLogSvg from "@/static/images/user/droneLogo.svg";
+import showPsdSvg from "@/static/images/user/showPsd.svg";
import showPasswordSvg from "@/static/images/show-password.svg";
const droneSvg = getAssetsImage("/images/login/droneSvg.svg");
@@ -146,81 +141,15 @@
}
}
-// 核心登录函数
-const wechatLogin = async () => {
- // 1. 协议检查
- if (!agreed.value) {
- uni.showToast({ title: '请先同意协议', icon: 'none' });
- return;
- }
+// 是否显示密码明文
+const isShowPassword = ref(false);
- // loading.value = true;
-
- try {
- // 2. 获取登录凭证 (code)
- const loginRes = await uni.login({
- provider: 'weixin',
- timeout: 10000
- });
-
- if (!loginRes.code) {
- throw new Error('获取登录码失败');
- }
- console.log('获取到code:', loginRes.code);
-
- // 3. 获取用户信息 (需要用户授权弹窗)
- const userProfileRes = await uni.getUserProfile({
- desc: '用于完善您的会员信息', // 声明用途，会展示给用户
- lang: 'zh_CN'
- });
-
- console.log('用户信息:', userProfileRes.userInfo);
-
- // 4. 调用后端登录接口
- const serverRes = await uni.request({
- // url: 'https://你的域名.com/api/wx-login', // 替换为你的真实接口
- // method: 'POST',
- // data: {
- // code: loginRes.code,
- // rawData: userProfileRes.rawData,
- // signature: userProfileRes.signature,
- // encryptedData: userProfileRes.encryptedData,
- // iv: userProfileRes.iv,
- // userInfo: userProfileRes.userInfo // 注意：userInfo 仅为昵称头像等非敏感信息
- // },
- // header: { 'Content-Type': 'application/json' }
- });
-
- // 5. 处理登录结果
- const { data } = serverRes;
- if (data.success && data.token) {
- // 保存登录状态
- uni.setStorageSync('token', data.token);
- uni.setStorageSync('userInfo', data.userInfo || userProfileRes.userInfo);
-
- uni.showToast({ title: '登录成功', icon: 'success' });
-
- // 登录成功后的跳转逻辑
- const pages = getCurrentPages();
- if (pages.length > 1) {
- uni.navigateBack();
- } else {
- uni.switchTab({ url: '/pages/page/index' }); // 跳转到首页
- }
- } else {
- throw new Error(data.message || '登录失败');
- }
-
- } catch (error) {
- console.error('登录全过程失败:', error);
- uni.showToast({
- title: error.errMsg || error.message || '登录失败',
- icon: 'none'
- });
- } finally {
- // loading.value = false;
- }
-};
+// 注册点击事件
+function registerClick() {
+ uni.navigateTo({
+ url: "/pages/register/index",
+ });
+}
// 从本地存储加载记住的密码
onMounted(() => {
@@ -250,8 +179,17 @@
width: 127px;
height: 51px;
margin: 0 auto;
- margin-top: 104px;
+ margin-top: 162px;
margin-bottom: 16px;
+ }
+
+ .droneLogo {
+ position: fixed;
+ top: 24px;
+ right: 0;
+ // transform: translateX(-50%);
+ width: 213px;
+ height: 158px;
}
.lowerRightCorner {
@@ -274,18 +212,25 @@
text-transform: none;
color: #161B2C;
text-align: center;
- margin-bottom: 168rpx;
+ margin-bottom: 88rpx;
+ }
+
+ .user-password {
+ padding: 0 40rpx;
}
.user-name,
.pass-word {
+ // 水平垂直居中
+ margin: 0 auto;
display: flex;
- //justify-content: center;
+ justify-content: space-between;
align-items: center;
- margin-left: 62rpx;
- margin-right: 58rpx;
- height: 118rpx;
- border-bottom: 2rpx solid #e3e3e3;
+ height: 50px;
+ background: #F1F4F9;
+ border-radius: 4px 4px 4px 4px;
+ padding: 0 22rpx;
+ margin-bottom: 40rpx;
image {
width: 40rpx;
@@ -319,18 +264,22 @@
.remember-password {
display: flex;
- justify-content: flex-end;
+ justify-content: space-between;
align-items: center;
- margin-left: 62rpx;
- margin-right: 58rpx;
- margin-top: 20rpx;
-
+ padding: 0 40rpx;
color: #666;
font-size: 28rpx;
-
- label {
+ .remember {
display: flex;
align-items: center;
+ font-weight: 400;
+ font-size: 14px;
+ color: #86909C;
+ }
+ .forget {
+ font-weight: 500;
+ font-size: 14px;
+ color: #4E5969;
}
}
@@ -348,29 +297,21 @@
@apply flex items-center justify-center py-12rpx px-0 text-30rpx border-none;
background: #1d6fe9;
color: white;
- width: 590rpx;
- height: 76rpx;
- border-radius: 40rpx 40rpx 40rpx 40rpx;
- margin-top: 100rpx;
+ height: 100rpx;
+ border-radius: 4px 4px 4px 4px;
+ margin: 100rpx 40rpx 40rpx 40rpx;
&::after {
@apply border-none;
}
}
-
- .wechat-login-btn {
- z-index: 1;
- @apply flex items-center justify-center py-12rpx px-0 text-30rpx border-none;
- background: #07C160;
- color: white;
- width: 590rpx;
- height: 76rpx;
- border-radius: 40rpx 40rpx 40rpx 40rpx;
- margin-top: 30rpx;
-
- &::after {
- @apply border-none;
- }
+ .register {
+ font-family: Abyssinica SIL, Abyssinica SIL;
+ font-weight: 400;
+ font-size: 16px;
+ color: #2C8BFF;
+ text-align: right;
+ margin-right: 40rpx;
}
.alternative {
diff --git a/uniapps/work-wx/src/pages/user/index.vue b/uniapps/work-wx/src/pages/user/index.vue
index d265770..a3dae5e 100644
--- a/uniapps/work-wx/src/pages/user/index.vue
+++ b/uniapps/work-wx/src/pages/user/index.vue
@@ -1,52 +1,48 @@
<!-- 我的 -->
<template>
<view class="page-wrap">
- <view class="userBox">
- <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
- <view class="mr-20rpx">
- <u-avatar :src="user.avatar" size="70" />
- </view>
- <view class="flex-1">
- <view class="userName">{{ userStore?.userInfo?.nick_name }}</view>
- <view class="departs">
- <image
- src="https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/mobile.svg"
- alt=""
- />
- <span>{{ user.deptName }}</span>
- </view>
- </view>
- <view class="rightLogo">
- <image
- src="https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/logo2.png"
- alt=""
- />
- </view>
- </view>
- <view class="personalInformation">
- <div class="message">
- <div class="messagebox">个人信息</div>
- <div class="editInfo" @click="handelEdit(1)">
- 点击编辑
- <image :src="rightImage" alt="" />
- </div>
- </div>
- <div class="passwordBox">
- <div class="messagebox">修改密码</div>
- <div class="editInfo" @click="handelEdit(2)">
- 点击编辑
- <image :src="rightImage" alt="" />
- </div>
- </div>
- </view>
-
- <view class="mt-20rpx">
- <div class="goOutStyle" @click="logOut">退出登录</div>
- </view>
- <div class="bottomLogo">
- <image :src="logoImage" alt="" />
- </div>
- </view>
+<view class="pageUser">
+ <view class="userBox">
+ <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
+ <view class="mr-20rpx">
+ <u-avatar :src="user.avatar || defaultAvatar" size="70" />
+ </view>
+ <view class="flex-1">
+ <view class="userName">{{user.nickName }}</view>
+ <view class="departs">
+ <image
+ src="@/static/images/user/department.svg"
+ alt=""
+ />
+ <span>{{ user?.sysDept?.deptName }}</span>
+ </view>
+ </view>
+
+ </view>
+ <view class="personalInformation">
+ <div class="message">
+ <div class="messagebox">个人资料</div>
+ <div class="editInfo" @click="handelEdit(1)">
+ 点击编辑
+ <image :src="rightImage" alt="" />
+ </div>
+ </div>
+ <div class="passwordBox">
+ <div class="messagebox">修改密码</div>
+ <div class="editInfo" @click="handelEdit(2)">
+ 点击编辑
+ <image :src="rightImage" alt="" />
+ </div>
+ </div>
+ </view>
+
+ <view class="goOutBtn">
+ <div class="goOutStyle" @click="logOut">退出登录</div>
+ </view>
+
+ </view>
+
+</view>
</view>
</template>
@@ -57,11 +53,11 @@
import { useUserStore } from "@/store/index.js";
import { onShow } from "@dcloudio/uni-app";
import { getDeviceRegionApi } from "@/api/map.js";
-
+import defaultAvatar from '/static/images/defaultAvatar.svg'
+import rightImage from '@/static/images/user/rightBtn.svg';
const { setClipboardData, getClipboardData } = useClipboard();
-
-const rightImage = getAssetsImage("/images/user/rightBtn.svg");
-const logoImage = getAssetsImage("/images/user/logo1.png");
+//
+// const rightImage = getAssetsImage("/images/user/rightBtn.svg");
const userStore = useUserStore();
const user = ref("");
@@ -78,9 +74,6 @@
});
}
-function getDeviceRegion() {
- getDeviceRegionApi().then((res) => {});
-}
const handelEdit = (val) => {
if (val === 1) {
uni.navigateTo({
@@ -105,8 +98,11 @@
width: 100%;
height: 100%;
}
+.pageUser {
+ background: url("@/static/images/user/userbg.svg") no-repeat ;
+}
.userBox {
- padding-top: 88rpx;
+ padding-top: 212rpx;
}
.userName {
font-weight: 700;
@@ -156,20 +152,28 @@
height: 52rpx;
}
}
-
+.goOutBtn {
+ display: flex;
+ justify-content: center;
+ position: absolute;
+ bottom: 72rpx;
+ left: 0;
+ right: 0;
+}
.goOutStyle {
- width: 590rpx;
- height: 76rpx;
- background: #1d6fe9;
- border-radius: 40rpx;
+ width: 670rpx;
+ height: 100rpx;
+ background: #1D6FE9;
+ border-radius: 8rpx 8rpx 8rpx 8rpx;
font-family: "Source Han Sans CN";
font-weight: 400;
- font-size: 28rpx;
+ font-size: 36rpx;
color: #ffffff;
text-align: center;
- line-height: 76rpx;
+ line-height: 100rpx;
margin: auto;
margin-top: 114rpx;
+
}
.personalInformation {
@@ -183,15 +187,15 @@
height: 160rpx;
.messagebox {
- padding: 20rpx 24rpx;
+ padding: 20rpx 40rpx;
font-family: "Source Han Sans CN";
font-weight: 500;
- font-size: 28rpx;
+ font-size: 32rpx;
color: #000000;
}
.editInfo {
- padding: 20rpx 24rpx;
+ padding: 20rpx 40rpx;
color: rgba(0, 0, 0, 0.5);
font-family: "Source Han Sans CN";
font-weight: 400;
@@ -207,13 +211,13 @@
}
.message {
- background: url(https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/info.png)
+ background: url('@/static/images/user/info.svg')
no-repeat center;
background-size: 100% 100%;
}
.passwordBox {
- background: url(https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/password.png)
+ background: url('@/static/images/user/password.svg')
no-repeat center;
background-size: 100% 100%;
}
diff --git a/uniapps/work-wx/src/subPackages/deviceRegistration/add.vue b/uniapps/work-wx/src/subPackages/deviceRegistration/add.vue
index a70969b..97e8ce7 100644
--- a/uniapps/work-wx/src/subPackages/deviceRegistration/add.vue
+++ b/uniapps/work-wx/src/subPackages/deviceRegistration/add.vue
@@ -220,14 +220,9 @@
placeholder="请输入"
></u-input>
</u-form-item>
- <u-button
- class="submit-button-wrapper"
- type="primary"
- size="small"
- @click="submitForm"
- >
- 提交
- </u-button>
+ <u-button class="submit-button-wrapper" color="#1D6FE9" size="large" @click="submitForm">
+ 注册
+ </u-button>
<!-- 飞行器型号 -->
<u-picker
:show="showType"
@@ -573,6 +568,7 @@
.submit-button-wrapper {
padding: 28rpx;
+ border-radius: 8rpx 8rpx 8rpx 8rpx;
}
:deep(.u-form-item) {
diff --git a/uniapps/work-wx/src/subPackages/flightApplication/add.vue b/uniapps/work-wx/src/subPackages/flightApplication/add.vue
index 2512e98..e350718 100644
--- a/uniapps/work-wx/src/subPackages/flightApplication/add.vue
+++ b/uniapps/work-wx/src/subPackages/flightApplication/add.vue
@@ -290,14 +290,13 @@
></up-icon>
</template>
</u-form-item>
- <u-button class="submit-button-wrapper"
- type="primary"
- size="small"
- @click="submitForm"
- >
- 提交
- </u-button>
- <!-- 飞任务类型 -->
+ <u-button class="submit-button-wrapper" color="#1D6FE9" size="large" @click="submitForm">
+ 飞行申请
+ </u-button>
+ <!-- 飞任务类型 -->
+ <view class="attention">
+ 注:新增空域/航线/飞手等前往吉安市低空经济服务一体化
+ </view>
<u-picker
:show="isShowFlightTaskType"
:columns="[actionsFlightTaskType]"
@@ -783,6 +782,16 @@
}
.submit-button-wrapper {
padding: 28rpx;
+ // width: 80%;
+ // height: 100rpx;
+ border-radius: 8rpx 8rpx 8rpx 8rpx;
+ }
+ .attention {
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 400;
+ font-size: 12px;
+ color: #1D6FE9;
+ margin-top: 24rpx;
}
:deep(.u-form-item) {
margin-bottom: 40rpx;
diff --git a/uniapps/work-wx/src/subPackages/userDetail/infos/index.vue b/uniapps/work-wx/src/subPackages/userDetail/infos/index.vue
index dcde669..4bf1b95 100644
--- a/uniapps/work-wx/src/subPackages/userDetail/infos/index.vue
+++ b/uniapps/work-wx/src/subPackages/userDetail/infos/index.vue
@@ -1,5 +1,6 @@
<template>
<view class="container">
+ <view class="pageBg"></view>
<div class="avatarBox">
<u-avatar @click="uploadAvatar" :src="userInfo.avatar" size="114" mode="aspectFill" />
</div>
@@ -9,9 +10,13 @@
<div class="rowTitle">姓名</div>
<div>{{userInfo.realName}}</div>
</div>
- <div class="orderRow">
+ <!-- <div class="orderRow">
<div class="rowTitle">所属单位</div>
<div>{{userInfo.deptName}}</div>
+ </div> -->
+ <div class="orderRow">
+ <div class="rowTitle">是否认证</div>
+ <div>{{userInfo.isAuth ? '已认证' : '未认证'}}</div>
</div>
<div class="orderRow">
<div class="rowTitle">手机号</div>
@@ -26,9 +31,10 @@
</div>
</div>
</view>
+ <view class="note">注：请前往吉安市低空经济服务一体化平台进行认证</view>
<view class="btngroup">
- <u-button color="#AEAEAE" class="custom-style" shape="circle" @click="reset">重置</u-button>
- <u-button color="#1D6FE9" class="custom-style" shape="circle" @click="submit">提交</u-button>
+ <u-button color="#AEAEAE" class="custom-style" @click="reset">重置</u-button>
+ <u-button color="#1D6FE9" class="custom-style" @click="submit">提交</u-button>
</view>
</view>
</template>
@@ -235,6 +241,15 @@
display: flex;
flex-direction: column;
align-items: center;
+ position: relative;
+ }
+ .pageBg {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: url("@/static/images/user/userbg.svg") no-repeat ;
}
.avatarBox {
width: 228rpx;
@@ -243,6 +258,9 @@
}
.detailBox {
+ position: absolute;
+ top: 360rpx;
+ // left: 0;
width: 702rpx;
min-height: 430rpx;
background: #FFFFFF;
@@ -298,10 +316,17 @@
.custom-style {
width: 276rpx;
- height: 76rpx;
+ height: 100rpx;
}
:deep(.u-button.data-v-461e713c){
width: 276rpx !important;
- height: 76rpx !important;
+ height: 100rpx !important;
+ }
+ .note {
+ font-family: Source Han Sans CN, Source Han Sans CN;
+ font-weight: 400;
+ font-size: 10px;
+ color: #1D6FE9;
+ margin-top: 40rpx;
}
</style>
\ No newline at end of file
diff --git a/uniapps/work-wx/src/subPackages/userDetail/password/index.vue b/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
index 222e282..7a7212b 100644
--- a/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
+++ b/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
@@ -1,26 +1,34 @@
<!-- 修改密码 -->
<template>
<view class="container">
+ <view class="pageBg"></view>
<view class="detailBox">
<div class="detailCon">
<div class="orderRow">
- <div class="rowTitle">原始密码</div>
- <input type="password" v-model="passwordForm.oldPassword" placeholder="请输入" class="input-item" />
+ <div class="rowTitle">账号</div>
+ <input type="text" v-model="passwordForm.username" placeholder="请输入账号" class="input-item" />
</div>
<div class="orderRow">
- <div class="rowTitle">新密码</div>
- <input type="password" v-model="passwordForm.newPassword" placeholder="请输入" class="input-item" />
+ <div class="rowTitle">密码</div>
+ <input type="password" v-model="passwordForm.password" placeholder="请输入" class="input-item" />
</div>
<div class="orderRow">
<div class="rowTitle">确认密码</div>
- <input type="password" v-model="passwordForm.newPassword1" placeholder="请输入" class="input-item" />
+ <input type="password" v-model="passwordForm.password2" placeholder="请输入" class="input-item" />
+ </div>
+ <div class="orderRow">
+ <div class="rowTitle">验证码</div>
+ <input type="text" v-model="passwordForm.code" placeholder="请输入验证码" class="input-item" />
+ <u-button :disabled="countDown > 0" @click="sendVerificationCode" type="primary" color="#007AFF">
+ {{ countDown > 0 ? `${countDown}s后重发` : '获取验证码' }}
+ </u-button>
</div>
</div>
</view>
<view class="btngroup">
- <u-button color="#AEAEAE" class="custom-style" shape="circle" @click="reset">重置</u-button>
- <u-button color="#1D6FE9" class="custom-style" shape="circle" @click="submit">提交</u-button>
+ <u-button color="#AEAEAE" class="custom-style" @click="reset">重置</u-button>
+ <u-button color="#1D6FE9" class="custom-style" @click="submit">提交</u-button>
</view>
</view>
</template>
@@ -30,21 +38,25 @@
useUserStore
} from "@/store/index.js";
import md5 from "js-md5";
- import {
- getUserInfo,
- updateInfo,
- updatePassword
- } from '@/api/user/index.js';
+ import { getUserInfo,
+ updateInfo,
+ updatePassword,
+ sendResetCode,
+ resetPassword
+} from '@/api/user/index.js';
const passwordIcon = {
show: 'fas fa-eye', // 显示密码时的图标
hide: 'fas fa-eye-slash' // 隐藏密码时的图标
}
const userStore = useUserStore();
- const passwordForm = ref({
- oldPassword: '',
- newPassword: '',
- newPassword1: '',
- });
+const passwordForm = ref({
+ username: '',
+ password: '',
+ password2: '',
+ code: ''
+});
+const countDown = ref(0);
+let timer = null;
// 校验密码不能包含中文
const validatePasswordNoChinese = (password) => {
const chineseRegex = /[\u4e00-\u9fa5]/;
@@ -80,30 +92,82 @@
};
const clearForm = () => {
passwordForm.value = {
- oldPassword: '',
- newPassword: '',
- newPassword1: '',
+ username: '',
+ password: '',
+ password2: '',
+ code: ''
};
+ countDown.value = 0;
+ if (timer) {
+ clearInterval(timer);
+ timer = null;
+ }
};
- const reset = () => {
- clearForm();
- };
- const submit = () => {
- // 原始密码校验
- if (!passwordForm.value.oldPassword) {
+ // 发送验证码
+ const sendVerificationCode = () => {
+ const { username } = passwordForm.value;
+ if (!username) {
uni.showToast({
- title: '请输入原始密码',
+ title: '请先输入账号',
icon: 'none',
duration: 2000
});
return;
}
- // 中文校验
- if (!validatePasswordNoChinese(passwordForm.value.newPassword)) return;
- // 新密码校验
- if (!passwordForm.value.newPassword) {
+ // 这里假设账号就是手机号，实际项目中可能需要验证格式
+ sendResetCode(username).then(res => {
+ if (res.data.code === 200) {
+ uni.showToast({
+ title: '验证码发送成功',
+ icon: 'success',
+ duration: 2000
+ });
+
+ // 开始倒计时
+ countDown.value = 60;
+ timer = setInterval(() => {
+ countDown.value--;
+ if (countDown.value <= 0) {
+ clearInterval(timer);
+ timer = null;
+ }
+ }, 1000);
+ } else {
+ uni.showToast({
+ title: res.data.msg || '验证码发送失败',
+ icon: 'none',
+ duration: 2000
+ });
+ }
+ }).catch(err => {
+ uni.showToast({
+ title: '网络错误，请稍后重试',
+ icon: 'none',
+ duration: 2000
+ });
+ });
+ };
+ const reset = () => {
+ clearForm();
+ };
+
+ const submit = () => {
+ const { username, password, password2, code } = passwordForm.value;
+
+ // 账号校验
+ if (!username) {
+ uni.showToast({
+ title: '请输入账号',
+ icon: 'none',
+ duration: 2000
+ });
+ return;
+ }
+
+ // 新密码校验
+ if (!password) {
uni.showToast({
title: '请输入新密码',
icon: 'none',
@@ -111,9 +175,12 @@
});
return;
}
- // 确认密码校验
- if (passwordForm.value.newPassword !== passwordForm.value.newPassword1) {
+ // 中文校验
+ if (!validatePasswordNoChinese(password)) return;
+
+ // 确认密码校验
+ if (password !== password2) {
uni.showToast({
title: '两次输入的新密码不一致',
icon: 'none',
@@ -122,34 +189,56 @@
return;
}
+ // 验证码校验
+ if (!code) {
+ uni.showToast({
+ title: '请输入验证码',
+ icon: 'none',
+ duration: 2000
+ });
+ return;
+ }
+
// 复杂度校验
- if (!validatePasswordStrength(passwordForm.value.newPassword)) return;
- updatePassword(md5(passwordForm.value.oldPassword),
- md5(passwordForm.value.newPassword),
- md5(passwordForm.value.newPassword1)).then(res => {
+ if (!validatePasswordStrength(password)) return;
+
+ // 调用重置密码接口
+ const resetData = {
+ username,
+ // password: md5(password),
+ // confirmPassword: md5(password2),
+ password: password,
+ password2: password2,
+ code
+ };
+ console.log('canshu',resetData)
+ resetPassword(resetData).then(res => {
if (res.data.code === 200) {
uni.showToast({
- title: '修改信息成功',
+ title: '密码修改成功',
icon: 'none',
duration: 2000
});
clearForm();
- userStore.setUserInfo(null)
+ userStore.setUserInfo(null);
uni.removeStorageSync('rememberedUser');
uni.reLaunch({
url: '/pages/login/index'
- })
-
+ });
} else {
uni.showToast({
- title: res.msg,
+ title: res.data.msg || '密码修改失败',
icon: 'none',
duration: 2000
});
}
-
+ }).catch(err => {
+ uni.showToast({
+ title: '网络错误，请稍后重试',
+ icon: 'none',
+ duration: 2000
+ });
});
-
};
onShow(async () => {
clearForm();
@@ -163,10 +252,22 @@
display: flex;
flex-direction: column;
align-items: center;
+ position: relative;
+ }
+
+ .pageBg {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: url("@/static/images/user/userbg.svg") no-repeat ;
}
.detailBox {
- margin-top: 40rpx;
+ position: absolute;
+ top: 180rpx;
+ // margin-top: 40rpx;
width: 702rpx;
min-height: 326rpx;
@@ -215,6 +316,29 @@
input.input-item::placeholder {
font-size: 30rpx;
}
+
+ // .code-container {
+ // display: flex;
+ // align-items: center;
+ // justify-content: flex-end;
+ // width: 100%;
+ // }
+
+ .send-code-btn {
+ margin-left: 20rpx;
+ width: 200rpx;
+ height: 70rpx;
+ line-height: 70rpx;
+ font-size: 26rpx;
+ background: #f5f5f5;
+ color: #666;
+ border-radius: 8rpx;
+ }
+
+ .send-code-btn:disabled {
+ background: #e0e0e0;
+ color: #999;
+ }
}
}
@@ -230,10 +354,13 @@
.custom-style {
width: 276rpx;
- height: 76rpx;
+ height: 100rpx;
+ font-family: "Source Han Sans CN";
+ font-weight: 400;
+ font-size: 36rpx;
}
:deep(.u-button.data-v-461e713c){
width: 276rpx !important;
- height: 76rpx !important;
+ height: 100rpx !important;
}
</style>
--
Gitblit v1.9.3