docs(UI): 完善网卡和端口批量导入的操作说明

This commit is contained in:
zhang1106
2026-03-27 18:08:26 +08:00
parent ae315e2775
commit 6a8d4144ff
2 changed files with 71 additions and 3 deletions
@@ -334,9 +334,30 @@ function NetworkCardImportModal({ visible, onClose, onSuccess }) {
message="操作说明"
description={
<div style={{ fontSize: '12px', lineHeight: '1.8' }}>
<div> 网卡批量导入用于服务器设备请确保先在设备管理中添加服务器</div>
<div> 模板中的"设备ID"必须与已存在的设备对应</div>
<div> 请先下载模板按模板格式填写数据后再上传</div>
<div><strong>适用范围</strong>批量导入网卡仅适用于<span style={{ color: '#1890ff', fontWeight: 600 }}>服务器设备</span>交换机设备请直接在端口管理中导入端口</div>
<div style={{ marginTop: '8px' }}><strong>前置条件</strong>请先在<span style={{ color: '#1890ff', fontWeight: 600 }}>设备管理</span>中添加目标服务器确保设备ID已存在</div>
<div style={{ marginTop: '8px' }}><strong>操作步骤</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px' }}>
<div>1. 点击下载模板获取标准Excel/CSV文件</div>
<div>2. 按模板格式填写网卡信息<span style={{ color: '#ff4d4f', fontWeight: 600 }}>设备ID</span><span style={{ color: '#ff4d4f', fontWeight: 600 }}>网卡名称</span>为必填项</div>
<div>3. 点击上传区域选择文件或直接拖拽文件到上传区域</div>
<div>4. 系统自动校验数据可预览前10条数据及错误详情</div>
<div>5. 选择导入策略跳过/更新已存在点击开始导入</div>
</div>
<div style={{ marginTop: '8px' }}><strong>字段说明</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px' }}>
<div> <strong>设备ID</strong>必填服务器的唯一标识如DEV001</div>
<div> <strong>网卡名称</strong>必填网卡的名称或标识如eth0网卡1</div>
<div> <strong>插槽编号</strong>选填网卡所在的插槽位置必须为数字</div>
<div> <strong>网卡型号</strong>选填如Intel X710BCM57414</div>
<div> <strong>制造商</strong>选填如IntelMellanox</div>
<div> <strong>描述</strong>选填备注信息</div>
</div>
<div style={{ marginTop: '8px', color: '#faad14' }}><strong>注意事项</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px', color: '#faad14' }}>
<div> 同一设备下网卡名称不可重复</div>
<div> 导入后需在网卡管理中为网卡添加端口</div>
</div>
</div>
}
type="info"
+47
View File
@@ -2191,6 +2191,53 @@ function PortManagement() {
]}
>
<div style={{ padding: '16px 0' }}>
<Alert
message="操作说明"
description={
<div style={{ fontSize: '12px', lineHeight: '1.8' }}>
<div><strong>适用范围</strong>批量导入端口适用于<span style={{ color: '#1890ff', fontWeight: 600 }}>所有设备类型</span>交换机服务器路由器存储等</div>
<div style={{ marginTop: '8px' }}><strong>前置条件</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px' }}>
<div> <strong>交换机端口</strong>可直接导入无需前置操作</div>
<div> <strong>服务器端口</strong>必须先在<span style={{ color: '#1890ff', fontWeight: 600 }}>网卡管理</span>中添加网卡服务器端口与网卡是<span style={{ color: '#ff4d4f', fontWeight: 600 }}>层级关系</span>设备 网卡 端口</div>
</div>
<div style={{ marginTop: '8px' }}><strong>操作步骤</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px' }}>
<div>1. 点击下载模板获取标准Excel/CSV文件</div>
<div>2. 按模板格式填写端口信息<span style={{ color: '#ff4d4f', fontWeight: 600 }}>设备ID</span><span style={{ color: '#ff4d4f', fontWeight: 600 }}>端口名称</span>为必填项</div>
<div>3. 服务器端口可在网卡名称列填写对应的网卡名称如eth0不填则归入未分组端口</div>
<div>4. 点击上传区域选择文件或直接拖拽文件到上传区域</div>
<div>5. 系统自动校验数据可预览前10条数据及错误详情</div>
<div>6. 选择导入策略跳过/更新已存在点击开始导入</div>
</div>
<div style={{ marginTop: '8px' }}><strong>字段说明</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px' }}>
<div> <strong>设备ID</strong>必填设备的唯一标识如DEV001</div>
<div> <strong>端口名称</strong>必填端口的名称或标识如eth0/1GigabitEthernet0/0/1</div>
<div> <strong>网卡名称</strong>选填服务器端口所属的网卡名称如eth0交换机端口留空</div>
<div> <strong>端口类型</strong>选填如RJ45LCSCFCSFP+QSFP28等</div>
<div> <strong>端口速率</strong>选填如1G10G25G100G40G等</div>
<div> <strong>状态</strong>选填空闲/占用/故障默认为空闲</div>
<div> <strong>VLAN ID</strong>选填端口所属的VLAN编号如100</div>
<div> <strong>描述</strong>选填备注信息</div>
</div>
<div style={{ marginTop: '8px', color: '#faad14' }}><strong>注意事项</strong></div>
<div style={{ paddingLeft: '12px', marginTop: '4px', color: '#faad14' }}>
<div> 同一设备下端口名称不可重复</div>
<div> 批量导入支持最多50000条记录</div>
<div> 状态字段请使用空闲/占用/故障勿使用其他值</div>
</div>
</div>
}
type="info"
showIcon
style={{
borderRadius: designTokens.borderRadius.md,
background: designTokens.colors.info.bg,
border: `1px solid ${designTokens.colors.info.light}40`,
marginBottom: '16px',
}}
/>
<Upload.Dragger
name="file"
accept=".xlsx,.xls,.csv"