feat (1.36.0 -> 1.37.0): 实现图像处理页面多语言支持

- 在 ImageInfoArea.tsx 中添加 useIntl hook，实现图像详情和tag信息按钮的多语言化
- 在 MeasurementPanel.tsx 中集成 React Intl，支持基础测量、专业测量和宠物专用测量的多语言显示
- 在 MorePanel.tsx 中添加国际化支持，包括选择操作、信息查看和相关说明文本
- 在 RectCropPanel.tsx 中实现矩形裁剪面板的多语言化，包括按钮标题和操作说明
- 在 SliderAdjustmentPanel.tsx 中添加 useIntl，支持滑动参数调节面板的所有标签和文本
- 更新 en.js 和 zh.js 文件，新增相关的多语言键值对，支持中英文双语界面

改动文件：
- src/assets/i18n/messages/en.js
- src/assets/i18n/messages/zh.js
- src/pages/view/components/ImageInfoArea.tsx
- src/pages/view/components/MeasurementPanel.tsx
- src/pages/view/components/MorePanel.tsx
- src/pages/view/components/RectCropPanel.tsx
- src/pages/view/components/SliderAdjustmentPanel.tsx
- package.json
- CHANGELOG.md

CHANGELOG.md

@@ -2,6 +2,44 @@
 
 本项目的所有重要变更都将记录在此文件中。
 
+## [1.37.0] - 2025-12-31 13:06
+
+### 新增 (Added)
+
+- **图像处理页面多语言支持** - 为图像处理页面的各个组件添加完整的国际化支持
+  - 在 ImageInfoArea.tsx 中添加 useIntl hook，实现图像详情和tag信息按钮的多语言化
+  - 在 MeasurementPanel.tsx 中集成 React Intl，支持基础测量、专业测量和宠物专用测量的多语言显示
+  - 在 MorePanel.tsx 中添加国际化支持，包括选择操作、信息查看和相关说明文本
+  - 在 RectCropPanel.tsx 中实现矩形裁剪面板的多语言化，包括按钮标题和操作说明
+  - 在 SliderAdjustmentPanel.tsx 中添加 useIntl，支持滑动参数调节面板的所有标签和文本
+  - 更新 en.js 和 zh.js 文件，新增相关的多语言键值对，支持中英文双语界面
+
+**核心功能实现:**
+
+- 多语言键值对：新增 imageInfoArea、measurementPanel、morePanel、rectCropPanel、sliderAdjustmentPanel 等相关翻译键
+- 动态翻译：所有UI文本使用 intl.formatMessage 动态获取当前语言
+- 组件集成：5个组件完整集成 React Intl 多语言支持
+- 双语支持：中文和英文翻译完整覆盖所有新增界面文本
+
+**技术实现:**
+
+- 在各个组件中导入 useIntl hook，添加 intl 实例
+- 使用 intl.formatMessage({ id: 'xxx' }) 替换所有硬编码文本
+- 在 en.js 和 zh.js 中添加翻译资源
+- Modal.confirm 的 title、content、okText、cancelText 全部动态化
+- 按钮 title 支持条件渲染，根据禁用状态显示不同文本
+
+**改动文件:**
+
+- src/assets/i18n/messages/en.js
+- src/assets/i18n/messages/zh.js
+- src/pages/view/components/ImageInfoArea.tsx
+- src/pages/view/components/MeasurementPanel.tsx
+- src/pages/view/components/MorePanel.tsx
+- src/pages/view/components/RectCropPanel.tsx
+- src/pages/view/components/SliderAdjustmentPanel.tsx
+- package.json (版本更新: 1.36.0 -> 1.37.0)
+
 ## [1.36.0] - 2025-12-31 11:20
 
 ### 新增 (Added)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zsis",
-  "version": "1.36.0",
+  "version": "1.37.0",
   "private": true,
   "description": "医学成像系统",
   "main": "main.js",

src/assets/i18n/messages/en.js

@@ -336,4 +336,44 @@ export default {
   "transferArea.send": "Send",
   "transferArea.sendDisabled": "Send (not available in multi-grid mode)",
   "transferArea.download": "Download DICOM Image",
+  "imageInfoArea.imageDetails": "Image Details",
+  "imageInfoArea.tagInfo": "Tag Info",
+  "measurementPanel.title": "Image Measurement",
+  "measurementPanel.basicMeasurements": "Basic Measurements",
+  "measurementPanel.lineMeasurement": "Line Measurement",
+  "measurementPanel.angleMeasurement": "Angle Measurement",
+  "measurementPanel.clearMeasurement": "Clear Measurement",
+  "measurementPanel.measurementCalibration": "Measurement Calibration",
+  "measurementPanel.basicMeasurementsNote": "Note: Select measurement mark, i.e. line measurement mark",
+  "measurementPanel.professionalMeasurements": "Professional Measurements",
+  "measurementPanel.cobbAngle": "Cobb Angle",
+  "measurementPanel.petSpecificMeasurements": "Pet Specific Measurements",
+  "morePanel.title": "More Functions",
+  "morePanel.selectionOperations": "Selection Operations",
+  "morePanel.selectAll": "Select All",
+  "morePanel.invertSelection": "Invert Selection",
+  "morePanel.selectionOperationsNote": "Note: Select all or invert selection of all images in viewers",
+  "morePanel.informationView": "Information View",
+  "morePanel.imageDetails": "Image Details",
+  "morePanel.tagInfo": "Tag Info",
+  "morePanel.informationViewNote": "Note: View detailed image information and tag related information (function not implemented yet)",
+  "sliderAdjustmentPanel.title": "Slider Parameter Adjustment",
+  "sliderAdjustmentPanel.loadingParams": "Loading parameters...",
+  "sliderAdjustmentPanel.gain": "Gain",
+  "sliderAdjustmentPanel.detail": "Detail",
+  "sliderAdjustmentPanel.dynamicRange": "Dynamic Range",
+  "sliderAdjustmentPanel.noiseMode": "Noise Mode",
+  "sliderAdjustmentPanel.contrast": "Contrast",
+  "sliderAdjustmentPanel.brightness": "Brightness",
+  "sliderAdjustmentPanel.algorithm": "Algorithm",
+  "sliderAdjustmentPanel.lut": "LUT",
+  "sliderAdjustmentPanel.style": "Style",
+  "sliderAdjustmentPanel.resetParams": "Reset Parameters",
+  "sliderAdjustmentPanel.saveParams": "Save Parameters",
+  "rectCropPanel.title": "Rectangle Crop",
+  "rectCropPanel.cropImage": "Crop Image",
+  "rectCropPanel.undoMask": "Undo Mask",
+  "rectCropPanel.addMask": "Add Mask",
+  "rectCropPanel.deleteMask": "Delete Mask",
+  "rectCropPanel.recalculateEXI": "Recalculate EXI",
 };

src/assets/i18n/messages/zh.js

@@ -336,5 +336,45 @@ export default {
   "transferArea.send": "发送",
   "transferArea.sendDisabled": "发送 (多分格模式下不可用)",
   "transferArea.download": "下载 DICOM 图像",
+  "imageInfoArea.imageDetails": "图像详情",
+  "imageInfoArea.tagInfo": "tag信息",
+  "measurementPanel.title": "图像测量",
+  "measurementPanel.basicMeasurements": "基础测量",
+  "measurementPanel.lineMeasurement": "线段测量",
+  "measurementPanel.angleMeasurement": "角度测量",
+  "measurementPanel.clearMeasurement": "清除测量",
+  "measurementPanel.measurementCalibration": "测量校正",
+  "measurementPanel.basicMeasurementsNote": "说明：要选择测量标记，即线段测量标记",
+  "measurementPanel.professionalMeasurements": "专业测量",
+  "measurementPanel.cobbAngle": "Cobb角",
+  "measurementPanel.petSpecificMeasurements": "宠物专用测量",
+  "morePanel.title": "更多功能",
+  "morePanel.selectionOperations": "选择操作",
+  "morePanel.selectAll": "全选",
+  "morePanel.invertSelection": "反选",
+  "morePanel.selectionOperationsNote": "说明：全选或反选所有 viewer 中的图像",
+  "morePanel.informationView": "信息查看",
+  "morePanel.imageDetails": "图像详情",
+  "morePanel.tagInfo": "tag信息",
+  "morePanel.informationViewNote": "说明：查看图像详细信息和tag相关信息（功能待实现）",
+  "sliderAdjustmentPanel.title": "滑动参数调节",
+  "sliderAdjustmentPanel.loadingParams": "加载参数中...",
+  "sliderAdjustmentPanel.gain": "增益",
+  "sliderAdjustmentPanel.detail": "细节",
+  "sliderAdjustmentPanel.dynamicRange": "动态范围",
+  "sliderAdjustmentPanel.noiseMode": "噪声模式",
+  "sliderAdjustmentPanel.contrast": "对比度",
+  "sliderAdjustmentPanel.brightness": "亮度",
+  "sliderAdjustmentPanel.algorithm": "算法",
+  "sliderAdjustmentPanel.lut": "LUT",
+  "sliderAdjustmentPanel.style": "风格",
+  "sliderAdjustmentPanel.resetParams": "重置参数",
+  "sliderAdjustmentPanel.saveParams": "保存参数",
+  "rectCropPanel.title": "矩形裁剪",
+  "rectCropPanel.cropImage": "裁剪图像",
+  "rectCropPanel.undoMask": "撤销遮线框",
+  "rectCropPanel.addMask": "添加Mask",
+  "rectCropPanel.deleteMask": "删除Mask",
+  "rectCropPanel.recalculateEXI": "重新计算EXI",
 
 };

src/pages/view/components/ImageInfoArea.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Button, Flex } from 'antd';
+import { useIntl } from 'react-intl';
 import Icon from '@/components/Icon';
 
 /**
@@ -10,6 +11,8 @@ import Icon from '@/components/Icon';
  * - tag信息按钮：显示tag相关信息（功能待实现）
  */
 const ImageInfoArea: React.FC = () => {
+  const intl = useIntl();
+
   // 图像详情按钮处理函数（待实现）
   const handleImageDetails = () => {
     // TODO: 实现图像详情功能
@@ -41,7 +44,7 @@ const ImageInfoArea: React.FC = () => {
           height: '1.5rem',
           padding: 0,
         }}
-        title="图像详情"
+        title={intl.formatMessage({ id: 'imageInfoArea.imageDetails' })}
       />
       <Button
         onClick={handleTagInfo}
@@ -60,7 +63,7 @@ const ImageInfoArea: React.FC = () => {
           height: '1.5rem',
           padding: 0,
         }}
-        title="tag信息"
+        title={intl.formatMessage({ id: 'imageInfoArea.tagInfo' })}
       />
     </Flex>
   );

src/pages/view/components/MeasurementPanel.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Layout, Button, Typography, Divider, Flex } from 'antd';
 import { ArrowLeftOutlined } from '@ant-design/icons';
+import { useIntl } from 'react-intl';
 import { useDispatch } from 'react-redux';
 import { switchToOperationPanel } from '../../../states/panelSwitchSliceForView';
 import {
@@ -62,6 +63,7 @@ const FunctionButton = ({
 };
 
 const MeasurementPanel = () => {
+  const intl = useIntl();
   const dispatch = useDispatch();
 
   const handleReturn = () => {
@@ -84,7 +86,7 @@ const MeasurementPanel = () => {
           onClick={handleReturn}
         />
         <Title level={5} style={{ margin: 0, lineHeight: '48px' }}>
-          图像测量
+          {intl.formatMessage({ id: 'measurementPanel.title' })}
         </Title>
       </Header>
 
@@ -98,32 +100,32 @@ const MeasurementPanel = () => {
             strong
             style={{ fontSize: '14px', marginBottom: '12px', display: 'block' }}
           >
-            基础测量
+            {intl.formatMessage({ id: 'measurementPanel.basicMeasurements' })}
           </Text>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
             <FunctionButton
-              title="线段测量"
+              title={intl.formatMessage({ id: 'measurementPanel.lineMeasurement' })}
               action="线段测量"
               iconName="btn_LineMeasurement"
             />
             <FunctionButton
-              title="角度测量"
+              title={intl.formatMessage({ id: 'measurementPanel.angleMeasurement' })}
               action="角度测量"
               iconName="btn_AngleMeasurement"
             />
             <FunctionButton
-              title="清除测量"
+              title={intl.formatMessage({ id: 'measurementPanel.clearMeasurement' })}
               action="清除测量"
               iconName="btn_ClearMeasurement"
             />
             <FunctionButton
-              title="测量校正"
+              title={intl.formatMessage({ id: 'measurementPanel.measurementCalibration' })}
               action="测量校正"
               iconName="MeasurementCalibration"
             />
           </Flex>
           <div style={{ marginTop: '8px', fontSize: '12px', color: '#666' }}>
-            说明：要选择测量标记，即线段测量标记
+            {intl.formatMessage({ id: 'measurementPanel.basicMeasurementsNote' })}
           </div>
         </div>
 
@@ -135,11 +137,11 @@ const MeasurementPanel = () => {
             strong
             style={{ fontSize: '14px', marginBottom: '12px', display: 'block' }}
           >
-            专业测量
+            {intl.formatMessage({ id: 'measurementPanel.professionalMeasurements' })}
           </Text>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
             <FunctionButton
-              title="Cobb角"
+              title={intl.formatMessage({ id: 'measurementPanel.cobbAngle' })}
               action="Cobb角"
               iconName="btn_Cobbangle"
               productId="animal"
@@ -155,7 +157,7 @@ const MeasurementPanel = () => {
             strong
             style={{ fontSize: '14px', marginBottom: '12px', display: 'block' }}
           >
-            宠物专用测量
+            {intl.formatMessage({ id: 'measurementPanel.petSpecificMeasurements' })}
           </Text>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
             <FunctionButton

src/pages/view/components/MorePanel.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Layout, Button, Typography, Divider, Flex } from 'antd';
 import { ArrowLeftOutlined } from '@ant-design/icons';
+import { useIntl } from 'react-intl';
 import { useDispatch, useSelector } from 'react-redux';
 import { switchToOperationPanel } from '../../../states/panelSwitchSliceForView';
 import { toggleOverlay, selectOverlayEnabled } from '@/states/view/dicomOverlaySlice';
@@ -54,6 +55,7 @@ const FunctionButton = ({
 };
 
 const MorePanel = () => {
+  const intl = useIntl();
   const dispatch = useDispatch();
 
   // 获取所有 viewer URLs 和当前选中的 viewer URLs
@@ -115,7 +117,7 @@ const MorePanel = () => {
           onClick={handleReturn}
         />
         <Title level={5} style={{ margin: 0, lineHeight: '48px' }}>
-          更多功能
+          {intl.formatMessage({ id: 'morePanel.title' })}
         </Title>
       </Header>
 
@@ -129,24 +131,24 @@ const MorePanel = () => {
             strong
             style={{ fontSize: '14px', marginBottom: '12px', display: 'block' }}
           >
-            选择操作
+            {intl.formatMessage({ id: 'morePanel.selectionOperations' })}
           </Text>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
             <FunctionButton
-              title="全选"
+              title={intl.formatMessage({ id: 'morePanel.selectAll' })}
               action="全选"
               iconName="RejectImage"
               onClick={handleSelectAll}
             />
             <FunctionButton
-              title="反选"
+              title={intl.formatMessage({ id: 'morePanel.invertSelection' })}
               action="反选"
               iconName="RejectImage"
               onClick={handleInvertSelection}
             />
           </Flex>
           <div style={{ marginTop: '8px', fontSize: '12px', color: '#666' }}>
-            说明：全选或反选所有 viewer 中的图像
+            {intl.formatMessage({ id: 'morePanel.selectionOperationsNote' })}
           </div>
         </div>
 
@@ -158,24 +160,24 @@ const MorePanel = () => {
             strong
             style={{ fontSize: '14px', marginBottom: '12px', display: 'block' }}
           >
-            信息查看
+            {intl.formatMessage({ id: 'morePanel.informationView' })}
           </Text>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
             <FunctionButton
-              title="图像详情"
+              title={intl.formatMessage({ id: 'morePanel.imageDetails' })}
               action="图像详情"
               iconName="RejectImage"
               onClick={handleImageDetails}
             />
             <FunctionButton
-              title="tag信息"
+              title={intl.formatMessage({ id: 'morePanel.tagInfo' })}
               action="tag信息"
               iconName="ShowLabel_Show"
               onClick={handleTagInfo}
             />
           </Flex>
           <div style={{ marginTop: '8px', fontSize: '12px', color: '#666' }}>
-            说明：查看图像详细信息和tag相关信息（功能待实现）
+            {intl.formatMessage({ id: 'morePanel.informationViewNote' })}
           </div>
         </div>
       </Content>

src/pages/view/components/RectCropPanel.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Layout, Button, Typography, Flex } from 'antd';
 import { ArrowLeftOutlined } from '@ant-design/icons';
+import { useIntl } from 'react-intl';
 import { useDispatch, useSelector } from 'react-redux';
 import { switchToOperationPanel } from '../../../states/panelSwitchSliceForView';
 import {
@@ -93,6 +94,7 @@ const RatioButton = ({
 };
 
 const RectCropPanel = () => {
+  const intl = useIntl();
   const dispatch = useDispatch();
   const selectedRatio = useSelector(
     (state: RootState) => state.rectCropPanel.selectedRatio
@@ -134,7 +136,7 @@ const RectCropPanel = () => {
           onClick={handleReturn}
         />
         <Title level={5} style={{ margin: 0, lineHeight: '48px' }}>
-          矩形裁剪
+          {intl.formatMessage({ id: 'rectCropPanel.title' })}
         </Title>
       </Header>
 
@@ -145,11 +147,11 @@ const RectCropPanel = () => {
         {/* 功能按钮区域 */}
         <div style={{ marginBottom: '24px' }}>
           <Flex wrap gap="small" align="center" justify="start" className="p-1">
-            <FunctionButton title="裁剪图像" action="裁剪图像" />
-            <FunctionButton title="撤销遮线框" action="撤销遮线框" />
-            <FunctionButton title="添加Mask" action="添加Mask" />
-            <FunctionButton title="删除Mask" action="删除Mask" />
-            <FunctionButton title="重新计算EXI" action="重新计算EXI" />
+            <FunctionButton title={intl.formatMessage({ id: 'rectCropPanel.cropImage' })} action="裁剪图像" />
+            <FunctionButton title={intl.formatMessage({ id: 'rectCropPanel.undoMask' })} action="撤销遮线框" />
+            <FunctionButton title={intl.formatMessage({ id: 'rectCropPanel.addMask' })} action="添加Mask" />
+            <FunctionButton title={intl.formatMessage({ id: 'rectCropPanel.deleteMask' })} action="删除Mask" />
+            <FunctionButton title={intl.formatMessage({ id: 'rectCropPanel.recalculateEXI' })} action="重新计算EXI" />
           </Flex>
         </div>
 

src/pages/view/components/SliderAdjustmentPanel.tsx

@@ -1,6 +1,7 @@
 import React, { useEffect, useCallback, useRef } from 'react';
 import { Layout, Button, Typography, Select, message, Spin, Alert } from 'antd';
 import { ArrowLeftOutlined } from '@ant-design/icons';
+import { useIntl } from 'react-intl';
 import { useDispatch } from 'react-redux';
 import { useAppSelector } from '@/states/store';
 import { useImageEnhancementSDK } from '@/hooks/useImageEnhancementSDK';
@@ -43,6 +44,7 @@ const { Option } = Select;
  * 三级面板，用于调整图像处理参数
  */
 const SliderAdjustmentPanel = () => {
+  const intl = useIntl();
   const dispatch = useDispatch();
 
   // 从 Redux 获取状态
@@ -308,7 +310,7 @@ const SliderAdjustmentPanel = () => {
           onClick={handleReturn}
         />
         <Title level={5} style={{ margin: 0, lineHeight: '48px' }}>
-          滑动参数调节
+          {intl.formatMessage({ id: 'sliderAdjustmentPanel.title' })}
         </Title>
       </Header>
 
@@ -367,14 +369,14 @@ const SliderAdjustmentPanel = () => {
               zIndex: 1000,
             }}
           >
-            <Spin size="large" tip="加载参数中..." />
+            <Spin size="large" tip={intl.formatMessage({ id: 'sliderAdjustmentPanel.loadingParams' })} />
           </div>
         )}
 
         <div style={{ opacity: isLoading ? 0.5 : 1 }}>
           {/* 增益滑块 */}
           <ParameterSlider
-            label="增益"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.gain' })}
             value={parameters.contrast}
             min={PARAMETER_RANGES.gain.min}
             max={PARAMETER_RANGES.gain.max}
@@ -386,7 +388,7 @@ const SliderAdjustmentPanel = () => {
 
           {/* 细节滑块 */}
           <ParameterSlider
-            label="细节"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.detail' })}
             value={parameters.detail}
             min={PARAMETER_RANGES.detail.min}
             max={PARAMETER_RANGES.detail.max}
@@ -398,7 +400,7 @@ const SliderAdjustmentPanel = () => {
 
           {/* 动态范围滑块 */}
           <ParameterSlider
-            label="动态范围"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.dynamicRange' })}
             value={parameters.latitude}
             min={PARAMETER_RANGES.latitude.min}
             max={PARAMETER_RANGES.latitude.max}
@@ -410,7 +412,7 @@ const SliderAdjustmentPanel = () => {
 
           {/* 噪声模式滑块 */}
           <ParameterSlider
-            label="噪声模式"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.noiseMode' })}
             value={parameters.noise}
             min={PARAMETER_RANGES.noise.min}
             max={PARAMETER_RANGES.noise.max}
@@ -422,7 +424,7 @@ const SliderAdjustmentPanel = () => {
 
           {/* 对比度滑块（前端维护） */}
           <ParameterSlider
-            label="对比度"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.contrast' })}
             value={parameters.brightness}
             min={PARAMETER_RANGES.brightness.min}
             max={PARAMETER_RANGES.brightness.max}
@@ -434,7 +436,7 @@ const SliderAdjustmentPanel = () => {
 
           {/* 亮度滑块（前端维护） */}
           <ParameterSlider
-            label="亮度"
+            label={intl.formatMessage({ id: 'sliderAdjustmentPanel.brightness' })}
             value={parameters.sharpness}
             min={PARAMETER_RANGES.sharpness.min}
             max={PARAMETER_RANGES.sharpness.max}
@@ -447,7 +449,7 @@ const SliderAdjustmentPanel = () => {
           {/* 算法选择 */}
           <div style={{ marginBottom: '16px' }}>
             <Typography.Text strong style={{ display: 'block', marginBottom: '8px' }}>
-              算法
+              {intl.formatMessage({ id: 'sliderAdjustmentPanel.algorithm' })}
             </Typography.Text>
             <Select
               value={selectedAlgorithm}
@@ -466,7 +468,7 @@ const SliderAdjustmentPanel = () => {
           {/* LUT 选择 */}
           <div style={{ marginBottom: '16px' }}>
             <Typography.Text strong style={{ display: 'block', marginBottom: '8px' }}>
-              LUT
+              {intl.formatMessage({ id: 'sliderAdjustmentPanel.lut' })}
             </Typography.Text>
             <Select
               value={selectedLUT}
@@ -485,7 +487,7 @@ const SliderAdjustmentPanel = () => {
           {/* 风格选择 */}
           <div style={{ marginBottom: '16px' }}>
             <Typography.Text strong style={{ display: 'block', marginBottom: '8px' }}>
-              风格
+              {intl.formatMessage({ id: 'sliderAdjustmentPanel.style' })}
             </Typography.Text>
             <Select
               value={selectedStyle}
@@ -511,7 +513,7 @@ const SliderAdjustmentPanel = () => {
                 fontSize: '14px',
               }}
             >
-              重置参数
+              {intl.formatMessage({ id: 'sliderAdjustmentPanel.resetParams' })}
             </Button>
             <Button
               type="primary"
@@ -526,7 +528,7 @@ const SliderAdjustmentPanel = () => {
                 borderColor: '#13c2c2',
               }}
             >
-              保存参数
+              {intl.formatMessage({ id: 'sliderAdjustmentPanel.saveParams' })}
             </Button>
           </div>
         </div>