# XMarkdownSectionExtractor 组件

从 markdown 文档中抽取指定区块的内容，并可转换为不同组件需要的格式。

## 功能特性

- 支持多种 markdown 源（字符串、import、File/Blob、URL）
- 按配置的关键字/标题级别抽取区块
- 支持多种输出格式（默认、xlist-default、xlist-card）
- 可配置字段映射

## 安装引入

```javascript
import XMarkdownSectionExtractor from '@vue2-client/base-client/components/common/XMarkdownSectionExtractor'
```

## 基本用法

### 1. 获取原始 sections 数据

```vue
<XMarkdownSectionExtractor
  :source="markdownSource"
  :sectionsConfig="[{ key: 'suggestion', label: '建议', headingLevel: 3 }]"
  v-slot="{ sections, itemsByKey }"
>
  <div v-for="sec in sections">
    <h3>{{ sec.label }}</h3>
    <ul>
      <li v-for="item in sec.items">{{ item.name }}</li>
    </ul>
  </div>
</XMarkdownSectionExtractor>
```

### 2. 转换为 XList 默认模式

```vue
<XMarkdownSectionExtractor
  :source="markdownSource"
  :sectionsConfig="sectionsConfig"
  outputFormat="xlist-default"
  v-slot="{ formattedData }"
>
  <XList :initialData="formattedData" />
</XMarkdownSectionExtractor>
```

### 3. 转换为 XList 卡片模式

```vue
<XMarkdownSectionExtractor
  :source="markdownSource"
  :sectionsConfig="sectionsConfig"
  outputFormat="xlist-card"
  v-slot="{ formattedData }"
>
  <XList :initialData="formattedData" listMode="card" />
</XMarkdownSectionExtractor>
```

### 4. 自定义字段映射

```vue
<XMarkdownSectionExtractor
  :source="markdownSource"
  :sectionsConfig="sectionsConfig"
  outputFormat="xlist-default"
  :outputOptions="{ numberField: 'id', nameField: 'title' }"
  v-slot="{ formattedData }"
>
  <XList :initialData="formattedData" />
</XMarkdownSectionExtractor>
```

### 5. 手动触发抽取

```vue
<XMarkdownSectionExtractor
  :source="markdownSource"
  :sectionsConfig="sectionsConfig"
  :autoExtract="false"
  ref="extractor"
/>

// 手动调用
this.$refs.extractor.extract().then(sections => {
  console.log('抽取结果:', sections)
})
```

## Props

| 属性 | 类型 | 默认值 | 说明 |
|------|------|--------|------|
| source | String/Object | - | markdown 源，支持字符串、import、File/Blob、URL |
| sectionsConfig | Array | [] | 区块配置数组 |
| autoExtract | Boolean | true | 是否在 mounted 时自动抽取 |
| outputFormat | String | 'default' | 输出格式：default / xlist-default / xlist-card |
| outputOptions | Object | {} | 字段映射选项 |

### sectionsConfig 配置说明

```javascript
[
  {
    key: 'nextStepSuggestion',  // 唯一标识
    label: '下一步建议',         // 标题关键字
    headingLevel: 3            // 标题级别（1-6）
  }
]
```

### outputOptions 配置说明

```javascript
// xlist-default 模式
{ numberField: 'number', nameField: 'name' }

// xlist-card 模式
{ labelField: 'label', valueField: 'name' }
```

## Slots

| 名称      | 说明          |
|---------|-------------|
| default | 默认插槽，暴露以下数据 |

### 插槽暴露的数据

| 变量            | 类型      | 说明                       |
|---------------|---------|--------------------------|
| sections      | Array   | 原始抽取结果数组                 |
| itemsArray    | Array   | 打平的一维条目数组                |
| itemsByKey    | Object  | 按 key 分组的条目对象            |
| formattedData | Array   | 格式化后的数据（根据 outputFormat） |
| loading       | Boolean | 加载状态                     |
| error         | Error   | 错误信息                     |

## Events

| 事件名                    | 参数              | 说明         |
|------------------------|-----------------|------------|
| extracted              | (sections)      | 抽取完成时触发    |
| extracted-items        | (itemsArray)    | 条目数组抽取完成   |
| extracted-items-by-key | (itemsByKey)    | 按 key 分组完成 |
| formatted-data         | (formattedData) | 格式化数据完成    |
| error                  | (error)         | 发生错误时触发    |

## 输出格式说明

### default（默认格式）

返回原始 sections 数组：

```jsons
[
  {
    "key": "nextStepSuggestion",
    "label": "下一步建议",
    "content": "...",
    "items": [
      { "id": 1, "name": "头颅MRI + MRV" },
      { "id": 2, "name": "血液学检验" }
    ]
  }
]
```

### xlist-default 格式

适用于 XList 默认模式：

```json
[
  { "number": 1, "name": "头颅MRI + MRV" },
  { "number": 2, "name": "血液学检验" }
]
```

### xlist-card 格式

适用于 XList 卡片模式（二维数组）：

```json
[
  [
    { "label": "下一步建议", "value": "下一步建议", "type": "title", "bold": true },
    { "label": "", "value": "头颅MRI + MRV", "type": "text" },
    { "label": "", "value": "血液学检验", "type": "text" }
  ]
]
```

## 区块抽取规则

- 按配置的 `label`（关键字）在 markdown 中查找对应标题
- 抽取范围：从标题下方到下一个同级或更高等级标题之前的内容
- 支持自定义正则匹配：`labelPattern: /^建议$/`
