From 90c71804e27c7c7102348c151805fee7b81c6c8e Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 24 Nov 2024 11:35:40 +0800
Subject: [PATCH 1/5] =?UTF-8?q?=E3=80=90=E5=8A=9F=E8=83=BD=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E3=80=91=E5=95=86=E5=9F=8E:=20=E5=AE=A2=E6=9C=8D?=
 =?UTF-8?q?=E4=BC=9A=E8=AF=9D=E5=88=97=E8=A1=A8=E7=9A=84=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../kefu/components/KeFuConversationList.vue  | 24 +++++++++----------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/src/views/mall/promotion/kefu/components/KeFuConversationList.vue b/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
index 328120fb..01479de4 100644
--- a/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
+++ b/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-aside class="kefu p-5px h-100%" width="260px">
+  <el-aside class="kefu pt-5px h-100%" width="260px">
     <div class="color-[#999] font-bold my-10px">
       会话记录({{ kefuStore.getConversationList.length }})
     </div>
@@ -7,7 +7,7 @@
       v-for="item in kefuStore.getConversationList"
       :key="item.id"
       :class="{ active: item.id === activeConversationId, pinned: item.adminPinned }"
-      class="kefu-conversation flex items-center"
+      class="kefu-conversation px-10px flex items-center"
       @click="openRightMessage(item)"
       @contextmenu.prevent="rightClick($event as PointerEvent, item)"
     >
@@ -210,26 +210,24 @@ onBeforeUnmount(() => {
     .username {
       min-width: 0;
       max-width: 60%;
+    }
+
+    .last-message {
+      font-size: 13px;
+    }
+
+    .last-message,
+    .username {
       overflow: hidden;
       text-overflow: ellipsis;
       display: -webkit-box;
       -webkit-box-orient: vertical;
       -webkit-line-clamp: 1;
     }
-
-    .last-message {
-      font-size: 13px;
-      width: 200px;
-      overflow: hidden; // 隐藏超出的文本
-      white-space: nowrap; // 禁止换行
-      text-overflow: ellipsis; // 添加省略号
-    }
   }
 
-  .active,
-  .pinned {
+  .active {
     background-color: rgba(128, 128, 128, 0.5); // 透明色，暗黑模式下也能体现
-    border-radius: 8px;
   }
 
   .right-menu-ul {

From 64e2ddfa1840f3207a60d8ec9698df1564050dc9 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 24 Nov 2024 11:52:24 +0800
Subject: [PATCH 2/5] =?UTF-8?q?=E3=80=90=E5=8A=9F=E8=83=BD=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E3=80=91=E5=95=86=E5=9F=8E:=20=E5=AE=A2=E6=9C=8D?=
 =?UTF-8?q?=E6=95=B4=E4=BD=93=E7=9A=84=E6=AF=8F=E4=B8=AA=E5=8C=BA=E5=9F=9F?=
 =?UTF-8?q?=E7=9A=84=E7=BA=BF=E6=A1=86=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../kefu/components/KeFuMessageList.vue       | 26 +++++++++++++++++--
 .../kefu/components/member/MemberInfo.vue     | 13 +++++++++-
 2 files changed, 36 insertions(+), 3 deletions(-)

diff --git a/src/views/mall/promotion/kefu/components/KeFuMessageList.vue b/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
index 68bd4324..b3840a87 100644
--- a/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
+++ b/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
@@ -374,8 +374,19 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
 <style lang="scss" scoped>
 .kefu {
   background-color: #fff;
+  position: relative;
   width: calc(100% - 300px - 260px);
-  border-left: var(--el-border-color) solid 1px;
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 1px; /* 实际宽度 */
+    height: 100%;
+    background-color: var(--el-border-color);
+    transform: scaleX(0.3); /* 缩小宽度 */
+  }
 
   .kefu-header {
     background: #fbfbfb;
@@ -463,12 +474,23 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
   }
 
   .kefu-footer {
+    position: relative;
     display: flex;
     flex-direction: column;
     height: auto;
     margin: 0;
     padding: 0;
-    border-top: var(--el-border-color) solid 1px;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 1px; /* 初始宽度 */
+      background-color: var(--el-border-color);
+      transform: scaleY(0.3); /* 缩小视觉高度 */
+    }
 
     .chat-tools {
       width: 100%;
diff --git a/src/views/mall/promotion/kefu/components/member/MemberInfo.vue b/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
index 522518ca..11947fa2 100644
--- a/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
+++ b/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
@@ -165,9 +165,20 @@ const getUserData = async () => {
 
 <style lang="scss" scoped>
 .kefu {
+  position: relative;
   width: 300px !important;
   background-color: #fff;
-  border-left: var(--el-border-color) solid 1px;
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 1px; /* 实际宽度 */
+    height: 100%;
+    background-color: var(--el-border-color);
+    transform: scaleX(0.3); /* 缩小宽度 */
+  }
 
   &-header {
     background: #fbfbfb;

From 5cdc15387c241a501f523030fb28e654051b8c47 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 24 Nov 2024 12:37:27 +0800
Subject: [PATCH 3/5] =?UTF-8?q?=E3=80=90=E5=8A=9F=E8=83=BD=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E3=80=91=E5=95=86=E5=9F=8E:=20=E5=AE=A2=E6=9C=8D?=
 =?UTF-8?q?=E6=96=87=E6=9C=AC=E6=B6=88=E6=81=AF=E6=A0=B7=E5=BC=8F=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=EF=BC=8C=E5=86=85=E5=AE=B9=E5=B1=85=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../kefu/components/KeFuConversationList.vue  |  2 +-
 .../kefu/components/KeFuMessageList.vue       | 37 ++++++++++++-------
 .../kefu/components/member/MemberInfo.vue     | 17 +++++++--
 .../promotion/kefu/components/tools/emoji.ts  |  2 +-
 4 files changed, 40 insertions(+), 18 deletions(-)

diff --git a/src/views/mall/promotion/kefu/components/KeFuConversationList.vue b/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
index 01479de4..075edc33 100644
--- a/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
+++ b/src/views/mall/promotion/kefu/components/KeFuConversationList.vue
@@ -200,7 +200,7 @@ onBeforeUnmount(() => {
 
 <style lang="scss" scoped>
 .kefu {
-  background-color: #fff;
+  background-color: #e5e4e4;
 
   &-conversation {
     height: 60px;
diff --git a/src/views/mall/promotion/kefu/components/KeFuMessageList.vue b/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
index b3840a87..f7b96cee 100644
--- a/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
+++ b/src/views/mall/promotion/kefu/components/KeFuMessageList.vue
@@ -46,14 +46,13 @@
                 :class="{
                   'kefu-message': KeFuMessageContentTypeEnum.TEXT === item.contentType
                 }"
-                class="p-10px"
               >
                 <!-- 文本消息 -->
                 <MessageItem :message="item">
                   <template v-if="KeFuMessageContentTypeEnum.TEXT === item.contentType">
                     <div
                       v-dompurify-html="replaceEmoji(getMessageContent(item).text || item.content)"
-                      class="flex items-center"
+                      class="flex items-center h-1/1"
                     ></div>
                   </template>
                 </MessageItem>
@@ -64,7 +63,7 @@
                     :initial-index="0"
                     :preview-src-list="[getMessageContent(item).picUrl || item.content]"
                     :src="getMessageContent(item).picUrl || item.content"
-                    class="w-200px"
+                    class="w-200px mx-10px"
                     fit="contain"
                     preview-teleported
                   />
@@ -79,7 +78,7 @@
                     :spuId="getMessageContent(item).spuId"
                     :stock="getMessageContent(item).stock"
                     :title="getMessageContent(item).spuName"
-                    class="max-w-300px"
+                    class="max-w-300px mx-10px"
                   />
                 </MessageItem>
                 <!-- 订单消息 -->
@@ -87,7 +86,7 @@
                   <OrderItem
                     v-if="KeFuMessageContentTypeEnum.ORDER === item.contentType"
                     :message="item"
-                    class="max-w-100%"
+                    class="max-w-100% mx-10px"
                   />
                 </MessageItem>
               </div>
@@ -373,7 +372,7 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
 
 <style lang="scss" scoped>
 .kefu {
-  background-color: #fff;
+  background-color: #f5f5f5;
   position: relative;
   width: calc(100% - 300px - 260px);
 
@@ -389,12 +388,23 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
   }
 
   .kefu-header {
-    background: #fbfbfb;
-    box-shadow: 0 0 0 0 #dcdfe6;
+    background-color: #f5f5f5;
+    position: relative;
     display: flex;
     align-items: center;
     justify-content: space-between;
 
+    &::before {
+      content: '';
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 1px; /* 初始宽度 */
+      background-color: var(--el-border-color);
+      transform: scaleY(0.3); /* 缩小视觉高度 */
+    }
+
     &-title {
       font-size: 18px;
       font-weight: bold;
@@ -423,7 +433,7 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
       justify-content: flex-start;
 
       .kefu-message {
-        background-color: rgb(245, 245, 245);
+        background-color: #fff;
         margin-left: 10px;
         margin-top: 3px;
         border-top-right-radius: 10px;
@@ -452,9 +462,9 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
       padding: 5px 10px;
       width: auto;
       max-width: 50%;
-      text-align: left;
-      display: inline-block !important;
-      word-break: break-all;
+      //text-align: left;
+      //display: inline-block !important;
+      //word-break: break-all;
       transition: all 0.2s;
 
       &:hover {
@@ -468,7 +478,7 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
       background-color: rgba(0, 0, 0, 0.1);
       border-radius: 8px;
       padding: 0 5px;
-      color: #999;
+      color: #fff;
       font-size: 10px;
     }
   }
@@ -500,6 +510,7 @@ const showTime = computed(() => (item: KeFuMessageRespVO, index: number) => {
 
   ::v-deep(textarea) {
     resize: none;
+    background-color: #f5f5f5;
   }
 
   :deep(.el-input__wrapper) {
diff --git a/src/views/mall/promotion/kefu/components/member/MemberInfo.vue b/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
index 11947fa2..849992b3 100644
--- a/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
+++ b/src/views/mall/promotion/kefu/components/member/MemberInfo.vue
@@ -167,7 +167,7 @@ const getUserData = async () => {
 .kefu {
   position: relative;
   width: 300px !important;
-  background-color: #fff;
+  background-color: #f5f5f5;
 
   &::after {
     content: '';
@@ -181,12 +181,23 @@ const getUserData = async () => {
   }
 
   &-header {
-    background: #fbfbfb;
-    box-shadow: 0 0 0 0 #dcdfe6;
+    background-color: #f5f5f5;
+    position: relative;
     display: flex;
     align-items: center;
     justify-content: space-around;
 
+    &::before {
+      content: '';
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 1px; /* 初始宽度 */
+      background-color: var(--el-border-color);
+      transform: scaleY(0.3); /* 缩小视觉高度 */
+    }
+
     &-title {
       font-size: 18px;
       font-weight: bold;
diff --git a/src/views/mall/promotion/kefu/components/tools/emoji.ts b/src/views/mall/promotion/kefu/components/tools/emoji.ts
index 0cbf95af..8aa59c8c 100644
--- a/src/views/mall/promotion/kefu/components/tools/emoji.ts
+++ b/src/views/mall/promotion/kefu/components/tools/emoji.ts
@@ -93,7 +93,7 @@ export const useEmoji = () => {
           const emojiFile = getEmojiFileByName(item)
           newData = newData.replace(
             item,
-            `<img class="chat-img" style="width: 24px;height: 24px;margin: 0 3px;" src="${emojiFile}" alt=""/>`
+            `<img class="chat-img" style="width: 24px;height: 24px;margin: 0 3px;vertical-align: middle;" src="${emojiFile}" alt=""/>`
           )
         })
       }

From d228df5210fe898b6195f33c638616900e0df0b7 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 24 Nov 2024 12:41:39 +0800
Subject: [PATCH 4/5] =?UTF-8?q?=E3=80=90=E5=8A=9F=E8=83=BD=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E3=80=91=E5=95=86=E5=9F=8E:=20=E5=AE=A2=E6=9C=8D?=
 =?UTF-8?q?=E5=95=86=E5=9F=8E=E7=9A=84=E9=85=8D=E8=89=B2=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/mall/promotion/kefu/components/message/OrderItem.vue | 3 +--
 .../mall/promotion/kefu/components/message/ProductItem.vue     | 2 +-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/views/mall/promotion/kefu/components/message/OrderItem.vue b/src/views/mall/promotion/kefu/components/message/OrderItem.vue
index 4dfcfa4b..9385f10b 100644
--- a/src/views/mall/promotion/kefu/components/message/OrderItem.vue
+++ b/src/views/mall/promotion/kefu/components/message/OrderItem.vue
@@ -112,7 +112,7 @@ function formatOrderStatus(order: any) {
   border-radius: 10px;
   padding: 10px;
   border: 1px var(--el-border-color) solid;
-  background-color: rgba(128, 128, 128, 0.5); // 透明色，暗黑模式下也能体现
+  background-color: #fff; // 透明色，暗黑模式下也能体现
 
   .order-card-header {
     height: 28px;
@@ -136,7 +136,6 @@ function formatOrderStatus(order: any) {
 
   .pay-box {
     padding-top: 10px;
-    color: #fff;
     font-weight: bold;
 
     .discounts-title {
diff --git a/src/views/mall/promotion/kefu/components/message/ProductItem.vue b/src/views/mall/promotion/kefu/components/message/ProductItem.vue
index 9dc62c0b..bc6cd979 100644
--- a/src/views/mall/promotion/kefu/components/message/ProductItem.vue
+++ b/src/views/mall/promotion/kefu/components/message/ProductItem.vue
@@ -77,7 +77,7 @@ const openDetail = (spuId: number) => {
 
 .product-warp {
   width: 100%;
-  background-color: rgba(128, 128, 128, 0.5); // 透明色，暗黑模式下也能体现
+  background-color: #fff;
   border-radius: 8px;
   display: flex;
   align-items: center;

From 101c704a8faf0d14ec0efca13a3fcdee228d3874 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 24 Nov 2024 16:17:10 +0800
Subject: [PATCH 5/5] =?UTF-8?q?=E3=80=90=E5=8A=9F=E8=83=BD=E5=AE=8C?=
 =?UTF-8?q?=E5=96=84=E3=80=91=E5=95=86=E5=9F=8E:=20=E4=BC=9A=E5=91=98?=
 =?UTF-8?q?=E4=BF=A1=E6=81=AF=E7=9A=84=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../member/user/detail/UserAccountInfo.vue    | 21 ++++++++++++++++-
 .../member/user/detail/UserBasicInfo.vue      | 23 +++++++++++++++++--
 2 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/src/views/member/user/detail/UserAccountInfo.vue b/src/views/member/user/detail/UserAccountInfo.vue
index 5d9085b2..fad174a8 100644
--- a/src/views/member/user/detail/UserAccountInfo.vue
+++ b/src/views/member/user/detail/UserAccountInfo.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-descriptions :column="column">
+  <el-descriptions :class="{ 'kefu-descriptions': column === 1 }" :column="column">
     <el-descriptions-item>
       <template #label>
         <descriptions-item-label icon="svg-icon:member_level" label=" 等级 " />
@@ -62,4 +62,23 @@ withDefaults(defineProps<{ user: UserApi.UserVO; wallet: WalletApi.WalletVO; col
 .cell-item::after {
   content: ':';
 }
+
+.kefu-descriptions {
+  ::v-deep(.el-descriptions__cell) {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .el-descriptions__label {
+      width: 120px;
+      display: block;
+      text-align: left;
+    }
+
+    .el-descriptions__content {
+      flex: 1;
+      text-align: end;
+    }
+  }
+}
 </style>
diff --git a/src/views/member/user/detail/UserBasicInfo.vue b/src/views/member/user/detail/UserBasicInfo.vue
index efb1f288..0fe25380 100644
--- a/src/views/member/user/detail/UserBasicInfo.vue
+++ b/src/views/member/user/detail/UserBasicInfo.vue
@@ -68,7 +68,7 @@
     </el-row>
     <template v-if="mode === 'kefu'">
       <ElAvatar :size="140" :src="user.avatar || undefined" shape="square" />
-      <el-descriptions :column="1">
+      <el-descriptions :column="1" class="kefu-descriptions">
         <el-descriptions-item>
           <template #label>
             <descriptions-item-label icon="ep:user" label="用户名" />
@@ -81,7 +81,7 @@
           </template>
           {{ user.nickname }}
         </el-descriptions-item>
-        <el-descriptions-item label="手机号">
+        <el-descriptions-item>
           <template #label>
             <descriptions-item-label icon="ep:phone" label="手机号" />
           </template>
@@ -143,4 +143,23 @@ withDefaults(defineProps<{ user: UserApi.UserVO; mode?: string }>(), {
   justify-content: space-between;
   align-items: center;
 }
+
+::v-deep(.kefu-descriptions) {
+  .el-descriptions__cell {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .el-descriptions__label {
+      width: 120px;
+      display: block;
+      text-align: left;
+    }
+
+    .el-descriptions__content {
+      flex: 1;
+      text-align: end;
+    }
+  }
+}
 </style>