feat: update

zhongnanhuang
1 parent 04acf26a
Showing 1 changed file with 49 additions and 41 deletions
src/pages/Order/index.tsx
@@ -7,9 +7,10 @@ import {
 import { orderExport } from '@/services/order';
 import { enumValueToLabel, formatDateTime } from '@/utils';
 import {
-  ClockCircleOutlined,
-  CopyOutlined,
+  ClockCircleTwoTone,
+  CopyTwoTone,
   DownOutlined,
+  EditTwoTone,
   EllipsisOutlined,
 } from '@ant-design/icons';
 import {
@@ -22,6 +23,7 @@ import {
   Avatar,
   Button,
   Checkbox,
+  Divider,
   Dropdown,
   Flex,
   MenuProps,
@@ -181,32 +183,32 @@ const OrderPage = () =&gt; {
             {optRecord.productName}
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {optRecord.parameters}
+            <span className="text-gray-500">参数：{optRecord.parameters}</span>
           </div>
-          <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {optRecord.notes}
-            <Button
-              type="dashed"
-              size="small"
+          <Flex title={optRecord.notes}>
+            <div className="max-w-[90%] whitespace-no-wrap overflow-hidden overflow-ellipsis">
+              <span className="text-gray-500">备注：{optRecord.notes}</span>
+            </div>
+            <EditTwoTone
               onClick={() => {
                 setNotesEditVisible(true);
                 setOrderRow(optRecord);
                 setIsMainOrder(false);
               }}
-            >
-              详情
-            </Button>
-          </div>
+            />
+          </Flex>
         </Flex>
         <Flex className="w-[16%]" vertical gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            单价：￥{optRecord.productPrice}
+            <span className="text-gray-500">单价：</span>￥
+            {optRecord.productPrice}
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            数量：x{optRecord.quantity}
+            <span className="text-gray-500">数量：</span>x{optRecord.quantity}
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            合计：￥{optRecord.subOrderPayment}
+            <span className="text-gray-500">合计：</span>￥
+            {optRecord.subOrderPayment}
           </div>
         </Flex>
         <Flex className="w-[10%]" vertical gap="small">
@@ -448,13 +450,6 @@ const OrderPage = () =&gt; {
   // 主订单内容渲染
   const MainOrderColumnRender = ({ record }: { record: OrderListItemType }) => {
-    // const handleExpand = (key: number) => {
-    //   const newExpandedRowKeys = expandedRowKeys.includes(key)
-    //     ? expandedRowKeys.filter((k) => k !== key)
-    //     : [...expandedRowKeys, key];
-
-    //   setExpandedRowKeys(newExpandedRowKeys);
-    // };
     return (
       <Flex vertical={true}>
         {/* 编号、时间、销售信息 */}
@@ -469,43 +464,56 @@ const OrderPage = () =&gt; {
                   onChange={() => onCheckboxChange(record.id)}
                   checked={selectedItems.includes(record.id)}
                 >
+                  <Space split={<Divider type="vertical" />}>
+                    <div>
+                      <span className="text-gray-500">订单号：</span>
+                      <span>{record.id}</span>
+                    </div>
+                    <span>{formatDateTime(record.createTime)}</span>
+                  </Space>
+                </Checkbox>
+                <Space split={<Divider type="vertical" />}>
                   <div>
-                    订单号：{record.id}
-                    {'    ' + formatDateTime(record.createTime)}
+                    <span className="text-gray-500">代表：</span>
+                    {record.salesCode}
                   </div>
-                </Checkbox>
-                <div>代表：{record.salesCode}</div>
-                <span>单位：{record.institution}</span>
-                <span>联系人：{record.institutionContactName}</span>
+                  <span>
+                    <span className="text-gray-500">单位：</span>
+                    {record.institution}
+                  </span>
+                  <span>
+                    <span className="text-gray-500">联系人：</span>
+                    {record.institutionContactName}
+                  </span>
+                </Space>
               </Flex>
             </Flex>
             <Flex className="pl-6" align="center">
-              <div>
-                备注：
-                <span className="ml-2">{record.notes}</span>
+              <div title={record.notes}>
+                <div className="max-w-md whitespace-no-wrap overflow-hidden overflow-ellipsis">
+                  <span className="text-gray-500">备注：</span>
+                  <span className="ml-2">{record.notes}</span>
+                </div>
               </div>
-              <Button
-                className="p-0"
-                type="link"
+              <EditTwoTone
+                className="hover:curcor-pointer"
                 onClick={() => {
                   setNotesEditVisible(true);
                   setOrderRow(record);
                   setIsMainOrder(true);
                 }}
-              >
-                备注
-              </Button>
+              />
             </Flex>
           </Flex>
           <Flex wrap="wrap" gap="middle" vertical>
             <Flex justify="flex-end">
               <Flex wrap="wrap" gap="middle" align="center">
                 <div>
-                  总金额：
+                  <span>总金额：</span>
                   <span className="text-lg">{record.totalPayment}￥</span>
                 </div>
                 {rolePath?.includes('addOrder') ? (
-                  <CopyOutlined
+                  <CopyTwoTone
                     className="hover:cursor-pointer"
                     onClick={() => {
                       setOrderOptType('copy');
@@ -522,7 +530,7 @@ const OrderPage = () =&gt; {
                   ''
                 )}
-                <ClockCircleOutlined
+                <ClockCircleTwoTone
                   className="hover:cursor-pointer"
                   onClick={() => {
                     setHistoryModalVisible(true);
@@ -939,7 +947,7 @@ const OrderPage = () =&gt; {
         // expandable={{ expandedRowRender }}
         dateFormatter="string"
         options={false}
-        headerTitle="订单列表"
+        headerTitle=""
         search={{
           labelWidth: 'auto',
           // onCollapse: resize,