🎨 YysEditorEmbed 组件示例

示例 1：编辑模式

完整的编辑功能，包括工具栏、组件库和属性面板。

<YysEditorEmbed
  mode="edit"
  :data="flowData"
  :height="600"
  @save="handleSave"
/>

示例 2：预览模式

只读展示，不显示编辑工具。点击可切换到编辑模式。

<YysEditorEmbed
  mode="preview"
  :data="flowData"
  :height="400"
/>

示例 3：自定义配置

隐藏部分 UI 元素，自定义编辑器配置。

<YysEditorEmbed
  mode="edit"
  :show-toolbar="false"
  :show-component-panel="false"
  :height="500"
/>

示例 4：Wiki 块插件模式

模拟在 Wiki 中作为块插件使用的场景。

<!-- 预览模式 -->
<div v-if="!isEditing" @click="startEdit">
  <YysEditorEmbed mode="preview" :data="flowData" />
</div>

<!-- 编辑模式（弹窗） -->
<el-dialog v-model="isEditing" fullscreen>
  <YysEditorEmbed mode="edit" @save="handleSave" />
</el-dialog>