iotlcm-public/website
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
28 Commits 1 Branch 0 Tags
fefad82e78d5c40c8701b8fe3df3fdba4b928717
Commit Graph

6 Commits

Author SHA1 Message Date
Dai0814 fefad82e78 fix(nav): 修左上角品牌名与副标题挤成一行，并加上防误改校验
mirror-to-gitee / mirror (push) Successful in 6s
Details 
现象：导航左上角显示成「雪羊科技物联网卡与设备管理平台」挤在一行，
副标题没有换行，还压到了 logo 上。

根因
siteTitle 里的副标题是 <span class="site-subtitle">，经 v-html 插入后，
其父级是 VitePress 自己的**裸 <span>（无 class）**，而不是 .title-text。
原样式写的是 `.VPNavBarTitle .title-text .site-subtitle`，
选择器永远匹配不上，display:block 从未生效，副标题只能行内跟随。

改动
- 选择器改为 .VPNavBarTitle .site-subtitle（去掉不存在的 .title-text）
- 品牌名与副标题的容器改为 flex 纵向 + 垂直居中，
  整体在导航高度内居中
- 副标题 11px / 0.03em 字距 / var(--p-ink-3) 弱化；
  品牌名与副标题间距 3px
- 响应式：≤860px 副标题缩到 10.5px；≤480px 隐藏副标题只留品牌名
- 新增 scripts/check-nav-brand.mjs 并接入 npm run check（prebuild/predev 自动跑）：
  校验 siteTitle 的**品牌主体**必须是「雪羊科技」（允许带副标题 span），
  且 logo 配置与文件都存在。
  反例全部验证：改成「雪羊开源」→ 拦；只留「雪羊科技」→ 通过；
  改成「雪羊科技开源」→ 拦；删掉 siteTitle → 拦

验证
- 干净副本构建后实测三档宽度：
  1440/860 → 「雪羊科技 ⏎ 物联网卡与设备管理平台」，display:block
  390     → 只显示「雪羊科技」，副标题 display:none
- 品牌区截图确认两行居中、不压 logo
 2026-11-06 09:52:06 +08:00
Dai0814 6944652966 fix(portal): 官方文档导航直接跳文档站，不再停在本站锚点
mirror-to-gitee / mirror (push) Successful in 3s
Details 
原先导航「官方文档」指向 /#docs（首页内的文档区块），
用户期望点它直接进 http://open.5iot.com:5051/docs/。

改动
- 导航项改为外链 http://open.5iot.com:5051/docs/，
  带 target=_blank 与 rel=noopener，新开标签页不打断阅读
- 首页 hero 的「官方文档」按钮同样改为外链直跳
- 文档站地址收敛为单一来源：data/content.ts 导出 DOCS_BASE / DOCS_HOME，
  可用环境变量 DOCS_BASE 覆盖；config.mts 与 HomePage.vue 都引用它，
  消除原先三处硬编码
- 首页的「官方文档」区块（#docs）保留，仍是各手册入口的聚合卡片

验证
- 导航渲染实测：href=http://open.5iot.com:5051/docs/, target=_blank
- 点击实测：新开标签页到目标地址，原页面 URL 不变
- 锚点项高亮不受影响（点「产品功能」仍正常变蓝）
- 构建 13 页 262 引用 0 失效
 2026-11-04 15:36:04 +08:00
Dai0814 39209ef591 fix(portal): 导航栏锚点项点击后正确高亮
mirror-to-gitee / mirror (push) Successful in 3s
Details 
问题：点「产品功能 / 核心能力 / 界面预览 / 官方文档」跳转后图标不变蓝。
根因：VitePress 的 isActive() 只比较 path，不看 hash。nav 里
「首页 /」「产品功能 /#features」「核心能力 /#core」的路径部分都是 `/`，
默认逻辑要么把首页和当前锚点同时点亮，要么只亮首页。

改动
- 新增 .vitepress/theme/nav-anchor.ts 接管首页内锚点项的激活判定：
  用 data-anchor-active 属性标记，规则为
  在首页且有 hash → 只有 hash 匹配项亮；在首页无 hash → 只有「首页」亮；
  不在首页 → 清标记交回 VitePress 默认逻辑
- 样式侧用 html.portal-nav-home 限定压制默认 active 的作用域，
  只影响首页，不影响 /projects/ 与 /about 的正常高亮
- 导航「项目」加 activeMatch: '^/projects/'，
  使 /projects/iotlcm/ 等详情页也保持高亮
- MutationObserver 监听导航 DOM 变化（SPA 切换、主题切换会重建）

踩的坑
- Layout 是函数式组件，onMounted 在其中无效（Vue 报"no active component
  instance"），改用 nextTick 调度
- 初版用 hashOf(a) 判空来识别「首页」，但 /projects/ 与 /about 也没有 hash，
  被误判成首页项一起点亮；改为判断 href 解析后是否为 '/'
- 抑制规则最初没加作用域，导致非首页页面的正常 active 也被压成黑字

验证（8 个场景逐个实测）
首页顶部→首页 / 四个锚点→各自高亮 / 项目页→项目 /
关于页→关于 / iotLCM 详情→项目；构建 13 页 274 引用 0 失效
 2026-11-04 15:23:37 +08:00
Dai0814 ea47bab100 style(portal): 核心能力改为深色强调区块，并前移到产品功能之前
mirror-to-gitee / mirror (push) Successful in 4s
Details 
用户反馈"上方没有核心能力重点突出"。原因是原实现里
核心能力用的是 p-section--alt（浅灰底），而它相邻的产品功能是白底、
项目列表也是浅灰底，三者色阶接近，深色上没有形成视觉断点，
区块在页面里读起来和普通段落没有区别。

改动
- 新增 .p-section--deep 变体：浅色主题下用 #0d1220 近黑底 +
  顶部靛蓝径向光晕 + 一道渐变高光线，卡片改半透明白
- 核心能力改用该变体，并从产品功能之后移到之前：
  项目 → 核心能力（深色）→ 产品功能 → 界面预览
  深色块夹在项目列表与产品功能之间，形成明显的节奏断点
- 产品功能改用 p-section--alt，与前后白底交替
- 暗色主题下强调区不能用"压深"（页面底已是 #0c0f16），
  改用 #161b2c 冷灰蓝 + 更强光晕，靠提亮形成层次

验证
- 构建 13 页，256 条引用 0 失效
- 浏览器实测区块顺序：hero → projects → core → features → preview
  → foundation → howtheyfit → docs → cta
- 浅色 / 暗色两套主题均截图核对，强调区都能跳出来
 2026-11-04 14:34:53 +08:00
Dai0814 ccb3f5e39a feat(portal): 首页补齐产品功能、核心能力、界面预览、官方文档四个区块
mirror-to-gitee / mirror (push) Successful in 4s
Details 
用户反馈首页缺产品功能、核心能力与界面预览，且没有官方文档入口。

新增区块
- 产品功能：三条产品线（iotLCM / 秀杰 DTU / XiuAdmin），
  每条列 6 项能力，卡片底部直达详情页
- 核心能力：8 张带标签的卡片，讲工程层面的硬指标
  （部署、接入、开放、治理、韧性、交付、数据、维护），
  与"产品功能"区分开：前者是做什么，后者是凭什么能用住
- 界面预览：ScreenshotPreview 组件，Web 管理端 / 小程序端两组标签切换，
  首屏大图 + 缩略图条，带浏览器窗口装饰
- 官方文档：6 个入口卡片（文档中心、Web 手册、小程序手册、部署手册、
  OpenAPI 合同、门户部署说明），外链自动加 target=_blank

界面预览的占位机制
- previewShots 里 file 留空时渲染带图注的占位框，不报错、不影响构建
- 补图只改 file 字段，组件无需改动
- 新增 pages/public/screenshots/README.md 写清命名、尺寸、脱敏要求

导航
- 增加产品功能、核心能力、界面预览、官方文档四个锚点项
- 窄屏（≤860px）隐藏中间三个锚点项，避免挤压

验证
- 构建 13 页，208 条引用 0 失效
- 浏览器实测：7 个导航项、5 个 section 锚点齐全
- 移动端 390px 无横向溢出
- 文档站 5 个外链地址均实测 200 可达
 2026-11-04 14:27:48 +08:00
Dai0814 ac1354da9e style(portal): 重做整站排版，改为落地页式布局
mirror-to-gitee / mirror (push) Successful in 5s
Details 
排版语言
- 引入独立视觉系统 .vitepress/theme/styles/portal.css：
  中性底色 + 单一强调色（#4f46e5），正文靠留白与层级取胜，
  不使用大面积彩色底、渐变铺满或装饰性图形
- CSS 变量定义在 :root（原先挂在 .portal 下，导致内容页拿不到值）
- 完整支持暗色模式，变量在 html.dark 下整体替换

首页（pages/index.md → HomePage.vue）
- hero：居中大标题（强调色渐变仅作用于一个词组）、双按钮、四格数据条
- 项目区：三栏卡片，标题 + 状态徽标 + 定位 + 说明 + 技术栈标签
- 通用能力：六格编号卡片
- 组合方式：三栏场景步骤卡，每张带一条可复制命令
- 底部 CTA 区块
- 页面改用 layout: page，通过 Layout 包装层去掉默认窄栏

项目详情页
- iotLCM / DTU：能力矩阵改为标签切换（CapabilityTabs），
  每个业务域一屏，点击切换，替代原先的大宽表
- XiuAdmin：22 项内置功能按用途归为四组标签墙（FeatureGrid）
- 内容页二级标题加短强调线，表格首列不换行，属性表不再竖排

数据
- 新增 data/content.ts 承载首页文案、能力分组、长期事实统计，
  与 projects.ts 并列；文案口径取自各项目 README/详情页，无凭空数字
- 修正 scripts/check-registry.mjs：原先扫描 data/ 下所有 .ts 的 id，
  新增 content.ts 后把业务分组 id 误判为项目；改为只读 projects.ts

验证
- 构建通过，12 个页面，193 条引用 0 失效
- HTTP 实测 12 个路径全 200，不存在路径 404
- 暗色模式与移动端（390px）已截图核对，无横向溢出
 2026-11-04 14:13:50 +08:00