♻️ refactor(model-pricing): extract resetPricingFilters utility and eliminate duplication (#1365)

Centralize filter-reset logic to improve maintainability and consistency.

- Add `resetPricingFilters` helper to `web/src/helpers/utils.js`, encapsulating all reset actions (search, category, currency, ratio, group, quota type, etc.).
- Update `PricingFilterModal.jsx` and `PricingSidebar.jsx` to import and use the new utility instead of keeping their own duplicate `handleResetFilters`.
- Removes repeated code, ensures future changes to reset behavior require modification in only one place, and keeps components lean.

web/src/components/table/model-pricing/PricingSidebar.jsx

@@ -23,6 +23,7 @@ import PricingCategories from './filter/PricingCategories';
 import PricingGroups from './filter/PricingGroups';
 import PricingQuotaTypes from './filter/PricingQuotaTypes';
 import PricingDisplaySettings from './filter/PricingDisplaySettings';
+import { resetPricingFilters } from '../../../helpers/utils';
 
 const PricingSidebar = ({
   showWithRecharge,
@@ -41,41 +42,17 @@ const PricingSidebar = ({
   ...categoryProps
 }) => {
 
-  // 重置所有筛选条件
+  const handleResetFilters = () =>
-  const handleResetFilters = () => {
+    resetPricingFilters({
-    // 重置搜索
+      handleChange,
-    if (handleChange) {
+      setActiveKey,
-      handleChange('');
+      availableCategories: categoryProps.availableCategories,
-    }
+      setShowWithRecharge,
-
+      setCurrency,
-    // 重置模型分类到默认
+      setShowRatio,
-    if (setActiveKey && categoryProps.availableCategories?.length > 0) {
+      setFilterGroup,
-      setActiveKey(categoryProps.availableCategories[0]);
+      setFilterQuotaType,
-    }
+    });
-
-    // 重置充值价格显示
-    if (setShowWithRecharge) {
-      setShowWithRecharge(false);
-    }
-
-    // 重置货币
-    if (setCurrency) {
-      setCurrency('USD');
-    }
-
-    // 重置显示倍率
-    setShowRatio(false);
-
-    // 重置分组筛选
-    if (setFilterGroup) {
-      setFilterGroup('all');
-    }
-
-    // 重置计费类型筛选
-    if (setFilterQuotaType) {
-      setFilterQuotaType('all');
-    }
-  };
 
   return (
     <div className="p-4">

web/src/components/table/model-pricing/modal/PricingFilterModal.jsx

@@ -18,8 +18,12 @@ For commercial licensing, please contact support@quantumnous.com
 */
 
 import React from 'react';
-import { Modal } from '@douyinfe/semi-ui';
+import { Modal, Button } from '@douyinfe/semi-ui';
-import PricingSidebar from '../PricingSidebar';
+import PricingCategories from '../filter/PricingCategories';
+import PricingGroups from '../filter/PricingGroups';
+import PricingQuotaTypes from '../filter/PricingQuotaTypes';
+import PricingDisplaySettings from '../filter/PricingDisplaySettings';
+import { resetPricingFilters } from '../../../../helpers/utils';
 
 const PricingFilterModal = ({
   visible,
@@ -27,20 +31,100 @@ const PricingFilterModal = ({
   sidebarProps,
   t
 }) => {
+  const {
+    showWithRecharge,
+    setShowWithRecharge,
+    currency,
+    setCurrency,
+    handleChange,
+    setActiveKey,
+    showRatio,
+    setShowRatio,
+    filterGroup,
+    setFilterGroup,
+    filterQuotaType,
+    setFilterQuotaType,
+    ...categoryProps
+  } = sidebarProps;
+
+  const handleResetFilters = () =>
+    resetPricingFilters({
+      handleChange,
+      setActiveKey,
+      availableCategories: categoryProps.availableCategories,
+      setShowWithRecharge,
+      setCurrency,
+      setShowRatio,
+      setFilterGroup,
+      setFilterQuotaType,
+    });
+
+  const handleConfirm = () => {
+    onClose();
+  };
+
+  const footer = (
+    <div className="flex justify-end">
+      <Button
+        theme="outline"
+        type='tertiary'
+        onClick={handleResetFilters}
+      >
+        {t('重置')}
+      </Button>
+      <Button
+        theme="solid"
+        type="primary"
+        onClick={handleConfirm}
+      >
+        {t('确定')}
+      </Button>
+    </div>
+  );
+
   return (
     <Modal
       title={t('筛选')}
       visible={visible}
       onCancel={onClose}
-      footer={null}
+      footer={footer}
       style={{ width: '100%', height: '100%', margin: 0 }}
       bodyStyle={{
         padding: 0,
-        height: 'calc(100vh - 110px)', 
+        height: 'calc(100vh - 160px)',
-        overflow: 'auto' 
+        overflowY: 'auto',
+        scrollbarWidth: 'none',
+        msOverflowStyle: 'none'
       }}
     >
-      <PricingSidebar {...sidebarProps} />
+      <div className="p-2">
+        <PricingDisplaySettings
+          showWithRecharge={showWithRecharge}
+          setShowWithRecharge={setShowWithRecharge}
+          currency={currency}
+          setCurrency={setCurrency}
+          showRatio={showRatio}
+          setShowRatio={setShowRatio}
+          t={t}
+        />
+
+        <PricingCategories {...categoryProps} setActiveKey={setActiveKey} t={t} />
+
+        <PricingGroups
+          filterGroup={filterGroup}
+          setFilterGroup={setFilterGroup}
+          usableGroup={categoryProps.usableGroup}
+          models={categoryProps.models}
+          t={t}
+        />
+
+        <PricingQuotaTypes
+          filterQuotaType={filterQuotaType}
+          setFilterQuotaType={setFilterQuotaType}
+          models={categoryProps.models}
+          t={t}
+        />
+      </div>
     </Modal>
   );
 };

web/src/helpers/utils.js

@@ -616,3 +616,55 @@ export const createCardProPagination = ({
     </>
   );
 };
+
+// -------------------------------
+// 重置模型定价筛选条件
+export const resetPricingFilters = ({
+  handleChange,
+  setActiveKey,
+  availableCategories,
+  setShowWithRecharge,
+  setCurrency,
+  setShowRatio,
+  setFilterGroup,
+  setFilterQuotaType,
+}) => {
+  // 重置搜索
+  if (typeof handleChange === 'function') {
+    handleChange('');
+  }
+
+  // 重置模型分类到默认
+  if (
+    typeof setActiveKey === 'function' &&
+    Array.isArray(availableCategories) &&
+    availableCategories.length > 0
+  ) {
+    setActiveKey(availableCategories[0]);
+  }
+
+  // 重置充值价格显示
+  if (typeof setShowWithRecharge === 'function') {
+    setShowWithRecharge(false);
+  }
+
+  // 重置货币
+  if (typeof setCurrency === 'function') {
+    setCurrency('USD');
+  }
+
+  // 重置显示倍率
+  if (typeof setShowRatio === 'function') {
+    setShowRatio(false);
+  }
+
+  // 重置分组筛选
+  if (typeof setFilterGroup === 'function') {
+    setFilterGroup('all');
+  }
+
+  // 重置计费类型筛选
+  if (typeof setFilterQuotaType === 'function') {
+    setFilterQuotaType('all');
+  }
+};