feat: 网元快速安装多语言翻译

src/views/ne/neInfo/components/EditModal.vue

@@ -428,7 +428,16 @@ onMounted(() => {
               allow-clear
               :placeholder="t('common.inputPlease')"
               :maxlength="32"
-            ></a-input>
+            >
+              <template #prefix>
+                <a-tooltip placement="topLeft">
+                  <template #title>
+                    {{ t('views.ne.common.neIdTip') }}
+                  </template>
+                  <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
+                </a-tooltip>
+              </template>
+            </a-input>
           </a-form-item>
         </a-col>
         <a-col :lg="12" :md="12" :xs="24">

src/views/ne/neQuickSetup/components/NeInfoConfig.vue

@@ -2,7 +2,6 @@
 import { Form, Modal, message } from 'ant-design-vue/lib';
 import { onMounted, reactive, toRaw } from 'vue';
 import { addNeInfo, getNeInfoByTypeAndID, updateNeInfo } from '@/api/ne/neInfo';
-import { neHostAuthorizedRSA, testNeHost } from '@/api/ne/neHost';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { NE_TYPE_LIST } from '@/constants/ne-constants';
 import { regExpIPv4, regExpIPv6 } from '@/utils/regular-utils';
@@ -79,9 +78,9 @@ let modalState: ModalStateType = reactive({
         title: 'Telnet_NE_4100',
         addr: '',
         port: 4100,
-        user: 'user',
+        user: 'admin',
         authMode: '0',
-        password: 'user',
+        password: 'admin',
         remark: '',
       },
     ],
@@ -96,13 +95,13 @@ const modalStateFrom = Form.useForm(
     neType: [
       {
         required: true,
-        message: '请输入网元类型',
+        message: t('views.ne.common.neTypePlease'),
       },
     ],
     neId: [
       {
         required: true,
-        message: '请输入网元标识',
+        message: t('views.ne.common.neIdPlease'),
       },
     ],
     ip: [
@@ -111,12 +110,6 @@ const modalStateFrom = Form.useForm(
         validator: modalStateFromEqualIPV4AndIPV6,
       },
     ],
-    port: [
-      {
-        required: true,
-        message: '请输入网元IP端口',
-      },
-    ],
   })
 );
 
@@ -142,60 +135,6 @@ function modalStateFromEqualIPV4AndIPV6(
   return Promise.resolve();
 }
 
-/**
- * 测试主机连接
- */
-function fnHostTest(row: Record<string, any>) {
-  if (modalState.confirmLoading || !row.addr) return;
-  modalState.confirmLoading = true;
-  const hide = message.loading(t('common.loading'), 0);
-  testNeHost(row)
-    .then(res => {
-      if (res.code === RESULT_CODE_SUCCESS) {
-        message.success({
-          content: `${row.addr}:${row.port} ${t('views.ne.neHost.testOk')}`,
-          duration: 2,
-        });
-      } else {
-        message.error({
-          content: `${row.addr}:${row.port} ${res.msg}`,
-          duration: 2,
-        });
-      }
-    })
-    .finally(() => {
-      hide();
-      modalState.confirmLoading = false;
-    });
-}
-
-/**测试主机连接-免密直连 */
-function fnHostAuthorized(row: Record<string, any>) {
-  if (modalState.confirmLoading) return;
-
-  Modal.confirm({
-    title: '提示',
-    content: '是否要配置免密直连？',
-    onOk: () => {
-      modalState.confirmLoading = true;
-      neHostAuthorizedRSA(row).then(res => {
-        modalState.confirmLoading = false;
-        if (res.code === RESULT_CODE_SUCCESS) {
-          message.success({
-            content: `操作成功`,
-            duration: 2,
-          });
-        } else {
-          message.error({
-            content: `操作失败`,
-            duration: 2,
-          });
-        }
-      });
-    },
-  });
-}
-
 /**
  * 对话框弹出确认执行函数
  * 进行表达规则校验
@@ -230,11 +169,11 @@ function fnModalOk() {
       }
     })
     .then(isUpdate => {
-      let confirmTitle = '新增提示';
-      let confirmContent = `是否新增为新的网元信息并继续？`;
+      let confirmTitle = t('views.ne.neQuickSetup.configAddTitle');
+      let confirmContent = t('views.ne.neQuickSetup.configAddTip');
       if (isUpdate) {
-        confirmTitle = '更新提示';
-        confirmContent = `是否更新到已存在网元信息并继续？`;
+        confirmTitle = t('views.ne.neQuickSetup.configUpdateTitle');
+        confirmContent = t('views.ne.neQuickSetup.configUpdateTip');
       }
       Modal.confirm({
         title: confirmTitle,
@@ -266,7 +205,7 @@ function fnModalOk() {
                 modalState.stepNext = true; // 开启下一步
               } else {
                 message.error({
-                  content: `${t('common.operateErr')}`,
+                  content: res.msg,
                   duration: 3,
                 });
               }
@@ -304,9 +243,9 @@ function fnNeTypeChange(v: any) {
       title: 'Telnet_NE_5002',
       addr: modalState.from.ip,
       port: 5002,
-      user: 'user',
+      user: 'admin',
       authMode: '0',
-      password: 'user',
+      password: 'admin',
       remark: '',
     });
   }
@@ -327,7 +266,7 @@ function fnNeIPChange(e: any) {
 function fnStepPrev() {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: '确认要放弃当前变更返回上一步吗？',
+    content: t('views.ne.neQuickSetup.stepPrevTip'),
     onOk() {
       fnRestStepState();
       fnToStepName('Start');
@@ -340,7 +279,7 @@ function fnStepNext() {
   if (!modalState.stepNext) return;
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: '确认要下一步进行网元软件安装？',
+    content: t('views.ne.neQuickSetup.configStepNext'),
     onOk() {
       fnToStepName('NeInfoSoftwareInstall');
     },
@@ -390,9 +329,9 @@ onMounted(() => {
       :labelWrap="true"
     >
       <a-row :gutter="16">
-        <a-col :lg="12" :md="12" :xs="24">
+        <a-col :lg="6" :md="6" :xs="24" :offset="6">
           <a-form-item
-            :label="t('views.configManage.neManage.neType')"
+            :label="t('views.ne.common.neType')"
             name="neType"
             v-bind="modalStateFrom.validateInfos.neType"
           >
@@ -411,7 +350,7 @@ onMounted(() => {
                 <template #prefix>
                   <a-tooltip placement="topLeft">
                     <template #title>
-                      {{ t('views.configManage.neManage.neTypeTip') }}
+                      {{ t('views.ne.common.neTypeTip') }}
                     </template>
                     <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
                   </a-tooltip>
@@ -420,9 +359,9 @@ onMounted(() => {
             </a-auto-complete>
           </a-form-item>
         </a-col>
-        <a-col :lg="12" :md="12" :xs="24">
+        <a-col :lg="6" :md="6" :xs="24">
           <a-form-item
-            :label="t('views.configManage.neManage.neId')"
+            :label="t('views.ne.common.neId')"
             name="neId"
             v-bind="modalStateFrom.validateInfos.neId"
           >
@@ -435,7 +374,7 @@ onMounted(() => {
               <template #prefix>
                 <a-tooltip placement="topLeft">
                   <template #title>
-                    {{ t('views.configManage.neManage.neIdTip') }}
+                    {{ t('views.ne.common.neIdTip') }}
                   </template>
                   <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
                 </a-tooltip>
@@ -446,9 +385,9 @@ onMounted(() => {
       </a-row>
 
       <a-row :gutter="16">
-        <a-col :lg="12" :md="12" :xs="24">
+        <a-col :lg="6" :md="6" :xs="24" :offset="6">
           <a-form-item
-            :label="t('views.configManage.neManage.ip')"
+            :label="t('views.ne.common.ipAddr')"
             name="ip"
             v-bind="modalStateFrom.validateInfos.ip"
           >
@@ -464,7 +403,7 @@ onMounted(() => {
                 <a-tooltip placement="topLeft">
                   <template #title>
                     <div>
-                      {{ t('views.ne.neInfo.ipAddr') }}
+                      {{ t('views.ne.common.ipAddrTip') }}
                     </div>
                   </template>
                   <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
@@ -473,9 +412,9 @@ onMounted(() => {
             </a-input>
           </a-form-item>
         </a-col>
-        <a-col :lg="12" :md="12" :xs="24">
+        <a-col :lg="6" :md="6" :xs="24">
           <a-form-item
-            :label="t('views.configManage.neManage.port')"
+            :label="t('views.ne.common.port')"
             name="port"
             v-bind="modalStateFrom.validateInfos.port"
           >
@@ -490,7 +429,7 @@ onMounted(() => {
               <template #prefix>
                 <a-tooltip placement="topLeft">
                   <template #title>
-                    <div>{{ t('views.configManage.neManage.portTip') }}</div>
+                    <div>{{ t('views.ne.common.portTip') }}</div>
                   </template>
                   <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
                 </a-tooltip>
@@ -499,173 +438,29 @@ onMounted(() => {
           </a-form-item>
         </a-col>
       </a-row>
-
-      <a-divider orientation="left">
-        {{ t('views.ne.neInfo.hostConfig') }}
-      </a-divider>
-
-      <!-- 主机连接配置 -->
-      <a-collapse class="collapse" ghost>
-        <a-collapse-panel
-          v-for="host in modalState.from.hosts"
-          :key="host.title"
-          :header="`${host.hostType.toUpperCase()} ${host.port}`"
-        >
-          <a-row :gutter="16">
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item :label="t('views.ne.neHost.addr')">
-                <a-input
-                  v-model:value="host.addr"
-                  allow-clear
-                  :maxlength="128"
-                  :placeholder="t('common.inputPlease')"
-                  :disabled="true"
-                >
-                </a-input>
-              </a-form-item>
-            </a-col>
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item :label="t('views.ne.neHost.port')" name="port">
-                <a-input-number
-                  v-model:value="host.port"
-                  :min="10"
-                  :max="65535"
-                  :step="1"
-                  :maxlength="5"
-                  style="width: 100%"
-                ></a-input-number>
-              </a-form-item>
-            </a-col>
-          </a-row>
-
-          <a-row :gutter="16">
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item :label="t('views.ne.neHost.user')">
-                <a-input
-                  v-model:value="host.user"
-                  allow-clear
-                  :maxlength="50"
-                  :placeholder="t('common.inputPlease')"
-                >
-                </a-input>
-              </a-form-item>
-            </a-col>
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item :label="t('views.ne.neHost.authMode')">
-                <a-select
-                  v-model:value="host.authMode"
-                  default-value="0"
-                  :options="dict.neHostAuthMode"
-                  :disabled="host.hostType === 'telnet'"
-                >
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </a-row>
-
-          <a-form-item
-            v-if="host.authMode === '0'"
-            :label="t('views.ne.neHost.password')"
-            :label-col="{ span: 3 }"
-            :label-wrap="true"
-          >
-            <a-input-password
-              v-model:value="host.password"
-              :maxlength="128"
-              :placeholder="t('common.inputPlease')"
-            >
-            </a-input-password>
-          </a-form-item>
-
-          <template v-if="host.authMode === '1'">
-            <a-form-item
-              :label="t('views.ne.neHost.privateKey')"
-              :label-col="{ span: 3 }"
-              :label-wrap="true"
-            >
-              <a-textarea
-                v-model:value="host.privateKey"
-                :auto-size="{ minRows: 4, maxRows: 6 }"
-                :maxlength="3000"
-                :show-count="true"
-                :placeholder="t('views.ne.neHost.privateKeyPlease')"
-              />
-            </a-form-item>
-
-            <a-form-item
-              :label="t('views.ne.neHost.passPhrase')"
-              :label-col="{ span: 3 }"
-              :label-wrap="true"
-            >
-              <a-input-password
-                v-model:value="host.passPhrase"
-                :maxlength="128"
-                :placeholder="t('common.inputPlease')"
-              >
-              </a-input-password>
-            </a-form-item>
-          </template>
-
-          <a-form-item
-            :label="t('views.ne.neHost.remark')"
-            :label-col="{ span: 3 }"
-            :label-wrap="true"
-          >
-            <a-textarea
-              v-model:value="host.remark"
-              :auto-size="{ minRows: 1, maxRows: 6 }"
-              :maxlength="450"
-              :show-count="true"
-              :placeholder="t('common.inputPlease')"
-            />
-          </a-form-item>
-
-          <a-form-item
-            :label="t('views.ne.neHost.test')"
-            name="test"
-            :label-col="{ span: 3 }"
-            :label-wrap="true"
-          >
-            <a-button
-              type="primary"
-              shape="round"
-              @click="fnHostTest(host)"
-              :loading="modalState.confirmLoading"
-            >
-              <template #icon><LinkOutlined /></template>
-            </a-button>
-
-            <a-button
-              type="link"
-              @click="fnHostAuthorized(host)"
-              :loading="modalState.confirmLoading"
-              v-if="host.hostType === 'ssh' && host.authMode !== '2'"
-            >
-              免密授权
-            </a-button>
-          </a-form-item>
-        </a-collapse-panel>
-      </a-collapse>
     </a-form>
 
     <div class="ne-oper">
       <a-space direction="horizontal" :size="18">
-        <a-button @click="fnStepPrev()"> 上一步 </a-button>
-
-        <a-button
-          type="primary"
-          @click="fnModalOk()"
-          :loading="modalState.confirmLoading"
-        >
-          保存信息
+        <a-button @click="fnStepPrev()">
+          {{ t('views.ne.neQuickSetup.stepPrev') }}
         </a-button>
 
         <a-button
-          type="default"
+          type="primary"
+          ghost
+          @click="fnModalOk()"
+          :loading="modalState.confirmLoading"
+        >
+          {{ t('views.ne.neQuickSetup.stepSave') }}
+        </a-button>
+
+        <a-button
+          type="primary"
           @click="fnStepNext()"
           :disabled="!modalState.stepNext"
         >
-          下一步
+          {{ t('views.ne.neQuickSetup.stepNext') }}
         </a-button>
       </a-space>
     </div>
@@ -674,10 +469,15 @@ onMounted(() => {
 
 <style lang="less" scoped>
 .ne {
-  padding-top: 12px;
+  min-height: 400px;
+  display: flex;
+  flex-direction: column;
+
+  & .ant-form {
+    flex: 1;
+  }
 
   &-oper {
-    padding-top: 24px;
     text-align: end;
   }
 }

src/views/ne/neQuickSetup/components/NeInfoSoftwareInstall.vue

@@ -29,33 +29,33 @@ let tableColumns: ColumnsType = [
     width: 50,
   },
   {
-    title: 'neType',
+    title: t('views.ne.common.neType'),
     dataIndex: 'neType',
     align: 'left',
     width: 100,
   },
   {
-    title: 'name',
+    title: t('views.ne.neSoftware.version'),
+    dataIndex: 'version',
+    align: 'left',
+    width: 150,
+  },
+  {
+    title: t('views.ne.neSoftware.name'),
     dataIndex: 'name',
     key: 'name',
     align: 'left',
     width: 300,
   },
   {
-    title: 'version',
-    dataIndex: 'version',
-    align: 'left',
-    width: 100,
-  },
-  {
-    title: 'description',
+    title: t('common.description'),
     dataIndex: 'description',
     key: 'description',
     align: 'left',
     ellipsis: true,
   },
   {
-    title: 'createTime',
+    title: t('common.createTime'),
     dataIndex: 'createTime',
     align: 'left',
     width: 150,
@@ -214,7 +214,9 @@ function fnRecordInstall() {
   const from = toRaw(state.from);
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: `install software package [${from.name}] ?`,
+    content: t('views.ne.neQuickSetup.installConfirmTip', {
+      name: from.name,
+    }),
     onOk: async () => {
       if (state.confirmLoading) return;
       state.confirmLoading = true;
@@ -224,7 +226,7 @@ function fnRecordInstall() {
       if (state.optionType === 'option') {
         const res = await newNeVersion(from);
         if (res.code === RESULT_CODE_ERROR) {
-          message.error(`软件信息错误 ${res.msg}`, 3);
+          message.error(res.msg, 3);
           hide();
           state.confirmLoading = false;
           return;
@@ -243,10 +245,10 @@ function fnRecordInstall() {
         preinput: preinput,
       });
       if (res.code === RESULT_CODE_SUCCESS) {
-        message.success(`安装成功 ${res.msg}`, 3);
+        message.success(t('common.operateOk'), 3);
         state.stepNext = true;
       } else {
-        message.error(`安装失败 ${res.msg}`, 3);
+        message.error(res.msg, 3);
       }
 
       // 非选择的重置
@@ -262,7 +264,7 @@ function fnRecordInstall() {
 function fnStepPrev() {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: '确认要放弃当前变更返回上一步吗？',
+    content: t('views.ne.neQuickSetup.stepPrevTip'),
     onOk() {
       fnToStepName('NeInfoConfig');
     },
@@ -273,7 +275,7 @@ function fnStepPrev() {
 function fnStepNext() {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: '确认要下一步进行网元授权吗？',
+    content: t('views.ne.neQuickSetup.neInfoSoftwareInstallStepNext'),
     onOk() {
       fnToStepName('NeInfoSoftwareLicense');
     },
@@ -296,24 +298,34 @@ onMounted(() => {
     <a-form
       name="installStateFrom"
       layout="horizontal"
-      :label-col="{ span: 3 }"
-      :wrapper-col="{ span: 8 }"
+      :label-col="{ span: 4 }"
+      :wrapper-col="{ span: 16 }"
       :label-wrap="true"
     >
-      <a-form-item label="软件来源" name="optionType">
+      <a-form-item
+        :label="t('views.ne.neQuickSetup.installSource')"
+        name="optionType"
+      >
         <a-radio-group
           v-model:value="state.optionType"
           button-style="solid"
           :disabled="state.confirmLoading"
           @change="fnOptionTypeChange"
         >
-          <a-radio-button value="option">已上传</a-radio-button>
-          <a-radio-button value="upload">新上传</a-radio-button>
+          <a-radio-button value="option">
+            {{ t('views.ne.neQuickSetup.installSourceOption') }}
+          </a-radio-button>
+          <a-radio-button value="upload">
+            {{ t('views.ne.neQuickSetup.installSourceUpload') }}
+          </a-radio-button>
         </a-radio-group>
       </a-form-item>
       <!-- 选择已上传 -->
       <template v-if="state.optionType === 'option'">
-        <a-form-item label="选择记录" name="option" :wrapper-col="{ span: 24 }">
+        <a-form-item
+          :label="t('views.ne.neQuickSetup.installSelect')"
+          name="option"
+        >
           <a-table
             class="table"
             row-key="id"
@@ -350,7 +362,11 @@ onMounted(() => {
 
       <!-- 重新上传 -->
       <template v-if="state.optionType === 'upload'">
-        <a-form-item label="上传文件" name="upload" :help="state.from.name">
+        <a-form-item
+          :label="t('views.ne.neQuickSetup.installUpload')"
+          name="upload"
+          :help="state.from.name"
+        >
           <a-button
             type="primary"
             @click.prevent="() => (state.visibleByFile = !state.visibleByFile)"
@@ -371,25 +387,27 @@ onMounted(() => {
 
     <div class="ne-oper">
       <a-space direction="horizontal" :size="18">
-        <a-button @click="fnStepPrev()"> 上一步 </a-button>
+        <a-button @click="fnStepPrev()">
+          {{ t('views.ne.neQuickSetup.stepPrev') }}
+        </a-button>
 
         <a-button
-          type="default"
-          danger
+          type="primary"
+          ghost
           :disabled="!state.from.version"
           :loading="state.confirmLoading"
           @click.prevent="fnRecordInstall()"
         >
           <template #icon><ThunderboltOutlined /></template>
-          Install
+          {{ t('views.ne.neQuickSetup.installText') }}
         </a-button>
 
         <a-button
-          type="dashed"
+          type="primary"
           @click="fnStepNext()"
           :disabled="!state.stepNext"
         >
-          下一步
+          {{ t('views.ne.neQuickSetup.stepNext') }}
         </a-button>
       </a-space>
     </div>
@@ -398,10 +416,15 @@ onMounted(() => {
 
 <style lang="less" scoped>
 .ne {
-  padding-top: 12px;
+  min-height: 400px;
+  display: flex;
+  flex-direction: column;
+
+  & .ant-form {
+    flex: 1;
+  }
 
   &-oper {
-    padding-top: 24px;
     text-align: end;
   }
 }

src/views/ne/neQuickSetup/components/NeInfoSoftwareLicense.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { Modal } from 'ant-design-vue/lib';
 import { defineAsyncComponent, onMounted, onUnmounted, reactive } from 'vue';
-import { fnRestStepState, stepState } from '../hooks/useStep';
+import { fnRestStepState, fnToStepName, stepState } from '../hooks/useStep';
 import useI18n from '@/hooks/useI18n';
 import { codeNeLicense, stateNeLicense } from '@/api/ne/neLicense';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
@@ -105,7 +105,13 @@ onUnmounted(() => {
 <template>
   <a-result
     :status="!state.from.sn ? 'info' : 'success'"
-    :title="!state.from.sn ? '是否立即授权激活' : '成功激活'"
+    :title="
+      t(
+        !state.from.sn
+          ? 'views.ne.neQuickSetup.licenseResultTitle'
+          : 'views.ne.neQuickSetup.licenseResultTitleOk'
+      )
+    "
   >
     <template #extra>
       <a-button
@@ -114,14 +120,14 @@ onUnmounted(() => {
         :loading="state.timeCount < 30"
         @click="() => (state.visibleByFile = !state.visibleByFile)"
       >
-        授权激活
+        {{ t('views.ne.neQuickSetup.licenseUpload') }}
       </a-button>
       <a-button
         type="default"
         :disabled="state.timeCount < 30"
         @click="fnStepEnd()"
       >
-        结束
+        {{ t('views.ne.neQuickSetup.licenseEnd') }}
       </a-button>
     </template>
 
@@ -130,18 +136,18 @@ onUnmounted(() => {
         state.timeInterval === null && state.timeCount === 30 && !state.from.sn
       "
     >
-      <p>授权激活可获取授权激活码，得到授权文件后上传激活</p>
-      <p>结束将返回第一步</p>
+      <p>{{ t('views.ne.neQuickSetup.licenseTip1') }}</p>
+      <p>{{ t('views.ne.neQuickSetup.licenseTip2') }}</p>
     </div>
     <div v-if="state.timeInterval !== null">
       <a-space direction="horizontal" :size="16">
         <a-spin />
-        等待网元验证 {{ state.timeCount }}s
+        {{ t('views.ne.neQuickSetup.licenseCheack') }} {{ state.timeCount }}s
       </a-space>
     </div>
-    <div v-if="state.from.sn !== ''">
-      <p style="font-size: 16px">序列号：{{ state.from.sn }}</p>
-      <p style="font-size: 16px">许可证到期时间：{{ state.from.expire }}</p>
+    <div v-if="state.from.sn !== ''" style="font-size: 16px">
+      <p>{{ t('views.ne.common.serialNum') }}：{{ state.from.sn }}</p>
+      <p>{{ t('views.ne.common.expiryDate') }}：{{ state.from.expire }}</p>
     </div>
   </a-result>
 

src/views/ne/neQuickSetup/components/Start.vue

@@ -160,10 +160,7 @@ function fnCheckInfo() {
       if (res.code === RESULT_CODE_SUCCESS) {
         state.info = res.data;
         if (!res.data.sudo) {
-          message.warning({
-            content: `请配置服务器授予当前用户无密码 sudo 权限，确保有权限进行软件包安装`,
-            duration: 2,
-          });
+          message.warning(t('views.ne.neQuickSetup.sudoErr'), 3);
           return;
         }
         // if (!res.data.sshLink) {
@@ -217,23 +214,17 @@ function fnHostAuthorized() {
   if (state.confirmLoading) return;
 
   Modal.confirm({
-    title: '提示',
-    content: '是否要配置免密直连？',
+    title: t('common.tipTitle'),
+    content: t('views.ne.neHost.authRSATip'),
     onOk: () => {
       const form = toRaw(state.from);
       state.confirmLoading = true;
       neHostAuthorizedRSA(form).then(res => {
         state.confirmLoading = false;
         if (res.code === RESULT_CODE_SUCCESS) {
-          message.success({
-            content: `操作成功`,
-            duration: 2,
-          });
+          message.success(t('common.operateOk'), 3);
         } else {
-          message.error({
-            content: `操作失败`,
-            duration: 2,
-          });
+          message.error(t('common.operateErr'), 3);
         }
       });
     },
@@ -245,7 +236,7 @@ function fnStepNext() {
   if (!state.stepNext) return;
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: '确认要下一步进行配置网元信息？',
+    content: t('views.ne.neQuickSetup.startStepNext'),
     onOk() {
       fnToStepName('NeInfoConfig');
     },
@@ -264,38 +255,40 @@ onMounted(() => {
 
 <template>
   <a-descriptions :column="{ lg: 3, md: 2, sm: 2, xs: 1 }" bordered>
-    <a-descriptions-item label="服务器IP" :span="3">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.addr')" :span="3">
       {{ state.info.addr }}
     </a-descriptions-item>
-    <a-descriptions-item label="系统">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.kernelName')">
       {{ state.info.kernelName }}
     </a-descriptions-item>
-    <a-descriptions-item label="架构">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.machine')">
       {{ state.info.machine }}
     </a-descriptions-item>
-    <a-descriptions-item label="内核">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.kernelRelease')">
       {{ state.info.kernelRelease }}
     </a-descriptions-item>
     <a-descriptions-item>
       <template #label>
-        平台
+        {{ t('views.ne.neQuickSetup.prettyName') }}
         <a-tooltip placement="topLeft">
-          <template #title> 支持 Ubuntu </template>
+          <template #title>
+            {{ t('views.ne.neQuickSetup.prettyNameTip') }}
+          </template>
           <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
         </a-tooltip>
       </template>
       {{ state.info.prettyName }}
     </a-descriptions-item>
-    <a-descriptions-item label="主机名">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.nodename')">
       {{ state.info.nodename }}
     </a-descriptions-item>
-    <a-descriptions-item label="授予权限">
+    <a-descriptions-item :label="t('views.ne.neQuickSetup.auth')">
       <a-tag :color="state.info.sudo ? 'success' : 'error'">
         <template #icon>
           <CheckCircleOutlined v-if="state.info.sudo" />
           <CloseCircleOutlined v-else />
         </template>
-        可提权
+        {{ t('views.ne.neQuickSetup.sudo') }}
       </a-tag>
 
       <a-tag :color="state.info.sshLink ? 'success' : 'error'">
@@ -303,15 +296,15 @@ onMounted(() => {
           <CheckCircleOutlined v-if="state.info.sshLink" />
           <CloseCircleOutlined v-else />
         </template>
-        可免密直连
+        {{ t('views.ne.neQuickSetup.sshLink') }}
       </a-tag>
     </a-descriptions-item>
-    <a-descriptions-item label="连接检查">
+    <a-descriptions-item :span="2">
       <a-form
         name="checkStateFrom"
         layout="horizontal"
         :label-col="{ span: 6 }"
-        :label-wrap="true"
+        :label-wrap="false"
       >
         <a-row :gutter="16">
           <a-col :lg="12" :md="12" :xs="24">
@@ -426,30 +419,37 @@ onMounted(() => {
           <a-space direction="horizontal" :size="18">
             <a-button
               type="primary"
+              ghost
               html-type="submit"
               @click="fnCheckInfo()"
               :loading="state.confirmLoading"
             >
-              进行连接
+              {{ t('views.ne.neHost.test') }}
             </a-button>
             <a-button
-              type="default"
-              @click="fnStepNext()"
+              type="primary"
+              @click="fnStepNext()" 
               :disabled="!state.stepNext"
             >
-              下一步
+              {{ t('views.ne.neQuickSetup.stepNext') }}
             </a-button>
 
             <a-button
               type="dashed"
               @click="fnHostAuthorized()"
-              :loading="state.confirmLoading"
+              :disabled="state.confirmLoading"
               v-if="state.from.authMode !== '2'"
             >
-              免密授权
+              {{ t('views.ne.neHost.authRSA') }}
             </a-button>
 
-            <a-button type="link" @click="fnCheckInfoReset()"> 重置 </a-button>
+            <a-button
+              type="link"
+              @click="fnCheckInfoReset()"
+              :disabled="state.confirmLoading"
+            >
+              {{ t('common.reset') }}
+            </a-button>
           </a-space>
         </a-form-item>
       </a-form>

src/views/ne/neQuickSetup/hooks/useStep.ts

@@ -41,11 +41,32 @@ export const stepState: StepStateType = reactive({
 });
 
 /**步骤信息状态复位 */
-export function fnRestStepState() {
+export function fnRestStepState(t?: any) {
   stepState.stepName = 'Start';
   stepState.current = 0;
   stepState.neHost = {};
   stepState.neInfo = {};
+  // 多语言翻译
+  if (t) {
+    stepState.steps = [
+      {
+        title: t('views.ne.neQuickSetup.startTitle'),
+        description: t('views.ne.neQuickSetup.startDesc'),
+      },
+      {
+        title: t('views.ne.neQuickSetup.configTitle'),
+        description: t('views.ne.neQuickSetup.configDesc'),
+      },
+      {
+        title: t('views.ne.neQuickSetup.installTitle'),
+        description: t('views.ne.neQuickSetup.installDesc'),
+      },
+      {
+        title: t('views.ne.neQuickSetup.licenseTitle'),
+        description: t('views.ne.neQuickSetup.licenseDesc'),
+      },
+    ];
+  }
 }
 
 /**跳转步骤组件 */

src/views/ne/neQuickSetup/index.vue

@@ -2,11 +2,11 @@
 import { PageContainer } from 'antdv-pro-layout';
 import { defineAsyncComponent, watch, shallowRef, onMounted } from 'vue';
 import { stepState, fnRestStepState } from './hooks/useStep';
+import useI18n from '@/hooks/useI18n';
+const { t } = useI18n();
 
 // 异步加载组件
-const Start = defineAsyncComponent(
-  () => import('./components/Start.vue')
-);
+const Start = defineAsyncComponent(() => import('./components/Start.vue'));
 
 // 当前组件
 const currentComponent = shallowRef(Start);
@@ -22,15 +22,13 @@ watch(
 );
 
 onMounted(() => {
-  fnRestStepState();
+  fnRestStepState(t);
 });
 </script>
 
 <template>
   <PageContainer>
-    <a-card
-      :bordered="false" 
-    >
+    <a-card :bordered="false">
       <!-- 插槽-卡片左侧 -->
       <template #title>
         <!-- 步骤进度 -->