@yxhl/specter-pui

雅心互联 Vue 3 + Vuetify 3 智能组件库

📦 安装

npm install @yxhl/specter-pui-vtk

🚀 快速开始

完整引入

import { createApp } from 'vue'
import App from './App.vue'
import SpecterPuiVtk from '@yxhl/specter-pui'
import '@yxhl/specter-pui/dist/specter-pui.css'

const app = createApp(App)
app.use(SpecterPuiVtk)
app.mount('#app')

按需引入

import { VtkStepper, VtkPage, storage } from '@yxhl/specter-pui'

export default {
  components: {
    VtkStepper,
    VtkPage
  },
  setup() {
    // 使用工具函数
    storage.set('key', 'value')
  }
}

📚 组件列表

基础组件

• VtkArea - 地区选择组件
• VtkCheckbox - 复选框组件
• VtkCount - 计数器组件
• VtkDatePicker - 日期选择器
• VtkEmpty - 空状态组件
• VtkFab - 浮动按钮
• VtkFormItem - 表单项组件
• VtkImg - 图片组件
• VtkPage - 分页组件
• VtkPdf - PDF 查看器
• VtkProj - 项目组件
• VtkRadio - 单选框组件
• VtkSearch - 搜索组件
• VtkSelect - 下拉选择组件
• VtkStepper - 步骤条组件

消息组件

• vtkMessage - 全局消息提示

🛠️ 工具函数

storage - 本地存储

import { storage } from '@yxhl/specter-pui'

storage.set('key', 'value')
storage.get('key')
storage.remove('key')
storage.clear()

request - HTTP 请求

import { request } from '@yxhl/specter-pui'

request.get('/api/data')
request.post('/api/data', { data })

themes - 主题管理

import { themes } from '@yxhl/specter-pui'

themes.toggle() // 切换主题

Composables

import { usePage, useVtk } from '@yxhl/specter-pui'

// 分页功能
const { page, pageSize, total } = usePage()

// 访问全局对象
const vtk = useVtk()
vtk.message.success('操作成功')

🔄 更新组件库

当组件库发布新版本后,在你的项目中运行:

# 更新到最新版本
npm update @yxhl/specter-pui

# 或指定版本
npm install @yxhl/specter-pui@latest

📄 License

MIT

👥 Author

yxhl [email protected]