AccountDetail.vue
2.64 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<template>
<div>
<PageWrapper :title="t('system.account.detail.title')" contentBackground @back="goBack">
<Description size="middle" @register="register" />
</PageWrapper>
</div>
</template>
<script>
import { defineComponent } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { PageWrapper } from '/@/components/Page';
import { Description } from '../../../components/Description';
import { getAccountInfo } from '../../../api/system/system';
import { accountSchema } from './account.detail.data';
import { useDescription } from '../../../components/Description';
import { useTabs } from '/@/hooks/web/useTabs';
import { useI18n } from '/@/hooks/web/useI18n';
const accountData = {};
export default defineComponent({
name: 'AccountDetail',
components: { PageWrapper, Description },
setup() {
const { t } = useI18n();
const route = useRoute();
const ROUTER = useRouter();
const { setTitle, close } = useTabs();
const [register, { setDescProps }] = useDescription({
title: t('system.account.detail.tableTitle'),
data: accountData,
schema: accountSchema,
column: 3,
});
getAccountInfo(route.params?.id).then((result) => {
Reflect.set(accountData, 'remark', result.remark);
Reflect.set(accountData, 'realName', result.realName);
Reflect.set(accountData, 'phoneNumber', result.phoneNumber);
Reflect.set(accountData, 'email', result.email);
Reflect.set(accountData, 'username', result.username);
Reflect.set(
accountData,
'enabled',
result.enabled
? t('system.account.table.normal')
: !result.enabled
? t('system.account.table.disabled')
: t('system.account.table.expired')
);
Reflect.set(accountData, 'accountExpireTime', result.accountExpireTime);
Reflect.set(accountData, 'createTime', result.createTime);
Reflect.set(accountData, 'updateTime', result.updateTime);
// 设置Tab的标题（不会影响页面标题）
setTitle(t('system.account.detail.setTitle') + result.realName);
setDescProps(accountData);
});
// 页面左侧点击返回链接时的操作
function goBack() {
// 本例的效果时点击返回始终跳转到账号列表页，实际应用时可返回上一页
close();
ROUTER.go(-1);
// go('/system/account');
}
return { goBack, accountSchema, accountData, register, t };
},
});
</script>
<style scoped>
.vben-collapse-container {
background-color: white !important;
}
</style>