Files
layui-admin/single/res/views/index.html

388 lines
16 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8">
<div class="layui-row layui-col-space15">
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">快捷方式</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-shortcut">
<div carousel-item>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs3">
<a lay-href="home/homepage1">
<i class="layui-icon layui-icon-console"></i>
<cite>主页一</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="home/homepage2">
<i class="layui-icon layui-icon-chart"></i>
<cite>主页二</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="component/layer/list">
<i class="layui-icon layui-icon-template-1"></i>
<cite>弹层</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="/senior/im/">
<i class="layui-icon layui-icon-chat"></i>
<cite>聊天</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="component/progress/index">
<i class="layui-icon layui-icon-find-fill"></i>
<cite>进度条</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="app/workorder/list">
<i class="layui-icon layui-icon-survey"></i>
<cite>工单</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="user/user/list">
<i class="layui-icon layui-icon-user"></i>
<cite>用户</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/system/website">
<i class="layui-icon layui-icon-set"></i>
<cite>设置</cite>
</a>
</li>
</ul>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">待办事项</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-backlog">
<div carousel-item>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs6">
<a lay-href="app/content/comment" class="layadmin-backlog-body">
<h3>待审评论</h3>
<p><cite>66</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a lay-href="app/forum/list" class="layadmin-backlog-body">
<h3>待审帖子</h3>
<p><cite>12</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a lay-href="template/goodslist" class="layadmin-backlog-body">
<h3>待审商品</h3>
<p><cite>99</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a href="javascript:;" onclick="layer.tips('不跳转', this, {tips: 3});" class="layadmin-backlog-body">
<h3>待发货</h3>
<p><cite>20</cite></p>
</a>
</li>
</ul>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs6">
<a href="javascript:;" class="layadmin-backlog-body">
<h3>待审友情链接</h3>
<p><cite style="color: #FF5722;">5</cite></p>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">数据概览</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-dataview">
<div carousel-item id="LAY-index-dataview">
<div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
<!--<div></div>-->
<div></div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">访客地区分布</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space15">
<div class="layui-col-sm4">
<table class="layui-table layuiadmin-page-table" lay-skin="line">
<thead>
<tr>
<th>排名</th>
<th>地区</th>
<th>人数</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>浙江</td>
<td>62310</td>
</tr>
<tr>
<td>2</td>
<td>上海</td>
<td>59190</td>
</tr>
<tr>
<td>3</td>
<td>广东</td>
<td>55891</td>
</tr>
<tr>
<td>4</td>
<td>北京</td>
<td>51919</td>
</tr>
<tr>
<td>5</td>
<td>山东</td>
<td>39231</td>
</tr>
<tr>
<td>6</td>
<td>湖北</td>
<td>37109</td>
</tr>
</tbody>
</table>
</div>
<div class="layui-col-sm8">
<div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-pagethree-home">
<div carousel-item id="LAY-index-pagethree-home">
<div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-tab layui-tab-brief layadmin-latestData">
<ul class="layui-tab-title">
<li class="layui-this">今日热搜</li>
<li>今日热帖</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<table id="LAY-index-topSearch"></table>
</div>
<div class="layui-tab-item">
<table id="LAY-index-topCard"></table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md4">
<div class="layui-card">
<div class="layui-card-header">版本信息</div>
<div class="layui-card-body layui-text layadmin-version">
<table class="layui-table">
<colgroup>
<col width="100">
<col>
</colgroup>
<tbody>
<tr>
<td>页面模式</td>
<td>
<script type="text/html" template>
{{ layui.admin.mode === 'spa' ? '单页面' : layui.admin.mode }}
</script>
</td>
</tr>
<tr>
<td>Version</td>
<td>
<script type="text/html" template>
v{{ layui.admin.v }}
</script>
</td>
</tr>
<tr>
<td>Layui</td>
<td>
<script type="text/html" template>
v{{ layui.v }}
</script>
</td>
</tr>
<tr>
<td>主要特色</td>
<td>单页面 / 响应式 / 清爽 / 极简</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">效果报告</div>
<div class="layui-card-body layadmin-takerates">
<div class="layui-progress" lay-showPercent="yes">
<h3>转化率(日同比 28% <span class="layui-edge layui-edge-top" lay-tips="增长" lay-offset="-15"></span></h3>
<div class="layui-progress-bar" lay-percent="65%"></div>
</div>
<div class="layui-progress" lay-showPercent="yes">
<h3>签到率(日同比 11% <span class="layui-edge layui-edge-bottom" lay-tips="下降" lay-offset="-15"></span></h3>
<div class="layui-progress-bar" lay-percent="32%"></div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">进度占用</div>
<div class="layui-card-body layadmin-takerates">
<div class="layui-progress" lay-showPercent="yes">
<h3>CPU使用率</h3>
<div class="layui-progress-bar" lay-percent="58%"></div>
</div>
<div class="layui-progress" lay-showPercent="yes">
<h3>内存占用率</h3>
<div class="layui-progress-bar layui-bg-red" lay-percent="90%"></div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">项目进展</div>
<div class="layui-card-body" style="padding: 22px 15px;">
<table id="LAY-home-homepage-console"></table>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">产品动态</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-news" data-autoplay="true" data-anim="fade" lay-filter="news">
<div carousel-item>
<div><a href="#" class="layui-bg-red">layuiAdmin 快速上手文档</a></div>
<div><a href="#" class="layui-bg-green">layuiAdmin 技术问答专区</a></div>
<div><a href="#" class="layui-bg-blue">layuiAdmin 模板官网</a></div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">
模板心语
<i class="layui-icon layui-icon-tips" lay-tips="要支持的噢" lay-offset="5"></i>
</div>
<div class="layui-card-body layui-text layadmin-text">
<blockquote class="layui-elem-quote">
<p>所谓“单页版”,即 SPA单页面应用系统开发模式也就是所有的页面动作都是在一个宿主页面中完成通常用于前后端分离。其中视图层全权由前端把控数据一律走 Ajax 异步请求。layuiAdmin 内部实现了一套基于 location.hash 的路由和模板机制,这使得你可以很轻松地实现界面的跳转与渲染。另外注意的是,接口鉴权不再适用于传统的 session 模式,一般需要采用 JWT。总体来说刚开始使用会相对有些复杂但使用习惯后项目会更易维护。</p>
<p>子曰:君子不用防,小人防不住。</p>
<p>请尊重知识产权,尊重他人劳动成果。</p>
</blockquote>
</div>
</div>
</div>
</div>
</div>
<script>
//加载 modules 目录下的对应模块
/*
小贴士:
这里 console 模块对应 的 console.js 并不会重复加载,
然而该页面的视图则是重新插入到容器,那如何保证能重新来控制视图?有两种方式:
1): 借助 layui.factory 方法获取 console 模块的工厂(回调函数)给 layui.use
2): 直接在 layui.use 方法的回调中书写业务代码,即:
layui.use('console', function(){
//同 console.js 中的 layui.define 回调中的代码
});
这里我们采用的是方式1。其它很多视图中采用的其实都是方式2因为更简单些也减少了一个请求数。
*/
layui.use('console', layui.factory('console'));
</script>