Skip to content

Add QR code scanning, mobile detail page and batch QR export to Excel#781

Open
wjh-1024 wants to merge 8 commits into
veops:masterfrom
wjh-1024:QRCodeAndMobile
Open

Add QR code scanning, mobile detail page and batch QR export to Excel#781
wjh-1024 wants to merge 8 commits into
veops:masterfrom
wjh-1024:QRCodeAndMobile

Conversation

@wjh-1024
Copy link
Copy Markdown

Summary

Add QR code scanning support for CI instances, a mobile-optimized detail page, and batch QR code export embedded in Excel.

Changes

  • feat(api): Add CIMobileDetailView at /ci/<ci_id>/mobile returning CI attrs, relations, and history with attribute_alias_map
  • feat(ui): Add QRCodeButton, QRCodeBatchExport components and CIMobileDetail mobile page
  • feat(ui): Integrate QR code into CI detail tab bar and batch download modal; export QR images in Excel cells via ExcelJS
  • feat(ui): Mobile-optimized layout with attribute alias display, auto-stacked long values, and responsive login page
  • fix(ui): Add with-credentials to model template file upload to fix 401
  • feat(ui): i18n translations (zh/en) for QR and mobile features

中文:

概述:

新增 CI 实例二维码扫描功能、移动端适配的详情页,以及支持在 Excel 中嵌入批量导出的二维码。

变更内容

  • feat(api):新增 /ci/<ci_id>/mobile 接口及 CIMobileDetailView 视图,返回 CI 属性、关联关系和历史记录,并包含 - **attribute_alias_map(属性别名映射)
  • feat(ui):新增 QRCodeButton、QRCodeBatchExport 组件以及 CIMobileDetail 移动端页面
  • feat(ui):将二维码集成至 CI 详情页标签栏及批量下载弹窗;通过 ExcelJS 实现将二维码图片导出至 Excel 单元格
  • feat(ui):优化移动端布局,支持属性别名显示、长文本值自动折叠堆叠,并实现登录页响应式适配
  • fix(ui):为模型模板文件上传请求添加(模型) with-credentials 配置,修复 401 未授权问题
  • feat(ui):新增二维码及移动端相关功能的中英文国际化翻译

手机端效果
png1

Excel导出二维码效果
png2

wjh-1024 added 8 commits May 26, 2026 11:48
attribute alias map

- Add CIMobileDetailView at /ci/<ci_id>/mobile
- Return core attributes, parent/child relations, and recent history
- Include attribute_alias_map for frontend alias display"
mobile detail page

- Add QRCodeButton component for single CI QR code generation/download
- Add QRCodeBatchExport component for batch QR code download/print
- Add CIMobileDetail mobile-optimized detail page
- Add /cmdb/mobile/:typeId/:ciId route in constant router"
and batch export with Excel

- Add QR code button in ciDetailTab tab bar
- Add QR export option in batch download modal (batchDownload.vue)
- Export QR code images embedded in Excel cells via ExcelJS
- Add batch QR export entry in instanceList action bar and dropdown menu"
add login page responsive

- Show attribute aliases instead of raw names in core info section
- Auto-switch to stacked layout for long attribute values
- Fix relation navigation with null-safe typeId/ciId checks
- Add mobile responsive styles (max-width: 768px) for login page"
- a-upload component did not send session cookies during file upload
- Caused 401 Unauthorized when importing CI type templates"
- Add 17 Chinese and 18 English translation keys for qrcode, mobileDetail,
  coreInfo, parentRelations, childRelations, recentHistory etc.
Exclude array/object values from core attrs to hide raw JSON

Default-collapse parent/child relation cards with toggle and count badge

Prioritize IP fields then unique value as relation display name

Fix same-route navigation by watching $route.params changes

Fix label column: 100px fixed width, left-aligned, ellipsis overflow

Replace _type_name raw name with CITypeCache alias for parent/child relations

Include attribute_alias_map in mobile detail response for frontend alias display
WeChat in-app browser User-Agent exceeds 256 chars, causing MySQL

'Data too long for column browser' error on login

Truncate to [:255] before inserting into audit_login_log.browser"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant