thingorigin-ui

Vue 3 component library for industrial dashboards, data visualization, forms and workflows.
544
Install
npm install thingorigin-ui
Latest Version:0.1.0
Vue:3
License:MIT
Last Updated:Sep 20, 2026
Links: npm
Maintainer: npm_wangbo

ThingOrigin UI

npm version license

面向工业看板、数据大屏与业务后台的 Vue 3 + TypeScript 组件库。

ThingOrigin UI 提供数据图表、生产指标、工业看板、动态表单、流程编排和交互动效等组件,适合快速搭建工业互联网、数字孪生和运营管理界面。

特性

  • Vue 3 + TypeScript,提供组件类型声明
  • 覆盖图表、大屏、OEE、生产趋势、表格、表单和工作流等场景
  • 支持完整注册与命名导出
  • 提供 VitePress 文档、可运行示例和在线演练
  • MIT 许可证,欢迎社区参与

安装

pnpm add thingorigin-ui

也可以使用 npm install thingorigin-ui 或 yarn add thingorigin-ui。

项目需要 Vue 3.3 或更高版本。

使用

完整注册:

import { createApp } from 'vue'
import ThingOriginUI from 'thingorigin-ui'
import 'thingorigin-ui/style.css'
import 'element-plus/dist/index.css'
import App from './App.vue'

createApp(App).use(ThingOriginUI).mount('#app')

按需引入:

<script setup lang="ts">
import { sButton, sChart, sTable } from 'thingorigin-ui'
import 'thingorigin-ui/style.css'
import 'element-plus/dist/index.css'
</script>

<template>
  <s-button type="primary">开始使用</s-button>
  <s-table :data="[]" :columns="[]" />
  <s-chart :options="{}" height="320px" />
</template>

本地开发

pnpm install
pnpm dev

常用命令:

pnpm typecheck     # 类型检查
pnpm build         # 构建组件库
pnpm docs:dev      # 启动文档站
pnpm docs:build    # 构建文档站
pnpm release:check # 发布前完整检查

文档与反馈

浏览器支持

支持现代浏览器的最新两个稳定版本。部分滚动驱动动效在不支持相关 CSS 能力的浏览器中会自动降级,不影响组件基本功能。

License

MIT © ThingOrigin UI contributors

Related Packages

@kxliu/dvc-ui

数据大屏(Data Visualization Container)组件库

366
@putianyi888/vue3-plots

Composable Vue 3 SVG plot layers for building charts from small, focused compone...

8,240 0
nav-layout-vue3

Vue 3 Navigation Layout Container Component Library

1,292
sparkline-vue

Vue.js sparkline charts (ported from jquery.sparkline.js)

8,945 1
hamster-charts

基于 Vue3 + ECharts 的大屏数据可视化组件库,支持地图、图表、布局等开箱即用组件

4,289

Version History

Version Released Vue License
0.1.0 ^3.3.0 MIT
0.0.1 ^3.3.0 ISC