订单查询迁移到 Store

src/stores/OrderStore.js

@@ -1,19 +1,69 @@
 import { create } from 'zustand'
-import { devtools } from 'zustand/middleware'
+import { fetchJSON } from '@/utils/request'
-import { fetchJSON, postJSON } from '@/utils/request'
+import { API_HOST } from '@/config'
-
-const API_HOST = 'https://p9axztuwd7x8a7.mycht.cn/whatsapp_server'
 
 const useOrderStore = create((set, get) => ({
 
+  orderData: [],  
   orderDetail: {},
-
   customerDetail: {},
-
   lastQuotation: {},
-
   quotationList: [],
 
+  fetchOrderList: async (formValues, loginUser) => {
+    let fetchOrderUrl = `${API_HOST}/getwlorder?opisn=${loginUser.userIdStr}&otype=${formValues.type}`
+
+    if (formValues.type === 'advance') {
+
+      let fromDate = null
+      let thruDate = null
+
+      if (isNotEmpty(formValues.startDateRange)) {
+        fromDate = formValues.startDateRange[0].format('YYYY-MM-DD')
+        thruDate = formValues.startDateRange[1].format('YYYY-MM-DD')
+      }
+
+      let confirmFromDate = null
+      let confirmThruDate = null
+
+      if (isNotEmpty(formValues.confirmDateRange)) {
+        confirmFromDate = formValues.confirmDateRange[0].format('YYYY-MM-DD')
+        confirmThruDate = formValues.confirmDateRange[1].format('YYYY-MM-DD')
+      }
+
+      fetchOrderUrl = prepareUrl('https://p9axztuwd7x8a7.mycht.cn/whatsapp_server/getdvancedwlorder')
+        .append('opisn', loginUser.userIdStr)
+        .append('startdate', fromDate)
+        .append('enddate', thruDate)
+        .append('tag', formValues.orderLabel)
+        .append('orderstate', formValues.orderStatus)
+        .append('remindstate', formValues.remindState)
+        .append('coli_id', formValues.orderNumber)      
+        .append('firstName', formValues.firstName)
+        .append('lastName', formValues.lastName)
+        .append('emailphone', formValues.emailOrPhone)
+        .append('ConfirmDateStart', confirmFromDate)
+        .append('ConfirmDateEnd', confirmThruDate)
+        .build()
+    }
+
+    return fetchJSON(fetchOrderUrl)
+      .then(json => {
+        if (json.errcode === 0) {
+          set(() => ({ 
+            orderData: json.result.map((order) => { return { ...order, key: order.COLI_ID } }), 
+           }))
+        } else {
+          throw new Error(json?.errmsg + ': ' + json.errcode)
+        }
+      })
+      // .finally(() => setLoading(false))
+      .catch(reason => {        
+        throw new Error(reason.message)
+      })
+
+  },
+
   fetchOrderDetail: async (colisn) => {
     const { orderDetail, updateQuotation } = get()
     const json = await fetchJSON(`${API_HOST}/getorderinfo`, { colisn })

src/views/OrderFollow.jsx

@@ -6,6 +6,7 @@ import { memo, useCallback, useEffect, useState } from 'react'
 import { Link } from 'react-router-dom'
 import dayjs from 'dayjs'
 import { Conditional } from '@/components/Conditional'
+import useOrderStore from '@/stores/OrderStore'
 import useAuthStore from '@/stores/AuthStore'
 import { prepareUrl, isNotEmpty } from '@/utils/commons'
 import { API_HOST } from '@/config'
@@ -49,8 +50,7 @@ const AdvanceSearchForm = memo(function ({ onSubmit }) {
       layout={'vertical'}
       form={form}
       initialValues={{
-        orderLabel: '', orderStatus: '', remindState: '',
+        orderLabel: '', orderStatus: '', remindState: ''
-        startDateRange: [dayjs().startOf('M'), dayjs().endOf('M')]
       }}
       onFinish={handleSubmit}
     >
@@ -120,7 +120,7 @@ const AdvanceSearchForm = memo(function ({ onSubmit }) {
         <Col span={4}>
           <Form.Item label='出发日期' name='startDateRange'>
             <RangePicker
-              allowClear={false}
+              allowClear={true}
               inputReadOnly={true}
               presets={DATE_RANGE_PRESETS}
             />
@@ -143,7 +143,7 @@ const AdvanceSearchForm = memo(function ({ onSubmit }) {
   )
 })
 
-function OrderList({ formValues }) {
+function OrderCollapseTable({ formValues }) {
 
   const orderColumns = [
     {
@@ -203,53 +203,13 @@ function OrderList({ formValues }) {
     },
   ]
   const { notification } = App.useApp()
-  const [orderData, setOrderData] = useState([])
   const [loading, setLoading] = useState(false)
+  const { orderData, fetchOrderList } = useOrderStore()
   const { loginUser } = useAuthStore()
-  let fetchOrderUrl = `${API_HOST}/getwlorder?opisn=${loginUser.userIdStr}&otype=${formValues.type}`
+  
-
-  if (formValues.type === 'advance') {
-    const fromDate = formValues.startDateRange[0].format('YYYY-MM-DD')
-    const thruDate = formValues.startDateRange[1].format('YYYY-MM-DD')
-    let confirmFromDate = null
-    let confirmThruDate = null
-
-    if (isNotEmpty(formValues.confirmDateRange)) {
-      confirmFromDate = formValues.confirmDateRange[0].format('YYYY-MM-DD')
-      confirmThruDate = formValues.confirmDateRange[1].format('YYYY-MM-DD')
-    }
-    fetchOrderUrl = prepareUrl('https://p9axztuwd7x8a7.mycht.cn/whatsapp_server/getdvancedwlorder')
-      .append('opisn', loginUser.userIdStr)
-      .append('startdate', fromDate)
-      .append('enddate', thruDate)
-      .append('tag', formValues.orderLabel)
-      .append('orderstate', formValues.orderStatus)
-      .append('remindstate', formValues.remindState)
-      .append('coli_id', formValues.orderNumber)      
-      .append('firstName', formValues.firstName)
-      .append('lastName', formValues.lastName)
-      .append('emailphone', formValues.emailOrPhone)
-      .append('ConfirmDateStart', confirmFromDate)
-      .append('ConfirmDateEnd', confirmThruDate)
-      .build()
-  }
-
   useEffect(() => {
     setLoading(true)
-    fetch(fetchOrderUrl)
+    fetchOrderList(formValues, loginUser)
-      .then(response => response.json())
-      .then(json => {
-        if (json.errcode === 0) {
-          setOrderData(json.result.map((order) => { return { ...order, key: order.COLI_ID } }))
-        } else {
-          notification.error({
-            message: '查询出错',
-            description: json?.errmsg,
-            placement: 'top',
-            duration: 60,
-          })
-        }
-      })
       .finally(() => setLoading(false))
       .catch(reason => {
         notification.error({
@@ -373,7 +333,7 @@ function OrderFollow() {
         </Flex>
         <Conditional condition={advanceChecked} whenTrue={<AdvanceSearchForm onSubmit={handleSubmit} />}
         />
-        <OrderList formValues={formValues} />
+        <OrderCollapseTable formValues={formValues} />
       </Space>
     </>
   )