feat: update

zhongnanhuang
1 parent 895ac433
Showing 6 changed files with 429 additions and 26 deletions
package-lock.json
package.json
src/pages/Order/components/MessageListDrawer.tsx
src/pages/Order/index.tsx
src/services/definition.ts
src/services/request.ts
@@ -16,7 +16,8 @@
         "axios": "^1.6.1",
         "base-64": "^1.0.0",
         "lodash": "^4.17.21",
-        "print-js": "^1.6.0"
+        "print-js": "^1.6.0",
+        "react-infinite-scroll-component": "^6.1.0"
       },
       "devDependencies": {
         "@inspir/pluto": "^1.0.5",
@@ -19752,6 +19753,25 @@
         "react-dom": "^16.6.0 || ^17.0.0 || ^18.0.0"
       }
     },
+    "node_modules/react-infinite-scroll-component": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-infinite-scroll-component/-/react-infinite-scroll-component-6.1.0.tgz",
+      "integrity": "sha512-SQu5nCqy8DxQWpnUVLx7V7b7LcA37aM7tvoWjTLZp1dk6EJibM5/4EJKzOnl07/BsM1Y40sKLuqjCwwH/xV0TQ==",
+      "dependencies": {
+        "throttle-debounce": "^2.1.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.0.0"
+      }
+    },
+    "node_modules/react-infinite-scroll-component/node_modules/throttle-debounce": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-2.3.0.tgz",
+      "integrity": "sha512-H7oLPV0P7+jgvrk+6mwwwBDmxTaxnu9HMXmloNLXwnNO0ZxZ31Orah2n8lU1eMPvsaowP2CX+USCgyovXfdOFQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -40196,6 +40216,21 @@
         "shallowequal": "^1.1.0"
       }
     },
+    "react-infinite-scroll-component": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-infinite-scroll-component/-/react-infinite-scroll-component-6.1.0.tgz",
+      "integrity": "sha512-SQu5nCqy8DxQWpnUVLx7V7b7LcA37aM7tvoWjTLZp1dk6EJibM5/4EJKzOnl07/BsM1Y40sKLuqjCwwH/xV0TQ==",
+      "requires": {
+        "throttle-debounce": "^2.1.0"
+      },
+      "dependencies": {
+        "throttle-debounce": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-2.3.0.tgz",
+          "integrity": "sha512-H7oLPV0P7+jgvrk+6mwwwBDmxTaxnu9HMXmloNLXwnNO0ZxZ31Orah2n8lU1eMPvsaowP2CX+USCgyovXfdOFQ=="
+        }
+      }
+    },
     "react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -21,7 +21,8 @@
     "axios": "^1.6.1",
     "base-64": "^1.0.0",
     "lodash": "^4.17.21",
-    "print-js": "^1.6.0"
+    "print-js": "^1.6.0",
+    "react-infinite-scroll-component": "^6.1.0"
   },
   "devDependencies": {
     "@inspir/pluto": "^1.0.5",
+import { RESPONSE_CODE } from '@/constants/enum';
+import { postOrderErpMessageQueryMyMessage } from '@/services';
+import { formatDateTime, getUserInfo } from '@/utils';
+import { UserOutlined } from '@ant-design/icons';
+import { Avatar, Badge, Divider, Drawer, Flex, List, Skeleton } from 'antd';
+import { useEffect, useState } from 'react';
+import InfiniteScroll from 'react-infinite-scroll-component';
+
+export default ({ setVisible }) => {
+  const userInfo = getUserInfo();
+  const current = useState<number>(1); //当前页码
+  const [total, setTotal] = useState(0);
+  const [messageListData, setMessageListData] = useState<any[]>([]); //列表数据
+
+  /**
+   * 获取消息列表
+   */
+  async function getMessageListData() {
+    let res = await postOrderErpMessageQueryMyMessage({
+      data: { username: userInfo.username, current: current[0] },
+    });
+    if (res && res.result === RESPONSE_CODE.SUCCESS) {
+      setMessageListData([...messageListData, ...res?.data?.data]);
+      setTotal(res?.data?.total);
+    }
+  }
+
+  /**
+   * 跳转到订单列表
+   */
+  function toOrderList(mainOrderId: any) {
+    window.open('/order?id=' + mainOrderId, '_blank');
+  }
+
+  function renderTarget() {
+    document.getElementsByClassName('ant-drawer-body')[0].id = 'scrollableDiv';
+    return document.getElementsByClassName('ant-drawer-body')[0];
+  }
+
+  useEffect(() => {
+    getMessageListData();
+  }, []);
+
+  return (
+    <>
+      <Drawer
+        title="消息列表"
+        onClose={() => {
+          setVisible(false);
+        }}
+        open={true}
+        width={450}
+        styles={{ body: { paddingTop: 0 } }}
+      >
+        <InfiniteScroll
+          dataLength={messageListData.length}
+          next={getMessageListData}
+          hasMore={messageListData.length < total}
+          loader={<Skeleton avatar paragraph={{ rows: 1 }} active />}
+          endMessage={<Divider plain>没有更多消息了 🤐</Divider>}
+          scrollableTarget={renderTarget}
+        >
+          <List
+            dataSource={messageListData}
+            renderItem={(item) => (
+              <List.Item key={item.id}>
+                <List.Item.Meta
+                  avatar={
+                    <Badge dot={item.unreadNum > 0}>
+                      <Avatar shape="square" icon={<UserOutlined />} />
+                    </Badge>
+                  }
+                />
+                <Flex
+                  vertical
+                  className="hover:cursor-pointer"
+                  onClick={() => {
+                    toOrderList(item.mainOrderId);
+                  }}
+                >
+                  <Flex>
+                    <div>
+                      {item.content}
+                      <span className="text-[#8C8C8C]">
+                        （点击跳转到对应主订单）
+                      </span>
+                    </div>
+                  </Flex>
+                  <Flex>
+                    <span className="text-xs text-[#8C8C8C] pt-1">
+                      {formatDateTime(item.createTime)}
+                    </span>
+                  </Flex>
+                </Flex>
+              </List.Item>
+            )}
+          />
+        </InfiniteScroll>
+      </Drawer>
+    </>
+  );
+};
@@ -3,6 +3,7 @@ import { RESPONSE_CODE } from &#39;@/constants/enum&#39;;
 import {
   postKingdeeRepSalBillOutbound,
   postKingdeeRepSalOrderSave,
+  postOrderErpMessageGetUnreadNum,
   postServiceOrderCancelSend,
   postServiceOrderNoNeedSend,
   postServiceOrderOrderCancel,
@@ -25,6 +26,7 @@ import {
 import { getReceivingCompanyOptions } from '@/utils/order';
 import { getUserInfo } from '@/utils/user';
 import {
+  BellOutlined,
   ClockCircleTwoTone,
   ContainerTwoTone,
   CopyOutlined,
@@ -44,6 +46,7 @@ import {
 import { history } from '@umijs/max';
 import {
   Avatar,
+  Badge,
   Button,
   Checkbox,
   Divider,
@@ -76,6 +79,7 @@ import FinancialMergeDrawer from &#39;./components/FinancialMergeDrawer&#39;;
 import FinancialReceiptsModal from './components/FinancialReceiptsModal';
 import HistoryModal from './components/HistoryModal';
 import ImportModal from './components/ImportModal';
+import MessageListDrawer from './components/MessageListDrawer';
 import ModifiedDiffModal from './components/ModifiedDiffModal';
 import OrderDrawer from './components/OrderDrawer';
 import OrderNotesEditModal from './components/OrderNotesEditModal';
@@ -146,6 +150,8 @@ const OrderPage = () =&gt; {
     useState<boolean>(false);
   const [productionTimeModalVisible, setProductionTimeModalVisible] =
     useState<boolean>(false);
+  const [messageListDrawerVisible, setMessageListDrawerVisible] =
+    useState<boolean>(false);
   const [deliverVisible, setDeliverVisible] = useState<boolean>(false);
   const [deliverInfoDrawerVisible, setDeliverInfoDrawerVisible] =
     useState<boolean>(false);
@@ -170,6 +176,7 @@ const OrderPage = () =&gt; {
   const [currentOptMainId, setCurrentMainId] = useState<any>(undefined); //当前操作对象的主订单id
   const [curretnOptSubId, setCurretnOptSubId] = useState<any>(undefined); //当前操作对象的子订单id
   const [subOrderCount, setSubOrderCount] = useState(0);
+  const [unreadMsgNum, setUnreadMsgNum] = useState(0);
   const [sorted, setSorted] = useState(false);
   const mainTableRef = useRef<ActionType>();
   const mainTableFormRef = useRef<ProFormInstance>();
@@ -261,6 +268,13 @@ const OrderPage = () =&gt; {
   }
   /**
+   * 打开消息弹窗
+   */
+  function openMessageDrawer() {
+    setMessageListDrawerVisible(true);
+  }
+
+  /**
    * 财务是否选中排序
    * @param e
    */
@@ -3411,7 +3425,7 @@ const OrderPage = () =&gt; {
             message.error('请选择订单');
             return;
           }
-          let body = { flag: 30, ids: selectedMainOrderKeys };
+          let body = { flag: 30, id: selectedMainOrderKeys };
           exportLoading();
           orderExport('/api/service/order/export', body, exportLoadingDestory);
         },
@@ -3642,6 +3656,16 @@ const OrderPage = () =&gt; {
     return toolBtns;
   }
+  /**
+   * 获取当前用户未读消息条数
+   */
+  async function getUnreadMessageNum() {
+    let res = await postOrderErpMessageGetUnreadNum();
+    if (res && res.result === RESPONSE_CODE.SUCCESS) {
+      setUnreadMsgNum(res.data);
+    }
+  }
+
   useEffect(() => {
     // 使用URLSearchParams来解析查询参数
     const params = new URLSearchParams(location.search);
@@ -3649,6 +3673,9 @@ const OrderPage = () =&gt; {
     if (id) {
       mainTableFormRef.current?.setFieldValue('id', id);
     }
+
+    //未读消息条数
+    getUnreadMessageNum();
   }, []);
   return (
@@ -3657,7 +3684,21 @@ const OrderPage = () =&gt; {
       header={{
         title: '订单管理',
         extra: [
-          <Avatar key="0" style={{ verticalAlign: 'middle' }} size="large">
+          <Badge
+            key="message"
+            count={unreadMsgNum}
+            className="hover:cursor-pointer"
+          >
+            <BellOutlined
+              style={{ fontSize: '24px' }}
+              onClick={openMessageDrawer}
+            />
+          </Badge>,
+          <Avatar
+            key="0"
+            style={{ verticalAlign: 'middle', marginLeft: '10px' }}
+            size="large"
+          >
             {userInfo?.username}
           </Avatar>,
           <Tag key="nickName">{userInfo?.nickName}</Tag>,
@@ -4207,6 +4248,10 @@ const OrderPage = () =&gt; {
           }}
         />
       )}
+
+      {messageListDrawerVisible && (
+        <MessageListDrawer setVisible={setMessageListDrawerVisible} />
+      )}
       {contextHolder}
     </PageContainer>
   );
@@ -805,6 +805,16 @@ export interface MeasureUnitListResRow {
   precision?: string;
 }
+export interface MessageQueryDTO {
+  /** @format int32 */
+  current?: number;
+  /** @format int32 */
+  pageSize?: number;
+  /** @format int32 */
+  total?: number;
+  username?: string;
+}
+
 export interface ModelAndView {
   empty?: boolean;
   model?: any;
@@ -41,7 +41,7 @@ import type {
   MaterialStockRes,
   MaterialUnitListRes,
   MeasureUnitListRes,
-  ModelAndView,
+  MessageQueryDTO,
   OrderAddVO,
   OrderAuditLogQueryVO,
   OrderBaseInfoQueryVO,
@@ -253,7 +253,9 @@ export interface GetErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   Unauthorized
@@ -274,9 +276,9 @@ export interface GetErrorResponse {
 export type GetErrorResponseSuccess = GetErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  */
 export const getError = /* #__PURE__ */ (() => {
   const method = 'get';
@@ -300,7 +302,9 @@ export interface PutErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   Created
@@ -326,9 +330,9 @@ export interface PutErrorResponse {
 export type PutErrorResponseSuccess = PutErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  * @consumes application/json
  */
 export const putError = /* #__PURE__ */ (() => {
@@ -353,7 +357,9 @@ export interface PostErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   Created
@@ -379,9 +385,9 @@ export interface PostErrorResponse {
 export type PostErrorResponseSuccess = PostErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  * @consumes application/json
  */
 export const postError = /* #__PURE__ */ (() => {
@@ -406,7 +412,9 @@ export interface DeleteErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   No Content
@@ -427,9 +435,9 @@ export interface DeleteErrorResponse {
 export type DeleteErrorResponseSuccess = DeleteErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  */
 export const deleteError = /* #__PURE__ */ (() => {
   const method = 'delete';
@@ -453,7 +461,9 @@ export interface OptionsErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   No Content
@@ -474,9 +484,9 @@ export interface OptionsErrorResponse {
 export type OptionsErrorResponseSuccess = OptionsErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  * @consumes application/json
  */
 export const optionsError = /* #__PURE__ */ (() => {
@@ -501,7 +511,9 @@ export interface HeadErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   No Content
@@ -522,9 +534,9 @@ export interface HeadErrorResponse {
 export type HeadErrorResponseSuccess = HeadErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  * @consumes application/json
  */
 export const headError = /* #__PURE__ */ (() => {
@@ -549,7 +561,9 @@ export interface PatchErrorResponse {
    * @description
    *   OK
    */
-  200: ModelAndView;
+  200: {
+    [propertyName: string]: any;
+  };
   /**
    * @description
    *   No Content
@@ -570,9 +584,9 @@ export interface PatchErrorResponse {
 export type PatchErrorResponseSuccess = PatchErrorResponse[200];
 /**
  * @description
- *   errorHtml
+ *   error
  * @tags basic-error-controller
- * @produces text/html
+ * @produces *
  * @consumes application/json
  */
 export const patchError = /* #__PURE__ */ (() => {
@@ -3949,6 +3963,202 @@ export const postOrderErpMenusTree = /* #__PURE__ */ (() =&gt; {
   return request;
 })();
+/** @description response type for postOrderErpMessageGetUnreadNum */
+export interface PostOrderErpMessageGetUnreadNumResponse {
+  /**
+   * @description
+   *   OK
+   */
+  200: ServerResult;
+  /**
+   * @description
+   *   Created
+   */
+  201: any;
+  /**
+   * @description
+   *   Unauthorized
+   */
+  401: any;
+  /**
+   * @description
+   *   Forbidden
+   */
+  403: any;
+  /**
+   * @description
+   *   Not Found
+   */
+  404: any;
+}
+
+export type PostOrderErpMessageGetUnreadNumResponseSuccess =
+  PostOrderErpMessageGetUnreadNumResponse[200];
+/**
+ * @description
+ *   getUnreadNum
+ * @tags message-controller
+ * @produces *
+ * @consumes application/json
+ */
+export const postOrderErpMessageGetUnreadNum = /* #__PURE__ */ (() => {
+  const method = 'post';
+  const url = '/order/erp/message/getUnreadNum';
+  function request(): Promise<PostOrderErpMessageGetUnreadNumResponseSuccess> {
+    return requester(request.url, {
+      method: request.method,
+    }) as unknown as Promise<PostOrderErpMessageGetUnreadNumResponseSuccess>;
+  }
+
+  /** http method */
+  request.method = method;
+  /** request url */
+  request.url = url;
+  return request;
+})();
+
+/** @description request parameter type for postOrderErpMessageQueryMyMessage */
+export interface PostOrderErpMessageQueryMyMessageOption {
+  /**
+   * @description
+   *   messageQueryDTO
+   */
+  body: {
+    /**
+        @description
+          messageQueryDTO */
+    messageQueryDTO: MessageQueryDTO;
+  };
+}
+
+/** @description response type for postOrderErpMessageQueryMyMessage */
+export interface PostOrderErpMessageQueryMyMessageResponse {
+  /**
+   * @description
+   *   OK
+   */
+  200: ServerResult;
+  /**
+   * @description
+   *   Created
+   */
+  201: any;
+  /**
+   * @description
+   *   Unauthorized
+   */
+  401: any;
+  /**
+   * @description
+   *   Forbidden
+   */
+  403: any;
+  /**
+   * @description
+   *   Not Found
+   */
+  404: any;
+}
+
+export type PostOrderErpMessageQueryMyMessageResponseSuccess =
+  PostOrderErpMessageQueryMyMessageResponse[200];
+/**
+ * @description
+ *   queryMyMessage
+ * @tags message-controller
+ * @produces *
+ * @consumes application/json
+ */
+export const postOrderErpMessageQueryMyMessage = /* #__PURE__ */ (() => {
+  const method = 'post';
+  const url = '/order/erp/message/queryMyMessage';
+  function request(
+    option: PostOrderErpMessageQueryMyMessageOption,
+  ): Promise<PostOrderErpMessageQueryMyMessageResponseSuccess> {
+    return requester(request.url, {
+      method: request.method,
+      ...option,
+    }) as unknown as Promise<PostOrderErpMessageQueryMyMessageResponseSuccess>;
+  }
+
+  /** http method */
+  request.method = method;
+  /** request url */
+  request.url = url;
+  return request;
+})();
+
+/** @description request parameter type for postOrderErpMessageRead */
+export interface PostOrderErpMessageReadOption {
+  /**
+   * @description
+   *   ids
+   */
+  body: {
+    /**
+        @description
+          ids */
+    ids: Array<number>;
+  };
+}
+
+/** @description response type for postOrderErpMessageRead */
+export interface PostOrderErpMessageReadResponse {
+  /**
+   * @description
+   *   OK
+   */
+  200: ServerResult;
+  /**
+   * @description
+   *   Created
+   */
+  201: any;
+  /**
+   * @description
+   *   Unauthorized
+   */
+  401: any;
+  /**
+   * @description
+   *   Forbidden
+   */
+  403: any;
+  /**
+   * @description
+   *   Not Found
+   */
+  404: any;
+}
+
+export type PostOrderErpMessageReadResponseSuccess =
+  PostOrderErpMessageReadResponse[200];
+/**
+ * @description
+ *   queryMyMessage
+ * @tags message-controller
+ * @produces *
+ * @consumes application/json
+ */
+export const postOrderErpMessageRead = /* #__PURE__ */ (() => {
+  const method = 'post';
+  const url = '/order/erp/message/read';
+  function request(
+    option: PostOrderErpMessageReadOption,
+  ): Promise<PostOrderErpMessageReadResponseSuccess> {
+    return requester(request.url, {
+      method: request.method,
+      ...option,
+    }) as unknown as Promise<PostOrderErpMessageReadResponseSuccess>;
+  }
+
+  /** http method */
+  request.method = method;
+  /** request url */
+  request.url = url;
+  return request;
+})();
+
 /** @description request parameter type for postOrderErpOptLogListByPage */
 export interface PostOrderErpOptLogListByPageOption {
   /**