# AGENTS.md - Vue Composables (hooks)

**Generated:** 2026-03-03
**Purpose:** Custom Vue 3 composables for data fetching and UI state

## Key Hooks

### useDict

Fetch dictionary data with automatic caching.

```typescript
const { dict } = useDict('sex', 'status', 'type');
// Access: dict.sex, dict.status, dict.type
// Automatically cached per type
```

### useTable

Table data management with pagination.

```typescript
const { tableData, loading, pagination, getData, resetQuery } = useTable({
	pageList: fetchList, // API function
	queryForm: reactive({ name: '' }), // Query params
});

// pagination: { current, size, total }
// getData(): refresh table
// resetQuery(): reset to defaults
```

### useMessage

Toast notifications.

```typescript
const { msgSuccess, msgError, msgWarning } = useMessage();
msgSuccess('操作成功');
msgError('操作失败');
```

### useMessageBox

Confirm/alert dialogs.

```typescript
const { msgBoxConfirm, msgBoxAlert } = useMessageBox();

// Confirm
await msgBoxConfirm('确定删除该记录?');
// Returns promise, resolves on confirm

// Alert
await msgBoxAlert('提示信息');
```

### useParam

Fetch system parameters.

```typescript
const { param } = useParam('SYSTEM_NAME');
// Access: param.SYSTEM_NAME
```

## Files

| File             | Purpose                      |
| ---------------- | ---------------------------- |
| useDict.ts       | Dictionary data with caching |
| useTable.ts      | Table + pagination state     |
| useMessage.ts    | Toast notifications          |
| useMessageBox.ts | Confirm dialogs              |
| useParam.ts      | System parameters            |

## Pattern

All hooks follow Vue 3 composition API pattern:

1. Accept reactive params
2. Return reactive state + methods
3. Handle loading/error states internally
4. Provide clean API surface
