feat(nav): 新增前台公开导航页与后台导航管理
新增模块
- Nav 模型（applications/models/admin_nav.py）：公开导航表，与 admin_power 解耦
- NavOutSchema / NavManageSchema（applications/schemas/admin_nav.py）
- 前台公开视图 applications/view/public/nav.py：/site/、/site/category/<name>、/site/api/navs，无需登录
- 后台管理视图 applications/view/system/nav.py：CRUD + 启用/禁用，挂入 system_bp
- 前台模板 templates/public/{base,index,category}.html（独立配色，无需登录即可访问）
- 后台模板 templates/system/nav/{main,add,edit}.html（Layui table + form）
调整
- applications/view/__init__.py：注册前台蓝图到根
- applications/view/system/__init__.py：注册后台 nav 子蓝图
- applications/common/script/admin.py：admin init/export 支持 navs 数组
- applications/common/script/app_data/init.json：新增 10 条导航种子 + 4 条 system:nav 权限
数据库
- 新增 public_nav 表（含 category 索引）
- migration: 38751d88d42c_add_public_nav_table.py
This commit is contained in:
bwstudio
@@ -0,0 +1,101 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>新增导航</title>
|
||||
{% include 'system/common/header.html' %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="layui-form" lay-filter="nav-form" style="padding: 20px 30px 0 0;">
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">分类</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="category" required lay-verify="required" placeholder="如：开发工具 / AI / 设计资源"
|
||||
autocomplete="off" class="layui-input">
|
||||
</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">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">链接 URL</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="url" required lay-verify="required|url"
|
||||
placeholder="https://example.com" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">简介</label>
|
||||
<div class="layui-input-block">
|
||||
<textarea name="description" placeholder="选填，鼠标悬停时显示" class="layui-textarea"></textarea>
|
||||
</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-website / layui-icon-ai / 等"
|
||||
autocomplete="off" class="layui-input" value="layui-icon-link">
|
||||
<div class="layui-form-mid layui-word-aux">参考：<a href="https://layui.dev/web/doc/element/icon.html" target="_blank">layui 图标库</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">排序</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="number" name="sort" value="0" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">类型</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="isExternal" value="1" title="外链（新窗口）" checked>
|
||||
<input type="radio" name="isExternal" value="0" title="站内（当前窗口）">
|
||||
</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="启用" checked>
|
||||
<input type="radio" name="status" value="0" title="禁用">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<button class="layui-btn" lay-submit lay-filter="nav-submit">保存</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include 'system/common/footer.html' %}
|
||||
<script>
|
||||
layui.use(['form', 'layer'], function(){
|
||||
var form = layui.form;
|
||||
var layer = layui.layer;
|
||||
var $ = layui.$;
|
||||
|
||||
form.on('submit(nav-submit)', function(data){
|
||||
$.ajax({
|
||||
url: '/system/nav/save',
|
||||
type: 'POST',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify(data.field),
|
||||
success: function(res){
|
||||
if (res.success) {
|
||||
layer.msg(res.msg, {icon: 1});
|
||||
parent.layui.table.reload('nav-table');
|
||||
setTimeout(function(){ parent.layer.closeAll(); }, 800);
|
||||
} else {
|
||||
layer.msg(res.msg, {icon: 2});
|
||||
}
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,100 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>编辑导航</title>
|
||||
{% include 'system/common/header.html' %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="layui-form" lay-filter="nav-form" style="padding: 20px 30px 0 0;">
|
||||
<input type="hidden" name="id" value="{{ nav.id }}">
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">分类</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="category" required lay-verify="required" value="{{ nav.category }}"
|
||||
autocomplete="off" class="layui-input">
|
||||
</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" value="{{ nav.title }}"
|
||||
autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">链接 URL</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="url" required lay-verify="required|url" value="{{ nav.url }}"
|
||||
autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">简介</label>
|
||||
<div class="layui-input-block">
|
||||
<textarea name="description" class="layui-textarea">{{ nav.description or '' }}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">图标</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="icon" value="{{ nav.icon }}" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">排序</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="number" name="sort" value="{{ nav.sort }}" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">类型</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="isExternal" value="1" title="外链（新窗口）" {% if nav.is_external == 1 %}checked{% endif %}>
|
||||
<input type="radio" name="isExternal" value="0" title="站内（当前窗口）" {% if nav.is_external != 1 %}checked{% endif %}>
|
||||
</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="启用" {% if nav.status == 1 %}checked{% endif %}>
|
||||
<input type="radio" name="status" value="0" title="禁用" {% if nav.status != 1 %}checked{% endif %}>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<button class="layui-btn" lay-submit lay-filter="nav-submit">保存</button>
|
||||
<button type="button" class="layui-btn layui-btn-primary" onclick="parent.layer.closeAll();">取消</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include 'system/common/footer.html' %}
|
||||
<script>
|
||||
layui.use(['form', 'layer'], function(){
|
||||
var form = layui.form;
|
||||
var layer = layui.layer;
|
||||
var $ = layui.$;
|
||||
|
||||
form.on('submit(nav-submit)', function(data){
|
||||
$.ajax({
|
||||
url: '/system/nav/update',
|
||||
type: 'PUT',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify(data.field),
|
||||
success: function(res){
|
||||
if (res.success) {
|
||||
layer.msg(res.msg, {icon: 1});
|
||||
parent.layui.table.reload('nav-table');
|
||||
setTimeout(function(){ parent.layer.closeAll(); }, 800);
|
||||
} else {
|
||||
layer.msg(res.msg, {icon: 2});
|
||||
}
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,177 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>导航管理</title>
|
||||
{% include 'system/common/header.html' %}
|
||||
</head>
|
||||
<body class="layui-layout-body pear-admin">
|
||||
<div class="layui-layout layui-layout-admin">
|
||||
{% include 'system/common/head.html' %}
|
||||
{% include 'system/common/side.html' %}
|
||||
<div class="layui-body">
|
||||
<div class="layui-card">
|
||||
<div class="layui-card-header">
|
||||
<span class="layui-icon layui-icon-link"></span> 导航管理
|
||||
<button class="layui-btn layui-btn-sm layui-btn-normal" style="float:right;margin-top:-6px;"
|
||||
lay-event="add" id="btn-add">
|
||||
<i class="layui-icon layui-icon-add-1"></i> 新增导航
|
||||
</button>
|
||||
</div>
|
||||
<div class="layui-card-body">
|
||||
<form class="layui-form" lay-filter="search-form">
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">关键词</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" name="keyword" placeholder="标题/链接/简介" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">分类</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" name="category" placeholder="按分类过滤" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<button type="button" class="layui-btn" lay-submit lay-filter="search">搜索</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<table id="nav-table" lay-filter="nav-table"></table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'system/common/footer.html' %}
|
||||
</div>
|
||||
|
||||
{% raw %}
|
||||
<script type="text/html" id="col-status">
|
||||
{{# if(d.status === 1){ }}
|
||||
<span class="layui-badge layui-bg-green">启用</span>
|
||||
{{# } else { }}
|
||||
<span class="layui-badge layui-bg-gray">禁用</span>
|
||||
{{# } }}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="col-external">
|
||||
{{# if(d.is_external === 1){ }}
|
||||
<span class="layui-badge layui-bg-blue">外链</span>
|
||||
{{# } else { }}
|
||||
<span class="layui-badge">站内</span>
|
||||
{{# } }}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="col-op">
|
||||
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
|
||||
{{# if(d.status === 1){ }}
|
||||
<a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="disable">禁用</a>
|
||||
{{# } else { }}
|
||||
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="enable">启用</a>
|
||||
{{# } }}
|
||||
<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="remove">删除</a>
|
||||
</script>
|
||||
{% endraw %}
|
||||
|
||||
<script>
|
||||
layui.use(['table', 'form', 'layer'], function(){
|
||||
var table = layui.table;
|
||||
var form = layui.form;
|
||||
var layer = layui.layer;
|
||||
var $ = layui.$;
|
||||
|
||||
var renderTable = function(){
|
||||
var keyword = $('input[name="keyword"]').val();
|
||||
var category = $('input[name="category"]').val();
|
||||
table.render({
|
||||
elem: '#nav-table',
|
||||
url: '/system/nav/data',
|
||||
where: { keyword: keyword, category: category },
|
||||
page: true,
|
||||
limit: 20,
|
||||
cols: [[
|
||||
{field: 'id', title: 'ID', width: 60},
|
||||
{field: 'category', title: '分类', width: 120},
|
||||
{field: 'title', title: '标题', width: 180},
|
||||
{field: 'url', title: '链接', minWidth: 200},
|
||||
{field: 'icon', title: '图标', width: 100},
|
||||
{field: 'sort', title: '排序', width: 70},
|
||||
{field: 'is_external', title: '类型', width: 80, templet: '#col-external'},
|
||||
{field: 'status', title: '状态', width: 80, templet: '#col-status'},
|
||||
{field: 'create_at', title: '创建时间', width: 170},
|
||||
{fixed: 'right', title: '操作', toolbar: '#col-op', width: 220}
|
||||
]],
|
||||
response: {
|
||||
statusCode: 200
|
||||
},
|
||||
parseData: function(res){
|
||||
return {
|
||||
code: res.success ? 0 : 1,
|
||||
msg: res.msg,
|
||||
count: res.count || 0,
|
||||
data: res.data || []
|
||||
};
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
renderTable();
|
||||
|
||||
form.on('submit(search)', function(data){
|
||||
renderTable();
|
||||
return false;
|
||||
});
|
||||
|
||||
$('#btn-add').on('click', function(){
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '新增导航',
|
||||
area: ['640px', '600px'],
|
||||
content: '/system/nav/add'
|
||||
});
|
||||
});
|
||||
|
||||
table.on('tool(nav-table)', function(obj){
|
||||
var data = obj.data;
|
||||
if (obj.event === 'edit'){
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '编辑导航',
|
||||
area: ['640px', '600px'],
|
||||
content: '/system/nav/edit?navId=' + data.id
|
||||
});
|
||||
} else if (obj.event === 'remove'){
|
||||
layer.confirm('确定删除该导航吗？', function(idx){
|
||||
$.ajax({
|
||||
url: '/system/nav/remove/' + data.id,
|
||||
type: 'DELETE',
|
||||
success: function(res){
|
||||
if (res.success) { layer.msg(res.msg); obj.del(); }
|
||||
else layer.msg(res.msg);
|
||||
}
|
||||
});
|
||||
layer.close(idx);
|
||||
});
|
||||
} else if (obj.event === 'enable'){
|
||||
$.ajax({
|
||||
url: '/system/nav/enable',
|
||||
type: 'PUT',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify({navId: data.id}),
|
||||
success: function(res){ layer.msg(res.msg); renderTable(); }
|
||||
});
|
||||
} else if (obj.event === 'disable'){
|
||||
$.ajax({
|
||||
url: '/system/nav/disable',
|
||||
type: 'PUT',
|
||||
contentType: 'application/json',
|
||||
data: JSON.stringify({navId: data.id}),
|
||||
success: function(res){ layer.msg(res.msg); renderTable(); }
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user