first commit

This commit is contained in:
云泽网
2025-07-27 21:42:34 +08:00
commit c1cce5ccb4
2779 changed files with 340042 additions and 0 deletions
@@ -0,0 +1,702 @@
<template>
<view class="user-profile-container mt10">
<view class="user-profile">
<view class="user-avatar-box row-start" @click="handleUser">
<!-- <button
class="column column-center"
hover-class="none"
open-type="chooseAvatar"
@chooseavatar="onChooseAvatar"
@click="onChooseAvatar"
>
</button> -->
<image
class="user-avatar"
:src="
userInfo.avatar != ''
? userInfo.avatar
: '../../static/images/default_avatar.png'
"
@click="handleUser"
>
</image>
<view class="row-between flex1">
<view class="ml30 text-name">
<view class="">
{{ userInfo.nickname }}
</view>
<view> ID:{{ userInfo.sn }} </view>
</view>
<u-icon name="arrow-right" />
</view>
<!-- <view class="muted xs" @click="handleUser">点击修改头像</view> -->
</view>
<!-- <view class="row-info row bdb-line" @click="changeName">
<view class="label md">昵称</view>
<view class="md row" style="flex: 1">{{ userInfo.nickname }}</view>
<u-icon name="arrow-right" />
</view> -->
<!-- <view class="row-info row bdb-line" @click="changeSex()">
<view class="label md">性别</view>
<view class="md row" :class="userInfo.sex == 0 ? 'muted' : ''" style="flex: 1">
{{ userInfo.sex == 0 ? '未设置' : userInfo.sex == 1 ? '男' : '女' }}
</view>
<u-icon name="arrow-right" />
</view> -->
<!-- <view class="row-info row bdb-line">
<view class="label md">手机号</view>
<view class="md row" :class="{ muted: !userInfo.mobile }" style="flex: 1">
{{ userInfo.mobile ? userInfo.mobile : '未绑定' }}
</view> -->
<!-- #ifdef H5 || APP-PLUS -->
<!-- <view class="bd-btn br60 row-center" @click="showModifyMobile">
{{ userInfo.mobile ? '更换手机号' : '绑定手机号' }}
</view> -->
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<!-- <button
class="bd-btn br60 row-center"
size="sm"
open-type="getPhoneNumber"
@getphonenumber="getPhoneNumber"
>
{{ userInfo.mobile ? '更换手机号' : '绑定手机号' }}
</button> -->
<!-- #endif -->
<!-- </view> -->
<view class="row-info row-between bdb-line mt10" @tap="toSetPayPwd">
<view class="label md">转账密码</view>
<u-icon name="arrow-right" />
</view>
<!-- #ifdef H5 -->
<view class="row-info row-between bdb-line" @tap="bindWechat" v-if="!userInfo.oa_auth">
<view class="label md">微信授权</view>
<u-icon name="arrow-right" />
</view>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<view class="row-info row-between" @click="showPwdPop">
<view class="label md">登录密码</view>
<view class="row">
<view class="muted nr">点击设置</view>
<u-icon name="arrow-right" />
</view>
</view>
<!-- #endif -->
<view class="row-info row-between bdb-line mt10" @click="goToExplain(0)">
<view class="label md">服务协议</view>
<u-icon name="arrow-right" />
</view>
<view class="row-info row-between bdb-line" @click="goToExplain(1)">
<view class="label md">隐私政策</view>
<u-icon name="arrow-right" />
</view>
<view class="row-info row-between bdb-line" @click="goLicense()">
<view class="label md">版权信息</view>
<u-icon name="arrow-right" />
</view>
<view class="row-info row-between">
<view class="label md">关于我们</view>
<view>v{{ version }}</view>
</view>
<view class="bg-primary white save-btn row-center lg" @click="logout">退出登录</view>
<!-- 版权信息 -->
<view class="license xs" v-if="appConfig.copyright_info">
<view>{{ appConfig.copyright_info }}</view>
<view>{{ appConfig.icp_number }}</view>
</view>
</view>
<u-popup type="center" closeable v-model="showMobile" mode="center" border-radius="14">
<view class="modify-container column-center bg-white" v-show="showMobile">
<view class="title xl">{{ userInfo.mobile ? '更换手机号' : '绑定手机号' }}</view>
<view class="modify-row row" v-if="userInfo.mobile">
<view style="width: 56px; border-right: 1px solid #e5e5e5">+86</view>
<view style="margin-left: 15px">{{ userInfo.mobile }}</view>
</view>
<view class="modify-row row" v-else>
<view style="width: 71px">手机号</view>
<input v-model="new_mobile" placeholder="请输入绑定手机号" />
</view>
<view class="modify-row row">
<view style="width: 71px">验证码</view>
<input
v-model="smsCode"
style="padding-left: 5px; width: 130px"
placeholder="请输入验证码"
/>
<view class="send-code-btn nr row-center" @click="$sendSms">
<u-verification-code
:keep-running="true"
ref="uCode"
@change="codeChange"
unique-key="page-b"
>
</u-verification-code>
<view class="xs">{{ tips }}</view>
</view>
</view>
<view class="modify-row row" v-if="userInfo.mobile">
<view style="width: 71px">新手机号</view>
<input v-model="new_mobile" placeholder="请输入新的手机号码" />
</view>
<view class="primary mt10"
>{{
userInfo.mobile ? '更改' : '绑定'
}}手机号码成功后您的账号将会变更为该设置号码</view
>
<view class="btn bg-primary white row-center" @click="$changeUserMobile">确定</view>
</view>
</u-popup>
<!-- 昵称修改组件 -->
<u-popup
v-model="showNickName"
:closeable="true"
:maskCloseAble="false"
mode="center"
border-radius="14"
>
<view
class="modify-container column-center bg-white"
style="width: 70vw; padding: 24rpx"
>
<view class="title xl">修改用户名</view>
<form @submit="changeNameConfirm">
<u-form-item label="新昵称" :labelWidth="120">
<input
style="height: 60rpx"
class="nr"
:value="userInfo.nickname"
name="nickname"
type="nickname"
placeholder="请输入新的昵称"
/>
</u-form-item>
<button class="btn bg-primary white row-center" form-type="submit">确定</button>
</form>
</view>
</u-popup>
<u-popup v-model="showPwd" closeable mode="center" border-radius="14">
<view class="modify-container column-center bg-white" v-show="showPwd">
<view class="title xl">设置密码</view>
<view class="modify-row row">
<view style="width: 56px; border-right: 1px solid #e5e5e5">+86</view>
<view style="margin-left: 15px">{{ userInfo.mobile }}</view>
</view>
<view class="modify-row row">
<view style="width: 142rpx">验证码</view>
<input
v-model="smsCode"
style="padding-left: 10rpx; width: 260rpx"
placeholder="请输入验证码"
/>
<view class="send-code-btn nr row-center" @click="$sendSms">
<u-verification-code
:keep-running="true"
ref="uCode"
@change="codeChange"
unique-key="page-a"
>
</u-verification-code>
<view class="xs">{{ tips }}</view>
</view>
</view>
<view class="modify-row row">
<view style="width: 71px">设置密码</view>
<input type="password" v-model="pwd" placeholder="请输入新密码" />
</view>
<view class="modify-row row">
<view style="width: 71px">确认密码</view>
<input type="password" v-model="comfirmPwd" placeholder="再次输入新密码确认" />
</view>
<view class="btn bg-primary white row-center" @click="$forgetPwd">确定</view>
</view>
</u-popup>
<u-picker
mode="selector"
v-model="showPicker"
:default-selector="[0]"
:range="sexList"
@confirm="onConfirm"
/>
<view class="xs muted" style="margin: 50rpx 0;">
<view class="row-center">
likeshop 提供免费开源商城系统
</view>
<view class="row-center">
© likeshop.cn
</view>
</view>
</view>
</template>
<script>
import { userLogout, getUserInfo, changeUserMobile, setUserInfo, setWechatInfo } from '@/api/user'
import { version } from '@/config/app'
import { sendSms, forgetPwd } from '@/api/app'
import { bindOawechat } from '@/api/user'
import { SMSType } from '@/utils/type'
import { mapState, mapGetters } from 'vuex'
import { uploadFile, isWeixinClient, trottle } from '@/utils/tools'
import { getWxCode, getUserProfile } from '@/utils/login'
import wechath5 from '@/utils/wechath5'
const FieldType = {
NONE: '',
SEX: 'sex',
NICKNAME: 'nickname',
AVATAR: 'avatar',
MOBILE: 'mobile'
}
export default {
name: 'userProfile',
data() {
return {
version: version,
fileList: [],
userInfo: {},
new_mobile: '',
smsCode: '',
newNickname: '',
sexList: ['男', '女'],
fieldType: FieldType.NONE,
showPicker: false,
showMobile: false,
showPwd: false,
showNickName: false,
tips: '',
canSendSms: true,
pwd: '',
comfirmPwd: '',
smsType: SMSType.FINDPWD,
code: ''
}
},
methods: {
oaAuth() {
wechath5.getWxUrl()
},
bindWechat() {
this.oaAuth()
},
handleUser() {
console.log(123465)
uni.redirectTo({
url: '/bundle/pages/user_set/user_set'
})
},
codeChange(text) {
this.tips = text
},
onChooseAvatar(e) {
this.fieldType = FieldType.AVATAR
// #ifndef MP-WEIXIN
// 此为uView的跳转方法,详见"文档-JS"部分,也可以用uni的uni.navigateTo
uni.$u.route({
// 关于此路径,请见下方"注意事项"
url: '/components/uview-ui/components/u-avatar-cropper/u-avatar-cropper',
// 内部已设置以下默认参数值,可不传这些参数
params: {
// 输出图片宽度,高等于宽,单位px
destWidth: 300,
// 裁剪框宽度,高等于宽,单位px
rectWidth: 200,
// 输出的图片类型,如果'png'类型发现裁剪的图片太大,改成"jpg"即可
fileType: 'jpg'
}
})
// #endif
// #ifdef MP-WEIXIN
if (e.detail.avatarUrl) {
console.log(e.detail.avatarUrl)
this.uploadImage(e.detail.avatarUrl)
}
// #endif
},
// 修改用户昵称
async changeNameConfirm(e) {
this.fieldType = FieldType.NICKNAME
this.newNickname = e.detail.value.nickname
if (!this.newNickname)
return this.$toast({
title: '请输入新的昵称'
})
await this.$setUserInfo(this.newNickname)
this.showNickName = false
},
// end
logout() {
// 退出登录
userLogout({
token: this.token
}).then((res) => {
if (res.code == 1) {
this.$store.commit('LOGOUT')
this.$toast({
title: '退出成功'
})
setTimeout(() => {
uni.redirectTo({
url: '/pages/login/login'
})
}, 500)
}
})
},
goToExplain(value) {
uni.navigateTo({
url: '/bundle/pages/server_explan/server_explan?type=' + value
})
},
goLicense() {
uni.navigateTo({
url: '/bundle/pages/license/license'
})
},
toSetPayPwd() {
if (!this.userInfo.mobile)
return this.$toast({
title: '请先设置手机号'
})
uni.navigateTo({
url: '/bundle/pages/set_pay_pwd/set_pay_pwd'
})
},
// 发送短信
$sendSms(type) {
if (!this.canSendSms) return
sendSms({
mobile: this.userInfo.mobile || this.new_mobile,
key: this.smsType
}).then((res) => {
if (res.code == 1) {
this.$toast({
title: res.msg
})
this.$refs.uCode.start()
}
})
},
$getUserInfo() {
getUserInfo().then((res) => {
if (res.code == 1) {
this.userInfo = res.data
}
})
},
// 更换手机号
showModifyMobile() {
this.smsCode = ''
this.new_mobile = ''
this.showMobile = true
this.smsType = this.userInfo.mobile ? SMSType.CHANGE_MOBILE : SMSType.BIND
},
$changeUserMobile() {
if (!this.smsCode) {
this.$toast({
title: '请输入验证码'
})
return
}
if (!this.new_mobile) {
this.$toast({
title: '请输入新的手机号码'
})
return
}
changeUserMobile({
mobile: this.userInfo.mobile,
new_mobile: this.new_mobile,
code: this.smsCode,
action: this.userInfo.mobile ? 'change' : ''
}).then((res) => {
if (res.code == 1) {
this.showMobile = false
this.$toast({
title: res.msg
})
this.$getUserInfo()
}
})
},
// end
// 修改用户信息
async $setUserInfo(value) {
const res = await setUserInfo({
field: this.fieldType,
value: value
})
if (res.code == 1) {
this.$toast({
title: res.msg
})
this.$getUserInfo()
}
},
// end
timeChange(timestamp) {
console.log(timestamp, 'timestamp')
},
onConfirm(value) {
this.$setUserInfo(value[0] + 1)
this.showPicker = false
},
changeSex(e) {
this.showPicker = true
this.fieldType = FieldType.SEX
},
// 定时器完成
countDownFinish() {
this.canSendSms = true
},
// 修改密码
showPwdPop() {
if (!this.userInfo.mobile) {
this.$toast({
title: '请绑定手机后再设置密码'
})
return
}
this.smsCode = ''
this.smsType = SMSType.FINDPWD
this.showPwd = true
},
$forgetPwd() {
let { smsCode, pwd, comfirmPwd } = this
if (!smsCode) {
this.$toast({
title: '请填写短信验证码'
})
return
}
if (!pwd) {
this.$toast({
title: '请输入新密码'
})
return
}
if (!comfirmPwd) {
this.$toast({
title: '再次输入新密码确认'
})
return
}
if (pwd != comfirmPwd) {
this.$toast({
title: '两次密码输入不一致'
})
return
}
let data = {
mobile: this.userInfo.mobile,
code: smsCode,
password: pwd,
repassword: comfirmPwd
}
forgetPwd(data).then((res) => {
if (res.code == 1) {
this.showPwd = false
this.$toast({
title: '设置密码成功'
})
this.$getUserInfo()
}
})
},
// end
// 修改昵称
changeName() {
this.fieldType = FieldType.NICKNAME
this.newNickname = ''
this.showNickName = true
},
// end
async getPhoneNumber(e) {
const { encryptedData, iv } = e.detail
let data = {
code: this.code,
encrypted_data: encryptedData,
iv
}
this.fieldType = FieldType.MOBILE
if (encryptedData) {
this.$changeUserMobileMP(data)
}
},
$changeUserMobileMP(data) {
changeUserMobile(data).then((res) => {
if (res.code == 1) {
this.$toast({
title: res.msg
})
this.$getUserInfo()
}
// #ifdef MP-WEIXIN
getWxCode().then((res) => {
this.code = res
})
// #endif
})
},
uploadImage(path) {
uni.showLoading({
title: '正在上传中...',
mask: true
})
uploadFile(path)
.then((res) => {
uni.hideLoading()
this.$setUserInfo(res.url)
})
.catch(() => {
uni.hideLoading()
this.$toast({
title: '上传失败'
})
})
}
},
async onLoad(options) {
// #ifdef H5
const bindCode = options.code
if (bindCode) {
if (Array.isArray(bindCode)) bindCode = bindCode.pop()
await bindOawechat({ code: bindCode })
}
// #endif
this.$getUserInfo()
// #ifdef MP-WEIXIN
getWxCode().then((res) => {
this.code = res
})
// #endif
// 监听从裁剪页发布的事件,获得裁剪结果
uni.$on('uAvatarCropper', (path) => {
console.log(path)
this.uploadImage(path)
})
this.getUserProfile = trottle(this.getUserProfile, 500, this)
},
onUnload() {
uni.$off('uAvatarCropper')
},
computed: {
...mapState(['token']),
...mapGetters(['appConfig'])
}
}
</script>
<style lang="scss">
.user-profile-container {
.user-profile {
border-top-left-radius: 28rpx;
border-top-right-radius: 28rpx;
.user-avatar-box {
padding: 30rpx 20rpx;
background-color: white;
border-top-left-radius: 28rpx;
border-top-right-radius: 28rpx;
.user-avatar {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
}
}
.row-info {
padding: 30rpx 20rpx;
background-color: white;
.label {
width: 180rpx;
}
.bd-btn {
padding: 8rpx 24rpx;
border: 1px solid $-color-primary;
color: $-color-primary;
}
}
.license {
margin-top: 80rpx;
color: #a7a7a7;
text-align: center;
}
.bdb-line {
border-bottom: 1rpx solid #e5e5e5;
}
.save-btn {
margin-top: 40rpx;
height: 88rpx;
margin-left: 54rpx;
margin-right: 54rpx;
border-radius: 10rpx;
box-sizing: border-box;
}
.updata-btn {
margin: 0 30rpx;
margin-top: 40rpx;
background-color: #0cc267;
}
}
.modify-container {
padding-left: 30rpx;
padding-right: 30rpx;
padding-bottom: 30rpx;
width: 580rpx;
border-radius: 30rpx;
background-color: $-color-white;
.title {
padding: 26rpx 0rpx;
}
.modify-row {
padding: 32rpx 0rpx;
width: 100%;
border-bottom: 1rpx solid #e5e5e5;
.send-code-btn {
border: 1px solid $-color-primary;
width: 184rpx;
height: 62rpx;
color: $-color-primary;
}
}
.btn {
height: 80rpx;
padding: 0 180rpx;
border-radius: 20rpx;
margin-top: 60rpx;
}
}
}
.text-name {
display: flex;
flex-direction: column;
justify-content: space-around;
}
</style>