修复套餐编码顺序问题

src/components/products/index.tsx

@@ -45,20 +45,27 @@ function ProductShortCode<T extends { code: string }>(
   const { field, fieldState } = props
 
   const params = new URLSearchParams(field.value)
+  const mode = params.get("mode") || "quota"
+  const live = params.get("live") || "0"
+  const expire = params.get("expire") || "0"
+
   const setParams = (data: {
     mode?: string
     live?: string
     expire?: string
   }) => {
-    if (data.mode) params.set("mode", data.mode)
-    if (data.live) params.set("live", data.live)
-    if (data.expire) params.set("expire", data.expire)
-    field.onChange(params.toString())
+    const newParams = new URLSearchParams()
+    newParams.set("mode", data.mode || mode)
+    newParams.set("live", data.live || live)
+    newParams.set("expire", data.expire || expire)
+    console.log(newParams.toString())
+    field.onChange(newParams.toString())
   }
 
   const onModeChange = (value: string) => {
     setParams({ mode: value })
   }
+
   const onLiveChange = (e: ChangeEvent<HTMLInputElement>) => {
     let value = e.target.value || "0"
     if (value.length > 1 && value[0] === "0") {
@@ -67,6 +74,7 @@ function ProductShortCode<T extends { code: string }>(
     if (!/^([0-9]+)$/.test(value)) return
     setParams({ live: value })
   }
+
   const onExpireChange = (e: ChangeEvent<HTMLInputElement>) => {
     let value = e.target.value || "0"
     if (value.length > 1 && value[0] === "0") {
@@ -82,10 +90,7 @@ function ProductShortCode<T extends { code: string }>(
       <FieldGroup>
         <Field>
           <FieldLabel>套餐类型</FieldLabel>
-          <Select
-            defaultValue={params.get("mode") ?? "quota"}
-            onValueChange={onModeChange}
-          >
+          <Select defaultValue={mode} onValueChange={onModeChange}>
             <SelectTrigger>
               <SelectValue placeholder="请选择套餐类型" />
             </SelectTrigger>
@@ -97,20 +102,12 @@ function ProductShortCode<T extends { code: string }>(
         </Field>
         <Field>
           <FieldLabel>有效期（分钟）</FieldLabel>
-          <Input
-            type="number"
-            value={params.get("live") ?? "0"}
-            onChange={onLiveChange}
-          />
+          <Input type="number" value={live} onChange={onLiveChange} />
         </Field>
         {params.get("mode") === "time" && (
           <Field>
             <FieldLabel>过期时间（天）</FieldLabel>
-            <Input
-              type="number"
-              value={params.get("expire") ?? "0"}
-              onChange={onExpireChange}
-            />
+            <Input type="number" value={expire} onChange={onExpireChange} />
           </Field>
         )}
         {fieldState.error && <FieldError errors={[fieldState.error]} />}
@@ -125,18 +122,21 @@ function ProductLongCode<T extends { code: string }>(
   const { field, fieldState } = props
 
   const params = new URLSearchParams(field.value)
+  const mode = params.get("mode") || "quota"
+  const live = params.get("live") || "0"
+  const expire = params.get("expire") || "0"
+
   const setParams = (data: {
     mode?: string
     live?: string
     expire?: string
   }) => {
-    if (!params.get("mode")) params.set("mode", "quota")
-    if (!params.get("expire")) params.set("expire", "0")
-
-    if (data.mode) params.set("mode", data.mode)
-    if (data.live) params.set("live", data.live)
-    if (data.expire) params.set("expire", data.expire)
-    field.onChange(params.toString())
+    const newParams = new URLSearchParams()
+    newParams.set("mode", data.mode || mode)
+    newParams.set("live", data.live || live)
+    newParams.set("expire", data.expire || expire)
+    console.log(newParams.toString())
+    field.onChange(newParams.toString())
   }
 
   const onModeChange = (value: string) => {
@@ -171,10 +171,7 @@ function ProductLongCode<T extends { code: string }>(
       <FieldGroup>
         <Field>
           <FieldLabel>套餐类型</FieldLabel>
-          <Select
-            defaultValue={params.get("mode") ?? "quota"}
-            onValueChange={onModeChange}
-          >
+          <Select defaultValue={mode} onValueChange={onModeChange}>
             <SelectTrigger>
               <SelectValue placeholder="请选择套餐类型" />
             </SelectTrigger>
@@ -186,20 +183,12 @@ function ProductLongCode<T extends { code: string }>(
         </Field>
         <Field>
           <FieldLabel>有效期（分钟）</FieldLabel>
-          <Input
-            type="number"
-            value={params.get("live") ?? "0"}
-            onChange={onLiveChange}
-          />
+          <Input type="number" value={live} onChange={onLiveChange} />
         </Field>
         {params.get("mode") === "time" && (
           <Field>
             <FieldLabel>过期时间（天）</FieldLabel>
-            <Input
-              type="number"
-              value={params.get("expire") ?? "0"}
-              onChange={onExpireChange}
-            />
+            <Input type="number" value={expire} onChange={onExpireChange} />
           </Field>
         )}
         {fieldState.error && <FieldError errors={[fieldState.error]} />}