维护国际化

src/pages/dataStatistics/supplierQualificationWarningStatistics/supplierQualificationWarningStatistics.tsx

@@ -17,6 +17,7 @@ import {
   DeleteOutlined,
   ExportOutlined
 } from '@ant-design/icons';
+import { useIntl } from 'umi';
 import CategorySelector from '@/components/CategorySelector/CategorySelector';
 import { SupplierTypeText } from '@/dicts/dataStatistics';
 import { getSupplierQualificationExpire, exportSupplierQualificationExpire } from '@/servers/api/dataStatistics';
@@ -28,6 +29,7 @@ const { Option } = Select;
 const { RangePicker } = DatePicker;
 
 const SupplierQualificationWarningStatistics: React.FC = () => {
+  const intl = useIntl();
   const [loading, setLoading] = useState<boolean>(false);
   const [form] = Form.useForm();
 
@@ -38,7 +40,7 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
     total: 0,
     showSizeChanger: true,
     showQuickJumper: true,
-    showTotal: (total) => `共 ${total} 条记录`,
+    showTotal: (total) => intl.formatMessage({ id: 'dataStatistics.common.total' }, { total }),
   });
   const [searchParams, setSearchParams] = useState<DataStatistics.QualificationExpireSearchParams>({});
 
@@ -52,8 +54,8 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
 
   // 境内/境外选项
   const areaOptions = [
-    { label: '境内', value: 'dvs' },
-    { label: '境外', value: 'ovs' },
+    { label: intl.formatMessage({ id: 'dataStatistics.common.domestic' }), value: 'dvs' },
+    { label: intl.formatMessage({ id: 'dataStatistics.common.foreign' }), value: 'ovs' },
   ];
 
   // 获取数据
@@ -97,11 +99,11 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
           total: response.data.total,
         });
       } else {
-        message.error(response.message || '获取资质预警统计数据失败');
+        message.error(response.message || intl.formatMessage({ id: 'dataStatistics.qualification.getDataFailed' }));
       }
     } catch (error) {
       console.error('获取资质预警统计数据失败:', error);
-      message.error('获取资质预警统计数据失败');
+      message.error(intl.formatMessage({ id: 'dataStatistics.qualification.getDataFailed' }));
     } finally {
       setLoading(false);
     }
@@ -130,13 +132,13 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
 
   const columns = [
     {
-      title: '序号',
+      title: intl.formatMessage({ id: 'dataStatistics.common.serialNumber' }),
       render: (_: any, __: DataStatistics.QualificationExpireRecord, index: number) =>
         (pagination.current! - 1) * pagination.pageSize! + index + 1,
       width: 80,
     },
     {
-      title: '供应商名称',
+      title: intl.formatMessage({ id: 'dataStatistics.common.supplierName' }),
       dataIndex: 'supplierName',
       key: 'supplierName',
       width: 180,
@@ -150,20 +152,20 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
       ),
     },
     {
-      title: '境内/境外',
+      title: intl.formatMessage({ id: 'dataStatistics.common.area' }),
       dataIndex: 'area',
       key: 'area',
       width: 100,
       render: (text: string) => getAreaText(text),
     },
     {
-      title: '品类',
+      title: intl.formatMessage({ id: 'dataStatistics.common.category' }),
       dataIndex: 'categoryName',
       key: 'categoryName',
       width: 120,
     },
     {
-      title: '准入单位',
+      title: intl.formatMessage({ id: 'dataStatistics.common.accessUnit' }),
       dataIndex: 'accessUnit',
       key: 'accessUnit',
       width: 150,
@@ -177,13 +179,13 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
       ),
     },
     {
-      title: '准入部门',
+      title: intl.formatMessage({ id: 'dataStatistics.common.accessDept' }),
       dataIndex: 'accessDept',
       key: 'accessDept',
       width: 120,
     },
     {
-      title: '资质名称',
+      title: intl.formatMessage({ id: 'dataStatistics.qualification.qualificationName' }),
       dataIndex: 'qualificationName',
       key: 'qualificationName',
       width: 150,
@@ -197,7 +199,7 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
       ),
     },
     {
-      title: '资质到期时间',
+      title: intl.formatMessage({ id: 'dataStatistics.qualification.termOfValidity' }),
       dataIndex: 'termOfValidity',
       key: 'termOfValidity',
       width: 120,
@@ -244,29 +246,29 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
           layout="inline"
           className="filter-form"
         >
-          <Form.Item name="supplierName" label="供应商名称">
-            <Input placeholder="请输入供应商名称" allowClear />
+          <Form.Item name="supplierName" label={intl.formatMessage({ id: 'dataStatistics.common.supplierName' })}>
+            <Input placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseInput' }) + intl.formatMessage({ id: 'dataStatistics.common.supplierName' })} allowClear />
           </Form.Item>
-          <Form.Item name="accessUnit" label="准入单位">
-            <Select placeholder="请选择准入单位" allowClear style={{ width: 200 }}>
+          <Form.Item name="accessUnit" label={intl.formatMessage({ id: 'dataStatistics.common.accessUnit' })}>
+            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) + intl.formatMessage({ id: 'dataStatistics.common.accessUnit' })} allowClear style={{ width: 200 }}>
               {companyOptions.map(option => (
                 <Option key={option.value} value={option.value}>{option.label}</Option>
               ))}
             </Select>
           </Form.Item>
-          <Form.Item name="area" label="境内/境外">
-            <Select placeholder="请选择境内/境外" allowClear style={{ width: 120 }}>
+          <Form.Item name="area" label={intl.formatMessage({ id: 'dataStatistics.common.area' })}>
+            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' })} allowClear style={{ width: 120 }}>
               {areaOptions.map(option => (
                 <Option key={option.value} value={option.value}>{option.label}</Option>
               ))}
             </Select>
           </Form.Item>
-          <Form.Item name="termOfValidityRange" label="资质到期时间">
+          <Form.Item name="termOfValidityRange" label={intl.formatMessage({ id: 'dataStatistics.qualification.validityRange' })}>
             <RangePicker style={{ width: 240 }} />
           </Form.Item>
           <Form.Item className="filter-btns">
             <Button type="primary" htmlType="submit" icon={<SearchOutlined />}>
-              搜索
+              {intl.formatMessage({ id: 'dataStatistics.common.search' })}
             </Button>
             <Button
               type="primary"
@@ -277,28 +279,27 @@ const SupplierQualificationWarningStatistics: React.FC = () => {
                 fetchStatisticsData(1, pagination.pageSize, {});
               }}
             >
-              重置
+              {intl.formatMessage({ id: 'dataStatistics.common.reset' })}
             </Button>
           </Form.Item>
         </Form>
         <div className="right-buttons">
           <Button type="primary" ghost icon={<ExportOutlined />} onClick={handleExport}>
-            导出
+            {intl.formatMessage({ id: 'dataStatistics.common.export' })}
           </Button>
         </div>
       </div>
 
-      <div className="content-area">
-        <Table
-          columns={columns}
-          rowKey="id"
-          dataSource={statisticsData}
-          pagination={pagination}
-          loading={loading}
-          onChange={handleTableChange}
-          scroll={{ x: 1200 }}
-        />
-      </div>
+      <Table
+        className="data-table"
+        rowKey="id"
+        columns={columns}
+        dataSource={statisticsData}
+        pagination={pagination}
+        loading={loading}
+        onChange={handleTableChange}
+        scroll={{ x: 1200 }}
+      />
     </div>
   );
 };