# healthcaredaas-fe

**Repository Path**: peterchain/healthcaredaas-fe

## Basic Information

- **Project Name**: healthcaredaas-fe
- **Description**: PC后台管理应用前端基础开发框架，基于element-plus的后台管理框架，包含系统登录及权限相关基础功能，以及基于wujie的微前端应用和基于AVUE的CRUD封装。主要技术Vue3 + Typescript + Vite + Tailwindcss + Element-Plus + Avue
- **Primary Language**: JavaScript
- **License**: GPL-3.0
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-09-08
- **Last Updated**: 2025-09-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# healthcaredaas-fe

PC后台管理应用前端基础开发框架

# 主要技术
Vue3 + Typescript + Vite + Tailwindcss + Element-Plus + Avue

# 项目结构
- ui：基于element-plus的后台管理框架，包含系统登录及权限相关基础功能
- app：基于wujie的微前端应用，包含基于AVUE的基础CRUD封装
- test: 组件测试模块

# 框架设计
![框架模块](./docs/大数据平台微前端框架.png)

# 开始
```shell
# 安装依赖
pnpm install

# 打包
# ui 项目
pnpm run build:ui
# app 项目
pnpm run build:app
```

# 项目使用示例
```shell
# 安装依赖
pnpm add -S @healthcaredaas-fe/ui @healthcaredaas-fe/app
```

### pages.ts 批量导入Vue页面
```JavaScript
export const getPages = ()=>{
  // @ts-ignore
  return import.meta.glob('@/views/**/*.vue')
}
```

### 项目入口文件main.ts
```JavaScript
import DaasMicroApp from '@healthcaredaas/app'
import '@healthcaredaas/app/dist/style.css'
import { appCode } from '../package.json'
import { getPages } from './pages'

DaasMicroApp.setup(null, {
  appCode: appCode,
  pages: getPages()
})

```

### setup参数说明
- 第一个参数app: Vue主应用，为空时采用框架内置默认APP
- 第二次参数props: 应用配置参数
    - appCode: 应用编码，必填
    - layout: 系统布局组件，默认为AppAdminLayout
    - noMenu： 是否无系统菜单，默认false
    - appRoutes: 应用路由数据，为空时采用默认路由，包括登录、主页及动态加载的路由数据
    - pages: 应用页面组件数组，必填
    - afters: 后置处理函数数组，基础框架加载完成后，主app mount前执行


# 说明
目前开发作为个人使用，部分细节需后续完善。TS部分为节省时间，很多类型未做定义，后续会根据需要完善。
仓库部分使用了阿里云效个人仓库，如需使用请自行更改。

# 相关链接
- [vue](https://vuejs.org/)
- [element-plus](https://element-plus.org/zh-CN/)
- [wujie](https://wujie-micro.github.io/wujie/)
- [avue](https://avuejs.com/)