feat(charge-points): add pricing mode for charge points with validation

feat(pricing): implement tariff management with peak, valley, and flat pricing feat(api): add tariff API for fetching and updating pricing configurations feat(tariff-schema): create database schema for tariff configuration feat(pricing-page): create UI for displaying and managing pricing tiers fix(sidebar): update sidebar to include pricing settings link
2026-03-12 17:23:06 +08:00
parent 2638af3f7f
commit f7ee298060
17 changed files with 2729 additions and 89 deletions
--- a/apps/web/app/dashboard/charge-points/[id]/page.tsx
+++ b/apps/web/app/dashboard/charge-points/[id]/page.tsx
@@ -78,6 +78,7 @@ type EditForm = {
  chargePointVendor: string;
  chargePointModel: string;
  registrationStatus: "Accepted" | "Pending" | "Rejected";
+  pricingMode: "fixed" | "tou";
  feePerKwh: string;
 };

@@ -96,6 +97,7 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
    chargePointVendor: "",
    chargePointModel: "",
    registrationStatus: "Pending",
+    pricingMode: "fixed",
    feePerKwh: "0",
  });

@@ -121,6 +123,7 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
      chargePointVendor: cp.chargePointVendor ?? "",
      chargePointModel: cp.chargePointModel ?? "",
      registrationStatus: cp.registrationStatus as EditForm["registrationStatus"],
+      pricingMode: cp.pricingMode,
      feePerKwh: String(cp.feePerKwh),
    });
    setEditOpen(true);
@@ -135,7 +138,8 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
        chargePointVendor: editForm.chargePointVendor,
        chargePointModel: editForm.chargePointModel,
        registrationStatus: editForm.registrationStatus,
-        feePerKwh: fee,
+        pricingMode: editForm.pricingMode,
+        feePerKwh: editForm.pricingMode === "fixed" ? fee : 0,
      });
      await cpQuery.refetch();
      setEditOpen(false);
@@ -309,7 +313,9 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
              <div className="flex items-center justify-between gap-4 py-2">
                <dt className="shrink-0 text-sm text-muted">电价</dt>
                <dd className="text-sm text-foreground">
-                  {cp.feePerKwh > 0 ? (
+                  {cp.pricingMode === "tou" ? (
+                    <span className="text-accent font-medium">峰谷电价</span>
+                  ) : cp.feePerKwh > 0 ? (
                    <span>
                      {cp.feePerKwh} 分/kWh
                      <span className="ml-1 text-xs text-muted">
@@ -373,7 +379,9 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
              <div className="flex items-center justify-between gap-4 py-2">
                <dt className="shrink-0 text-sm text-muted">单位电价</dt>
                <dd className="text-sm text-foreground">
-                  {cp.feePerKwh > 0 ? (
+                  {cp.pricingMode === "tou" ? (
+                    <span className="text-accent font-medium">峰谷电价</span>
+                  ) : cp.feePerKwh > 0 ? (
                    <span>
                      <span className="font-semibold">¥{(cp.feePerKwh / 100).toFixed(2)}</span>
                      <span className="ml-1 text-xs text-muted">/kWh</span>
@@ -601,8 +609,33 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
                      </Select.Popover>
                    </Select>
                  </div>
+                  <div className="space-y-1.5">
+                    <Label className="text-sm font-medium">计费模式</Label>
+                    <Select
+                      fullWidth
+                      selectedKey={editForm.pricingMode}
+                      onSelectionChange={(key) =>
+                        setEditForm((f) => ({
+                          ...f,
+                          pricingMode: String(key) as EditForm["pricingMode"],
+                        }))
+                      }
+                    >
+                      <Select.Trigger>
+                        <Select.Value />
+                        <Select.Indicator />
+                      </Select.Trigger>
+                      <Select.Popover>
+                        <ListBox>
+                          <ListBox.Item id="fixed">固定电价</ListBox.Item>
+                          <ListBox.Item id="tou">峰谷电价</ListBox.Item>
+                        </ListBox>
+                      </Select.Popover>
+                    </Select>
+                  </div>
+                  {editForm.pricingMode === "fixed" && (
                  <TextField fullWidth>
-                    <Label className="text-sm font-medium">电价（分/kWh）</Label>
+                    <Label className="text-sm font-medium">固定电价（分/kWh）</Label>
                    <Input
                      type="number"
                      min="0"
@@ -612,6 +645,7 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
                      onChange={(e) => setEditForm((f) => ({ ...f, feePerKwh: e.target.value }))}
                    />
                  </TextField>
+                  )}
                </Modal.Body>
                <Modal.Footer className="flex justify-end gap-2">
                  <Button variant="ghost" onPress={() => setEditOpen(false)}>
--- a/apps/web/app/dashboard/charge-points/page.tsx
+++ b/apps/web/app/dashboard/charge-points/page.tsx
@@ -100,6 +100,7 @@ type FormData = {
  chargePointVendor: string;
  chargePointModel: string;
  registrationStatus: "Accepted" | "Pending" | "Rejected";
+  pricingMode: "fixed" | "tou";
  feePerKwh: string;
 };

@@ -108,6 +109,7 @@ const EMPTY_FORM: FormData = {
  chargePointVendor: "",
  chargePointModel: "",
  registrationStatus: "Pending",
+  pricingMode: "fixed",
  feePerKwh: "0",
 };

@@ -142,6 +144,7 @@ export default function ChargePointsPage() {
      chargePointVendor: cp.chargePointVendor ?? "",
      chargePointModel: cp.chargePointModel ?? "",
      registrationStatus: cp.registrationStatus as FormData["registrationStatus"],
+      pricingMode: cp.pricingMode,
      feePerKwh: String(cp.feePerKwh),
    });
    setFormOpen(true);
@@ -158,7 +161,8 @@ export default function ChargePointsPage() {
          chargePointVendor: formData.chargePointVendor,
          chargePointModel: formData.chargePointModel,
          registrationStatus: formData.registrationStatus,
-          feePerKwh: fee,
+          pricingMode: formData.pricingMode,
+          feePerKwh: formData.pricingMode === "fixed" ? fee : 0,
        });
      } else {
        // Create
@@ -167,7 +171,8 @@ export default function ChargePointsPage() {
          chargePointVendor: formData.chargePointVendor.trim() || undefined,
          chargePointModel: formData.chargePointModel.trim() || undefined,
          registrationStatus: formData.registrationStatus,
-          feePerKwh: fee,
+          pricingMode: formData.pricingMode,
+          feePerKwh: formData.pricingMode === "fixed" ? fee : 0,
        });
      }
      await refetchList();
@@ -300,17 +305,45 @@ export default function ChargePointsPage() {
                        </Select.Popover>
                      </Select>
                    </div>
-                    <TextField fullWidth>
-                      <Label className="text-sm font-medium">电价（分/kWh）</Label>
-                      <Input
-                        type="number"
-                        min="0"
-                        step="1"
-                        placeholder="0"
-                        value={formData.feePerKwh}
-                        onChange={(e) => setFormData((f) => ({ ...f, feePerKwh: e.target.value }))}
-                      />
-                    </TextField>
+                    <div className="space-y-1.5">
+                      <Label className="text-sm font-medium">计费模式</Label>
+                      <Select
+                        fullWidth
+                        selectedKey={formData.pricingMode}
+                        onSelectionChange={(key) =>
+                          setFormData((f) => ({
+                            ...f,
+                            pricingMode: String(key) as FormData["pricingMode"],
+                          }))
+                        }
+                      >
+                        <Select.Trigger>
+                          <Select.Value />
+                          <Select.Indicator />
+                        </Select.Trigger>
+                        <Select.Popover>
+                          <ListBox>
+                            <ListBox.Item id="fixed">固定电价</ListBox.Item>
+                            <ListBox.Item id="tou">峰谷电价</ListBox.Item>
+                          </ListBox>
+                        </Select.Popover>
+                      </Select>
+                    </div>
+                    {formData.pricingMode === "fixed" && (
+                      <TextField fullWidth>
+                        <Label className="text-sm font-medium">固定电价（分/kWh）</Label>
+                        <Input
+                          type="number"
+                          min="0"
+                          step="1"
+                          placeholder="0"
+                          value={formData.feePerKwh}
+                          onChange={(e) =>
+                            setFormData((f) => ({ ...f, feePerKwh: e.target.value }))
+                          }
+                        />
+                      </TextField>
+                    )}
                    {!isEdit && (
                      <p className="text-xs text-muted">
                        自动注册的充电桩默认状态为 Pending，需手动改为 Accepted 后才可正常上线。
@@ -365,7 +398,7 @@ export default function ChargePointsPage() {
                      .filter((c) => c.connectorId > 0)
                      .sort((a, b) => a.connectorId - b.connectorId)
                      .map((conn) => {
-                        const url = `${qrOrigin}/dashboard/charge?cpId=${qrTarget.id}&connector=${conn.connectorId}`;
+                        const url = `${qrOrigin}/charge?cpId=${qrTarget.id}&connector=${conn.connectorId}`;
                        return (
                          <div
                            key={conn.id}
@@ -401,7 +434,7 @@ export default function ChargePointsPage() {
              <Table.Column isRowHeader>标识符</Table.Column>
              {isAdmin && <Table.Column>品牌 / 型号</Table.Column>}
              {isAdmin && <Table.Column>注册状态</Table.Column>}
-              <Table.Column>电价（分/kWh）</Table.Column>
+              <Table.Column>计费模式</Table.Column>
              <Table.Column>最后发现</Table.Column>
              <Table.Column>状态</Table.Column>
              <Table.Column>接口</Table.Column>
@@ -482,8 +515,10 @@ export default function ChargePointsPage() {
                      </Chip>
                    </Table.Cell>
                  )}
-                  <Table.Cell className="tabular-nums">
-                    {cp.feePerKwh > 0 ? (
+                  <Table.Cell>
+                    {cp.pricingMode === "tou" ? (
+                      <span className="text-accent font-medium">峰谷电价</span>
+                    ) : cp.feePerKwh > 0 ? (
                      <span>
                        {cp.feePerKwh} 分
                        <span className="ml-1 text-xs text-muted">