style(purchase): 调整采购模块UI样式和结构

2025-11-19 22:08:52 +08:00 · 2025-11-19 22:08:52 +08:00 · 1e75aadbf9
commit 1e75aadbf9
parent 221e3434a0
6 changed files with 203 additions and 252 deletions
--- a/packages/app-client/src/components/purchase/section/BasicInfoSection.tsx
+++ b/packages/app-client/src/components/purchase/section/BasicInfoSection.tsx
@ -464,7 +464,7 @@ export default function BasicInfoSection(props: {
        </View>
      </Popup>

-      <View className="flex flex-col gap-2.5 rounded-lg border border-solid border-gray-200 bg-white p-2.5">
+      <View className={"flex flex-col gap-2.5"}>
        {/* 本车次号 */}
        <View className="flex flex-col gap-2.5">
          <View className={"flex flex-row items-center justify-between"}>
@ -475,7 +475,10 @@ export default function BasicInfoSection(props: {
              参考上一车：{displayReferenceVehicleNo()}
            </View>
          </View>
+        </View>
+
        {readOnly ? (
+          <View className="flex flex-col gap-2.5">
            <View
              className="flex flex-row items-center justify-between rounded-md p-2.5"
              style={{
@ -488,7 +491,9 @@ export default function BasicInfoSection(props: {
                  : "暂未生成车次"}
              </View>
            </View>
+          </View>
        ) : (
+          <View className="flex flex-col gap-2.5">
            <View
              className={`flex h-10 flex-1 items-center rounded-md border-4 border-gray-300`}
            >
@ -499,8 +504,8 @@ export default function BasicInfoSection(props: {
                onChange={(value) => updateVehicleNo(value)}
              />
            </View>
-          )}
          </View>
+        )}

        {/* 运费信息 */}
        <View className="flex flex-col gap-2.5">
@ -587,7 +592,6 @@ export default function BasicInfoSection(props: {
        </View>

        {!readOnly && (
-          <View className="flex-1 border-t border-gray-200 pt-2.5">
          <Button
            icon={<Icon name="pen-to-square" size={18} />}
            size="large"
@ -598,7 +602,6 @@ export default function BasicInfoSection(props: {
          >
            修改基础信息
          </Button>
-          </View>
        )}
      </View>
    </>
--- a/packages/app-client/src/components/purchase/section/CompanyInfoSection.tsx
+++ b/packages/app-client/src/components/purchase/section/CompanyInfoSection.tsx
@ -49,37 +49,18 @@ export default function CompanyInfoSection(props: {
    onChange?.(newPurchaseOrderVO);
  };

-  const handleRemoveCompany = () => {
-    if (readOnly) return;
-
-    setOrderCompany(undefined);
-    // 构造新的 purchaseOrderVO 对象，其中 orderCompany 为 null
-    const newPurchaseOrderVO = {
-      ...purchaseOrderVO,
-      orderCompany: undefined,
-    };
-    // 通知父组件 purchaseOrderVO 已更改
-    // @ts-ignore
-    onChange?.(newPurchaseOrderVO);
-  };
-
  return (
-    <View className="relative flex flex-col gap-2.5 rounded-lg border border-solid border-gray-200 p-2.5">
-      {!readOnly && orderCompany && (
-        <View
-          className="absolute -top-2 -right-2 flex h-6 w-6 cursor-pointer items-center justify-center rounded-full bg-gray-100"
-          onClick={handleRemoveCompany}
-        >
-          <Icon name="circle-xmark" size={24} color="#999" />
-        </View>
-      )}
-
+    <View className={"flex flex-col gap-2.5"}>
+      <View className="bg-primary/3 rounded-lg border-b border-gray-100 p-2.5">
        <View className="flex flex-row items-center justify-between">
-        <View className="text-neutral-dark text-sm font-medium">公司名称</View>
+          <View className="text-neutral-dark text-sm font-medium">
+            公司名称
+          </View>
          <View className="text-neutral-darkest text-sm">
            {orderCompany?.fullName || "请先选择销售方"}
          </View>
        </View>
+      </View>

      {!readOnly && (
        <View className="flex justify-center">
--- a/packages/app-client/src/components/purchase/section/DealerInfoSection.tsx
+++ b/packages/app-client/src/components/purchase/section/DealerInfoSection.tsx
@ -46,37 +46,9 @@ export default function (props: {
    setDealerNameOnly(undefined);
  };

-  // 清除经销商选择
-  const clearDealerSelection = () => {
-    if (readOnly) return;
-
-    setOrderDealer(undefined);
-    onChange?.({
-      ...purchaseOrderVO,
-      orderVehicle: {
-        ...purchaseOrderVO.orderVehicle,
-        //@ts-ignore
-        dealerName: undefined,
-      },
-      //@ts-ignore
-      orderDealer: undefined,
-    });
-  };
-
  return (
-    <View className="relative flex flex-col gap-2.5 rounded-lg border border-solid border-gray-200 p-2.5">
-      {!readOnly && orderDealer && (
-        <View
-          className="absolute -top-2 -right-2 flex h-6 w-6 cursor-pointer items-center justify-center rounded-full bg-gray-100"
-          onClick={(e) => {
-            e.stopPropagation();
-            clearDealerSelection();
-          }}
-        >
-          <Icon name="circle-xmark" size={24} color="#999" />
-        </View>
-      )}
-
+    <View className={"flex flex-col gap-2.5"}>
+      <View className="bg-primary/3 rounded-lg border-b border-gray-100 p-2.5">
        <View className="flex flex-row items-center justify-between">
          <View className="text-neutral-dark flex-shrink-0 text-sm">
            经销商名称
@ -93,6 +65,7 @@ export default function (props: {
            <View>• 或选择系统中已存在的其他经销商</View>
          </View>
        )}
+      </View>

      {!readOnly && (
        <DealerPicker
--- a/packages/app-client/src/components/purchase/section/MarketPriceSection.tsx
+++ b/packages/app-client/src/components/purchase/section/MarketPriceSection.tsx
@ -138,7 +138,8 @@ export default function MarketPriceSection(props: {
  const averagePurchasePrice = calculator.getAverageSalesPrice();

  return (
-    <View className={"flex flex-col gap-2.5"}>
+    <>
+      <View className="flex flex-col gap-2.5">
        <View className="flex !h-8 flex-row items-center justify-between">
          <View className="text-neutral-dark flex-shrink-0 text-sm">
            报价方式
@ -243,7 +244,8 @@ export default function MarketPriceSection(props: {
                  <View className="flex items-center justify-between">
                    <Text className="text-sm text-gray-500">箱重</Text>
                    <Text className="text-sm font-medium">
-                    {(supplier.grossWeight - supplier.netWeight).toFixed(2)} 斤
+                      {(supplier.grossWeight - supplier.netWeight).toFixed(2)}{" "}
+                      斤
                    </Text>
                  </View>
                  <View className="flex items-center justify-between">
@ -294,6 +296,7 @@ export default function MarketPriceSection(props: {
            {pricingMethod ? `${totalAmount} 元` : "-"}
          </View>
        </View>
+      </View>

      {/* 销售单价编辑弹窗 */}
      {purchaseOrderVO.orderSupplierList?.map((supplier) => (
@ -392,6 +395,6 @@ export default function MarketPriceSection(props: {
          <SafeArea position="bottom" />
        </Popup>
      ))}
-    </View>
+    </>
  );
 }
--- a/packages/app-client/src/components/purchase/section/PackagingCostSection.tsx
+++ b/packages/app-client/src/components/purchase/section/PackagingCostSection.tsx
@ -204,7 +204,7 @@ export default function PackagingCostSection(props: {

  return (
    <>
-      <View className="flex flex-col gap-2.5">
+      <View className="flex flex-col gap-2.5 divide-y divide-[#eaeaea]">
        {/* 固定费用 */}
        {fixedCosts
          .filter((item) => item.name !== "纸箱费" && item.name !== "空箱费")
--- a/packages/app-client/src/pages/purchase/reviewer/audit.tsx
+++ b/packages/app-client/src/pages/purchase/reviewer/audit.tsx
@ -5,16 +5,7 @@ import { business } from "@/services";
 import { useEffect, useState } from "react";
 import { View } from "@tarojs/components";
 import purchaseOrder from "@/constant/purchaseOrder";
-import {
-  ActionSheet,
-  Button,
-  Dialog,
-  Input,
-  Popup,
-  SafeArea,
-  TextArea,
-  Toast,
-} from "@nutui/nutui-react-taro";
+import { ActionSheet, Button, Dialog, Input, Popup, SafeArea, TextArea, Toast } from "@nutui/nutui-react-taro";
 import {
  BasicInfoSection,
  CompanyInfoSection,
@ -31,7 +22,7 @@ import {
  State,
  TaxProvisionSection,
  TaxSubsidySection,
-  WorkerAdvanceSection,
+  WorkerAdvanceSection
 } from "@/components";
 import buildUrl from "@/utils/buildUrl";
 import { PurchaseOrderCalculator } from "@/utils/PurchaseOrderCalculator";