Переглянути джерело

♻️ refactor(admin): update area selection component API and logic

- change API query parameters from individual fields to filters JSON object
- modify default option value from empty string to 'none' for better type safety
- update ID parsing logic to check for 'none' value explicitly
- standardize empty selection handling across province, city and district components
yourname 4 місяців тому
батько
коміт
8ec6ab2e4d
1 змінених файлів з 20 додано та 14 видалено
  1. 20 14
      src/client/admin/components/AreaSelect.tsx

+ 20 - 14
src/client/admin/components/AreaSelect.tsx

@@ -43,8 +43,10 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
         query: {
           page: 1,
           pageSize: 100,
-          level: 1,
-          isDisabled: 0
+          filters: JSON.stringify({
+            level: 1,
+            isDisabled: 0
+          })
         }
       });
       if (res.status !== 200) throw new Error('获取省份列表失败');
@@ -63,9 +65,11 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
         query: {
           page: 1,
           pageSize: 100,
-          level: 2,
-          parentId: selectedProvince,
-          isDisabled: 0
+          filters: JSON.stringify({
+            level: 2,
+            parentId: selectedProvince,
+            isDisabled: 0
+          })
         }
       });
       if (res.status !== 200) throw new Error('获取城市列表失败');
@@ -85,9 +89,11 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
         query: {
           page: 1,
           pageSize: 100,
-          level: 3,
-          parentId: selectedCity,
-          isDisabled: 0
+          filters: JSON.stringify({
+            level: 3,
+            parentId: selectedCity,
+            isDisabled: 0
+          })
         }
       });
       if (res.status !== 200) throw new Error('获取区县列表失败');
@@ -100,7 +106,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
 
   // 处理省份选择
   const handleProvinceChange = (provinceId: string) => {
-    const id = provinceId ? Number(provinceId) : undefined;
+    const id = provinceId && provinceId !== 'none' ? Number(provinceId) : undefined;
     setSelectedProvince(id);
     setSelectedCity(undefined);
     setSelectedDistrict(undefined);
@@ -114,7 +120,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
 
   // 处理城市选择
   const handleCityChange = (cityId: string) => {
-    const id = cityId ? Number(cityId) : undefined;
+    const id = cityId && cityId !== 'none' ? Number(cityId) : undefined;
     setSelectedCity(id);
     setSelectedDistrict(undefined);
 
@@ -127,7 +133,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
 
   // 处理区县选择
   const handleDistrictChange = (districtId: string) => {
-    const id = districtId ? Number(districtId) : undefined;
+    const id = districtId && districtId !== 'none' ? Number(districtId) : undefined;
     setSelectedDistrict(id);
 
     onChange?.({
@@ -163,7 +169,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
               </SelectTrigger>
             </FormControl>
             <SelectContent>
-              <SelectItem value="">请选择省份</SelectItem>
+              <SelectItem value="none">请选择省份</SelectItem>
               {provinces?.data.map((province: AreaResponse) => (
                 <SelectItem key={province.id} value={province.id.toString()}>
                   {province.name}
@@ -195,7 +201,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
               </SelectTrigger>
             </FormControl>
             <SelectContent>
-              <SelectItem value="">请选择城市</SelectItem>
+              <SelectItem value="none">请选择城市</SelectItem>
               {cities?.data.map((city: AreaResponse) => (
                 <SelectItem key={city.id} value={city.id.toString()}>
                   {city.name}
@@ -227,7 +233,7 @@ export const AreaSelect: React.FC<AreaSelectProps> = ({
               </SelectTrigger>
             </FormControl>
             <SelectContent>
-              <SelectItem value="">请选区县</SelectItem>
+              <SelectItem value="none">请选区县</SelectItem>
               {districts?.data.map((district: AreaResponse) => (
                 <SelectItem key={district.id} value={district.id.toString()}>
                   {district.name}