<?php
/** @var string $module */
/** @var array $layout */
$module  = $module ?? 'page';
$initial = json_encode($layout ?: [], JSON_UNESCAPED_UNICODE);
$isProduct = $module === 'product';
?>
<div class="pb-workspace">
  <!-- 最左：窄图标栏（仅图标） -->
  <aside class="pb-rail" title="工具栏">
    <button type="button" class="pb-rail-btn" data-act="material" title="素材库">🖼️</button>
    <button type="button" class="pb-rail-btn" data-act="text" title="添加文字">T</button>
    <button type="button" class="pb-rail-btn" data-act="image" title="添加图片">🏞️</button>
    <button type="button" class="pb-rail-btn" data-act="button" title="添加按钮">🔗</button>
    <?php if ($isProduct): ?>
    <button type="button" class="pb-rail-btn" data-act="buy" title="购买按钮">🛒</button>
    <button type="button" class="pb-rail-btn" data-act="price" title="价格">¥</button>
    <button type="button" class="pb-rail-btn" data-act="specs" title="规格参数">▤</button>
    <?php endif; ?>
  </aside>

  <!-- 中间：可编辑画布 -->
  <main class="pb-canvas-wrap">
    <div class="pb-stage" id="pbStage"></div>
  </main>

  <!-- 右栏：标签页 预览 / 属性 / 素材 -->
  <aside class="pb-side">
    <div class="pb-tabs">
      <button type="button" class="pb-tab active" data-tab="preview">预览</button>
      <button type="button" class="pb-tab" data-tab="props">属性</button>
      <button type="button" class="pb-tab" data-tab="material">素材</button>
    </div>
    <div class="pb-panes">
      <div class="pb-pane" id="panePreview">
        <div class="pb-preview" id="pbPreviewWrap"><div class="pb-stage pb-front" id="pbPreview"></div></div>
        <p class="pb-hint" style="padding:8px 12px;margin:0">实时模拟（只读）。在画布选中元素即跳到「属性」。</p>
      </div>
      <div class="pb-pane hidden" id="paneProps">
        <div id="pbPropsBody" class="pb-empty">在画布中选择一个元素以编辑属性</div>
      </div>
      <div class="pb-pane hidden" id="paneMaterial">
        <label class="pb-upload">＋ 上传图片
          <input type="file" id="pbFile" accept="image/*" hidden>
        </label>
        <div class="pb-lib" id="pbLib"></div>
        <p class="pb-hint">点击图片加入画布；悬停图片点 × 可删除素材。</p>
      </div>
    </div>
  </aside>
</div>
<script>
window.__PB_INIT__   = <?php echo $initial; ?>;
window.__PB_MODULE__ = '<?php echo $module; ?>';
window.__PB_MEDIA__  = '<?php echo site_url('admin/media'); ?>';
window.__PB_UPLOAD__ = '<?php echo site_url('admin/media/upload'); ?>';
window.__PB_DELETE__ = '<?php echo site_url('admin/media/delete/'); ?>';
window.__PB_CSRF__   = '<?php echo csrf_token(); ?>';
</script>
<script src="<?php echo asset('js/page-builder.js'); ?>"></script>
