fix(shop): persist settings through backend

app/(dashboard)/dashboard/shop/rules/page.tsx

@@ -12,54 +12,71 @@ import {
   SelectValue,
 } from "@/components/ui/select"
 import { Switch } from "@/components/ui/switch"
-import { resolveOwnerShop } from "@/lib/domain/resolve-current-shop"
+import { updateShop } from "@/lib/api"
+import { toApiError } from "@/lib/errors"
+import { useMyShop } from "@/lib/hooks/use-my-shop"
+import { notifyInfo, notifySuccess } from "@/lib/toast"
 import type { Shop } from "@/lib/types"
-import { useAuthStore } from "@/store/auth"
-import { useShopStore } from "@/store/shops"
 import { Save } from "lucide-react"
 import { useState } from "react"
 
 export default function ShopRulesPage() {
-  const userId = useAuthStore((state) => state.user?.id)
-  const shops = useShopStore((state) => state.shops)
-  const shop = resolveOwnerShop(userId, shops)
-  const updateShop = useShopStore((state) => state.updateShop)
+  const { shop, setShop, loading, error } = useMyShop()
+
+  if (loading) {
+    return <div className="text-sm text-muted-foreground">加载中...</div>
+  }
+
+  if (error) {
+    return <div className="text-sm text-muted-foreground">{error}</div>
+  }
 
   if (!shop) {
     return <div className="text-sm text-muted-foreground">当前账号没有可管理的店铺</div>
   }
 
-  return <ShopRulesForm key={shop.id} shop={shop} updateShop={updateShop} />
+  return <ShopRulesForm key={shop.id} shop={shop} setShop={setShop} />
 }
 
-function ShopRulesForm({
-  shop,
-  updateShop,
-}: {
-  shop: Shop
-  updateShop: (shopId: string, patch: Partial<Omit<Shop, "id" | "owner">>) => void
-}) {
+function ShopRulesForm({ shop, setShop }: { shop: Shop; setShop: (shop: Shop | null) => void }) {
   const [commissionType, setCommissionType] = useState<Shop["commissionType"]>(shop.commissionType)
   const [commissionValue, setCommissionValue] = useState(shop.commissionValue)
   const [allowMultiShop, setAllowMultiShop] = useState(shop.allowMultiShop)
   const [allowIndependentOrders, setAllowIndependentOrders] = useState(shop.allowIndependentOrders)
   const [dispatchMode, setDispatchMode] = useState<Shop["dispatchMode"]>(shop.dispatchMode)
+  const [saving, setSaving] = useState(false)
 
-  const handleSave = () => {
-    updateShop(shop.id, {
-      commissionType,
-      commissionValue,
-      allowMultiShop,
-      allowIndependentOrders,
-      dispatchMode,
-    })
+  const handleSave = async () => {
+    setSaving(true)
+    try {
+      const nextShop = await updateShop(shop.id, {
+        name: shop.name,
+        description: shop.description,
+        commissionType,
+        commissionValue,
+        allowMultiShop,
+        allowIndependentOrders,
+        dispatchMode,
+      })
+      setShop(nextShop)
+      notifySuccess("规则已保存")
+    } catch (error) {
+      notifyInfo(toApiError(error).msg)
+    } finally {
+      setSaving(false)
+    }
   }
 
   return (
     <div className="container mx-auto max-w-4xl px-4 py-8 space-y-8">
       <div className="flex items-center justify-between">
         <h1 className="text-2xl font-bold">规则设置</h1>
-        <Button onClick={handleSave}>
+        <Button
+          onClick={() => {
+            void handleSave()
+          }}
+          disabled={saving}
+        >
           <Save className="mr-2 h-4 w-4" />
           保存设置
         </Button>