From b012582f68839f599314429094a16891c77ca985 Mon Sep 17 00:00:00 2001 From: fhysy <1149505133@qq.com> Date: Mon, 22 Sep 2025 16:55:26 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E4=BA=86=E5=A4=9A?= =?UTF-8?q?=E4=B8=AASVG=E5=9B=BE=E6=A0=87=EF=BC=8C=E7=94=A8=E4=BA=8E?= =?UTF-8?q?=E5=90=8E=E7=BB=AD=E8=8F=9C=E5=8D=95=E5=92=8C=E7=95=8C=E9=9D=A2?= =?UTF-8?q?=E5=B1=95=E7=A4=BA,=E4=BC=98=E5=8C=96=E6=A6=82=E8=A7=88?= =?UTF-8?q?=E9=A1=B5=E3=80=81=E8=AE=BE=E5=A4=87=E5=92=8C=E4=BA=A7=E5=93=81?= =?UTF-8?q?=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 调整了概览页流量与设备数据的随机生成范围,修正数据点计算方式,并优化ECharts的Y轴配置,移除了双Y轴显示,使图表更清晰直观。 - 为仪表盘路由添加菜单图标在仪表盘相关路由的meta信息中增加了icon字段,配置了对应的SVG图标,用于侧边栏菜单展示。 - 优化设备管理页面结构与样式 - 调整产品卡片的布局与样式,优化信息展示结构,统一操作按钮样式,并更新了产品状态的显示逻辑。 - 在设备分类、网络管理、协议管理等模块的表单配置中,设置showCollapseButton为false,隐藏了折叠按钮,简化界面交互。 --- apps/web-antd/src/router/routes/local.ts | 2 + .../overview/overview-traffic-revenue.vue | 53 +++-- .../src/views/device/device/index.vue | 175 ++++++++-------- .../src/views/device/product/index.vue | 192 +++++++++++------- .../views/device/productCategory/index.vue | 1 + .../src/views/operations/network/index.vue | 1 + .../src/views/operations/protocol/index.vue | 1 + .../icons/ant-design--dashboard-outlined.svg | 1 + .../carbon--ibm-cloud-transit-gateway.svg | 1 + .../svg/icons/carbon--rule-data-quality.svg | 1 + .../icons/eos-icons--products-outlined.svg | 1 + .../icons/flowbite--desktop-pc-outline.svg | 1 + .../src/svg/icons/fluent-mdl2--product.svg | 1 + .../icons/hugeicons--license-maintenance.svg | 1 + .../icons/icon-park-outline--robot-two.svg | 1 + packages/icons/src/svg/icons/ix--protocol.svg | 1 + ...ial-symbols--assignment-return-outline.svg | 1 + .../material-symbols--dashboard-outline.svg | 1 + .../svg/icons/mdi--account-online-outline.svg | 1 + .../src/svg/icons/proicons--document.svg | 1 + .../src/svg/icons/ri--alarm-warning-line.svg | 1 + .../svg/icons/solar--document-text-linear.svg | 1 + .../src/svg/icons/streamline--network.svg | 1 + .../icons/src/svg/icons/tabler--category.svg | 1 + .../icons/tabler--device-heart-monitor.svg | 1 + packages/icons/src/svg/index.ts | 65 ++++++ 26 files changed, 319 insertions(+), 189 deletions(-) create mode 100644 packages/icons/src/svg/icons/ant-design--dashboard-outlined.svg create mode 100644 packages/icons/src/svg/icons/carbon--ibm-cloud-transit-gateway.svg create mode 100644 packages/icons/src/svg/icons/carbon--rule-data-quality.svg create mode 100644 packages/icons/src/svg/icons/eos-icons--products-outlined.svg create mode 100644 packages/icons/src/svg/icons/flowbite--desktop-pc-outline.svg create mode 100644 packages/icons/src/svg/icons/fluent-mdl2--product.svg create mode 100644 packages/icons/src/svg/icons/hugeicons--license-maintenance.svg create mode 100644 packages/icons/src/svg/icons/icon-park-outline--robot-two.svg create mode 100644 packages/icons/src/svg/icons/ix--protocol.svg create mode 100644 packages/icons/src/svg/icons/material-symbols--assignment-return-outline.svg create mode 100644 packages/icons/src/svg/icons/material-symbols--dashboard-outline.svg create mode 100644 packages/icons/src/svg/icons/mdi--account-online-outline.svg create mode 100644 packages/icons/src/svg/icons/proicons--document.svg create mode 100644 packages/icons/src/svg/icons/ri--alarm-warning-line.svg create mode 100644 packages/icons/src/svg/icons/solar--document-text-linear.svg create mode 100644 packages/icons/src/svg/icons/streamline--network.svg create mode 100644 packages/icons/src/svg/icons/tabler--category.svg create mode 100644 packages/icons/src/svg/icons/tabler--device-heart-monitor.svg diff --git a/apps/web-antd/src/router/routes/local.ts b/apps/web-antd/src/router/routes/local.ts index e6b24cf..7997ceb 100644 --- a/apps/web-antd/src/router/routes/local.ts +++ b/apps/web-antd/src/router/routes/local.ts @@ -32,6 +32,7 @@ export const localMenuList: RouteRecordStringComponent[] = [ { component: 'BasicLayout', meta: { + icon: 'svg:material-symbols--dashboard-outline', order: -1, title: 'page.dashboard.title', // 不使用基础布局(仅在顶级生效) @@ -46,6 +47,7 @@ export const localMenuList: RouteRecordStringComponent[] = [ path: '/overview', component: '/dashboard/overview/index', meta: { + icon: 'svg:ant-design--dashboard-outlined', affixTab: true, title: '概览页', }, diff --git a/apps/web-antd/src/views/dashboard/overview/overview-traffic-revenue.vue b/apps/web-antd/src/views/dashboard/overview/overview-traffic-revenue.vue index c7c169c..0552ff7 100644 --- a/apps/web-antd/src/views/dashboard/overview/overview-traffic-revenue.vue +++ b/apps/web-antd/src/views/dashboard/overview/overview-traffic-revenue.vue @@ -28,9 +28,9 @@ const generateDateLabels = (type: string) => { switch (type) { case 'halfyear': { // 半年(180天,每10天一个数据点) - for (let i = 17; i >= 0; i--) { + for (let i = 179; i >= 0; i--) { const date = new Date(today); - date.setDate(date.getDate() - i * 10); + date.setDate(date.getDate() - i); labels.push( `${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`, ); @@ -85,26 +85,26 @@ const chartData = computed(() => { switch (props.type) { case 'halfyear': { - trafficData = generateRandomData(dataCount, 50, 800); - deviceData = generateRandomData(dataCount, 100, 1000); + trafficData = generateRandomData(dataCount, 1000, 10_000); + deviceData = generateRandomData(dataCount, 10, 100); maxValue = 1500; break; } case 'month': { - trafficData = generateRandomData(dataCount, 80, 600); - deviceData = generateRandomData(dataCount, 200, 900); + trafficData = generateRandomData(dataCount, 800, 6000); + deviceData = generateRandomData(dataCount, 10, 100); maxValue = 1200; break; } case 'week': { - trafficData = generateRandomData(dataCount, 100, 500); - deviceData = generateRandomData(dataCount, 300, 800); + trafficData = generateRandomData(dataCount, 1000, 5000); + deviceData = generateRandomData(dataCount, 10, 100); maxValue = 1000; break; } default: { - trafficData = generateRandomData(dataCount, 100, 500); - deviceData = generateRandomData(dataCount, 300, 800); + trafficData = generateRandomData(dataCount, 1000, 5000); + deviceData = generateRandomData(dataCount, 10, 100); maxValue = 1000; } } @@ -171,26 +171,19 @@ onMounted(() => { color: '#666', }, }, - yAxis: { - type: 'value', - max: 1000, - axisLine: { - lineStyle: { - color: '#e0e0e0', - }, + yAxis: [ + { + type: 'value', + name: '流量', + min: 0, }, - axisTick: { - show: false, - }, - axisLabel: { - color: '#666', - }, - splitLine: { - lineStyle: { - color: '#f0f0f0', - }, - }, - }, + // { + // type: 'value', + // name: '设备数', + // min: 0, + // position: 'right', + // }, + ], series: [ { name: '流量', @@ -212,6 +205,7 @@ onMounted(() => { itemStyle: { color: '#2D72FF', }, + // yAxisIndex: 0, // areaStyle: { // color: { // type: 'linear', @@ -252,6 +246,7 @@ onMounted(() => { itemStyle: { color: '#1FC5AE', }, + // yAxisIndex: 1, // areaStyle: { // color: { // type: 'linear', diff --git a/apps/web-antd/src/views/device/device/index.vue b/apps/web-antd/src/views/device/device/index.vue index 0c82c0b..84b9509 100644 --- a/apps/web-antd/src/views/device/device/index.vue +++ b/apps/web-antd/src/views/device/device/index.vue @@ -1,15 +1,7 @@