perf(views): 优化"创建设备"模块多语言添加

src/i18n/locales/zh.json

@@ -71,13 +71,16 @@
     "export": "导出",
     "exportToLocal": "导出到本地",
     "failure": "失败",
+    "fault": "故障",
     "finishSetup": "完成配置",
     "group": "组",
     "item": "项",
     "month": "月",
     "needHelp": "需要帮助？",
     "newAddition": "新增",
+    "next": "下一个",
     "nextStep": "下一步",
+    "no": "否",
     "noData": "暂无数据",
     "note": "备注",
     "off": "关",
@@ -91,6 +94,7 @@
     "plzEnter": "请输入{name}",
     "plzSelect": "请选择{name}",
     "prevStep": "上一步",
+    "previous": "上一个",
     "query": "查询",
     "reLogin": "你已被登出，请重新登录",
     "recent1Day": "最近 1 天",
@@ -104,6 +108,7 @@
     "return": "返回",
     "returnFirstUse": "返回到首次使用页？",
     "revise": "修改",
+    "run": "运行",
     "rzpeat": "重复",
     "save": "保存",
     "search": "搜索",
@@ -112,6 +117,7 @@
     "sequenceNumber": "序列号",
     "serialNumber": "序号",
     "settings": "设置",
+    "shutDown": "停机",
     "skip": "跳过",
     "skipConfirm": "跳过确认",
     "skipStepConfirm": "是否跳过{name}，",
@@ -129,7 +135,8 @@
     "verification": "验证",
     "viewDoc": "查看文档",
     "warning": "警告",
-    "year": "年"
+    "year": "年",
+    "yes": "是"
   },
   "createCustomer": {
     "createAccount": "创建账号",
@@ -158,6 +165,7 @@
     "equipmentNumber": "设备编号",
     "equipmentParameterCoding": "设备参数编码",
     "equipmentParameterName": "设备参数名称",
+    "equipmentParametersEmpty": "配置设备参数不能为空！",
     "equipmentSequenceNumber": "设备参数序号",
     "factorySerialNumber": "出厂编号",
     "gatewayModel": "网关型号",
@@ -166,6 +174,8 @@
     "gatewayParameterSequenceNumber": "网关参数序号",
     "gatewaySerialNumber": "网关序列号",
     "groupName": "分组名称",
+    "groupNameEmpty": "分组名称不能为空！",
+    "groupNameRepeat": "分组名称不能重复！",
     "groupNumber": "组号",
     "groupRanking": "组别排序",
     "groupSettings": "分组设置",
@@ -177,10 +187,14 @@
     "maximumWorkingPressure": "最大工作压力(bar)",
     "modelNumber": "型号",
     "nominalVolumetric": "公称容积流量(m³/min)",
+    "parameterEncodingEmpty": "设备参数编码不能为空！",
+    "parameterEncodingRepeat": "设备参数编码存在重复项！",
     "parameters": "参数",
     "physicalInterface": "物理接口",
+    "physicalInterfaceEmpty": "物理接口不能为空！",
     "pleaseDeviceName": "请输入设备名称",
     "pleaseDeviceType": "请选择设备类型",
+    "pleaseEnterSearchName": "清输入网关参数名称搜索",
     "pleaseEquipmentGroup": "请选择设备组",
     "pleasePhysicalInterface": "请选择物理接口",
     "quickMatching": "快速匹配",
@@ -203,7 +217,22 @@
     "withinGroupRanking": "组内排序"
   },
   "dataQuery": {},
-  "deviceList": {},
+  "deviceList": {
+    "basicInformation": "基本信息",
+    "compressionLevel": "压缩级别",
+    "equipmentCategory": "设备类别",
+    "equipmentDetails": "设备详情",
+    "equipmentFailure": "设备故障",
+    "equipmentName": "设备名称",
+    "faultCondition": "故障状态",
+    "operatingStatus": "运行状态",
+    "pleaseEnterQueryContent": "请输入设备名称、品牌、型号、网关序列号",
+    "pleaseSelectItemDelete": "请选择删除项!",
+    "ratedPower": "额定功率",
+    "realTimeMonitoring": "实时监控",
+    "responsiblePerson": "负责人",
+    "uninstallPower": "卸载功率"
+  },
   "deviceWorkStatus": {
     "chillerUnit": {
       "activePower": "有功功率",

src/views/create-device/GatewayParameters.vue

@@ -670,18 +670,18 @@ const finish = async () => {
     ...customizationData.value,
   ];
   if (gatewayList.value.some((item) => item.linkName == '')) {
-    throw new Error('物理接口不能为空！');
+    throw new Error(t('createDevice.physicalInterfaceEmpty'));
   }
 
   if ([...monitorAssociationGatewayList.value, ...controlAssociationGatewayList.value].length === 0) {
-    throw new Error('配置设备参数不能为空！');
+    throw new Error(t('createDevice.equipmentParametersEmpty'));
   }
   if (dataList.some((item) => item.deviceParamCode == '')) {
-    throw new Error('设备参数编码不能为空！');
+    throw new Error(t('createDevice.parameterEncodingEmpty'));
   }
   const valueList = validateParams();
   if (valueList.length) {
-    throw new Error('设备参数编码存在重复项！');
+    throw new Error(t('createDevice.parameterEncodingRepeat'));
   }
 
   deviceParamGroups.value = [];
@@ -770,10 +770,10 @@ const deleteGroupingList = (index: number) => {
 
 const handleOk1 = () => {
   if (groupingDisplayList.value.some((item) => item.groupName == '')) {
-    return message.warning('分组名称不能为空！');
+    return message.warning(t('createDevice.groupNameEmpty'));
   }
   if (new Set(groupingDisplayList.value.map((item) => item.groupName)).size !== groupingDisplayList.value.length) {
-    return message.warning('分组名称不能重复！');
+    return message.warning(t('createDevice.groupNameRepeat'));
   }
   groupingList.value = groupingDisplayList.value;
   open1.value = false;
@@ -1273,7 +1273,7 @@ onMounted(() => {
               <ATabPane key="remote" :tab="$t('createDevice.remoteControl')" force-render>
                 <AFlex justify="space-between" align="center" class="gateway-parameters-left-bottom">
                   <AInput
-                    placeholder="清输入网关参数名称搜索"
+                    :placeholder="t('createDevice.pleaseEnterSearchName')"
                     class="input-width"
                     v-model:value="controlSearchContent"
                     allow-clear

src/views/device-list/DeviceList.vue

@@ -6,6 +6,7 @@ import { message } from 'ant-design-vue';
 import ModalGuidance from '@/layout/ModalGuidance.vue';
 import ConfirmModal from '@/components/ConfirmModal.vue';
 import { useRequest } from '@/hooks/request';
+import { t } from '@/i18n';
 import { deviceDeletion, getPageList, groupList, queryDevicesList } from '@/api';
 
 import CreateDevice from '../create-device/CreateDevice.vue';
@@ -15,49 +16,49 @@ import type { DeviceGroupItem, DevicesList, DevicesListItem, EquipmentTypeItem }
 
 const devicesColumns = [
   {
-    title: '设备名称',
+    title: t('deviceList.equipmentName'),
     dataIndex: 'deviceName',
     key: 'deviceName',
     ellipsis: true,
   },
   {
-    title: '设备组',
+    title: t('createDevice.equipmentGroup'),
     dataIndex: 'groupName',
     key: 'groupName',
     ellipsis: true,
   },
   {
-    title: '设备类别',
+    title: t('deviceList.equipmentCategory'),
     dataIndex: 'deviceTypeName',
     key: 'deviceTypeName',
     ellipsis: true,
   },
   {
-    title: '运行状态',
+    title: t('deviceList.operatingStatus'),
     dataIndex: 'runningStatus',
     key: 'runningStatus',
     ellipsis: true,
   },
   {
-    title: '故障状态',
+    title: t('deviceList.faultCondition'),
     dataIndex: 'errorStatus',
     key: 'errorStatus',
     ellipsis: true,
   },
   {
-    title: '品牌',
+    title: t('createDevice.brand'),
     dataIndex: 'brandName',
     key: 'brandName',
     ellipsis: true,
   },
   {
-    title: '型号',
+    title: t('createDevice.modelNumber'),
     dataIndex: 'modelName',
     key: 'modelName',
     ellipsis: true,
   },
   {
-    title: '网关序列号',
+    title: t('createDevice.gatewaySerialNumber'),
     dataIndex: 'snCode',
     key: 'snCode',
     ellipsis: true,
@@ -106,7 +107,7 @@ const confirm = () => {
 
 const postDeviceDeletion = () => {
   if (devicesKeys.value.length === 0) {
-    return message.warning('请选择删除项');
+    return message.warning(t('deviceList.pleaseSelectItemDelete'));
   }
   modalComponentRef.value?.showView();
 };
@@ -195,19 +196,19 @@ onMounted(() => {
     <RouterView />
     <div v-show="equipmentListShow">
       <AFlex justify="space-between">
-        <div class="text-top">设备管理</div>
+        <div class="text-top">{{ $t('navigation.deviceManage') }}</div>
         <div>
           <AButton class="deletion-button default-button" @click="postDeviceDeletion">
             <AFlex align="center">
               <SvgIcon style="margin-right: 4px" name="delete" />
 
-              <span> 删除 </span>
+              <span> {{ $t('common.delete') }} </span>
             </AFlex>
           </AButton>
           <AButton type="primary" @click="addEquipment">
             <AFlex align="center">
               <SvgIcon style="margin-right: 4px" name="plus" />
-              <span> 添加 </span>
+              <span> {{ $t('common.add') }} </span>
             </AFlex>
           </AButton>
         </div>
@@ -216,59 +217,59 @@ onMounted(() => {
       <div class="content">
         <AFlex wrap="wrap" justify="space-between">
           <div>
-            <div class="query-text">搜索</div>
+            <div class="query-text">{{ $t('common.search') }}</div>
             <AInput
-              placeholder="请输入设备名称、品牌、型号、网关序列号"
+              :placeholder="$t('deviceList.pleaseEnterQueryContent')"
               class="query-input"
               v-model:value="devicePageParam.searchContent"
             />
           </div>
           <div>
-            <div class="query-text">设备组</div>
+            <div class="query-text">{{ $t('createDevice.equipmentGroup') }}</div>
             <ACascader
               v-model:value="groupIdKeys"
               class="query-input"
               :field-names="{ label: 'groupName', value: 'id', children: 'deviceGroupChilds' }"
               :options="deviceGroup"
               change-on-select
-              placeholder="请选择"
+              :placeholder="$t('common.plzSelect')"
             />
           </div>
           <div>
-            <div class="query-text">设备类别</div>
+            <div class="query-text">{{ $t('deviceList.equipmentCategory') }}</div>
 
             <ASelect
               class="query-input"
               v-model:value="devicePageParam.deviceType"
               :options="equipmentType"
               :field-names="{ label: 'dataName', value: 'id' }"
-              placeholder="请选择"
+              :placeholder="$t('common.plzSelect')"
               :allow-clear="true"
             />
           </div>
           <div>
-            <div class="query-text">运行状态</div>
+            <div class="query-text">{{ $t('deviceList.operatingStatus') }}</div>
             <ASelect
               class="query-input"
               v-model:value="devicePageParam.runningStatus"
-              placeholder="请选择"
+              :placeholder="$t('common.plzSelect')"
               :allow-clear="true"
             >
-              <ASelectOption :value="0">离线</ASelectOption>
-              <ASelectOption :value="1">停机</ASelectOption>
-              <ASelectOption :value="2">运行</ASelectOption>
+              <ASelectOption :value="0">{{ $t('common.offline') }}</ASelectOption>
+              <ASelectOption :value="1">{{ $t('common.shutDown') }}</ASelectOption>
+              <ASelectOption :value="2">{{ $t('common.run') }}</ASelectOption>
             </ASelect>
           </div>
           <div>
-            <div class="query-text">故障状态</div>
+            <div class="query-text">{{ $t('deviceList.faultCondition') }}</div>
             <ASelect
               class="query-input"
               v-model:value="devicePageParam.errorStatus"
-              placeholder="请选择"
+              :placeholder="$t('common.plzSelect')"
               :allow-clear="true"
             >
-              <ASelectOption :value="0">正常</ASelectOption>
-              <ASelectOption :value="1">故障</ASelectOption>
+              <ASelectOption :value="0">{{ $t('envMonitor.normal') }}</ASelectOption>
+              <ASelectOption :value="1">{{ $t('common.fault') }}</ASelectOption>
             </ASelect>
           </div>
           <!-- <div>
@@ -278,13 +279,13 @@ onMounted(() => {
             v-model:value="devicePageParam.deviceType"
             :options="equipmentType"
             :field-names="{ label: 'dataName', value: 'id' }"
-            placeholder="请选择"
+            :placeholder="$t('common.plzSelect')"
           />
         </div> -->
         </AFlex>
         <AFlex justify="flex-end">
-          <AButton type="primary" class="query-button" @click="addQueryDevicesList">查询</AButton>
-          <AButton class="default-button" @click="addQueryReset">重置</AButton>
+          <AButton type="primary" class="query-button" @click="addQueryDevicesList">{{ $t('common.query') }}</AButton>
+          <AButton class="default-button" @click="addQueryReset">{{ $t('common.reset') }}</AButton>
         </AFlex>
         <ATable
           :row-selection="{
@@ -302,13 +303,13 @@ onMounted(() => {
               <span class="equipment-name" @click="addEquipmentDetails(record.id)">{{ record.deviceName }}</span>
             </template>
             <template v-if="column.key === 'runningStatus'">
-              <div v-if="record.runningStatus == 2" class="tag-style success">运行</div>
-              <div v-else-if="record.runningStatus == 1" class="tag-style failure">停机</div>
-              <div v-else class="tag-style default">离线</div>
+              <div v-if="record.runningStatus == 2" class="tag-style success">{{ $t('common.run') }}</div>
+              <div v-else-if="record.runningStatus == 1" class="tag-style failure">{{ $t('common.shutDown') }}</div>
+              <div v-else class="tag-style default">{{ $t('common.offline') }}</div>
             </template>
             <template v-if="column.key === 'errorStatus'">
-              <div v-if="record.errorStatus == 0" class="tag-style success">正常</div>
-              <div v-else class="tag-style failure" style="width: 64px">设备故障</div>
+              <div v-if="record.errorStatus == 0" class="tag-style success">{{ $t('envMonitor.normal') }}</div>
+              <div v-else class="tag-style failure" style="width: 64px">{{ $t('deviceList.equipmentFailure') }}</div>
             </template>
 
             <template v-if="column.key === 'snCode'">
@@ -326,7 +327,7 @@ onMounted(() => {
             :show-size-changer="true"
             @change="switchPages"
             show-quick-jumper
-            :show-total="(total) => `共有${total}条`"
+            :show-total="(total) => $t('common.pageTotal', { total })"
           />
         </AFlex>
       </div>
@@ -337,8 +338,8 @@ onMounted(() => {
   </ModalGuidance>
   <ConfirmModal
     ref="modalComponent"
-    :title="'删除确定'"
-    :description-text="'是否确认删除?'"
+    :title="t('common.deleteConfirmation')"
+    :description-text="t('common.confirmDeletion')"
     :icon="{ name: 'delete' }"
     :icon-bg-color="'#F56C6C'"
     @confirm="confirm"

src/views/equipment-details/EquipmentDetails.vue

@@ -89,7 +89,7 @@ const devColumns = [
     ellipsis: true,
   },
   {
-    title: '网关参数名称',
+    title: t('createDevice.gatewayParameterName'),
     dataIndex: 'gatewayParamName',
     ellipsis: true,
   },
@@ -138,7 +138,7 @@ const customizationColumns = [
     ellipsis: true,
   },
   {
-    title: '单位',
+    title: t('common.unit'),
     dataIndex: 'unit',
     key: 'unit',
     ellipsis: true,
@@ -378,7 +378,7 @@ onMounted(() => {
           <SvgIcon name="left" />
         </div>
 
-        <div class="description">设备详情</div>
+        <div class="description">{{ $t('deviceList.equipmentDetails') }}</div>
       </AFlex>
       <div>
         <ASelect
@@ -386,11 +386,11 @@ onMounted(() => {
           v-model:value="deviceId"
           :options="devicesList"
           :field-names="{ label: 'deviceName', value: 'id' }"
-          placeholder="请选择"
+          :placeholder="$t('common.plzSelect')"
           @change="selectDeviceId"
         />
-        <AButton class="previous default-button" @click="switchDevices(1)">上一个</AButton>
-        <AButton class="default-button" @click="switchDevices(2)">下一个</AButton>
+        <AButton class="default-button previous" @click="switchDevices(1)">{{ $t('common.previous') }}</AButton>
+        <AButton class="default-button" @click="switchDevices(2)">{{ $t('common.next') }}</AButton>
       </div>
     </AFlex>
     <AFlex class="equipment-details">
@@ -401,13 +401,17 @@ onMounted(() => {
         <span class="equipment-name">{{ equipmentDetailsItem.deviceName }}</span>
         <div>
           <AFlex align="center">
-            <div class="equipment-status">运行状态</div>
-            <div v-if="equipmentDetailsItem.runningStatus == 2" class="tag-style success">运行</div>
-            <div v-else-if="equipmentDetailsItem.runningStatus == 1" class="tag-style failure">停机</div>
-            <div v-else class="tag-style default">停机</div>
-            <div class="equipment-status equipment-status-left">故障状态</div>
-            <div v-if="equipmentDetailsItem.errorStatus == 0" class="tag-style success">正常</div>
-            <div v-else class="tag-style failure failure-width">设备故障</div>
+            <div class="equipment-status">{{ $t('deviceList.operatingStatus') }}</div>
+            <div v-if="equipmentDetailsItem.runningStatus == 2" class="tag-style success">{{ $t('common.run') }}</div>
+            <div v-else-if="equipmentDetailsItem.runningStatus == 1" class="tag-style failure">
+              {{ $t('common.shutDown') }}
+            </div>
+            <div v-else class="tag-style default">{{ $t('common.offline') }}</div>
+            <div class="equipment-status equipment-status-left">{{ $t('deviceList.faultCondition') }}</div>
+            <div v-if="equipmentDetailsItem.errorStatus == 0" class="tag-style success">
+              {{ $t('envMonitor.normal') }}
+            </div>
+            <div v-else class="tag-style failure failure-width">{{ $t('deviceList.equipmentFailure') }}</div>
           </AFlex>
         </div>
       </div>
@@ -415,12 +419,12 @@ onMounted(() => {
 
     <AFlex justify="space-between" align="center">
       <AFlex>
-        <div :class="switchTabs(1)" @click="addSwitchTabs">实时监控</div>
-        <div :class="switchTabs(2)" @click="addSwitchTabs">基本信息</div>
+        <div :class="switchTabs(1)" @click="addSwitchTabs">{{ $t('deviceList.realTimeMonitoring') }}</div>
+        <div :class="switchTabs(2)" @click="addSwitchTabs">{{ $t('deviceList.basicInformation') }}</div>
       </AFlex>
       <AFlex v-if="showTabs" align="center" class="pointer">
         <SvgIcon name="edit-o" />
-        <div class="editor-style">编辑</div>
+        <div class="editor-style">{{ $t('common.editor') }}</div>
       </AFlex>
     </AFlex>
 
@@ -444,23 +448,27 @@ onMounted(() => {
     <div v-else class="details-data">
       <AFlex align="center" class="dev-bottom">
         <div class="details-icon"></div>
-        <div class="details-header-text">基础信息</div>
+        <div class="details-header-text">{{ $t('common.basicInfo') }}</div>
       </AFlex>
       <AFlex>
         <ARow class="details-text basic-information">
           <ACol :span="6">
             <span
-              >设备组: <span class="details-content-color">{{ equipmentDetailsItem.groupName }}</span></span
+              >{{ $t('createDevice.equipmentGroup') }}:
+              <span class="details-content-color">{{ equipmentDetailsItem.groupName }}</span></span
             >
           </ACol>
           <ACol :span="6">
             <span
-              >设备类型: <span class="details-content-color">{{ equipmentDetailsItem.deviceTypeName }}</span>
+              >{{ $t('energyAnalysis.deviceType') }}:
+              <span class="details-content-color">{{ equipmentDetailsItem.deviceTypeName }}</span>
             </span>
           </ACol>
           <ACol :span="6">
             <span
-              >设备名:<span class="details-content-color">{{ equipmentDetailsItem.deviceName }}</span>
+              >{{ $t('createDevice.deviceName') }}:<span class="details-content-color">{{
+                equipmentDetailsItem.deviceName
+              }}</span>
             </span>
           </ACol>
         </ARow>
@@ -468,72 +476,87 @@ onMounted(() => {
 
       <AFlex align="center" class="dev-bottom">
         <div class="details-icon"></div>
-        <div class="details-header-text">详细信息</div>
+        <div class="details-header-text">{{ $t('createDevice.detailedInformation') }}</div>
       </AFlex>
       <ARow class="details-text detailed-information">
         <ACol :span="6">
           <span
-            >品牌: <span class="details-content-color">{{ equipmentDetailsItem.brandName }}</span></span
+            >{{ $t('createDevice.brand') }}:
+            <span class="details-content-color">{{ equipmentDetailsItem.brandName }}</span></span
           >
         </ACol>
         <ACol :span="6">
           <span
-            >型号: <span class="details-content-color">{{ equipmentDetailsItem.modelName }}</span>
+            >{{ $t('createDevice.modelNumber') }}:
+            <span class="details-content-color">{{ equipmentDetailsItem.modelName }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >控制器型号:<span class="details-content-color">{{ equipmentDetailsItem.modelTypeName }}</span>
+            >{{ $t('createDevice.controllerModel') }}:<span class="details-content-color">{{
+              equipmentDetailsItem.modelTypeName
+            }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >调节方式:<span class="details-content-color">{{ equipmentDetailsItem.controlTypeName }}</span>
+            >{{ $t('createDevice.adjustmentMethod') }}:<span class="details-content-color">{{
+              equipmentDetailsItem.controlTypeName
+            }}</span>
           </span>
         </ACol>
       </ARow>
       <ARow class="detailed-information details-text">
         <ACol :span="6">
           <span
-            >压缩级别: <span class="details-content-color">{{ equipmentDetailsItem.compressionLevelName }}</span></span
+            >{{ $t('deviceList.compressionLevel') }}:
+            <span class="details-content-color">{{ equipmentDetailsItem.compressionLevelName }}</span></span
           >
         </ACol>
         <ACol :span="6">
           <span
-            >电压等级: <span class="details-content-color">{{ equipmentDetailsItem.voltageLevelName }}</span>
+            >{{ $t('createDevice.voltageLevel') }}:
+            <span class="details-content-color">{{ equipmentDetailsItem.voltageLevelName }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >额定功率:<span class="details-content-color">{{ equipmentDetailsItem.powerRating }}</span>
+            >{{ $t('deviceList.ratedPower') }}:<span class="details-content-color"
+              >{{ equipmentDetailsItem.powerRating }}KW</span
+            >
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >卸载功率:<span class="details-content-color">{{ equipmentDetailsItem.powerUnload }}</span>
+            >{{ $t('deviceList.uninstallPower') }}:<span class="details-content-color"
+              >{{ equipmentDetailsItem.powerUnload }}KW</span
+            >
           </span>
         </ACol>
       </ARow>
       <ARow class="detailed-information details-text">
         <ACol :span="6">
           <span
-            >公称容积流量 (m’/min):
+            >{{ $t('createDevice.nominalVolumetric') }}:
             <span class="details-content-color">{{ equipmentDetailsItem.maximumFlow }}</span></span
           >
         </ACol>
         <ACol :span="6">
           <span
-            >额定工作压力 (bar): <span class="details-content-color">{{ equipmentDetailsItem.pressure }}</span>
+            >{{ $t('createDevice.ratedWorkingPressure') }}:
+            <span class="details-content-color">{{ equipmentDetailsItem.pressure }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span>
-            最大工作压力 (bar):<span class="details-content-color">{{ equipmentDetailsItem.pressureMax }}</span>
+            {{ $t('createDevice.maximumWorkingPressure') }}:<span class="details-content-color">{{
+              equipmentDetailsItem.pressureMax
+            }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >出厂日期:<span class="details-content-color">{{
+            >{{ $t('createDevice.manufacturingDate') }}:<span class="details-content-color">{{
               equipmentDetailsItem.productionDate ? equipmentDetailsItem.productionDate : '-'
             }}</span>
           </span>
@@ -542,7 +565,7 @@ onMounted(() => {
       <ARow class="detailed-information details-text">
         <ACol :span="6">
           <span
-            >出厂编号:
+            >{{ $t('createDevice.factorySerialNumber') }}:
             <span class="details-content-color">
               {{ exceptionalReturn(equipmentDetailsItem.productionNum) }}</span
             ></span
@@ -550,20 +573,20 @@ onMounted(() => {
         </ACol>
         <ACol :span="6">
           <span
-            >设备编号:
+            >{{ $t('createDevice.equipmentNumber') }}:
             <span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.deviceNum) }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span>
-            主要技术参数:<span class="details-content-color">{{
+            {{ $t('createDevice.mainTechnicalParameters') }}:<span class="details-content-color">{{
               exceptionalReturn(equipmentDetailsItem.mainTechData)
             }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span
-            >安装位置:<span class="details-content-color">{{
+            >{{ $t('createDevice.installationLocation') }}:<span class="details-content-color">{{
               exceptionalReturn(equipmentDetailsItem.mountedPosition)
             }}</span>
           </span>
@@ -572,23 +595,26 @@ onMounted(() => {
       <ARow class="detailed-information details-text">
         <ACol :span="6">
           <span
-            >使用部门:
+            >{{ $t('createDevice.usingDepartment') }}:
             <span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.department) }}</span></span
           >
         </ACol>
         <ACol :span="6">
           <span
-            >负责人: <span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.respPerson) }}</span>
+            >{{ $t('deviceList.responsiblePerson') }}:
+            <span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.respPerson) }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span>
-            联系电话:<span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.phone) }}</span>
+            {{ $t('createDevice.contactNumber') }}:<span class="details-content-color">{{
+              exceptionalReturn(equipmentDetailsItem.phone)
+            }}</span>
           </span>
         </ACol>
         <ACol :span="6">
           <span>
-            使用年限 (年):<span class="details-content-color">{{
+            {{ $t('createDevice.serviceLife') }}:<span class="details-content-color">{{
               exceptionalReturn(equipmentDetailsItem.serviceLife)
             }}</span>
           </span>
@@ -597,7 +623,7 @@ onMounted(() => {
       <ARow class="detailed-information details-text">
         <ACol :span="6">
           <span
-            >备注:
+            >{{ $t('common.note') }}:
             <span class="details-content-color">{{ exceptionalReturn(equipmentDetailsItem.remarks) }}</span></span
           >
         </ACol>
@@ -605,29 +631,29 @@ onMounted(() => {
 
       <AFlex align="center" class="dev-margin">
         <div class="details-icon"></div>
-        <div class="details-header-text">关联网关参数</div>
+        <div class="details-header-text">{{ $t('createDevice.associationGatewayParameters') }}</div>
       </AFlex>
       <ATable :columns="columns" :data-source="gatewayList" :pagination="false" />
 
       <AFlex align="center" class="dev-margin">
         <div class="details-icon"></div>
-        <div class="details-header-text">配置设备参数</div>
+        <div class="details-header-text">{{ $t('createDevice.configureDeviceParameters') }}</div>
       </AFlex>
       <ATabs v-model:active-key="agreementListKey">
-        <ATabPane key="monitoring" tab="数据监控">
+        <ATabPane key="monitoring" :tab="t('createDevice.dataMonitoring')">
           <ATable :columns="devColumns" :data-source="gatewayData" :pagination="false">
             <template #bodyCell="{ column, record }">
               <template v-if="column.key === 'isProcessData'">
-                {{ record.isProcessData ? '是' : '否' }}
+                {{ record.isProcessData ? t('common.yes') : t('common.no') }}
               </template>
             </template>
           </ATable>
         </ATabPane>
-        <ATabPane key="remote" tab="远程控制" force-render>
+        <ATabPane key="remote" :tab="t('createDevice.remoteControl')" force-render>
           <ATable :columns="devColumns" :data-source="gatewayRemoteData" :pagination="false">
             <template #bodyCell="{ column, record }">
               <template v-if="column.key === 'isProcessData'">
-                {{ record.isProcessData ? '是' : '否' }}
+                {{ record.isProcessData ? t('common.yes') : t('common.no') }}
               </template>
             </template>
           </ATable>
@@ -636,7 +662,7 @@ onMounted(() => {
 
       <AFlex align="center" class="dev-margin">
         <div class="details-icon"></div>
-        <div class="details-header-text">自定义监控参数</div>
+        <div class="details-header-text">{{ $t('createDevice.customizedMonitoringParameters') }}</div>
       </AFlex>
       <ATable :columns="customizationColumns" :data-source="customizationData" :pagination="false">
         <template #bodyCell="{ column, record, index }">
@@ -644,7 +670,7 @@ onMounted(() => {
             {{ index + 1 }}
           </template>
           <template v-if="column.key === 'isProcessData'">
-            {{ record.isProcessData ? '是' : '否' }}
+            {{ record.isProcessData ? t('common.yes') : t('common.no') }}
           </template>
         </template>
       </ATable>