From ae2a447fa4ef186781b55fb1f05a04edd3a67d8f Mon Sep 17 00:00:00 2001
From: wangyifeng <812766448@qq.com>
Date: Tue, 11 Mar 2025 19:56:43 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E8=81=8A=E5=A4=A9=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E9=80=89=E6=8B=A9=E6=8F=90=E9=86=92=E7=9A=84=E4=BA=BA?=
 =?UTF-8?q?=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/dialog/index.vue                    | 156 +++++++++++++++++-
 .../image/chatList/mention_select_hide_bg.png | Bin 0 -> 752 bytes
 .../chatList/mention_select_hide_icon.png     | Bin 0 -> 208 bytes
 src/uni_modules/tmui/locale/zh-Hans.json      |   2 +-
 4 files changed, 152 insertions(+), 6 deletions(-)
 create mode 100644 src/static/image/chatList/mention_select_hide_bg.png
 create mode 100644 src/static/image/chatList/mention_select_hide_icon.png

diff --git a/src/pages/dialog/index.vue b/src/pages/dialog/index.vue
index aebfa4a..23f340e 100644
--- a/src/pages/dialog/index.vue
+++ b/src/pages/dialog/index.vue
@@ -212,15 +212,13 @@
                     }}
                   </span>
                   <span
-                    v-if="state?.quoteInfo?.msg_type === 3"
+                    v-if="state?.quoteInfo"
                     class="text-[28rpx] text-[#999]"
                   >
                     {{
                       state?.quoteInfo?.nickname +
                       '：' +
-                      '[' +
-                      $t('msg.type') +
-                      ']'
+                      ChatMsgTypeMapping[state?.quoteInfo?.msg_type]
                     }}
                   </span>
                   <img
@@ -344,6 +342,70 @@
         </div>
       </template>
     </ZPaging>
+    <tm-drawer placement="bottom" :show="true" :hideHeader="true" :round="5">
+      <div
+        class="mention-select-drawer flex flex-row flex-1 flex-row flex-row-center-between"
+      >
+        <div
+          class="cancel-btns flex-row flex flex-row-center-start"
+          style="width: 210rpx;"
+        >
+          <div class="hide-btn" v-if="!state.mentionIsMulSelect">
+            <img
+              style="width: 40rpx; height: 40rpx;"
+              src="/src/static/image/chatList/mention_select_hide_bg.png"
+            />
+            <img
+              style="
+                position: absolute;
+                top: 50%;
+                left: 50%;
+                margin-left: -9rpx;
+                margin-top: -5rpx;
+              "
+              src="/src/static/image/chatList/mention_select_hide_icon.png"
+            />
+          </div>
+          <span
+            style="flex-shrink: 0; display: block;"
+            class="text-[32rpx] font-regular text-[#191919]"
+            v-if="state.mentionIsMulSelect"
+            @click="changeMentionSelectMul(false)"
+          >
+            {{ $t('cancel') }}
+          </span>
+        </div>
+        <div
+          class="flex flex-row-center-center flex-col"
+          style="padding: 6rpx 0;"
+        >
+          <text>{{ $t('chat.mention.select') }}</text>
+        </div>
+        <div class="flex-row flex flex-row-center-end" style="width: 210rpx;">
+          <div
+            class="mention-edit-btn"
+            v-if="!state.mentionIsMulSelect"
+            @click="changeMentionSelectMul(true)"
+          >
+            <span class="text-[32rpx] font-regular text-[#191919]">
+              {{ $t('button.multiple.choice') }}
+            </span>
+          </div>
+          <div
+            class="mention-done-btn"
+            :class="
+              state?.mentionSelectComplete ? 'mention-done-btn-can-do' : ''
+            "
+            v-if="state.mentionIsMulSelect"
+            @click="changeToSelectMode"
+          >
+            <span class="text-[32rpx] font-regular text-[#191919]">
+              {{ $t('button.text.done') }}
+            </span>
+          </div>
+        </div>
+      </div>
+    </tm-drawer>
   </div>
 </template>
 <script setup>
@@ -370,7 +432,11 @@ import {
   useDialogueListStore,
 } from '@/store'
 import addCircleGray from '@/static/image/chatList/addCircleGray.png'
-import { MessageComponents, ForwardableMessageType } from '@/constant/message'
+import {
+  MessageComponents,
+  ForwardableMessageType,
+  ChatMsgTypeMapping,
+} from '@/constant/message'
 import { formatTime, parseTime } from '@/utils/datetime'
 import { deltaToMessage, deltaToString, isEmptyDelta } from './util'
 import smile from '@/static/image/chatList/smile@2x.png'
@@ -433,6 +499,7 @@ const state = ref({
   sessionId: '',
   localPageLoadDone: true, //分页加载缓存中的聊天记录是否完毕
   quoteInfo: null, //引用信息
+  mentionIsMulSelect: false, //是否是多选提醒的人
 })
 
 uniOnload((options) => {
@@ -487,6 +554,15 @@ const onSendMessage = (data = {}, callBack) => {
 
 const onSendMessageClick = () => {
   let delta = getQuill().getContents()
+  if (state.value.quoteInfo) {
+    delta.ops.unshift({
+      insert: {
+        quote: {
+          id: state.value.quoteInfo.msg_id,
+        },
+      },
+    })
+  }
   let data = deltaToMessage(delta)
 
   if (data.items.length === 0) {
@@ -503,6 +579,9 @@ const onSendMessageClick = () => {
         callBack: (ok) => {
           if (!ok) return
           getQuill().setContents([], Quill.sources.USER)
+          if (state.value.quoteInfo) {
+            state.value.quoteInfo = null
+          }
         },
       })
       break
@@ -934,6 +1013,11 @@ const toUserDetailPage = (userItem) => {
   })
 }
 
+//切换提醒的人选择弹窗多选状态
+const changeMentionSelectMul = (status) => {
+  state.value.mentionIsMulSelect = status
+}
+
 onMounted(async () => {
   initData()
 })
@@ -1256,4 +1340,66 @@ onUnmounted(() => {
   height: 1rpx;
   background-color: #e7e7e7;
 }
+
+.mention-select-drawer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 36rpx 32rpx;
+  .cancel-btns {
+    flex-shrink: 0;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    .hide-btn {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      text {
+      }
+      img {
+        width: 18rpx;
+        height: 10rpx;
+      }
+    }
+  }
+
+  .mention-done-btn {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    padding: 6rpx 24rpx;
+    background-color: #f3f3f3;
+    border-radius: 8rpx;
+    flex-shrink: 0;
+    span {
+      color: #bababa;
+      line-height: 40rpx;
+      flex-shrink: 0;
+    }
+  }
+
+  .mention-done-btn-can-do {
+    background-color: #46299d;
+    span {
+      color: #fff;
+    }
+  }
+
+  .mention-edit-btn {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+    flex-shrink: 0;
+    span {
+      flex-shrink: 0;
+    }
+  }
+}
 </style>
diff --git a/src/static/image/chatList/mention_select_hide_bg.png b/src/static/image/chatList/mention_select_hide_bg.png
new file mode 100644
index 0000000000000000000000000000000000000000..0ab3f138a2702d37d6f882523465493850fd8912
GIT binary patch
literal 752
zcmeAS@N?(olHy`uVBq!ia0vp^Iv~u!3?wz9Rv7~+#^NA%Cx&(BWL^T<A^|=ju0X;6
zNZ`zwGhe=ZdHeS5`}gmE{P^+d(<dPJ!-o%_!2rSlia-QEe*6ezeEs?r$N;JYGJqrm
z0F?t7KoYDLL_oxWY9K~I6u`xSvOqRm7hDZo1fm^oCPW<01z7+FST!OGVl@zA4qRDA
zSb-lfT%t>Y{DK)6nV4BvC1e!TH4Ka#9G#q;UEDl8yu5vV{R0Ank}?WPO3N#2>zkU}
z+dI2^dZsT}x@`H%4I4LZ-L`%A?t{mUA3t&O)Y%Icuid<R_x{soFJHfX_wM}%V7Pt#
z`|s0Ji%-C4Q1*0j43UuRJ;)i($SA>jAzb-Z$QBLNwOUsexN5mdFPxGz<NN>r?%N*o
zY_9#DbjU}cGI&MCE%%33k{=E<3Z49OalynsjSXh9YcDO4n%ma;Q#?xR+(DI97u&XV
zbBdP~v>84xnbLAlG4@Te%AJMX=d9Y&>R+yUci5qisr<$51t+Ac=4pKDSQpB*mLWiM
z2~)5s*VP8sE?ot;jS`zgPCuHN#2TU*<~Tbk*F^K0%gm(ICz{iaiyqaRxFABNuIuN*
zn!p#qj3Hbr8K!AIalfwZ+V$e*5)Y1AORhUf2fjOpm&&(oE8TTryFrnUxVu5e<v^xn
zzLHy)z8ffh@s<86;Il_^uGp6z@vx?RlS=+W=lpg#HoIBzsLwl)`D)*ltf_KA>fUla
azu6_6#J4pqYQ6-F6$VdNKbLh*2~7YRJ<!hp

literal 0
HcmV?d00001

diff --git a/src/static/image/chatList/mention_select_hide_icon.png b/src/static/image/chatList/mention_select_hide_icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..62b5f76eb3be1ad5ebec06c20aa7ff05c8dfe210
GIT binary patch
literal 208
zcmeAS@N?(olHy`uVBq!ia0vp^LO{&T!VDxEEDx9iDaPU;cPEB*=VV?2If?;3A+A8$
z!NH-pxVW^m6iAl90Gw^NOm8Dl5m!l&UoZoUO>jtg|MJhj{doT=07czBT^vI=t|tqa
zConK>V`y7-G9m0*5Zn2w3Xa=CeR*^?J2XXVi%1-3Qcz^upb){KlEEg%#JR4CgOPQi
klfyyD07W)7bpb|(>M)`In@zhbfkrZTy85}Sb4q9e0L6Jbc>n+a

literal 0
HcmV?d00001

diff --git a/src/uni_modules/tmui/locale/zh-Hans.json b/src/uni_modules/tmui/locale/zh-Hans.json
index ad991eb..482275e 100644
--- a/src/uni_modules/tmui/locale/zh-Hans.json
+++ b/src/uni_modules/tmui/locale/zh-Hans.json
@@ -150,5 +150,5 @@
   "button.text.close": "关闭",
   "choose.deps.all": "全部",
   "choose.deps.current": "当前",
-  "msg.type": "图片"
+  "chat.mention.select": "选择提醒的人"
 }