模态窗 (Modal)
<h1>模态窗 (Modal)</h1>
<p>基本使用</p>
<pre><code class="language-php">use Dcat\Admin\Widgets\Modal;
$modal = Modal::make()
-&gt;lg()
-&gt;title('标题')
-&gt;body(view(...))
-&gt;button('&lt;button class=&quot;btn btn-primary&quot;&gt;点击打开弹窗&lt;/button&gt;');
return view(..., ['modal' =&gt; $modal]); </code></pre>
<h2>功能</h2>
<h3>标题 (title)</h3>
<p>设置弹窗标题</p>
<pre><code class="language-php">$modal-&gt;title('标题');</code></pre>
<h3>内容 (body)</h3>
<p>设置弹窗内容，此方法接受一个参数，允许传入<code>string</code>、<code>Cloure</code>、<code>Illuminate\Contracts\Support\Renderable</code>以及<code>Dcat\Admin\Contracts\LazyRenderable</code>类型值</p>
<pre><code class="language-php">// 传入字符串
$modal-&gt;body('字符串');
// 传入闭包，注意闭包必须返回字符串类型值或空值
$modal-&gt;body(function () {
return view(...)-&gt;render();
});
// 传入 Renderable
use Dcat\Admin\Widgets\
$modal-&gt;body(view(...));
$modal-&gt;body(Card::make());
// 传入 LazyRenderable
$modal-&gt;body(PostTable::make());</code></pre>
<h3>底部内容 (footer)</h3>
<p>设置弹窗底部内容，此方法接受一个参数，允许传入<code>string</code>、<code>Cloure</code>、<code>Illuminate\Contracts\Support\Renderable</code>以及<code>Dcat\Admin\Contracts\LazyRenderable</code>类型值，用法同上</p>
<pre><code class="language-php">$modal-&gt;footer('字符串');
$modal-&gt;footer(view(...));</code></pre>
<h3>尺寸</h3>
<p>默认 <code>500px</code></p>
<pre><code class="language-php">// 800px
$modal-&gt;lg();
// 1140px
$modal-&gt;xl();</code></pre>
<h3>按钮 (button)</h3>
<p>设置按钮</p>
<h3>事件监听</h3>
<p>支持事件</p>
<ul>
<li><code>onShow</code> 弹窗显示事件</li>
<li><code>onShown</code> 弹窗已显示事件</li>
<li><code>onHide</code> 弹窗隐藏事件</li>
<li><code>onHidden</code> 弹窗已隐藏事件</li>
</ul>
<p>用法示例</p>
<pre><code class="language-php">use Dcat\Admin\Admin;
$modal-&gt;onShow(
&lt;&lt;&lt;JS
console.log('显示弹窗', target, $(this));
JS
);
$modal-&gt;onHide(
&lt;&lt;&lt;JS
console.log('隐藏弹窗', target, $(this));
JS
);</code></pre>
<h3>垂直居中 (centered)</h3>
<p>设置弹窗垂直居中</p>
<pre><code class="language-php">$modal = Modal::make()
-&gt;xl()
-&gt;centered() // 设置弹窗垂直居中
-&gt;title(...)
-&gt;body(...);</code></pre>
<h3>内容可滚动 (scrollable)</h3>
<p>设置弹窗内容可滚动</p>
<pre><code class="language-php">$modal = Modal::make()
-&gt;xl()
-&gt;scrollable() // 设置弹窗内容可滚动
-&gt;title(...)
-&gt;body(...);</code></pre>
<p><a name="form"></a></p>
<h2>表单弹窗</h2>
<p>参考文档 <a href="widgets-form.md#modal">工具表单 - 弹窗</a></p>