我来帮您基于src/package目录中的组件编写使用手册。首先让我查看一下package目录中的组件结构。

Ran tool 现在让我查看每个组件的具体实现，以便编写详细的使用手册。我将逐个查看主要组件：

Read file: src/package/type.ts 现在让我查看几个主要组件的实现：

Read file: src/package/HtTable/HtTable.vue Read file: src/package/HtDialog/HtDialog.vue Read file: src/package/HtSelectBaseData/HtSelectBaseData.vue Read file: src/package/HtUploadFiles/HtUploadFiles.vue 现在让我查看其他几个重要组件：

Read file: src/package/HtDrawer/HtDrawer.vue Read file: src/package/HtSelectUser/HtSelectUser.vue 现在让我查看一些其他重要组件：

Read file: src/package/HtRow/HtRow.vue Read file: src/package/HtCol/HtCol.vue 现在让我查看一些其他组件：

Read file: src/package/HtSelectDate/HtSelectDate.vue 现在让我查看导出相关的组件：

Read file: src/package/HtExport/HtExport.vue 现在让我查看一些其他组件：

Read file: src/package/HtPageInfo/HtPageInfo.vue 现在让我查看一些其他组件：

Read file: src/package/HtModel/HtModel.vue

以下是基于 src/package 目录下主要组件的简要使用手册，涵盖常用属性、用法和典型场景。每个组件都基于 Element Plus 二次封装，支持 v-model 及常用插槽，便于灵活扩展。

1. HtTable 表格组件

功能：支持分页、选择、序号、展开行、自定义列、合计行等，适合大部分业务表格场景。

常用属性：

• data：表格数据数组
• showColumns：列配置（参考 Column 类型）
• checked：是否显示多选框
• isExpand：是否显示展开行
• hideOrder：是否隐藏序号列
• hidePage：是否隐藏分页
• pagination：分页配置
• 事件：row-click、sort-change、select、onchange（分页变化）

示例：

<HtTable
  :data="tableData"
  :showColumns="columns"
  :pagination="{ pageSizes: [10, 20, 50] }"
  @onchange="handlePageChange"
>
  <template #expand="{ row }">
    <!-- 展开行内容 -->
  </template>
</HtTable>

2. HtDialog 对话框组件

功能：弹窗对话框，支持自定义头部、底部、全屏、宽度、遮罩等。

常用属性：

• v-model：控制显示/隐藏
• title：标题
• width：宽度，默认600px
• fullscreen：是否全屏
• withFooter：是否显示底部按钮
• 事件：onOk、onCancel

示例：

<HtDialog v-model="dialogVisible" title="编辑信息" @onOk="submit">
  <div>内容区</div>
  <template #footer>
    <el-button @click="dialogVisible=false">取消</el-button>
    <el-button type="primary" @click="submit">确定</el-button>
  </template>
</HtDialog>

3. HtDrawer 抽屉组件

功能：侧边弹出抽屉，支持自定义头部、底部、宽度、遮罩等。

常用属性：

• v-model：控制显示/隐藏
• title：标题
• size：宽度，默认60%
• withFooter：是否显示底部按钮
• 事件：onOk、onCancel

示例：

<HtDrawer v-model="drawerVisible" title="详情" @onOk="save">
  <div>内容区</div>
</HtDrawer>

4. HtSelectBaseData 基础数据选择

功能：选择基础数据（如字典、枚举等），支持只读、隐藏编码、多选、层级过滤等。

常用属性：

• dataTypeId：基础数据类型ID（必填）
• modelValue：绑定值
• multiple：是否多选
• readonly：只读模式
• hideCode：是否隐藏编码
• 事件：change

示例：

<HtSelectBaseData dataTypeId="gender" v-model="gender" :multiple="false" />

5. HtSelectUser 用户选择

功能：选择用户，支持多选、只读、tag展示、层级过滤等。

常用属性：

• modelValue：绑定值
• multiple：是否多选
• readonly：只读模式
• isTag：以tag方式展示
• 事件：change

示例：

<HtSelectUser v-model="userId" :multiple="true" />

6. HtSelectOrg 组织选择

功能：选择组织/部门，支持多选、只读、层级过滤等。

常用属性：

• modelValue：绑定值
• multiple：是否多选
• readonly：只读模式
• 事件：change

示例：

<HtSelectOrg v-model="orgId" :multiple="false" />

7. HtSelectDate 日期选择

功能：日期/时间选择，支持多种格式、范围选择、快捷选项等。

常用属性：

• modelValue：绑定值
• format：日期格式（如"YYYY-MM-DD"）
• dateType：'range'表示范围选择
• shortcuts：快捷选项
• 事件：change

示例：

<HtSelectDate v-model="date" format="YYYY-MM-DD" />

8. HtUploadFiles 文件上传

功能：文件上传，支持多文件、拖拽、类型限制、下载、删除等。

常用属性：

• modelValue：文件token或数组
• multiple：是否多选
• fileType：允许的文件类型
• size：单文件最大MB
• readonly：只读模式
• 事件：change、file-uploaded、file-deleted

示例：

<HtUploadFiles v-model="fileToken" :multiple="true" :fileType="['pdf','docx']" :size="10" />

9. HtExport 导出Excel

功能：一键导出Excel，支持自定义请求方式、参数、文件名。

常用属性：

• url：导出接口地址
• method：请求方式（get/post）
• params：请求参数
• fileName：导出文件名
• 事件：无

示例：

<HtExport url="/api/export" :params="{id:123}" fileName="数据.xlsx" />

10. HtRow/HtCol 栅格布局

功能：行/列布局，配合使用实现响应式布局。

HtRow常用属性：

• type：布局类型（如'flex'）
• gutter：栅格间隔

HtCol常用属性：

• span：占据列数
• offset：偏移列数

示例：

<HtRow :gutter="20">
  <HtCol :span="12">左侧</HtCol>
  <HtCol :span="12">右侧</HtCol>
</HtRow>

如需更详细的属性、事件说明，请参考各组件源码或补充需求。
如需英文文档或更详细的API表格，也可告知！