新增订单群聊

frontend/src/views/mobile/MobileOrderDetailView.vue

@@ -3,6 +3,7 @@ import { computed, onMounted, ref } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { showToast, showDialog } from "vant";
 
+import { fetchOrderChat } from "@/api/chats";
 import { createDispute } from "@/api/disputes";
 import { uploadFile } from "@/api/files";
 import {
@@ -38,6 +39,7 @@ const acceptingCheckout = ref(false);
 const rejectingCheckout = ref(false);
 const disputing = ref(false);
 const uploadingEvidence = ref(false);
+const openingChat = ref(false);
 const order = ref<Order | null>(null);
 const handoffRecords = ref<HandoffRecord[]>([]);
 const handoffContent = ref("");
@@ -506,6 +508,19 @@ function linesToList(value: string) {
     .filter(Boolean);
 }
 
+async function openOrderChat() {
+  if (!order.value || openingChat.value) return;
+  openingChat.value = true;
+  try {
+    const chat = await fetchOrderChat(order.value.id);
+    router.push(`/m/chats/${chat.id}`);
+  } catch {
+    showToast({ message: "订单群聊暂不可用", icon: "warning-o" });
+  } finally {
+    openingChat.value = false;
+  }
+}
+
 /* Status Theme Color Mapping */
 function getStatusTagType(status: string) {
   if (["completed", "received"].includes(status)) return "success";
@@ -523,7 +538,10 @@ function getStatusTagType(status: string) {
         <van-icon name="arrow-left" :size="20" />
       </button>
       <h1>订单详情</h1>
-      <span class="header-spacer"></span>
+      <button v-if="order" class="chat-btn" type="button" :disabled="openingChat" @click="openOrderChat">
+        <van-icon name="chat-o" :size="19" />
+      </button>
+      <span v-else class="header-spacer"></span>
     </header>
 
     <van-loading v-if="loading" class="center-loading" size="24px" vertical>
@@ -1070,7 +1088,8 @@ function getStatusTagType(status: string) {
   text-align: center;
 }
 
-.back-btn {
+.back-btn,
+.chat-btn {
   display: grid;
   width: 36px;
   height: 36px;
@@ -1081,6 +1100,10 @@ function getStatusTagType(status: string) {
   cursor: pointer;
 }
 
+.chat-btn:disabled {
+  color: #a1a1aa;
+}
+
 .header-spacer {
   width: 36px;
 }