@morya-ui/mcp 0.4.4 → 0.5.0

package/dist/page-snippets.js

@@ -8,33 +8,33 @@ export const pageSnippets = [
         pageTypes: ['list'],
         keywords: ['筛选', '搜索', '查询', 'filters', 'filter', 'search', 'keyword', 'reset', '基础筛选'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
-        scriptSetup: `const keyword = ref('')
-const status = ref<string | undefined>()
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
-]
-
-function resetFilters() {
-  keyword.value = ''
-  status.value = undefined
+        scriptSetup: `const keyword = ref('')
+const status = ref<string | undefined>()
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
+]
+
+function resetFilters() {
+  keyword.value = ''
+  status.value = undefined
 }`,
-        template: `<MPageFilters aria-label="筛选" variant="filled">
-  <MSpace wrap>
-    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
-    <MSelect
-      v-model="status"
-      :options="statusOptions"
-      placeholder="状态"
-      clearable
-      style="width: 10rem"
-    />
-  </MSpace>
-  <template #actions>
-    <MButton>查询</MButton>
-    <MButton type="text" @click="resetFilters">重置</MButton>
-  </template>
+        template: `<MPageFilters aria-label="筛选" variant="filled">
+  <MSpace wrap>
+    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
+    <MSelect
+      v-model="status"
+      :options="statusOptions"
+      placeholder="状态"
+      clearable
+      style="width: 10rem"
+    />
+  </MSpace>
+  <template #actions>
+    <MButton>查询</MButton>
+    <MButton type="text" @click="resetFilters">重置</MButton>
+  </template>
 </MPageFilters>`,
         rules: [
             '放在 MPageHeader 之后、表格（或 FilterChips）之前',
@@ -68,57 +68,57 @@ function resetFilters() {
         pageTypes: ['list'],
         keywords: ['折叠', '高级筛选', 'collapse', 'advanced', 'expand', 'filter', '次要条件'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
-        scriptSetup: `const filtersExpanded = ref(false)
-const keyword = ref('')
-const status = ref<string | undefined>()
-const department = ref<string | null>(null)
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
-]
-const departmentOptions = [
-  { label: '研发', value: '研发' },
-  { label: '运营', value: '运营' },
-  { label: '市场', value: '市场' },
-]
-
-function resetFilters() {
-  keyword.value = ''
-  status.value = undefined
-  department.value = null
+        scriptSetup: `const filtersExpanded = ref(false)
+const keyword = ref('')
+const status = ref<string | undefined>()
+const department = ref<string | null>(null)
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
+]
+const departmentOptions = [
+  { label: '研发', value: '研发' },
+  { label: '运营', value: '运营' },
+  { label: '市场', value: '市场' },
+]
+
+function resetFilters() {
+  keyword.value = ''
+  status.value = undefined
+  department.value = null
 }`,
-        template: `<MPageFilters
-  v-model:expanded="filtersExpanded"
-  aria-label="筛选"
-  variant="filled"
-  collapsible
->
-  <MSpace wrap>
-    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
-    <MSelect
-      v-model="status"
-      :options="statusOptions"
-      placeholder="状态"
-      clearable
-      style="width: 10rem"
-    />
-  </MSpace>
-  <template #actions>
-    <MButton>查询</MButton>
-    <MButton type="text" @click="resetFilters">重置</MButton>
-  </template>
-  <template #advanced>
-    <MSpace wrap>
-      <MSelect
-        v-model="department"
-        :options="departmentOptions"
-        placeholder="部门"
-        clearable
-        style="width: 10rem"
-      />
-    </MSpace>
-  </template>
+        template: `<MPageFilters
+  v-model:expanded="filtersExpanded"
+  aria-label="筛选"
+  variant="filled"
+  collapsible
+>
+  <MSpace wrap>
+    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
+    <MSelect
+      v-model="status"
+      :options="statusOptions"
+      placeholder="状态"
+      clearable
+      style="width: 10rem"
+    />
+  </MSpace>
+  <template #actions>
+    <MButton>查询</MButton>
+    <MButton type="text" @click="resetFilters">重置</MButton>
+  </template>
+  <template #advanced>
+    <MSpace wrap>
+      <MSelect
+        v-model="department"
+        :options="departmentOptions"
+        placeholder="部门"
+        clearable
+        style="width: 10rem"
+      />
+    </MSpace>
+  </template>
 </MPageFilters>`,
         rules: [
             '常用条件放 default，次要条件放 #advanced',
@@ -152,45 +152,45 @@ function resetFilters() {
         pageTypes: ['list'],
         keywords: ['已选', 'chip', 'tag', 'active', 'clear', '筛选', 'FilterChips', '已选筛选'],
         imports: ['MPageFilterChips', 'MTag'],
-        scriptSetup: `const keyword = ref('')
-const status = ref<string | undefined>()
-const department = ref<string | null>(null)
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
-]
-
-const activeFilters = computed(() => {
-  const items: Array<{ key: string; label: string }> = []
-  if (keyword.value.trim()) {
-    items.push({ key: 'keyword', label: \`关键词：\${keyword.value.trim()}\` })
-  }
-  if (status.value) {
-    const label = statusOptions.find((o) => o.value === status.value)?.label ?? status.value
-    items.push({ key: 'status', label: \`状态：\${label}\` })
-  }
-  if (department.value) {
-    items.push({ key: 'department', label: \`部门：\${department.value}\` })
-  }
-  return items
-})
-
-function clearFilter(key: string) {
-  if (key === 'keyword') keyword.value = ''
-  if (key === 'status') status.value = undefined
-  if (key === 'department') department.value = null
+        scriptSetup: `const keyword = ref('')
+const status = ref<string | undefined>()
+const department = ref<string | null>(null)
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
+]
+
+const activeFilters = computed(() => {
+  const items: Array<{ key: string; label: string }> = []
+  if (keyword.value.trim()) {
+    items.push({ key: 'keyword', label: \`关键词：\${keyword.value.trim()}\` })
+  }
+  if (status.value) {
+    const label = statusOptions.find((o) => o.value === status.value)?.label ?? status.value
+    items.push({ key: 'status', label: \`状态：\${label}\` })
+  }
+  if (department.value) {
+    items.push({ key: 'department', label: \`部门：\${department.value}\` })
+  }
+  return items
+})
+
+function clearFilter(key: string) {
+  if (key === 'keyword') keyword.value = ''
+  if (key === 'status') status.value = undefined
+  if (key === 'department') department.value = null
 }`,
-        template: `<MPageFilterChips v-if="activeFilters.length" label="已选" aria-label="已选筛选">
-  <MTag
-    v-for="item in activeFilters"
-    :key="item.key"
-    :value="item.label"
-    size="small"
-    bordered
-    closable
-    @close="clearFilter(item.key)"
-  />
+        template: `<MPageFilterChips v-if="activeFilters.length" label="已选" aria-label="已选筛选">
+  <MTag
+    v-for="item in activeFilters"
+    :key="item.key"
+    :value="item.label"
+    size="small"
+    bordered
+    closable
+    @close="clearFilter(item.key)"
+  />
 </MPageFilterChips>`,
         rules: [
             '放在 MPageFilters 之后、表格之前',
@@ -241,91 +241,91 @@ function clearFilter(key: string) {
             'MButton',
             'MTag',
         ],
-        scriptSetup: `const filtersExpanded = ref(false)
-const keyword = ref('')
-const status = ref<string | undefined>()
-const department = ref<string | null>(null)
-
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
-]
-const departmentOptions = [
-  { label: '研发', value: '研发' },
-  { label: '运营', value: '运营' },
-  { label: '市场', value: '市场' },
-]
-
-const activeFilters = computed(() => {
-  const items: Array<{ key: string; label: string }> = []
-  if (keyword.value.trim()) {
-    items.push({ key: 'keyword', label: \`关键词：\${keyword.value.trim()}\` })
-  }
-  if (status.value) {
-    const label = statusOptions.find((o) => o.value === status.value)?.label ?? status.value
-    items.push({ key: 'status', label: \`状态：\${label}\` })
-  }
-  if (department.value) {
-    items.push({ key: 'department', label: \`部门：\${department.value}\` })
-  }
-  return items
-})
-
-function clearFilter(key: string) {
-  if (key === 'keyword') keyword.value = ''
-  if (key === 'status') status.value = undefined
-  if (key === 'department') department.value = null
-}
-
-function resetFilters() {
-  keyword.value = ''
-  status.value = undefined
-  department.value = null
+        scriptSetup: `const filtersExpanded = ref(false)
+const keyword = ref('')
+const status = ref<string | undefined>()
+const department = ref<string | null>(null)
+
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
+]
+const departmentOptions = [
+  { label: '研发', value: '研发' },
+  { label: '运营', value: '运营' },
+  { label: '市场', value: '市场' },
+]
+
+const activeFilters = computed(() => {
+  const items: Array<{ key: string; label: string }> = []
+  if (keyword.value.trim()) {
+    items.push({ key: 'keyword', label: \`关键词：\${keyword.value.trim()}\` })
+  }
+  if (status.value) {
+    const label = statusOptions.find((o) => o.value === status.value)?.label ?? status.value
+    items.push({ key: 'status', label: \`状态：\${label}\` })
+  }
+  if (department.value) {
+    items.push({ key: 'department', label: \`部门：\${department.value}\` })
+  }
+  return items
+})
+
+function clearFilter(key: string) {
+  if (key === 'keyword') keyword.value = ''
+  if (key === 'status') status.value = undefined
+  if (key === 'department') department.value = null
+}
+
+function resetFilters() {
+  keyword.value = ''
+  status.value = undefined
+  department.value = null
 }`,
-        template: `<MPageFilters
-  v-model:expanded="filtersExpanded"
-  aria-label="筛选"
-  variant="filled"
-  collapsible
->
-  <MSpace wrap>
-    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
-    <MSelect
-      v-model="status"
-      :options="statusOptions"
-      placeholder="状态"
-      clearable
-      style="width: 10rem"
-    />
-  </MSpace>
-  <template #actions>
-    <MButton>查询</MButton>
-    <MButton type="text" @click="resetFilters">重置</MButton>
-  </template>
-  <template #advanced>
-    <MSpace wrap>
-      <MSelect
-        v-model="department"
-        :options="departmentOptions"
-        placeholder="部门"
-        clearable
-        style="width: 10rem"
-      />
-    </MSpace>
-  </template>
-</MPageFilters>
-
-<MPageFilterChips v-if="activeFilters.length" label="已选" aria-label="已选筛选">
-  <MTag
-    v-for="item in activeFilters"
-    :key="item.key"
-    :value="item.label"
-    size="small"
-    bordered
-    closable
-    @close="clearFilter(item.key)"
-  />
+        template: `<MPageFilters
+  v-model:expanded="filtersExpanded"
+  aria-label="筛选"
+  variant="filled"
+  collapsible
+>
+  <MSpace wrap>
+    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
+    <MSelect
+      v-model="status"
+      :options="statusOptions"
+      placeholder="状态"
+      clearable
+      style="width: 10rem"
+    />
+  </MSpace>
+  <template #actions>
+    <MButton>查询</MButton>
+    <MButton type="text" @click="resetFilters">重置</MButton>
+  </template>
+  <template #advanced>
+    <MSpace wrap>
+      <MSelect
+        v-model="department"
+        :options="departmentOptions"
+        placeholder="部门"
+        clearable
+        style="width: 10rem"
+      />
+    </MSpace>
+  </template>
+</MPageFilters>
+
+<MPageFilterChips v-if="activeFilters.length" label="已选" aria-label="已选筛选">
+  <MTag
+    v-for="item in activeFilters"
+    :key="item.key"
+    :value="item.label"
+    size="small"
+    bordered
+    closable
+    @close="clearFilter(item.key)"
+  />
 </MPageFilterChips>`,
         rules: [
             '顺序：Header → Filters → FilterChips →（可选 Toolbar）→ Table',
@@ -359,40 +359,40 @@ function resetFilters() {
         pageTypes: ['list'],
         keywords: ['dense', 'compact', '紧凑', 'plain', '监控', '告警', '小尺寸筛选'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
-        scriptSetup: `const keyword = ref('')
-const status = ref<string | undefined>()
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
-]
-
-function resetFilters() {
-  keyword.value = ''
-  status.value = undefined
+        scriptSetup: `const keyword = ref('')
+const status = ref<string | undefined>()
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
+]
+
+function resetFilters() {
+  keyword.value = ''
+  status.value = undefined
 }`,
-        template: `<MPageFilters aria-label="筛选" variant="plain">
-  <MSpace wrap>
-    <MInput
-      v-model="keyword"
-      placeholder="搜索"
-      clearable
-      size="small"
-      style="width: 11rem"
-    />
-    <MSelect
-      v-model="status"
-      :options="statusOptions"
-      placeholder="状态"
-      clearable
-      size="small"
-      style="width: 8rem"
-    />
-  </MSpace>
-  <template #actions>
-    <MButton size="small">查询</MButton>
-    <MButton size="small" type="text" @click="resetFilters">重置</MButton>
-  </template>
+        template: `<MPageFilters aria-label="筛选" variant="plain">
+  <MSpace wrap>
+    <MInput
+      v-model="keyword"
+      placeholder="搜索"
+      clearable
+      size="small"
+      style="width: 11rem"
+    />
+    <MSelect
+      v-model="status"
+      :options="statusOptions"
+      placeholder="状态"
+      clearable
+      size="small"
+      style="width: 8rem"
+    />
+  </MSpace>
+  <template #actions>
+    <MButton size="small">查询</MButton>
+    <MButton size="small" type="text" @click="resetFilters">重置</MButton>
+  </template>
 </MPageFilters>`,
         rules: [
             '仅在 dense/compact craft 使用；默认列表用 list-filters-stack',
@@ -422,10 +422,10 @@ function resetFilters() {
         pageTypes: ['list'],
         keywords: ['页头', '标题', '新建', 'header', 'title', 'create', 'actions'],
         imports: ['MPageHeader', 'MButton'],
-        template: `<MPageHeader title="用户管理" description="维护账号、角色与权限。">
-  <template #actions>
-    <MButton type="primary">新建用户</MButton>
-  </template>
+        template: `<MPageHeader title="用户管理" description="维护账号、角色与权限。">
+  <template #actions>
+    <MButton type="primary">新建用户</MButton>
+  </template>
 </MPageHeader>`,
         rules: ['页级标题用 MPageHeader，不要用 MPageToolbar 当第二页头', '主操作放 #actions'],
         rulesEn: ['Use MPageHeader for page identity; do not use MPageToolbar as a second page title', 'Put primary actions in #actions'],
@@ -441,12 +441,12 @@ function resetFilters() {
         pageTypes: ['list'],
         keywords: ['批量', '已选', 'toolbar', 'batch', 'export', 'delete'],
         imports: ['MPageToolbar', 'MButton'],
-        template: `<MPageToolbar>
-  <span style="color:var(--m-color-text-muted);font-size:var(--m-font-size-sm)">已选 0 项</span>
-  <template #actions>
-    <MButton type="text">导出</MButton>
-    <MButton danger type="text">删除</MButton>
-  </template>
+        template: `<MPageToolbar>
+  <span style="color:var(--m-color-text-muted);font-size:var(--m-font-size-sm)">已选 0 项</span>
+  <template #actions>
+    <MButton type="text">导出</MButton>
+    <MButton danger type="text">删除</MButton>
+  </template>
 </MPageToolbar>`,
         rules: ['左侧用 default 插槽展示已选数量', '批量操作用 type="text" / variant="outlined"，danger 仅 destructive', '放在 FilterChips 之后、表格之前'],
         rulesEn: ['Use the default slot for selection count', 'Batch actions use type="text" / variant="outlined"; danger only for destructive ops', 'Place after FilterChips and before the table'],
@@ -475,54 +475,54 @@ function resetFilters() {
             '对齐',
         ],
         imports: ['MTable', 'MEmpty', 'MButton', 'MStatus', 'MSpace'],
-        scriptSetup: `const columns = [
-  { key: 'name', label: '名称' },
-  { key: 'status', label: '状态', width: 110 },
-  { key: 'count', label: '数量', width: 96, align: 'end' as const },
-  { key: 'updatedAt', label: '更新时间', width: 160 },
-  { key: 'actions', label: '操作', width: 128 },
-]
-const rows = ref<Record<string, unknown>[]>([])
+        scriptSetup: `const columns = [
+  { key: 'name', label: '名称' },
+  { key: 'status', label: '状态', width: 110 },
+  { key: 'count', label: '数量', width: 96, align: 'end' as const },
+  { key: 'updatedAt', label: '更新时间', width: 160 },
+  { key: 'actions', label: '操作', width: 128 },
+]
+const rows = ref<Record<string, unknown>[]>([])
 const loading = ref(false)`,
-        template: `<!-- 全视口主列表再加 fill；嵌入/短页去掉 fill -->
-<MTable
-  :columns="columns"
-  :rows="rows"
-  :loading="loading"
-  fill
-  paginator
-  :rows-per-page="10"
-  striped
-  bordered
-  row-key="id"
-  aria-label="数据列表"
->
-  <template #cell-status="{ value }">
-    <MStatus
-      :label="value === 'active' || value === 'online' ? '启用' : '停用'"
-      :type="value === 'active' || value === 'online' ? 'success' : 'secondary'"
-    />
-  </template>
-  <template #cell-count="{ value }">
-    <span style="font-variant-numeric: tabular-nums">{{ value ?? '—' }}</span>
-  </template>
-  <template #cell-actions>
-    <MSpace>
-      <MButton size="small" type="text">编辑</MButton>
-      <MButton danger size="small" type="text">删除</MButton>
-    </MSpace>
-  </template>
-  <template #empty>
-    <MEmpty
-      title="还没有成员"
-      description="新建第一条后，这里会列出姓名、状态与更新时间。"
-      icon="inbox"
-    >
-      <template #extra>
-        <MButton type="primary">新建成员</MButton>
-      </template>
-    </MEmpty>
-  </template>
+        template: `<!-- 全视口主列表再加 fill；嵌入/短页去掉 fill -->
+<MTable
+  :columns="columns"
+  :rows="rows"
+  :loading="loading"
+  fill
+  paginator
+  :rows-per-page="10"
+  striped
+  bordered
+  row-key="id"
+  aria-label="数据列表"
+>
+  <template #cell-status="{ value }">
+    <MStatus
+      :label="value === 'active' || value === 'online' ? '启用' : '停用'"
+      :type="value === 'active' || value === 'online' ? 'success' : 'secondary'"
+    />
+  </template>
+  <template #cell-count="{ value }">
+    <span style="font-variant-numeric: tabular-nums">{{ value ?? '—' }}</span>
+  </template>
+  <template #cell-actions>
+    <MSpace>
+      <MButton size="small" type="text">编辑</MButton>
+      <MButton danger size="small" type="text">删除</MButton>
+    </MSpace>
+  </template>
+  <template #empty>
+    <MEmpty
+      title="还没有成员"
+      description="新建第一条后，这里会列出姓名、状态与更新时间。"
+      icon="inbox"
+    >
+      <template #extra>
+        <MButton type="primary">新建成员</MButton>
+      </template>
+    </MEmpty>
+  </template>
 </MTable>`,
         rules: [
             '先判断是否适合 fill：全视口后台主列表 + 表格是主任务 → MPageContent fill + MTable fill',
@@ -560,11 +560,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['行操作', '编辑', '删除', 'actions', 'row', 'cell'],
         imports: ['MSpace', 'MButton'],
-        template: `<template #cell-actions>
-  <MSpace>
-    <MButton size="small" type="text">编辑</MButton>
-    <MButton danger size="small" type="text">删除</MButton>
-  </MSpace>
+        template: `<template #cell-actions>
+  <MSpace>
+    <MButton size="small" type="text">编辑</MButton>
+    <MButton danger size="small" type="text">删除</MButton>
+  </MSpace>
 </template>`,
         rules: ['行内操作用 size="small" + type="text" / variant="outlined"，避免一排实心按钮', '危险操作使用 danger 并配合确认弹窗'],
         rulesEn: ['Use size="small" with type="text" / variant="outlined" row actions', 'Use danger with confirmation for destructive actions'],
@@ -580,11 +580,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['分类', '标签', '可关闭', 'chip', 'category', 'tag-only'],
         imports: ['MTag'],
-        template: `<template #cell-category="{ value }">
-  <MTag
-    :value="String(value ?? '')"
-    type="info"
-  />
+        template: `<template #cell-category="{ value }">
+  <MTag
+    :value="String(value ?? '')"
+    type="info"
+  />
 </template>`,
         rules: ['分类/强调态用 MTag；行内业务状态用 MStatus（list-status-dot）', '不要用 Button 颜色表达状态'],
         rulesEn: ['Use MTag for categories; use MStatus for business status (list-status-dot)', 'Do not use Button colors for status'],
@@ -600,11 +600,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['状态', 'status', 'dot', 'cell-status', '在线', '启用', '停用', '业务状态'],
         imports: ['MStatus'],
-        template: `<template #cell-status="{ value }">
-  <MStatus
-    :label="value === 'active' || value === 'online' ? '启用' : '停用'"
-    :type="value === 'active' || value === 'online' ? 'success' : 'secondary'"
-  />
+        template: `<template #cell-status="{ value }">
+  <MStatus
+    :label="value === 'active' || value === 'online' ? '启用' : '停用'"
+    :type="value === 'active' || value === 'online' ? 'success' : 'secondary'"
+  />
 </template>`,
         rules: ['行内轻量业务状态优先 MStatus', '不要用 Button 颜色表达状态'],
         rulesEn: ['Prefer MStatus for lightweight inline business status', 'Do not use Button colors for status'],
@@ -620,15 +620,15 @@ const loading = ref(false)`,
         pageTypes: ['list', 'common'],
         keywords: ['空状态', '无数据', 'empty', 'zero state', 'no data', 'illustration'],
         imports: ['MEmpty', 'MButton'],
-        template: `<MEmpty
-  title="还没有成员"
-  description="邀请或新建第一位成员后，这里会显示状态与最近活动。"
-  illustration="no-content"
->
-  <template #extra>
-    <MButton type="primary">新建成员</MButton>
-    <MButton type="text">导入名单</MButton>
-  </template>
+        template: `<MEmpty
+  title="还没有成员"
+  description="邀请或新建第一位成员后，这里会显示状态与最近活动。"
+  illustration="no-content"
+>
+  <template #extra>
+    <MButton type="primary">新建成员</MButton>
+    <MButton type="text">导入名单</MButton>
+  </template>
 </MEmpty>`,
         rules: [
             '正常无数据用 MEmpty，不要用错误色',
@@ -654,11 +654,11 @@ const loading = ref(false)`,
         pageTypes: ['common'],
         keywords: ['结果', '成功', '失败', '404', '403', 'result', 'success', 'error'],
         imports: ['MResult', 'MButton'],
-        template: `<MResult status="success" description="订单已创建，可在列表中查看详情。">
-  <template #extra>
-    <MButton label="查看订单" />
-    <MButton label="返回列表" type="text" />
-  </template>
+        template: `<MResult status="success" description="订单已创建，可在列表中查看详情。">
+  <template #extra>
+    <MButton label="查看订单" />
+    <MButton label="返回列表" type="text" />
+  </template>
 </MResult>`,
         rules: ['流程终点用 MResult', '提供明确下一步操作'],
         rulesEn: ['Use MResult for terminal outcomes', 'Provide clear next-step actions'],
@@ -689,32 +689,32 @@ const loading = ref(false)`,
         pageTypes: ['form'],
         keywords: ['表单', 'form', 'fields', 'formitem', 'label-width', 'errorMessage'],
         imports: ['MPageSection', 'MForm', 'MFormItem', 'MInput', 'MSelect'],
-        scriptSetup: `const model = reactive({ name: '', role: undefined as string | undefined })
-const submitting = ref(false)
-const roleOptions = [
-  { label: '管理员', value: 'admin' },
-  { label: '成员', value: 'member' },
+        scriptSetup: `const model = reactive({ name: '', role: undefined as string | undefined })
+const submitting = ref(false)
+const roleOptions = [
+  { label: '管理员', value: 'admin' },
+  { label: '成员', value: 'member' },
 ]`,
-        template: `<MPageSection variant="form">
-  <MForm
-    label-position="left"
-    label-width="6rem"
-    @submit.prevent="onSubmit"
-  >
-    <MFormItem label="姓名" name="name" required>
-      <MInput v-model="model.name" placeholder="与工牌一致的姓名" fluid />
-    </MFormItem>
-    <MFormItem label="角色" name="role" required>
-      <MSelect
-        v-model="model.role"
-        :options="roleOptions"
-        placeholder="选择角色"
-        clearable
-        fluid
-      />
-    </MFormItem>
-    <!-- 更多字段；常驻错误：error-message="请填写必填项" -->
-  </MForm>
+        template: `<MPageSection variant="form">
+  <MForm
+    label-position="left"
+    label-width="6rem"
+    @submit.prevent="onSubmit"
+  >
+    <MFormItem label="姓名" name="name" required>
+      <MInput v-model="model.name" placeholder="与工牌一致的姓名" fluid />
+    </MFormItem>
+    <MFormItem label="角色" name="role" required>
+      <MSelect
+        v-model="model.role"
+        :options="roleOptions"
+        placeholder="选择角色"
+        clearable
+        fluid
+      />
+    </MFormItem>
+    <!-- 更多字段；常驻错误：error-message="请填写必填项" -->
+  </MForm>
 </MPageSection>`,
         rules: [
             '字段用 MFormItem + fluid 控件',
@@ -740,11 +740,11 @@ const roleOptions = [
         pageTypes: ['form'],
         keywords: ['保存', '取消', 'submit', 'actions', 'footer'],
         imports: ['MPageSection', 'MSpace', 'MButton'],
-        template: `<MPageSection variant="actions">
-  <MSpace>
-    <MButton html-type="submit" type="primary" :loading="submitting">保存</MButton>
-    <MButton>取消</MButton>
-  </MSpace>
+        template: `<MPageSection variant="actions">
+  <MSpace>
+    <MButton html-type="submit" type="primary" :loading="submitting">保存</MButton>
+    <MButton>取消</MButton>
+  </MSpace>
 </MPageSection>`,
         rules: ['提交按钮在前，取消 secondary', '保存中传 loading 防重复提交'],
         rulesEn: ['Submit first, cancel secondary', 'Pass loading while saving to prevent duplicate submits'],
@@ -760,39 +760,39 @@ const roleOptions = [
         pageTypes: ['dashboard'],
         keywords: ['kpi', '指标', 'stat', 'grid', 'metrics', 'trend', 'compact'],
         imports: ['MGrid', 'MGridItem', 'MPageStat'],
-        scriptSetup: `const metrics = ref([
-  {
-    label: '在册成员',
-    value: '12,480',
-    trend: '+8.2%',
-    trendDirection: 'up' as const,
-    trendType: 'success' as const,
-    trendLabel: '较上月',
-    icon: 'users',
-  },
-  {
-    label: '今日活跃',
-    value: '1,926',
-    trend: '-3.1%',
-    trendDirection: 'down' as const,
-    trendType: 'warning' as const,
-    trendLabel: '较昨日',
-    icon: 'activity',
-  },
+        scriptSetup: `const metrics = ref([
+  {
+    label: '在册成员',
+    value: '12,480',
+    trend: '+8.2%',
+    trendDirection: 'up' as const,
+    trendType: 'success' as const,
+    trendLabel: '较上月',
+    icon: 'users',
+  },
+  {
+    label: '今日活跃',
+    value: '1,926',
+    trend: '-3.1%',
+    trendDirection: 'down' as const,
+    trendType: 'warning' as const,
+    trendLabel: '较昨日',
+    icon: 'activity',
+  },
 ])`,
-        template: `<MGrid :cols="4" :x-gap="16" :y-gap="16" responsive="screen">
-  <MGridItem v-for="metric in metrics" :key="metric.label" :span="1">
-    <MPageStat
-      :label="metric.label"
-      :value="metric.value"
-      :trend="metric.trend"
-      :trend-direction="metric.trendDirection"
-      :trend-type="metric.trendType"
-      :trend-label="metric.trendLabel"
-      :icon="metric.icon"
-    />
-  </MGridItem>
-</MGrid>
+        template: `<MGrid :cols="4" :x-gap="16" :y-gap="16" responsive="screen">
+  <MGridItem v-for="metric in metrics" :key="metric.label" :span="1">
+    <MPageStat
+      :label="metric.label"
+      :value="metric.value"
+      :trend="metric.trend"
+      :trend-direction="metric.trendDirection"
+      :trend-type="metric.trendType"
+      :trend-label="metric.trendLabel"
+      :icon="metric.icon"
+    />
+  </MGridItem>
+</MGrid>
 <!-- 高密条带示例：density="compact" layout="plain" orientation="inline" -->`,
         rules: [
             'KPI 用 MPageStat，不要每页自定义 stat CSS',
@@ -818,15 +818,15 @@ const roleOptions = [
         pageTypes: ['dashboard'],
         keywords: ['chart', '图表', 'placeholder', 'card', 'trend'],
         imports: ['MCard', 'MEmpty', 'MSkeleton'],
-        template: `<MCard title="趋势概览" shadow="always">
-  <MSkeleton v-if="loading" height="8rem" />
-  <MEmpty
-    v-else
-    aria-label="图表占位"
-    title="还没有趋势数据"
-    description="接入图表后将展示近 7 日活跃与转化。"
-    illustration="activity-low"
-  />
+        template: `<MCard title="趋势概览" shadow="always">
+  <MSkeleton v-if="loading" height="8rem" />
+  <MEmpty
+    v-else
+    aria-label="图表占位"
+    title="还没有趋势数据"
+    description="接入图表后将展示近 7 日活跃与转化。"
+    illustration="activity-low"
+  />
 </MCard>`,
         rules: ['图表区适合 MCard，因为需要 card 标题', '加载中用 MSkeleton', '占位空态用 illustration，避免裸 icon'],
         rulesEn: [
@@ -846,18 +846,18 @@ const roleOptions = [
         pageTypes: ['dashboard'],
         keywords: ['recent', '最近', 'table', 'card', 'list'],
         imports: ['MCard', 'MTable', 'MStatus'],
-        scriptSetup: `const recentColumns = [
-  { key: 'id', label: '工单号', width: 96 },
-  { key: 'title', label: '标题' },
-  { key: 'status', label: '状态', width: 110 },
-]
+        scriptSetup: `const recentColumns = [
+  { key: 'id', label: '工单号', width: 96 },
+  { key: 'title', label: '标题' },
+  { key: 'status', label: '状态', width: 110 },
+]
 const recentRows = ref<Record<string, unknown>[]>([])`,
-        template: `<MCard title="最近工单">
-  <MTable :columns="recentColumns" :rows="recentRows" size="small" :paginator="false" bordered row-key="id">
-    <template #cell-status="{ value }">
-      <MStatus :label="String(value ?? '')" default / type="text" />
-    </template>
-  </MTable>
+        template: `<MCard title="最近工单">
+  <MTable :columns="recentColumns" :rows="recentRows" size="small" :paginator="false" bordered row-key="id">
+    <template #cell-status="{ value }">
+      <MStatus :label="String(value ?? '')" default / type="text" />
+    </template>
+  </MTable>
 </MCard>`,
         rules: ['明细列表放 MCard 内合理', 'size="small" 适合卡片内表格', '行内业务状态用 MStatus'],
         rulesEn: ['Detail lists inside MCard are appropriate', 'Use size="small" for in-card tables', 'Use MStatus for row business status'],
@@ -873,10 +873,10 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['list', 'common'],
         keywords: ['page content', 'stack', 'layout content', '容器'],
         imports: ['MPageContent'],
-        template: `<MLayoutContent>
-  <MPageContent>
-    <!-- MPageFilters → MPageToolbar → MTable -->
-  </MPageContent>
+        template: `<MLayoutContent>
+  <MPageContent>
+    <!-- MPageFilters → MPageToolbar → MTable -->
+  </MPageContent>
 </MLayoutContent>`,
         rules: ['所有列表区块放在 MPageContent 内', '区块顺序：筛选 → 工具栏 → 表格'],
         rulesEn: ['Keep all list sections inside MPageContent', 'Order: filters → toolbar → table'],
@@ -892,10 +892,10 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['form', 'common'],
         keywords: ['narrow', 'form content', 'max-width'],
         imports: ['MPageContent'],
-        template: `<MLayoutContent>
-  <MPageContent width="narrow">
-    <!-- MPageHeader → MPageSection form → actions -->
-  </MPageContent>
+        template: `<MLayoutContent>
+  <MPageContent width="narrow">
+    <!-- MPageHeader → MPageSection form → actions -->
+  </MPageContent>
 </MLayoutContent>`,
         rules: ['表单页使用 width="narrow"', '不要手写 max-width CSS'],
         rulesEn: ['Use width="narrow" on form pages', 'Do not hand-write max-width CSS'],
@@ -911,14 +911,14 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['detail'],
         keywords: ['detail', '详情', 'edit', 'header'],
         imports: ['MPageHeader', 'MButton', 'MStatus', 'MSpace'],
-        template: `<MPageHeader title="林晓" description="查看账号摘要、属性与近期活动。">
-  <template #actions>
-    <MSpace>
-      <MStatus label="启用" type="success" />
-      <MButton type="primary">编辑</MButton>
-      <MButton danger type="text">删除</MButton>
-    </MSpace>
-  </template>
+        template: `<MPageHeader title="林晓" description="查看账号摘要、属性与近期活动。">
+  <template #actions>
+    <MSpace>
+      <MStatus label="启用" type="success" />
+      <MButton type="primary">编辑</MButton>
+      <MButton danger type="text">删除</MButton>
+    </MSpace>
+  </template>
 </MPageHeader>`,
         rules: ['状态用 MStatus 放在 actions 区', '编辑为 primary，删除用 danger text'],
         rulesEn: ['Use MStatus in the actions area', 'Edit is primary; delete uses danger text'],
@@ -934,15 +934,15 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['detail'],
         keywords: ['descriptions', '属性', '详情字段', 'detail props', 'dl'],
         imports: ['MDescriptions', 'MDescriptionsItem', 'MStatus'],
-        template: `<MDescriptions title="基本信息" bordered :column="2">
-  <MDescriptionsItem label="姓名">林晓</MDescriptionsItem>
-  <MDescriptionsItem label="邮箱">linxiao@example.com</MDescriptionsItem>
-  <MDescriptionsItem label="角色">成员</MDescriptionsItem>
-  <MDescriptionsItem label="部门">产品设计</MDescriptionsItem>
-  <MDescriptionsItem label="入职日期">2025-03-12</MDescriptionsItem>
-  <MDescriptionsItem label="状态">
-    <MStatus label="启用" type="success" />
-  </MDescriptionsItem>
+        template: `<MDescriptions title="基本信息" bordered :column="2">
+  <MDescriptionsItem label="姓名">林晓</MDescriptionsItem>
+  <MDescriptionsItem label="邮箱">linxiao@example.com</MDescriptionsItem>
+  <MDescriptionsItem label="角色">成员</MDescriptionsItem>
+  <MDescriptionsItem label="部门">产品设计</MDescriptionsItem>
+  <MDescriptionsItem label="入职日期">2025-03-12</MDescriptionsItem>
+  <MDescriptionsItem label="状态">
+    <MStatus label="启用" type="success" />
+  </MDescriptionsItem>
 </MDescriptions>`,
         rules: [
             '属性网格用 MDescriptions，不要手写 <dl> / 嵌套表格',
@@ -966,13 +966,13 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['list', 'form', 'dashboard', 'detail', 'common'],
         keywords: ['页头', '主按钮', '新建', 'header', 'primary', 'actions', 'page-header'],
         imports: ['MPageHeader', 'MButton', 'MSpace'],
-        template: `<MPageHeader title="用户管理" description="管理成员与角色。">
-  <template #actions>
-    <MSpace>
-      <MButton type="text">导入</MButton>
-      <MButton type="primary">新建用户</MButton>
-    </MSpace>
-  </template>
+        template: `<MPageHeader title="用户管理" description="管理成员与角色。">
+  <template #actions>
+    <MSpace>
+      <MButton type="text">导入</MButton>
+      <MButton type="primary">新建用户</MButton>
+    </MSpace>
+  </template>
 </MPageHeader>`,
         rules: ['视口内仅一个 filled primary', '次要动作用 secondary 或 text', '批量操作用 MPageToolbar，不要塞进页头'],
         rulesEn: ['Only one filled primary in the viewport', 'Lesser actions: secondary or text', 'Batch actions belong in MPageToolbar, not the header'],
@@ -996,62 +996,62 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
             'inline create',
         ],
         imports: ['MDialog', 'MForm', 'MFormItem', 'MInput', 'MSelect', 'MButton', 'MSpace', 'message'],
-        scriptSetup: `const dialogOpen = ref(false)
-const submitting = ref(false)
-const model = reactive({
-  name: '',
-  email: '',
-  role: undefined as string | undefined,
-})
-const roleOptions = [
-  { label: '管理员', value: 'admin' },
-  { label: '成员', value: 'member' },
-]
-
-function resetModel() {
-  model.name = ''
-  model.email = ''
-  model.role = undefined
-}
-
-async function onSave() {
-  submitting.value = true
-  try {
-    // await api.save(model)
-    message.success('已保存')
-    dialogOpen.value = false
-    resetModel()
-  } finally {
-    submitting.value = false
-  }
+        scriptSetup: `const dialogOpen = ref(false)
+const submitting = ref(false)
+const model = reactive({
+  name: '',
+  email: '',
+  role: undefined as string | undefined,
+})
+const roleOptions = [
+  { label: '管理员', value: 'admin' },
+  { label: '成员', value: 'member' },
+]
+
+function resetModel() {
+  model.name = ''
+  model.email = ''
+  model.role = undefined
+}
+
+async function onSave() {
+  submitting.value = true
+  try {
+    // await api.save(model)
+    message.success('已保存')
+    dialogOpen.value = false
+    resetModel()
+  } finally {
+    submitting.value = false
+  }
 }`,
-        template: `<MDialog
-  v-model="dialogOpen"
-  header="新建用户"
-  width="32rem"
-  @close="resetModel"
->
-  <MForm @submit.prevent="onSave">
-    <MFormItem label="姓名" name="name" required>
-      <MInput v-model="model.name" placeholder="请输入姓名" fluid />
-    </MFormItem>
-    <MFormItem label="邮箱" name="email" required>
-      <MInput v-model="model.email" type="email" placeholder="name@example.com" fluid />
-    </MFormItem>
-    <MFormItem label="角色" name="role" required>
-      <MSelect v-model="model.role" :options="roleOptions" placeholder="请选择角色" fluid />
-    </MFormItem>
-  </MForm>
-  <template #footer>
-    <MSpace style="justify-content: flex-end; width: 100%">
-      <MButton type="text" :disabled="submitting" @click="dialogOpen = false">
-        取消
-      </MButton>
-      <MButton type="primary" :loading="submitting" @click="onSave">
-        保存
-      </MButton>
-    </MSpace>
-  </template>
+        template: `<MDialog
+  v-model="dialogOpen"
+  header="新建用户"
+  width="32rem"
+  @close="resetModel"
+>
+  <MForm @submit.prevent="onSave">
+    <MFormItem label="姓名" name="name" required>
+      <MInput v-model="model.name" placeholder="请输入姓名" fluid />
+    </MFormItem>
+    <MFormItem label="邮箱" name="email" required>
+      <MInput v-model="model.email" type="email" placeholder="name@example.com" fluid />
+    </MFormItem>
+    <MFormItem label="角色" name="role" required>
+      <MSelect v-model="model.role" :options="roleOptions" placeholder="请选择角色" fluid />
+    </MFormItem>
+  </MForm>
+  <template #footer>
+    <MSpace style="justify-content: flex-end; width: 100%">
+      <MButton type="text" :disabled="submitting" @click="dialogOpen = false">
+        取消
+      </MButton>
+      <MButton type="primary" :loading="submitting" @click="onSave">
+        保存
+      </MButton>
+    </MSpace>
+  </template>
 </MDialog>`,
         rules: [
             '留在列表页，不另开路由',
@@ -1083,44 +1083,44 @@ async function onSave() {
         pageTypes: ['list', 'detail', 'common'],
         keywords: ['抽屉表单', '侧滑编辑', 'drawer form', 'form-in-drawer', 'side panel edit'],
         imports: ['MDrawer', 'MForm', 'MFormItem', 'MInput', 'MButton', 'MSpace', 'message'],
-        scriptSetup: `const drawerOpen = ref(false)
-const submitting = ref(false)
-const model = reactive({ name: '', note: '' })
-
-async function onSave() {
-  submitting.value = true
-  try {
-    message.success('已保存')
-    drawerOpen.value = false
-  } finally {
-    submitting.value = false
-  }
+        scriptSetup: `const drawerOpen = ref(false)
+const submitting = ref(false)
+const model = reactive({ name: '', note: '' })
+
+async function onSave() {
+  submitting.value = true
+  try {
+    message.success('已保存')
+    drawerOpen.value = false
+  } finally {
+    submitting.value = false
+  }
 }`,
-        template: `<MDrawer
-  v-model="drawerOpen"
-  header="编辑详情"
-  position="right"
-  size="28rem"
-  @close="/* reset draft */"
->
-  <MForm @submit.prevent="onSave">
-    <MFormItem label="名称" name="name" required>
-      <MInput v-model="model.name" fluid />
-    </MFormItem>
-    <MFormItem label="备注" name="note">
-      <MInput v-model="model.note" fluid />
-    </MFormItem>
-  </MForm>
-  <template #footer>
-    <MSpace style="justify-content: flex-end; width: 100%">
-      <MButton type="text" :disabled="submitting" @click="drawerOpen = false">
-        取消
-      </MButton>
-      <MButton type="primary" :loading="submitting" @click="onSave">
-        保存
-      </MButton>
-    </MSpace>
-  </template>
+        template: `<MDrawer
+  v-model="drawerOpen"
+  header="编辑详情"
+  position="right"
+  size="28rem"
+  @close="/* reset draft */"
+>
+  <MForm @submit.prevent="onSave">
+    <MFormItem label="名称" name="name" required>
+      <MInput v-model="model.name" fluid />
+    </MFormItem>
+    <MFormItem label="备注" name="note">
+      <MInput v-model="model.note" fluid />
+    </MFormItem>
+  </MForm>
+  <template #footer>
+    <MSpace style="justify-content: flex-end; width: 100%">
+      <MButton type="text" :disabled="submitting" @click="drawerOpen = false">
+        取消
+      </MButton>
+      <MButton type="primary" :loading="submitting" @click="onSave">
+        保存
+      </MButton>
+    </MSpace>
+  </template>
 </MDrawer>`,
         rules: ['position 常用 right；较长表单可加大 size', '字段 fluid；底栏放 #footer', '成功用 message.success'],
         rulesEn: ['position usually right; raise size for longer forms', 'Fields fluid; actions in #footer', 'Success via message.success'],
@@ -1136,28 +1136,28 @@ async function onSave() {
         pageTypes: ['list', 'detail', 'common'],
         keywords: ['删除', '确认', '二次确认', 'confirm', 'delete', 'ConfirmDialog', '危险'],
         imports: ['MConfirmDialog', 'message'],
-        scriptSetup: `const confirmOpen = ref(false)
-const pendingId = ref<string | null>(null)
-
-function askDelete(id: string) {
-  pendingId.value = id
-  confirmOpen.value = true
-}
-
-function onAcceptDelete() {
-  // await api.remove(pendingId.value)
-  message.success('已删除')
-  pendingId.value = null
-  confirmOpen.value = false
+        scriptSetup: `const confirmOpen = ref(false)
+const pendingId = ref<string | null>(null)
+
+function askDelete(id: string) {
+  pendingId.value = id
+  confirmOpen.value = true
+}
+
+function onAcceptDelete() {
+  // await api.remove(pendingId.value)
+  message.success('已删除')
+  pendingId.value = null
+  confirmOpen.value = false
 }`,
-        template: `<MConfirmDialog
-  v-model="confirmOpen"
-  header="确认删除"
-  message="删除后不可恢复，确定继续？"
-  accept-label="删除"
-  reject-label="取消"
-  accept-danger
-  @accept="onAcceptDelete"
+        template: `<MConfirmDialog
+  v-model="confirmOpen"
+  header="确认删除"
+  message="删除后不可恢复，确定继续？"
+  accept-label="删除"
+  reject-label="取消"
+  accept-danger
+  @accept="onAcceptDelete"
 />`,
         rules: ['用 MConfirmDialog，不要手写 Dialog 确定/取消', 'acceptColor="danger"', '成功用 message.success，不要 toast'],
         rulesEn: ['Use MConfirmDialog; do not hand-roll Dialog Yes/No', 'acceptColor="danger"', 'Success via message.success, not toast'],
@@ -1173,15 +1173,15 @@ function onAcceptDelete() {
         pageTypes: ['list', 'common'],
         keywords: ['更多', '行菜单', 'dropdown', 'row menu', 'overflow', 'actions menu'],
         imports: ['MDropdown', 'MButton'],
-        scriptSetup: `const rowMenu = [
-  { label: '编辑', command: () => {/* open edit */} },
-  { label: '复制', command: () => {/* duplicate */} },
-  { label: '删除', command: () => {/* askDelete */} },
+        scriptSetup: `const rowMenu = [
+  { label: '编辑', command: () => {/* open edit */} },
+  { label: '复制', command: () => {/* duplicate */} },
+  { label: '删除', command: () => {/* askDelete */} },
 ]`,
-        template: `<template #cell-actions>
-  <MDropdown :model="rowMenu">
-    <MButton size="small" type="text" icon="more-horizontal" aria-label="更多操作" />
-  </MDropdown>
+        template: `<template #cell-actions>
+  <MDropdown :model="rowMenu">
+    <MButton size="small" type="text" icon="more-horizontal" aria-label="更多操作" />
+  </MDropdown>
 </template>`,
         rules: ['操作很多时再用 Dropdown；2–3 个明确操作用 text 按钮', '危险项走 confirm-delete', '图标按钮必须 aria-label'],
         rulesEn: ['Use Dropdown when many actions; 2–3 explicit actions stay as text buttons', 'Danger → confirm-delete', 'Icon-only buttons need aria-label'],
@@ -1197,45 +1197,45 @@ function onAcceptDelete() {
         pageTypes: ['form', 'common'],
         keywords: ['向导', '分步', '步骤', 'wizard', 'stepper', 'multi-step'],
         imports: ['MStepper', 'MForm', 'MFormItem', 'MInput', 'MButton', 'MSpace', 'MPageSection', 'message'],
-        scriptSetup: `const activeStep = ref(0)
-const submitting = ref(false)
-const steps = [
-  { label: '基本信息', description: '名称与说明' },
-  { label: '确认', description: '核对后创建' },
-]
-const model = reactive({ name: '' })
-
-function back() {
-  if (activeStep.value > 0) activeStep.value -= 1
-}
-function next() {
-  if (activeStep.value < steps.length - 1) activeStep.value += 1
-}
-async function finish() {
-  submitting.value = true
-  try {
-    message.success('已创建')
-  } finally {
-    submitting.value = false
-  }
+        scriptSetup: `const activeStep = ref(0)
+const submitting = ref(false)
+const steps = [
+  { label: '基本信息', description: '名称与说明' },
+  { label: '确认', description: '核对后创建' },
+]
+const model = reactive({ name: '' })
+
+function back() {
+  if (activeStep.value > 0) activeStep.value -= 1
+}
+function next() {
+  if (activeStep.value < steps.length - 1) activeStep.value += 1
+}
+async function finish() {
+  submitting.value = true
+  try {
+    message.success('已创建')
+  } finally {
+    submitting.value = false
+  }
 }`,
-        template: `<MStepper v-model="activeStep" :steps="steps" linear />
-<MPageSection variant="form">
-  <MForm v-if="activeStep === 0" @submit.prevent="next">
-    <MFormItem label="名称" name="name" required>
-      <MInput v-model="model.name" fluid />
-    </MFormItem>
-  </MForm>
-  <div v-else>
-    <p>确认创建「{{ model.name }}」？</p>
-  </div>
-</MPageSection>
-<MPageSection variant="actions">
-  <MSpace>
-    <MButton type="text" :disabled="activeStep === 0" @click="back">上一步</MButton>
-    <MButton v-if="activeStep < steps.length - 1" type="primary" @click="next">下一步</MButton>
-    <MButton v-else type="primary" :loading="submitting" @click="finish">创建</MButton>
-  </MSpace>
+        template: `<MStepper v-model="activeStep" :steps="steps" linear />
+<MPageSection variant="form">
+  <MForm v-if="activeStep === 0" @submit.prevent="next">
+    <MFormItem label="名称" name="name" required>
+      <MInput v-model="model.name" fluid />
+    </MFormItem>
+  </MForm>
+  <div v-else>
+    <p>确认创建「{{ model.name }}」？</p>
+  </div>
+</MPageSection>
+<MPageSection variant="actions">
+  <MSpace>
+    <MButton type="text" :disabled="activeStep === 0" @click="back">上一步</MButton>
+    <MButton v-if="activeStep < steps.length - 1" type="primary" @click="next">下一步</MButton>
+    <MButton v-else type="primary" :loading="submitting" @click="finish">创建</MButton>
+  </MSpace>
 </MPageSection>`,
         rules: ['用 :steps（不是 :items）', '每步一个主任务；进入下一步前校验当前步', '完成文案与「下一步」区分'],
         rulesEn: ['Use :steps (not :items)', 'One job per step; validate before advancing', 'Finish label differs from Next'],
@@ -1251,51 +1251,51 @@ async function finish() {
         pageTypes: ['common'],
         keywords: ['登录', '认证', '分栏', 'login', 'auth', 'split', 'brand', 'filled', 'themeConfig'],
         imports: ['MForm', 'MFormItem', 'MInput', 'MInputPassword', 'MButton', 'MSpace', 'MConfigProvider', 'zhCN'],
-        scriptSetup: `const submitting = ref(false)
-const formError = ref('')
-const model = reactive({ email: '', password: '' })
-const themeConfig = { seed: { colorPrimary: '#0b6e4f' } }
-
-async function onSubmit() {
-  formError.value = ''
-  submitting.value = true
-  try {
-    if (!model.email || !model.password) {
-      formError.value = '请输入邮箱和密码后再试。'
-    }
-  } finally {
-    submitting.value = false
-  }
+        scriptSetup: `const submitting = ref(false)
+const formError = ref('')
+const model = reactive({ email: '', password: '' })
+const themeConfig = { seed: { colorPrimary: '#0b6e4f' } }
+
+async function onSubmit() {
+  formError.value = ''
+  submitting.value = true
+  try {
+    if (!model.email || !model.password) {
+      formError.value = '请输入邮箱和密码后再试。'
+    }
+  } finally {
+    submitting.value = false
+  }
 }`,
-        template: `<MConfigProvider :locale="zhCN" input-variant="filled" :theme-config="themeConfig">
-  <div class="login-shell">
-    <aside class="login-brand" aria-label="品牌">
-      <p class="login-brand__mark">产品名</p>
-      <h1 class="login-brand__title">一句品牌主张</h1>
-      <p class="login-brand__lead">一句支持说明。</p>
-    </aside>
-    <main class="login-main">
-      <div class="login-panel">
-        <header class="login-panel__header">
-          <h2>登录</h2>
-          <p>使用工作邮箱进入。</p>
-        </header>
-        <p v-if="formError" class="login-alert" role="alert">{{ formError }}</p>
-        <MForm @submit="onSubmit">
-          <MFormItem label="邮箱" name="email" required>
-            <MInput v-model="model.email" type="email" autocomplete="username" fluid />
-          </MFormItem>
-          <MFormItem label="密码" name="password" required>
-            <MInputPassword v-model="model.password" autocomplete="current-password" fluid />
-          </MFormItem>
-          <MSpace style="margin-top: var(--m-space-2)" alignment="center">
-            <MButton html-type="submit" label="登录" type="primary" :loading="submitting" />
-            <MButton html-type="button" label="忘记密码" type="text" />
-          </MSpace>
-        </MForm>
-      </div>
-    </main>
-  </div>
+        template: `<MConfigProvider :locale="zhCN" input-variant="filled" :theme-config="themeConfig">
+  <div class="login-shell">
+    <aside class="login-brand" aria-label="品牌">
+      <p class="login-brand__mark">产品名</p>
+      <h1 class="login-brand__title">一句品牌主张</h1>
+      <p class="login-brand__lead">一句支持说明。</p>
+    </aside>
+    <main class="login-main">
+      <div class="login-panel">
+        <header class="login-panel__header">
+          <h2>登录</h2>
+          <p>使用工作邮箱进入。</p>
+        </header>
+        <p v-if="formError" class="login-alert" role="alert">{{ formError }}</p>
+        <MForm @submit="onSubmit">
+          <MFormItem label="邮箱" name="email" required>
+            <MInput v-model="model.email" type="email" autocomplete="username" fluid />
+          </MFormItem>
+          <MFormItem label="密码" name="password" required>
+            <MInputPassword v-model="model.password" autocomplete="current-password" fluid />
+          </MFormItem>
+          <MSpace style="margin-top: var(--m-space-2)" alignment="center">
+            <MButton html-type="submit" label="登录" type="primary" :loading="submitting" />
+            <MButton html-type="button" label="忘记密码" type="text" />
+          </MSpace>
+        </MForm>
+      </div>
+    </main>
+  </div>
 </MConfigProvider>`,
         rules: [
             '认证表单默认 input-variant="filled"；品牌色走 themeConfig.seed，不要页级 hex',
@@ -1339,29 +1339,29 @@ async function onSubmit() {
             'MConfigProvider',
             'zhCN',
         ],
-        template: `<MConfigProvider :locale="zhCN">
-  <MLayout fill-viewport has-sider>
-    <MLayoutSider v-model:collapsed="siderCollapsed" bordered :collapsed-width="72">
-      <MMenu
-        :model="[
-          { key: 'users', label: '用户管理', icon: 'user', to: '/users' },
-          { key: 'roles', label: '角色管理', icon: 'shield', to: '/roles' },
-        ]"
-        :collapsed="siderCollapsed"
-        :collapsed-width="72"
-      />
-    </MLayoutSider>
-    <MLayout>
-      <MLayoutHeader :padding="'var(--m-space-4) var(--m-space-6)'">
-        <MBreadcrumb :model="[{ label: '首页', to: '/' }, { label: '当前页' }]" />
-      </MLayoutHeader>
-      <MLayoutContent>
-        <MPageContent>
-          <!-- page sections -->
-        </MPageContent>
-      </MLayoutContent>
-    </MLayout>
-  </MLayout>
+        template: `<MConfigProvider :locale="zhCN">
+  <MLayout fill-viewport has-sider>
+    <MLayoutSider v-model:collapsed="siderCollapsed" bordered :collapsed-width="72">
+      <MMenu
+        :model="[
+          { key: 'users', label: '用户管理', icon: 'user', to: '/users' },
+          { key: 'roles', label: '角色管理', icon: 'shield', to: '/roles' },
+        ]"
+        :collapsed="siderCollapsed"
+        :collapsed-width="72"
+      />
+    </MLayoutSider>
+    <MLayout>
+      <MLayoutHeader :padding="'var(--m-space-4) var(--m-space-6)'">
+        <MBreadcrumb :model="[{ label: '首页', to: '/' }, { label: '当前页' }]" />
+      </MLayoutHeader>
+      <MLayoutContent>
+        <MPageContent>
+          <!-- page sections -->
+        </MPageContent>
+      </MLayoutContent>
+    </MLayout>
+  </MLayout>
 </MConfigProvider>`,
         rules: [
             '根布局用 fillViewport',
@@ -1394,19 +1394,19 @@ async function onSubmit() {
             'log',
         ],
         imports: ['MScrollbar', 'MCard'],
-        template: `<MCard title="活动日志">
-  <MScrollbar max-height="16rem">
-    <ul style="margin:0;padding:0;list-style:none">
-      <li v-for="item in logLines" :key="item.id" style="padding:var(--m-space-2) 0;border-bottom:1px solid var(--m-color-border)">
-        {{ item.text }}
-      </li>
-    </ul>
-  </MScrollbar>
+        template: `<MCard title="活动日志">
+  <MScrollbar max-height="16rem">
+    <ul style="margin:0;padding:0;list-style:none">
+      <li v-for="item in logLines" :key="item.id" style="padding:var(--m-space-2) 0;border-bottom:1px solid var(--m-color-border)">
+        {{ item.text }}
+      </li>
+    </ul>
+  </MScrollbar>
 </MCard>`,
-        scriptSetup: `const logLines = [
-  { id: '1', text: '用户 admin 登录成功' },
-  { id: '2', text: '导出任务已完成' },
-  { id: '3', text: '配置已保存' },
+        scriptSetup: `const logLines = [
+  { id: '1', text: '用户 admin 登录成功' },
+  { id: '2', text: '导出任务已完成' },
+  { id: '3', text: '配置已保存' },
 ]`,
         rules: [
             '整页主滚动推荐 MLayout fillViewport',