加入头像显示功能

This commit is contained in:
liuwei
2025-04-15 11:51:26 +08:00
parent bf3ec0a27b
commit 26a419594c
4 changed files with 126 additions and 11 deletions

View File

@@ -126,6 +126,24 @@ def api_contacts_public():
logger.error(f"获取公共好友信息失败: {e}")
return jsonify({"success": False, "error": str(e)}), 500
@contacts_bp.route('/api/head_images', methods=['GET'])
@login_required
def api_head_images():
"""获取联系人头像信息API"""
try:
server = current_app.dashboard_server
head_images = server.contact_manager.get_all_head_images()
return jsonify({
"success": True,
"data": {
"head_images": head_images
}
})
except Exception as e:
logger.error(f"获取联系人头像信息失败: {e}")
return jsonify({"success": False, "error": str(e)}), 500
@contacts_bp.route('/api/group_members/<roomid>', methods=['GET'])
@login_required
def api_group_members(roomid):

View File

@@ -84,6 +84,16 @@
style="width: 100%"
border>
<el-table-column type="index" width="50"></el-table-column>
<el-table-column label="头像" width="70">
<template slot-scope="scope">
<el-avatar
size="small"
{% raw %}:src="getHeadImage(scope.row.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}>
<img src="/static/logo.png" />
</el-avatar>
</template>
</el-table-column>
<el-table-column prop="wxid" label="微信ID" width="220"></el-table-column>
<el-table-column prop="name" label="昵称"></el-table-column>
<el-table-column label="操作" width="150">
@@ -106,6 +116,16 @@
style="width: 100%"
border>
<el-table-column type="index" width="50"></el-table-column>
<el-table-column label="头像" width="70">
<template slot-scope="scope">
<el-avatar
size="small"
{% raw %}:src="getHeadImage(scope.row.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}>
<img src="/static/logo.png" />
</el-avatar>
</template>
</el-table-column>
<el-table-column prop="wxid" label="公众号ID" width="220"></el-table-column>
<el-table-column prop="name" label="公众号名称"></el-table-column>
<el-table-column label="操作" width="150">
@@ -128,6 +148,16 @@
style="width: 100%"
border>
<el-table-column type="index" width="50"></el-table-column>
<el-table-column label="头像" width="70">
<template slot-scope="scope">
<el-avatar
size="small"
{% raw %}:src="getHeadImage(scope.row.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}>
<img src="/static/logo.png" />
</el-avatar>
</template>
</el-table-column>
<el-table-column prop="wxid" label="ID" width="220"></el-table-column>
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column label="操作" width="150">
@@ -243,15 +273,32 @@
<!-- 用户详情对话框 -->
<el-dialog title="用户详情" {% raw %}:visible.sync="userDetailDialogVisible"{% endraw %} width="50%">
<el-descriptions {% raw %}:column="1"{% endraw %} border>
<el-descriptions-item label="微信ID">{% raw %}{{ currentUser.wxid }}{% endraw %}</el-descriptions-item>
<el-descriptions-item label="昵称">{% raw %}{{ currentUser.name }}{% endraw %}</el-descriptions-item>
<!-- 可以添加更多用户相关信息 -->
</el-descriptions>
</el-dialog>
<el-avatar
size="large"
{% raw %}:src="getHeadImage(currentUser.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}
style="width: 100px; height: 100px;">
<img src="/static/logo.png" />
</el-avatar>
</div>
<el-descriptions {% raw %}:column="1"{% endraw %} border>
<el-descriptions-item label="微信ID">{% raw %}{{ currentUser.wxid }}{% endraw %}</el-descriptions-item>
<el-descriptions-item label="昵称">{% raw %}{{ currentUser.name }}{% endraw %}</el-descriptions-item>
<!-- 可以添加更多用户相关信息 -->
</el-descriptions>
</el-dialog>
<!-- 公众号详情对话框 -->
<el-dialog title="公众号详情" {% raw %}:visible.sync="officialDetailDialogVisible"{% endraw %} width="50%">
<div style="text-align: center; margin-bottom: 20px;">
<el-avatar
size="large"
{% raw %}:src="getHeadImage(currentOfficial.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}
style="width: 100px; height: 100px;">
<img src="/static/logo.png" />
</el-avatar>
</div>
<el-descriptions {% raw %}:column="1"{% endraw %} border>
<el-descriptions-item label="公众号ID">{% raw %}{{ currentOfficial.wxid }}{% endraw %}</el-descriptions-item>
<el-descriptions-item label="公众号名称">{% raw %}{{ currentOfficial.name }}{% endraw %}</el-descriptions-item>
@@ -261,6 +308,15 @@
<!-- 公共好友详情对话框 -->
<el-dialog title="公共好友详情" {% raw %}:visible.sync="publicDetailDialogVisible"{% endraw %} width="50%">
<div style="text-align: center; margin-bottom: 20px;">
<el-avatar
size="large"
{% raw %}:src="getHeadImage(currentPublic.wxid)"{% endraw %}
{% raw %}@error="() => true"{% endraw %}
style="width: 100px; height: 100px;">
<img src="/static/logo.png" />
</el-avatar>
</div>
<el-descriptions {% raw %}:column="1"{% endraw %} border>
<el-descriptions-item label="ID">{% raw %}{{ currentPublic.wxid }}{% endraw %}</el-descriptions-item>
<el-descriptions-item label="名称">{% raw %}{{ currentPublic.name }}{% endraw %}</el-descriptions-item>
@@ -285,6 +341,7 @@
personalList: [],
officialList: [],
publicList: [],
headImages: {}, // 添加头像数据存储
statistics: {
total: 0,
groups: 0,
@@ -479,6 +536,17 @@
console.error('加载公共好友数据失败:', error);
this.$message.error('加载公共好友数据失败');
});
// 加载头像数据
axios.get('/contacts/api/head_images')
.then(response => {
if (response.data.success) {
this.headImages = response.data.data.head_images;
}
})
.catch(error => {
console.error('加载联系人头像数据失败:', error);
this.$message.error('加载联系人头像数据失败');
});
},
refreshContacts() {
this.loadContactsData();
@@ -487,6 +555,10 @@
handleTabClick(tab) {
this.currentPage = 1; // 切换选项卡时重置页码
},
// 添加获取头像的方法
getHeadImage(wxid) {
return this.headImages[wxid] || '';
},
handleSizeChange(size) {
this.pageSize = size;
},