| | |
| | | }, |
| | | }) |
| | | } |
| | | 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', |
| | |
| | | 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, |
| | | }); |
| | | }; |
| | |
| | | } |
| | | }, |
| | | { |
| | | "path": "pages/register/index", |
| | | "style": { |
| | | "navigationBarTitleText": "注册", |
| | | } |
| | | }, |
| | | { |
| | | "path": "pages/equipmentManagement/index", |
| | | "style": { |
| | | "navigationBarTitleText": "设备管理", |
| | |
| | | <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" |
| | |
| | | /> |
| | | </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> |
| | | |
| | |
| | | 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"); |
| | |
| | | } |
| | | } |
| | | |
| | | // 核心登录函数 |
| | | 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(() => { |
| | |
| | | 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 { |
| | |
| | | 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; |
| | |
| | | |
| | | .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; |
| | | } |
| | | } |
| | | |
| | |
| | | @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 { |
| | |
| | | <!-- 我的 --> |
| | | <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> |
| | | |
| | |
| | | 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(""); |
| | |
| | | }); |
| | | } |
| | | |
| | | function getDeviceRegion() { |
| | | getDeviceRegionApi().then((res) => {}); |
| | | } |
| | | const handelEdit = (val) => { |
| | | if (val === 1) { |
| | | uni.navigateTo({ |
| | |
| | | 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; |
| | |
| | | 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 { |
| | |
| | | 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; |
| | |
| | | } |
| | | |
| | | .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%; |
| | | } |
| | |
| | | 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" |
| | |
| | | |
| | | .submit-button-wrapper { |
| | | padding: 28rpx; |
| | | border-radius: 8rpx 8rpx 8rpx 8rpx; |
| | | } |
| | | |
| | | :deep(.u-form-item) { |
| | |
| | | ></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]" |
| | |
| | | } |
| | | .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; |
| | |
| | | <template> |
| | | <view class="container"> |
| | | <view class="pageBg"></view> |
| | | <div class="avatarBox"> |
| | | <u-avatar @click="uploadAvatar" :src="userInfo.avatar" size="114" mode="aspectFill" /> |
| | | </div> |
| | |
| | | <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> |
| | |
| | | </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> |
| | |
| | | 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; |
| | |
| | | } |
| | | |
| | | .detailBox { |
| | | position: absolute; |
| | | top: 360rpx; |
| | | // left: 0; |
| | | width: 702rpx; |
| | | min-height: 430rpx; |
| | | background: #FFFFFF; |
| | |
| | | |
| | | .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> |
| | |
| | | <!-- 修改密码 --> |
| | | <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> |
| | |
| | | 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]/; |
| | |
| | | }; |
| | | 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', |
| | |
| | | }); |
| | | return; |
| | | } |
| | | // 确认密码校验 |
| | | if (passwordForm.value.newPassword !== passwordForm.value.newPassword1) { |
| | | |
| | | // 中文校验 |
| | | if (!validatePasswordNoChinese(password)) return; |
| | | |
| | | // 确认密码校验 |
| | | if (password !== password2) { |
| | | uni.showToast({ |
| | | title: '两次输入的新密码不一致', |
| | | icon: 'none', |
| | |
| | | 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(); |
| | |
| | | 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; |
| | |
| | | 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; |
| | | } |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | .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> |