增加订单数据加载状态

src/stores/OrderStore.js

@@ -61,17 +61,22 @@ const useOrderStore = create((set, get) => ({
 
   },
 
-  fetchOrderDetail: async (colisn) => {
-    const json = await fetchJSON(`${API_HOST}/getorderinfo`, { colisn })
-    if (json.errcode === 0 && json.result.length > 0) {
-      const orderResult = json.result[0]
-      set(() => ({
-        orderDetail: orderResult,
-        customerDetail: orderResult.contact.length > 0 ? orderResult.contact[0] : {},
-        lastQuotation: orderResult.quotes.length > 0 ? orderResult.quotes[0] : {},
-        quotationList: orderResult.quotes,
-      }))
-    }
+  fetchOrderDetail: (colisn) => {
+    return fetchJSON(`${API_HOST}/getorderinfo`, { colisn })
+      .then(json => {
+        if (json.errcode === 0 && json.result.length > 0) {
+          const orderResult = json.result[0]
+          set(() => ({
+            orderDetail: orderResult,
+            customerDetail: orderResult.contact.length > 0 ? orderResult.contact[0] : {},
+            lastQuotation: orderResult.quotes.length > 0 ? orderResult.quotes[0] : {},
+            quotationList: orderResult.quotes,
+          }))
+        } else {
+          throw new Error(json?.errmsg + ': ' + json.errcode)
+        }
+      })
+    
   },
 
   setOrderPropValue: async (colisn, propName, value) => {

src/views/Conversations/Components/CustomerProfile.jsx

@@ -1,6 +1,6 @@
 import { LinkOutlined, MailOutlined, PhoneOutlined, UserOutlined, WhatsAppOutlined } from '@ant-design/icons'
-import { App, Button, Card, Empty, Flex, Select, Typography } from 'antd'
-import { useEffect } from 'react'
+import { App, Button, Card, Empty, Flex, Select, Spin, Typography } from 'antd'
+import { useEffect, useState } from 'react'
 
 import { Conditional } from '@/components/Conditional'
 import useConversationStore from '@/stores/ConversationStore'
@@ -9,13 +9,26 @@ import QuotesHistory from './QuotesHistory'
 
 const CustomerProfile = (() => {
   const { notification } = App.useApp()
+  const [loading, setLoading] = useState(false)
   const currentOrder = useConversationStore((state) => state.currentConversation?.coli_sn || '')
   const { orderDetail, customerDetail, lastQuotation, quotationList,
     fetchOrderDetail, setOrderPropValue
   } = useOrderStore()
 
   useEffect(() => {
-    if (currentOrder) fetchOrderDetail(currentOrder)
+    if (currentOrder) {
+      setLoading(true)
+      fetchOrderDetail(currentOrder)
+        .finally(() => setLoading(false))
+        .catch(reason => {
+          notification.error({
+            message: '查询出错',
+            description: reason.message,
+            placement: 'top',
+            duration: 60,
+          })
+        })
+    }
   }, [currentOrder])
 
   let regularText = ''
@@ -24,6 +37,7 @@ const CustomerProfile = (() => {
   if (currentOrder) {
     return (
       <div className=' divide-x-0 divide-y divide-dashed divide-gray-300 '>
+        <Spin spinning={loading}>
         <Card className='p-2 '
           bordered={false}
           title={orderDetail.order_no}
@@ -90,6 +104,7 @@ const CustomerProfile = (() => {
           }/>
         </Flex>
         <p className='p-2 shadow-inner overflow-auto m-0 break-words whitespace-pre-wrap' dangerouslySetInnerHTML={{__html: orderDetail.order_detail}}></p>
+        </Spin>
       </div>
     ) 
   } else {