yijia-webman/app/view/layout.html

95 lines
3.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layout 管理界面大布局示例 - Layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="/layui/css/layui.css" rel="stylesheet">
<script src="/js/jquery-3.7.1.min.js"></script>
<script src="/layui/layui.js"></script>
<script src="/js/work.js"></script>
</head>
<body>
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo layui-hide-xs layui-bg-black">layout demo</div>
<!-- 头部区域可配合layui 已有的水平导航) -->
</div>
<div class="layui-side layui-bg-black">
<div class="layui-side-scroll">
<!-- 左侧导航区域可配合layui已有的垂直导航 -->
<ul class="layui-nav layui-nav-tree" lay-filter="test">
<li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;">个人生活</a>
<dl class="layui-nav-child">
<dd><a href="/book/">书籍</a></dd>
<dd><a href="/category/">分类</a></dd>
<dd><a href="/book/reading">书单</a></dd>
<dd><a href="javascript:;">the links</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">工作相关</a>
<dl class="layui-nav-child">
<dd><a href="/customer/">客户跟进</a></dd>
<dd><a href="/salary/">工资计算</a></dd>
<dd><a href="/task/">项目任务</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">有机壹家</a>
<dl class="layui-nav-child">
<dd><a href="/goods/">商品</a></dd>
<dd><a href="/goods/receipt/">进货日志</a></dd>
<dd><a href="/goods/sale/">销售日志</a></dd>
<dd><a href="/sales/index/">销量统计</a></dd>
<dd><a href="/sales/goods/">商品销售统计</a></dd>
</dl>
</li>
</ul>
</div>
</div>
<div class="layui-body">
<!-- 内容主体区域 -->
{__CONTENT__}
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
底部固定区域
</div>
</div>
<script>
//JS
layui.use(['element', 'layer', 'util'], function(){
var element = layui.element;
var layer = layui.layer;
var util = layui.util;
var $ = layui.$;
//头部事件
util.event('lay-header-event', {
menuLeft: function(othis){ // 左侧菜单事件
layer.msg('展开左侧菜单的操作', {icon: 0});
},
menuRight: function(){ // 右侧菜单事件
layer.open({
type: 1,
title: '更多',
content: '<div style="padding: 15px;">处理右侧面板的操作</div>',
area: ['260px', '100%'],
offset: 'rt', // 右上角
anim: 'slideLeft', // 从右侧抽屉滑出
shadeClose: true,
scrollbar: false
});
}
});
});
</script>
</body>
</html>