qimaohong
/
deepChartVueApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add:对接用户个人信息接口 

对接修改密码接口
配置信息接（部分）
lihuilin/feature-20251024095243-我的
lihui 4 weeks ago
parent
72b2395184
commit
c78175f93b
10 changed files with 969 additions and 750 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 46
      api/member.js
  2. 13
      api/setting/general.js
  3. 16
      api/setting/nextPwd.js
  4. 31
      api/setting/password.js
  5. 583
      pages/home/member.vue
  6. 25
      pages/setting/account.vue
  7. 331
      pages/setting/general.vue
  8. 303
      pages/setting/nextPwd.vue
  9. 362
      pages/setting/password.vue
  10. 7
      utils/http.js

46
api/member.js
View File

@ -0,0 +1,46 @@
import util from '../common/util.js'
/*export const getUserInfo = (data = {}) => {
return util.request(
'/api/my/userInfo',
(res) => {
console.log('用户信息请求成功：', res);
},
{data},
(err) => {
console.log('用户信息请求失败：', err);
}
);
};
*/
import { http } from '../utils/http'
/**
* 用户信息获取接口
* @param data
* @returns {Promise<unknown>}
*/
export const getUserInfo = (data) => {
return http({
method: 'POST',
url: '/api/my/userInfo',
data:
data
,
})
}

13
api/setting/general.js
View File

@ -0,0 +1,13 @@
import { http } from '../utils/http'
export const getSetting = (data) => {
return http({
method: 'POST',
url: '/api/my/getSetting',
data:
data
,
})
}

16
api/setting/nextPwd.js
View File

@ -0,0 +1,16 @@
import {http} from '../../utils/http'
/**
* 修改密码
* @param data
* @returns {*}
*/
export const updatePassword = (data) => {
return http({
method: 'POST',
url: '/api/my/updatePassword',
data:
data
,
})
}

31
api/setting/password.js
View File

@ -0,0 +1,31 @@
import {http} from '../../utils/http'
/**
* 验证码发送
* @param data
* @returns {*}
*/
export const sendEmail = (data) => {
return http({
method: 'POST',
url: '/UserLogin/sendEmail',
data:
data
,
})
}
/**
* 验证码验证
* @param data
* @returns {*}
*/
export const validateCode = (data) => {
return http({
method: 'POST',
url: '/api/my/validateCode',
data:
data
,
})
}

583
pages/home/member.vue
View File

@ -1,294 +1,305 @@
<template>
<view class="main">
<view class="top">
<view class="bell">
<image class="image-bell" src="/static/my/bell.png"></image>
</view>
<view class="msg">
<view class="msg-left">
<view class="avatar"></view>
</view>
<view class="msg-center">
<view style="display: flex;">
<view class="userInfo">{{ username }}</view>
<image class="image-editName" src="/static/my/editName.png"></image>
</view>
<view class="userId">ID:{{ dccode }}</view>
</view>
<view class="msg-right">
<image class="image-attendance" src="/static/my/Check-in.png" />
<span style="font-size:10px;">签到</span>
</view>
</view>
<view class="settings-buttons">
<view class="setting-btn" @click="goToMarket">
<image src="/static/my/MarketSettings.png" class="setting-icon" />
<text>行情设置</text>
</view>
<view class="setting-btn" @click="goToGeneral">
<image src="/static/my/Settings.png" class="setting-icon" />
<text>通用设置</text>
</view>
</view>
<view class="share" @click="goToShare">
<image class="img-share" src="/static/my/share.png" mode="widthFix" />
</view>
</view>
<view class="bottom">
<view class="list-item" @click="goToAccount">
<image src="/static/my/security.png" class="list-icon" />
<text>账号与安全</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="list-item">
<image src="/static/my/connection.png" class="list-icon" />
<text>联系我们</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="list-item" @click="goToNewVersion">
<image src="/static/my/update.png" class="list-icon" />
<text>新版本更新</text>
<view class="update-tip">有新版本可更新
<view class="circle"></view>
</view>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="list-item">
<image src="/static/my/opinion.png" class="list-icon" />
<text>意见反馈</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="list-item" @click="goToAbout">
<image src="/static/my/about.png" class="list-icon" />
<text>关于DeepChart</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
<footerBar class="static-footer" :type="type"></footerBar>
</view>
<view class="main">
<view class="top">
<view class="bell">
<image class="image-bell" src="/static/my/bell.png"></image>
</view>
<view class="msg">
<view class="msg-left">
<view class="avatar"></view>
</view>
<view class="msg-center">
<view style="display: flex;">
<view class="userInfo">{{ username }}</view>
<image class="image-editName" src="/static/my/editName.png"></image>
</view>
<view class="userId">ID:{{ dccode }}</view>
</view>
<view class="msg-right">
<image class="image-attendance" src="/static/my/Check-in.png"/>
<span style="font-size:10px;">签到</span>
</view>
</view>
<view class="settings-buttons">
<view class="setting-btn" @click="goToMarket">
<image src="/static/my/MarketSettings.png" class="setting-icon"/>
<text>行情设置</text>
</view>
<view class="setting-btn" @click="goToGeneral">
<image src="/static/my/Settings.png" class="setting-icon"/>
<text>通用设置</text>
</view>
</view>
<view class="share" @click="goToShare">
<image class="img-share" src="/static/my/share.png" mode="widthFix"/>
</view>
</view>
<view class="bottom">
<view class="list-item" @click="goToAccount">
<image src="/static/my/security.png" class="list-icon"/>
<text>账号与安全</text>
<uni-icons type="arrowright" size="16" class="arrow"/>
</view>
<view class="list-item">
<image src="/static/my/connection.png" class="list-icon"/>
<text>联系我们</text>
<uni-icons type="arrowright" size="16" class="arrow"/>
</view>
<view class="list-item" @click="goToNewVersion">
<image src="/static/my/update.png" class="list-icon"/>
<text>新版本更新</text>
<view class="update-tip">有新版本可更新
<view class="circle"></view>
</view>
<uni-icons type="arrowright" size="16" class="arrow"/>
</view>
<view class="list-item">
<image src="/static/my/opinion.png" class="list-icon"/>
<text>意见反馈</text>
<uni-icons type="arrowright" size="16" class="arrow"/>
</view>
<view class="list-item" @click="goToAbout">
<image src="/static/my/about.png" class="list-icon"/>
<text>关于DeepChart</text>
<uni-icons type="arrowright" size="16" class="arrow"/>
</view>
</view>
<footerBar class="static-footer" :type="type"></footerBar>
</view>
</template>
<script setup>
import {
ref,
onMounted
} from 'vue'
import {
ArrowRight
} from '@element-plus/icons-vue'
import footerBar from '../../components/footerBar.vue'
const type = ref('member')
const iSMT = ref(0)
const username = ref('演示机EVA')
const dccode = ref('90047681')
const goToGeneral = () => {
uni.navigateTo({
url: '/pages/setting/general'
})
}
const goToMarket = () => {
uni.navigateTo({
url: '../setting/market'
})
}
const goToAccount = () => {
uni.navigateTo({
url:'../setting/account'
})
}
const goToNewVersion = () =>{
uni.navigateTo({
url:'../setting/newVersion'
})
}
const goToAbout = () =>{
uni.navigateTo({
url:'../setting/about'
})
}
const goToShare = () =>{
uni.navigateTo({
url:'../setting/share'
})
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight
console.log('??????????????', iSMT.value)
})
import {
ref,
onMounted
} from 'vue'
import {
ArrowRight
} from '@element-plus/icons-vue'
import footerBar from '../../components/footerBar.vue'
import {getUserInfo} from "@/api/member";
const type = ref('member')
const iSMT = ref(0)
const username = ref('')
const dccode = ref('')
const userInfoRes = ref()
userInfoRes.value = getUserInfo()
userInfoRes.value.then(res => {
username.value = res.data.username
dccode.value = res.data.dccode
console.log('用户信息', res.data)
})
const goToGeneral = () => {
uni.navigateTo({
url: '/pages/setting/general'
})
}
const goToMarket = () => {
uni.navigateTo({
url: '../setting/market'
})
}
const goToAccount = () => {
uni.navigateTo({
url: '../setting/account'
})
}
const goToNewVersion = () => {
uni.navigateTo({
url: '../setting/newVersion'
})
}
const goToAbout = () => {
uni.navigateTo({
url: '../setting/about'
})
}
const goToShare = () => {
uni.navigateTo({
url: '../setting/share'
})
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight
console.log('??????????????', iSMT.value)
})
</script>
<style scoped>
.static-footer {
position: fixed;
bottom: 0;
}
.top {
height: 47vh;
background-color: white;
}
.bell {
height: 9.6vh;
display: flex;
align-items: flex-end;
justify-content: flex-end;
padding-right: 50rpx;
}
.image-bell {
width: 13px;
height: 16px;
}
.msg {
height: 10.7vh;
display: flex;
margin-top: 3vh;
margin-bottom: 3vh;
}
.msg-left {
width: 33.6vw;
display: flex;
justify-content: center;
align-items: center;
}
.avatar {
width: 175rpx;
height: 175rpx;
border-radius: 50%;
background-color: black;
}
.msg-center {
width: 51.7vw;
padding-left: 2.5vh;
display: flex;
flex-direction: column;
justify-content: center;
}
.userInfo {
font-size: 20px;
}
.userId {
font-size: 14px;
margin-top: 1vh;
}
.image-editName {
width: 40rpx;
height: 40rpx;
margin-left: 2vw;
}
.msg-right {
width: 14.7vw;
display: flex;
flex-direction: column;
justify-content: center;
}
.image-attendance {
width: 43rpx;
height: 43rpx;
}
.settings-buttons {
display: flex;
justify-content: space-around;
}
.setting-btn {
width: 349rpx;
height: 135rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: rgb(243, 243, 243);
border-radius: 8%;
}
.setting-icon {
width: 64.7rpx;
height: 64.7rpx;
margin-right: 25rpx;
}
.setting-btn text {
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.share {
height: 12.6vh;
display: flex;
justify-content: center;
align-items: center;
}
.img-share {
width: 720rpx;
height: 160rpx;
}
.bottom {
height: 44.5vh;
margin-top: 1vh;
background-color: rgb(255, 255, 255);
}
.list-item {
width: 670rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0rpx 40rpx;
border-bottom: 1rpx solid #eee;
}
.list-item:last-child{
border-bottom: none;
}
.list-icon {
width: 42rpx;
height: 42rpx;
margin-right: 18rpx;
}
.arrow {
margin-left: auto;
}
.update-tip {
display: flex;
color: #999;
font-size: 24rpx;
align-items: center;
margin-left: 200rpx;
justify-content: center;
}
.circle {
width: 10rpx;
height: 10rpx;
border-radius: 50%;
background-color: red;
margin-left: 10rpx;
}
.static-footer {
position: fixed;
bottom: 0;
}
.top {
height: 47vh;
background-color: white;
}
.bell {
height: 9.6vh;
display: flex;
align-items: flex-end;
justify-content: flex-end;
padding-right: 50rpx;
}
.image-bell {
width: 13px;
height: 16px;
}
.msg {
height: 10.7vh;
display: flex;
margin-top: 3vh;
margin-bottom: 3vh;
}
.msg-left {
width: 33.6vw;
display: flex;
justify-content: center;
align-items: center;
}
.avatar {
width: 175rpx;
height: 175rpx;
border-radius: 50%;
background-color: black;
}
.msg-center {
width: 51.7vw;
padding-left: 2.5vh;
display: flex;
flex-direction: column;
justify-content: center;
}
.userInfo {
font-size: 20px;
}
.userId {
font-size: 14px;
margin-top: 1vh;
}
.image-editName {
width: 40rpx;
height: 40rpx;
margin-left: 2vw;
}
.msg-right {
width: 14.7vw;
display: flex;
flex-direction: column;
justify-content: center;
}
.image-attendance {
width: 43rpx;
height: 43rpx;
}
.settings-buttons {
display: flex;
justify-content: space-around;
}
.setting-btn {
width: 349rpx;
height: 135rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: rgb(243, 243, 243);
border-radius: 8%;
}
.setting-icon {
width: 64.7rpx;
height: 64.7rpx;
margin-right: 25rpx;
}
.setting-btn text {
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.share {
height: 12.6vh;
display: flex;
justify-content: center;
align-items: center;
}
.img-share {
width: 720rpx;
height: 160rpx;
}
.bottom {
height: 44.5vh;
margin-top: 1vh;
background-color: rgb(255, 255, 255);
}
.list-item {
width: 670rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0rpx 40rpx;
border-bottom: 1rpx solid #eee;
}
.list-item:last-child {
border-bottom: none;
}
.list-icon {
width: 42rpx;
height: 42rpx;
margin-right: 18rpx;
}
.arrow {
margin-left: auto;
}
.update-tip {
display: flex;
color: #999;
font-size: 24rpx;
align-items: center;
margin-left: 200rpx;
justify-content: center;
}
.circle {
width: 10rpx;
height: 10rpx;
border-radius: 50%;
background-color: red;
margin-left: 10rpx;
}
</style>

25
pages/setting/account.vue
View File

@ -15,21 +15,21 @@
<view class="setting-item">
<text class="item-label">昵称</text>
<view class="item-right">
<text class="item-text">DeepChart</text>
<text class="item-text">{{userInfoRes.dcname}}</text>
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons>
</view>
</view>
<view class="setting-item">
<text class="item-label">ID</text>
<view class="item-right">
<text class="item-text">{{ jwcode }}</text>
<text class="item-text">{{ userInfoRes.dccode }}</text>
<uni-icons type="arrowright" size="16" class="arrow"></uni-icons>
</view>
</view>
<view class="setting-item">
<text class="item-label">密码</text>
<view class="item-right">
<text class="item-text">qwertyuiop</text>
<text class="item-text">{{userInfoRes.password}}</text>
<uni-icons type="eye" size="16" class="eye-icon"></uni-icons>
</view>
</view>
@ -71,10 +71,27 @@
ref,
onMounted
} from 'vue'
import {getUserInfo} from "@/api/member";
const iSMT = ref(0)
const jwcode = ref('90047681')
// const dccode = ref('')
const userInfoRes = ref({})
const showLogout = ref(false)
const userInfoPromise = getUserInfo()
userInfoPromise.then(res => {
if (res.code === 200){
userInfoRes.value.dccode = res.data.dccode;
userInfoRes.value.dcname = res.data.dcname;
userInfoRes.value.password = res.data.password;
console.log('用户信息', res.data)
}else{
uni.showToast({
title: '用户信息请求失败',
icon: 'none',
})
}
})
const handleConfirmLogout = () => {
showLogout.value = false
uni.showToast({

331
pages/setting/general.vue
View File

@ -1,165 +1,182 @@
<template>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view class="top">
<view class="top-list">
<text>语言</text>
<text class="language">中文（简体）</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="top-list" @click="goToFont">
<text>字体大小</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="top-list" @click="goToTheme">
<text>主题切换</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
<view class="center">
<view class="center-list" @click="goToMessage">
<text>消息推送</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
<view class="bottom">
<view class="bottom-list" @click="goToServer">
<text>切换服务器</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="bottom-list" @click="clearCache">
<text>清理缓存</text>
<text class="cache">{{ cache }}M</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
</view>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view class="top">
<view class="top-list">
<text>语言</text>
<text class="language">{{settingRes.language}}</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="top-list" @click="goToFont">
<text>字体大小</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="top-list" @click="goToTheme">
<text>主题切换</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
<view class="center">
<view class="center-list" @click="goToMessage">
<text>消息推送</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
<view class="bottom">
<view class="bottom-list" @click="goToServer">
<text>切换服务器</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
<view class="bottom-list" @click="clearCache">
<text>清理缓存</text>
<text class="cache">{{ cache }}M</text>
<uni-icons type="arrowright" size="16" class="arrow" />
</view>
</view>
</view>
</template>
<script setup>
import {
ref,
onMounted
} from 'vue'
const iSMT = ref(0)
const cache = ref('45.5')
const goToFont = () => {
uni.navigateTo({
url: '/pages/setting/font'
})
}
const goToTheme = () => {
uni.navigateTo({
url: '/pages/setting/theme'
})
}
const goToMessage = () => {
uni.navigateTo({
url: '/pages/setting/message'
})
}
const goToServer = () => {
uni.navigateTo({
url: '/pages/setting/server'
})
}
const clearCache = () => {
cache.value = 0
uni.showToast({
title: '清理成功',
icon: 'success',
duration: 1500
})
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
console.log('看看高度', iSMT.value)
})
import {
ref,
onMounted
} from 'vue'
import {getUserInfo} from "@/api/member";
const iSMT = ref(0)
const cache = ref('45.5')
const settingRes = ref({})
const settingPromise = getUserInfo()
settingPromise.then(res => {
if (res.code === 200){
settingRes.value.language = res.data.language;
settingRes.value.fontSize = res.data.fontSize;
settingRes.value.theme = res.data.theme;
settingRes.value.serverSelection = res.data.serverSelection;
console.log('用户信息', res.data)
}else {
console.log('用户信息请求失败：', res.message);
}
})
const goToFont = () => {
uni.navigateTo({
url: '/pages/setting/font'
})
}
const goToTheme = () => {
uni.navigateTo({
url: '/pages/setting/theme'
})
}
const goToMessage = () => {
uni.navigateTo({
url: '/pages/setting/message'
})
}
const goToServer = () => {
uni.navigateTo({
url: '/pages/setting/server'
})
}
const clearCache = () => {
cache.value = 0
uni.showToast({
title: '清理成功',
icon: 'success',
duration: 1500
})
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
console.log('看看高度', iSMT.value)
})
</script>
<style>
.top {
margin-top: 1.5vh;
height: 21vh;
background-color: white;
}
.top-list {
width: 630rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0 40rpx;
padding: 0 10rpx;
border-bottom: 1rpx solid #eee;
}
.top-list:last-child {
border-bottom: none;
}
.language {
margin-left: 55%;
font-size: 14px;
color: rgb(203, 203, 203);
}
.arrow {
margin-left: auto;
}
.center {
background-color: white;
height: 7vh;
display: flex;
align-items: center;
margin-top: 1vh;
}
.center-list {
width: 630rpx;
margin: 0rpx 40rpx;
display: flex;
padding: 0 10rpx;
}
.center-list>.arrow {
margin-right: 0;
}
.bottom {
height: 13.5vh;
background-color: white;
margin-top: 1vh;
}
.bottom-list {
width: 630rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0 40rpx;
padding: 0 10rpx;
border-bottom: 1rpx solid #eee;
}
.cache {
margin-left: 55%;
font-size: 14px;
color: rgb(203, 203, 203);
}
.bottom-list:last-child {
border-bottom: none;
}
.top {
margin-top: 1.5vh;
height: 21vh;
background-color: white;
}
.top-list {
width: 630rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0 40rpx;
padding: 0 10rpx;
border-bottom: 1rpx solid #eee;
}
.top-list:last-child {
border-bottom: none;
}
.language {
margin-left: 70%;
font-size: 14px;
color: rgb(203, 203, 203);
}
.arrow {
margin-left: auto;
}
.center {
background-color: white;
height: 7vh;
display: flex;
align-items: center;
margin-top: 1vh;
}
.center-list {
width: 630rpx;
margin: 0rpx 40rpx;
display: flex;
padding: 0 10rpx;
}
.center-list > .arrow {
margin-right: 0;
}
.bottom {
height: 13.5vh;
background-color: white;
margin-top: 1vh;
}
.bottom-list {
width: 630rpx;
height: 7vh;
display: flex;
align-items: center;
margin: 0 40rpx;
padding: 0 10rpx;
border-bottom: 1rpx solid #eee;
}
.cache {
margin-left: 55%;
font-size: 14px;
color: rgb(203, 203, 203);
}
.bottom-list:last-child {
border-bottom: none;
}
</style>

303
pages/setting/nextPwd.vue
View File

@ -1,144 +1,175 @@
<template>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view style="height:1.5vh;" />
<view class="title">
<text class="label">确认新密码</text>
</view>
<view class="top">
<view class="top-list">
<view class="left">
<img src="/static/my/unlock.png" />
<input type="password" :type="pwdType" placeholder="请输入新密码" class="input" />
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'"
@click="changeEye(1)" />
</view>
</view>
<view class="top-list">
<view class="left">
<img src="/static/my/unlock.png" />
<input type="password" :type="pwdType2" placeholder="再次确认" class="input" />
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'"
@click="changeEye(2)" />
</view>
</view>
<text class="tips">密码最少8位数</text>
</view>
<view class="bottom">
<button class="change-btn">确认</button>
</view>
</view>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view style="height:1.5vh;"/>
<view class="title">
<text class="label">确认新密码</text>
</view>
<view class="top">
<view class="top-list">
<view class="left">
<img src="/static/my/unlock.png"/>
<input type="password" :type="pwdType" placeholder="请输入新密码" class="input" v-model="oldPassword"
/>
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'"
@click="changeEye(1)"/>
</view>
</view>
<view class="top-list">
<view class="left">
<img src="/static/my/unlock.png"/>
<input type="password" :type="pwdType2" placeholder="再次确认" class="input" v-model="newPassword"/>
<img :src="pwdType === 1 ? '/static/my/hideEye.png' : '/static/my/openEye.png'"
@click="changeEye(2)"/>
</view>
</view>
<text class="tips">密码最少8位数</text>
</view>
<view class="bottom">
<button class="change-btn" @click="confirmChange">确认</button>
</view>
</view>
</template>
<script setup>
import {
ref,
onMounted
} from 'vue'
const iSMT = ref(0)
const pwdType = ref('password')
const pwdType2 = ref('password')
const changeEye = (type) => {
if (type === 1) {
pwdType.value = pwdType.value === 'password' ? 'text' : 'password'
} else {
pwdType2.value = pwdType2.value === 'password' ? 'text' : 'password'
}
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
console.log('看看高度', iSMT.value)
})
import {onMounted, ref} from 'vue'
import {updatePassword} from "@/api/setting/nextPwd";
const iSMT = ref(0)
const pwdType = ref('password')
const pwdType2 = ref('password')
// 绑定的数据 旧密码 新密码 确认密码
const oldPassword = ref('')
const newPassword = ref('')
// 点击确认按钮
const confirmChange = async () => {
if (newPassword.value !== oldPassword.value) {
uni.showToast({title: '两次输入的密码不一致', icon: 'none'})
return
}
const updatePasswordPromise = updatePassword({
oldPassword: oldPassword.value,
newPassword: newPassword.value
})
updatePasswordPromise
.then(res => {
if (res.code === 200) {
uni.showToast({ title: '修改成功', icon: 'success' });
} else {
uni.showToast({ title: res.message,icon: 'none' });
}
})
.catch(err => {
console.log('修改密码失败：', err);
});
}
const changeEye = (type) => {
if (type === 1) {
pwdType.value = pwdType.value === 'password' ? 'text' : 'password'
} else {
pwdType2.value = pwdType2.value === 'password' ? 'text' : 'password'
}
}
onMounted(() => {
// 状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
console.log('看看高度', iSMT.value)
})
</script>
<style>
.title {
height: 8.5vh;
background-color: white;
}
.label {
height: 8.5vh;
font-size: 40rpx;
font-weight: bold;
display: flex;
align-items: center;
padding: 0 60rpx;
}
.top {
height: auto;
background-color: white;
display: flex;
flex-direction: column;
align-items: center;
}
.top-list {
width: 630rpx;
height: 7vh;
margin: 0rpx 40rpx;
display: flex;
align-items: center;
border-bottom: 1rpx solid #eee;
}
.left {
flex: 1;
display: flex;
align-items: center;
}
.input {
flex: 1;
height: 70rpx;
font-size: 29rpx;
margin-left: 20rpx;
}
.bottom {
height: 22vh;
background-color: white;
display: flex;
align-items: center;
justify-content: center;
}
.change-btn {
height: 85rpx;
width: 610rpx;
padding: 0 20rpx;
background-color: black;
color: white;
border-radius: 40rpx;
display: flex;
align-items: center;
justify-content: center;
}
.img {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.tips {
font-size: 24rpx;
color: #999;
margin-top: 20rpx;
margin-left: 60rpx;
align-self: flex-start;
/* 这是左对齐 */
}
.title {
height: 8.5vh;
background-color: white;
}
.label {
height: 8.5vh;
font-size: 40rpx;
font-weight: bold;
display: flex;
align-items: center;
padding: 0 60rpx;
}
.top {
height: auto;
background-color: white;
display: flex;
flex-direction: column;
align-items: center;
}
.top-list {
width: 630rpx;
height: 7vh;
margin: 0rpx 40rpx;
display: flex;
align-items: center;
border-bottom: 1rpx solid #eee;
}
.left {
flex: 1;
display: flex;
align-items: center;
}
.input {
flex: 1;
height: 70rpx;
font-size: 29rpx;
margin-left: 20rpx;
}
.bottom {
height: 22vh;
background-color: white;
display: flex;
align-items: center;
justify-content: center;
}
.change-btn {
height: 85rpx;
width: 610rpx;
padding: 0 20rpx;
background-color: black;
color: white;
border-radius: 40rpx;
display: flex;
align-items: center;
justify-content: center;
}
.img {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.tips {
font-size: 24rpx;
color: #999;
margin-top: 20rpx;
margin-left: 60rpx;
align-self: flex-start;
/* 这是左对齐 */
}
</style>

362
pages/setting/password.vue
View File

@ -1,171 +1,207 @@
<template>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view class="tab">
<view class="tab-item" :class="{active: activeTab === 'email'}" @click="activeTab = 'email'">邮箱</view>
<view class="tab-item" :class="{active: activeTab === 'phone'}" @click="activeTab = 'phone'">手机号</view>
</view>
<view class="switch-tab">
<view class="input-list" v-if="activeTab === 'email'">
<image src="/static/my/changeEmail.png" mode="aspectFit"></image>
<input type="text" placeholder="请输入邮箱" class="input" />
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode">
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }}
</button>
</view>
<view class="input-list" v-else>
<image src="/static/my/changeBindPhone.png" mode="aspectFit"></image>
<input type="number" placeholder="请输入手机号" class="input" />
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode">
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }}
</button>
</view>
<view class="input-list">
<image src="/static/my/verification.png" mode="aspectFit"></image>
<input type="text" placeholder="请输入验证码" class="input" />
</view>
</view>
<view class="btn-area">
<button class="next-btn" @click="goToPwdNext">下一步</button>
</view>
</view>
<view class="main">
<view :style="{height:iSMT+'px'}"></view>
<view class="tab">
<view class="tab-item" :class="{active: activeTab === 'email'}" @click="activeTab = 'email'">邮箱</view>
<view class="tab-item" :class="{active: activeTab === 'phone'}" @click="activeTab = 'phone'">手机号</view>
</view>
<view class="switch-tab">
<view class="input-list" v-if="activeTab === 'email'">
<image src="/static/my/changeEmail.png" mode="aspectFit"></image>
<input type="text" placeholder="请输入邮箱" class="input" v-model="userEmail"/>
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode">
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }}
</button>
</view>
<view class="input-list" v-else>
<image src="/static/my/changeBindPhone.png" mode="aspectFit"></image>
<input type="number" placeholder="请输入手机号" class="input" v-model="userPhone"/>
<button class="code-btn" :class="{disabled: gettingCode}" @click="getCode" :disabled="gettingCode">
{{ gettingCode ? `重新发送 ${time}s` : '获取验证码' }}
</button>
</view>
<view class="input-list">
<image src="/static/my/verification.png" mode="aspectFit"></image>
<input type="text" placeholder="请输入验证码" class="input" v-model="verifyCode"/>
</view>
</view>
<view class="btn-area">
<button class="next-btn" @click="goToPwdNext">下一步</button>
</view>
</view>
</template>
<script setup>
import {
ref,
onMounted
} from 'vue'
const iSMT = ref(0)
const activeTab = ref('email')
const gettingCode = ref(false)
const time = ref(60)
const getCode = () => {
if (gettingCode.value) return
gettingCode.value = true
time.value = 60
const timer = setInterval(() => {
time.value--
if (time.value <= 0) {
clearInterval(timer)
gettingCode.value = false
time.value = 60
}
}, 1000)
}
const goToPwdNext = () =>{
uni.navigateTo({
url:'../setting/nextPwd'
})
}
onMounted(() => {
// 获取状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
})
import {
ref,
onMounted
} from 'vue'
import {sendEmail, validateCode} from "@/api/setting/password";
const iSMT = ref(0)
const activeTab = ref('email')
const gettingCode = ref(false)
const time = ref(60)
const userEmail = ref('')
const userPhone = ref('')
const verifyCode = ref('')
const getCode = () => {
if (gettingCode.value) return
gettingCode.value = true
time.value = 2
const timer = setInterval(() => {
time.value--
if (time.value <= 0) {
clearInterval(timer)
gettingCode.value = false
time.value = 2
}
}, 1000)
sendEmail({email: userEmail.value})
}
const goToPwdNext = () => {
if (!userEmail.value) {
uni.showToast({title: '请输入邮箱', icon: 'none'})
return
}
if (!verifyCode.value) {
uni.showToast({title: '请输入验证码', icon: 'none'})
return
}
try {
const res = validateCode({
loginType:'EMAIL',
account: userEmail.value,
verifyCode: verifyCode.value
})
console.log('validateCode 返回：', res)
// 如果返回成功
if (res.code === 200) {
uni.showToast({title: '验证成功', icon: 'success'})
uni.navigateTo({
url: '../setting/nextPwd'
})
} else {
uni.showToast({title: res.msg || '验证失败', icon: 'none'})
}
} catch (err) {
console.error(err)
uni.showToast({title: '请求出错', icon: 'none'})
}
}
onMounted(() => {
// 获取状态栏高度
iSMT.value = uni.getSystemInfoSync().statusBarHeight;
})
</script>
<style>
.tab {
display: flex;
height: 8vh;
background-color: #fff;
border-bottom: 1rpx solid #eee;
}
.tab-item {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
position: relative;
}
.tab-item.active {
color: #000;
font-weight: bold;
}
.tab-item.active::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 40rpx;
height: 6rpx;
background-color: #000;/* ????? */
}
.switch-tab {
background-color: #fff;
padding: 0 60rpx;
}
.input-list {
display: flex;
align-items: center;
justify-content: center;
height: 7vh;
border-bottom: 1rpx solid #eee;
}
.input-list image {
width: 40rpx;
height: 40rpx;
margin-right: 20rpx;
}
.input {
flex: 1;
height: 14vh;
font-size: 28rpx;
}
.code-btn {
width: 200rpx;
height: 60rpx;
font-size: 24rpx;
border-radius: 10rpx;
background-color: #eee;
color: #666;
display: flex;
align-items: center;
justify-content: center;
}
.code-btn.disabled {
background-color: #ccc;
color: #999;
}
.btn-area{
height:8vh;
background-color: white;
padding-top: 120rpx;
}
.next-btn {
width: 610rpx;
height: 85rpx;
background-color: #000;
color: #fff;
font-size: 30rpx;
border-radius: 40rpx;
display: flex;
align-items: center;
justify-content: center;
}
.tab {
display: flex;
height: 8vh;
background-color: #fff;
border-bottom: 1rpx solid #eee;
}
.tab-item {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
position: relative;
}
.tab-item.active {
color: #000;
font-weight: bold;
}
.tab-item.active::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 40rpx;
height: 6rpx;
background-color: #000; /* ????? */
}
.switch-tab {
background-color: #fff;
padding: 0 60rpx;
}
.input-list {
display: flex;
align-items: center;
justify-content: center;
height: 7vh;
border-bottom: 1rpx solid #eee;
}
.input-list image {
width: 40rpx;
height: 40rpx;
margin-right: 20rpx;
}
.input {
flex: 1;
height: 14vh;
font-size: 28rpx;
}
.code-btn {
width: 200rpx;
height: 60rpx;
font-size: 24rpx;
border-radius: 10rpx;
background-color: #eee;
color: #666;
display: flex;
align-items: center;
justify-content: center;
}
.code-btn.disabled {
background-color: #ccc;
color: #999;
}
.btn-area {
height: 8vh;
background-color: white;
padding-top: 120rpx;
}
.next-btn {
width: 610rpx;
height: 85rpx;
background-color: #000;
color: #fff;
font-size: 30rpx;
border-radius: 40rpx;
display: flex;
align-items: center;
justify-content: center;
}
</style>

7
utils/http.js
View File

@ -1,6 +1,7 @@
import { useUserStore } from "../stores/modules/userInfo"
const baseURL = "https://hwjb.homilychart.com/testApi"
// const baseURL = "https://hwjb.homilychart.com/testApi"
const baseURL = "http://192.168.40.8:9000"
const httpInterceptor = {
@ -39,8 +40,8 @@ const httpInterceptor = {
//4 添加token，优先用store，没有则回退到body中的token，保持与Apifox一致
const memberStore = useUserStore()
// const token = memberStore.userInfo?.token || options.data?.token
options.header.token = '790750702588f1ea79f24dc56ccd5d8a'
const token = '790750702588f1ea79f24dc56ccd5d8a'
options.header.token = '1'
const token = '1'
if (token) {
options.header.token = token
}

Write Preview
Loading…
Cancel
Save