You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
2.7 KiB
105 lines
2.7 KiB
/**
|
|
* 组件索引文件
|
|
* 统一管理项目中的可复用组件
|
|
*/
|
|
|
|
// 客户信息相关组件
|
|
export { default as ClientInfoCard } from './client-info-card/client-info-card.vue'
|
|
export { default as StudentInfoCard } from './student-info-card/student-info-card.vue'
|
|
|
|
// 通用UI组件
|
|
export { default as TabSwitcher } from './tab-switcher/tab-switcher.vue'
|
|
|
|
// 记录卡片组件
|
|
export { default as FitnessRecordCard } from './fitness-record-card/fitness-record-card.vue'
|
|
export { default as CallRecordCard } from './call-record-card/call-record-card.vue'
|
|
|
|
// 组件使用说明
|
|
export const ComponentUsage = {
|
|
// 客户信息卡片
|
|
ClientInfoCard: {
|
|
description: '显示客户基本信息的卡片组件',
|
|
props: {
|
|
clientInfo: 'Object - 客户信息对象'
|
|
},
|
|
events: {
|
|
call: '拨打电话事件,参数: phoneNumber'
|
|
},
|
|
example: `
|
|
<ClientInfoCard
|
|
:client-info="clientInfo"
|
|
@call="handleCall"
|
|
/>
|
|
`
|
|
},
|
|
|
|
// 学生信息卡片
|
|
StudentInfoCard: {
|
|
description: '显示学生信息的卡片组件,支持操作按钮',
|
|
props: {
|
|
student: 'Object - 学生信息对象',
|
|
actions: 'Array - 操作按钮配置',
|
|
showDetails: 'Boolean - 是否显示详细信息'
|
|
},
|
|
events: {
|
|
'toggle-actions': '切换操作面板事件',
|
|
'action': '操作按钮点击事件,参数: { action, student }'
|
|
},
|
|
example: `
|
|
<StudentInfoCard
|
|
:student="student"
|
|
:actions="actions"
|
|
:show-details="true"
|
|
@toggle-actions="toggleActions"
|
|
@action="handleAction"
|
|
/>
|
|
`
|
|
},
|
|
|
|
// 标签切换组件
|
|
TabSwitcher: {
|
|
description: '标签切换组件,支持多标签页面切换',
|
|
props: {
|
|
tabs: 'Array - 标签配置数组 [{ id, name }]',
|
|
activeTabId: 'String|Number - 当前激活标签ID'
|
|
},
|
|
events: {
|
|
'tab-change': '标签切换事件,参数: { tabId, index, tab }'
|
|
},
|
|
example: `
|
|
<TabSwitcher
|
|
:tabs="tabs"
|
|
:active-tab-id="activeTabId"
|
|
@tab-change="handleTabChange"
|
|
/>
|
|
`
|
|
},
|
|
|
|
// 体测记录卡片
|
|
FitnessRecordCard: {
|
|
description: '体测记录卡片组件,显示体测数据和报告',
|
|
props: {
|
|
record: 'Object - 体测记录对象'
|
|
},
|
|
events: {
|
|
'file-click': '文件点击事件,参数: { file, record }'
|
|
},
|
|
example: `
|
|
<FitnessRecordCard
|
|
:record="record"
|
|
@file-click="handleFileClick"
|
|
/>
|
|
`
|
|
},
|
|
|
|
// 通话记录卡片
|
|
CallRecordCard: {
|
|
description: '通话记录卡片组件,显示通话详情',
|
|
props: {
|
|
record: 'Object - 通话记录对象'
|
|
},
|
|
example: `
|
|
<CallRecordCard :record="record" />
|
|
`
|
|
}
|
|
}
|