维护年审任务管理国际化

src/pages/dataStatistics/supplierAnnualStatistics/supplierAnnualStatistics.tsx

@@ -1,25 +1,13 @@
 import React, { useState, useEffect } from 'react';
-import {
-  Button,
-  Table,
-  Input,
-  Select,
-  Form,
-  Tooltip,
-  Tag,
-  message
-} from 'antd';
+import { Button, Table, Input, Select, Form, Tooltip, Tag, message, DatePicker } from 'antd';
 import type { TablePaginationConfig } from 'antd';
-import {
-  SearchOutlined,
-  DeleteOutlined,
-  ExportOutlined
-} from '@ant-design/icons';
+import { SearchOutlined, DeleteOutlined, ExportOutlined } from '@ant-design/icons';
 import { useIntl } from 'umi';
-import { AnnualReviewYears, AnnualReviewResultText, AnnualReviewResultColor } from '@/dicts/dataStatistics';
+import { AnnualReviewResultText, AnnualReviewResultColor } from '@/dicts/dataStatistics';
 import { getSupplierAnnualReviewStatistics } from '@/servers/api/dataStatistics';
 import './supplierAnnualStatistics.less';
 import { downloadFile } from '@/utils/download';
+import moment from 'moment';
 
 const { Option } = Select;
 
@@ -28,7 +16,9 @@ const SupplierAnnualStatistics: React.FC = () => {
   const [loading, setLoading] = useState<boolean>(false);
   const [form] = Form.useForm();
 
-  const [statisticsData, setStatisticsData] = useState<DataStatistics.AnnualReviewStatisticsRecord[]>([]);
+  const [statisticsData, setStatisticsData] = useState<
+    DataStatistics.AnnualReviewStatisticsRecord[]
+  >([]);
   const [pagination, setPagination] = useState<TablePaginationConfig>({
     current: 1,
     pageSize: 10,
@@ -37,7 +27,8 @@ const SupplierAnnualStatistics: React.FC = () => {
     showQuickJumper: true,
     showTotal: (total) => intl.formatMessage({ id: 'dataStatistics.common.total' }, { total }),
   });
-  const [searchParams, setSearchParams] = useState<DataStatistics.AnnualReviewStatisticsSearchParams>({});
+  const [searchParams, setSearchParams] =
+    useState<DataStatistics.AnnualReviewStatisticsSearchParams>({});
 
   // 准入单位下拉选项 - 假数据
   const companyOptions = [
@@ -86,7 +77,9 @@ const SupplierAnnualStatistics: React.FC = () => {
           total: response.data.total,
         });
       } else {
-        message.error(response.message || intl.formatMessage({ id: 'dataStatistics.annual.getDataFailed' }));
+        message.error(
+          response.message || intl.formatMessage({ id: 'dataStatistics.annual.getDataFailed' }),
+        );
       }
     } catch (error) {
       console.error('获取年审统计数据失败:', error);
@@ -108,10 +101,12 @@ const SupplierAnnualStatistics: React.FC = () => {
 
   // 获取年审结果标签
   const getResultTag = (result: string) => {
-    const color = AnnualReviewResultColor[result as keyof typeof AnnualReviewResultColor] || 'default';
-    const text = result === '1'
-      ? intl.formatMessage({ id: 'dataStatistics.annual.qualified' })
-      : intl.formatMessage({ id: 'dataStatistics.annual.unqualified' });
+    const color =
+      AnnualReviewResultColor[result as keyof typeof AnnualReviewResultColor] || 'default';
+    const text =
+      result === '1'
+        ? intl.formatMessage({ id: 'dataStatistics.annual.qualified' })
+        : intl.formatMessage({ id: 'dataStatistics.annual.unqualified' });
     return <Tag color={color}>{text}</Tag>;
   };
 
@@ -173,7 +168,8 @@ const SupplierAnnualStatistics: React.FC = () => {
       dataIndex: 'annualreviewYear',
       key: 'annualreviewYear',
       width: 100,
-      render: (year: string) => intl.formatMessage({ id: 'dataStatistics.common.yearFormat' }, { year })
+      render: (year: string) =>
+        intl.formatMessage({ id: 'dataStatistics.common.yearFormat' }, { year }),
     },
     {
       title: intl.formatMessage({ id: 'dataStatistics.annual.annualStatisticsResult' }),
@@ -205,27 +201,71 @@ const SupplierAnnualStatistics: React.FC = () => {
           layout="inline"
           className="filter-form"
         >
-          <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
+            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="annualreviewYear" label={intl.formatMessage({ id: 'dataStatistics.annual.annualYear' })}>
-            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) + intl.formatMessage({ id: 'dataStatistics.common.year' })} allowClear style={{ width: 120 }}>
-              {AnnualReviewYears.map(option => (
-                <Option key={option.value} value={option.value}>{option.label}</Option>
+          <Form.Item
+            name="annualreviewYear"
+            getValueProps={(value) => ({
+              value: value ? moment(value) : undefined,
+            })}
+            normalize={(value) => value && value.format('YYYY')}
+            label={intl.formatMessage({ id: 'dataStatistics.annual.annualYear' })}
+          >
+            <DatePicker
+              style={{ width: '100%' }}
+              format="YYYY"
+              placeholder={
+                intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) +
+                intl.formatMessage({ id: 'dataStatistics.common.year' })
+              }
+              picker="year"
+            />
+          </Form.Item>
+          <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="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="annualStatisticsResult" label={intl.formatMessage({ id: 'dataStatistics.annual.annualResult' })}>
-            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) + intl.formatMessage({ id: 'dataStatistics.annual.annualResult' })} allowClear style={{ width: 120 }}>
-              {annualResultOptions.map(option => (
-                <Option key={option.value} value={option.value}>{option.label}</Option>
+          <Form.Item
+            name="annualStatisticsResult"
+            label={intl.formatMessage({ id: 'dataStatistics.annual.annualResult' })}
+          >
+            <Select
+              placeholder={
+                intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) +
+                intl.formatMessage({ id: 'dataStatistics.annual.annualResult' })
+              }
+              allowClear
+              style={{ width: 120 }}
+            >
+              {annualResultOptions.map((option) => (
+                <Option key={option.value} value={option.value}>
+                  {option.label}
+                </Option>
               ))}
             </Select>
           </Form.Item>

src/pages/dataStatistics/supplierExitStatistics/supplierExitStatistics.tsx

@@ -1,22 +1,7 @@
 import React, { useState, useEffect } from 'react';
-import {
-  Button,
-  Table,
-  Space,
-  Input,
-  Select,
-  Form,
-  Tooltip,
-  Tag,
-  DatePicker,
-  message
-} from 'antd';
+import { Button, Table, Space, Input, Select, Form, Tooltip, Tag, DatePicker, message } from 'antd';
 import type { TablePaginationConfig } from 'antd';
-import {
-  SearchOutlined,
-  DeleteOutlined,
-  ExportOutlined
-} from '@ant-design/icons';
+import { SearchOutlined, DeleteOutlined, ExportOutlined } from '@ant-design/icons';
 import { useIntl } from 'umi';
 import { getSupplierExitStatistics } from '@/servers/api/dataStatistics';
 import moment from 'moment';
@@ -78,7 +63,7 @@ const SupplierExitStatistics: React.FC = () => {
           pageNo: current,
           pageSize: pageSize,
         },
-        ...otherParams
+        ...otherParams,
       };
 
       // 如果有日期范围，转换为开始和结束日期
@@ -99,7 +84,9 @@ const SupplierExitStatistics: React.FC = () => {
           total: response.data.total,
         });
       } else {
-        message.error(response.message || intl.formatMessage({ id: 'dataStatistics.exit.getDataFailed' }));
+        message.error(
+          response.message || intl.formatMessage({ id: 'dataStatistics.exit.getDataFailed' }),
+        );
       }
     } catch (error) {
       console.error('获取退出统计数据失败:', error);
@@ -213,22 +200,54 @@ const SupplierExitStatistics: React.FC = () => {
           layout="inline"
           className="filter-form"
         >
-          <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
+            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={intl.formatMessage({ id: 'dataStatistics.exit.exitUnit' })}>
-            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) + intl.formatMessage({ id: 'dataStatistics.exit.exitUnit' })} allowClear style={{ width: 200 }}>
-              {companyOptions.map(option => (
-                <Option key={option.value} value={option.value}>{option.label}</Option>
+          <Form.Item
+            name="accessUnit"
+            label={intl.formatMessage({ id: 'dataStatistics.exit.exitUnit' })}
+          >
+            <Select
+              placeholder={
+                intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) +
+                intl.formatMessage({ id: 'dataStatistics.exit.exitUnit' })
+              }
+              allowClear
+              style={{ width: 200 }}
+            >
+              {companyOptions.map((option) => (
+                <Option key={option.value} value={option.value}>
+                  {option.label}
+                </Option>
               ))}
             </Select>
           </Form.Item>
-          <Form.Item name="year" label={intl.formatMessage({ id: 'dataStatistics.common.year' })}>
-            <Select placeholder={intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) + intl.formatMessage({ id: 'dataStatistics.common.year' })} allowClear style={{ width: 120 }}>
-              {yearOptions.map(option => (
-                <Option key={option.value} value={option.value}>{option.label}</Option>
-              ))}
-            </Select>
+          <Form.Item
+            name="year"
+            label={intl.formatMessage({ id: 'dataStatistics.common.year' })}
+            getValueProps={(value) => ({
+              value: value ? moment(value) : undefined,
+            })}
+            normalize={(value) => value && value.format('YYYY')}
+          >
+            <DatePicker
+              style={{ width: '100%' }}
+              format="YYYY"
+              placeholder={
+                intl.formatMessage({ id: 'dataStatistics.common.pleaseSelect' }) +
+                intl.formatMessage({ id: 'dataStatistics.common.year' })
+              }
+              picker="year"
+            />
           </Form.Item>
           <Form.Item className="filter-btns">
             <Button type="primary" htmlType="submit" icon={<SearchOutlined />}>