v4.0.9版本更新-门店分类支持多选

apps/h5-partner/src/pages/StoreCreatePage.tsx

@@ -206,9 +206,9 @@ export default function StoreCreatePage() {
       .then((list) => {
         const tree = Array.isArray(list) ? list : [];
         setCategoryTree(tree);
-        if (form.categoryId && !form.categoryParentId) {
+        if (form.categoryIds.length && !form.categoryParentId) {
           const parent = tree.find((root) =>
-            (root.children ?? []).some((child) => child.id === form.categoryId),
+            (root.children ?? []).some((child) => form.categoryIds.includes(child.id)),
           );
           if (parent) patchForm({ categoryParentId: parent.id });
         }
@@ -216,12 +216,6 @@ export default function StoreCreatePage() {
       .catch(() => setCategoryTree([]));
   }, []);
 
-  const categoryChildren = useMemo(() => {
-    const parent = categoryTree.find((item) => item.id === form.categoryParentId);
-    return Array.isArray(parent?.children) ? parent!.children! : [];
-  }, [categoryTree, form.categoryParentId]);
-
-
 
   useEffect(() => {
 
@@ -523,7 +517,8 @@ export default function StoreCreatePage() {
 
           ...(form.avgPrice.trim() ? { avgPrice: Number(form.avgPrice) } : {}),
 
-          categoryId: form.categoryId.trim(),
+          categoryIds: form.categoryIds,
+          categoryId: form.categoryIds[0] || form.categoryId.trim(),
 
           intro: form.intro.trim() || undefined,
           benefitUsageRule: form.benefitUsageRule.trim() || undefined,
@@ -690,56 +685,40 @@ export default function StoreCreatePage() {
 
             <div className="partner-field">
 
-              <label>店铺类型 <span className="text-primary">*</span></label>
-
-              <div className="partner-input-row" style={{ gap: 8 }}>
-
-                <select
-
-                  className="partner-field-input partner-field-input--block"
-
-                  value={form.categoryParentId}
-
-                  onChange={(e) => patchForm({ categoryParentId: e.target.value, categoryId: '' })}
-
-                  aria-label="一级店铺类型"
-
-                >
-
-                  <option value="">选择大类</option>
-
-                  {categoryTree.map((item) => (
-
-                    <option key={item.id} value={item.id}>{item.name}</option>
-
-                  ))}
-
-                </select>
-
-                <select
-
-                  className="partner-field-input partner-field-input--block"
-
-                  value={form.categoryId}
-
-                  onChange={(e) => patchForm({ categoryId: e.target.value })}
-
-                  disabled={!form.categoryParentId}
-
-                  aria-label="二级店铺类型"
-
-                >
-
-                  <option value="">{form.categoryParentId ? '选择细类' : '请先选大类'}</option>
-
-                  {categoryChildren.map((item) => (
-
-                    <option key={item.id} value={item.id}>{item.name}</option>
-
-                  ))}
-
-                </select>
+              <label>店铺类型 <span className="text-primary">*</span> <span className="label-md text-muted">（可多选）</span></label>
 
+              <div className="partner-category-multi">
+                {categoryTree.map((parent) => (
+                  <div key={parent.id} className="partner-category-group">
+                    <div className="partner-category-group-title">{parent.name}</div>
+                    <div className="partner-category-options">
+                      {(parent.children ?? []).map((child) => {
+                        const checked = form.categoryIds.includes(child.id);
+                        return (
+                          <label key={child.id} className="partner-category-option">
+                            <input
+                              type="checkbox"
+                              checked={checked}
+                              onChange={() => {
+                                const next = checked
+                                  ? form.categoryIds.filter((id) => id !== child.id)
+                                  : [...form.categoryIds, child.id];
+                                patchForm({
+                                  categoryIds: next,
+                                  categoryId: next[0] ?? '',
+                                  categoryParentId: next.length
+                                    ? parent.id
+                                    : form.categoryParentId,
+                                });
+                              }}
+                            />
+                            <span>{child.name}</span>
+                          </label>
+                        );
+                      })}
+                    </div>
+                  </div>
+                ))}
               </div>
 
             </div>