feat: update

zhongnanhuang
1 parent 7780aaa4
Showing 3 changed files with 73 additions and 35 deletions
src/app.ts
src/pages/Order/constant.ts
src/pages/Order/index.tsx
@@ -23,8 +23,8 @@ export const layout = () =&gt; {
       headerRender: true,
       // rightContentRender: () => <RightContent />,
       // footerRender: () => <Footer />,
-      siderWidth: 190,
     },
+    collapsed: true,
   };
 };
@@ -94,6 +94,8 @@ export const SALES_CODE_OPTIONS = [
   { label: 'W-8_Andy', value: 'W-8_Andy' },
   { label: 'CQ_Peter', value: 'CQ_Peter' },
   { label: 'MA_A_Mao', value: 'MA_A_Mao' },
+  { label: 'CQ-2', value: 'CQ-2' },
+  { label: 'JJ', value: 'JJ' },
 ];
 export const MAIN_ORDER_COLUMNS = [
@@ -51,6 +51,7 @@ import {
   PAYMENT_CHANNEL_OPTIONS,
   PAYMENT_METHOD_OPTIONS,
   PRODUCT_BELONG_DEPARTMENT_OPTIONS,
+  TAGS_COLOR,
 } from './constant';
 import './index.less';
 import { OrderListItemType, OrderType } from './type.d';
@@ -165,12 +166,24 @@ const OrderPage = () =&gt; {
   const OrderTableHeader = () => {
     return (
       <Flex className="w-full">
-        <Flex className="w-[24%] ml-[5%]">商品信息</Flex>
-        <Flex className="w-[15%]">交易金额</Flex>
-        <Flex className="w-[10%]">支付</Flex>
-        <Flex className="w-[13%]">其他</Flex>
-        <Flex className="w-[10%]">交易状态</Flex>
-        <Flex className="w-[23%]">操作</Flex>
+        <Flex className="w-[29%] ml-[4%]">
+          <span className="font-medium">商品信息</span>
+        </Flex>
+        <Flex className="w-[16%]">
+          <span className="font-medium">交易金额</span>
+        </Flex>
+        <Flex className="w-[10%]">
+          <span className="font-medium">支付</span>
+        </Flex>
+        <Flex className="w-[14%]">
+          <span className="font-medium">其他</span>
+        </Flex>
+        <Flex className="w-[10%]">
+          <span className="font-medium">交易状态</span>
+        </Flex>
+        <Flex className="w-[17%]">
+          <span className="font-medium">操作</span>
+        </Flex>
       </Flex>
     );
   };
@@ -178,9 +191,11 @@ const OrderPage = () =&gt; {
   const SubOderRander = ({ record, optRecord }) => {
     return (
       <Flex className="w-full border-b-indigo-500">
-        <Flex vertical className="w-[26%]" gap="small">
+        <Flex vertical className="w-[31%]" gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {optRecord.productName}
+            <span className="text-black font-medium ">
+              {optRecord.productName}
+            </span>
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
             <span className="text-gray-500">参数：{optRecord.parameters}</span>
@@ -200,48 +215,64 @@ const OrderPage = () =&gt; {
         </Flex>
         <Flex className="w-[16%]" vertical gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            <span className="text-gray-500">单价：</span>￥
-            {optRecord.productPrice}
+            <span className="text-gray-500">单价：</span>
+            <span className="text-slate-700">￥{optRecord.productPrice}</span>
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            <span className="text-gray-500">数量：</span>x{optRecord.quantity}
+            <span className="text-gray-500">数量：</span>
+            <span className="text-slate-700">x{optRecord.quantity}</span>
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            <span className="text-gray-500">合计：</span>￥
-            {optRecord.subOrderPayment}
+            <span className="text-gray-500">合计：</span>
+            <span className="text-slate-700">
+              ￥{optRecord.subOrderPayment}
+            </span>
           </div>
         </Flex>
         <Flex className="w-[10%]" vertical gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {enumValueToLabel(optRecord.paymentMethod, PAYMENT_METHOD_OPTIONS)}
+            <span className="text-slate-700">
+              {enumValueToLabel(
+                optRecord.paymentMethod,
+                PAYMENT_METHOD_OPTIONS,
+              )}
+            </span>
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {enumValueToLabel(
-              optRecord.paymentChannel,
-              PAYMENT_CHANNEL_OPTIONS,
-            )}
+            <span className="text-slate-700">
+              {enumValueToLabel(
+                optRecord.paymentChannel,
+                PAYMENT_CHANNEL_OPTIONS,
+              )}
+            </span>
           </div>
         </Flex>
         <Flex className="w-[15%]" vertical gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {enumValueToLabel(
-              optRecord.productBelongBusiness,
-              PRODUCT_BELONG_DEPARTMENT_OPTIONS,
-            )}
+            <span className="text-slate-700">
+              {enumValueToLabel(
+                optRecord.productBelongBusiness,
+                PRODUCT_BELONG_DEPARTMENT_OPTIONS,
+              )}
+            </span>
           </div>
         </Flex>
         <Flex className="w-[10%]" vertical gap="small">
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {enumValueToLabel(
-              optRecord.invoicingStatus,
-              INVOCING_STATUS_OPTIONS,
-            )}
+            <Tag color={TAGS_COLOR.get(optRecord.invoicingStatus)}>
+              {enumValueToLabel(
+                optRecord.invoicingStatus,
+                INVOCING_STATUS_OPTIONS,
+              )}
+            </Tag>
           </div>
           <div className="whitespace-no-wrap overflow-hidden overflow-ellipsis">
-            {enumValueToLabel(optRecord.orderStatus, ORDER_STATUS_OPTIONS)}
+            <Tag color={TAGS_COLOR.get(optRecord.orderStatus)}>
+              {enumValueToLabel(optRecord.orderStatus, ORDER_STATUS_OPTIONS)}
+            </Tag>
           </div>
         </Flex>
-        <Flex className="w-[23%]" wrap="wrap" gap="small">
+        <Flex className="w-[18%]" wrap="wrap" gap="small">
           {optRecord.subPath.includes('sendProduct') ? (
             <Button
               className="p-0"
@@ -444,6 +475,7 @@ const OrderPage = () =&gt; {
         options={false}
         dataSource={subOrders}
         pagination={false}
+        tableAlertRender={false}
       />
     );
   };
@@ -467,7 +499,7 @@ const OrderPage = () =&gt; {
                   <Space split={<Divider type="vertical" />}>
                     <div>
                       <span className="text-gray-500">订单号：</span>
-                      <span>{record.id}</span>
+                      <span className="text-slate-700">{record.id}</span>
                     </div>
                     <span>{formatDateTime(record.createTime)}</span>
                   </Space>
@@ -475,15 +507,17 @@ const OrderPage = () =&gt; {
                 <Space split={<Divider type="vertical" />}>
                   <div>
                     <span className="text-gray-500">代表：</span>
-                    {record.salesCode}
+                    <span className="text-slate-700">{record.salesCode}</span>
                   </div>
                   <span>
                     <span className="text-gray-500">单位：</span>
-                    {record.institution}
+                    <span className="text-slate-700">{record.institution}</span>
                   </span>
                   <span>
                     <span className="text-gray-500">联系人：</span>
-                    {record.institutionContactName}
+                    <span className="text-slate-700">
+                      {record.institutionContactName}
+                    </span>
                   </span>
                 </Space>
               </Flex>
@@ -509,8 +543,10 @@ const OrderPage = () =&gt; {
             <Flex justify="flex-end">
               <Flex wrap="wrap" gap="middle" align="center">
                 <div>
-                  <span>总金额：</span>
-                  <span className="text-lg">{record.totalPayment}￥</span>
+                  <span className="text-gray-500">总金额：￥</span>
+                  <span className="text-lg font-medium">
+                    {record.totalPayment}
+                  </span>
                 </div>
                 {rolePath?.includes('addOrder') ? (
                   <CopyTwoTone