mirror of
https://github.com/TangSengDaoDao/TangSengDaoDaoManager
synced 2025-06-06 09:08:23 +00:00
feat: ✨更新接口
This commit is contained in:
parent
f0c6dd0ca5
commit
45e4a037e7
@ -14,5 +14,5 @@ export const ROUTER_WHITE_LIST: string[] = ['/login'];
|
||||
export const BU_DOU_CONFIG = {
|
||||
APP_TITLE: '唐僧叨叨后台管理',
|
||||
APP_TITLE_SHORT: '唐僧',
|
||||
APP_URL: 'https://chatapi.githubim.com/v1/'
|
||||
APP_URL: 'https://api.botgate.cn/v1/'
|
||||
};
|
||||
|
244
src/pages/user/friends.vue
Normal file
244
src/pages/user/friends.vue
Normal file
@ -0,0 +1,244 @@
|
||||
<template>
|
||||
<div class="wh-full flex-col">
|
||||
<!-- 布局 -->
|
||||
|
||||
<div class="flex-1 el-card border-none flex-col box-border overflow-hidden">
|
||||
<div class="h-50px pl-12px pr-12px box-border flex items-center justify-between bd-title">
|
||||
<div class="bd-title-left">
|
||||
<p class="m-0 font-600">用户列表</p>
|
||||
</div>
|
||||
<div class="flex items-center h-50px">
|
||||
<el-form inline>
|
||||
<el-form-item class="mb-0 !mr-16px">
|
||||
<el-input v-model="queryFrom.keyword" placeholder="uid/手机号/用户名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item class="mb-0 !mr-0">
|
||||
<el-button type="primary" @click="getUserList">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-1 overflow-hidden p-12px">
|
||||
<el-table v-loading="loadTable" :data="tableData" :border="true" style="width: 100%; height: 100%">
|
||||
<el-table-column type="index" :width="42" :align="'center'" :fixed="'left'">
|
||||
<template #header>
|
||||
<i-bd-setting class="cursor-pointer" size="16" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-for="item in column" v-bind="item" :key="item.prop">
|
||||
<template #default="scope">
|
||||
<template v-if="item.render">
|
||||
<component :is="item.render" :row="scope.row"> </component>
|
||||
</template>
|
||||
<template v-else-if="item.formatter">
|
||||
<slot :name="item.prop" :row="scope.row">{{ item.formatter(scope.row) }}</slot>
|
||||
</template>
|
||||
<template v-else>
|
||||
<slot :name="item.prop" :row="scope.row">{{ scope.row[item.prop] }}</slot>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="bd-card-footer pl-12px pr-12px mb-12px flex items-center justify-between">
|
||||
<div></div>
|
||||
<el-pagination
|
||||
v-model:current-page="queryFrom.page_index"
|
||||
v-model:page-size="queryFrom.page_size"
|
||||
:page-sizes="[15, 20, 30, 50, 100]"
|
||||
:background="true"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
@size-change="onSizeChange"
|
||||
@current-change="onCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<route lang="yaml">
|
||||
meta:
|
||||
title: 好友列表
|
||||
isAffix: false
|
||||
</route>
|
||||
|
||||
<script lang="tsx" setup>
|
||||
import { ElButton, ElSpace, ElAvatar, ElDropdown, ElDropdownMenu, ElDropdownItem } from 'element-plus';
|
||||
import { BU_DOU_CONFIG } from '@/config';
|
||||
// API 接口
|
||||
import { userListGet } from '@/api/user';
|
||||
/**
|
||||
* 表格
|
||||
*/
|
||||
const column = reactive([
|
||||
{
|
||||
prop: 'name',
|
||||
label: '用户名',
|
||||
fixed: 'left',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
prop: 'phone',
|
||||
label: '手机号',
|
||||
fixed: 'left',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
prop: 'avatar',
|
||||
label: '头像',
|
||||
align: 'center',
|
||||
width: 80,
|
||||
render: (scope: any) => {
|
||||
let img_url = '';
|
||||
if (scope.row['uid']) {
|
||||
img_url = `${BU_DOU_CONFIG.APP_URL}users/${scope.row['uid']}/avatar`;
|
||||
}
|
||||
return (
|
||||
<ElAvatar src={img_url} size={54}>
|
||||
{scope.row['name']}
|
||||
</ElAvatar>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'uid',
|
||||
label: '用户ID',
|
||||
minWidth: 300
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: '用户状态',
|
||||
width: 86,
|
||||
formatter(row: any) {
|
||||
return row.status === 1 ? '正常' : '封禁';
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'short_no',
|
||||
label: '悟空号',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
prop: 'sex',
|
||||
label: '性别',
|
||||
width: 60,
|
||||
formatter(row: any) {
|
||||
return row.sex === 1 ? '男' : '女';
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'register_time',
|
||||
label: '注册时间',
|
||||
width: 170
|
||||
},
|
||||
{
|
||||
prop: 'device_name',
|
||||
label: '登录设备',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
prop: 'device_model',
|
||||
label: '登录设备型号',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
prop: 'online',
|
||||
label: '在线状态',
|
||||
width: 90,
|
||||
formatter(row: any) {
|
||||
return row.online === 1 ? '在线' : '离线';
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'last_online_time',
|
||||
label: '最后离线时间',
|
||||
width: 150
|
||||
},
|
||||
{
|
||||
prop: 'operation',
|
||||
label: '操作',
|
||||
align: 'center',
|
||||
fixed: 'right',
|
||||
width: 180,
|
||||
render: (scope: any) => {
|
||||
return (
|
||||
<ElSpace>
|
||||
<ElButton type="primary" onClick={() => aa(scope.row)}>
|
||||
发消息
|
||||
</ElButton>
|
||||
<ElDropdown
|
||||
v-slots={{
|
||||
default: () => <ElButton>更多</ElButton>,
|
||||
dropdown: () => {
|
||||
return (
|
||||
<ElDropdownMenu>
|
||||
<ElDropdownItem onClick={() => bb(scope.row)}>
|
||||
<i-bd-every-user />
|
||||
好友列表
|
||||
</ElDropdownItem>
|
||||
<ElDropdownItem>黑名单列表</ElDropdownItem>
|
||||
<ElDropdownItem>禁封</ElDropdownItem>
|
||||
</ElDropdownMenu>
|
||||
);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</ElSpace>
|
||||
);
|
||||
}
|
||||
}
|
||||
]);
|
||||
const tableData = ref<any[]>([]);
|
||||
const loadTable = ref<boolean>(false);
|
||||
// 分页
|
||||
const total = ref(0);
|
||||
|
||||
// 查询
|
||||
const queryFrom = reactive({
|
||||
keyword: '',
|
||||
page_size: 15,
|
||||
page_index: 1
|
||||
});
|
||||
|
||||
const getUserList = () => {
|
||||
loadTable.value = true;
|
||||
userListGet(queryFrom).then((res: any) => {
|
||||
loadTable.value = false;
|
||||
tableData.value = res.list;
|
||||
total.value = res.count;
|
||||
});
|
||||
};
|
||||
|
||||
// 分页page-size
|
||||
const onSizeChange = (size: number) => {
|
||||
queryFrom.page_size = size;
|
||||
getUserList();
|
||||
};
|
||||
|
||||
// 分页page-size
|
||||
const onCurrentChange = (current: number) => {
|
||||
queryFrom.page_index = current;
|
||||
getUserList();
|
||||
};
|
||||
|
||||
const aa = (a: any) => {
|
||||
console.log(a);
|
||||
};
|
||||
|
||||
const bb = (a: any) => {
|
||||
console.log(a);
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
getUserList();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// 样式
|
||||
.bd-title {
|
||||
border-bottom: 1px solid var(--el-card-border-color);
|
||||
}
|
||||
</style>
|
@ -169,12 +169,22 @@ const column = reactive([
|
||||
</ElButton>
|
||||
<ElDropdown
|
||||
v-slots={{
|
||||
default: () => <ElButton>更多</ElButton>,
|
||||
default: () => <ElButton class={'bu-button'}>更多</ElButton>,
|
||||
dropdown: () => {
|
||||
return (
|
||||
<ElDropdownMenu>
|
||||
<ElDropdownItem onClick={() => bb(scope.row)}>好友列表</ElDropdownItem>
|
||||
<ElDropdownItem>好友列表</ElDropdownItem>
|
||||
<ElDropdownItem onClick={() => bb(scope.row)}>
|
||||
<i-bd-every-user class={'mr-4px'} />
|
||||
好友列表
|
||||
</ElDropdownItem>
|
||||
<ElDropdownItem>
|
||||
<i-bd-personal-privacy class={'mr-4px'} />
|
||||
黑名单列表
|
||||
</ElDropdownItem>
|
||||
<ElDropdownItem>
|
||||
<i-bd-info class={'mr-4px'} />
|
||||
禁封
|
||||
</ElDropdownItem>
|
||||
</ElDropdownMenu>
|
||||
);
|
||||
}
|
||||
|
@ -263,3 +263,7 @@
|
||||
height: 48px !important;
|
||||
line-height: 48px !important;
|
||||
}
|
||||
/* bu-button*/
|
||||
.bu-button:focus-visible {
|
||||
outline: 0;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user