houzhongjian
2024-08-08 820397e43a0b64d35c6d31d2a55475061438593b
提交 | 用户 | 时间
820397 1 <template>
H 2   <Dialog v-model="dialogVisible" title="详情" width="800">
3     <el-descriptions :column="1" border>
4       <el-descriptions-item label="社交平台" min-width="160">
5         <dict-tag :type="DICT_TYPE.SYSTEM_SOCIAL_TYPE" :value="detailData.type" />
6       </el-descriptions-item>
7       <el-descriptions-item label="用户昵称" min-width="120">
8         {{ detailData.nickname }}
9       </el-descriptions-item>
10       <el-descriptions label="用户头像" min-width="120">
11         <el-image :src="detailData.avatar" class="h-30px w-30px" />
12       </el-descriptions>
13       <el-descriptions-item label="社交 token" min-width="120">
14         {{ detailData.token }}
15       </el-descriptions-item>
16       <el-descriptions-item label="原始 Token 数据" min-width="120">
17         <el-input
18           v-model="detailData.rawTokenInfo"
19           :autosize="{ maxRows: 20 }"
20           :readonly="true"
21           type="textarea"
22         />
23       </el-descriptions-item>
24       <el-descriptions-item label="原始 User 数据" min-width="120">
25         <el-input
26           v-model="detailData.rawUserInfo"
27           :autosize="{ maxRows: 20 }"
28           :readonly="true"
29           type="textarea"
30         />
31       </el-descriptions-item>
32       <el-descriptions-item label="最后一次的认证 code" min-width="120">
33         {{ detailData.code }}
34       </el-descriptions-item>
35       <el-descriptions-item label="最后一次的认证 state" min-width="120">
36         {{ detailData.state }}
37       </el-descriptions-item>
38     </el-descriptions>
39   </Dialog>
40 </template>
41 <script lang="ts" setup>
42 import { DICT_TYPE } from '@/utils/dict'
43 import * as SocialUserApi from '@/api/system/social/user'
44
45 const dialogVisible = ref(false) // 弹窗的是否展示
46 const detailLoading = ref(false) // 表单的加载中
47 const detailData = ref({} as SocialUserApi.SocialUserVO) // 详情数据
48
49 /** 打开弹窗 */
50 const open = async (id: number) => {
51   dialogVisible.value = true
52   // 设置数据
53   try {
54     detailData.value = await SocialUserApi.getSocialUser(id)
55   } finally {
56     detailLoading.value = false
57   }
58 }
59 defineExpose({ open }) // 提供 open 方法,用于打开弹窗
60 </script>