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

This commit is contained in:
TsMask
2024-05-20 20:18:00 +08:00
parent 624f67ecca
commit 814b7b0058
10 changed files with 285 additions and 340 deletions

View File

@@ -591,6 +591,7 @@ export default {
neTypeTip: 'Fill in the type of network element to be created, e.g. SMF.', neTypeTip: 'Fill in the type of network element to be created, e.g. SMF.',
neId: 'NE ID', neId: 'NE ID',
neIdPlease: 'Please enter the network element identification', neIdPlease: 'Please enter the network element identification',
neIdTip: 'Fill in the unique identifier of the network element binding',
rmUid: 'Resource Unique ID', rmUid: 'Resource Unique ID',
rmUidPlease: 'Please enter a resource unique ID', rmUidPlease: 'Please enter a resource unique ID',
rmUidTip: "Tagging for data reporting of network element logs, alarms, metrics, etc.", rmUidTip: "Tagging for data reporting of network element logs, alarms, metrics, etc.",
@@ -670,7 +671,7 @@ export default {
delTip: "Confirm that you want to delete the host number [{num}]?", delTip: "Confirm that you want to delete the host number [{num}]?",
addTitle: "Add Host Connection", addTitle: "Add Host Connection",
editTitle: "Edit Host Connection", editTitle: "Edit Host Connection",
test: "Test Connection To Host", test: "Test Connection",
testOk: "Test Connection Successful", testOk: "Test Connection Successful",
authRSA: 'Secret Authorization', authRSA: 'Secret Authorization',
authRSATip: "Do I have to configure secret-free authorization?", authRSATip: "Do I have to configure secret-free authorization?",
@@ -732,6 +733,52 @@ export default {
sync: 'Sync to NE', sync: 'Sync to NE',
syncNe: 'Select NE', syncNe: 'Select NE',
}, },
neQuickSetup: {
stepPrev: 'Previous',
stepPrevTip: 'Confirm that you want to abandon the current change and return to the previous step?',
stepNext: 'Next',
stepSave: 'Save',
startTitle: 'Service Terminal Environment',
startDesc: 'Test connectivity to network element services',
startStepNext: 'Confirm that you want to proceed to the next step to configure the network element information?',
addr: 'Terminal IP',
kernelName: 'System',
kernelRelease: 'Kernel',
machine: 'Framework',
prettyName: 'Platform',
prettyNameTip: 'Support Ubuntu',
nodename: 'Node Name',
auth: 'Competence Grant',
sudo: 'sudo',
sudoErr: 'To ensure that you have permission to install packages, configure to grant the current user permission to allow passwordless sudo privileges.',
sshLink: 'confidentiality',
configTitle: "Configuring Network Elements",
configDesc: "Fill in the basic information of the network element",
configAddTitle: 'New Tips',
configAddTip: 'Is it added as new network element information and continue?',
configUpdateTitle: 'Update Tips',
configUpdateTip: 'Does it update to the already existing network element information and continue?',
configStepNext: 'Confirm that you want to proceed to the next step for the Net Element software installation?',
installTitle: "Network Element Installation",
installDesc: "Installation to Service Terminal",
installConfirmTip: 'Are you sure you want to install package [{name}]?',
installStepNext: 'Confirm that you want to proceed to the next step for network element authorization?',
installSource: 'Software Source',
installSourceOption: 'Uploaded',
installSourceUpload: 'New Upload',
installSelect: 'Select Record',
installUpload: 'Upload file',
installText: 'Installed',
licenseTitle: "Licenses",
licenseDesc: "Network element service authorization certification",
licenseResultTitle: "Whether to authorize activation immediately",
licenseResultTitleOk: 'Successful Activation',
licenseUpload: 'License',
licenseEnd: 'Finish',
licenseCheack: 'Waiting for network element validation',
licenseTip1: '1. Click [License] to get the license activation code, and then contact the network element vendor for activation.',
licenseTip2: '2. Clicking [Finish] will end the installation process.',
},
}, },
neUser: { neUser: {
auth: { auth: {

View File

@@ -591,6 +591,7 @@ export default {
neTypeTip: '填写创建的网元类型,如:SMF', neTypeTip: '填写创建的网元类型,如:SMF',
neId: '网元标识', neId: '网元标识',
neIdPlease: '请输入网元标识', neIdPlease: '请输入网元标识',
neIdTip: '填写网元绑定的唯一标识',
rmUid: '资源唯一标识', rmUid: '资源唯一标识',
rmUidPlease: '请输入资源唯一标识', rmUidPlease: '请输入资源唯一标识',
rmUidTip: "用于网元日志、告警、指标等数据上报的标记", rmUidTip: "用于网元日志、告警、指标等数据上报的标记",
@@ -732,6 +733,52 @@ export default {
sync: '同步到网元', sync: '同步到网元',
syncNe: '选择网元', syncNe: '选择网元',
}, },
neQuickSetup: {
stepPrev: '上一步',
stepPrevTip: '确认要放弃当前变更返回上一步吗?',
stepNext: '下一步',
stepSave: '保存信息',
startTitle: '服务终端环境',
startDesc: '测试连接网元服务',
startStepNext: '确认要下一步进行配置网元信息?',
addr: '终端IP',
kernelName: '系统',
kernelRelease: '内核',
machine: '架构',
prettyName: '平台',
prettyNameTip: '支持 Ubuntu',
nodename: '主机名',
auth: '权限授予',
sudo: '提权',
sudoErr: '确保有权限进行软件包安装,请配置授予当前用户允许无密码 sudo 权限。',
sshLink: '免密直连',
configTitle: "配置网元",
configDesc: "填写网元基础信息",
configAddTitle: '新增提示',
configAddTip: '是否新增为新的网元信息并继续?',
configUpdateTitle: '更新提示',
configUpdateTip: '是否更新到已存在网元信息并继续?',
configStepNext: '确认要下一步进行网元软件安装?',
installTitle: "网元安装",
installDesc: "安装到服务终端",
installConfirmTip: '确认要安装软件包【{name}】吗?',
installStepNext: '确认要下一步进行网元授权吗?',
installSource: '软件来源',
installSourceOption: '已上传',
installSourceUpload: '新上传',
installSelect: '选择记录',
installUpload: '上传文件',
installText: '安装',
licenseTitle: "授权许可",
licenseDesc: "网元服务授权认证",
licenseResultTitle: "是否立即授权激活",
licenseResultTitleOk: '成功激活',
licenseUpload: '许可证',
licenseEnd: '结束',
licenseCheack: '等待网元验证',
licenseTip1: '1. 点击【许可证】可获取许可激活码,随后联系网元厂商进行激活',
licenseTip2: '2. 点击【结束】将结束安装过程',
},
}, },
neUser: { neUser: {
auth: { auth: {

View File

@@ -428,7 +428,16 @@ onMounted(() => {
allow-clear allow-clear
:placeholder="t('common.inputPlease')" :placeholder="t('common.inputPlease')"
:maxlength="32" :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-form-item>
</a-col> </a-col>
<a-col :lg="12" :md="12" :xs="24"> <a-col :lg="12" :md="12" :xs="24">

View File

@@ -2,7 +2,6 @@
import { Form, Modal, message } from 'ant-design-vue/lib'; import { Form, Modal, message } from 'ant-design-vue/lib';
import { onMounted, reactive, toRaw } from 'vue'; import { onMounted, reactive, toRaw } from 'vue';
import { addNeInfo, getNeInfoByTypeAndID, updateNeInfo } from '@/api/ne/neInfo'; import { addNeInfo, getNeInfoByTypeAndID, updateNeInfo } from '@/api/ne/neInfo';
import { neHostAuthorizedRSA, testNeHost } from '@/api/ne/neHost';
import { RESULT_CODE_SUCCESS } from '@/constants/result-constants'; import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
import { NE_TYPE_LIST } from '@/constants/ne-constants'; import { NE_TYPE_LIST } from '@/constants/ne-constants';
import { regExpIPv4, regExpIPv6 } from '@/utils/regular-utils'; import { regExpIPv4, regExpIPv6 } from '@/utils/regular-utils';
@@ -79,9 +78,9 @@ let modalState: ModalStateType = reactive({
title: 'Telnet_NE_4100', title: 'Telnet_NE_4100',
addr: '', addr: '',
port: 4100, port: 4100,
user: 'user', user: 'admin',
authMode: '0', authMode: '0',
password: 'user', password: 'admin',
remark: '', remark: '',
}, },
], ],
@@ -96,13 +95,13 @@ const modalStateFrom = Form.useForm(
neType: [ neType: [
{ {
required: true, required: true,
message: '请输入网元类型', message: t('views.ne.common.neTypePlease'),
}, },
], ],
neId: [ neId: [
{ {
required: true, required: true,
message: '请输入网元标识', message: t('views.ne.common.neIdPlease'),
}, },
], ],
ip: [ ip: [
@@ -111,12 +110,6 @@ const modalStateFrom = Form.useForm(
validator: modalStateFromEqualIPV4AndIPV6, validator: modalStateFromEqualIPV4AndIPV6,
}, },
], ],
port: [
{
required: true,
message: '请输入网元IP端口',
},
],
}) })
); );
@@ -142,60 +135,6 @@ function modalStateFromEqualIPV4AndIPV6(
return Promise.resolve(); 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 => { .then(isUpdate => {
let confirmTitle = '新增提示'; let confirmTitle = t('views.ne.neQuickSetup.configAddTitle');
let confirmContent = `是否新增为新的网元信息并继续?`; let confirmContent = t('views.ne.neQuickSetup.configAddTip');
if (isUpdate) { if (isUpdate) {
confirmTitle = '更新提示'; confirmTitle = t('views.ne.neQuickSetup.configUpdateTitle');
confirmContent = `是否更新到已存在网元信息并继续?`; confirmContent = t('views.ne.neQuickSetup.configUpdateTip');
} }
Modal.confirm({ Modal.confirm({
title: confirmTitle, title: confirmTitle,
@@ -266,7 +205,7 @@ function fnModalOk() {
modalState.stepNext = true; // 开启下一步 modalState.stepNext = true; // 开启下一步
} else { } else {
message.error({ message.error({
content: `${t('common.operateErr')}`, content: res.msg,
duration: 3, duration: 3,
}); });
} }
@@ -304,9 +243,9 @@ function fnNeTypeChange(v: any) {
title: 'Telnet_NE_5002', title: 'Telnet_NE_5002',
addr: modalState.from.ip, addr: modalState.from.ip,
port: 5002, port: 5002,
user: 'user', user: 'admin',
authMode: '0', authMode: '0',
password: 'user', password: 'admin',
remark: '', remark: '',
}); });
} }
@@ -327,7 +266,7 @@ function fnNeIPChange(e: any) {
function fnStepPrev() { function fnStepPrev() {
Modal.confirm({ Modal.confirm({
title: t('common.tipTitle'), title: t('common.tipTitle'),
content: '确认要放弃当前变更返回上一步吗?', content: t('views.ne.neQuickSetup.stepPrevTip'),
onOk() { onOk() {
fnRestStepState(); fnRestStepState();
fnToStepName('Start'); fnToStepName('Start');
@@ -340,7 +279,7 @@ function fnStepNext() {
if (!modalState.stepNext) return; if (!modalState.stepNext) return;
Modal.confirm({ Modal.confirm({
title: t('common.tipTitle'), title: t('common.tipTitle'),
content: '确认要下一步进行网元软件安装?', content: t('views.ne.neQuickSetup.configStepNext'),
onOk() { onOk() {
fnToStepName('NeInfoSoftwareInstall'); fnToStepName('NeInfoSoftwareInstall');
}, },
@@ -390,9 +329,9 @@ onMounted(() => {
:labelWrap="true" :labelWrap="true"
> >
<a-row :gutter="16"> <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 <a-form-item
:label="t('views.configManage.neManage.neType')" :label="t('views.ne.common.neType')"
name="neType" name="neType"
v-bind="modalStateFrom.validateInfos.neType" v-bind="modalStateFrom.validateInfos.neType"
> >
@@ -411,7 +350,7 @@ onMounted(() => {
<template #prefix> <template #prefix>
<a-tooltip placement="topLeft"> <a-tooltip placement="topLeft">
<template #title> <template #title>
{{ t('views.configManage.neManage.neTypeTip') }} {{ t('views.ne.common.neTypeTip') }}
</template> </template>
<InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" /> <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
</a-tooltip> </a-tooltip>
@@ -420,9 +359,9 @@ onMounted(() => {
</a-auto-complete> </a-auto-complete>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="12" :md="12" :xs="24"> <a-col :lg="6" :md="6" :xs="24">
<a-form-item <a-form-item
:label="t('views.configManage.neManage.neId')" :label="t('views.ne.common.neId')"
name="neId" name="neId"
v-bind="modalStateFrom.validateInfos.neId" v-bind="modalStateFrom.validateInfos.neId"
> >
@@ -435,7 +374,7 @@ onMounted(() => {
<template #prefix> <template #prefix>
<a-tooltip placement="topLeft"> <a-tooltip placement="topLeft">
<template #title> <template #title>
{{ t('views.configManage.neManage.neIdTip') }} {{ t('views.ne.common.neIdTip') }}
</template> </template>
<InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" /> <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
</a-tooltip> </a-tooltip>
@@ -446,9 +385,9 @@ onMounted(() => {
</a-row> </a-row>
<a-row :gutter="16"> <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 <a-form-item
:label="t('views.configManage.neManage.ip')" :label="t('views.ne.common.ipAddr')"
name="ip" name="ip"
v-bind="modalStateFrom.validateInfos.ip" v-bind="modalStateFrom.validateInfos.ip"
> >
@@ -464,7 +403,7 @@ onMounted(() => {
<a-tooltip placement="topLeft"> <a-tooltip placement="topLeft">
<template #title> <template #title>
<div> <div>
{{ t('views.ne.neInfo.ipAddr') }} {{ t('views.ne.common.ipAddrTip') }}
</div> </div>
</template> </template>
<InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" /> <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
@@ -473,9 +412,9 @@ onMounted(() => {
</a-input> </a-input>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="12" :md="12" :xs="24"> <a-col :lg="6" :md="6" :xs="24">
<a-form-item <a-form-item
:label="t('views.configManage.neManage.port')" :label="t('views.ne.common.port')"
name="port" name="port"
v-bind="modalStateFrom.validateInfos.port" v-bind="modalStateFrom.validateInfos.port"
> >
@@ -490,7 +429,7 @@ onMounted(() => {
<template #prefix> <template #prefix>
<a-tooltip placement="topLeft"> <a-tooltip placement="topLeft">
<template #title> <template #title>
<div>{{ t('views.configManage.neManage.portTip') }}</div> <div>{{ t('views.ne.common.portTip') }}</div>
</template> </template>
<InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" /> <InfoCircleOutlined style="color: rgba(0, 0, 0, 0.45)" />
</a-tooltip> </a-tooltip>
@@ -499,173 +438,29 @@ onMounted(() => {
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </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> </a-form>
<div class="ne-oper"> <div class="ne-oper">
<a-space direction="horizontal" :size="18"> <a-space direction="horizontal" :size="18">
<a-button @click="fnStepPrev()"> 上一步 </a-button> <a-button @click="fnStepPrev()">
{{ t('views.ne.neQuickSetup.stepPrev') }}
<a-button
type="primary"
@click="fnModalOk()"
:loading="modalState.confirmLoading"
>
保存信息
</a-button> </a-button>
<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()" @click="fnStepNext()"
:disabled="!modalState.stepNext" :disabled="!modalState.stepNext"
> >
下一步 {{ t('views.ne.neQuickSetup.stepNext') }}
</a-button> </a-button>
</a-space> </a-space>
</div> </div>
@@ -674,10 +469,15 @@ onMounted(() => {
<style lang="less" scoped> <style lang="less" scoped>
.ne { .ne {
padding-top: 12px; min-height: 400px;
display: flex;
flex-direction: column;
& .ant-form {
flex: 1;
}
&-oper { &-oper {
padding-top: 24px;
text-align: end; text-align: end;
} }
} }

View File

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

View File

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

View File

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

View File

@@ -41,11 +41,32 @@ export const stepState: StepStateType = reactive({
}); });
/**步骤信息状态复位 */ /**步骤信息状态复位 */
export function fnRestStepState() { export function fnRestStepState(t?: any) {
stepState.stepName = 'Start'; stepState.stepName = 'Start';
stepState.current = 0; stepState.current = 0;
stepState.neHost = {}; stepState.neHost = {};
stepState.neInfo = {}; 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'),
},
];
}
} }
/**跳转步骤组件 */ /**跳转步骤组件 */

View File

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

View File

@@ -156,22 +156,16 @@ function fnHostAuthorized(row: Record<string, any>) {
if (tabState.confirmLoading) return; if (tabState.confirmLoading) return;
Modal.confirm({ Modal.confirm({
title: '提示', title: t('common.tipTitle'),
content: '是否要配置免密直连?', content: t('views.ne.neHost.authRSATip'),
onOk: () => { onOk: () => {
tabState.confirmLoading = true; tabState.confirmLoading = true;
neHostAuthorizedRSA(row).then(res => { neHostAuthorizedRSA(row).then(res => {
tabState.confirmLoading = false; tabState.confirmLoading = false;
if (res.code === RESULT_CODE_SUCCESS) { if (res.code === RESULT_CODE_SUCCESS) {
message.success({ message.success(t('common.operateOk'), 3);
content: `操作成功`,
duration: 2,
});
} else { } else {
message.error({ message.error(t('common.operateErr'), 3);
content: `操作失败`,
duration: 2,
});
} }
}); });
}, },