111 lines
4.7 KiB
Vue
111 lines
4.7 KiB
Vue
<template>
|
|
<div>
|
|
<n-modal
|
|
v-model:show="showModal"
|
|
:mask-closable="false"
|
|
:show-icon="false"
|
|
preset="dialog"
|
|
transform-origin="center"
|
|
:title="'IM用户详情 #' + formValue.userId"
|
|
:style="{
|
|
width: dialogWidth,
|
|
}"
|
|
>
|
|
<n-scrollbar style="max-height: 87vh" class="pr-5">
|
|
<n-spin :show="loading" description="请稍候...">
|
|
<n-descriptions label-placement="left" bordered :column="settingStore.isMobile ? 1 : 2">
|
|
<n-descriptions-item label="租户">{{ formValue.tenantName }}</n-descriptions-item>
|
|
<n-descriptions-item label="用户ID">{{ formValue.userId }}</n-descriptions-item>
|
|
<n-descriptions-item label="昵称">{{ formValue.nickname || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="公开账号">{{ formValue.publicAccount || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="状态">{{ stateLabel }}</n-descriptions-item>
|
|
<n-descriptions-item label="认证版本">{{ formValue.authVersion }}</n-descriptions-item>
|
|
<n-descriptions-item label="登录标识">{{ formValue.authNames || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="凭证">{{ formValue.credentials || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="性别">{{ formValue.gender || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="地区">{{ formValue.region || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="出生日期">{{ formValue.birthDate || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="密码更新时间">
|
|
{{ formValue.passwordUpdatedAt || '-' }}
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="最后在线">{{ formValue.lastSeen || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="资料版本">{{ formValue.profileVersion }}</n-descriptions-item>
|
|
<n-descriptions-item label="创建时间">{{ formValue.createdAt || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="修改时间">{{ formValue.updatedAt || '-' }}</n-descriptions-item>
|
|
<n-descriptions-item label="客户端" :span="2">
|
|
{{ formValue.userAgent || '-' }}
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="个性签名" :span="2">
|
|
{{ formValue.signature || '-' }}
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="头像文件ID" :span="2">
|
|
{{ formValue.avatarFileId || '-' }}
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="访问权限" :span="2">
|
|
<n-code :code="formValue.accessJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="Public资料" :span="2">
|
|
<n-code :code="formValue.profileJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="Trusted资料" :span="2">
|
|
<n-code :code="formValue.trustedJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
<n-descriptions-item label="Tags" :span="2">
|
|
<n-code :code="formValue.tagsJson || '-'" language="json" word-wrap />
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
</n-spin>
|
|
</n-scrollbar>
|
|
<template #action>
|
|
<n-space>
|
|
<n-button @click="closeForm">关闭</n-button>
|
|
</n-space>
|
|
</template>
|
|
</n-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { computed, ref } from 'vue';
|
|
import { useDictStore } from '@/store/modules/dict';
|
|
import { View } from '@/api/imUser';
|
|
import { newState, State } from './model';
|
|
import { useProjectSettingStore } from '@/store/modules/projectSetting';
|
|
import { adaModalWidth } from '@/utils/hotgo';
|
|
|
|
const settingStore = useProjectSettingStore();
|
|
const dict = useDictStore();
|
|
const loading = ref(false);
|
|
const showModal = ref(false);
|
|
const formValue = ref<State>(newState(null));
|
|
const dialogWidth = computed(() => {
|
|
return adaModalWidth(960);
|
|
});
|
|
const stateLabel = computed(() => dict.getLabel('ImUserStateOptions', formValue.value.state));
|
|
|
|
// 关闭弹窗
|
|
function closeForm() {
|
|
showModal.value = false;
|
|
loading.value = false;
|
|
}
|
|
|
|
// 打开弹窗
|
|
function openModal(state: State) {
|
|
showModal.value = true;
|
|
loading.value = true;
|
|
View({ tenantId: state.tenantId, userId: state.userId })
|
|
.then((res) => {
|
|
formValue.value = newState(res);
|
|
})
|
|
.finally(() => {
|
|
loading.value = false;
|
|
});
|
|
}
|
|
|
|
defineExpose({
|
|
openModal,
|
|
});
|
|
</script>
|
|
|
|
<style lang="less"></style>
|