YwxAppThink/app/backend/view/navbar/index.html

<div class="layui-fluid">
  <div class="layui-card">
    <div class="layui-card-header">主导航菜单管理（前台官网顶部导航，支持两级下拉）</div>
    <div class="layui-card-header">
      <div class="layui-form layui-card-header-boxed" lay-filter="search-form">
        <div class="layui-form-item">
          <div class="layui-inline">
            <input type="text" name="title" placeholder="请输入菜单名称" autocomplete="off" class="layui-input">
          </div>
          <div class="layui-inline">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="data-search-btn">
              <i class="layui-icon layui-icon-search"></i>
            </button>
            <button type="button" class="layui-btn layui-btn-primary" id="btn-reset">
              <i class="layui-icon layui-icon-refresh"></i>
            </button>
          </div>
        </div>
      </div>
    </div>
    <div class="layui-card-body">
      <table class="layui-hide" id="dataTable" lay-filter="dataTable"></table>
    </div>
  </div>
</div>

<!-- 顶部工具条 -->
<script type="text/html" id="tableBar">
<div class="layui-btn-group">
    <a class="layui-btn layui-btn-sm layui-btn-primary" title="新建菜单" lay-event="dataCreate" data-perm="nav:add"> <i class="layui-icon layui-icon-add-1"></i> 新建 </a>
    <a class="layui-btn layui-btn-sm layui-btn-primary" title="批量删除" lay-event="dataDelete" data-perm="nav:delete"> <i class="layui-icon layui-icon-delete"></i> 批量删除 </a>
</div>
</script>

<!-- 操作列模板 -->
<script type="text/html" id="dataBar">
<a class="layui-btn layui-btn-xs" lay-event="update" data-perm="nav:edit">编辑</a>
{{# if(d.pid == 0) { }}
<a class="layui-btn layui-btn-xs" lay-event="create" data-perm="nav:add">加子项</a>
{{# } }}
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete" data-perm="nav:delete">删除</a>
</script>

<!-- 状态开关模板 -->
<script type="text/html" id="statusTpl">
<input type="checkbox" name="status" value="{{d.id}}" lay-skin="switch" lay-text="显示|隐藏" lay-filter="statusSwitch" {{ d.status == 1 ? 'checked' : '' }}>
</script>

<!-- 添加/编辑表单（抽屉） -->
<script type="text/html" id="dataFormTpl">
<form class="layui-form" style="padding: 20px 20px 0;">
<input type="hidden" name="id" value="{{d.id||''}}">
<div class="layui-form-item">
  <label class="layui-form-label">所属上级</label>
  <div class="layui-input-block">
    <select name="parent_id">
      <option value="0">顶级菜单</option>
      {{# layui.each(d.parents || [], function(idx, p){ }}
      <option value="{{p.id}}" {{ d.parent_id == p.id ? 'selected' : '' }}>{{p.title}}</option>
      {{# }); }}
    </select>
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">菜单名称</label>
  <div class="layui-input-block">
    <input type="text" name="title" required lay-verify="required" placeholder="如：首页 / 产品 / 案例" autocomplete="off" class="layui-input" value="{{d.title||''}}">
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">链接</label>
  <div class="layui-input-block">
    <input type="text" name="url" placeholder="controller/action 或 外链 http(s)://" autocomplete="off" class="layui-input" value="{{d.url||''}}">
    <div class="layui-form-mid layui-word-aux">留空表示仅作为含有子项的父菜单（下拉）。</div>
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">所属应用</label>
  <div class="layui-input-block">
    <select name="app" lay-filter="appSel">
      <option value="">当前应用（frontend 前台）</option>
      {{# layui.each(d.plugins || [], function(idx, pname){ }}
      <option value="{{pname}}" {{ d.app==pname ? 'selected' : '' }}>{{pname}}（插件）</option>
      {{# }); }}
      <option value="member" {{ d.app=='member' ? 'selected' : '' }}>member（会员中心）</option>
      <option value="backend" {{ d.app=='backend' ? 'selected' : '' }}>backend（后台）</option>
    </select>
    <div class="layui-form-mid layui-word-aux">选插件则跨应用生成域名链接（如 haonav/index/index）；留空=当前应用。</div>
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">图标</label>
  <div class="layui-input-block">
    <input type="text" name="icon" placeholder="layui-icon 类名（可选）" autocomplete="off" class="layui-input" value="{{d.icon||''}}">
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">排序</label>
  <div class="layui-input-block">
    <input type="number" name="sort" placeholder="数字越小越靠前" autocomplete="off" class="layui-input" value="{{d.sort||0}}">
  </div>
</div>
<div class="layui-form-item">
  <label class="layui-form-label">状态</label>
  <div class="layui-input-block">
    <input type="radio" name="status" value="1" title="显示" {{ d.status==undefined || d.status==1 ? 'checked' : '' }}>
    <input type="radio" name="status" value="0" title="隐藏" {{ d.status==0 ? 'checked' : '' }}>
  </div>
</div>
</form>
</script>

<script type="text/javascript">
  window.navPlugins = {:json_encode($plugins)};
  layui.use('navbar', function () { });
</script>