perf: 完成订单状态、催信设置

src/components/OrderProfile.jsx

@@ -2,12 +2,13 @@ import { WhatsAppOutlined, FileAddOutlined, MailOutlined, PhoneOutlined, UserOut
 
 import { useEffect, useState } from 'react'
 import { App, Flex, Select, Tooltip, Tabs, Button, Divider, Typography, Skeleton, Checkbox } from 'antd'
-import { useOrderStore, OrderLabelDefaultOptions, OrderStatusDefaultOptions, remindStatusOptions } from '@/stores/OrderStore'
+import { useOrderStore, fetchSetRemindStateAction, OrderLabelDefaultOptions, OrderStatusDefaultOptions, remindStatusOptions } from '@/stores/OrderStore'
-import { copy } from '@/utils/commons'
+import { copy, isEmpty } from '@/utils/commons'
 const OrderProfile = ({ coliSN, ...props }) => {
   const { notification, message } = App.useApp()
 
   const [loading, setLoading] = useState(false)
+
   const orderLabelOptions = copy(OrderLabelDefaultOptions)
   orderLabelOptions.unshift({ value: 0, label: '未设置', disabled: true })
 
@@ -20,13 +21,11 @@ const OrderProfile = ({ coliSN, ...props }) => {
     s.appendOrderComment,
   ])
 
+  const [orderRemindState, setOrderRemindState] = useState(orderDetail.remindstate);
   useEffect(() => {
     if (coliSN) {
       setLoading(true)
       fetchOrderDetail(coliSN)
-        .then((result) => {
-          console.info(result)
-        })
         .finally(() => setLoading(false))
         .catch((reason) => {
           notification.error({
@@ -40,9 +39,27 @@ const OrderProfile = ({ coliSN, ...props }) => {
     return () => {}
   }, [coliSN])
 
-  const regularText = () => {
+  const handleSetRemindState = async (checkedValue) => {
-    if (orderDetail.buytime > 0) return '(R' + orderDetail.buytime + ')'
+    const state = checkedValue.filter(v => v !== orderRemindState);
-    return ''
+    const oldState = orderRemindState;
+
+    try {
+      if (isEmpty(state)) {
+        setOrderRemindState(null);
+      } else {
+        setOrderRemindState(state[0]);
+      }
+      await fetchSetRemindStateAction({ coli_sn: coliSN, remindstate: state });
+      message.success('设置成功');
+    } catch (error) {
+      notification.warning({ message: '设置失败', description: error.message, placement: 'top', duration: 60 });
+      setOrderRemindState(oldState);
+    }
+  }
+
+  const getCustomerName = () => {
+    if (orderDetail.buytime > 0) return customerDetail.name + '(R' + orderDetail.buytime + ')'
+    return customerDetail.name
   }
 
   return (
@@ -69,7 +86,7 @@ const OrderProfile = ({ coliSN, ...props }) => {
           </Typography.Text>
           <Typography.Text>
             <UserOutlined className=' pr-1' />
-            {customerDetail.name + regularText()}
+            {getCustomerName()}
           </Typography.Text>
           <Typography.Text>
             <CompassOutlined className=' pr-1' />
@@ -116,7 +133,20 @@ const OrderProfile = ({ coliSN, ...props }) => {
               width: '100%',
             }}
             variant='underlined'
-            onSelect={(value) => {}}
+								onSelect={value => {
+									setOrderPropValue(coliSN, "orderlabel", value)
+										.then(() => {
+											message.success("设置成功");
+										})
+										.catch(reason => {
+											notification.error({
+												message: "设置出错",
+												description: reason.message,
+												placement: "top",
+												duration: 60,
+											});
+										});
+								}}
             value={orderDetail.tags}
             options={orderLabelOptions}
           />
@@ -128,7 +158,20 @@ const OrderProfile = ({ coliSN, ...props }) => {
               width: '100%',
             }}
             variant='underlined'
-            onSelect={(value) => {}}
+								onSelect={value => {
+									setOrderPropValue(coliSN, "orderstatus", value)
+										.then(() => {
+											message.success("设置成功");
+										})
+										.catch(reason => {
+											notification.error({
+												message: "设置出错",
+												description: reason.message,
+												placement: "top",
+												duration: 60,
+											});
+										});
+								}}
             value={orderDetail.states}
             options={orderStatusOptions}
           />
@@ -137,7 +180,7 @@ const OrderProfile = ({ coliSN, ...props }) => {
         <Divider orientation='left'>
           <Typography.Text strong>催信</Typography.Text>
         </Divider>
-        <Checkbox.Group key='substatus' className='px-2' options={remindStatusOptions} />
+        <Checkbox.Group key='substatus' className="px-2" value={[orderRemindState]} options={remindStatusOptions} onChange={handleSetRemindState} />
 
         <Divider orientation='left'>
           <Typography.Text strong>表单信息</Typography.Text>

src/hooks/useEmail.js

@@ -160,22 +160,34 @@ export const useEmailList = (mailboxDirNode) => {
   const { OPI_SN: opi_sn, COLI_SN, VKey, VParent, ApplyDate, OrderSourceType, IsTrue } = mailboxDirNode
 
   const markAsRead = useCallback((sn_list) => {
+    // 优化性能的话，需要更新 mailList 数据，
+    // 但是更新 mailList 会造成页面全部刷新
+    // 所以还是先用 refresh()
+    // const updatedMailList = mailList.map(mail => {
+    //   if (sn_list.includes(mail.MAI_SN)) {
+    //     return { ...mail, MOI_ReadState: 1 };
+    //   }
+    //   return mail;
+    // });
+    // setMailList(updatedMailList);
+    // setLoading(true)
     updateEmailAction({
       opi_sn: opi_sn,
       mai_sn_list: sn_list,
       set: { read: 1}
-    });
+    })
     refresh()
-  }, []);
+  }, [])
 
+  // 优化同上
   const markAsProcessed = useCallback((sn_list) => {
     updateEmailAction({
       opi_sn: opi_sn,
       mai_sn_list: sn_list,
       set: { processed: 1}
-    });
+    })
     refresh()
-  }, []);
+  }, [])
 
   const getMailList = useCallback(async () => {
     console.log('getMailList', mailboxDirNode)

src/views/orders/components/MailBox.jsx

@@ -106,20 +106,17 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
           <Checkbox
           checked={selectedItems.some((i) => i.MAI_SN === item.MAI_SN)}
             onClick={e => {
-            console.info(item, 'checked: ' + e.target.checked)
             const isChecked = e.target.checked;
             const updatedSelection = isChecked
               ? [...selectedItems, item]
               : selectedItems.filter((item) => item.MAI_SN !== item.MAI_SN)
             setSelectedItems(updatedSelection)
-            console.info('selectedItems: ', updatedSelection)
             }
           }></Checkbox>
           </div>
         <div className='flex-1 pl-2'
-        onClick={() => {
+          onClick={() => {
-          console.info('item: ', item)
+            onMailItemClick(item)
-          onMailItemClick(item)
         }}>
           <Flex gap='small' vertical={true} justify='space-between' className='cursor-pointer'>
             <div>
@@ -164,7 +161,6 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
           <Tooltip title='标记已读'>
             <Button shape='circle' type='text' size='small' icon={<ReadOutlined />}
             onClick={() => {
-              console.info('markAsRead: ', selectedItems.map((item) => item.MAI_SN))
               markAsRead(selectedItems.map((item) => item.MAI_SN))
             }}
             />
@@ -172,7 +168,6 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
           <Tooltip title='已处理'>
             <Button shape='circle' type='text' size='small' icon={<MailCheckIcon />}
             onClick={() => {
-              console.info('markAsProcessed: ', selectedItems.map((item) => item.MAI_SN))
               markAsProcessed(selectedItems.map((item) => item.MAI_SN))
             }} />
           </Tooltip>