From 089bf5d2378b3c4a61d795b2a92bede2c193b771 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Tue, 06 Jan 2026 11:22:58 +0800
Subject: [PATCH] 1
---
src/components/chat/messaege/VisitCardMessage.vue | 134 ++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 134 insertions(+), 0 deletions(-)
diff --git a/src/components/chat/messaege/VisitCardMessage.vue b/src/components/chat/messaege/VisitCardMessage.vue
new file mode 100644
index 0000000..81a62f5
--- /dev/null
+++ b/src/components/chat/messaege/VisitCardMessage.vue
@@ -0,0 +1,134 @@
+<template>
+ <div class="visit-card-message">
+ <div class="user flex-center">
+ <div class="avatar flex-center">
+ <el-avatar :size="28" :src="avatar" />
+ </div>
+ <div class="content flex-center">
+ <p class="ellipsis">{{ nickname }}</p>
+ </div>
+ <div class="tools flex-center">
+ <span class="flex-center pointer">
+ <i class="el-icon-plus" /> 加好友
+ </span>
+ </div>
+ </div>
+ <div class="sign"><span>个性签名 : </span>{{ sign }}</div>
+ <div class="share no-select ellipsis">
+ <a class="pointer" @click="openVisitCard(friendId)">你是谁?</a>
+ 分享了用户名片，可点击添加好友 ...
+ </div>
+ </div>
+</template>
+<script>
+export default {
+ name: 'VisitCardMessage',
+ data() {
+ return {
+ userId: 0,
+ friendId: 0,
+ avatar:
+ 'http://im-serve0.gzydong.club/static/image/sys-head/2019012107542668696.jpg',
+ sign:
+ '这个社会，是赢家通吃，输者一无所有，社会，永远都是只以成败论英雄。',
+ nickname:
+ '氨基酸纳氨基酸纳氨基酸纳氨基酸纳氨基酸纳氨基酸纳氨基酸纳氨基酸纳',
+ }
+ },
+ created() {},
+ methods: {
+ openVisitCard(user_id) {
+ this.$emit('openVisitCard', user_id)
+ },
+ },
+}
+</script>
+<style lang="less" scoped>
+.ellipsis {
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.visit-card-message {
+ min-height: 130px;
+ min-width: 100px;
+ max-width: 300px;
+ border-radius: 5px;
+ padding: 10px;
+ box-sizing: border-box;
+ border: 1px solid #ece5e5;
+ transition: all 0.5s;
+
+ &:hover {
+ box-shadow: 0 0 8px #e2d3d3;
+ transform: scale(1.01);
+ }
+
+ .user {
+ height: 40px;
+ overflow: hidden;
+ box-sizing: border-box;
+ > div {
+ height: inherit;
+ }
+
+ .avatar {
+ flex-basis: 30px;
+ flex-shrink: 0;
+ }
+
+ .content {
+ flex: 1 1;
+ margin: 0 10px;
+ font-size: 14px;
+ justify-content: flex-start;
+ overflow: hidden;
+ }
+
+ .tools {
+ flex-basis: 60px;
+ flex-shrink: 0;
+
+ span {
+ width: 65px;
+ height: 30px;
+ background: #409eff;
+ color: white;
+ font-size: 13px;
+ border-radius: 20px;
+ padding: 0 8px;
+ transform: scale(0.8);
+ user-select: none;
+
+ &:active {
+ background: #83b0f3;
+ transform: scale(0.83);
+ }
+ }
+ }
+ }
+
+ .sign {
+ min-height: 22px;
+ line-height: 22px;
+ border-radius: 3px;
+ padding: 5px 8px;
+ background: #f3f5f7;
+ color: #7d7d7d;
+ font-size: 12px;
+ margin: 10px 0;
+ span {
+ font-weight: bold;
+ }
+ }
+
+ .share {
+ font-size: 12px;
+ color: #7d7d7d;
+ a {
+ color: #4cabf7;
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3