polish: refine admin ui controls

src/app/(admin)/admin/commerce/page.tsx

@@ -10,8 +10,15 @@ import { Label } from "@/components/ui/label";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { getCommerceData } from "./commerce-data";
 import { CommerceToggleButton } from "./_components/commerce-actions";
+import { DiscountTypeSelect } from "./_components/discount-type-select";
 
-const selectClassName = "premium-input w-full appearance-none px-3.5 py-2 text-sm outline-none";
+function formatCouponDiscount(type: string, value: unknown) {
+  const numericValue = Number(value);
+  if (type === "PERCENT_OFF") {
+    return `折扣 ${numericValue}%`;
+  }
+  return `立减 ¥${numericValue.toFixed(2)}`;
+}
 
 export const metadata: Metadata = {
   title: "商业配置",
@@ -51,10 +58,7 @@ export default async function AdminCommercePage() {
               <div className="grid gap-3 sm:grid-cols-2">
                 <div className="space-y-2">
                   <Label htmlFor="coupon-type">优惠类型</Label>
-                  <select id="coupon-type" name="discountType" className={selectClassName} defaultValue="AMOUNT_OFF">
-                    <option value="AMOUNT_OFF">立减金额</option>
-                    <option value="PERCENT_OFF">折扣百分比</option>
-                  </select>
+                  <DiscountTypeSelect />
                 </div>
                 <div className="space-y-2">
                   <Label htmlFor="coupon-value">优惠值</Label>
@@ -123,7 +127,7 @@ export default async function AdminCommercePage() {
                   </div>
                   <div className="flex flex-wrap gap-2">
                     <StatusBadge tone="warning">
-                      {coupon.discountType === "PERCENT_OFF" ? `${Number(coupon.discountValue)}%` : `¥${Number(coupon.discountValue).toFixed(2)}`}
+                      {formatCouponDiscount(coupon.discountType, coupon.discountValue)}
                     </StatusBadge>
                     <StatusBadge>{coupon.thresholdAmount == null ? "无门槛" : `满 ¥${Number(coupon.thresholdAmount).toFixed(2)}`}</StatusBadge>
                     <StatusBadge>{coupon.isPublic ? "公开展示" : "仅发放"}</StatusBadge>