create-weapp-vite 2.3.15 → 2.3.16

package/templates/wevu-tdesign/src/pages/form/index.vue

@@ -1,271 +0,0 @@
-<script setup lang="ts">
-import type { UploadFile } from 'tdesign-miniprogram/upload/type'
-
-import { computed, reactive, ref, watch } from 'wevu'
-
-import FormRow from '@/components/FormRow/index.vue'
-import FormStep from '@/components/FormStep/index.vue'
-import ResultCard from '@/components/ResultCard/index.vue'
-import SectionTitle from '@/components/SectionTitle/index.vue'
-import { useFormBinder } from '@/hooks/useFormBinder'
-import { useToast } from '@/hooks/useToast'
-import { resolveBooleanChangeValue } from '@/utils/changeEvent'
-
-definePageJson({
-  navigationBarTitleText: '表单',
-  backgroundColor: '#f6f7fb',
-})
-
-const { changeModel } = useFormBinder()
-const { showToast } = useToast()
-
-const steps = [
-  { key: 'basic', title: '基础信息', subtitle: '业务基本配置' },
-  { key: 'strategy', title: '执行策略', subtitle: '预算与节奏' },
-  { key: 'confirm', title: '确认提交', subtitle: '核对并提交' },
-]
-
-const currentStep = ref(0)
-const submitted = ref(false)
-
-const formState = reactive({
-  name: '',
-  owner: '',
-  category: 'growth',
-  urgent: false,
-  budget: 30,
-  pace: 'balanced',
-  description: '',
-  attachments: [] as UploadFile[],
-})
-
-const categories = [
-  { value: 'growth', label: '增长' },
-  { value: 'retention', label: '留存' },
-  { value: 'brand', label: '品牌' },
-]
-
-const paceOptions = [
-  { value: 'fast', label: '快速推进' },
-  { value: 'balanced', label: '平衡' },
-  { value: 'steady', label: '稳健' },
-]
-
-const riskLevel = computed(() => {
-  if (formState.urgent && formState.budget > 60) {
-    return '高风险'
-  }
-  if (formState.budget > 40) {
-    return '中风险'
-  }
-  return '可控'
-})
-
-const canGoNext = computed(() => {
-  if (currentStep.value === 0) {
-    return !!formState.name && !!formState.owner
-  }
-  if (currentStep.value === 1) {
-    return !!formState.description
-  }
-  return true
-})
-
-const summaryRows = computed(() => [
-  { label: '项目名称', value: formState.name || '--' },
-  { label: '负责人', value: formState.owner || '--' },
-  { label: '类型', value: categories.find(item => item.value === formState.category)?.label ?? '--' },
-  { label: '预算', value: `${formState.budget} 万` },
-  { label: '节奏', value: paceOptions.find(item => item.value === formState.pace)?.label ?? '--' },
-  { label: '风险级别', value: riskLevel.value },
-])
-
-watch(
-  () => formState.urgent,
-  (value) => {
-    if (value) {
-      formState.pace = 'fast'
-    }
-  },
-)
-
-const nameModel = changeModel<string>('formState.name')
-const ownerModel = changeModel<string>('formState.owner')
-const categoryModel = changeModel<string>('formState.category')
-const budgetModel = changeModel<number>('formState.budget')
-const paceModel = changeModel<string>('formState.pace')
-const descriptionModel = changeModel<string>('formState.description')
-const attachmentsModel = changeModel<UploadFile[], 'files'>('formState.attachments', {
-  valueProp: 'files',
-  parser: event => event?.detail?.files ?? [],
-})
-
-function setUrgent(value: boolean) {
-  formState.urgent = value
-}
-
-function toggleUrgent() {
-  setUrgent(!formState.urgent)
-}
-
-function handleUrgentChange(event: unknown) {
-  setUrgent(resolveBooleanChangeValue(event, !formState.urgent))
-}
-
-function stopUrgentTap() {
-}
-
-function goNext() {
-  if (!canGoNext.value) {
-    showToast('请先完善当前步骤信息', 'warning')
-    return
-  }
-  if (currentStep.value < steps.length - 1) {
-    currentStep.value += 1
-  }
-}
-
-function goPrev() {
-  if (currentStep.value > 0) {
-    currentStep.value -= 1
-  }
-}
-
-function submit() {
-  submitted.value = true
-  showToast('提交成功')
-}
-</script>
-
-<template>
-  <view class="min-h-screen bg-[#f6f7fb] px-[28rpx] pb-[88rpx] pt-[24rpx] text-[#1c1c3c]">
-    <view class="rounded-[28rpx] bg-linear-to-br from-[#fff7ed] via-[#ffffff] to-[#fef3c7] p-[20rpx]">
-      <SectionTitle title="项目提报" subtitle="示例多步表单与联动校验" />
-      <view class="mt-[12rpx]">
-        <t-steps :current="currentStep" layout="horizontal">
-          <t-step-item v-for="item in steps" :key="item.key" :title="item.title" />
-        </t-steps>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx] space-y-[14rpx]">
-      <FormStep
-        v-if="currentStep === 0"
-        :step="1"
-        title="基础信息"
-        subtitle="填写核心字段"
-        :active="currentStep === 0"
-      >
-        <view class="flex flex-col gap-[14rpx]">
-          <FormRow label="项目名称">
-            <t-input
-              placeholder="例如：新客增长计划"
-              :value="nameModel.value"
-              @change="nameModel.onChange"
-            />
-          </FormRow>
-          <FormRow label="负责人">
-            <t-input
-              placeholder="例如：王凯"
-              :value="ownerModel.value"
-              @change="ownerModel.onChange"
-            />
-          </FormRow>
-          <FormRow label="类型">
-            <t-radio-group :value="categoryModel.value" @change="categoryModel.onChange">
-              <t-radio v-for="item in categories" :key="item.value" :value="item.value" :label="item.label" />
-            </t-radio-group>
-          </FormRow>
-          <view
-            class="urgent-row-toggle flex items-center justify-between rounded-[18rpx] bg-[#f8fafc] px-[18rpx] py-[16rpx]"
-            @tap="toggleUrgent"
-          >
-            <view>
-              <text class="text-[22rpx] font-semibold text-[#1f1a3f]">
-                加急
-              </text>
-              <text class="mt-[4rpx] block text-[20rpx] text-[#8a8aa5]">
-                整行可点击切换，开启后默认切到快速推进
-              </text>
-            </view>
-            <t-switch :value="formState.urgent" @tap.stop="stopUrgentTap" @change="handleUrgentChange" />
-          </view>
-        </view>
-      </FormStep>
-
-      <FormStep
-        v-if="currentStep === 1"
-        :step="2"
-        title="执行策略"
-        subtitle="预算与节奏"
-        :active="currentStep === 1"
-      >
-        <view class="flex flex-col gap-[14rpx]">
-          <FormRow label="预算规模" description="10-100 万">
-            <view class="flex items-center gap-[12rpx]">
-              <t-slider
-                :value="budgetModel.value"
-                :min="10"
-                :max="100"
-                @change="budgetModel.onChange"
-              />
-              <text class="text-[22rpx] text-[#5c5b7a]">
-                {{ formState.budget }} 万
-              </text>
-            </view>
-          </FormRow>
-          <FormRow label="推进节奏">
-            <t-radio-group :value="paceModel.value" @change="paceModel.onChange">
-              <t-radio v-for="item in paceOptions" :key="item.value" :value="item.value" :label="item.label" />
-            </t-radio-group>
-          </FormRow>
-          <FormRow label="补充说明">
-            <t-textarea
-              placeholder="描述目标与资源安排"
-              :value="descriptionModel.value"
-              :maxlength="140"
-              @change="descriptionModel.onChange"
-            />
-          </FormRow>
-          <FormRow label="附件">
-            <t-upload
-              :files="attachmentsModel.files"
-              :max="3"
-              @change="attachmentsModel.onChange"
-            />
-          </FormRow>
-        </view>
-      </FormStep>
-
-      <FormStep
-        v-if="currentStep === 2"
-        :step="3"
-        title="确认提交"
-        subtitle="预览关键信息"
-        :active="currentStep === 2"
-      >
-        <ResultCard title="提交摘要" :items="summaryRows">
-          <template #action>
-            <t-tag size="small" theme="primary" variant="light">
-              {{ riskLevel }}
-            </t-tag>
-          </template>
-        </ResultCard>
-      </FormStep>
-    </view>
-
-    <view class="mt-[18rpx] flex gap-[12rpx]">
-      <t-button block variant="outline" theme="default" :disabled="currentStep === 0" @tap="goPrev">
-        上一步
-      </t-button>
-      <t-button
-        block
-        theme="primary"
-        :disabled="currentStep === steps.length - 1 && submitted"
-        @tap="currentStep === steps.length - 1 ? submit() : goNext()"
-      >
-        {{ currentStep === steps.length - 1 ? (submitted ? '已提交' : '提交') : '下一步' }}
-      </t-button>
-    </view>
-  </view>
-</template>

package/templates/wevu-tdesign/src/pages/layout-feedback/components/FeedbackCallerCard.vue

@@ -1,79 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'wevu'
-import { useDialog } from '@/hooks/useDialog'
-import { useToast } from '@/hooks/useToast'
-
-const props = defineProps<{
-  onReport?: (payload: string) => void
-}>()
-
-const actionSeed = ref(0)
-const { showToast } = useToast({ duration: 1400 })
-const { alert, confirm } = useDialog()
-
-function nextLabel(prefix: string) {
-  actionSeed.value += 1
-  return `${prefix} #${actionSeed.value}`
-}
-
-function triggerChildToast() {
-  const label = nextLabel('子组件 Toast')
-  showToast(`${label} 已通过 layout 宿主触发`)
-  props.onReport?.(`${label} 已触发`)
-}
-
-function triggerChildAlert() {
-  const label = nextLabel('子组件 Alert')
-  void alert({
-    title: label,
-    content: '当前弹窗由子组件直接调用 useDialog()，但实际宿主仍在 layout 内。',
-    confirmBtn: '知道了',
-  }).then(() => {
-    props.onReport?.(`${label} 已确认`)
-  })
-}
-
-function triggerChildConfirm() {
-  const label = nextLabel('子组件 Confirm')
-  void confirm({
-    title: label,
-    content: '点击确认后会回传一条日志，证明子组件与页面都能经由同一 layout 宿主通信。',
-    confirmBtn: '确认',
-    cancelBtn: '取消',
-  }).then(() => {
-    props.onReport?.(`${label} 点击确认`)
-  }).catch(() => {
-    props.onReport?.(`${label} 点击取消`)
-  })
-}
-</script>
-
-<template>
-  <view class="rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-    <view class="flex items-center justify-between">
-      <view>
-        <text class="text-[28rpx] font-semibold text-[#1f1a3f]">
-          子组件直连 layout 宿主
-        </text>
-        <text class="mt-[6rpx] block text-[22rpx] leading-[1.7] text-[#6f6b8a]">
-          这个组件不接收 toast/dialog 实例，也不手动 selectComponent，只直接调用 useToast() / useDialog()。
-        </text>
-      </view>
-      <t-tag size="small" theme="primary" variant="light">
-        Child
-      </t-tag>
-    </view>
-
-    <view class="mt-[18rpx] flex flex-col gap-[12rpx]">
-      <t-button block theme="primary" variant="outline" @tap="triggerChildToast">
-        子组件触发 Toast
-      </t-button>
-      <t-button block theme="primary" variant="outline" @tap="triggerChildAlert">
-        子组件触发 Alert
-      </t-button>
-      <t-button block theme="danger" variant="outline" @tap="triggerChildConfirm">
-        子组件触发 Confirm
-      </t-button>
-    </view>
-  </view>
-</template>

package/templates/wevu-tdesign/src/pages/layout-feedback/index.vue

@@ -1,211 +0,0 @@
-<script setup lang="ts">
-import { computed, getCurrentInstance, ref, resolveLayoutHost } from 'wevu'
-import SectionTitle from '@/components/SectionTitle/index.vue'
-import { useDialog } from '@/hooks/useDialog'
-import { LAYOUT_DIALOG_BRIDGE_KEY, LAYOUT_TOAST_BRIDGE_KEY } from '@/hooks/useLayoutFeedbackBridge'
-import { useToast } from '@/hooks/useToast'
-import FeedbackCallerCard from './components/FeedbackCallerCard.vue'
-
-definePageJson({
-  navigationBarTitleText: 'Layout 通信演示',
-  backgroundColor: '#f6f7fb',
-})
-
-const pageInstance = getCurrentInstance<any>()
-const { showToast } = useToast({ duration: 1400 })
-const { alert, confirm } = useDialog()
-const actionSeed = ref(0)
-const actionLogs = ref<string[]>([
-  '页面与子组件都会直接调用 useToast() / useDialog()，由 layout 统一承载宿主。',
-])
-
-const bridgeStatus = computed(() => {
-  const toastHost = resolveLayoutHost(LAYOUT_TOAST_BRIDGE_KEY, { context: pageInstance })
-  const dialogHost = resolveLayoutHost(LAYOUT_DIALOG_BRIDGE_KEY, { context: pageInstance })
-
-  return [
-    {
-      key: 'toast',
-      title: 'Toast Host',
-      description: toastHost ? '已解析到 layout 内的 t-toast 实例。' : '尚未解析到 toast 宿主。',
-      ready: Boolean(toastHost),
-    },
-    {
-      key: 'dialog',
-      title: 'Dialog Host',
-      description: dialogHost ? '已解析到 layout 内的 t-dialog 实例。' : '尚未解析到 dialog 宿主。',
-      ready: Boolean(dialogHost),
-    },
-  ]
-})
-
-function pushLog(message: string) {
-  actionLogs.value = [`${new Date().toLocaleTimeString()} ${message}`, ...actionLogs.value].slice(0, 8)
-}
-
-function onChildReport(message: string) {
-  pushLog(message)
-}
-
-function nextLabel(prefix: string) {
-  actionSeed.value += 1
-  return `${prefix} #${actionSeed.value}`
-}
-
-function triggerPageToast() {
-  const label = nextLabel('页面 Toast')
-  showToast(`${label} 已通过 layout 宿主触发`)
-  pushLog(`${label} 已触发`)
-}
-
-function triggerPageAlert() {
-  const label = nextLabel('页面 Alert')
-  void alert({
-    title: label,
-    content: '这是页面直接调用 useDialog() 后，由 layout 内 t-dialog 承载的弹窗。',
-    confirmBtn: '知道了',
-  }).then(() => {
-    pushLog(`${label} 已确认`)
-  })
-}
-
-function triggerPageConfirm() {
-  const label = nextLabel('页面 Confirm')
-  void confirm({
-    title: label,
-    content: '确认后会写入日志，方便观察页面与 layout 宿主之间的通信。',
-    confirmBtn: '确认',
-    cancelBtn: '取消',
-  }).then(() => {
-    pushLog(`${label} 点击确认`)
-  }).catch(() => {
-    pushLog(`${label} 点击取消`)
-  })
-}
-
-function inspectDialogHostE2E() {
-  const dialogHost = resolveLayoutHost<any>(LAYOUT_DIALOG_BRIDGE_KEY, { context: pageInstance })
-  return {
-    hasHost: Boolean(dialogHost),
-    visible: dialogHost?.data?.visible ?? dialogHost?.properties?.visible ?? null,
-    hasOnConfirm: typeof dialogHost?._onConfirm === 'function',
-    hasOnCancel: typeof dialogHost?._onCancel === 'function',
-    hasNativeConfirm: typeof dialogHost?.onConfirm === 'function',
-    hasNativeCancel: typeof dialogHost?.onCancel === 'function',
-    title: dialogHost?.data?.title ?? dialogHost?.properties?.title ?? '',
-    confirmBtn: dialogHost?.data?._confirm?.content ?? dialogHost?.properties?.confirmBtn ?? '',
-    cancelBtn: dialogHost?.data?._cancel?.content ?? dialogHost?.properties?.cancelBtn ?? '',
-  }
-}
-
-async function runPageAlertCloseE2E() {
-  triggerPageAlert()
-  await new Promise(resolve => setTimeout(resolve, 120))
-  return inspectDialogHostE2E()
-}
-
-async function runPageConfirmOpenE2E() {
-  triggerPageConfirm()
-  await new Promise(resolve => setTimeout(resolve, 120))
-  return inspectDialogHostE2E()
-}
-
-function getLayoutFeedbackLogsE2E() {
-  return actionLogs.value.slice()
-}
-
-async function runDialogHostConfirmE2E() {
-  const dialogHost = resolveLayoutHost<any>(LAYOUT_DIALOG_BRIDGE_KEY, { context: pageInstance })
-  dialogHost?.onConfirm?.()
-  await new Promise(resolve => setTimeout(resolve, 60))
-  return inspectDialogHostE2E()
-}
-
-async function runDialogHostCancelE2E() {
-  const dialogHost = resolveLayoutHost<any>(LAYOUT_DIALOG_BRIDGE_KEY, { context: pageInstance })
-  dialogHost?.onCancel?.()
-  await new Promise(resolve => setTimeout(resolve, 60))
-  return inspectDialogHostE2E()
-}
-
-void inspectDialogHostE2E
-void runPageAlertCloseE2E
-void runPageConfirmOpenE2E
-void getLayoutFeedbackLogsE2E
-void runDialogHostConfirmE2E
-void runDialogHostCancelE2E
-</script>
-
-<template>
-  <view class="min-h-screen bg-[#f6f7fb] px-[28rpx] pb-[88rpx] pt-[24rpx] text-[#1c1c3c]">
-    <view class="rounded-[28rpx] bg-linear-to-br from-[#eef2ff] via-[#ffffff] to-[#ede9fe] p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.06)]">
-      <SectionTitle title="Layout 反馈宿主通信" subtitle="页面与子组件都直接调用 hooks，由 layout 持有 toast / dialog 组件实例" />
-      <text class="mt-[12rpx] block text-[22rpx] leading-[1.7] text-[#5b5b7b]">
-        推荐用法是业务侧只关心 useToast() / useDialog()，layout 负责注册宿主；页面和组件都不需要关心 id、selector，也不需要直接拿 layout 实例。
-      </text>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="Bridge 状态" subtitle="当前页面是否成功解析到 layout 宿主" />
-      <view class="mt-[16rpx] flex flex-col gap-[12rpx]">
-        <view
-          v-for="item in bridgeStatus"
-          :key="item.key"
-          class="rounded-[18rpx] bg-[#f7f7fb] p-[16rpx]"
-        >
-          <view class="flex items-center justify-between">
-            <text class="text-[24rpx] font-semibold text-[#1f1a3f]">
-              {{ item.title }}
-            </text>
-            <t-tag :theme="item.ready ? 'success' : 'warning'" size="small" variant="light">
-              {{ item.ready ? 'Ready' : 'Pending' }}
-            </t-tag>
-          </view>
-          <text class="mt-[8rpx] block text-[20rpx] leading-[1.7] text-[#6f6b8a]">
-            {{ item.description }}
-          </text>
-        </view>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="页面直接调用" subtitle="页面本身直接触发 layout 内的 toast / dialog 方法" />
-      <view class="mt-[16rpx] flex flex-col gap-[12rpx]">
-        <view id="layout-feedback-page-toast-trigger">
-          <t-button block theme="primary" @tap="triggerPageToast">
-            页面触发 Toast
-          </t-button>
-        </view>
-        <view id="layout-feedback-page-alert-trigger">
-          <t-button block theme="primary" variant="outline" @tap="triggerPageAlert">
-            页面触发 Alert
-          </t-button>
-        </view>
-        <view id="layout-feedback-page-confirm-trigger">
-          <t-button block theme="danger" variant="outline" @tap="triggerPageConfirm">
-            页面触发 Confirm
-          </t-button>
-        </view>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx]">
-      <FeedbackCallerCard :on-report="onChildReport" />
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="通信日志" subtitle="观察页面与子组件调用 layout 宿主后的反馈结果" />
-      <view class="mt-[16rpx] flex flex-col gap-[10rpx]">
-        <view
-          v-for="(item, index) in actionLogs"
-          :key="`${item}-${index}`"
-          class="rounded-[16rpx] bg-[#f7f7fb] px-[16rpx] py-[14rpx]"
-        >
-          <text class="block text-[20rpx] leading-[1.7] text-[#4c4b6c]">
-            {{ item }}
-          </text>
-        </view>
-      </view>
-    </view>
-  </view>
-</template>

package/templates/wevu-tdesign/src/pages/layout-store/index.vue

@@ -1,127 +0,0 @@
-<script setup lang="ts">
-import { onUnload, setPageLayout, storeToRefs, watch } from 'wevu'
-import SectionTitle from '@/components/SectionTitle/index.vue'
-import { useLayoutInteractionDemoStore } from '@/stores/layoutInteractionDemo'
-
-definePageJson({
-  navigationBarTitleText: 'Store 调用 Layout',
-  backgroundColor: '#f6f7fb',
-})
-
-const store = useLayoutInteractionDemoStore()
-const { activeLayout, adminLayoutProps, commandStatus, lastResult, logs } = storeToRefs(store)
-
-watch([activeLayout, adminLayoutProps], ([layout, props]) => {
-  if (layout === 'admin') {
-    setPageLayout('admin', props)
-    return
-  }
-  setPageLayout('default')
-}, { immediate: true })
-
-function useDefaultLayout() {
-  store.setLayout('default')
-}
-
-function useAdminLayout() {
-  store.setLayout('admin')
-}
-
-function openToastByStore() {
-  store.triggerToast()
-}
-
-function openAlertByStore() {
-  store.triggerAlert()
-}
-
-function openConfirmByStore() {
-  store.triggerConfirm()
-}
-
-function clearLogs() {
-  store.resetLogs()
-}
-
-onUnload(() => {
-  setPageLayout('default')
-})
-</script>
-
-<template>
-  <view class="min-h-screen bg-[#f6f7fb] px-[28rpx] pb-[88rpx] pt-[24rpx] text-[#1c1c3c]">
-    <view class="rounded-[28rpx] bg-linear-to-br from-[#e8f1ff] via-[#ffffff] to-[#eef2ff] p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.06)]">
-      <SectionTitle title="Store 驱动 Layout 交互" subtitle="wevu/store 发起意图，页面上下文消费后命中 layout 内的 toast / dialog 宿主" />
-      <text class="mt-[12rpx] block text-[22rpx] leading-[1.7] text-[#5b5b7b]">
-        推荐边界是 store 只保存布局状态和交互意图，真正调用 useToast() / useDialog() / setPageLayout() 仍由页面执行，这样不会把 page runtime hook 直接塞进 store。
-      </text>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="当前状态" subtitle="观察 store 对布局和宿主交互的描述" />
-      <view class="mt-[16rpx] flex flex-col gap-[12rpx]">
-        <view class="rounded-[18rpx] bg-[#f7f7fb] p-[16rpx]">
-          <text class="text-[24rpx] font-semibold text-[#1f1a3f]">
-            当前布局：{{ activeLayout }}
-          </text>
-          <text class="mt-[8rpx] block text-[20rpx] leading-[1.7] text-[#6f6b8a]">
-            command 状态：{{ commandStatus }}
-          </text>
-        </view>
-        <view class="rounded-[18rpx] bg-[#f7f7fb] p-[16rpx]">
-          <text class="text-[24rpx] font-semibold text-[#1f1a3f]">
-            最近结果
-          </text>
-          <text class="mt-[8rpx] block text-[20rpx] leading-[1.7] text-[#6f6b8a]">
-            {{ lastResult }}
-          </text>
-        </view>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="切换 Layout" subtitle="store 修改布局状态，页面 watch 后调用 setPageLayout()" />
-      <view class="mt-[16rpx] flex flex-col gap-[12rpx]">
-        <t-button block theme="primary" @tap="useDefaultLayout">
-          Store 切到 default 布局
-        </t-button>
-        <t-button block theme="primary" variant="outline" @tap="useAdminLayout">
-          Store 切到 admin 布局
-        </t-button>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="触发 Layout 宿主" subtitle="store 直接调用 toast / dialog，命中当前 layout 内的反馈宿主" />
-      <view class="mt-[16rpx] flex flex-col gap-[12rpx]">
-        <t-button block theme="primary" @tap="openToastByStore">
-          Store 触发 Toast
-        </t-button>
-        <t-button block theme="primary" variant="outline" @tap="openAlertByStore">
-          Store 触发 Alert
-        </t-button>
-        <t-button block theme="danger" variant="outline" @tap="openConfirmByStore">
-          Store 触发 Confirm
-        </t-button>
-      </view>
-    </view>
-
-    <view class="mt-[18rpx] rounded-[24rpx] bg-white p-[20rpx] shadow-[0_18rpx_40rpx_rgba(17,24,39,0.08)]">
-      <SectionTitle title="通信日志" subtitle="记录 store 发出的布局切换与交互命令" />
-      <t-button class="mt-[16rpx]" size="small" theme="default" variant="outline" @tap="clearLogs">
-        清空日志
-      </t-button>
-      <view class="mt-[16rpx] flex flex-col gap-[10rpx]">
-        <view
-          v-for="(item, index) in logs"
-          :key="`${item}-${index}`"
-          class="rounded-[16rpx] bg-[#f7f7fb] px-[16rpx] py-[14rpx]"
-        >
-          <text class="block text-[20rpx] leading-[1.7] text-[#4c4b6c]">
-            {{ item }}
-          </text>
-        </view>
-      </view>
-    </view>
-  </view>
-</template>