feat:个人信息界面改动
This commit is contained in:
@@ -577,6 +577,22 @@ const local: any = {
|
|||||||
currentdevice:"The device is currently connected",
|
currentdevice:"The device is currently connected",
|
||||||
refresh:"Refresh",
|
refresh:"Refresh",
|
||||||
},
|
},
|
||||||
|
usercard:{
|
||||||
|
changeInfo:"Change Information",
|
||||||
|
resetpwd:"Reset password",
|
||||||
|
KYC:"KYC Certification",
|
||||||
|
deviceconsole:"Device management",
|
||||||
|
},
|
||||||
|
device:{
|
||||||
|
title: "Device management",
|
||||||
|
noDevices: "There are no devices yet",
|
||||||
|
confirmDelete: "Confirm deletion.",
|
||||||
|
deleteWarning: "Are you sure you want to remove the device {name}?",
|
||||||
|
deleteSuccess: "Deletion successful.",
|
||||||
|
deleteFailed: "Delete failed.",
|
||||||
|
fetchFailed: "Failed to retrieve the list of devices.",
|
||||||
|
lastActive: "Last active time.",
|
||||||
|
}
|
||||||
},
|
},
|
||||||
form: {
|
form: {
|
||||||
required: 'Cannot be empty',
|
required: 'Cannot be empty',
|
||||||
|
|||||||
@@ -577,6 +577,22 @@ const local:any = {
|
|||||||
currentdevice:"当前接入设备",
|
currentdevice:"当前接入设备",
|
||||||
refresh:"刷新",
|
refresh:"刷新",
|
||||||
},
|
},
|
||||||
|
usercard:{
|
||||||
|
changeInfo:"修改信息",
|
||||||
|
resetpwd:"修改密码",
|
||||||
|
KYC:"KYC认证",
|
||||||
|
deviceconsole:"设备管理",
|
||||||
|
},
|
||||||
|
device:{
|
||||||
|
title: "设备管理",
|
||||||
|
noDevices: "暂无设备",
|
||||||
|
confirmDelete: "确认删除",
|
||||||
|
deleteWarning: "确定要删除设备 {name} 吗?",
|
||||||
|
deleteSuccess: "删除成功",
|
||||||
|
deleteFailed: "删除失败",
|
||||||
|
fetchFailed: "获取设备列表失败",
|
||||||
|
lastActive: "最后活跃时间",
|
||||||
|
}
|
||||||
},
|
},
|
||||||
form: {
|
form: {
|
||||||
required: '不能为空',
|
required: '不能为空',
|
||||||
|
|||||||
@@ -321,10 +321,9 @@ export const customRoutes: GeneratedRoute[] = [
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'user-info',
|
name: 'user-info/usercard',
|
||||||
path: '/userInfo',
|
path: '/userInfo/usercard',
|
||||||
component: 'layout.base$view.userInfo',
|
component: 'layout.base',
|
||||||
redirect: '/userInfo/index',
|
|
||||||
meta: {
|
meta: {
|
||||||
title: '个人信息',
|
title: '个人信息',
|
||||||
i18nKey: 'view.userInfo',
|
i18nKey: 'view.userInfo',
|
||||||
@@ -333,22 +332,46 @@ export const customRoutes: GeneratedRoute[] = [
|
|||||||
},
|
},
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
name: 'user-info_index',
|
name: 'user-info_usercard',
|
||||||
path: 'index',
|
path: '/userInfo/usercard',
|
||||||
component: 'view.userInfo.index',
|
component: 'view.userInfo_usercard',
|
||||||
meta: {
|
meta: {
|
||||||
title: '个人信息',
|
title: '个人信息',
|
||||||
i18nKey: 'view.userInfo_index',
|
i18nKey: 'view.userInfo',
|
||||||
|
order: 17,
|
||||||
hideInMenu: true
|
hideInMenu: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'user-info_profile',
|
name: 'user-info_profile',
|
||||||
path: 'profile',
|
path: '/userInfo/profile',
|
||||||
component: 'view.userInfo.profile',
|
component: 'view.userInfo_profile',
|
||||||
meta: {
|
meta: {
|
||||||
title: '个人资料',
|
title: '个人资料',
|
||||||
i18nKey: 'view.userInfo_profile',
|
i18nKey: 'view.userInfo_profile',
|
||||||
|
order:18,
|
||||||
|
hideInMenu: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'user-info_resetpwd',
|
||||||
|
path: '/userInfo/resetpwd',
|
||||||
|
component: 'view.userInfo_resetpwd',
|
||||||
|
meta: {
|
||||||
|
title: '修改密码',
|
||||||
|
i18nKey: 'view.userInfo_resetpwd',
|
||||||
|
order:18,
|
||||||
|
hideInMenu: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'user-info_device',
|
||||||
|
path: '/userInfo/device',
|
||||||
|
component: 'view.userInfo_device',
|
||||||
|
meta: {
|
||||||
|
title: '设备管理',
|
||||||
|
i18nKey: 'view.userInfo_device',
|
||||||
|
order:19,
|
||||||
hideInMenu: true
|
hideInMenu: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
1
src/typings/components.d.ts
vendored
1
src/typings/components.d.ts
vendored
@@ -19,6 +19,7 @@ declare module 'vue' {
|
|||||||
ADivider: typeof import('ant-design-vue/es')['Divider']
|
ADivider: typeof import('ant-design-vue/es')['Divider']
|
||||||
ADrawer: typeof import('ant-design-vue/es')['Drawer']
|
ADrawer: typeof import('ant-design-vue/es')['Drawer']
|
||||||
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
|
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
|
||||||
|
AEmpty: typeof import('ant-design-vue/es')['Empty']
|
||||||
AForm: typeof import('ant-design-vue/es')['Form']
|
AForm: typeof import('ant-design-vue/es')['Form']
|
||||||
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
||||||
AImage: typeof import('ant-design-vue/es')['Image']
|
AImage: typeof import('ant-design-vue/es')['Image']
|
||||||
|
|||||||
@@ -1,76 +1,60 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useAuthStore } from '@/store/modules/auth';
|
import { useAuthStore } from '@/store/modules/auth';
|
||||||
import {clientUnAuth,clientAuth, clientInfo} from '@/service/ue/client';
|
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { ref, computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import { UserOutlined } from '@ant-design/icons-vue';
|
import { UserOutlined, LockOutlined, SafetyCertificateOutlined, MobileOutlined, RightOutlined} from '@ant-design/icons-vue';
|
||||||
|
import { useRouterPush } from '@/hooks/common/router';
|
||||||
|
import {useI18n} from "vue-i18n";
|
||||||
|
|
||||||
|
const {t} = useI18n();
|
||||||
|
|
||||||
|
// 添加用户信息的类型定义
|
||||||
|
interface UserInfo {
|
||||||
|
avatar?: string;
|
||||||
|
nickName?: string;
|
||||||
|
userName?: string;
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
const user = computed(() => authStore.userInfo?.user || null);
|
const { toLogin } = useRouterPush();
|
||||||
|
// 添加类型断言
|
||||||
|
const user = computed<UserInfo | null>(() => authStore.userInfo?.user || null);
|
||||||
|
|
||||||
const menuItems = [
|
const menuItems = [
|
||||||
{
|
{
|
||||||
icon: 'i-carbon:user-profile',
|
icon: UserOutlined,
|
||||||
title: '个人信息',
|
title: t('page.usercard.changeInfo'),
|
||||||
path: '/user/profile'
|
path: 'profile'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: 'i-carbon:password',
|
icon: LockOutlined,
|
||||||
title: '修改密码',
|
title: t('page.usercard.resetpwd'),
|
||||||
path: '/user/change-password'
|
path: 'resetpwd'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: 'i-carbon:security',
|
icon: SafetyCertificateOutlined,
|
||||||
title: 'KYC认证',
|
title: t('page.usercard.KYC'),
|
||||||
path: '/user/kyc'
|
path: '/user/kyc'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
icon: 'i-carbon:devices',
|
icon: MobileOutlined,
|
||||||
title: '设备管理',
|
title: t('page.usercard.deviceconsole'),
|
||||||
path: '/user/devices'
|
path: 'device'
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: 'i-carbon:devices',
|
|
||||||
title: '终端上网',
|
|
||||||
path: 'auth'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: 'i-carbon:devices',
|
|
||||||
title: '终端下线',
|
|
||||||
path: 'unauth'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
icon: 'i-carbon:devices',
|
|
||||||
title: '终端信息',
|
|
||||||
path: 'info'
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
const infoC = ref({})
|
|
||||||
const handleMenuClick = (path: string) => {
|
const handleMenuClick = (path: string) => {
|
||||||
if(path==="auth"){
|
if (path === '_reset_pwd') {
|
||||||
clientAuth().then((res)=>{
|
toLogin('reset-pwd');
|
||||||
console.log(res)
|
return;
|
||||||
infoC.value = res.data
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
}
|
||||||
if(path==="unauth"){
|
if (path.startsWith('/')) {
|
||||||
clientUnAuth().then((res)=>{
|
router.push(path);
|
||||||
console.log(res)
|
} else {
|
||||||
infoC.value = res.data
|
router.push(`/userInfo/${path}`);
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
}
|
||||||
if(path==="info"){
|
|
||||||
clientInfo().then((res)=>{
|
|
||||||
console.log(res)
|
|
||||||
infoC.value = res.data
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
router.push(path);
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -106,20 +90,19 @@ const handleMenuClick = (path: string) => {
|
|||||||
>
|
>
|
||||||
<div class="menu-content">
|
<div class="menu-content">
|
||||||
<div class="icon-wrapper">
|
<div class="icon-wrapper">
|
||||||
<div :class="item.icon"></div>
|
<component :is="item.icon" />
|
||||||
</div>
|
</div>
|
||||||
<span>{{ item.title }}</span>
|
<span>{{ item.title }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="i-carbon:chevron-right"></div>
|
<RightOutlined />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{{infoC || '无信息'}}
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
/* 移动优先的响应式设计 */
|
/* 移优先的响应式设计 */
|
||||||
.user-center {
|
.user-center {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
@@ -215,11 +198,7 @@ const handleMenuClick = (path: string) => {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
}
|
color: #666;
|
||||||
|
|
||||||
[class^="i-"] {
|
|
||||||
width: 20px;
|
|
||||||
height: 20px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 平板设备断点 */
|
/* 平板设备断点 */
|
||||||
Reference in New Issue
Block a user