初始化
This commit is contained in:
@@ -1,3 +1,5 @@
|
|||||||
# layui-admin
|
# [LayuiAdmin iframe标准版（v2.3.2)](https://layui.gitee.io/v2/themes/layuiAdmin/2.0/iframe/views/)
|
||||||
|
|
||||||
ifrme版的layui-admin
|
## 通过[./src/views/index.html](./src/views/index.html)进行预览
|
||||||
|
|
||||||
|
## 文档地址：[docs/docs.html](./docs/docs.html)
|
||||||
|
|||||||
478
docs/docs.html
Normal file
478
docs/docs.html
Normal file
@@ -0,0 +1,478 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
|
<title>layuiAdmin v2.x iframe 版 文档</title>
|
||||||
|
<meta name="description" content="">
|
||||||
|
<link href="//at.alicdn.com/t/font_24081_60slu02pimt.css" rel="stylesheet">
|
||||||
|
<link href="https://cdn.staticfile.org/layui/2.7.6/css/layui.css" rel="stylesheet">
|
||||||
|
<link href="static/dist/docs/2.7/css/global.css?t=118-1704302111161" rel="stylesheet">
|
||||||
|
<link href="static/dist/dev/css/index.css?t=118-1704302111161" rel="stylesheet">
|
||||||
|
<script>!function () {
|
||||||
|
if (self !== parent) try {
|
||||||
|
if (-1 !== parent.location.host.indexOf("layuion.com")) return
|
||||||
|
} catch (a) {
|
||||||
|
location.href = "about:blank"
|
||||||
|
}
|
||||||
|
}();</script>
|
||||||
|
<link rel="stylesheet" href="static/dist/dev/css/docs.css?t=118-1704302111161" charset="utf-8">
|
||||||
|
<style> .fly-footer {
|
||||||
|
border: none;
|
||||||
|
} </style>
|
||||||
|
</head>
|
||||||
|
<body class="fly-body-docs">
|
||||||
|
<div class="layui-header header header-docs">
|
||||||
|
<div class="layui-container">
|
||||||
|
<div class="ws-logo"><a href="/"> <img src="static/images/dev/logo.png" alt="layuion"> </a></div>
|
||||||
|
</div>
|
||||||
|
</div> <!-- Gird for ie 8/9 --> <!--[if lt IE 9]>
|
||||||
|
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
|
||||||
|
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script> <![endif]-->
|
||||||
|
<div class="layui-container">
|
||||||
|
<div class="fly-docs-container"><h1 class="fly-docs-title">layuiAdmin v2.x iframe 版 文档</h1>
|
||||||
|
<div class="layui-text fly-md-text" data-doc="0.000469605604273411">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin-top: 0;
|
||||||
|
padding-left: 220px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fly-body-docs .layui-container {
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<blockquote>
|
||||||
|
<p>layuiAdmin iframe 版采用传统的 iframe
|
||||||
|
多页面开发模式，可更快速直接地开发网页管理系统模板，无需过多地学习成本，简单高效，更容易上手。</p>
|
||||||
|
</blockquote>
|
||||||
|
<div class="fly-md-dir">
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<p><a href="#quickstart">快速上手</a></p>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#dir-desc">目录说明</a></li>
|
||||||
|
<li><a href="#deploy">部署到服务端</a></li>
|
||||||
|
<li><a href="#config">全局配置</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#base-mehod">基础方法</a></p>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#base-admin">admin 模块</a></li>
|
||||||
|
<li><a href="#base-view">view 模块</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#openTabsPage">iframe 内部打开新标签</a></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#tabsTitle">自定义标签栏标题</a></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#util">实用组件</a></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#compatibility">兼容性</a></p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><a href="#copyright">关于版权</a></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<h2>前言</h2>
|
||||||
|
<ul>
|
||||||
|
<li>该文档适用于 <strong>layuiAdmin v2.x iframe 版的的最新版本</strong>，阅读之前请务必确认是否与你使用的版本对应。
|
||||||
|
</li>
|
||||||
|
<li>掌握 layuiAdmin 的前提是熟练掌握 layui，因此除了本篇文档， <a href="https://layui.gitee.io/v2/docs/">layui
|
||||||
|
的文档</a> 也是必不可少的。
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<p><a name="quickstart"> </a></p>
|
||||||
|
<h2>快速上手</h2>
|
||||||
|
<p><a name="dir-desc"> </a></p>
|
||||||
|
<h3>目录说明</h3>
|
||||||
|
<p>解压文件后，你将看到以下目录：</p>
|
||||||
|
<pre>
|
||||||
|
<code>- res/ # 静态资源目录
|
||||||
|
- adminui/ # layuiAdmin 主题核心代码目录（重要：一般升级时主要替换此目录）
|
||||||
|
- dist/ # 主题核心代码构建后的目录（为主要引用）
|
||||||
|
- modules/ # 主题核心 JS 模块
|
||||||
|
- css/ # 主题核心 CSS 样式
|
||||||
|
- src/ # 主题核心源代码目录（不推荐引用，除非要改动核心代码），结构同 dist 目录
|
||||||
|
- json/ # 用于演示的模拟数据
|
||||||
|
- layui/ # layui 组件库（重要：若升级 layui 直接替换该目录即可）
|
||||||
|
- modules/ # 业务 JS 模块（可按照实际的业务需求进行修改）
|
||||||
|
- style/ # 业务 CSS 图片等资源目录
|
||||||
|
- views/ # 业务动态模板视图碎片目录
|
||||||
|
- config.js # 初始化配置文件
|
||||||
|
- index.js # 初始化主题入口模块
|
||||||
|
- views/ # 业务视图目录，可放置在项目任意目录（注意修改里面的 css、js 相关路径即可）
|
||||||
|
</code>
|
||||||
|
</pre>
|
||||||
|
<br>
|
||||||
|
<blockquote>
|
||||||
|
<p>注意：上述为当前 layuiAdmin v2.x iframe 最新版本的目录结构</p>
|
||||||
|
</blockquote>
|
||||||
|
<p><a name="deploy"> </a></p>
|
||||||
|
<h3>部署到服务端</h3>
|
||||||
|
<ol>
|
||||||
|
<li>将 <em>views</em> 文件夹整个复制到你 <em>服务端工程</em> 的 view 层中，通过本地 web 服务器访问（Tomcat
|
||||||
|
/ IIS / Apache / Nginx 等）
|
||||||
|
</li>
|
||||||
|
<li>确保可以访问后，修改好 HTML 文件中的 JS/CSS 路径，即可正常运行页面。</li>
|
||||||
|
</ol>
|
||||||
|
<blockquote>
|
||||||
|
<p><em>iframe 版</em> 相比于 <em>单页面版</em> ，无论是在目录结构还是开发模式上都要简单很多。因为单页版是接管了服务端
|
||||||
|
MVC 的视图层，而 iframe 版则将视图交给了服务端来控制和输出，可以避免鉴权的复杂程度，直接可衔接好新老项目（因为你们的大部分老项目都是采用
|
||||||
|
iframe 模式）。</p>
|
||||||
|
</blockquote>
|
||||||
|
<p><a name="config"> </a></p>
|
||||||
|
<h3>全局配置</h3>
|
||||||
|
<p>res 目录中的 <code>config.js</code>，里面存储着所有的默认配置项。你可以按照实际需求选择性修改：</p>
|
||||||
|
<pre><code class="language-js">layui.define(['all'], function(exports){
|
||||||
|
exports('setter', {
|
||||||
|
paths: { // v1.9.0 及以上版本的写法
|
||||||
|
core: layui.cache.base + 'adminui/dist/', // 核心库所在目录
|
||||||
|
views: layui.cache.base + 'views/', // 动态模板所在目录
|
||||||
|
modules: layui.cache.base + 'modules/', // 业务模块所在目录
|
||||||
|
base: layui.cache.base // 记录静态资源所在基础目录
|
||||||
|
},
|
||||||
|
/* v1.9.0 之前的写法
|
||||||
|
// views: layui.cache.base + 'views/', // 业务视图所在目录
|
||||||
|
// base: layui.cache.base, // 记录静态资源所在基础目录
|
||||||
|
*/
|
||||||
|
|
||||||
|
container: 'LAY_app', // 容器ID
|
||||||
|
entry: 'index', // 默认视图文件名
|
||||||
|
engine: '.html', // 视图文件后缀名
|
||||||
|
pageTabs: true, // 是否开启页面选项卡功能。iframe 版推荐开启
|
||||||
|
refreshCurrPage: true, // 当跳转页面 url 与当前页 url 相同时，是否自动执行刷新 --- 2.0+
|
||||||
|
|
||||||
|
name: 'layuiAdmin',
|
||||||
|
tableName: 'layuiAdmin', // 本地存储表名
|
||||||
|
MOD_NAME: 'admin', // 模块事件名
|
||||||
|
|
||||||
|
// 记忆
|
||||||
|
record: {
|
||||||
|
url: true // 是否开启 iframe 跳转时 url 记忆功能 --- 2.0+
|
||||||
|
},
|
||||||
|
|
||||||
|
debug: true, // 是否开启调试模式。如开启，接口异常时会抛出异常 URL 等信息
|
||||||
|
|
||||||
|
// 自定义请求字段
|
||||||
|
request: {
|
||||||
|
tokenName: false // 自动携带 token 的字段名（如：access_token）。可设置 false 不携带。
|
||||||
|
},
|
||||||
|
|
||||||
|
// 自定义响应字段
|
||||||
|
response: {
|
||||||
|
statusName: 'code', // 数据状态的字段名称
|
||||||
|
statusCode: {
|
||||||
|
ok: 0, // 数据状态一切正常的状态码
|
||||||
|
logout: 1001 // 登录状态失效的状态码
|
||||||
|
},
|
||||||
|
msgName: 'msg', // 状态信息的字段名称
|
||||||
|
dataName: 'data' // 数据详情的字段名称
|
||||||
|
},
|
||||||
|
|
||||||
|
// 配置业务模块目录中的特殊模块
|
||||||
|
extend: {
|
||||||
|
layim: 'layim/layim' // layim
|
||||||
|
},
|
||||||
|
|
||||||
|
// 主题配置
|
||||||
|
theme: {
|
||||||
|
// 配色方案，如果用户未设置主题，第一个将作为默认
|
||||||
|
color: [{
|
||||||
|
main: '#20222A', // 主题色
|
||||||
|
selected: '#009688', // 选中色
|
||||||
|
logo: '', // logo 区域背景色
|
||||||
|
header: '', // 头部区域背景色
|
||||||
|
alias: 'default' // 默认别名
|
||||||
|
}], // 为了减少篇幅，更多主题此处不做列举，可直接参考 config.js
|
||||||
|
|
||||||
|
// 初始的颜色索引，对应上面的配色方案数组索引
|
||||||
|
// 如果本地已经有主题色记录，则以本地记录为优先，除非清除 LocalStorage（步骤：F12呼出调试工具→Aplication→Local Storage→选中页面地址→layuiAdmin→再点上面的X）
|
||||||
|
// 1.0 正式版开始新增
|
||||||
|
initColorIndex: 0
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
</code></pre>
|
||||||
|
<p><a name="base-mehod"> </a></p>
|
||||||
|
<h2>基础方法</h2>
|
||||||
|
<ul>
|
||||||
|
<li><strong>config 模块</strong></li>
|
||||||
|
</ul>
|
||||||
|
<blockquote>
|
||||||
|
<p>你可以在任何地方通过 <code>layui.setter</code> 得到 <em>config.js</em> 中的配置信息。如：<code>layui.setter.base</code>
|
||||||
|
</p>
|
||||||
|
</blockquote>
|
||||||
|
<p><a name="base-admin"> </a></p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>admin 模块</strong></li>
|
||||||
|
</ul>
|
||||||
|
<blockquote>
|
||||||
|
<p>var admin = layui.admin;</p>
|
||||||
|
</blockquote>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.req(options)</strong><br>
|
||||||
|
Ajax 请求，用法同 $.ajax(options)，只是该方法会进行错误处理</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.screen()</strong><br>
|
||||||
|
获取屏幕类型，根据当前屏幕大小，返回 0 - 3 的值<br>
|
||||||
|
0: 低于768px的屏幕<br>
|
||||||
|
1：768px到992px之间的屏幕<br>
|
||||||
|
2：992px到1200px之间的屏幕<br>
|
||||||
|
3：高于1200px的屏幕</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.sideFlexible(status)</strong><br>
|
||||||
|
侧边伸缩。status 为 null：收缩；status为 “spread”：展开</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.on(eventName, callback)</strong></p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<table class="layui-table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>eventName</th>
|
||||||
|
<th>描述</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>tabsPage</td>
|
||||||
|
<td>标签页切换事件</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>side</td>
|
||||||
|
<td>侧边栏伸缩事件</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.popup(options)</strong><br>
|
||||||
|
弹出一个 layuiAdmin 主题风格的 layer 层，参数 options 跟 layer.open(options) 完全相同</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.popupRight(options)</strong><br>
|
||||||
|
在屏幕右侧呼出一个面板层。options 同上。</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<pre><code>admin.popupRight({
|
||||||
|
id: 'LAY-popup-right-new1' //定义唯一ID，防止重复弹出
|
||||||
|
,success: function(){
|
||||||
|
//将 views 目录下的某视图文件内容渲染给该面板
|
||||||
|
layui.view(this.id).render('视图文件所在路径');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</code></pre>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.resize(callback)</strong><br>
|
||||||
|
窗口 resize 事件处理，我们推荐你使用该方法取代 jQuery 的 resize 事件，以避免多页面标签下可能存在的冲突。
|
||||||
|
</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.fullScreen()</strong><br>
|
||||||
|
全屏</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.exitScreen()</strong><br>
|
||||||
|
退出全屏</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p><strong>admin.events</strong></p>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
<p>admin.events.refresh()<br>
|
||||||
|
刷新当前右侧区域</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>admin.events.closeThisTabs()<br>
|
||||||
|
关闭当前标签页</p>
|
||||||
|
<blockquote>
|
||||||
|
<p>注意：如果是在 iframe 页面中执行关闭，需要如下写法：</p>
|
||||||
|
<blockquote>
|
||||||
|
<p>parent.layui.admin.events.closeThisTabs();</p>
|
||||||
|
</blockquote>
|
||||||
|
</blockquote>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>admin.events.closeOtherTabs()<br>
|
||||||
|
关闭其它标签页</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>admin.events.closeAllTabs()<br>
|
||||||
|
关闭全部标签页</p>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<p><a name="base-view"> </a></p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>view 模块</strong></li>
|
||||||
|
</ul>
|
||||||
|
<blockquote>
|
||||||
|
<p>var view = layui.view;</p>
|
||||||
|
</blockquote>
|
||||||
|
<ul>
|
||||||
|
<li><strong>view(id)</strong><br>
|
||||||
|
获取指定容器，并返回一些视图渲染的方法，如：</li>
|
||||||
|
</ul>
|
||||||
|
<pre><code>//渲染视图，viewPath 即为视图路径
|
||||||
|
view('id').render(viewPath).then(function(){
|
||||||
|
//视图文件请求完毕，视图内容渲染前的回调
|
||||||
|
}).done(function(){
|
||||||
|
//视图文件请求完毕和内容渲染完毕的回调
|
||||||
|
});
|
||||||
|
|
||||||
|
</code></pre>
|
||||||
|
<p>也可以通过 <code>send</code> 方法直接向容器中插入模板：</p>
|
||||||
|
<pre><code>//tpl 为 模板字符；data 是传入的数据。该方法会自动完成动态模板解析
|
||||||
|
view('id').send(tpl, data);
|
||||||
|
</code></pre>
|
||||||
|
<p>一般我们还是推荐 <code>render</code> 方法，因为它请求的是一个独立的模板碎片，可以保证代码的可维护性。该方法同样支持动态传参，并可在视图的动态模板中使用。如：</p>
|
||||||
|
<pre><code>admin.popup({
|
||||||
|
id: 'LAY-popup-test1'
|
||||||
|
,success: function(){
|
||||||
|
view(this.id).render('视图文件所在路径', {
|
||||||
|
id: 123 //这里的 id 值你可以在一些事件中动态获取（如 table 模块的编辑）
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</code></pre>
|
||||||
|
<p>那么，在视图文件中，你可以在动态模板中通过 <code>{{ d.params.xxx }}</code> 得到传入的参数，如：</p>
|
||||||
|
<pre><code><script type="text/html" template lay-url="http://api.com?id={{ d.params.id }}">
|
||||||
|
配置了接口的动态模板，且接口动态获取了 render 传入的参数：{{ d.params.id }}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script type="text/html" template>
|
||||||
|
也可以直接获取：<input type="hidden" name="id" value="{{ d.params.id }}">
|
||||||
|
</script>
|
||||||
|
</code></pre>
|
||||||
|
<p><strong>而如果是在 JS 语句中去获取模板传递过来的变量，可以借助动态模板的 lay-done 属性去实现，如：</strong></p>
|
||||||
|
<pre><code><script type="text/html" template lay-done="layui.data.sendParams(d.params)">
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</code></pre>
|
||||||
|
<p>然后在 JS 语句中通过执行动态模板 lay-done 中对应的方法得到对应的参数值：</p>
|
||||||
|
<pre><code><script>
|
||||||
|
//定义一个 lay-done 对应的全局方法，以供动态模板执行
|
||||||
|
layui.data.sendParams = function(params){
|
||||||
|
console.log(params.id) //得到传递过来的 id 参数（或其他参数）值
|
||||||
|
|
||||||
|
//通过得到的参数值，做一些你想做的事
|
||||||
|
//…
|
||||||
|
|
||||||
|
//若需用到 layui 组件，layui.use 需写在该全局方法里面，如：
|
||||||
|
layui.use(['table'], function(){
|
||||||
|
var table = layui.table;
|
||||||
|
table.render({
|
||||||
|
elem: ''
|
||||||
|
,url: 'url?id='+ params.id
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
</code></pre>
|
||||||
|
<p>总之，驾驭好 <code>view().render().done(callback)</code> 对您的项目开发至关重要。</p>
|
||||||
|
<p><a name="openTabsPage"> </a></p>
|
||||||
|
<h2>在 iframe 页面内部打开新标签</h2>
|
||||||
|
<blockquote>
|
||||||
|
<p>通常你会涉及一些在右侧 iframe 页面内部去打开一个新标签的需求，目前有以下方式可以实现</p>
|
||||||
|
</blockquote>
|
||||||
|
<h3>方法一：</h3>
|
||||||
|
<p>直接在 a 标签上加上相关属性</p>
|
||||||
|
<pre><code><a lay-href="url">文本</a>
|
||||||
|
</code></pre>
|
||||||
|
<h3>方法二：</h3>
|
||||||
|
<p>调用 index 模块的相关方法</p>
|
||||||
|
<pre><code>// 这里要注意的是 parent 的层级关系。
|
||||||
|
parent.layui.admin.openTabsPage({
|
||||||
|
url: '',
|
||||||
|
title: ''
|
||||||
|
});
|
||||||
|
|
||||||
|
// 注意：v2.0.0 之前的版本写法为
|
||||||
|
// parent.layui.index.openTabsPage(url, title);
|
||||||
|
</code></pre>
|
||||||
|
<p><a name="tabsTitle"> </a></p>
|
||||||
|
<h2>自定义标签栏标题</h2>
|
||||||
|
<blockquote>
|
||||||
|
<p>每当你打开一个标签页，头部都会出现标题。它默认读取的是所点元素的文本，但是你也可以自定义标题。</p>
|
||||||
|
</blockquote>
|
||||||
|
<pre><code><a lay-href="url" lay-title="自定义标题文本">默认读取的文本</a>
|
||||||
|
</code></pre>
|
||||||
|
<ul>
|
||||||
|
<li>值得说明的是，只要你配置了上述的 <code>lay-href</code> 属性，就会打开一个新的标签，如果要在当前标签跳转，直接配置
|
||||||
|
<code>href=""</code> 属性即可。
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<p><a name="util"> </a></p>
|
||||||
|
<h2>实用组件</h2>
|
||||||
|
<h3>Hover 提示层</h3>
|
||||||
|
<p>通过对元素设置 <code>lay-tips="提示内容"</code> 来开启一个 hover 提示，如：</p>
|
||||||
|
<pre><code><i class="layui-icon layui-icon-tips" lay-tips="要支持的噢" lay-offset="5"></i>
|
||||||
|
</code></pre>
|
||||||
|
<p>其中 <code>lay-offset</code> 用于定于水平偏移距离（单位px），以调整箭头让其对准元素</p>
|
||||||
|
<p><a name="compatibility"> </a></p>
|
||||||
|
<h2>兼容性</h2>
|
||||||
|
<p>layuiAdmin 使用到了 layui 的栅格系统，而栅格则是基于浏览器的媒体查询。ie8、9不支持。<br>
|
||||||
|
所以要在 views 目录的 html 文件中加上下面这段代码保证兼容：</p>
|
||||||
|
<pre><code class="language-html"><!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
|
||||||
|
<!--[if lt IE 9]>
|
||||||
|
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
|
||||||
|
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
|
||||||
|
<![endif]-->
|
||||||
|
</code></pre>
|
||||||
|
<p><a name="copyright"> </a></p>
|
||||||
|
<h2>关于版权</h2>
|
||||||
|
<blockquote>
|
||||||
|
<p>layuiAdmin
|
||||||
|
受国家计算机软件著作权保护，禁止公开及传播模板源文件、盗版及非法倒卖等，违者将自行承担相应的法律责任。</p>
|
||||||
|
</blockquote>
|
||||||
|
<p>© layuiAdmin</p>
|
||||||
|
<i icon="0.000058700699999266244"></i></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="FLY-spread-dir" class="layui-hide"><i class="layui-icon layui-icon-spread-left"></i></div>
|
||||||
|
<div class="fly-footer"><p>Copyright © 2024 <a href="/">Layuion</a></p>
|
||||||
|
<p><span> 感谢 <a href="https://www.upyun.com/?invite=SJ0wu6g2-" target="_blank" rel="nofollow" sponsor="upyun"
|
||||||
|
class="layui-font-blue"> <strong>又拍云</strong> </a> 提供云加速支持 </span></p></div>
|
||||||
|
<div class="dev-shade"></div>
|
||||||
|
<script src="https://cdn.staticfile.org/layui/2.7.6/layui.js"></script>
|
||||||
|
<script> layui.cache.page = 'docs';
|
||||||
|
layui.cache.user = {
|
||||||
|
username: 'Isve丨丶勿言',
|
||||||
|
uid: 9739968,
|
||||||
|
avatar: '//q.qlogo.cn/qqapp/101235792/7869FC3424ABACFF58566A04C8ED411D/100',
|
||||||
|
experience: 629,
|
||||||
|
sum: 829,
|
||||||
|
vip: 3,
|
||||||
|
sex: ''
|
||||||
|
};
|
||||||
|
layui.config({
|
||||||
|
version: "118-1704302111161",
|
||||||
|
reshost: './',
|
||||||
|
RESPATH: 'static/dist/dev/'
|
||||||
|
}).extend({'fly': 'static/dist/dev/modules/index'}).use('fly'); </script>
|
||||||
|
<script> var _hmt = _hmt || [];
|
||||||
|
(function () {
|
||||||
|
var hm = document.createElement("script");
|
||||||
|
hm.src = "https://hm.baidu.com/hm.js?697ca70ccd7673d85e991c9168d9cc09";
|
||||||
|
var s = document.getElementsByTagName("script")[0];
|
||||||
|
s.parentNode.insertBefore(hm, s);
|
||||||
|
})(); </script>
|
||||||
|
<link href="https://cdn.staticfile.org/highlight.js/11.5.1/styles/base16/google-dark.min.css" rel="stylesheet">
|
||||||
|
<script src="https://cdn.staticfile.org/highlight.js/11.5.1/highlight.min.js"></script>
|
||||||
|
<script>hljs.highlightAll();</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
1
docs/static/dist/dev/css/docs.css
vendored
Normal file
1
docs/static/dist/dev/css/docs.css
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
html{background:0 0}html body{margin-top:0}.fly-header{position:relative;top:0}h1{font-size:28px}.fly-body-docs .fly-footer,.fly-body-docs .fly-header .fly-nav{display:none}.fly-docs-preview,.fly-docs-write{position:fixed;left:0;top:60px;bottom:0;width:50%;box-sizing:border-box}.fly-docs-editor{position:absolute;width:100%;height:100%;padding:20px;border:none;overflow:auto;box-sizing:border-box;resize:none;font-family:Menlo,Monaco,Consolas,"Courier New","Microsoft Yahei",monospace}.fly-docs-form{position:fixed;top:12px;left:10px;width:50%;padding:0;z-index:10001;box-sizing:border-box}.fly-docus-btn{position:absolute;right:15px;bottom:15px;z-index:10000}.fly-docs-preview{left:auto;right:0;border-left:1px solid #e2e2e2;padding:20px;overflow:auto}.fly-md-text{line-height:24px}.fly-md-text h2{margin:35px 0 20px}.fly-md-text h3{margin:20px 0}.fly-md-text h1 .fly-md-text h2 .fly-md-text h3 .fly-md-text h4,.fly-md-text h5,.fly-md-text h6{font-weight:700}.fly-md-text em,.fly-md-text strong{padding:0 3px}.fly-md-text p code{padding:3px 5px;background-color:#f2f2f2;border-radius:2px;font-family:Monaco,Menlo,Consolas,"Courier New",monospace}.fly-md-text pre{padding:0!important;background:0 0!important}.fly-md-text pre code{display:block;padding:1em;font-family:Lucida Console,Consolas,Courier New;border-radius:3px}.fly-docs-container{padding:20px}.fly-docs-info{padding:10px 0}.fly-docs-info>span{display:inline-block;margin-right:10px;line-height:26px;padding:0 10px;border:1px solid #e6e6e6;border-radius:2px;color:#666}.fly-docs-admin{padding:10px 0}.fly-docs-title{margin-bottom:10px;padding-bottom:10px;color:#000;border-bottom:1px solid #e6e6e6}.fly-docs-container .fly-md-text{padding:20px 0}.fly-md-dir{position:fixed;top:0;bottom:0;left:0;width:220px;padding:20px;border-right:1px solid #f2f2f2;overflow:hidden;background-color:#f2f2f2;box-sizing:border-box;transition:all .3s;-webkit-transition:all .3s}.fly-md-dir:hover{overflow:auto}.fly-md-dir:before{content:'\76ee\5f55';position:relative;width:100%;display:block;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #e6e6e6;font-size:20px;box-sizing:border-box}.fly-md-dir p{margin:0}#FLY-spread-dir{position:fixed;left:15px;bottom:15px;width:50px;height:50px;line-height:50px;text-align:center;background-color:#2f9688;border-radius:5px;color:#fff}#FLY-spread-dir .layui-icon{font-size:20px}.fly-docs-spread .fly-md-dir{transform:translate3d(0,0,0)!important}@media screen and (max-width:768px){.fly-body-docs .layui-container{padding-left:0}.fly-md-dir{transform:translate3d(-220px,0,0);z-index:999999999999}#FLY-spread-dir{display:block!important}}
|
||||||
1
docs/static/dist/dev/css/index.css
vendored
Normal file
1
docs/static/dist/dev/css/index.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
docs/static/dist/dev/modules/docs.js
vendored
Normal file
1
docs/static/dist/dev/modules/docs.js
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
layui.define(function(l){var o,i,a=layui.$,n=(layui.layer,layui.form),r=layui.fly,e=layui.util,t=(a(".layui-fixbar").remove(),e.fixbar({}),a("#FLY-docs-editor")),c=a("#FLY-docs-preview"),s=a(".fly-docs-preview"),e=a("#FLY-docs-id").val(),d="layui-auth-product-"+e;t[0]&&((o=window.markdownit({html:!0,typographer:!0,linkify:!0,breaks:!0})).renderer.rules.table_open=function(){return'<table class="layui-table">\n'},i=function(){var l=t.val(),l=o.render(l);c.html(l),window.hljs&&hljs.highlightAll()},e||t.val(layui.data(d).content),i(),t.on("keyup",function(){var l=t.val();layui.data(d,{key:"content",value:l})}).on("change",i).on("scroll",function(){!function(l){var o=a(this),i=o.prop("scrollHeight"),o=o.scrollTop()*l.prop("scrollHeight")/i;l.scrollTop(o)}.call(this,s)}),n.on("submit(FLY-docs-send)",function(l){return r.json(l.form.action,l.field,function(l){location.href="/docs/"+l.data.id+"/"}),!1})),a("#FLY-spread-dir").on("click",function(){return a("body").addClass("fly-docs-spread"),!1}),a("body").on("click",function(){a(this).removeClass("fly-docs-spread")}),l("docs",{})});
|
||||||
1
docs/static/dist/dev/modules/face.js
vendored
Normal file
1
docs/static/dist/dev/modules/face.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
docs/static/dist/dev/modules/index.js
vendored
Normal file
1
docs/static/dist/dev/modules/index.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
docs/static/dist/docs/2.7/css/global.css
vendored
Normal file
1
docs/static/dist/docs/2.7/css/global.css
vendored
Normal file
File diff suppressed because one or more lines are too long
BIN
docs/static/images/dev/logo.png
vendored
Normal file
BIN
docs/static/images/dev/logo.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
1
src/res/adminui/dist/css/admin.css
vendored
Normal file
1
src/res/adminui/dist/css/admin.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
src/res/adminui/dist/css/login.css
vendored
Normal file
1
src/res/adminui/dist/css/login.css
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
#LAY_app,body,html{height:100%}.layui-layout-body{overflow:auto}#LAY-user-login,.layadmin-user-display-show{display:block!important}.layadmin-user-login{position:relative;left:0;top:0;padding:110px 0;min-height:100%;box-sizing:border-box}.layadmin-user-login-main{width:375px;margin:0 auto;box-sizing:border-box}.layadmin-user-login-box{padding:20px}.layadmin-user-login-header{text-align:center}.layadmin-user-login-header h2{margin-bottom:10px;font-weight:300;font-size:30px;color:#000}.layadmin-user-login-header p{font-weight:300;color:#999}.layadmin-user-login-body .layui-form-item{position:relative}.layadmin-user-login-icon{position:absolute;left:1px;top:1px;width:38px;line-height:36px;text-align:center;color:#d2d2d2}.layadmin-user-login-body .layui-form-item .layui-input{padding-left:38px}.layadmin-user-login-codeimg{max-height:38px;width:100%;cursor:pointer;box-sizing:border-box}.layadmin-user-login-other{position:relative;font-size:0;line-height:38px;padding-top:20px}.layadmin-user-login-other>*{display:inline-block;vertical-align:middle;margin-right:10px;font-size:14px}.layadmin-user-login-other .layui-icon{position:relative;top:2px;font-size:26px}.layadmin-user-login-other a:hover{opacity:.8}.layadmin-user-jump-change{float:right}.layadmin-user-login-footer{position:absolute;left:0;bottom:0;width:100%;line-height:30px;padding:20px;text-align:center;box-sizing:border-box;color:rgba(0,0,0,.5)}.layadmin-user-login-footer span{padding:0 5px}.layadmin-user-login-footer a{padding:0 5px;color:rgba(0,0,0,.5)}.layadmin-user-login-footer a:hover{color:#000}.layadmin-user-login-main[bgimg]{background-color:#fff;box-shadow:0 0 5px rgba(0,0,0,.05)}.ladmin-user-login-theme{position:fixed;bottom:0;left:0;width:100%;text-align:center}.ladmin-user-login-theme ul{display:inline-block;padding:5px;background-color:#fff}.ladmin-user-login-theme ul li{display:inline-block;vertical-align:top;width:64px;height:43px;cursor:pointer;transition:all .3s;-webkit-transition:all .3s;background-color:#f2f2f2}.ladmin-user-login-theme ul li:hover{opacity:.9}@media screen and (max-width:768px){.layadmin-user-login{padding-top:60px}.layadmin-user-login-main{width:300px}.layadmin-user-login-box{padding:10px}}
|
||||||
1
src/res/adminui/dist/modules/admin.js
vendored
Normal file
1
src/res/adminui/dist/modules/admin.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
src/res/adminui/dist/modules/index.js
vendored
Normal file
1
src/res/adminui/dist/modules/index.js
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
/** The Web UI Theme-v2.3.2 */;layui.define("admin",function(a){function n(e){function a(){r.tabChange(o,e.url),d.tabsBodyChange(s.index,{url:e.url,title:e.title})}e=c.extend({url:"",escape:!0},e);var i,t=c("#LAY_app_tabsheader>li"),n=e.url.replace(/(^http(s*):)|(\?[\s\S]*$)/g,"");t.each(function(a){c(this).attr("lay-id")===e.url&&(i=!0,s.index=a)}),e.title=e.title||(0===s.index?"":"\u65b0\u6807\u7b7e\u9875"),l.pageTabs?i||(setTimeout(function(){c("#LAY_app_body").append(['<div class="layadmin-tabsbody-item layui-show">','<iframe src="'+e.url+'" frameborder="0" class="layadmin-iframe"></iframe>',"</div>"].join("")),a()},10),s.index=t.length,r.tabAdd(o,{title:"<span>"+(t=u.escape(e.title),e.highlight?'<span style="'+e.highlight+'">'+t+"</span>":t)+"</span>",id:e.url,attr:n})):d.tabsBody(d.tabsPage.index).find(".layadmin-iframe")[0].contentWindow.location.href=e.url,a()}var l=layui.setter,r=layui.element,d=layui.admin,s=d.tabsPage,e=layui.view,u=layui.util,o="layadmin-layout-tabs",c=layui.$,e=(c(window),d.screen()<2&&d.sideFlexible(),e().autoRender(),function a(){var e=layui.url().hash,i=l.record||{},e=e.path.join("/"),t=(layui.data(l.tableName).record||{})[e]||"";return i.url&&e&&(i=c.trim(e),/^(\w*:)*\/\/.+/.test(i)&&-1===i.indexOf(location.hostname)||n({url:e,title:t})),setTimeout(function(){c("#"+l.container).css("visibility","visible")},300),a}(),{openTabsPage:n});c.extend(d,e),a("adminIndex",e)});
|
||||||
1
src/res/adminui/dist/modules/view.js
vendored
Normal file
1
src/res/adminui/dist/modules/view.js
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
/** The Web UI Theme-v2.3.2 */;layui.define(["laytpl","layer"],function(e){function u(e){return new t(e)}function t(e){this.id=e,this.container=c("#"+(e||a))}var c=layui.jquery,p=layui.laytpl,r=layui.layer,s=layui.setter,y=(layui.device(),layui.hint()),a="LAY_app_body";u.loading=function(e){e.append(this.elemLoad=c('<i class="layui-anim layui-anim-rotate layui-anim-loop layui-icon layui-icon-loading layadmin-loading"></i>'))},u.removeLoad=function(){this.elemLoad&&this.elemLoad.remove()},u.exit=function(e){layui.data(s.tableName,{key:s.request.tokenName,remove:!0}),e&&e()},u.req=function(a){function n(){return s.debug?"<br><cite>URL\uff1a</cite>"+a.url:""}var e,r=a.success,o=a.error,t=s.request,i=s.response;return a.data=a.data||{},a.headers=a.headers||{},t.tokenName&&(e="string"==typeof a.data?JSON.parse(a.data):a.data,a.data[t.tokenName]=t.tokenName in e?a.data[t.tokenName]:layui.data(s.tableName)[t.tokenName]||"",a.headers[t.tokenName]=t.tokenName in a.headers?a.headers[t.tokenName]:layui.data(s.tableName)[t.tokenName]||""),delete a.success,delete a.error,c.ajax(c.extend({type:"get",dataType:"json",success:function(e){var t=i.statusCode;e[i.statusName]==t.ok?"function"==typeof a.done&&a.done(e):e[i.statusName]==t.logout?u.exit():(t=["<cite>Error\uff1a</cite> "+(e[i.msgName]||"\u8fd4\u56de\u72b6\u6001\u7801\u5f02\u5e38"),n()].join(""),u.error(t)),"function"==typeof r&&r(e)},error:function(e,t){var a=["\u8bf7\u6c42\u5f02\u5e38\uff0c\u8bf7\u91cd\u8bd5<br><cite>\u9519\u8bef\u4fe1\u606f\uff1a</cite>"+t,n()].join("");u.error(a),"function"==typeof o&&o.apply(this,arguments)}},a))},u.popup=function(e){var n=e.success,t=e.skin;return delete e.success,delete e.skin,r.open(c.extend({type:1,title:"\u63d0\u793a",content:"",id:"LAY-system-view-popup",skin:"layui-layer-admin"+(t?" "+t:""),shadeClose:!0,closeBtn:!1,success:function(e,t){var a=c('<i class="layui-icon" close>ဆ</i>');e.append(a),a.on("click",function(){r.close(t)}),"function"==typeof n&&n.apply(this,arguments)}},e))},u.error=function(e,t){return u.popup(c.extend({content:e,maxWidth:300,offset:"t",anim:6,id:"LAY_adminError"},t))},t.prototype.render=function(e,n){var r=this;layui.router();return e=(s.paths&&s.paths.views?s.paths:s).views+e+s.engine,c("#"+a).children(".layadmin-loading").remove(),u.loading(r.container),c.ajax({url:e,type:"get",dataType:"html",data:{v:layui.cache.version},success:function(e){var t=c(e="<div>"+e+"</div>").find("title"),a={title:t.text()||(e.match(/\<title\>([\s\S]*)\<\/title>/)||[])[1],body:e};t.remove(),r.params=n||{},r.then&&(r.then(a),delete r.then),r.parse(e),u.removeLoad(),r.done&&(r.done(a),delete r.done)},error:function(e){if(u.removeLoad(),r.render.isError)return u.error("\u8bf7\u6c42\u89c6\u56fe\u6587\u4ef6\u5f02\u5e38\uff0c\u72b6\u6001\uff1a"+e.status);404===e.status?r.render("template/tips/404"):r.render("template/tips/error"),r.render.isError=!0}}),r},t.prototype.parse=function(e,t,n){function o(t){var e=p(t.dataElem.html()),a=c.extend({params:d.params},t.res);t.dataElem.after(e.render(a)),"function"==typeof n&&n();try{t.done&&new Function("d",t.done)(a)}catch(e){console.error(t.dataElem[0],"\n\u5b58\u5728\u9519\u8bef\u56de\u8c03\u811a\u672c\n\n",e)}}var a=this,r="object"==typeof e,i=r?e:c(e),s=r?e:i.find("*[template]"),d=layui.router();i.find("title").remove(),a.container[t?"after":"html"](i.children()),d.params=a.params||{};for(var l=s.length;0<l;l--)!function(){var t=s.eq(l-1),a=t.attr("lay-done")||t.attr("lay-then"),e=p(t.attr("lay-url")||"").render(d),n=p(t.attr("lay-data")||"").render(d),r=p(t.attr("lay-headers")||"").render(d);try{n=new Function("return "+n+";")()}catch(e){y.error("lay-data: "+e.message),n={}}try{r=new Function("return "+r+";")()}catch(e){y.error("lay-headers: "+e.message),r=r||{}}e?u.req({type:t.attr("lay-type")||"get",url:e,data:n,dataType:"json",headers:r,success:function(e){o({dataElem:t,res:e,done:a})}}):o({dataElem:t,done:a})}();return a},t.prototype.autoRender=function(e,t){var n=this;c(e||"body").find("*[template]").each(function(e,t){var a=c(this);n.container=a,n.parse(a,"refresh")})},t.prototype.send=function(e,t){e=p(e||this.container.html()).render(t||{});return this.container.html(e),this},t.prototype.refresh=function(e){var t=this,a=t.container.next().attr("lay-templateid");return t.id!=a||t.parse(t.container,"refresh",function(){t.container.siblings('[lay-templateid="'+t.id+'"]:last').remove(),"function"==typeof e&&e()}),t},t.prototype.then=function(e){return this.then=e,this},t.prototype.done=function(e){return this.done=e,this},e("view",u)});
|
||||||
157
src/res/config.js
Normal file
157
src/res/config.js
Normal file
@@ -0,0 +1,157 @@
|
|||||||
|
/**
|
||||||
|
* setter
|
||||||
|
*/
|
||||||
|
|
||||||
|
// 初始化配置
|
||||||
|
layui.define(['all'], function(exports){
|
||||||
|
exports('setter', {
|
||||||
|
paths: { // v1.9.0 及以上版本的写法
|
||||||
|
core: layui.cache.base + 'adminui/dist/', // 核心库所在目录
|
||||||
|
views: layui.cache.base + 'views/', // 动态模板所在目录
|
||||||
|
modules: layui.cache.base + 'modules/', // 业务模块所在目录
|
||||||
|
base: layui.cache.base // 记录静态资源所在基础目录
|
||||||
|
},
|
||||||
|
/* v1.9.0 之前的写法
|
||||||
|
// views: layui.cache.base + 'views/', // 业务视图所在目录
|
||||||
|
// base: layui.cache.base, // 记录静态资源所在基础目录
|
||||||
|
*/
|
||||||
|
|
||||||
|
container: 'LAY_app', // 容器 ID
|
||||||
|
entry: 'index', // 默认视图文件名
|
||||||
|
engine: '.html', // 视图文件后缀名
|
||||||
|
pageTabs: true, // 是否开启页面选项卡功能。 iframe 版推荐开启
|
||||||
|
refreshCurrPage: true, // 当跳转页面 url 与当前页 url 相同时，是否自动执行刷新 --- 2.0+
|
||||||
|
|
||||||
|
name: 'layuiAdmin', // 系统名称
|
||||||
|
tableName: 'layuiAdmin', // 本地存储表名
|
||||||
|
MOD_NAME: 'admin', // 模块事件名
|
||||||
|
|
||||||
|
// 记录
|
||||||
|
record: {
|
||||||
|
url: false // 是否开启 iframe 跳转时 url 记忆功能
|
||||||
|
},
|
||||||
|
|
||||||
|
debug: true, // 是否开启调试模式。如开启，接口异常时会抛出异常 URL 等信息
|
||||||
|
|
||||||
|
// 自定义请求字段
|
||||||
|
request: {
|
||||||
|
tokenName: false // 自动携带 token 的字段名（如：access_token）。可设置 false 不携带。
|
||||||
|
},
|
||||||
|
|
||||||
|
// 自定义响应字段
|
||||||
|
response: {
|
||||||
|
statusName: 'code', // 数据状态的字段名称
|
||||||
|
statusCode: {
|
||||||
|
ok: 0, // 数据状态一切正常的状态码
|
||||||
|
logout: 1001 // 登录状态失效的状态码
|
||||||
|
},
|
||||||
|
msgName: 'msg', // 状态信息的字段名称
|
||||||
|
dataName: 'data' // 数据详情的字段名称
|
||||||
|
},
|
||||||
|
|
||||||
|
// 配置业务模块目录中的特殊模块
|
||||||
|
extend: {
|
||||||
|
layim: 'layim/layim' // layim
|
||||||
|
},
|
||||||
|
|
||||||
|
// 主题配置
|
||||||
|
theme: {
|
||||||
|
// 内置主题配色方案
|
||||||
|
color: [{
|
||||||
|
main: '#20222A', // 主题色
|
||||||
|
selected: '#16baaa', // 选中色
|
||||||
|
alias: 'default' // 默认别名
|
||||||
|
},{
|
||||||
|
main: '#03152A',
|
||||||
|
selected: '#3B91FF',
|
||||||
|
alias: 'dark-blue' // 藏蓝
|
||||||
|
},{
|
||||||
|
main: '#2E241B',
|
||||||
|
selected: '#A48566',
|
||||||
|
alias: 'coffee' // 咖啡
|
||||||
|
},{
|
||||||
|
main: '#50314F',
|
||||||
|
selected: '#7A4D7B',
|
||||||
|
alias: 'purple-red' // 紫红
|
||||||
|
},{
|
||||||
|
main: '#344058',
|
||||||
|
logo: '#1E9FFF',
|
||||||
|
selected: '#1E9FFF',
|
||||||
|
alias: 'ocean' // 海洋
|
||||||
|
},{
|
||||||
|
main: '#3A3D49',
|
||||||
|
logo: '#2F9688',
|
||||||
|
selected: '#16b777',
|
||||||
|
alias: 'green' // 墨绿
|
||||||
|
},{
|
||||||
|
main: '#20222A',
|
||||||
|
logo: '#F78400',
|
||||||
|
selected: '#F78400',
|
||||||
|
alias: 'red' // 橙色
|
||||||
|
},{
|
||||||
|
main: '#28333E',
|
||||||
|
logo: '#AA3130',
|
||||||
|
selected: '#AA3130',
|
||||||
|
alias: 'fashion-red' // 时尚红
|
||||||
|
},{
|
||||||
|
main: '#24262F',
|
||||||
|
logo: '#3A3D49',
|
||||||
|
selected: '#16baaa',
|
||||||
|
alias: 'classic-black' // 经典黑
|
||||||
|
},{
|
||||||
|
logo: '#226A62',
|
||||||
|
header: '#2F9688',
|
||||||
|
alias: 'green-header' // 墨绿头
|
||||||
|
},{
|
||||||
|
main: '#344058',
|
||||||
|
logo: '#0085E8',
|
||||||
|
selected: '#1E9FFF',
|
||||||
|
header: '#1E9FFF',
|
||||||
|
alias: 'ocean-header' // 海洋头
|
||||||
|
},{
|
||||||
|
header: '#393D49',
|
||||||
|
alias: 'classic-black-header' // 经典黑头
|
||||||
|
},{
|
||||||
|
main: '#50314F',
|
||||||
|
logo: '#50314F',
|
||||||
|
selected: '#7A4D7B',
|
||||||
|
header: '#50314F',
|
||||||
|
alias: 'purple-red-header' // 紫红头
|
||||||
|
},{
|
||||||
|
main: '#28333E',
|
||||||
|
logo: '#28333E',
|
||||||
|
selected: '#AA3130',
|
||||||
|
header: '#AA3130',
|
||||||
|
alias: 'fashion-red-header' // 时尚红头
|
||||||
|
},{
|
||||||
|
main: '#28333E',
|
||||||
|
logo: '#16baaa',
|
||||||
|
selected: '#16baaa',
|
||||||
|
header: '#16baaa',
|
||||||
|
alias: 'green-header' // 墨绿头
|
||||||
|
},{
|
||||||
|
main: '#393D49',
|
||||||
|
logo: '#393D49',
|
||||||
|
selected: '#16baaa',
|
||||||
|
header: '#23262E',
|
||||||
|
alias: 'Classic-style1' // 经典风格1
|
||||||
|
},{
|
||||||
|
main: '#001529',
|
||||||
|
logo: '#001529',
|
||||||
|
selected: '#1890FF',
|
||||||
|
header: '#1890FF',
|
||||||
|
alias: 'Classic-style2' // 经典风格2
|
||||||
|
},{
|
||||||
|
main: '#25282A',
|
||||||
|
logo: '#25282A',
|
||||||
|
selected: '#35BDB2',
|
||||||
|
header: '#35BDB2',
|
||||||
|
alias: 'Classic-style3' // 经典风格3
|
||||||
|
}],
|
||||||
|
|
||||||
|
// 初始的颜色索引，对应上面的配色方案数组索引
|
||||||
|
// 如果本地已经有主题色记录，则以本地记录为优先，除非请求本地数据（localStorage）
|
||||||
|
initColorIndex: 0
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
40
src/res/index.js
Normal file
40
src/res/index.js
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
/**
|
||||||
|
* 初始化主题入口模块
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.extend({
|
||||||
|
setter: 'config' // 将 config.js 扩展到 layui 模块
|
||||||
|
}).define(['setter'], function(exports){
|
||||||
|
var setter = layui.setter;
|
||||||
|
|
||||||
|
// 将核心库扩展到 layui 模块
|
||||||
|
layui.each({
|
||||||
|
admin: 'admin',
|
||||||
|
view: 'view',
|
||||||
|
adminIndex: 'index'
|
||||||
|
}, function(modName, fileName){
|
||||||
|
var libs = {};
|
||||||
|
libs[modName] = '{/}'+ setter.paths.core +'/modules/'+ fileName;
|
||||||
|
layui.extend(libs);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 指定业务模块基础目录
|
||||||
|
layui.config({
|
||||||
|
base: setter.paths.modules
|
||||||
|
});
|
||||||
|
|
||||||
|
// 将业务模块中的特殊模块扩展到 layui 模块
|
||||||
|
layui.each(setter.extend, function(key, value){
|
||||||
|
var mods = {};
|
||||||
|
mods[key] = '{/}' + layui.cache.base + value;
|
||||||
|
layui.extend(mods);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 加载主题核心库入口模块
|
||||||
|
layui.use('adminIndex', function(){
|
||||||
|
layui.use('common'); // 加载公共业务模块，如不需要可剔除
|
||||||
|
|
||||||
|
// 输出模块 / 模块加载完毕标志
|
||||||
|
exports('index', layui.admin);
|
||||||
|
});
|
||||||
|
});
|
||||||
36
src/res/json/console/prograss.js
Normal file
36
src/res/json/console/prograss.js
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"prograss": "开会"
|
||||||
|
,"time": "一小时"
|
||||||
|
,"complete": "已完成"
|
||||||
|
,"LAY_CHECKED": true
|
||||||
|
},{
|
||||||
|
"prograss": "项目开发"
|
||||||
|
,"time": "两小时"
|
||||||
|
,"complete": "进行中"
|
||||||
|
,"LAY_CHECKED": true
|
||||||
|
},{
|
||||||
|
"prograss": "陪吃饭"
|
||||||
|
,"time": "一小时"
|
||||||
|
,"complete": "未完成"
|
||||||
|
},{
|
||||||
|
"prograss": "修改小bug"
|
||||||
|
,"time": "半小时"
|
||||||
|
,"complete": "未完成"
|
||||||
|
},{
|
||||||
|
"prograss": "修改大bug"
|
||||||
|
,"time": "两小时"
|
||||||
|
,"complete": "未完成"
|
||||||
|
},{
|
||||||
|
"prograss": "修改小bug"
|
||||||
|
,"time": "半小时"
|
||||||
|
,"complete": "未完成"
|
||||||
|
},{
|
||||||
|
"prograss": "修改大bug"
|
||||||
|
,"time": "两小时"
|
||||||
|
,"complete": "未完成"
|
||||||
|
}]
|
||||||
|
}
|
||||||
76
src/res/json/console/top-card.js
Normal file
76
src/res/json/console/top-card.js
Normal file
@@ -0,0 +1,76 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": 111
|
||||||
|
,"title": "热帖测试"
|
||||||
|
,"username": "test"
|
||||||
|
,"channel": "公告"
|
||||||
|
,"href": "http://www.baidu.com/jie/15697/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 222
|
||||||
|
,"title": "一周年"
|
||||||
|
,"username": "猫吃"
|
||||||
|
,"channel": "讨论"
|
||||||
|
,"href": "http://www.baidu.com/jie/16622/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "四个月的前端"
|
||||||
|
,"username": "fd"
|
||||||
|
,"channel": "分享"
|
||||||
|
,"href": "http://www.baidu.com/jie/16651/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
},{
|
||||||
|
"id": 333
|
||||||
|
,"title": "如何评价前端 UI 框架"
|
||||||
|
,"username": "张三"
|
||||||
|
,"channel": "提问"
|
||||||
|
,"href": "http://www.baidu.com/jie/9352/"
|
||||||
|
,"crt": 61632
|
||||||
|
}]
|
||||||
|
}
|
||||||
46
src/res/json/console/top-search.js
Normal file
46
src/res/json/console/top-search.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"keywords": "UI"
|
||||||
|
,"frequency": 8520
|
||||||
|
,"userNums": 2216
|
||||||
|
},{
|
||||||
|
"keywords": "layer 弹出层组件"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "此表格是静态模拟数据"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
},{
|
||||||
|
"keywords": "前端 UI"
|
||||||
|
,"frequency": 777
|
||||||
|
,"userNums": 333
|
||||||
|
}]
|
||||||
|
}
|
||||||
56
src/res/json/content/comment.js
Normal file
56
src/res/json/content/comment.js
Normal file
@@ -0,0 +1,56 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "001"
|
||||||
|
,"reviewers": "赵"
|
||||||
|
,"content": "我又爱上编程了"
|
||||||
|
,"commtime": 20160312
|
||||||
|
},{
|
||||||
|
"id": "002"
|
||||||
|
,"reviewers": "钱"
|
||||||
|
,"content": "女生出门要小心"
|
||||||
|
,"commtime": 20160821
|
||||||
|
},{
|
||||||
|
"id": "003"
|
||||||
|
,"reviewers": "孙"
|
||||||
|
,"content": "框架就用layui"
|
||||||
|
,"commtime": 20161212
|
||||||
|
},{
|
||||||
|
"id": "004"
|
||||||
|
,"reviewers": "李"
|
||||||
|
,"content": "心姐么么哒"
|
||||||
|
,"commtime": 20170311
|
||||||
|
},{
|
||||||
|
"id": "005"
|
||||||
|
,"reviewers": "周"
|
||||||
|
,"content": "希望明天是个好天气"
|
||||||
|
,"commtime": 20170612
|
||||||
|
},{
|
||||||
|
"id": "006"
|
||||||
|
,"reviewers": "吴"
|
||||||
|
,"content": "我又爱上编程了"
|
||||||
|
,"commtime": 20171112
|
||||||
|
},{
|
||||||
|
"id": "007"
|
||||||
|
,"reviewers": "郑"
|
||||||
|
,"content": "女生出门要小心"
|
||||||
|
,"commtime": 20171230
|
||||||
|
},{
|
||||||
|
"id": "008"
|
||||||
|
,"reviewers": "王"
|
||||||
|
,"content": "框架就用layui"
|
||||||
|
,"commtime": 20180112
|
||||||
|
},{
|
||||||
|
"id": "009"
|
||||||
|
,"reviewers": "冯"
|
||||||
|
,"content": "心姐么么哒"
|
||||||
|
,"commtime": 20180221
|
||||||
|
},{
|
||||||
|
"id": "010"
|
||||||
|
,"reviewers": "陈"
|
||||||
|
,"content": "希望明天是个好天气"
|
||||||
|
,"commtime": 20180312
|
||||||
|
}]
|
||||||
|
}
|
||||||
62
src/res/json/content/list.js
Normal file
62
src/res/json/content/list.js
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "001"
|
||||||
|
,"label": "美食"
|
||||||
|
,"title": "舌尖上的中国第一季"
|
||||||
|
,"author": "作者-1"
|
||||||
|
,"content": "通过中华美食的多个侧面，来展现食物给中国人生活带来的仪式、伦理等方面的文化；见识中国特色食材以及与食物相关、构成中国美食特有气质的一系列元素；了解中华饮食文化的精致和源远流长"
|
||||||
|
,"uploadtime": 20121204
|
||||||
|
,"status": true
|
||||||
|
},{
|
||||||
|
"id": "002"
|
||||||
|
,"label": "美食"
|
||||||
|
,"title": "舌尖上的中国第二季"
|
||||||
|
,"author": "作者-2"
|
||||||
|
,"content": "以食物为窗口，读懂中国——通过美食，使人们可以有滋有味地认知这个古老的东方国度。“一方水土一方人”，本片将通过展示人们日常生活中与美食相关的多重侧面，描绘与感知中国人的文化传统、家族观念、生活态度与故土难离。人们收获、保存、烹饪、生产美食，并在其过程中留存和传承食物所承载的味觉记忆、饮食习俗、文化样态与家常情感。"
|
||||||
|
,"uploadtime": 20141204
|
||||||
|
,"status": false
|
||||||
|
},{
|
||||||
|
"id": "003"
|
||||||
|
,"label": "美食"
|
||||||
|
,"title": "舌尖上的中国第三季"
|
||||||
|
,"author": "作者-3"
|
||||||
|
,"content": "以食物为窗口，读懂中国——通过美食，使人们可以有滋有味地认知这个古老的东方国度。“一方水土一方人”，本片将通过展示人们日常生活中与美食相关的多重侧面，描绘与感知中国人的文化传统、家族观念、生活态度与故土难离。人们收获、保存、烹饪、生产美食，并在其过程中留存和传承食物所承载的味觉记忆、饮食习俗、文化样态与家常情感将世界美食和中国美食进行比照。春耕、夏耘、秋收、冬藏，天人合一的东方哲学让中国饮食依时而变，智慧灵动，中医营养摄生学说创造了食材运用的新天地，儒家人伦道德则把心意和家的味道端上我们的餐桌。淘洗历史，糅合时光，一代又一代的中国人在天地间升起烟火，用至精至诚的心意烹制食物，一餐一食之间，中国人展示个性，确认归属，构建文明，理解和把握着世界的奥妙。"
|
||||||
|
,"uploadtime": 20161204
|
||||||
|
,"status": false
|
||||||
|
},{
|
||||||
|
"id": "004"
|
||||||
|
,"label": "历史"
|
||||||
|
,"title": "诸葛亮骂王朗"
|
||||||
|
,"author": "作者-1"
|
||||||
|
,"content": "皓首匹夫！苍髯老贼！你即将命归于九泉之下，届时，有何面目见汉朝二十四代先帝？二臣贼子！你枉活七十有六，一生未立寸功，只会摇唇舞舌，助曹为虐！一条断脊之犬，还敢在我军阵前狺狺狂吠！我从未见过如此厚颜无耻之人！！！"
|
||||||
|
,"uploadtime": 20180201
|
||||||
|
,"status": false
|
||||||
|
},{
|
||||||
|
"id": "005"
|
||||||
|
,"label": "新闻"
|
||||||
|
,"title": "新时代特色中国梦"
|
||||||
|
,"author": "作者-1"
|
||||||
|
,"content": "今天，我们比历史上任何时期都更接近、更有信心和能力实现中华民族伟大复兴的目标。新时代已经到来，蓝图已经绘就，中国梦离我们越来越近了。"
|
||||||
|
,"uploadtime": 20180512
|
||||||
|
,"status": false
|
||||||
|
},{
|
||||||
|
"id": "006"
|
||||||
|
,"label": "新闻"
|
||||||
|
,"title": "新时代特色中国梦"
|
||||||
|
,"author": "作者-2"
|
||||||
|
,"content": "梦想不会主动走向我们，只有我们去主动实现梦想。行百里者半九十。虽然中国梦离我们越来越近了，但是要实现中国梦，还要靠我们以永不懈怠的精神状态、功在不舍的坚强意志，不忘初心，继续前进。"
|
||||||
|
,"uploadtime": 20180514
|
||||||
|
,"status": false
|
||||||
|
},{
|
||||||
|
"id": "007"
|
||||||
|
,"label": "体育"
|
||||||
|
,"title": "皇马大战利物浦"
|
||||||
|
,"author": "作者-3"
|
||||||
|
,"content": "对欧足联而言，更想要产生个新冠军。连续三年都是同一个冠军队，这会毁掉欧冠……”格里姆表态，“皇马有梦幻般的阵容，但从促进竞争的角度而言，另一支球队获胜会更好。"
|
||||||
|
,"uploadtime": 20180515
|
||||||
|
,"status": false
|
||||||
|
}]
|
||||||
|
}
|
||||||
21
src/res/json/content/tags.js
Normal file
21
src/res/json/content/tags.js
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "001"
|
||||||
|
,"tags": "美食"
|
||||||
|
},{
|
||||||
|
"id": "002"
|
||||||
|
,"tags": "新闻"
|
||||||
|
},{
|
||||||
|
"id": "003"
|
||||||
|
,"tags": "八卦"
|
||||||
|
},{
|
||||||
|
"id": "004"
|
||||||
|
,"tags": "体育"
|
||||||
|
},{
|
||||||
|
"id": "005"
|
||||||
|
,"tags": "音乐"
|
||||||
|
}]
|
||||||
|
}
|
||||||
62
src/res/json/forum/list.js
Normal file
62
src/res/json/forum/list.js
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "1001"
|
||||||
|
,"poster": "赵"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "为什么花儿这么么红"
|
||||||
|
,"posttime": 20160805
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1002"
|
||||||
|
,"poster": "钱"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "喜欢张三，赞赞赞"
|
||||||
|
,"posttime": 20161205
|
||||||
|
,"top": true
|
||||||
|
},{
|
||||||
|
"id": "1003"
|
||||||
|
,"poster": "孙"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "明天就要考试了，好紧张，求保佑"
|
||||||
|
,"posttime": 20170405
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1004"
|
||||||
|
,"poster": "李"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "希望明天是个好天气"
|
||||||
|
,"posttime": 20171005
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1005"
|
||||||
|
,"poster": "周"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "女追男隔层纱，是不是真的"
|
||||||
|
,"posttime": 20180205
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1006"
|
||||||
|
,"poster": "吴"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "竟然有人！"
|
||||||
|
,"posttime": 20180512
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1007"
|
||||||
|
,"poster": "郑"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "咋了"
|
||||||
|
,"posttime": 20180512
|
||||||
|
,"top": false
|
||||||
|
},{
|
||||||
|
"id": "1008"
|
||||||
|
,"poster": "王"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "想知道南昌哪里有好吃的西安肉夹馍"
|
||||||
|
,"posttime": 20180514
|
||||||
|
,"top": false
|
||||||
|
}]
|
||||||
|
}
|
||||||
69
src/res/json/forum/replys.js
Normal file
69
src/res/json/forum/replys.js
Normal file
@@ -0,0 +1,69 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "001"
|
||||||
|
,"replyer": "吴"
|
||||||
|
,"cardid": "1002"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "有眼光，我也喜欢张三！"
|
||||||
|
,"replytime": 20161205
|
||||||
|
},{
|
||||||
|
"id": "002"
|
||||||
|
,"replyer": "郑"
|
||||||
|
,"cardid": "1002"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "同上同上。"
|
||||||
|
,"replytime": 20161205
|
||||||
|
},{
|
||||||
|
"id": "003"
|
||||||
|
,"replyer": "王"
|
||||||
|
,"cardid": "1003"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "能过一定过，不能过紧张也没用"
|
||||||
|
,"replytime": 20170405
|
||||||
|
},{
|
||||||
|
"id": "004"
|
||||||
|
,"replyer": "冯"
|
||||||
|
,"cardid": "1001"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "可能因为你。"
|
||||||
|
,"replytime": 20170405
|
||||||
|
},{
|
||||||
|
"id": "005"
|
||||||
|
,"replyer": "陈"
|
||||||
|
,"cardid": "1003"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "加油加油，看好你"
|
||||||
|
,"replytime": 20170405
|
||||||
|
},{
|
||||||
|
"id": "006"
|
||||||
|
,"replyer": "褚"
|
||||||
|
,"cardid": "1005"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "纯属喜爱"
|
||||||
|
,"replytime": 20180207
|
||||||
|
},{
|
||||||
|
"id": "007"
|
||||||
|
,"replyer": "卫"
|
||||||
|
,"cardid": "1005"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "可以试试"
|
||||||
|
,"replytime": 20180207
|
||||||
|
},{
|
||||||
|
"id": "006"
|
||||||
|
,"replyer": "蒋"
|
||||||
|
,"cardid": "1006"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "是啊是啊，太棒了。"
|
||||||
|
,"replytime": 20180512
|
||||||
|
},{
|
||||||
|
"id": "007"
|
||||||
|
,"replyer": "沈"
|
||||||
|
,"cardid": "1008"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"content": "魏家凉皮不错奥。"
|
||||||
|
,"replytime": 20180515
|
||||||
|
}]
|
||||||
|
}
|
||||||
96
src/res/json/layim/getList.js
Normal file
96
src/res/json/layim/getList.js
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"data": {
|
||||||
|
"mine": {
|
||||||
|
"username": "测试名称"
|
||||||
|
,"id": "100000"
|
||||||
|
,"status": "online"
|
||||||
|
,"sign": "测试"
|
||||||
|
,"avatar": ""
|
||||||
|
}
|
||||||
|
,"friend": [{
|
||||||
|
"groupname": "测试分组一"
|
||||||
|
,"id": 0
|
||||||
|
,"list": [{
|
||||||
|
"username": "测试1"
|
||||||
|
,"id": "100001"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容1"
|
||||||
|
,"status": "online"
|
||||||
|
},{
|
||||||
|
"username": "测试2"
|
||||||
|
,"id": "100001222"
|
||||||
|
,"sign": "测试内容2"
|
||||||
|
,"avatar": ""
|
||||||
|
},{
|
||||||
|
"username": "测试3"
|
||||||
|
,"id": "10034001"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": ""
|
||||||
|
},{
|
||||||
|
"username": "测试4"
|
||||||
|
,"id": "168168"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容4"
|
||||||
|
},{
|
||||||
|
"username": "测试5"
|
||||||
|
,"id": "777777"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容5"
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
"groupname": "测试分组二"
|
||||||
|
,"id": 1
|
||||||
|
,"list": [{
|
||||||
|
"username": "测试6"
|
||||||
|
,"id": "121286"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容6"
|
||||||
|
},{
|
||||||
|
"username": "测试7"
|
||||||
|
,"id": "108101"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "微电商达人"
|
||||||
|
},{
|
||||||
|
"username": "测试8"
|
||||||
|
,"id": "12123454"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容8"
|
||||||
|
},{
|
||||||
|
"username": "测试9"
|
||||||
|
,"id": "102101"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": ""
|
||||||
|
},{
|
||||||
|
"username": "测试10"
|
||||||
|
,"id": "3435343"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": ""
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
"groupname": "测试分组三"
|
||||||
|
,"id": 2
|
||||||
|
,"list": [{
|
||||||
|
"username": "测试11"
|
||||||
|
,"id": "76543"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容11"
|
||||||
|
},{
|
||||||
|
"username": "测试12"
|
||||||
|
,"id": "4803920"
|
||||||
|
,"avatar": ""
|
||||||
|
,"sign": "测试内容12"
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
,"group": [{
|
||||||
|
"groupname": "测试群组一"
|
||||||
|
,"id": "101"
|
||||||
|
,"avatar": ""
|
||||||
|
},{
|
||||||
|
"groupname": "测试群组二"
|
||||||
|
,"id": "102"
|
||||||
|
,"avatar": ""
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
46
src/res/json/message/all.js
Normal file
46
src/res/json/message/all.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": 60
|
||||||
|
,"data": [{
|
||||||
|
"id": 123
|
||||||
|
,"title": "Hello World"
|
||||||
|
,"time": 1510363800000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1507447570000
|
||||||
|
}]
|
||||||
|
}
|
||||||
46
src/res/json/message/direct.js
Normal file
46
src/res/json/message/direct.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": 60
|
||||||
|
,"data": [{
|
||||||
|
"id": 123
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510363800000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1507447570000
|
||||||
|
}]
|
||||||
|
}
|
||||||
46
src/res/json/message/notice.js
Normal file
46
src/res/json/message/notice.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": 60
|
||||||
|
,"data": [{
|
||||||
|
"id": 123
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510363800000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1510212370000
|
||||||
|
}, {
|
||||||
|
"id": 111
|
||||||
|
,"title": "一段模拟的测试私信"
|
||||||
|
,"time": 1507447570000
|
||||||
|
}]
|
||||||
|
}
|
||||||
216
src/res/json/table/demo.js
Normal file
216
src/res/json/table/demo.js
Normal file
@@ -0,0 +1,216 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": 1000
|
||||||
|
,"data": [{
|
||||||
|
"id": "10001"
|
||||||
|
,"username": "李白"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "君不见，黄河之水天上来，奔流到海不复回。 君不见，高堂明镜悲白发，朝如青丝暮成雪。 人生得意须尽欢，莫使金樽空对月。 天生我材必有用，千金散尽还复来。 烹羊宰牛且为乐，会须一饮三百杯。 岑夫子，丹丘生，将进酒，杯莫停。 与君歌一曲，请君为我倾耳听。(倾耳听 一作：侧耳听) 钟鼓馔玉不足贵，但愿长醉不复醒。(不足贵 一作：何足贵；不复醒 一作：不愿醒/不用醒) 古来圣贤皆寂寞，惟有饮者留其名。(古来 一作：自古；惟 通：唯) 陈王昔时宴平乐，斗酒十千恣欢谑。 主人何为言少钱，径须沽取对君酌。 五花马，千金裘，呼儿将出换美酒，与尔同销万古愁。"
|
||||||
|
,"experience": "12"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
,"LAY_CHECKED": true
|
||||||
|
}, {
|
||||||
|
"id": "10002"
|
||||||
|
,"username": "杜甫"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "舍南舍北皆春水，但见群鸥日日来。花径不曾缘客扫，蓬门今始为君开。盘飧市远无兼味，樽酒家贫只旧醅。肯与邻翁相对饮，隔篱呼取尽余杯。"
|
||||||
|
,"experience": "116"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "108"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10003"
|
||||||
|
,"username": "苏轼"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "大江东去，浪淘尽，千古风流人物。故垒西边，人道是，三国周郎赤壁。乱石穿空，惊涛拍岸，卷起千堆雪。江山如画，一时多少豪杰。遥想公瑾当年，小乔初嫁了，雄姿英发。羽扇纶巾，谈笑间，樯橹灰飞烟灭。故国神游，多情应笑我，早生华发。人生如梦，一尊还酹江月。"
|
||||||
|
,"experience": "65"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10004"
|
||||||
|
,"username": "李清照"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "777"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10005"
|
||||||
|
,"username": "冰心"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "86"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10006"
|
||||||
|
,"username": "张三"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "12"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10007"
|
||||||
|
,"username": "张三7"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "16"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10008"
|
||||||
|
,"username": "张三8"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10009"
|
||||||
|
,"username": "张三9"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10010"
|
||||||
|
,"username": "张三10"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10011"
|
||||||
|
,"username": "张三11"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10012"
|
||||||
|
,"username": "张三12"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10013"
|
||||||
|
,"username": "张三13"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10014"
|
||||||
|
,"username": "张三14"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10015"
|
||||||
|
,"username": "张三15"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10016"
|
||||||
|
,"username": "张三16"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10017"
|
||||||
|
,"username": "张三17"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10018"
|
||||||
|
,"username": "张三18"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10019"
|
||||||
|
,"username": "张三19"
|
||||||
|
,"email": "test@email.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "保持真善美，温和待人"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"checkin": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}]
|
||||||
|
}
|
||||||
61
src/res/json/table/demo2.js
Normal file
61
src/res/json/table/demo2.js
Normal file
@@ -0,0 +1,61 @@
|
|||||||
|
|
||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": 66
|
||||||
|
,"data": [{
|
||||||
|
"username": "张小三"
|
||||||
|
,"amount": 18
|
||||||
|
,"province": "浙江"
|
||||||
|
,"city": "杭州"
|
||||||
|
,"zone": "西湖区"
|
||||||
|
,"street": "西溪街道"
|
||||||
|
,"address": "西溪花园"
|
||||||
|
,"house": "x栋x单元"
|
||||||
|
}, {
|
||||||
|
"username": "李小四"
|
||||||
|
,"amount": 39
|
||||||
|
,"province": "江苏"
|
||||||
|
,"city": "苏州"
|
||||||
|
,"zone": "姑苏区"
|
||||||
|
,"street": "丝绸路"
|
||||||
|
,"address": "天墅之城"
|
||||||
|
,"house": "x幢x单元"
|
||||||
|
}, {
|
||||||
|
"username": "王小五"
|
||||||
|
,"amount": 8
|
||||||
|
,"province": "江西"
|
||||||
|
,"city": "南昌"
|
||||||
|
,"zone": "青山湖区"
|
||||||
|
,"street": "艾溪湖办事处"
|
||||||
|
,"address": "中兴和园"
|
||||||
|
,"house": "x幢x单元"
|
||||||
|
}, {
|
||||||
|
"username": "赵小六"
|
||||||
|
,"amount": 16
|
||||||
|
,"province": "福建"
|
||||||
|
,"city": "泉州"
|
||||||
|
,"zone": "丰泽区"
|
||||||
|
,"street": "南洋街道"
|
||||||
|
,"address": "南洋村"
|
||||||
|
,"house": "x幢x单元"
|
||||||
|
}, {
|
||||||
|
"username": "孙小七"
|
||||||
|
,"amount": 12
|
||||||
|
,"province": "湖北"
|
||||||
|
,"city": "武汉"
|
||||||
|
,"zone": "武昌区"
|
||||||
|
,"street": "武昌大道"
|
||||||
|
,"address": "两湖花园"
|
||||||
|
,"house": "x幢x单元"
|
||||||
|
}, {
|
||||||
|
"username": "周小八"
|
||||||
|
,"amount": 11
|
||||||
|
,"province": "安徽"
|
||||||
|
,"city": "黄山"
|
||||||
|
,"zone": "黄山区"
|
||||||
|
,"street": "汤口镇"
|
||||||
|
,"address": "温泉村"
|
||||||
|
,"house": "x号"
|
||||||
|
}]
|
||||||
|
}
|
||||||
96
src/res/json/table/demo3.js
Normal file
96
src/res/json/table/demo3.js
Normal file
@@ -0,0 +1,96 @@
|
|||||||
|
{
|
||||||
|
"status": 200
|
||||||
|
,"message": ""
|
||||||
|
,"total": 8
|
||||||
|
,"rows": {
|
||||||
|
"item": [{
|
||||||
|
"id": "10001"
|
||||||
|
,"username": "杜甫"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "点击此处，显示更多。当内容超出时，点击单元格会自动显示更多内容。"
|
||||||
|
,"experience": "116"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "108"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10002"
|
||||||
|
,"username": "李白"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "君不见，黄河之水天上来，奔流到海不复回。 君不见，高堂明镜悲白发，朝如青丝暮成雪。 人生得意须尽欢，莫使金樽空对月。 天生我材必有用，千金散尽还复来。 烹羊宰牛且为乐，会须一饮三百杯。 岑夫子，丹丘生，将进酒，杯莫停。 与君歌一曲，请君为我倾耳听。(倾耳听 一作：侧耳听) 钟鼓馔玉不足贵，但愿长醉不复醒。(不足贵 一作：何足贵；不复醒 一作：不愿醒/不用醒) 古来圣贤皆寂寞，惟有饮者留其名。(古来 一作：自古；惟 通：唯) 陈王昔时宴平乐，斗酒十千恣欢谑。 主人何为言少钱，径须沽取对君酌。 五花马，千金裘，呼儿将出换美酒，与尔同销万古愁。"
|
||||||
|
,"experience": "12"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10003"
|
||||||
|
,"username": "王勃"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "65"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10004"
|
||||||
|
,"username": "李清照"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "777"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10005"
|
||||||
|
,"username": "冰心"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "86"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10006"
|
||||||
|
,"username": "tester"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "12"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10007"
|
||||||
|
,"username": "tester"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "16"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}, {
|
||||||
|
"id": "10008"
|
||||||
|
,"username": "tester"
|
||||||
|
,"email": "xianxin@baidu.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"city": "浙江杭州"
|
||||||
|
,"sign": "人生恰似一场修行"
|
||||||
|
,"experience": "106"
|
||||||
|
,"ip": "192.168.0.8"
|
||||||
|
,"logins": "106"
|
||||||
|
,"joinTime": "2016-10-14"
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}
|
||||||
2
src/res/json/table/user.js
Normal file
2
src/res/json/table/user.js
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
|
||||||
|
{"code":0,"msg":"","count":1000,"data":[{"id":10000,"username":"user-0","sex":"女","city":"城市-0","sign":"签名-0","experience":255,"logins":24,"wealth":82830700,"classify":"作家","score":57},{"id":10001,"username":"user-1","sex":"男","city":"城市-1","sign":"签名-1","experience":884,"logins":58,"wealth":64928690,"classify":"词人","score":27},{"id":10002,"username":"user-2","sex":"女","city":"城市-2","sign":"签名-2","experience":650,"logins":77,"wealth":6298078,"classify":"酱油","score":31},{"id":10003,"username":"user-3","sex":"女","city":"城市-3","sign":"签名-3","experience":362,"logins":157,"wealth":37117017,"classify":"诗人","score":68},{"id":10004,"username":"user-4","sex":"男","city":"城市-4","sign":"签名-4","experience":807,"logins":51,"wealth":76263262,"classify":"作家","score":6},{"id":10005,"username":"user-5","sex":"女","city":"城市-5","sign":"签名-5","experience":173,"logins":68,"wealth":60344147,"classify":"作家","score":87},{"id":10006,"username":"user-6","sex":"女","city":"城市-6","sign":"签名-6","experience":982,"logins":37,"wealth":57768166,"classify":"作家","score":34},{"id":10007,"username":"user-7","sex":"男","city":"城市-7","sign":"签名-7","experience":727,"logins":150,"wealth":82030578,"classify":"作家","score":28},{"id":10008,"username":"user-8","sex":"男","city":"城市-8","sign":"签名-8","experience":951,"logins":133,"wealth":16503371,"classify":"词人","score":14},{"id":10009,"username":"user-9","sex":"女","city":"城市-9","sign":"签名-9","experience":484,"logins":25,"wealth":86801934,"classify":"词人","score":75}]}
|
||||||
5
src/res/json/treeTable/demo-1.json
Normal file
5
src/res/json/treeTable/demo-1.json
Normal file
File diff suppressed because one or more lines are too long
7
src/res/json/user/login.js
Normal file
7
src/res/json/user/login.js
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": "登入成功"
|
||||||
|
,"data": {
|
||||||
|
"access_token": "c262e61cd13ad99fc650e6908c7e5e65b63d2f32185ecfed6b801ee3fbdd5c0a"
|
||||||
|
}
|
||||||
|
}
|
||||||
5
src/res/json/user/logout.js
Normal file
5
src/res/json/user/logout.js
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": "退出成功"
|
||||||
|
,"data": null
|
||||||
|
}
|
||||||
78
src/res/json/useradmin/mangadmin.js
Normal file
78
src/res/json/useradmin/mangadmin.js
Normal file
@@ -0,0 +1,78 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "1001"
|
||||||
|
,"loginname": "admin"
|
||||||
|
,"telphone": "11111111111"
|
||||||
|
,"email": "111@qq.com"
|
||||||
|
,"role": "超级管理员"
|
||||||
|
,"jointime": "20150217"
|
||||||
|
,"check": true
|
||||||
|
},{
|
||||||
|
"id": "1002"
|
||||||
|
,"loginname": "common-1"
|
||||||
|
,"telphone": "22222222222"
|
||||||
|
,"email": "222@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20160217"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "1003"
|
||||||
|
,"loginname": "common-2"
|
||||||
|
,"telphone": "33333333333"
|
||||||
|
,"email": "333@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20161012"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "1004"
|
||||||
|
,"loginname": "common-3"
|
||||||
|
,"telphone": "44444444444"
|
||||||
|
,"email": "444@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20170518"
|
||||||
|
,"check": true
|
||||||
|
},{
|
||||||
|
"id": "1005"
|
||||||
|
,"loginname": "common-4"
|
||||||
|
,"telphone": "55555555555"
|
||||||
|
,"email": "555@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20180101"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "1006"
|
||||||
|
,"loginname": "common-5"
|
||||||
|
,"telphone": "123123123123"
|
||||||
|
,"email": "123@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20160217"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "1007"
|
||||||
|
,"loginname": "common-6"
|
||||||
|
,"telphone": "77777777777"
|
||||||
|
,"email": "777@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20161012"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "1008"
|
||||||
|
,"loginname": "common-7"
|
||||||
|
,"telphone": "88888888888"
|
||||||
|
,"email": "888@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20170518"
|
||||||
|
,"check": true
|
||||||
|
},{
|
||||||
|
"id": "1009"
|
||||||
|
,"loginname": "common-8"
|
||||||
|
,"telphone": "99999999999"
|
||||||
|
,"email": "999@qq.com"
|
||||||
|
,"role": "管理员"
|
||||||
|
,"jointime": "20180101"
|
||||||
|
,"check": false
|
||||||
|
}]
|
||||||
|
}
|
||||||
54
src/res/json/useradmin/role.js
Normal file
54
src/res/json/useradmin/role.js
Normal file
@@ -0,0 +1,54 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "1"
|
||||||
|
,"rolename": "超级管理员"
|
||||||
|
,"limits": "管理所有的管理员"
|
||||||
|
,"descr": "拥有至高无上的权利"
|
||||||
|
,"check": true
|
||||||
|
},{
|
||||||
|
"id": "2"
|
||||||
|
,"rolename": "管理员"
|
||||||
|
,"limits": "所有列表的管理"
|
||||||
|
,"descr": "事情很多，权力很大"
|
||||||
|
,"check": true
|
||||||
|
},{
|
||||||
|
"id": "3"
|
||||||
|
,"rolename": "文章撰写员"
|
||||||
|
,"limits": "负责文章的编写"
|
||||||
|
,"descr": "文采第一的人才集合"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "4"
|
||||||
|
,"rolename": "纠错员"
|
||||||
|
,"limits": "负责文章内容的修改"
|
||||||
|
,"descr": "暂无"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "5"
|
||||||
|
,"rolename": "统计人员"
|
||||||
|
,"limits": "对数据进行统计"
|
||||||
|
,"descr": "暂无"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "6"
|
||||||
|
,"rolename": "评估员"
|
||||||
|
,"limits": "对统计数据进行评估"
|
||||||
|
,"descr": "及时捕捉市场发展动态"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "7"
|
||||||
|
,"rolename": "采购员"
|
||||||
|
,"limits": "负责员工的伙食"
|
||||||
|
,"descr": "暂无"
|
||||||
|
,"check": false
|
||||||
|
},{
|
||||||
|
"id": "8"
|
||||||
|
,"rolename": "推销员"
|
||||||
|
,"limits": "介绍销售公司产品"
|
||||||
|
,"descr": "暂无"
|
||||||
|
,"check": false
|
||||||
|
}]
|
||||||
|
}
|
||||||
143
src/res/json/useradmin/webuser.js
Normal file
143
src/res/json/useradmin/webuser.js
Normal file
@@ -0,0 +1,143 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"id": "001"
|
||||||
|
,"username": "用户-1"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "002"
|
||||||
|
,"username": "用户-2"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "003"
|
||||||
|
,"username": "用户-3"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171011
|
||||||
|
,"LAY_CHECKED": true
|
||||||
|
},{
|
||||||
|
"id": "004"
|
||||||
|
,"username": "用户-4"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20160505
|
||||||
|
},{
|
||||||
|
"id": "005"
|
||||||
|
,"username": "用户-5"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "006"
|
||||||
|
,"username": "用户-6"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "007"
|
||||||
|
,"username": "用户-7"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20180210
|
||||||
|
},{
|
||||||
|
"id": "008"
|
||||||
|
,"username": "用户-8"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "009"
|
||||||
|
,"username": "用户-9"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "010"
|
||||||
|
,"username": "用户-10"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20170719
|
||||||
|
},{
|
||||||
|
"id": "011"
|
||||||
|
,"username": "用户-11"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "012"
|
||||||
|
,"username": "用户-12"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "013"
|
||||||
|
,"username": "用户-13"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "女"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
,"LAY_CHECKED": true
|
||||||
|
},{
|
||||||
|
"id": "014"
|
||||||
|
,"username": "用户-14"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
},{
|
||||||
|
"id": "015"
|
||||||
|
,"username": "用户-15"
|
||||||
|
,"avatar": "https://unpkg.com/outeres/demo/avatar/0.png"
|
||||||
|
,"phone": 12345678901
|
||||||
|
,"email": "11111@qq.com"
|
||||||
|
,"sex": "男"
|
||||||
|
,"ip": "1111111"
|
||||||
|
,"jointime": 20171204
|
||||||
|
}]
|
||||||
|
}
|
||||||
78
src/res/json/workorder/demo.js
Normal file
78
src/res/json/workorder/demo.js
Normal file
@@ -0,0 +1,78 @@
|
|||||||
|
{
|
||||||
|
"code": 0
|
||||||
|
,"msg": ""
|
||||||
|
,"count": "100"
|
||||||
|
,"data": [{
|
||||||
|
"orderid": 111
|
||||||
|
,"title": "移动支付踏入马来西亚，聚合支付紧随其后"
|
||||||
|
,"attr": "公告"
|
||||||
|
,"progress": "25%"
|
||||||
|
,"submit": "tester"
|
||||||
|
,"accept": "员工-1"
|
||||||
|
,"state": "处理中"
|
||||||
|
},{
|
||||||
|
"orderid": 222
|
||||||
|
,"title": "凡科拖拽式免费建站神器，享双重优惠！"
|
||||||
|
,"attr": "讨论"
|
||||||
|
,"progress": "100%"
|
||||||
|
,"submit": "猫吃"
|
||||||
|
,"accept": "员工-1"
|
||||||
|
,"state": "已处理"
|
||||||
|
},{
|
||||||
|
"orderid": 333
|
||||||
|
,"title": "看着别人的老板给员工送汽车有感"
|
||||||
|
,"attr": "分享"
|
||||||
|
,"progress": "0%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": ""
|
||||||
|
,"state": "未分配"
|
||||||
|
},{
|
||||||
|
"orderid": 444
|
||||||
|
,"title": "DISCUZ的云平台还有戏吗"
|
||||||
|
,"attr": "提问"
|
||||||
|
,"progress": "0%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": ""
|
||||||
|
,"state": "未分配"
|
||||||
|
},{
|
||||||
|
"orderid": 555
|
||||||
|
,"title": "现在个人网站还有必要长期坚持下去吗？"
|
||||||
|
,"attr": "提问"
|
||||||
|
,"progress": "50%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": "员工-2"
|
||||||
|
,"state": "处理中"
|
||||||
|
},{
|
||||||
|
"orderid": 55555
|
||||||
|
,"title": "求安排一个技术客服？"
|
||||||
|
,"attr": "公告"
|
||||||
|
,"progress": "25%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": "员工-3"
|
||||||
|
,"state": "处理中"
|
||||||
|
},{
|
||||||
|
"orderid": 777
|
||||||
|
,"title": "游戏 网页美工，一个月多少工资才正常？"
|
||||||
|
,"attr": "提问"
|
||||||
|
,"progress": "100%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": "员工-1"
|
||||||
|
,"state": "已处理"
|
||||||
|
},{
|
||||||
|
"orderid": 888
|
||||||
|
,"title": "几年没来了，蓝色理想帖子这么少了啊"
|
||||||
|
,"attr": "提问"
|
||||||
|
,"progress": "0%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": ""
|
||||||
|
,"state": "未分配"
|
||||||
|
},{
|
||||||
|
"orderid": 999
|
||||||
|
,"title": "我的天，求推荐靠谱的学习网站"
|
||||||
|
,"attr": "提问"
|
||||||
|
,"progress": "50%"
|
||||||
|
,"submit": "张三"
|
||||||
|
,"accept": "员工-2"
|
||||||
|
,"state": "处理中"
|
||||||
|
}]
|
||||||
|
}
|
||||||
1
src/res/layui/css/layui.css
Normal file
1
src/res/layui/css/layui.css
Normal file
File diff suppressed because one or more lines are too long
BIN
src/res/layui/font/iconfont.eot
Normal file
BIN
src/res/layui/font/iconfont.eot
Normal file
Binary file not shown.
405
src/res/layui/font/iconfont.svg
Normal file
405
src/res/layui/font/iconfont.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 322 KiB |
BIN
src/res/layui/font/iconfont.ttf
Normal file
BIN
src/res/layui/font/iconfont.ttf
Normal file
Binary file not shown.
BIN
src/res/layui/font/iconfont.woff
Normal file
BIN
src/res/layui/font/iconfont.woff
Normal file
Binary file not shown.
BIN
src/res/layui/font/iconfont.woff2
Normal file
BIN
src/res/layui/font/iconfont.woff2
Normal file
Binary file not shown.
1
src/res/layui/layui.js
Normal file
1
src/res/layui/layui.js
Normal file
File diff suppressed because one or more lines are too long
38
src/res/modules/common.js
Normal file
38
src/res/modules/common.js
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
/**
|
||||||
|
* common demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.define(function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,layer = layui.layer
|
||||||
|
,laytpl = layui.laytpl
|
||||||
|
,setter = layui.setter
|
||||||
|
,view = layui.view
|
||||||
|
,admin = layui.admin
|
||||||
|
|
||||||
|
//公共业务的逻辑处理可以写在此处，切换任何页面都会执行
|
||||||
|
//……
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//退出
|
||||||
|
admin.events.logout = function(){
|
||||||
|
//执行退出接口
|
||||||
|
admin.req({
|
||||||
|
url: layui.setter.paths.base + 'json/user/logout.js'
|
||||||
|
,type: 'get'
|
||||||
|
,data: {}
|
||||||
|
,done: function(res){ //这里要说明一下：done 是只有 response 的 code 正常才会执行。而 succese 则是只要 http 为 200 就会执行
|
||||||
|
|
||||||
|
//清空本地记录的 token，并跳转到登入页
|
||||||
|
admin.exit(function(){
|
||||||
|
location.href = 'user/login.html';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//对外暴露的接口
|
||||||
|
exports('common', {});
|
||||||
|
});
|
||||||
324
src/res/modules/console.js
Normal file
324
src/res/modules/console.js
Normal file
@@ -0,0 +1,324 @@
|
|||||||
|
/**
|
||||||
|
* console demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.define(function(exports){
|
||||||
|
|
||||||
|
/*
|
||||||
|
下面通过 layui.use 分段加载不同的模块，实现不同区域的同时渲染，从而保证视图的快速呈现
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
//区块轮播切换
|
||||||
|
layui.use(['admin', 'carousel'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,element = layui.element
|
||||||
|
,device = layui.device();
|
||||||
|
|
||||||
|
//轮播切换
|
||||||
|
$('.layadmin-carousel').each(function(){
|
||||||
|
var othis = $(this);
|
||||||
|
carousel.render({
|
||||||
|
elem: this
|
||||||
|
,width: '100%'
|
||||||
|
,arrow: 'none'
|
||||||
|
,interval: othis.data('interval')
|
||||||
|
,autoplay: othis.data('autoplay') === true
|
||||||
|
,trigger: (device.ios || device.android) ? 'click' : 'hover'
|
||||||
|
,anim: othis.data('anim')
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
element.render('progress');
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//数据概览
|
||||||
|
layui.use(['admin', 'carousel', 'echarts'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,echarts = layui.echarts;
|
||||||
|
|
||||||
|
var echartsApp = [], options = [
|
||||||
|
//今日流量趋势
|
||||||
|
{
|
||||||
|
title: {
|
||||||
|
text: '今日流量趋势',
|
||||||
|
x: 'center',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 14
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'axis'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
data:['','']
|
||||||
|
},
|
||||||
|
xAxis : [{
|
||||||
|
type : 'category',
|
||||||
|
boundaryGap : false,
|
||||||
|
data: ['06:00','06:30','07:00','07:30','08:00','08:30','09:00','09:30','10:00','11:30','12:00','12:30','13:00','13:30','14:00','14:30','15:00','15:30','16:00','16:30','17:00','17:30','18:00','18:30','19:00','19:30','20:00','20:30','21:00','21:30','22:00','22:30','23:00','23:30']
|
||||||
|
}],
|
||||||
|
yAxis : [{
|
||||||
|
type : 'value'
|
||||||
|
}],
|
||||||
|
series : [{
|
||||||
|
name:'PV',
|
||||||
|
type:'line',
|
||||||
|
smooth:true,
|
||||||
|
itemStyle: {normal: {areaStyle: {type: 'default'}}},
|
||||||
|
data: [111,222,333,444,555,888,3333,33333,55555,88888,33333,3333,8888,11888,28888,38888,58888,42222,39999,28888,17777,9555,6555,5555,3333,2222,3111,6999,5888,2777,1777,999,888,777]
|
||||||
|
},{
|
||||||
|
name:'UV',
|
||||||
|
type:'line',
|
||||||
|
smooth:true,
|
||||||
|
itemStyle: {normal: {areaStyle: {type: 'default'}}},
|
||||||
|
data: [11,22,33,44,55,66,333,3333,5555,12888,3333,333,888,1188,2888,3888,8888,4222,3999,2888,1777,966,655,555,333,222,311,699,588,277,166,99,88,77]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
|
||||||
|
/*
|
||||||
|
//访客浏览器分布
|
||||||
|
{
|
||||||
|
title : {
|
||||||
|
text: '访客浏览器分布',
|
||||||
|
x: 'center',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 14
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'item',
|
||||||
|
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
orient : 'vertical',
|
||||||
|
x : 'left',
|
||||||
|
data:['Chrome','Firefox','IE 8.0','Safari','其它浏览器']
|
||||||
|
},
|
||||||
|
series : [{
|
||||||
|
name:'访问来源',
|
||||||
|
type:'pie',
|
||||||
|
radius : '55%',
|
||||||
|
center: ['50%', '50%'],
|
||||||
|
data:[
|
||||||
|
{value:9052, name:'Chrome'},
|
||||||
|
{value:1610, name:'Firefox'},
|
||||||
|
{value:3200, name:'IE 8.0'},
|
||||||
|
{value:535, name:'Safari'},
|
||||||
|
{value:1700, name:'其它浏览器'}
|
||||||
|
]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
*/
|
||||||
|
|
||||||
|
//新增的用户量
|
||||||
|
{
|
||||||
|
title: {
|
||||||
|
text: '最近一周新增的用户量',
|
||||||
|
x: 'center',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 14
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip : { //提示框
|
||||||
|
trigger: 'axis',
|
||||||
|
formatter: "{b}<br>新增用户：{c}"
|
||||||
|
},
|
||||||
|
xAxis : [{ //X轴
|
||||||
|
type : 'category',
|
||||||
|
data : ['11-07', '11-08', '11-09', '11-10', '11-11', '11-12', '11-13']
|
||||||
|
}],
|
||||||
|
yAxis : [{ //Y轴
|
||||||
|
type : 'value'
|
||||||
|
}],
|
||||||
|
series : [{ //内容
|
||||||
|
type: 'line',
|
||||||
|
data:[200, 300, 400, 610, 150, 270, 380],
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
,elemDataView = $('#LAY-index-dataview').children('div')
|
||||||
|
,renderDataView = function(index){
|
||||||
|
echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
|
||||||
|
echartsApp[index].setOption(options[index]);
|
||||||
|
//window.onresize = echartsApp[index].resize;
|
||||||
|
admin.resize(function(){
|
||||||
|
echartsApp[index].resize();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//没找到DOM，终止执行
|
||||||
|
if(!elemDataView[0]) return;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
renderDataView(0);
|
||||||
|
|
||||||
|
//触发数据概览轮播
|
||||||
|
var carouselIndex = 0;
|
||||||
|
carousel.on('change(LAY-index-dataview)', function(obj){
|
||||||
|
renderDataView(carouselIndex = obj.index);
|
||||||
|
});
|
||||||
|
|
||||||
|
//触发侧边伸缩
|
||||||
|
layui.admin.on('side', function(){
|
||||||
|
setTimeout(function(){
|
||||||
|
renderDataView(carouselIndex);
|
||||||
|
}, 300);
|
||||||
|
});
|
||||||
|
|
||||||
|
//触发路由
|
||||||
|
layui.admin.on('hash(tab)', function(){
|
||||||
|
layui.router().path.join('') || renderDataView(carouselIndex);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
//地图
|
||||||
|
layui.use(['carousel', 'echarts'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,echarts = layui.echarts;
|
||||||
|
|
||||||
|
var echartsApp = [], options = [
|
||||||
|
{
|
||||||
|
title : {
|
||||||
|
text: '访客地区分布',
|
||||||
|
subtext: '不完全统计'
|
||||||
|
},
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'item'
|
||||||
|
},
|
||||||
|
dataRange: {
|
||||||
|
orient: 'horizontal',
|
||||||
|
min: 0,
|
||||||
|
max: 60000,
|
||||||
|
text:['高','低'],
|
||||||
|
splitNumber:0
|
||||||
|
},
|
||||||
|
series : [
|
||||||
|
{
|
||||||
|
name: '访客地区分布',
|
||||||
|
type: 'map',
|
||||||
|
mapType: 'china',
|
||||||
|
selectedMode : 'multiple',
|
||||||
|
itemStyle:{
|
||||||
|
normal:{label:{show:true}},
|
||||||
|
emphasis:{label:{show:true}}
|
||||||
|
},
|
||||||
|
data:[
|
||||||
|
{name:'西藏', value:60},
|
||||||
|
{name:'青海', value:167},
|
||||||
|
{name:'宁夏', value:210},
|
||||||
|
{name:'海南', value:252},
|
||||||
|
{name:'甘肃', value:502},
|
||||||
|
{name:'贵州', value:570},
|
||||||
|
{name:'新疆', value:661},
|
||||||
|
{name:'云南', value:8890},
|
||||||
|
{name:'重庆', value:10010},
|
||||||
|
{name:'吉林', value:5056},
|
||||||
|
{name:'山西', value:2123},
|
||||||
|
{name:'天津', value:9130},
|
||||||
|
{name:'江西', value:10170},
|
||||||
|
{name:'广西', value:6172},
|
||||||
|
{name:'陕西', value:9251},
|
||||||
|
{name:'黑龙江', value:5125},
|
||||||
|
{name:'内蒙古', value:1435},
|
||||||
|
{name:'安徽', value:9530},
|
||||||
|
{name:'北京', value:51919},
|
||||||
|
{name:'福建', value:3756},
|
||||||
|
{name:'上海', value:59190},
|
||||||
|
{name:'湖北', value:37109},
|
||||||
|
{name:'湖南', value:8966},
|
||||||
|
{name:'四川', value:31020},
|
||||||
|
{name:'辽宁', value:7222},
|
||||||
|
{name:'河北', value:3451},
|
||||||
|
{name:'河南', value:9693},
|
||||||
|
{name:'浙江', value:62310},
|
||||||
|
{name:'山东', value:39231},
|
||||||
|
{name:'江苏', value:35911},
|
||||||
|
{name:'广东', value:55891}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
,elemDataView = $('#LAY-index-pagethree-home').children('div')
|
||||||
|
,renderDataView = function(index){
|
||||||
|
echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
|
||||||
|
echartsApp[index].setOption(options[index]);
|
||||||
|
window.onresize = echartsApp[index].resize;
|
||||||
|
};
|
||||||
|
//没找到DOM，终止执行
|
||||||
|
if(!elemDataView[0]) return;
|
||||||
|
|
||||||
|
renderDataView(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
//最新订单
|
||||||
|
layui.use('table', function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
//今日热搜
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-index-topSearch'
|
||||||
|
,url: layui.setter.paths.base + 'json/console/top-search.js' //模拟接口
|
||||||
|
,page: true
|
||||||
|
,cols: [[
|
||||||
|
{type: 'numbers', fixed: 'left'}
|
||||||
|
,{field: 'keywords', title: '关键词', minWidth: 300, templet: '<div><a href="https://www.baidu.com/s?wd={{ d.keywords }}" target="_blank" class="layui-table-link">{{ d.keywords }}</div>'}
|
||||||
|
,{field: 'frequency', title: '搜索次数', minWidth: 120, sort: true}
|
||||||
|
,{field: 'userNums', title: '用户数', sort: true}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
//今日热贴
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-index-topCard'
|
||||||
|
,url: layui.setter.paths.base + 'json/console/top-card.js' //模拟接口
|
||||||
|
,page: true
|
||||||
|
,cellMinWidth: 120
|
||||||
|
,cols: [[
|
||||||
|
{type: 'numbers', fixed: 'left'}
|
||||||
|
,{field: 'title', title: '标题', minWidth: 300, templet: '<div><a href="{{ d.href }}" target="_blank" class="layui-table-link">{{ d.title }}</div>'}
|
||||||
|
,{field: 'username', title: '发帖者'}
|
||||||
|
,{field: 'channel', title: '类别'}
|
||||||
|
,{field: 'crt', title: '点击率', sort: true}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
//项目进展
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-home-homepage-console'
|
||||||
|
,url: layui.setter.paths.base + 'json/console/prograss.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'prograss', title: '任务'}
|
||||||
|
,{field: 'time', title: '所需时间'}
|
||||||
|
,{field: 'complete', title: '完成情况'
|
||||||
|
,templet: function(d){
|
||||||
|
if(d.complete == '已完成'){
|
||||||
|
return '<del style="color: #16b777;">'+ d.complete +'</del>'
|
||||||
|
}else if(d.complete == '进行中'){
|
||||||
|
return '<span style="color: #FFB800;">'+ d.complete +'</span>'
|
||||||
|
}else{
|
||||||
|
return '<span style="color: #FF5722;">'+ d.complete +'</span>'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('console', {})
|
||||||
|
});
|
||||||
189
src/res/modules/contlist.js
Normal file
189
src/res/modules/contlist.js
Normal file
@@ -0,0 +1,189 @@
|
|||||||
|
/**
|
||||||
|
* 内容系统 demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(['table', 'form'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
//文章管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-content-list'
|
||||||
|
,url: layui.setter.paths.base + 'json/content/list.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: '文章ID', sort: true}
|
||||||
|
,{field: 'label', title: '文章标签', minWidth: 100}
|
||||||
|
,{field: 'title', title: '文章标题'}
|
||||||
|
,{field: 'author', title: '作者'}
|
||||||
|
,{field: 'uploadtime', title: '上传时间', sort: true}
|
||||||
|
,{field: 'status', title: '发布状态', templet: '#buttonTpl', minWidth: 80, align: 'center'}
|
||||||
|
,{title: '操作', minWidth: 150, align: 'center', fixed: 'right', toolbar: '#table-content-list'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 10
|
||||||
|
,limits: [10, 15, 20, 25, 30]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-app-content-list)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此文章？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit'){
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑文章'
|
||||||
|
,content: '../../../views/app/content/listform.html?id='+ data.id
|
||||||
|
,maxmin: true
|
||||||
|
,area: ['550px', '550px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submit = layero.find('iframe').contents().find("#layuiadmin-app-form-edit");
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit(layuiadmin-app-form-edit)', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
obj.update({
|
||||||
|
label: field.label
|
||||||
|
,title: field.title
|
||||||
|
,author: field.author
|
||||||
|
,status: field.status
|
||||||
|
}); //数据更新
|
||||||
|
|
||||||
|
form.render();
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//分类管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-content-tags'
|
||||||
|
,url: layui.setter.paths.base + 'json/content/tags.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'numbers', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: 'ID', sort: true}
|
||||||
|
,{field: 'tags', title: '分类名', minWidth: 100}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#layuiadmin-app-cont-tagsbar'}
|
||||||
|
]]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-app-content-tags)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此分类？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑分类'
|
||||||
|
,content: '../../../views/app/content/tagsform.html?id='+ data.id
|
||||||
|
,area: ['450px', '200px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
//获取iframe元素的值
|
||||||
|
var othis = layero.find('iframe').contents().find("#layuiadmin-app-form-tags")
|
||||||
|
,tags = othis.find('input[name="tags"]').val();
|
||||||
|
|
||||||
|
if(!tags.replace(/\s/g, '')) return;
|
||||||
|
|
||||||
|
obj.update({
|
||||||
|
tags: tags
|
||||||
|
});
|
||||||
|
layer.close(index);
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
//给iframe元素赋值
|
||||||
|
var othis = layero.find('iframe').contents().find("#layuiadmin-app-form-tags").click();
|
||||||
|
var iframeWin = window[layero.find('iframe')[0]['name']];
|
||||||
|
|
||||||
|
iframeWin.layui.use('form', function(form){
|
||||||
|
form.val('layuiadmin-form-tags', {
|
||||||
|
tags: data.tags
|
||||||
|
})
|
||||||
|
});
|
||||||
|
//othis.find('input[name="tags"]').val(data.tags);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//评论管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-content-comm'
|
||||||
|
,url: layui.setter.paths.base + 'json/content/comment.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: 'ID', sort: true}
|
||||||
|
,{field: 'reviewers', title: '评论者', minWidth: 100}
|
||||||
|
,{field: 'content', title: '评论内容', minWidth: 100}
|
||||||
|
,{field: 'commtime', title: '评论时间', minWidth: 100, sort: true}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-content-com'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 10
|
||||||
|
,limits: [10, 15, 20, 25, 30]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-app-content-comm)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此条评论？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit') {
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑评论'
|
||||||
|
,content: '../../../views/app/content/contform.html'
|
||||||
|
,area: ['450px', '300px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submitID = 'layuiadmin-app-comm-submit'
|
||||||
|
,submit = layero.find('iframe').contents().find('#'+ submitID);
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-app-content-comm'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('contlist', {})
|
||||||
|
});
|
||||||
39
src/res/modules/echarts.js
Normal file
39
src/res/modules/echarts.js
Normal file
File diff suppressed because one or more lines are too long
262
src/res/modules/echartsTheme.js
Normal file
262
src/res/modules/echartsTheme.js
Normal file
@@ -0,0 +1,262 @@
|
|||||||
|
/**
|
||||||
|
* Set echarts theme
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(function(exports) {
|
||||||
|
exports('echartsTheme', {
|
||||||
|
// 默认色板
|
||||||
|
color: [
|
||||||
|
'#16baaa','#1E9FFF','#16b777','#FFB980','#D87A80',
|
||||||
|
'#8d98b3','#e5cf0d','#97b552','#95706d','#dc69aa',
|
||||||
|
'#07a2a4','#9a7fd1','#588dd5','#f5994e','#c05050',
|
||||||
|
'#59678c','#c9ab00','#7eb00a','#6f5553','#c14089'
|
||||||
|
],
|
||||||
|
|
||||||
|
// 图表标题
|
||||||
|
title: {
|
||||||
|
textStyle: {
|
||||||
|
fontWeight: 'normal',
|
||||||
|
color: '#666' // 主标题文字颜色
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 值域
|
||||||
|
dataRange: {
|
||||||
|
itemWidth: 15,
|
||||||
|
color: ['#16baaa','#e0ffff']
|
||||||
|
},
|
||||||
|
|
||||||
|
// 工具箱
|
||||||
|
toolbox: {
|
||||||
|
color : ['#1e90ff', '#1e90ff', '#1e90ff', '#1e90ff'],
|
||||||
|
effectiveColor : '#ff4500'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 提示框
|
||||||
|
tooltip: {
|
||||||
|
backgroundColor: 'rgba(50,50,50,0.5)', // 提示背景颜色，默认为透明度为0.7的黑色
|
||||||
|
axisPointer : { // 坐标轴指示器，坐标轴触发有效
|
||||||
|
type : 'line', // 默认为直线，可选为：'line' | 'shadow'
|
||||||
|
lineStyle : { // 直线指示器样式设置
|
||||||
|
color: '#16baaa'
|
||||||
|
},
|
||||||
|
crossStyle: {
|
||||||
|
color: '#008acd'
|
||||||
|
},
|
||||||
|
shadowStyle : { // 阴影指示器样式设置
|
||||||
|
color: 'rgba(200,200,200,0.2)'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 区域缩放控制器
|
||||||
|
dataZoom: {
|
||||||
|
dataBackgroundColor: '#efefff', // 数据背景颜色
|
||||||
|
fillerColor: 'rgba(182,162,222,0.2)', // 填充颜色
|
||||||
|
handleColor: '#008acd' // 手柄颜色
|
||||||
|
},
|
||||||
|
|
||||||
|
// 网格
|
||||||
|
grid: {
|
||||||
|
borderColor: '#eee'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 类目轴 - X轴
|
||||||
|
categoryAxis: {
|
||||||
|
axisLine: { // 坐标轴线
|
||||||
|
lineStyle: { // 属性lineStyle控制线条样式
|
||||||
|
color: '#16baaa'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: { //小标记
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
splitLine: { // 分隔线
|
||||||
|
lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
|
||||||
|
color: ['#eee']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 数值型坐标轴默认参数 - Y轴
|
||||||
|
valueAxis: {
|
||||||
|
axisLine: { // 坐标轴线
|
||||||
|
lineStyle: { // 属性lineStyle控制线条样式
|
||||||
|
color: '#16baaa'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitArea : {
|
||||||
|
show : true,
|
||||||
|
areaStyle : {
|
||||||
|
color: ['rgba(250,250,250,0.1)','rgba(200,200,200,0.1)']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine: { // 分隔线
|
||||||
|
lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
|
||||||
|
color: ['#eee']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
polar : {
|
||||||
|
axisLine: { // 坐标轴线
|
||||||
|
lineStyle: { // 属性lineStyle控制线条样式
|
||||||
|
color: '#ddd'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitArea : {
|
||||||
|
show : true,
|
||||||
|
areaStyle : {
|
||||||
|
color: ['rgba(250,250,250,0.2)','rgba(200,200,200,0.2)']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine : {
|
||||||
|
lineStyle : {
|
||||||
|
color : '#ddd'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
timeline : {
|
||||||
|
lineStyle : {
|
||||||
|
color : '#16baaa'
|
||||||
|
},
|
||||||
|
controlStyle : {
|
||||||
|
normal : { color : '#16baaa'},
|
||||||
|
emphasis : { color : '#16baaa'}
|
||||||
|
},
|
||||||
|
symbol : 'emptyCircle',
|
||||||
|
symbolSize : 3
|
||||||
|
},
|
||||||
|
|
||||||
|
// 柱形图默认参数
|
||||||
|
bar: {
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
barBorderRadius: 2
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
barBorderRadius: 2
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 折线图默认参数
|
||||||
|
line: {
|
||||||
|
smooth : true,
|
||||||
|
symbol: 'emptyCircle', // 拐点图形类型
|
||||||
|
symbolSize: 3 // 拐点图形大小
|
||||||
|
},
|
||||||
|
|
||||||
|
// K线图默认参数
|
||||||
|
k: {
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: '#d87a80', // 阳线填充颜色
|
||||||
|
color0: '#2ec7c9', // 阴线填充颜色
|
||||||
|
lineStyle: {
|
||||||
|
color: '#d87a80', // 阳线边框颜色
|
||||||
|
color0: '#2ec7c9' // 阴线边框颜色
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 散点图默认参数
|
||||||
|
scatter: {
|
||||||
|
symbol: 'circle', // 图形类型
|
||||||
|
symbolSize: 4 // 图形大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
|
||||||
|
},
|
||||||
|
|
||||||
|
// 雷达图默认参数
|
||||||
|
radar : {
|
||||||
|
symbol: 'emptyCircle', // 图形类型
|
||||||
|
symbolSize:3
|
||||||
|
//symbol: null, // 拐点图形类型
|
||||||
|
//symbolRotate : null, // 图形旋转控制
|
||||||
|
},
|
||||||
|
|
||||||
|
map: {
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
areaStyle: {
|
||||||
|
color: '#ddd'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
textStyle: {
|
||||||
|
color: '#d87a80'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
emphasis: { // 也是选中样式
|
||||||
|
areaStyle: {
|
||||||
|
color: '#fe994e'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
force : {
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
linkStyle : {
|
||||||
|
color : '#1e90ff'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
chord : {
|
||||||
|
itemStyle : {
|
||||||
|
normal : {
|
||||||
|
borderWidth: 1,
|
||||||
|
borderColor: 'rgba(128, 128, 128, 0.5)',
|
||||||
|
chordStyle : {
|
||||||
|
lineStyle : {
|
||||||
|
color : 'rgba(128, 128, 128, 0.5)'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
emphasis : {
|
||||||
|
borderWidth: 1,
|
||||||
|
borderColor: 'rgba(128, 128, 128, 0.5)',
|
||||||
|
chordStyle : {
|
||||||
|
lineStyle : {
|
||||||
|
color : 'rgba(128, 128, 128, 0.5)'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
gauge : {
|
||||||
|
axisLine: { // 坐标轴线
|
||||||
|
lineStyle: { // 属性lineStyle控制线条样式
|
||||||
|
color: [[0.2, '#2ec7c9'],[0.8, '#5ab1ef'],[1, '#d87a80']],
|
||||||
|
width: 10
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: { // 坐标轴小标记
|
||||||
|
splitNumber: 10, // 每份split细分多少段
|
||||||
|
length :15, // 属性length控制线长
|
||||||
|
lineStyle: { // 属性lineStyle控制线条样式
|
||||||
|
color: 'auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
splitLine: { // 分隔线
|
||||||
|
length :22, // 属性length控制线长
|
||||||
|
lineStyle: { // 属性lineStyle（详见lineStyle）控制线条样式
|
||||||
|
color: 'auto'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
pointer : {
|
||||||
|
width : 5
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
textStyle: {
|
||||||
|
fontFamily: '微软雅黑, Arial, Verdana, sans-serif'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
130
src/res/modules/forum.js
Normal file
130
src/res/modules/forum.js
Normal file
@@ -0,0 +1,130 @@
|
|||||||
|
/**
|
||||||
|
* forum demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.define(['table', 'form'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
//帖子管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-forum-list'
|
||||||
|
,url: layui.setter.paths.base + 'json/forum/list.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: 'ID', sort: true}
|
||||||
|
,{field: 'poster', title: '发帖人'}
|
||||||
|
,{field: 'avatar', title: '头像', width: 100, templet: '#imgTpl'}
|
||||||
|
,{field: 'content', title: '发帖内容'}
|
||||||
|
,{field: 'posttime', title: '发帖时间', sort: true}
|
||||||
|
,{field: 'top', title: '置顶', templet: '#buttonTpl', minWidth: 80, align: 'center'}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-forum-list'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 10
|
||||||
|
,limits: [10, 15, 20, 25, 30]
|
||||||
|
,text: '加载出现异常'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-app-forum-list)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此条帖子？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑帖子'
|
||||||
|
,content: '../../../views/app/forum/listform.html'
|
||||||
|
,area: ['550px', '400px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,resize: false
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submitID = 'LAY-app-forum-submit'
|
||||||
|
,submit = layero.find('iframe').contents().find('#'+ submitID);
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-app-forum-list'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//回帖管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-forumreply-list'
|
||||||
|
,url: layui.setter.paths.base + 'json/forum/replys.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: 'ID', sort: true}
|
||||||
|
,{field: 'replyer', title: '回帖人'}
|
||||||
|
,{field: 'cardid', title: '回帖ID', sort: true}
|
||||||
|
,{field: 'avatar', title: '头像', width: 100, templet: '#imgTpl'}
|
||||||
|
,{field: 'content', title: '回帖内容', width: 200}
|
||||||
|
,{field: 'replytime', title: '回帖时间', sort: true}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-forum-replys'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 10
|
||||||
|
,limits: [10, 15, 20, 25, 30]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-app-forumreply-list)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此条评论？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑评论'
|
||||||
|
,content: '../../../views/app/forum/replysform.html'
|
||||||
|
,area: ['550px', '350px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,resize: false
|
||||||
|
,yes: function(index, layero){
|
||||||
|
//获取iframe元素的值
|
||||||
|
var othis = layero.find('iframe').contents().find("#layuiadmin-form-replys");
|
||||||
|
var content = othis.find('textarea[name="content"]').val();
|
||||||
|
|
||||||
|
//数据更新
|
||||||
|
obj.update({
|
||||||
|
content: content
|
||||||
|
});
|
||||||
|
layer.close(index);
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('forum', {})
|
||||||
|
});
|
||||||
1
src/res/modules/layim/layim.js
Normal file
1
src/res/modules/layim/layim.js
Normal file
File diff suppressed because one or more lines are too long
44
src/res/modules/layim/res/html/find.html
Normal file
44
src/res/modules/layim/res/html/find.html
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
|
<title>发现</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div style="margin: 15px;">
|
||||||
|
<blockquote class="layui-elem-quote">
|
||||||
|
通过 find 参数指向的自定义页面
|
||||||
|
</blockquote>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
layimPath: '../../' //配置 layim.js 所在目录
|
||||||
|
,layimResPath: '../' //layim 资源文件所在目录
|
||||||
|
}).extend({
|
||||||
|
layim: layui.cache.layimPath + 'layim' //配置 layim 组件所在的路径
|
||||||
|
}).use(['layim', 'laypage'], function(){
|
||||||
|
var layim = layui.layim
|
||||||
|
,layer = layui.layer
|
||||||
|
,laytpl = layui.laytpl
|
||||||
|
,$ = layui.jquery
|
||||||
|
,laypage = layui.laypage;
|
||||||
|
|
||||||
|
//一些添加好友请求之类的交互参见文档
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
72
src/res/modules/layim/res/html/getmsg.json
Normal file
72
src/res/modules/layim/res/html/getmsg.json
Normal file
@@ -0,0 +1,72 @@
|
|||||||
|
{
|
||||||
|
"code": 0,
|
||||||
|
"pages": 1,
|
||||||
|
"data": [
|
||||||
|
{
|
||||||
|
"id": 76,
|
||||||
|
"content": "申请添加你为好友",
|
||||||
|
"uid": 168,
|
||||||
|
"from": 166488,
|
||||||
|
"from_group": 0,
|
||||||
|
"type": 1,
|
||||||
|
"remark": "test1",
|
||||||
|
"href": null,
|
||||||
|
"read": 1,
|
||||||
|
"time": "刚刚",
|
||||||
|
"user": {
|
||||||
|
"id": 166488,
|
||||||
|
"avatar": "http://q.qlogo.cn/qqapp/101235792/B704597964F9BD0DB648292D1B09F7E8/100",
|
||||||
|
"username": "测试A",
|
||||||
|
"sign": null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": 75,
|
||||||
|
"content": "申请添加你为好友",
|
||||||
|
"uid": 168,
|
||||||
|
"from": 347592,
|
||||||
|
"from_group": 0,
|
||||||
|
"type": 1,
|
||||||
|
"remark": "test2",
|
||||||
|
"href": null,
|
||||||
|
"read": 1,
|
||||||
|
"time": "刚刚",
|
||||||
|
"user": {
|
||||||
|
"id": 347592,
|
||||||
|
"avatar": "http://q.qlogo.cn/qqapp/101235792/B78751375E0531675B1272AD994BA875/100",
|
||||||
|
"username": "测试B",
|
||||||
|
"sign": null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": 62,
|
||||||
|
"content": "测试C 拒绝了你的好友申请",
|
||||||
|
"uid": 168,
|
||||||
|
"from": null,
|
||||||
|
"from_group": null,
|
||||||
|
"type": 1,
|
||||||
|
"remark": null,
|
||||||
|
"href": null,
|
||||||
|
"read": 1,
|
||||||
|
"time": "10天前",
|
||||||
|
"user": {
|
||||||
|
"id": null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"id": 60,
|
||||||
|
"content": "测试D 已经同意你的好友申请",
|
||||||
|
"uid": 168,
|
||||||
|
"from": null,
|
||||||
|
"from_group": null,
|
||||||
|
"type": 1,
|
||||||
|
"remark": null,
|
||||||
|
"href": null,
|
||||||
|
"read": 1,
|
||||||
|
"time": "10天前",
|
||||||
|
"user": {
|
||||||
|
"id": null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
220
src/res/modules/layim/res/html/msgbox.html
Normal file
220
src/res/modules/layim/res/html/msgbox.html
Normal file
@@ -0,0 +1,220 @@
|
|||||||
|
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||||
|
<title>消息盒子</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
|
||||||
|
<style>
|
||||||
|
.layim-msgbox{margin: 15px;}
|
||||||
|
.layim-msgbox li{position: relative; margin-bottom: 10px; padding: 0 130px 10px 60px; padding-bottom: 10px; line-height: 22px; border-bottom: 1px dotted #e2e2e2;}
|
||||||
|
.layim-msgbox .layim-msgbox-tips{margin: 0; padding: 10px 0; border: none; text-align: center; color: #999;}
|
||||||
|
.layim-msgbox .layim-msgbox-system{padding: 0 10px 10px 10px;}
|
||||||
|
.layim-msgbox li p span{padding-left: 5px; color: #999;}
|
||||||
|
.layim-msgbox li p em{font-style: normal; color: #FF5722;}
|
||||||
|
|
||||||
|
.layim-msgbox-avatar{position: absolute; left: 0; top: 0; width: 50px; height: 50px;}
|
||||||
|
.layim-msgbox-user{padding-top: 5px;}
|
||||||
|
.layim-msgbox-content{margin-top: 3px;}
|
||||||
|
.layim-msgbox .layui-btn-small{padding: 0 15px; margin-left: 5px;}
|
||||||
|
.layim-msgbox-btn{position: absolute; right: 0; top: 12px; color: #999;}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<ul class="layim-msgbox" id="LAY_view"></ul>
|
||||||
|
|
||||||
|
<div style="margin: 0 15px;">
|
||||||
|
<blockquote class="layui-elem-quote">
|
||||||
|
注意：该页面为 msgbox 参数指向的自定义页面。
|
||||||
|
<br> 此页为消息盒子的模拟数据，实际使用时请进行相应修改。
|
||||||
|
</blockquote>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<textarea title="消息模版" id="LAY_tpl" style="display:none;">
|
||||||
|
{{# layui.each(d.data, function(index, item){
|
||||||
|
if(item.from){ }}
|
||||||
|
<li data-uid="{{ item.from }}" data-fromGroup="{{ item.from_group }}">
|
||||||
|
<a href="/u/{{ item.from }}/" target="_blank">
|
||||||
|
<img src="{{ item.user.avatar }}" class="layui-circle layim-msgbox-avatar">
|
||||||
|
</a>
|
||||||
|
<p class="layim-msgbox-user">
|
||||||
|
<a href="/u/{{ item.from }}/" target="_blank">{{ item.user.username||'' }}</a>
|
||||||
|
<span>{{ item.time }}</span>
|
||||||
|
</p>
|
||||||
|
<p class="layim-msgbox-content">
|
||||||
|
{{ item.content }}
|
||||||
|
<span>{{ item.remark ? '附言: '+item.remark : '' }}</span>
|
||||||
|
</p>
|
||||||
|
<p class="layim-msgbox-btn">
|
||||||
|
<button class="layui-btn layui-btn-small" data-type="agree">同意</button>
|
||||||
|
<button class="layui-btn layui-btn-small layui-btn-primary" data-type="refuse">拒绝</button>
|
||||||
|
</p>
|
||||||
|
</li>
|
||||||
|
{{# } else { }}
|
||||||
|
<li class="layim-msgbox-system">
|
||||||
|
<p><em>系统：</em>{{ item.content }}<span>{{ item.time }}</span></p>
|
||||||
|
</li>
|
||||||
|
{{# }
|
||||||
|
}); }}
|
||||||
|
</textarea>
|
||||||
|
|
||||||
|
<!--
|
||||||
|
上述模版采用了 laytpl 语法
|
||||||
|
-->
|
||||||
|
|
||||||
|
|
||||||
|
<script src="//unpkg.com/layui@2.6.8/dist/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
layimPath: '../../' //配置 layim.js 所在目录
|
||||||
|
,layimResPath: '../' //layim 资源文件所在目录
|
||||||
|
}).extend({
|
||||||
|
layim: layui.cache.layimPath + 'layim' //配置 layim 组件所在的路径
|
||||||
|
}).use(['layim', 'flow'], function(){
|
||||||
|
var layim = layui.layim
|
||||||
|
,layer = layui.layer
|
||||||
|
,laytpl = layui.laytpl
|
||||||
|
,$ = layui.jquery
|
||||||
|
,flow = layui.flow;
|
||||||
|
|
||||||
|
var cache = {}; //用于临时记录请求到的数据
|
||||||
|
|
||||||
|
//请求消息
|
||||||
|
var renderMsg = function(page, callback){
|
||||||
|
|
||||||
|
//实际部署时，请将下述 getmsg.json 改为你的接口地址
|
||||||
|
|
||||||
|
$.get('getmsg.json', {
|
||||||
|
page: page || 1
|
||||||
|
}, function(res){
|
||||||
|
if(res.code != 0){
|
||||||
|
return layer.msg(res.msg);
|
||||||
|
}
|
||||||
|
|
||||||
|
//记录来源用户信息
|
||||||
|
layui.each(res.data, function(index, item){
|
||||||
|
cache[item.from] = item.user;
|
||||||
|
});
|
||||||
|
|
||||||
|
callback && callback(res.data, res.pages);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
//消息信息流
|
||||||
|
flow.load({
|
||||||
|
elem: '#LAY_view' //流加载容器
|
||||||
|
,isAuto: false
|
||||||
|
,end: '<li class="layim-msgbox-tips">暂无更多新消息</li>'
|
||||||
|
,done: function(page, next){ //加载下一页
|
||||||
|
renderMsg(page, function(data, pages){
|
||||||
|
var html = laytpl(LAY_tpl.value).render({
|
||||||
|
data: data
|
||||||
|
,page: page
|
||||||
|
});
|
||||||
|
next(html, page < pages);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//打开页面即把消息标记为已读
|
||||||
|
/*
|
||||||
|
$.post('/message/read', {
|
||||||
|
type: 1
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
|
||||||
|
//操作
|
||||||
|
var active = {
|
||||||
|
//同意
|
||||||
|
agree: function(othis){
|
||||||
|
var li = othis.parents('li')
|
||||||
|
,uid = li.data('uid')
|
||||||
|
,from_group = li.data('fromGroup')
|
||||||
|
,user = cache[uid];
|
||||||
|
|
||||||
|
//选择分组
|
||||||
|
parent.layui.layim.setFriendGroup({
|
||||||
|
type: 'friend'
|
||||||
|
,username: user.username
|
||||||
|
,avatar: user.avatar
|
||||||
|
,group: parent.layui.layim.cache().friend //获取好友分组数据
|
||||||
|
,submit: function(group, index){
|
||||||
|
|
||||||
|
//将好友追加到主面板
|
||||||
|
parent.layui.layim.addList({
|
||||||
|
type: 'friend'
|
||||||
|
,avatar: user.avatar //好友头像
|
||||||
|
,username: user.username //好友昵称
|
||||||
|
,groupid: group //所在的分组id
|
||||||
|
,id: uid //好友ID
|
||||||
|
,sign: user.sign //好友签名
|
||||||
|
});
|
||||||
|
parent.layer.close(index);
|
||||||
|
othis.parent().html('已同意');
|
||||||
|
|
||||||
|
|
||||||
|
//实际部署时，请开启下述注释，并改成你的接口地址
|
||||||
|
/*
|
||||||
|
$.post('/im/agreeFriend', {
|
||||||
|
uid: uid //对方用户ID
|
||||||
|
,from_group: from_group //对方设定的好友分组
|
||||||
|
,group: group //我设定的好友分组
|
||||||
|
}, function(res){
|
||||||
|
if(res.code != 0){
|
||||||
|
return layer.msg(res.msg);
|
||||||
|
}
|
||||||
|
|
||||||
|
//将好友追加到主面板
|
||||||
|
parent.layui.layim.addList({
|
||||||
|
type: 'friend'
|
||||||
|
,avatar: user.avatar //好友头像
|
||||||
|
,username: user.username //好友昵称
|
||||||
|
,groupid: group //所在的分组id
|
||||||
|
,id: uid //好友ID
|
||||||
|
,sign: user.sign //好友签名
|
||||||
|
});
|
||||||
|
parent.layer.close(index);
|
||||||
|
othis.parent().html('已同意');
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
//拒绝
|
||||||
|
,refuse: function(othis){
|
||||||
|
var li = othis.parents('li')
|
||||||
|
,uid = li.data('uid');
|
||||||
|
|
||||||
|
layer.confirm('确定拒绝吗？', function(index){
|
||||||
|
layer.close(index);
|
||||||
|
othis.parent().html('<em>已拒绝</em>');
|
||||||
|
|
||||||
|
/*
|
||||||
|
$.post('/im/refuseFriend', {
|
||||||
|
uid: uid //对方用户ID
|
||||||
|
}, function(res){
|
||||||
|
if(res.code != 0){
|
||||||
|
return layer.msg(res.msg);
|
||||||
|
}
|
||||||
|
layer.close(index);
|
||||||
|
othis.parent().html('<em>已拒绝</em>');
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$('body').on('click', '.layui-btn', function(){
|
||||||
|
var othis = $(this), type = othis.data('type');
|
||||||
|
active[type] ? active[type].call(this, othis) : '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
src/res/modules/layim/res/images/default.png
Normal file
BIN
src/res/modules/layim/res/images/default.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
1
src/res/modules/layim/res/layim.css
Normal file
1
src/res/modules/layim/res/layim.css
Normal file
File diff suppressed because one or more lines are too long
BIN
src/res/modules/layim/res/skin/1.jpg
Normal file
BIN
src/res/modules/layim/res/skin/1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
BIN
src/res/modules/layim/res/skin/2.jpg
Normal file
BIN
src/res/modules/layim/res/skin/2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/res/modules/layim/res/skin/3.jpg
Normal file
BIN
src/res/modules/layim/res/skin/3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
src/res/modules/layim/res/skin/4.jpg
Normal file
BIN
src/res/modules/layim/res/skin/4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
BIN
src/res/modules/layim/res/skin/5.jpg
Normal file
BIN
src/res/modules/layim/res/skin/5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
BIN
src/res/modules/layim/res/voice/default.mp3
Normal file
BIN
src/res/modules/layim/res/voice/default.mp3
Normal file
Binary file not shown.
127
src/res/modules/message.js
Normal file
127
src/res/modules/message.js
Normal file
@@ -0,0 +1,127 @@
|
|||||||
|
/**
|
||||||
|
* message
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(['admin', 'table', 'util'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,table = layui.table
|
||||||
|
,element = layui.element;
|
||||||
|
|
||||||
|
var DISABLED = 'layui-btn-disabled'
|
||||||
|
|
||||||
|
//区分各选项卡中的表格
|
||||||
|
,tabs = {
|
||||||
|
all: {
|
||||||
|
text: '全部消息'
|
||||||
|
,id: 'LAY-app-message-all'
|
||||||
|
}
|
||||||
|
,notice: {
|
||||||
|
text: '通知'
|
||||||
|
,id: 'LAY-app-message-notice'
|
||||||
|
}
|
||||||
|
,direct: {
|
||||||
|
text: '私信'
|
||||||
|
,id: 'LAY-app-message-direct'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
//标题内容模板
|
||||||
|
var tplTitle = function(d){
|
||||||
|
return '<a href="detail.html?id='+ d.id +'">'+ d.title;
|
||||||
|
};
|
||||||
|
|
||||||
|
//全部消息
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-message-all'
|
||||||
|
,url: layui.setter.paths.base + 'json/message/all.js' //模拟接口
|
||||||
|
,page: true
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'title', title: '标题内容', minWidth: 300, templet: tplTitle}
|
||||||
|
,{field: 'time', title: '时间', width: 170, templet: '<div>{{ layui.util.timeAgo(d.time) }}</div>'}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
//通知
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-message-notice'
|
||||||
|
,url: layui.setter.paths.base + 'json/message/notice.js' //模拟接口
|
||||||
|
,page: true
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'title', title: '标题内容', minWidth: 300, templet: tplTitle}
|
||||||
|
,{field: 'time', title: '时间', width: 170, templet: '<div>{{ layui.util.timeAgo(d.time) }}</div>'}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
//私信
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-message-direct'
|
||||||
|
,url: layui.setter.paths.base + 'json/message/direct.js' //模拟接口
|
||||||
|
,page: true
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'title', title: '标题内容', minWidth: 300, templet: tplTitle}
|
||||||
|
,{field: 'time', title: '时间', width: 170, templet: '<div>{{ layui.util.timeAgo(d.time) }}</div>'}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
//事件处理
|
||||||
|
var events = {
|
||||||
|
del: function(othis, type){
|
||||||
|
var thisTabs = tabs[type]
|
||||||
|
,checkStatus = table.checkStatus(thisTabs.id)
|
||||||
|
,data = checkStatus.data; //获得选中的数据
|
||||||
|
if(data.length === 0) return layer.msg('未选中行');
|
||||||
|
|
||||||
|
layer.confirm('确定删除选中的数据吗？', function(){
|
||||||
|
/*
|
||||||
|
admin.req('url', {}, function(){ //请求接口
|
||||||
|
//do somethin
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
//此处只是演示，实际应用需把下述代码放入上述Ajax回调中
|
||||||
|
layer.msg('删除成功', {
|
||||||
|
icon: 1
|
||||||
|
});
|
||||||
|
table.reload(thisTabs.id); //刷新表格
|
||||||
|
});
|
||||||
|
}
|
||||||
|
,ready: function(othis, type){
|
||||||
|
var thisTabs = tabs[type]
|
||||||
|
,checkStatus = table.checkStatus(thisTabs.id)
|
||||||
|
,data = checkStatus.data; //获得选中的数据
|
||||||
|
if(data.length === 0) return layer.msg('未选中行');
|
||||||
|
|
||||||
|
//此处只是演示
|
||||||
|
layer.msg('标记已读成功', {
|
||||||
|
icon: 1
|
||||||
|
});
|
||||||
|
table.reload(thisTabs.id); //刷新表格
|
||||||
|
}
|
||||||
|
,readyAll: function(othis, type){
|
||||||
|
var thisTabs = tabs[type];
|
||||||
|
|
||||||
|
//do somethin
|
||||||
|
|
||||||
|
layer.msg(thisTabs.text + '：全部已读', {
|
||||||
|
icon: 1
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$('.LAY-app-message-btns .layui-btn').on('click', function(){
|
||||||
|
var othis = $(this)
|
||||||
|
,thisEvent = othis.data('events')
|
||||||
|
,type = othis.data('type');
|
||||||
|
events[thisEvent] && events[thisEvent].call(this, othis, type);
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('message', {});
|
||||||
|
});
|
||||||
294
src/res/modules/sample.js
Normal file
294
src/res/modules/sample.js
Normal file
@@ -0,0 +1,294 @@
|
|||||||
|
/**
|
||||||
|
* console - homepage demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(function(exports){
|
||||||
|
var admin = layui.admin;
|
||||||
|
|
||||||
|
//区块轮播切换
|
||||||
|
layui.use(['admin', 'carousel'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,element = layui.element
|
||||||
|
,device = layui.device();
|
||||||
|
|
||||||
|
//轮播切换
|
||||||
|
$('.layadmin-carousel').each(function(){
|
||||||
|
var othis = $(this);
|
||||||
|
carousel.render({
|
||||||
|
elem: this
|
||||||
|
,width: '100%'
|
||||||
|
,arrow: 'none'
|
||||||
|
,interval: othis.data('interval')
|
||||||
|
,autoplay: othis.data('autoplay') === true
|
||||||
|
,trigger: (device.ios || device.android) ? 'click' : 'hover'
|
||||||
|
,anim: othis.data('anim')
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
element.render('progress');
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//八卦新闻
|
||||||
|
layui.use(['carousel', 'echarts'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,echarts = layui.echarts;
|
||||||
|
|
||||||
|
var echartsApp = [], options = [
|
||||||
|
{
|
||||||
|
title : {
|
||||||
|
subtext: '完全实况球员数据',
|
||||||
|
textStyle: {
|
||||||
|
fontSize: 14
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'axis'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
x : 'left',
|
||||||
|
data:['罗纳尔多','舍普琴科']
|
||||||
|
},
|
||||||
|
polar : [
|
||||||
|
{
|
||||||
|
indicator : [
|
||||||
|
{text : '进攻', max : 100},
|
||||||
|
{text : '防守', max : 100},
|
||||||
|
{text : '体能', max : 100},
|
||||||
|
{text : '速度', max : 100},
|
||||||
|
{text : '力量', max : 100},
|
||||||
|
{text : '技巧', max : 100}
|
||||||
|
],
|
||||||
|
radius : 130
|
||||||
|
}
|
||||||
|
],
|
||||||
|
series : [
|
||||||
|
{
|
||||||
|
type: 'radar',
|
||||||
|
center : ['50%', '50%'],
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
areaStyle: {
|
||||||
|
type: 'default'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data:[
|
||||||
|
{value : [97, 42, 88, 94, 90, 86], name : '舍普琴科'},
|
||||||
|
{value : [97, 32, 74, 95, 88, 92], name : '罗纳尔多'}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
,elemDataView = $('#LAY-index-pageone').children('div')
|
||||||
|
,renderDataView = function(index){
|
||||||
|
echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
|
||||||
|
echartsApp[index].setOption(options[index]);
|
||||||
|
window.onresize = echartsApp[index].resize;
|
||||||
|
};
|
||||||
|
//没找到DOM，终止执行
|
||||||
|
if(!elemDataView[0]) return;
|
||||||
|
|
||||||
|
renderDataView(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
//访问量
|
||||||
|
layui.use(['carousel', 'echarts'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,echarts = layui.echarts;
|
||||||
|
|
||||||
|
var echartsApp = [], options = [
|
||||||
|
{
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'axis'
|
||||||
|
},
|
||||||
|
calculable : true,
|
||||||
|
legend: {
|
||||||
|
data:['访问量','下载量','平均访问量']
|
||||||
|
},
|
||||||
|
|
||||||
|
xAxis : [
|
||||||
|
{
|
||||||
|
type : 'category',
|
||||||
|
data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis : [
|
||||||
|
{
|
||||||
|
type : 'value',
|
||||||
|
name : '访问量',
|
||||||
|
axisLabel : {
|
||||||
|
formatter: '{value} 万'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type : 'value',
|
||||||
|
name : '下载量',
|
||||||
|
axisLabel : {
|
||||||
|
formatter: '{value} 万'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
series : [
|
||||||
|
{
|
||||||
|
name:'访问量',
|
||||||
|
type:'line',
|
||||||
|
data:[900, 850, 950, 1000, 1100, 1050, 1000, 1150, 1250, 1370, 1250, 1100]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'下载量',
|
||||||
|
type:'line',
|
||||||
|
yAxisIndex: 1,
|
||||||
|
data:[850, 850, 800, 950, 1000, 950, 950, 1150, 1100, 1240, 1000, 950]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'平均访问量',
|
||||||
|
type:'line',
|
||||||
|
data:[870, 850, 850, 950, 1050, 1000, 980, 1150, 1000, 1300, 1150, 1000]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
,elemDataView = $('#LAY-index-pagetwo').children('div')
|
||||||
|
,renderDataView = function(index){
|
||||||
|
echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
|
||||||
|
echartsApp[index].setOption(options[index]);
|
||||||
|
window.onresize = echartsApp[index].resize;
|
||||||
|
};
|
||||||
|
//没找到DOM，终止执行
|
||||||
|
if(!elemDataView[0]) return;
|
||||||
|
renderDataView(0);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//地图
|
||||||
|
layui.use(['carousel', 'echarts'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,carousel = layui.carousel
|
||||||
|
,echarts = layui.echarts;
|
||||||
|
|
||||||
|
var echartsApp = [], options = [
|
||||||
|
{
|
||||||
|
title : {
|
||||||
|
text: '访客地区分布',
|
||||||
|
subtext: '不完全统计'
|
||||||
|
},
|
||||||
|
tooltip : {
|
||||||
|
trigger: 'item'
|
||||||
|
},
|
||||||
|
dataRange: {
|
||||||
|
orient: 'horizontal',
|
||||||
|
min: 0,
|
||||||
|
max: 60000,
|
||||||
|
text:['高','低'],
|
||||||
|
splitNumber:0
|
||||||
|
},
|
||||||
|
series : [
|
||||||
|
{
|
||||||
|
name: '访客地区分布',
|
||||||
|
type: 'map',
|
||||||
|
mapType: 'china',
|
||||||
|
selectedMode : 'multiple',
|
||||||
|
itemStyle:{
|
||||||
|
normal:{label:{show:true}},
|
||||||
|
emphasis:{label:{show:true}}
|
||||||
|
},
|
||||||
|
data:[
|
||||||
|
{name:'西藏', value:60},
|
||||||
|
{name:'青海', value:167},
|
||||||
|
{name:'宁夏', value:210},
|
||||||
|
{name:'海南', value:252},
|
||||||
|
{name:'甘肃', value:502},
|
||||||
|
{name:'贵州', value:570},
|
||||||
|
{name:'新疆', value:661},
|
||||||
|
{name:'云南', value:8890},
|
||||||
|
{name:'重庆', value:10010},
|
||||||
|
{name:'吉林', value:5056},
|
||||||
|
{name:'山西', value:2123},
|
||||||
|
{name:'天津', value:9130},
|
||||||
|
{name:'江西', value:10170},
|
||||||
|
{name:'广西', value:6172},
|
||||||
|
{name:'陕西', value:9251},
|
||||||
|
{name:'黑龙江', value:5125},
|
||||||
|
{name:'内蒙古', value:1435},
|
||||||
|
{name:'安徽', value:9530},
|
||||||
|
{name:'北京', value:51919},
|
||||||
|
{name:'福建', value:3756},
|
||||||
|
{name:'上海', value:59190},
|
||||||
|
{name:'湖北', value:37109},
|
||||||
|
{name:'湖南', value:8966},
|
||||||
|
{name:'四川', value:31020},
|
||||||
|
{name:'辽宁', value:7222},
|
||||||
|
{name:'河北', value:3451},
|
||||||
|
{name:'河南', value:9693},
|
||||||
|
{name:'浙江', value:62310},
|
||||||
|
{name:'山东', value:39231},
|
||||||
|
{name:'江苏', value:35911},
|
||||||
|
{name:'广东', value:55891}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
,elemDataView = $('#LAY-index-pagethree').children('div')
|
||||||
|
,renderDataView = function(index){
|
||||||
|
echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
|
||||||
|
echartsApp[index].setOption(options[index]);
|
||||||
|
window.onresize = echartsApp[index].resize;
|
||||||
|
};
|
||||||
|
//没找到DOM，终止执行
|
||||||
|
if(!elemDataView[0]) return;
|
||||||
|
|
||||||
|
renderDataView(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
//项目进展
|
||||||
|
layui.use('table', function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-index-prograss'
|
||||||
|
,url: layui.setter.paths.base + 'json/console/prograss.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'prograss', title: '任务'}
|
||||||
|
,{field: 'time', title: '所需时间'}
|
||||||
|
,{field: 'complete', title: '完成情况'
|
||||||
|
,templet: function(d){
|
||||||
|
if(d.complete == '已完成'){
|
||||||
|
return '<del style="color: #16b777;">'+ d.complete +'</del>'
|
||||||
|
}else if(d.complete == '进行中'){
|
||||||
|
return '<span style="color: #FFB800;">'+ d.complete +'</span>'
|
||||||
|
}else{
|
||||||
|
return '<span style="color: #FF5722;">'+ d.complete +'</span>'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]]
|
||||||
|
,skin: 'line'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
//回复留言
|
||||||
|
admin.events.replyNote = function(othis){
|
||||||
|
var nid = othis.data('id');
|
||||||
|
layer.prompt({
|
||||||
|
title: '回复留言 ID:'+ nid
|
||||||
|
,formType: 2
|
||||||
|
}, function(value, index){
|
||||||
|
//这里可以请求 Ajax
|
||||||
|
//…
|
||||||
|
layer.msg('得到：'+ value);
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
exports('sample', {})
|
||||||
|
});
|
||||||
1160
src/res/modules/senior.js
Normal file
1160
src/res/modules/senior.js
Normal file
File diff suppressed because one or more lines are too long
150
src/res/modules/set.js
Normal file
150
src/res/modules/set.js
Normal file
@@ -0,0 +1,150 @@
|
|||||||
|
/**
|
||||||
|
* set demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.define(['form', 'upload'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,layer = layui.layer
|
||||||
|
,laytpl = layui.laytpl
|
||||||
|
,setter = layui.setter
|
||||||
|
,view = layui.view
|
||||||
|
,admin = layui.admin
|
||||||
|
,form = layui.form
|
||||||
|
,upload = layui.upload;
|
||||||
|
|
||||||
|
var $body = $('body');
|
||||||
|
|
||||||
|
//自定义验证
|
||||||
|
form.verify({
|
||||||
|
nickname: function(value, item){ //value：表单的值、item：表单的DOM对象
|
||||||
|
if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
|
||||||
|
return '用户名不能有特殊字符';
|
||||||
|
}
|
||||||
|
if(/(^\_)|(\__)|(\_+$)/.test(value)){
|
||||||
|
return '用户名首尾不能出现下划线\'_\'';
|
||||||
|
}
|
||||||
|
if(/^\d+\d+\d$/.test(value)){
|
||||||
|
return '用户名不能全为数字';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//我们既支持上述函数式的方式，也支持下述数组的形式
|
||||||
|
//数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
|
||||||
|
,pass: [
|
||||||
|
/^[\S]{6,12}$/
|
||||||
|
,'密码必须6到12位，且不能出现空格'
|
||||||
|
]
|
||||||
|
|
||||||
|
//确认密码
|
||||||
|
,repass: function(value){
|
||||||
|
if(value !== $('#LAY_password').val()){
|
||||||
|
return '两次密码输入不一致';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//网站设置
|
||||||
|
form.on('submit(set_website)', function(obj){
|
||||||
|
layer.alert(layui.util.escape(JSON.stringify(obj.field)));
|
||||||
|
|
||||||
|
//提交修改
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: ''
|
||||||
|
,data: obj.field
|
||||||
|
,success: function(){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
//邮件服务
|
||||||
|
form.on('submit(set_system_email)', function(obj){
|
||||||
|
layer.alert(layui.util.escape(JSON.stringify(obj.field)));
|
||||||
|
|
||||||
|
//提交修改
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: ''
|
||||||
|
,data: obj.field
|
||||||
|
,success: function(){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
//设置我的资料
|
||||||
|
form.on('submit(setmyinfo)', function(obj){
|
||||||
|
layer.alert(layui.util.escape(JSON.stringify(obj.field)));
|
||||||
|
|
||||||
|
//提交修改
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: ''
|
||||||
|
,data: obj.field
|
||||||
|
,success: function(){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
//上传头像
|
||||||
|
var avatarSrc = $('#LAY_avatarSrc');
|
||||||
|
upload.render({
|
||||||
|
url: '/api/upload/'
|
||||||
|
,elem: '#LAY_avatarUpload'
|
||||||
|
,done: function(res){
|
||||||
|
if(res.status == 0){
|
||||||
|
avatarSrc.val(res.url);
|
||||||
|
} else {
|
||||||
|
layer.msg(res.msg, {icon: 5});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//查看头像
|
||||||
|
admin.events.avartatPreview = function(othis){
|
||||||
|
var src = avatarSrc.val();
|
||||||
|
layer.photos({
|
||||||
|
photos: {
|
||||||
|
"title": "查看头像" //相册标题
|
||||||
|
,"data": [{
|
||||||
|
"src": src //原图地址
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
,shade: 0.01
|
||||||
|
,closeBtn: 1
|
||||||
|
,anim: 5
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//设置密码
|
||||||
|
form.on('submit(setmypass)', function(obj){
|
||||||
|
var field = obj.field; //获取表单字段
|
||||||
|
|
||||||
|
layer.msg('ok');
|
||||||
|
|
||||||
|
//提交修改
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: ''
|
||||||
|
,data: obj.field
|
||||||
|
,success: function(){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
||||||
|
//对外暴露的接口
|
||||||
|
exports('set', {});
|
||||||
|
});
|
||||||
60
src/res/modules/user.js
Normal file
60
src/res/modules/user.js
Normal file
@@ -0,0 +1,60 @@
|
|||||||
|
/**
|
||||||
|
* user demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
layui.define('form', function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,layer = layui.layer
|
||||||
|
,laytpl = layui.laytpl
|
||||||
|
,setter = layui.setter
|
||||||
|
,view = layui.view
|
||||||
|
,admin = layui.admin
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
var $body = $('body');
|
||||||
|
|
||||||
|
//自定义验证
|
||||||
|
form.verify({
|
||||||
|
nickname: function(value, item){ //value：表单的值、item：表单的DOM对象
|
||||||
|
if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
|
||||||
|
return '用户名不能有特殊字符';
|
||||||
|
}
|
||||||
|
if(/(^\_)|(\__)|(\_+$)/.test(value)){
|
||||||
|
return '用户名首尾不能出现下划线\'_\'';
|
||||||
|
}
|
||||||
|
if(/^\d+\d+\d$/.test(value)){
|
||||||
|
return '用户名不能全为数字';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//我们既支持上述函数式的方式，也支持下述数组的形式
|
||||||
|
//数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
|
||||||
|
,pass: [
|
||||||
|
/^[\S]{6,12}$/
|
||||||
|
,'密码必须6到12位，且不能出现空格'
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
//发送短信验证码
|
||||||
|
admin.sendAuthCode({
|
||||||
|
elem: '#LAY-user-getsmscode'
|
||||||
|
,elemPhone: '#LAY-user-login-cellphone'
|
||||||
|
,elemVercode: '#LAY-user-login-vercode'
|
||||||
|
,ajax: {
|
||||||
|
url: layui.setter.paths.base + 'json/user/sms.js' //实际使用请改成服务端真实接口
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//更换图形验证码
|
||||||
|
$body.on('click', '#LAY-user-get-vercode', function(){
|
||||||
|
var othis = $(this);
|
||||||
|
this.src = 'https://www.oschina.net/action/user/captcha?t='+ new Date().getTime()
|
||||||
|
});
|
||||||
|
|
||||||
|
//对外暴露的接口
|
||||||
|
exports('user', {});
|
||||||
|
});
|
||||||
204
src/res/modules/useradmin.js
Normal file
204
src/res/modules/useradmin.js
Normal file
@@ -0,0 +1,204 @@
|
|||||||
|
/**
|
||||||
|
* useradmin demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(['table', 'form'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
//用户管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-user-manage'
|
||||||
|
,url: layui.setter.paths.base + 'json/useradmin/webuser.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 100, title: 'ID', sort: true}
|
||||||
|
,{field: 'username', title: '用户名', minWidth: 100}
|
||||||
|
,{field: 'avatar', title: '头像', width: 100, templet: '#imgTpl'}
|
||||||
|
,{field: 'phone', title: '手机'}
|
||||||
|
,{field: 'email', title: '邮箱'}
|
||||||
|
,{field: 'sex', width: 80, title: '性别'}
|
||||||
|
,{field: 'ip', title: 'IP'}
|
||||||
|
,{field: 'jointime', title: '加入时间', sort: true}
|
||||||
|
,{title: '操作', width: 150, align:'center', fixed: 'right', toolbar: '#table-useradmin-webuser'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 30
|
||||||
|
,height: 'full-220'
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-user-manage)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.prompt({
|
||||||
|
formType: 1
|
||||||
|
,title: '敏感操作，请验证口令'
|
||||||
|
}, function(value, index){
|
||||||
|
layer.close(index);
|
||||||
|
|
||||||
|
layer.confirm('真的删除行么', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑用户'
|
||||||
|
,content: '../../../views/user/user/userform.html'
|
||||||
|
,maxmin: true
|
||||||
|
,area: ['500px', '450px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submitID = 'LAY-user-front-submit'
|
||||||
|
,submit = layero.find('iframe').contents().find('#'+ submitID);
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-user-manage'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//管理员管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-user-back-manage'
|
||||||
|
,url: layui.setter.paths.base + 'json/useradmin/mangadmin.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 80, title: 'ID', sort: true}
|
||||||
|
,{field: 'loginname', title: '登录名'}
|
||||||
|
,{field: 'telphone', title: '手机'}
|
||||||
|
,{field: 'email', title: '邮箱'}
|
||||||
|
,{field: 'role', title: '角色'}
|
||||||
|
,{field: 'jointime', title: '加入时间', sort: true}
|
||||||
|
,{field: 'check', title:'审核状态', templet: '#buttonTpl', minWidth: 80, align: 'center'}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-useradmin-admin'}
|
||||||
|
]]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-user-back-manage)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.prompt({
|
||||||
|
formType: 1
|
||||||
|
,title: '敏感操作，请验证口令'
|
||||||
|
}, function(value, index){
|
||||||
|
layer.close(index);
|
||||||
|
layer.confirm('确定删除此管理员？', function(index){
|
||||||
|
console.log(obj)
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑管理员'
|
||||||
|
,content: '../../../views/user/administrators/adminform.html'
|
||||||
|
,area: ['420px', '420px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submitID = 'LAY-user-back-submit'
|
||||||
|
,submit = layero.find('iframe').contents().find('#'+ submitID);
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-user-back-manage'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//角色管理
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-user-back-role'
|
||||||
|
,url: layui.setter.paths.base + 'json/useradmin/role.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field: 'id', width: 80, title: 'ID', sort: true}
|
||||||
|
,{field: 'rolename', title: '角色名'}
|
||||||
|
,{field: 'limits', title: '拥有权限'}
|
||||||
|
,{field: 'descr', title: '具体描述'}
|
||||||
|
,{title: '操作', width: 150, align: 'center', fixed: 'right', toolbar: '#table-useradmin-admin'}
|
||||||
|
]]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件-工具条
|
||||||
|
table.on('tool(LAY-user-back-role)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'del'){
|
||||||
|
layer.confirm('确定删除此角色？', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
}else if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑角色'
|
||||||
|
,content: '../../../views/user/administrators/roleform.html'
|
||||||
|
,area: ['500px', '480px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submit = layero.find('iframe').contents().find("#LAY-user-role-submit");
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit(LAY-user-role-submit)', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-user-back-role'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('useradmin', {})
|
||||||
|
});
|
||||||
71
src/res/modules/workorder.js
Normal file
71
src/res/modules/workorder.js
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
/**
|
||||||
|
* workorder demo
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
layui.define(['table', 'form', 'element'], function(exports){
|
||||||
|
var $ = layui.$
|
||||||
|
,table = layui.table
|
||||||
|
,form = layui.form
|
||||||
|
,element = layui.element;
|
||||||
|
|
||||||
|
table.render({
|
||||||
|
elem: '#LAY-app-system-order'
|
||||||
|
,url: layui.setter.paths.base + 'json/workorder/demo.js' //模拟接口
|
||||||
|
,cols: [[
|
||||||
|
{type: 'numbers', fixed: 'left'}
|
||||||
|
,{field: 'orderid', width: 100, title: '工单号', sort: true}
|
||||||
|
,{field: 'attr', width: 100, title: '业务性质'}
|
||||||
|
,{field: 'title', width: 100, title: '工单标题', width: 300}
|
||||||
|
,{field: 'progress', title: '进度', width: 200, align: 'center', templet: '#progressTpl'}
|
||||||
|
,{field: 'submit', width: 100, title: '提交者'}
|
||||||
|
,{field: 'accept', width: 100, title: '受理人员'}
|
||||||
|
,{field: 'state', title: '工单状态', templet: '#buttonTpl', minWidth: 80, align: 'center'}
|
||||||
|
,{title: '操作', align: 'center', fixed: 'right', toolbar: '#table-system-order'}
|
||||||
|
]]
|
||||||
|
,page: true
|
||||||
|
,limit: 10
|
||||||
|
,limits: [10, 15, 20, 25, 30]
|
||||||
|
,text: '对不起，加载出现异常！'
|
||||||
|
,done: function(){
|
||||||
|
element.render('progress')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//工具条事件
|
||||||
|
table.on('tool(LAY-app-system-order)', function(obj){
|
||||||
|
var data = obj.data;
|
||||||
|
if(obj.event === 'edit'){
|
||||||
|
var tr = $(obj.tr);
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '编辑工单'
|
||||||
|
,content: '../../../views/app/workorder/listform.html'
|
||||||
|
,area: ['450px', '450px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var iframeWindow = window['layui-layer-iframe'+ index]
|
||||||
|
,submitID = 'LAY-app-workorder-submit'
|
||||||
|
,submit = layero.find('iframe').contents().find('#'+ submitID);
|
||||||
|
|
||||||
|
//事件-提交
|
||||||
|
iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
|
||||||
|
var field = data.field; //获取提交的字段
|
||||||
|
|
||||||
|
//提交 Ajax 成功后，静态更新表格中的数据
|
||||||
|
//$.ajax({});
|
||||||
|
table.reload('LAY-user-front-submit'); //数据刷新
|
||||||
|
layer.close(index); //关闭弹层
|
||||||
|
});
|
||||||
|
|
||||||
|
submit.trigger('click');
|
||||||
|
}
|
||||||
|
,success: function(layero, index){
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
exports('workorder', {})
|
||||||
|
});
|
||||||
BIN
src/res/style/imgs/layui-logo.jpg
Normal file
BIN
src/res/style/imgs/layui-logo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
BIN
src/res/style/imgs/template/character.jpg
Normal file
BIN
src/res/style/imgs/template/character.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
BIN
src/res/style/imgs/template/huge.jpg
Normal file
BIN
src/res/style/imgs/template/huge.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/res/style/imgs/template/portrait.png
Normal file
BIN
src/res/style/imgs/template/portrait.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
179
src/res/style/template.css
Normal file
179
src/res/style/template.css
Normal file
@@ -0,0 +1,179 @@
|
|||||||
|
/**
|
||||||
|
* admin.templte.css
|
||||||
|
*/
|
||||||
|
|
||||||
|
/********************************
|
||||||
|
|
||||||
|
模板开始
|
||||||
|
|
||||||
|
*******************************/
|
||||||
|
|
||||||
|
|
||||||
|
/* 产品版本选择面板 */
|
||||||
|
.layadmin-panel-selection{width: 768px; margin: 30px auto;}
|
||||||
|
.layadmin-panel-selection .layui-panel-window{padding: 30px 50px; border-top-color: #ddd; text-align: center;}
|
||||||
|
.layadmin-panel-selection .layui-panel-window h2{padding-bottom: 15px; font-size: 18px;}
|
||||||
|
.layadmin-panel-selection .layui-panel-window ul{margin-top: 15px; text-align: left;}
|
||||||
|
.layadmin-panel-selection .layui-btn-container{margin-top: 30px;}
|
||||||
|
.layadmin-panel-selection .layui-btn-container .layui-btn{width: 100%;}
|
||||||
|
|
||||||
|
/* 通讯录面板 */
|
||||||
|
.layadmin-maillist-fluid .layadmin-contact-box{padding:20px;background-color: #fff;
|
||||||
|
border: 1px solid #e7eaec;overflow: hidden;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-text-center{text-align: center;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-text-center img{max-width: 80%;border-radius: 50%;margin-top: 5px;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-font-blod{font-weight: 600;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-maillist-img{margin-top: 5px;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-title{margin:5px 0 10px 0;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-textimg{line-height: 25px;margin-bottom: 10px;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-address{line-height: 1.5;margin-bottom: 20px;}
|
||||||
|
.layadmin-maillist-fluid .layadmin-padding-left20{padding-left: 20px;}
|
||||||
|
|
||||||
|
/* 个人主页 */
|
||||||
|
.layadmin-homepage-shadow{box-shadow: 0 1px 1px rgba(0,0,0,.05);background-color: #fff;border-bottom: 1px solid rgba(0,0,0,0.17);border-radius: 0;border: 1px solid #e7ecf3;}
|
||||||
|
.layadmin-homepage-panel{margin-bottom: 15px;}
|
||||||
|
.layadmin-homepage-panel .text-center{text-align: center;}
|
||||||
|
.layadmin-homepage-information{padding: 15px; border-bottom: 1px solid #e9e9e9;}
|
||||||
|
.layadmin-homepage-pad-ver{ padding-top: 15px;padding-bottom: 15px;}
|
||||||
|
.layadmin-homepage-pad-img{box-shadow: 0 0 0 4px rgba(0,0,0,0.1);border-radius: 50%;}
|
||||||
|
.layadmin-homepage-font{font-weight: 600;color: #2b425b;font-size: 1.2em;}
|
||||||
|
.layadmin-homepage-min-font{margin:5px 0 10px 0;font-size: 0.9em;color: #afb9c3;}
|
||||||
|
.layadmin-homepage-pad-ver a{line-height: 1.1em;font-size: 1.3em;vertical-align: middle; cursor: pointer;background-color: transparent;color: inherit;padding: 6px 12px;}
|
||||||
|
.layadmin-homepage-pad-ver a:hover{background: #16b777; color:#fff;}
|
||||||
|
|
||||||
|
.layadmin-homepage-about{padding: 15px;font-weight: 600;color: #2b425b;}
|
||||||
|
.layadmin-homepage-list-group{font-size: 0.9em;line-height: 1.25;margin-bottom: 5px;}
|
||||||
|
.layadmin-homepage-list-group li{ padding: 5px 15px;border: 1px solid #ddd;margin-bottom: -1px;border-width: 1px 0;border-radius: 0; background-color: transparent;border-color: transparent;color: inherit;}
|
||||||
|
.layadmin-homepage-list-group li i{font-size: 1.333em;line-height: 1.095em;vertical-align: middle; margin-right: 4px;}
|
||||||
|
.layadmin-homepage-list-group li a.color{color:#337ab7;}
|
||||||
|
.layadmin-homepage-pad-hor{ padding-left: 15px; padding-right: 15px;border-bottom: 15px;color: #758697; text-indent:20px;}
|
||||||
|
.layadmin-homepage-list-inline{margin-left: 15px;margin-right: 15px;padding-bottom: 20px}
|
||||||
|
.layadmin-homepage-list-inline a{display: inline-block;}
|
||||||
|
.layadmin-homepage-list-inline .layui-btn{font-size: .9em;line-height: 1.42857;vertical-align: middle;height: auto;padding:4px 7px;margin-left: 0px;margin:0 10px 10px 0;}
|
||||||
|
|
||||||
|
/* 左侧个人信息区域 */
|
||||||
|
.layadmin-homepage-text-center{text-align: center;margin-bottom: 15px;}
|
||||||
|
.layadmin-homepage-padding15{padding:15px;margin-bottom: 15px;}
|
||||||
|
.layadmin-homepage-padding8{padding: 0 8px;}
|
||||||
|
.layadmin-homepage-paddingmb{margin-bottom: 15px;margin: 0 -7.5px;}
|
||||||
|
.layadmin-homepage-content{margin-left: 15px;padding: 0;}
|
||||||
|
.layadmin-homepage-content .new-section-xs{margin: 12px 0;color: inherit;border: 0!important;height: 0px;box-sizing: content-box;}
|
||||||
|
.layadmin-homepage-content .h4{font-size: 16px;font-weight: 600;color: #2b425b;}
|
||||||
|
.layadmin-homepage-content small{color: #afb9c3}
|
||||||
|
.layadmin-homepage-text-center .layui-icon{color:#FFB800;padding-right:5px;}
|
||||||
|
.layadmin-homepage-padding15 .layui-col-sm5 a{font-size: 11px;height: auto;line-height: 1.5;padding:5px 10px;float: right;}
|
||||||
|
.layadmin-homepage-padding15 .layui-btn-normal{margin:0 15px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .layui-col-sm10,.layadmin-homepage-list-imgtxt .layui-col-sm2{background: none}
|
||||||
|
.layadmin-homepage-list-imgtxt .panel-body{padding: 15px 20px 25px;overflow: hidden;margin-bottom: 15px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .panel-body .media-left{display: block;float: left;vertical-align: top;padding-right: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .panel-body .media-left img{border-radius: 50%;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body{width: auto;display: block;overflow: hidden;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .pad-btm{padding-bottom: 15px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .pad-btm p:first-child{padding-bottom: 5px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .min-font{margin-bottom: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .min-font .layui-breadcrumb a{font-size: 11px;}
|
||||||
|
.layui-breadcrumb span[lay-separator]{margin:0 5px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .pad-btm .fontColor a{font-weight: 600;color: #337ab7;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .pad-btm .fontColor span{color: #758697;font-weight: 600;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .h-img{display: block;max-width: 100%;height: auto;margin-top: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .img-xs{width: 32px;height: 32px;border-radius: 50%;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media{margin-top: 15px;overflow: hidden;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .media-right{float: right;padding-top: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .media-right .list-inline{margin-bottom: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .list-inline li{padding:0 5px;display: inline-block;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .media-right .list-inline li span{font-weight: 600;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .media-left{display: block;overflow: hidden;width: auto;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media .media-left .font-blod{font-weight: 700;color: #758697;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list{padding-top: 15px;margin-top: 15px;border-top: 1px solid #e9e9e9;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item{padding-bottom: 15px;margin-top: 15px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item-left{display:inline-block;padding-right: 10px;margin-bottom: 5px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item-left img{display: block;float: left;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text{overflow: hidden;width: auto;display: inline-block;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text a{margin-right: 10px;font-weight: 600;display: inline-block;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text div:nth-child(2){margin-top: 5px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .layui-btn{height: 24px;line-height: 24px;font-size: 12px;padding:0 20px;margin-bottom: 10px;}
|
||||||
|
.layadmin-homepage-list-imgtxt .media-body .media-list .layui-btn{height: 24px;line-height: 24px;font-size: 12px;padding:0 20px;margin-bottom: 10px;}
|
||||||
|
|
||||||
|
/* 个人内容区域 */
|
||||||
|
|
||||||
|
.homepage-top .layui-card-body img{width: 100%}
|
||||||
|
.homepage-top .layui-card-body .margin-top10{margin-top: 10px;}
|
||||||
|
.homepage-top .layui-card-body .layui-btn{width: 100%;display: block;}
|
||||||
|
.homepage-top{padding-bottom: 20px;}
|
||||||
|
.layadmin-privateletterlist-item{position: relative;display: block;padding: 10px 15px;}
|
||||||
|
.homepage-bottom .layui-card-body{padding:0;}
|
||||||
|
.homepage-bottom .layui-card-body img{width: 32px;height: 32px;border-radius: 50%;margin-top: 10px;}
|
||||||
|
.homepage-bottom .layui-card-body .meida-left{display: table-cell;padding-right: 10px;}
|
||||||
|
.homepage-bottom .layui-card-body .meida-right{display: table-cell;vertical-align: top;}
|
||||||
|
.homepage-bottom .layui-card-body a:hover{background: #F2F2F2;}
|
||||||
|
.homepage-bottom .layui-card-body{background: #fff;}
|
||||||
|
.layui-card-header .panel-title .layui-icon{position: relative;left: 0;right: 0px;}
|
||||||
|
|
||||||
|
/* 右侧信息栏 */
|
||||||
|
.layadmin-cmdlist-fluid{padding-bottom: 60px;}
|
||||||
|
.cmdlist-container{background: #fff;border:1px solid transparent;}
|
||||||
|
.cmdlist-container:hover{border:1px solid #e8e8e8;}
|
||||||
|
.cmdlist-container img{width: 100%;}
|
||||||
|
.cmdlist-text{padding:20px;}
|
||||||
|
.cmdlist-text .info{height: 40px;font-size: 14px;line-height: 20px;width: 100%;overflow: hidden;color: #5F5F5F;margin-bottom:10px;}
|
||||||
|
.cmdlist-text .price{font-size: 14px;}
|
||||||
|
.cmdlist-text .price b{margin-right: 20px;}
|
||||||
|
.cmdlist-text .price p{display: inline-block;}
|
||||||
|
.cmdlist-text .flow{text-align: right;float: right;}
|
||||||
|
#demo0{text-align: center;}
|
||||||
|
|
||||||
|
/* 商品列表 */
|
||||||
|
.layadmin-message-fluid .layui-col-md12{background: #fff;height: auto;padding-bottom: 50px;}
|
||||||
|
.layadmin-message-fluid .layui-input-block{margin-left: 0;}
|
||||||
|
.layadmin-message-fluid .layui-form{padding:45px 40px 0 40px;}
|
||||||
|
.layadmin-message-fluid .layui-form-label{text-align: left;font-size: 18px;padding-left: 10px;}
|
||||||
|
.layadmin-message-fluid .layui-textarea{min-height: 100px;font-size: 16px;}
|
||||||
|
.layadmin-message-fluid .layui-input-right{float: right;}
|
||||||
|
.layadmin-messag-icon{overflow: hidden;float: left;}
|
||||||
|
.layadmin-messag-icon .layui-icon{font-size: 24px;line-height: 30px;margin-right: 15px;color: #C4CBCF;}
|
||||||
|
.layadmin-messag-icon{margin-top: 4px;}
|
||||||
|
.message-content{padding:0 40px;}
|
||||||
|
.message-content .media-body{margin-bottom: 60px;}
|
||||||
|
.message-content .media-body .pad-btm{padding-bottom: 0;}
|
||||||
|
.message-content .media-left{float: left;margin-right: 10px;}
|
||||||
|
.message-content .media-left img{border-radius: 50%;}
|
||||||
|
.message-text{padding-top: 10px;}
|
||||||
|
.message-content-btn{text-align: center;}
|
||||||
|
.message-content .layui-btn{height: auto;line-height: 26px; padding: 5px 30px; font-size: 16px;}
|
||||||
|
|
||||||
|
/* 搜索结果页面 */
|
||||||
|
.layadmin-serach-main .layui-card-header{height: auto; line-height: 24px; padding: 15px;}
|
||||||
|
.layadmin-serach-list{margin-bottom: 10px; padding: 10px 0; border-bottom: 1px solid #f6f6f6;}
|
||||||
|
.layadmin-serach-list h3{padding: 10px 0;}
|
||||||
|
.layadmin-serach-list h3 .layui-badge{top: -2px;}
|
||||||
|
.layadmin-serach-list p{color: #5F5F5F;}
|
||||||
|
.layadmin-serach-list li{margin-bottom: 20px; padding-bottom: 20px; clear: both;}
|
||||||
|
.layui-serachlist-cover{float: left; margin-right: 15px;}
|
||||||
|
.layui-serachlist-cover img{width: 90px; height: 90px;}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* 用户列表开始 */
|
||||||
|
.layadmin-caller{background: #fff;padding: 30px;}
|
||||||
|
.layadmin-caller em{font-style: normal;}
|
||||||
|
.layadmin-caller .caller-fl{float: left;}
|
||||||
|
.layadmin-caller .caller-fr{float: right;}
|
||||||
|
.layadmin-caller .caller-seach{position: relative;padding-bottom:40px;}
|
||||||
|
.layadmin-caller .caller-seach .caller-icon{font-size: 18px;position: absolute;top: 9px;}
|
||||||
|
.layadmin-caller .caller-seach-icon{left: 6px;}
|
||||||
|
.layadmin-caller .caller-dump-icon{right: 6px;cursor: pointer;}
|
||||||
|
.layadmin-caller .caller-pl32{padding:0 32px;}
|
||||||
|
.layadmin-caller .caller-tab{margin:0;}
|
||||||
|
.layadmin-caller .caller-contar{padding-bottom:20px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item{padding:25px 0;overflow: hidden;border-bottom: 1px solid #e0e0e0;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main{margin-left: 20px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main p{line-height: 100%;padding:8px 0;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main p:first-child{padding-top:0;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main em{margin-left: 5px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main .caller-adds i{padding-right: 5px;margin:0;}
|
||||||
|
.layadmin-caller .caller-contar .caller-item .caller-main .caller-adds{padding-bottom:12px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-iconset i{margin:0 5px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-iconset i:first-child{margin-left: 0;}
|
||||||
|
.layadmin-caller .caller-contar button{margin-top: 22px;}
|
||||||
|
.layadmin-caller .caller-contar .caller-img{width: 40px;height: 40px;border-radius: 100%;}
|
||||||
|
/****** 模板结束 ******/
|
||||||
18
src/res/views/system/about.html
Normal file
18
src/res/views/system/about.html
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
|
||||||
|
<div class="layui-card-header">版本</div>
|
||||||
|
<div class="layui-card-body layui-text layadmin-about">
|
||||||
|
<blockquote class="layui-elem-quote" style="border: none;">
|
||||||
|
<script type="text/html" template>
|
||||||
|
<p>当前版本：v{{ layui.admin.v }}</p>
|
||||||
|
</script>
|
||||||
|
</blockquote>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card-header">关于</div>
|
||||||
|
<div class="layui-card-body layui-text layadmin-about">
|
||||||
|
<blockquote class="layui-elem-quote" style="border: none;">
|
||||||
|
一套纯静态的 HTML 网页界面模板，以开源免费的 Layui 基础组件和页面模板 Demo 为组成，没有任何后端程序及数据库存储等服务端代码。
|
||||||
|
<br><br>开发者使用该网页模板，可省去前端的大量工作，从而更高效地开发 Web 应用系统。
|
||||||
|
<br><br>该主题受国家计算机软件著作权保护（登记号：2018SR410669），只在 Layui 官方授权合作平台提供获取入口，禁止在其他第三方平台公开及传播主题源文件、盗版及非法倒卖等，违者将自行承担相应的法律责任。
|
||||||
|
</blockquote>
|
||||||
|
</div>
|
||||||
85
src/res/views/system/theme.html
Normal file
85
src/res/views/system/theme.html
Normal file
@@ -0,0 +1,85 @@
|
|||||||
|
<!-- 主题设置模板 -->
|
||||||
|
|
||||||
|
<script type="text/html" template lay-done="layui.data.theme();">
|
||||||
|
{{#
|
||||||
|
var local = layui.data(layui.setter.tableName);
|
||||||
|
var theme = local.theme || {};
|
||||||
|
var color = theme.color || {};
|
||||||
|
var themeColorIndex = parseInt((theme && theme.color) ? theme.color.index : 0) || 0;
|
||||||
|
}}
|
||||||
|
|
||||||
|
<div class="layui-card-header">
|
||||||
|
<strong>主题设置</strong>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body layadmin-setTheme">
|
||||||
|
<h5><strong>配色方案</strong></h5>
|
||||||
|
<ul class="layadmin-setTheme-color">
|
||||||
|
{{# layui.each(layui.setter.theme.color, function(index, item){ }}
|
||||||
|
<li layadmin-event="setTheme" data-index="{{ index }}" data-alias="{{ item.alias }}"
|
||||||
|
{{- index === themeColorIndex ? 'class="layui-this"' : '' }} title="{{ item.alias }}">
|
||||||
|
<div class="layadmin-setTheme-header" style="background-color: {{ item.header }};"></div>
|
||||||
|
<div class="layadmin-setTheme-side" style="background-color: {{ item.main }};">
|
||||||
|
<div class="layadmin-setTheme-logo" style="background-color: {{ item.logo }};"></div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
{{# }); }}
|
||||||
|
</ul>
|
||||||
|
<h5><strong>自定义配色</strong></h5>
|
||||||
|
<ul class="layadmin-setTheme-custom">
|
||||||
|
<li>主题色 <div class="set-custom-theme" data-name="main" lay-options="{color: '{{= color.main }}'}"></div></li>
|
||||||
|
<li>选中色 <div class="set-custom-theme" data-name="selected" lay-options="{color: '{{= color.selected }}'}"></div></li>
|
||||||
|
<li>LOGO 背景色 <div class="set-custom-theme" data-name="logo" lay-options="{color: '{{= color.logo }}'}"></div></li>
|
||||||
|
<li>头部拦背景色 <div class="set-custom-theme" data-name="header" lay-options="{color: '{{= color.header }}'}"></div></li>
|
||||||
|
<li>恢复默认主题 <div class="set-default-theme"><button class="layui-btn layui-btn-primary"><i class="layui-icon layui-icon-refresh-1"></i></button></div></li>
|
||||||
|
</ul>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
layui.data.theme = function(){
|
||||||
|
layui.use(['form', 'colorpicker'], function(){
|
||||||
|
var $ = layui.$;
|
||||||
|
var layer = layui.layer;
|
||||||
|
var form = layui.form
|
||||||
|
var colorpicker = layui.colorpicker
|
||||||
|
var admin = layui.admin;
|
||||||
|
var view = layui.view;
|
||||||
|
|
||||||
|
|
||||||
|
var local = layui.data(layui.setter.tableName);
|
||||||
|
var theme = local.theme || {};
|
||||||
|
var color = theme.color || {};
|
||||||
|
|
||||||
|
// 自定义配色
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '.set-custom-theme',
|
||||||
|
done: function(value){
|
||||||
|
var elem = this.elem;
|
||||||
|
var NAME = elem.data('name');
|
||||||
|
|
||||||
|
color[NAME] = value;
|
||||||
|
|
||||||
|
admin.theme({
|
||||||
|
color: color
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 恢复默认主题
|
||||||
|
$('.set-default-theme').on('click', function() {
|
||||||
|
layer.confirm('确认恢复默认主题吗？', function(i) {
|
||||||
|
layer.close(i);
|
||||||
|
admin.events.setTheme($('.layadmin-setTheme-color>li:eq(0)'));
|
||||||
|
admin.initTheme(0);
|
||||||
|
view('LAY_adminPopupTheme').render('system/theme');
|
||||||
|
})
|
||||||
|
});
|
||||||
|
|
||||||
|
// 事件-隐藏开关
|
||||||
|
form.on('switch(system-theme-sideicon)', function(){
|
||||||
|
admin.theme({
|
||||||
|
hideSideIcon: this.checked
|
||||||
|
})
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
109
src/views/app/content/comment.html
Normal file
109
src/views/app/content/comment.html
Normal file
@@ -0,0 +1,109 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 内容系统 - 评论管理</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">ID</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="cid" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">评论者</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="username" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">评论内容</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="content" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<button class="layui-btn layuiadmin-btn-comm" data-type="reload" lay-submit lay-filter="LAY-app-contcomm-search">
|
||||||
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div style="padding-bottom: 10px;">
|
||||||
|
<button class="layui-btn layuiadmin-btn-comm" data-type="batchdel">删除</button>
|
||||||
|
</div>
|
||||||
|
<table id="LAY-app-content-comm" lay-filter="LAY-app-content-comm"></table>
|
||||||
|
<script type="text/html" id="table-content-com">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'contlist', 'table'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,form = layui.form
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
|
||||||
|
//事件-搜索
|
||||||
|
form.on('submit(LAY-app-contcomm-search)', function(data){
|
||||||
|
var field = data.field;
|
||||||
|
|
||||||
|
//执行重载
|
||||||
|
table.reload('LAY-app-content-comm', {
|
||||||
|
where: field
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
//点击事件
|
||||||
|
var active = {
|
||||||
|
batchdel: function(){
|
||||||
|
var checkStatus = table.checkStatus('LAY-app-content-comm')
|
||||||
|
,checkData = checkStatus.data; //得到选中的数据
|
||||||
|
|
||||||
|
if(checkData.length === 0){
|
||||||
|
return layer.msg('请选择数据');
|
||||||
|
}
|
||||||
|
|
||||||
|
layer.confirm('确定删除吗？', function(index) {
|
||||||
|
|
||||||
|
//执行 Ajax 后重载
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: 'xxx'
|
||||||
|
//,……
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
table.reload('LAY-app-content-comm');
|
||||||
|
layer.msg('已删除');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('.layui-btn.layuiadmin-btn-comm').on('click', function(){
|
||||||
|
var type = $(this).data('type');
|
||||||
|
active[type] ? active[type].call(this) : '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
143
src/views/app/content/list.html
Normal file
143
src/views/app/content/list.html
Normal file
@@ -0,0 +1,143 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 内容系统 - 文章列表</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">文章ID</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="id" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">作者</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="author" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">标题</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="title" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">文章标签</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select name="label">
|
||||||
|
<option value="">请选择标签</option>
|
||||||
|
<option value="0">美食</option>
|
||||||
|
<option value="1">新闻</option>
|
||||||
|
<option value="2">八卦</option>
|
||||||
|
<option value="3">体育</option>
|
||||||
|
<option value="4">音乐</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="LAY-app-contlist-search">
|
||||||
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div style="padding-bottom: 10px;">
|
||||||
|
<button class="layui-btn layuiadmin-btn-list" data-type="batchdel">删除</button>
|
||||||
|
<button class="layui-btn layuiadmin-btn-list" data-type="add">添加</button>
|
||||||
|
</div>
|
||||||
|
<table id="LAY-app-content-list" lay-filter="LAY-app-content-list"></table>
|
||||||
|
<script type="text/html" id="buttonTpl">
|
||||||
|
{{# if(d.status){ }}
|
||||||
|
<button class="layui-btn layui-btn-xs">已发布</button>
|
||||||
|
{{# } else { }}
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-xs">待修改</button>
|
||||||
|
{{# } }}
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="table-content-list">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'contlist', 'table'], function(){
|
||||||
|
var table = layui.table
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
//事件-搜索
|
||||||
|
form.on('submit(LAY-app-contlist-search)', function(data){
|
||||||
|
var field = data.field;
|
||||||
|
|
||||||
|
//执行重载
|
||||||
|
table.reload('LAY-app-content-list', {
|
||||||
|
where: field
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
var $ = layui.$, active = {
|
||||||
|
batchdel: function(){
|
||||||
|
var checkStatus = table.checkStatus('LAY-app-content-list')
|
||||||
|
,checkData = checkStatus.data; //得到选中的数据
|
||||||
|
|
||||||
|
if(checkData.length === 0){
|
||||||
|
return layer.msg('请选择数据');
|
||||||
|
}
|
||||||
|
|
||||||
|
layer.confirm('确定删除吗？', function(index) {
|
||||||
|
|
||||||
|
//执行 Ajax 后重载
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: 'xxx'
|
||||||
|
//,……
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
table.reload('LAY-app-content-list');
|
||||||
|
layer.msg('已删除');
|
||||||
|
});
|
||||||
|
},
|
||||||
|
add: function(){
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '添加文章'
|
||||||
|
,content: 'listform.html'
|
||||||
|
,maxmin: true
|
||||||
|
,area: ['550px', '550px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
//点击确认触发 iframe 内容中的按钮提交
|
||||||
|
var submit = layero.find('iframe').contents().find("#layuiadmin-app-form-submit");
|
||||||
|
submit.click();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$('.layui-btn.layuiadmin-btn-list').on('click', function(){
|
||||||
|
var type = $(this).data('type');
|
||||||
|
active[type] ? active[type].call(this) : '';
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
63
src/views/app/content/tags.html
Normal file
63
src/views/app/content/tags.html
Normal file
@@ -0,0 +1,63 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 内容系统-分类管理</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<button class="layui-btn layuiadmin-btn-tags" data-type="add">添加</button>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<table id="LAY-app-content-tags" lay-filter="LAY-app-content-tags"></table>
|
||||||
|
<script type="text/html" id="layuiadmin-app-cont-tagsbar">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js?t=1620796937182"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'contlist', 'table'], function(){
|
||||||
|
|
||||||
|
var table = layui.table;
|
||||||
|
var $ = layui.$, active = {
|
||||||
|
add: function(){
|
||||||
|
layer.open({
|
||||||
|
type: 2
|
||||||
|
,title: '添加分类'
|
||||||
|
,content: 'tagsform.html'
|
||||||
|
,area: ['450px', '200px']
|
||||||
|
,btn: ['确定', '取消']
|
||||||
|
,yes: function(index, layero){
|
||||||
|
var othis = layero.find('iframe').contents().find("#layuiadmin-app-form-tags")
|
||||||
|
,tags = othis.find('input[name="tags"]').val();
|
||||||
|
|
||||||
|
if(!tags.replace(/\s/g, '')) return;
|
||||||
|
|
||||||
|
table.reload('LAY-app-content-tags');
|
||||||
|
layer.close(index);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$('.layui-btn.layuiadmin-btn-tags').on('click', function(){
|
||||||
|
var type = $(this).data('type');
|
||||||
|
active[type] ? active[type].call(this) : '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
128
src/views/app/forum/list.html
Normal file
128
src/views/app/forum/list.html
Normal file
@@ -0,0 +1,128 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 社区系统-帖子列表</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">ID</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="id" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">发帖人</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="poster" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">发帖内容</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="content" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">帖子状态</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<select name="top">
|
||||||
|
<option value="0">正常</option>
|
||||||
|
<option value="1">置顶</option>
|
||||||
|
<option value="2">封禁</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<button class="layui-btn layuiadmin-btn-forum-list" lay-submit lay-filter="LAY-app-forumlist-search">
|
||||||
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div style="padding-bottom: 10px;">
|
||||||
|
<button class="layui-btn layuiadmin-btn-forum-list" data-type="batchdel">删除</button>
|
||||||
|
</div>
|
||||||
|
<table id="LAY-app-forum-list" lay-filter="LAY-app-forum-list"></table>
|
||||||
|
<script type="text/html" id="imgTpl">
|
||||||
|
<img style="display: inline-block; width: 50%; height: 100%;" src= {{ d.avatar }}>
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="buttonTpl">
|
||||||
|
{{# if(d.top == true){ }}
|
||||||
|
<button class="layui-btn layui-btn-xs">已置顶</button>
|
||||||
|
{{# } else { }}
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-xs">正常显示</button>
|
||||||
|
{{# } }}
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="table-forum-list">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'forum', 'table'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,form = layui.form
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
//事件-搜索
|
||||||
|
form.on('submit(LAY-app-forumlist-search)', function(data){
|
||||||
|
var field = data.field;
|
||||||
|
|
||||||
|
//执行重载
|
||||||
|
table.reload('LAY-app-forum-list', {
|
||||||
|
where: field
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件
|
||||||
|
var active = {
|
||||||
|
batchdel: function(){
|
||||||
|
var checkStatus = table.checkStatus('LAY-app-forum-list')
|
||||||
|
,checkData = checkStatus.data; //得到选中的数据
|
||||||
|
|
||||||
|
if(checkData.length === 0){
|
||||||
|
return layer.msg('请选择数据');
|
||||||
|
}
|
||||||
|
|
||||||
|
layer.confirm('确定删除吗？', function(index) {
|
||||||
|
|
||||||
|
//执行 Ajax 后重载
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: 'xxx'
|
||||||
|
//,……
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
table.reload('LAY-app-forum-list');
|
||||||
|
layer.msg('已删除');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('.layui-btn.layuiadmin-btn-forum-list').on('click', function(){
|
||||||
|
var type = $(this).data('type');
|
||||||
|
active[type] ? active[type].call(this) : '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
103
src/views/app/forum/replys.html
Normal file
103
src/views/app/forum/replys.html
Normal file
@@ -0,0 +1,103 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 社区系统-回帖列表</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline layuiadmin-input-useradmin">
|
||||||
|
<label class="layui-form-label">回帖人</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="replyer" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">回帖内容</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="content" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<button class="layui-btn layuiadmin-btn-replys" data-type="reload" lay-submit lay-filter="LAY-app-forumreply-search">
|
||||||
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div style="padding-bottom: 10px;">
|
||||||
|
<button class="layui-btn layuiadmin-btn-replys" data-type="batchdel">删除</button>
|
||||||
|
</div>
|
||||||
|
<table id="LAY-app-forumreply-list" lay-filter="LAY-app-forumreply-list"></table>
|
||||||
|
<script type="text/html" id="imgTpl">
|
||||||
|
<img style="display: inline-block; width: 50%; height: 100%;" src= {{ d.avatar }}>
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="table-forum-replys">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'forum', 'table'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,form = layui.form
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
//事件-搜索
|
||||||
|
form.on('submit(LAY-app-forumreply-search)', function(data){
|
||||||
|
var field = data.field;
|
||||||
|
|
||||||
|
//执行重载
|
||||||
|
table.reload('LAY-app-forumreply-list', {
|
||||||
|
where: field
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
var active = {
|
||||||
|
batchdel: function(){
|
||||||
|
var checkStatus = table.checkStatus('LAY-app-forumreply-list')
|
||||||
|
,checkData = checkStatus.data; //得到选中的数据
|
||||||
|
|
||||||
|
if(checkData.length === 0){
|
||||||
|
return layer.msg('请选择数据');
|
||||||
|
}
|
||||||
|
|
||||||
|
layer.confirm('确定删除吗？', function(index) {
|
||||||
|
|
||||||
|
//执行 Ajax 后重载
|
||||||
|
/*
|
||||||
|
admin.req({
|
||||||
|
url: 'xxx'
|
||||||
|
//,……
|
||||||
|
});
|
||||||
|
*/
|
||||||
|
table.reload('LAY-app-forumreply-list');
|
||||||
|
layer.msg('已删除');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('.layui-btn.layuiadmin-btn-replys').on('click', function(){
|
||||||
|
var type = $(this).data('type');
|
||||||
|
active[type] ? active[type].call(this) : '';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
65
src/views/app/message/index.html
Normal file
65
src/views/app/message/index.html
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>消息中心</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-app-message">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-tab layui-tab-brief">
|
||||||
|
<ul class="layui-tab-title">
|
||||||
|
<li class="layui-this">全部消息</li>
|
||||||
|
<li>通知<span class="layui-badge">6</span></li>
|
||||||
|
<li>私信</li>
|
||||||
|
</ul>
|
||||||
|
<div class="layui-tab-content">
|
||||||
|
|
||||||
|
<div class="layui-tab-item layui-show">
|
||||||
|
<div class="LAY-app-message-btns" style="margin-bottom: 10px;">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="all" data-events="del">删除</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="all" data-events="ready">标记已读</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="all" data-events="readyAll">全部已读</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="LAY-app-message-all" lay-filter="LAY-app-message-all"></table>
|
||||||
|
</div>
|
||||||
|
<div class="layui-tab-item">
|
||||||
|
|
||||||
|
<div class="LAY-app-message-btns" style="margin-bottom: 10px;">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="notice" data-events="del">删除</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="notice" data-events="ready">标记已读</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="notice" data-events="readyAll">全部已读</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="LAY-app-message-notice" lay-filter="LAY-app-message-notice"></table>
|
||||||
|
</div>
|
||||||
|
<div class="layui-tab-item">
|
||||||
|
|
||||||
|
<div class="LAY-app-message-btns" style="margin-bottom: 10px;">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="direct" data-events="del">删除</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="direct" data-events="ready">标记已读</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm" data-type="direct" data-events="readyAll">全部已读</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table id="LAY-app-message-direct" lay-filter="LAY-app-message-direct"></table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'message']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
93
src/views/app/workorder/list.html
Normal file
93
src/views/app/workorder/list.html
Normal file
@@ -0,0 +1,93 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 工单系统</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-form layui-card-header layuiadmin-card-header-auto">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">工单号</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="orderid" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">工单标题</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="title" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">业务性质</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="attr" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">受理人</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="accept" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<button class="layui-btn layuiadmin-btn-order" lay-submit lay-filter="LAY-app-order-search">
|
||||||
|
<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<table id="LAY-app-system-order" lay-filter="LAY-app-system-order"></table>
|
||||||
|
<script type="text/html" id="progressTpl">
|
||||||
|
<div class="layui-progress layuiadmin-order-progress" lay-filter="progress-"+ {{ d.orderid }} +"">
|
||||||
|
<div class="layui-progress-bar layui-bg-blue" lay-percent= {{ d.progress }}></div>
|
||||||
|
</div>
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="buttonTpl">
|
||||||
|
{{# if(d.state == '已处理'){ }}
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-xs">已处理</button>
|
||||||
|
{{# } else if(d.state == '未分配'){ }}
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-xs">未分配</button>
|
||||||
|
{{# } else{ }}
|
||||||
|
<button class="layui-btn layui-btn-warm layui-btn-xs">处理中</button>
|
||||||
|
{{# } }}
|
||||||
|
</script>
|
||||||
|
<script type="text/html" id="table-system-order">
|
||||||
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'workorder', 'table'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,form = layui.form
|
||||||
|
,table = layui.table;
|
||||||
|
|
||||||
|
//事件-搜索
|
||||||
|
form.on('submit(LAY-app-order-search)', function(data){
|
||||||
|
var field = data.field;
|
||||||
|
|
||||||
|
//执行重载
|
||||||
|
table.reload('LAY-app-system-order', {
|
||||||
|
where: field
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
71
src/views/app/workorder/listform.html
Normal file
71
src/views/app/workorder/listform.html
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>layuiAdmin 工单管理 iframe 框</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-form" lay-filter="layuiadmin-form-order" id="layuiadmin-form-order" style="padding: 20px 30px 0 0;">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">业务性质</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="attr" lay-verify="required" placeholder="请输入业务性质" 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="text" name="title" lay-verify="required" placeholder="工单标题..." 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="text" name="progress" lay-verify="required" placeholder="工单进度..." autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">工单状态</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select name="state">
|
||||||
|
<option value="未分配">未分配</option>
|
||||||
|
<option value="处理中">处理中</option>
|
||||||
|
<option value="已处理">已处理</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">受理人员</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select name="accept">
|
||||||
|
<option value="">请选择受理人员</option>
|
||||||
|
<option value="员工-1">员工-1</option>
|
||||||
|
<option value="员工-2">员工-2</option>
|
||||||
|
<option value="员工-3">员工-3</option>
|
||||||
|
<option value="员工-4">员工-4</option>
|
||||||
|
<option value="员工-5">员工-5</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item layui-hide">
|
||||||
|
<input type="button" lay-submit lay-filter="LAY-app-workorder-submit" id="LAY-app-workorder-submit" value="确认">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'form'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
123
src/views/component/anim/index.html
Normal file
123
src/views/component/anim/index.html
Normal file
@@ -0,0 +1,123 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>动画</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>动画</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 这段样式只是用于演示 */
|
||||||
|
#component-anim .layui-card-body{padding: 15px;}
|
||||||
|
|
||||||
|
#component-anim .component-anim-demo{margin-bottom: 50px; font-size: 0;}
|
||||||
|
#component-anim .component-anim-demo li{display: inline-block; vertical-align: middle; width: 127px; line-height: 25px; padding: 20px 0; margin-right: -1px; margin-bottom: -1px; border: 1px solid #e2e2e2; font-size: 14px; text-align: center; color: #5F5F5F; transition: all .3s; -webkit-transition: all .3s;}
|
||||||
|
#component-anim .component-anim-demo li .layui-icon{display: inline-block; font-size: 36px;}
|
||||||
|
|
||||||
|
#component-anim .component-anim-demo li .fontclass{display: none;}
|
||||||
|
#component-anim .component-anim-demo li .name{color: #c2c2c2;}
|
||||||
|
#component-anim .component-anim-demo li:hover{background-color: #f2f2f2; color: #000;}
|
||||||
|
|
||||||
|
#component-anim .component-anim-demo li{width: 222px;}
|
||||||
|
#component-anim .component-anim-demo .layui-anim{width: 150px; height: 150px; line-height: 150px; margin: 0 auto 10px; text-align: center; background-color: #16baaa; cursor: pointer; color: #fff; border-radius: 50%;}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="component-anim">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">点击演示动画</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<ul class="component-anim-demo">
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-up">从最底部往上滑入</div>
|
||||||
|
<div class="code">layui-anim-up</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-upbit">微微往上滑入</div>
|
||||||
|
<div class="code">layui-anim-upbit</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-scale">平滑放大</div>
|
||||||
|
<div class="code">layui-anim-scale</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-scaleSpring">弹簧式放大</div>
|
||||||
|
<div class="code">layui-anim-scaleSpring</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<ul class="component-anim-demo">
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-fadein">渐现</div>
|
||||||
|
<div class="code">layui-anim-fadein</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-fadeout">渐隐</div>
|
||||||
|
<div class="code">layui-anim-fadeout</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-rotate">360度旋转</div>
|
||||||
|
<div class="code">layui-anim-rotate</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="layui-anim" data-anim="layui-anim-rotate layui-anim-loop">循环动画</div>
|
||||||
|
<div class="code">追加：layui-anim-loop</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,element = layui.element
|
||||||
|
,router = layui.router();
|
||||||
|
|
||||||
|
/* 演示动画 */
|
||||||
|
$('#component-anim .component-anim-demo .layui-anim').on('click', function(){
|
||||||
|
var othis = $(this), anim = othis.data('anim');
|
||||||
|
|
||||||
|
/* 停止循环 */
|
||||||
|
if(othis.hasClass('layui-anim-loop')){
|
||||||
|
return othis.removeClass(anim);
|
||||||
|
}
|
||||||
|
|
||||||
|
othis.removeClass(anim);
|
||||||
|
|
||||||
|
setTimeout(function(){
|
||||||
|
othis.addClass(anim);
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 恢复渐隐 */
|
||||||
|
if(anim === 'layui-anim-fadeout'){
|
||||||
|
setTimeout(function(){
|
||||||
|
othis.removeClass(anim);
|
||||||
|
}, 1300);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
112
src/views/component/auxiliar/index.html
Normal file
112
src/views/component/auxiliar/index.html
Normal file
@@ -0,0 +1,112 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>辅助元素</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>辅助</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 这段样式只是用于演示 */
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">引用区块</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<blockquote class="layui-elem-quote">默认引用</blockquote>
|
||||||
|
|
||||||
|
<blockquote class="layui-elem-quote layui-quote-nm">
|
||||||
|
穷则独善其身，达则兼济天下
|
||||||
|
<br>——孟子（亚圣）
|
||||||
|
</blockquote>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">字段集区块</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<fieldset class="layui-elem-field">
|
||||||
|
<legend>爱好</legend>
|
||||||
|
<div class="layui-field-box">
|
||||||
|
你可以在这里放任何内容
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<fieldset class="layui-elem-field layui-field-title">
|
||||||
|
<legend>带标题的横线</legend>
|
||||||
|
</fieldset>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">分割线</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
默认分割线
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
赤色分割线
|
||||||
|
<hr class="layui-bg-red">
|
||||||
|
|
||||||
|
橙色分割线
|
||||||
|
<hr class="layui-bg-orange">
|
||||||
|
|
||||||
|
墨绿分割线
|
||||||
|
<hr class="layui-bg-green">
|
||||||
|
|
||||||
|
青色分割线
|
||||||
|
<hr class="layui-bg-cyan">
|
||||||
|
|
||||||
|
蓝色分割线
|
||||||
|
<hr class="layui-bg-blue">
|
||||||
|
|
||||||
|
黑色分割线
|
||||||
|
<hr class="layui-bg-black">
|
||||||
|
|
||||||
|
灰色分割线
|
||||||
|
<hr class="layui-bg-gray">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">纯圆角</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<div class="layui-inline">
|
||||||
|
<img src="https://unpkg.com/outeres/demo/avatar/0.png" class="layui-circle">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
99
src/views/component/badge/index.html
Normal file
99
src/views/component/badge/index.html
Normal file
@@ -0,0 +1,99 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>徽章</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">小徽章大家族</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<br>小圆点：
|
||||||
|
|
||||||
|
<span class="layui-badge-dot"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-orange"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-green"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-cyan"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-blue"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-black"></span>
|
||||||
|
<span class="layui-badge-dot layui-bg-gray"></span>
|
||||||
|
|
||||||
|
<br><br>常规弧形徽章：
|
||||||
|
|
||||||
|
<span class="layui-badge">6</span>
|
||||||
|
<span class="layui-badge">99</span>
|
||||||
|
<span class="layui-badge">61728</span>
|
||||||
|
<span class="layui-badge">赤</span>
|
||||||
|
<span class="layui-badge layui-bg-orange">橙</span>
|
||||||
|
<span class="layui-badge layui-bg-green">绿</span>
|
||||||
|
<span class="layui-badge layui-bg-cyan">青</span>
|
||||||
|
<span class="layui-badge layui-bg-blue">蓝</span>
|
||||||
|
<span class="layui-badge layui-bg-black">黑</span>
|
||||||
|
<span class="layui-badge layui-bg-gray">灰</span>
|
||||||
|
|
||||||
|
<br><br>边框徽章：
|
||||||
|
|
||||||
|
<span class="layui-badge-rim">6</span>
|
||||||
|
<span class="layui-badge-rim">Hot</span>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">与其它元素的搭配</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn">查看消息<span class="layui-badge layui-bg-gray">1</span></button>
|
||||||
|
<button class="layui-btn">动态<span class="layui-badge-dot layui-bg-orange"></span></button>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
<ul class="layui-nav style=" text-align:="" right;"=""> <-- 小Tips：这里有没有发现，设置导航靠右对齐（或居中对齐）其实非常简单 -->
|
||||||
|
<li class="layui-nav-item">
|
||||||
|
<a href="">控制台<span class="layui-badge">9</span></a>
|
||||||
|
</li>
|
||||||
|
<li class="layui-nav-item">
|
||||||
|
<a href="">个人中心<span class="layui-badge-dot"></span></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<div class="layui-tab layui-tab-brief">
|
||||||
|
<ul class="layui-tab-title">
|
||||||
|
<li class="layui-this">网站设置</li>
|
||||||
|
<li>用户管理<span class="layui-badge-dot"></span></li>
|
||||||
|
<li>最新邮件<span class="layui-badge">99+</span></li>
|
||||||
|
</ul>
|
||||||
|
<div class="layui-tab-content"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
181
src/views/component/button/index.html
Normal file
181
src/views/component/button/index.html
Normal file
@@ -0,0 +1,181 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>按钮</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<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-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-primary">原始按钮</button>
|
||||||
|
<button class="layui-btn">默认按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-normal">百搭按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-warm">暖色按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-danger">警告按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-disabled">禁用按钮</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">按钮尺寸</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-lg">大型按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-primary">默认按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm">小型按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-xs">迷你按钮</button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-lg">大型按钮</button>
|
||||||
|
<button class="layui-btn">默认按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-sm">小型按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-xs">迷你按钮</button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-lg layui-btn-normal">大型按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-normal">默认按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-sm layui-btn-normal">小型按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-xs layui-btn-normal">迷你按钮</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">按钮图标</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn"><i class="layui-icon"></i></button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
</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-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-radius">原始按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-radius">默认按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-normal layui-btn-radius">百搭按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-warm layui-btn-radius">暖色按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-danger layui-btn-radius">警告按钮</button>
|
||||||
|
<button class="layui-btn layui-btn-disabled layui-btn-radius">禁用按钮</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">按钮混搭</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius">大型加圆角</button>
|
||||||
|
<a href="http://www.baidu.com/doc/element/button.html" class="layui-btn" target="_blank">跳转的按钮</a>
|
||||||
|
<button class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon"></i> 删除</button>
|
||||||
|
<button class="layui-btn layui-btn-xs layui-btn-disabled"><i class="layui-icon"></i> 分享</button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">按钮组合</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<div class="layui-btn-group">
|
||||||
|
<button class="layui-btn">增加</button>
|
||||||
|
<button class="layui-btn ">编辑</button>
|
||||||
|
<button class="layui-btn">删除</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<div class="layui-btn-group">
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
</div>
|
||||||
|
<div class="layui-btn-group">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm">文字</button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">按钮铺满</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-fluid">好雨知时节</button>
|
||||||
|
<button class="layui-btn layui-btn-fluid">当春乃发生</button>
|
||||||
|
<button class="layui-btn layui-btn-fluid">随风潜入夜</button>
|
||||||
|
<button class="layui-btn layui-btn-fluid">润物细无声</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
231
src/views/component/carousel/index.html
Normal file
231
src/views/component/carousel/index.html
Normal file
@@ -0,0 +1,231 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>轮播</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 为了区分效果 */
|
||||||
|
#LAY-demo-carousel div[carousel-item]>*{text-align: center; line-height: 280px; color: #5F5F5F;}
|
||||||
|
#LAY-demo-carousel div[carousel-item]>*:nth-child(2n){background-color: #E2E2E2;}
|
||||||
|
#LAY-demo-carousel div[carousel-item]>*:nth-child(2n+1){background-color: #eee;}
|
||||||
|
#test-carousel-normal-2 div[carousel-item]>*{line-height: 120px;}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>轮播</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-demo-carousel">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">常规轮播</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div class="layui-carousel" id="test-carousel-normal" lay-filter="test-carousel-normal">
|
||||||
|
<div carousel-item="">
|
||||||
|
<div>条目1</div>
|
||||||
|
<div>条目2</div>
|
||||||
|
<div>条目3</div>
|
||||||
|
<div>条目4</div>
|
||||||
|
<div>条目5</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-carousel" id="test-carousel-normal-2" style="margin-top: 15px;">
|
||||||
|
<div carousel-item="">
|
||||||
|
<div>条目1</div>
|
||||||
|
<div>条目2</div>
|
||||||
|
</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-form">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">宽高</label>
|
||||||
|
<div class="layui-input-inline" style="width: 98px;">
|
||||||
|
<input type="tel" name="width" value="600" autocomplete="off" placeholder="width" class="layui-input test-carousel-demoSet">
|
||||||
|
</div>
|
||||||
|
<div class="layui-input-inline" style="width: 98px;">
|
||||||
|
<input type="tel" name="height" value="280" autocomplete="off" placeholder="height" class="layui-input test-carousel-demoSet">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">动画类型</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<div class="layui-btn-group test-carousel-demoTest" style="margin-top: 5px;">
|
||||||
|
<button class="layui-btn layui-btn-sm" style="background-color: #16b777;" data-type="set" data-key="anim" data-value="default">左右切换</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="anim" data-value="updown">上下切换</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="anim" data-value="fade">渐隐渐显</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">箭头状态</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<div class="layui-btn-group test-carousel-demoTest" style="margin-top: 5px;">
|
||||||
|
<button class="layui-btn layui-btn-sm" style="background-color: #16b777;" data-type="set" data-key="arrow" data-value="hover">悬停显示</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="arrow" data-value="always">始终显示</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="arrow" data-value="none">不显示</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">指示器位置</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<div class="layui-btn-group test-carousel-demoTest" style="margin-top: 5px;">
|
||||||
|
<button class="layui-btn layui-btn-sm" style="background-color: #16b777;" data-key="indicator" data-type="set" data-value="inside">容器内部</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="indicator" data-value="outside">容器外部</button>
|
||||||
|
<button class="layui-btn layui-btn-sm" data-type="set" data-key="indicator" data-value="none">不显示</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">自动切换</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="switch" lay-skin="switch" checked="" lay-text="ON|OFF" lay-filter="test-carousel-autoplay">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label" style="width: auto;">时间间隔</label>
|
||||||
|
<div class="layui-input-inline" style="width: 120px;">
|
||||||
|
<input type="tel" name="interval" value="3000" autocomplete="off" placeholder="毫秒" class="layui-input test-carousel-demoSet">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-carousel" id="test-carousel-demo" lay-filter="test-carousel-demo">
|
||||||
|
<div carousel-item="">
|
||||||
|
<div>条目1</div>
|
||||||
|
<div>条目2</div>
|
||||||
|
<div>条目3</div>
|
||||||
|
<div>条目4</div>
|
||||||
|
<div>条目5</div>
|
||||||
|
</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" id="test-carousel-img">
|
||||||
|
<div carousel-item="">
|
||||||
|
<div><img src="https://unpkg.com/outeres/demo/carousel/720x360-1.jpg"></div>
|
||||||
|
<div><img src="https://unpkg.com/outeres/demo/carousel/720x360-2.jpg"></div>
|
||||||
|
<div><img src="https://unpkg.com/outeres/demo/carousel/720x360-3.jpg"></div>
|
||||||
|
<div><img src="https://unpkg.com/outeres/demo/carousel/720x360-4.jpg"></div>
|
||||||
|
<div><img src="https://unpkg.com/outeres/demo/carousel/720x360-5.jpg"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'carousel', 'form'], function(){
|
||||||
|
var carousel = layui.carousel
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
//常规轮播
|
||||||
|
carousel.render({
|
||||||
|
elem: '#test-carousel-normal'
|
||||||
|
,arrow: 'always'
|
||||||
|
});
|
||||||
|
|
||||||
|
//改变下时间间隔、动画类型、高度
|
||||||
|
carousel.render({
|
||||||
|
elem: '#test-carousel-normal-2'
|
||||||
|
,interval: 1800
|
||||||
|
,anim: 'fade'
|
||||||
|
,height: '120px'
|
||||||
|
});
|
||||||
|
|
||||||
|
//设定各种参数
|
||||||
|
var ins3 = carousel.render({
|
||||||
|
elem: '#test-carousel-demo'
|
||||||
|
});
|
||||||
|
//图片轮播
|
||||||
|
carousel.render({
|
||||||
|
elem: '#test-carousel-img'
|
||||||
|
,width: '720px'
|
||||||
|
,height: '360px'
|
||||||
|
,interval: 5000
|
||||||
|
});
|
||||||
|
|
||||||
|
//事件
|
||||||
|
carousel.on('change(test-carousel-demo)', function(res){
|
||||||
|
console.log(res)
|
||||||
|
});
|
||||||
|
|
||||||
|
var $ = layui.$, active = {
|
||||||
|
set: function(othis){
|
||||||
|
var THIS = 'layui-bg-normal'
|
||||||
|
,key = othis.data('key')
|
||||||
|
,options = {};
|
||||||
|
|
||||||
|
othis.css('background-color', '#16b777').siblings().removeAttr('style');
|
||||||
|
options[key] = othis.data('value');
|
||||||
|
ins3.reload(options);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
//事件-开关
|
||||||
|
form.on('switch(test-carousel-autoplay)', function(){
|
||||||
|
ins3.reload({
|
||||||
|
autoplay: this.checked
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.test-carousel-demoSet').on('keyup', function(){
|
||||||
|
var value = this.value
|
||||||
|
,options = {};
|
||||||
|
if(!/^\d+$/.test(value)) return;
|
||||||
|
|
||||||
|
options[this.name] = value;
|
||||||
|
ins3.reload(options);
|
||||||
|
});
|
||||||
|
|
||||||
|
//其它示例
|
||||||
|
$('.test-carousel-demoTest .layui-btn').on('click', function(){
|
||||||
|
var othis = $(this), type = othis.data('type');
|
||||||
|
active[type] ? active[type].call(this, othis) : '';
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
250
src/views/component/code/index.html
Normal file
250
src/views/component/code/index.html
Normal file
@@ -0,0 +1,250 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>代码修饰</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>代码修饰</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">语法高亮</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<pre id="test" class="layui-test">
|
||||||
|
<textarea class="layui-hide">
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button type="button" class="layui-btn">默认按钮</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="layui-padding-3">
|
||||||
|
AaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaA
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-primary layui-border-green">主色按钮</button>
|
||||||
|
</div>
|
||||||
|
<script type="text/html">
|
||||||
|
<h3>{{= d.title }}</h3>
|
||||||
|
<ul>
|
||||||
|
{{# layui.each(d.list, function(index, item){ }}
|
||||||
|
<li>
|
||||||
|
<span>{{= item.modname }}</span>
|
||||||
|
<span>{{= item.alias }}：</span>
|
||||||
|
<span>{{= item.site || '' }}</span>
|
||||||
|
</li>
|
||||||
|
{{# }); }}
|
||||||
|
<p>{{# if(d.list.length === 0){ }}
|
||||||
|
无数据
|
||||||
|
{{# } }}</p>
|
||||||
|
</ul>
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
layui.use(function () {
|
||||||
|
var layer = layui.layer;
|
||||||
|
const a = '1'
|
||||||
|
function aa(a, b) {
|
||||||
|
return '11'
|
||||||
|
}
|
||||||
|
layer.msg(layui.v)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</textarea>
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">默认修饰</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<pre class="layui-code">// 在里面放置任意的文本内容
|
||||||
|
test
|
||||||
|
test
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">深色模式</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<pre class="layui-code" lay-options="{title: 'Custom Title', skin: 'dark'}">// 在里面放置任意的文本内容
|
||||||
|
test
|
||||||
|
test
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">固定高度</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<pre class="layui-code" lay-options="{height: '160px'}">// 在里面放置任意的文本内容
|
||||||
|
test
|
||||||
|
test
|
||||||
|
test
|
||||||
|
code line
|
||||||
|
code line
|
||||||
|
code line
|
||||||
|
code line
|
||||||
|
code line
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">不显示行号</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<pre class="layui-code" lay-options="{ln: false}">// 不显示行号（注：v2.7.3 新增）
|
||||||
|
test
|
||||||
|
test
|
||||||
|
</pre>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script src="https://cdn.staticfile.org/highlight.js/11.8.0/highlight.min.js"></script>
|
||||||
|
<script src="https://cdn.staticfile.org/prism/1.29.0/prism.min.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.use(['code', 'dropdown'], function(){
|
||||||
|
var dropdown = layui.dropdown;
|
||||||
|
var $ = layui.$;
|
||||||
|
|
||||||
|
// return;
|
||||||
|
|
||||||
|
// 高亮主题 css 库
|
||||||
|
var themeData = $.map([
|
||||||
|
// hljs 主题库
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/vs2015.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/vs.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/github-dark.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/github.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/base16/google-dark.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/base16/google-light.min.css',
|
||||||
|
'https://cdn.staticfile.org/highlight.js/11.8.0/styles/monokai-sublime.min.css',
|
||||||
|
'-',
|
||||||
|
// prism 主题库
|
||||||
|
'https://cdn.staticfile.org/prism/1.29.0/themes/prism-dark.min.css',
|
||||||
|
'https://cdn.staticfile.org/prism/1.29.0/themes/prism.min.css'
|
||||||
|
], function(v, index) {
|
||||||
|
return {
|
||||||
|
title: v,
|
||||||
|
link: v,
|
||||||
|
highlighter: v.indexOf('prism') === -1 ? 'hljs' : 'prism',
|
||||||
|
type: v === '-' ? '-' : 'normal'
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
var codeInst = layui.code({
|
||||||
|
elem: '#test',
|
||||||
|
preview: true,
|
||||||
|
codeStyle: 'height: 510px;',
|
||||||
|
previewStyle: 'word-wrap: break-word;',
|
||||||
|
// theme: 'dark',
|
||||||
|
// header: true,
|
||||||
|
// wordWrap: false, // 是否自动换行
|
||||||
|
/*
|
||||||
|
lang: 'html',
|
||||||
|
highlighter: "hljs",
|
||||||
|
codeRender: function (code, opts) {
|
||||||
|
layui.link(themeData[1].link, 'layui-code-theme');
|
||||||
|
return hljs.highlight(code, {language: opts.lang}).value;
|
||||||
|
},*/
|
||||||
|
tools: [
|
||||||
|
'full',
|
||||||
|
{
|
||||||
|
title: ['文字换行'],
|
||||||
|
type: 'form',
|
||||||
|
event: function(obj) {
|
||||||
|
dropdown.render({
|
||||||
|
elem: obj.elem,
|
||||||
|
data: [{title: '自动换行', wordWrap: true}, {title: '不自动换行', wordWrap: false}],
|
||||||
|
show: true,
|
||||||
|
click: function(data, othis) {
|
||||||
|
codeInst.reload({
|
||||||
|
wordWrap: data.wordWrap
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: ['切换高亮主题'],
|
||||||
|
type: 'theme',
|
||||||
|
event: function(obj) {
|
||||||
|
dropdown.render({
|
||||||
|
elem: obj.elem,
|
||||||
|
data: themeData,
|
||||||
|
show: true,
|
||||||
|
click: function(data, othis) {
|
||||||
|
$('#layuicss-layui-code-theme').remove();
|
||||||
|
layui.link(data.link, 'layui-code-theme');
|
||||||
|
|
||||||
|
// 若高亮器有变化，则重载
|
||||||
|
if (data.highlighter !== codeInst.config.highlighter) {
|
||||||
|
var highlighter = {
|
||||||
|
hljs: function(code, opts) {
|
||||||
|
return hljs.highlight(code, {
|
||||||
|
language: opts.lang
|
||||||
|
}).value;
|
||||||
|
},
|
||||||
|
prism: function(code, opts) {
|
||||||
|
return Prism.highlight(
|
||||||
|
code,
|
||||||
|
Prism.languages[opts.lang],
|
||||||
|
opts.lang
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 重载
|
||||||
|
codeInst.reload({
|
||||||
|
highlighter: data.highlighter,
|
||||||
|
codeRender: function (code, opts) {
|
||||||
|
return highlighter[data.highlighter](code, opts);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
// 重载 code
|
||||||
|
layui.debounce(function() {
|
||||||
|
codeInst.reload({
|
||||||
|
lang: 'html',
|
||||||
|
highlighter: "hljs",
|
||||||
|
codeRender: function(code, opts) {
|
||||||
|
layui.link(themeData[1].link, 'layui-code-theme');
|
||||||
|
return hljs.highlight(code, {language: opts.lang}).value;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, 300)();
|
||||||
|
|
||||||
|
// 通用实例，根据元素属性定制化参数
|
||||||
|
layui.code({
|
||||||
|
elem: '.layui-code'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
204
src/views/component/colorpicker/index.html
Normal file
204
src/views/component/colorpicker/index.html
Normal file
@@ -0,0 +1,204 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>颜色选择器组件</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>颜色选择器组件</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">常规使用</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div id="test-colorpicker-dome1"></div>
|
||||||
|
<div id="test-colorpicker-dome2" style="margin-left: 10px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">表单赋值</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<form class="layui-form" action="">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-input-inline" style="width: 120px;">
|
||||||
|
<input type="text" value="" placeholder="请选择颜色" class="layui-input" id="test-colorpicker-form-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline" style="left: -11px;">
|
||||||
|
<div id="test-colorpicker-dome3"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">RGB / RGBA 色值</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div id="test-colorpicker-dome4"></div>
|
||||||
|
<div id="test-colorpicker-dome5" style="margin-left: 30px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">透明度选择</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div id="test-colorpicker-dome6"></div>
|
||||||
|
<div id="test-colorpicker-dome7" style="margin-left: 30px;"></div>
|
||||||
|
<div id="test-colorpicker-dome8" style="margin-left: 30px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">预定义颜色项</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div id="test-colorpicker-dome9"></div>
|
||||||
|
<div id="test-colorpicker-dome10" style="margin-left: 30px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">全功能和回调的使用</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<input type="hidden" name="color" value="" id="test-colorpicker-all-input">
|
||||||
|
<div id="test-colorpicker-dome11"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">颜色框尺寸</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<div id="test-colorpicker-dome12"></div>
|
||||||
|
<div id="test-colorpicker-dome13" style="margin-left: 30px;"></div>
|
||||||
|
<div id="test-colorpicker-dome14" style="margin-left: 30px;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'colorpicker'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,colorpicker = layui.colorpicker;
|
||||||
|
|
||||||
|
//常规使用
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome1' //绑定元素
|
||||||
|
,change: function(color){ //颜色改变的回调
|
||||||
|
layer.tips('选择了：'+ color, this.elem, {
|
||||||
|
tips: 1
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//初始色值
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome2'
|
||||||
|
,color: '#2ec770' //设置默认色
|
||||||
|
,done: function(color){
|
||||||
|
layer.tips('选择了：'+ color, this.elem);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//表单赋值
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome3'
|
||||||
|
,color: '#1c97f5'
|
||||||
|
,done: function(color){
|
||||||
|
$('#test-colorpicker-form-input').val(color);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//RGB 、RGBA
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome4'
|
||||||
|
,color: 'rgb(68,66,66)'
|
||||||
|
,format: 'rgb' //默认为 hex
|
||||||
|
});
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome5'
|
||||||
|
,color: 'rgba(68,66,66,0.5)'
|
||||||
|
,format: 'rgb'
|
||||||
|
,alpha: true //开启透明度滑块
|
||||||
|
});
|
||||||
|
|
||||||
|
//开启透明度
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome6'
|
||||||
|
,color: '#16baaa' //hex
|
||||||
|
,alpha: true //开启透明度
|
||||||
|
,format: 'rgb'
|
||||||
|
});
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome7'
|
||||||
|
,color: 'rgb(0,150,136,0.6)' //rgba
|
||||||
|
,alpha: true
|
||||||
|
,format: 'rgb'
|
||||||
|
});
|
||||||
|
colorpicker.render({ //无初始色值时
|
||||||
|
elem: '#test-colorpicker-dome8'
|
||||||
|
,alpha: true
|
||||||
|
,format: 'rgb'
|
||||||
|
});
|
||||||
|
|
||||||
|
//预定义颜色项
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome9'
|
||||||
|
,color: '#c71585'
|
||||||
|
,predefine: true // 开启预定义颜色
|
||||||
|
});
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome10'
|
||||||
|
,color: '#9d8a0e'
|
||||||
|
,predefine: true // 开启预定义颜色
|
||||||
|
,colors: ['#ff8c00','#00ced1','#9d8a0e'] //自定义预定义颜色项
|
||||||
|
});
|
||||||
|
|
||||||
|
//开启全功能
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome11'
|
||||||
|
,color: 'rgba(7, 155, 140, 1)'
|
||||||
|
,format: 'rgb'
|
||||||
|
,predefine: true
|
||||||
|
,alpha: true
|
||||||
|
,done: function(color){
|
||||||
|
$('#test-colorpicker-all-input').val(color); //向隐藏域赋值
|
||||||
|
layer.tips('给指定隐藏域设置了颜色值：'+ color, this.elem);
|
||||||
|
|
||||||
|
color || this.change(color); //清空时执行 change
|
||||||
|
}
|
||||||
|
,change: function(color){
|
||||||
|
//给当前页面头部和左侧设置主题色
|
||||||
|
parent.layui.$('.layui-side-menu,.layui-logo').css('cssText', 'background-color: '+ color + ' !important;');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//设定颜色框尺寸
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome12'
|
||||||
|
,size: 'lg' //大号下拉框
|
||||||
|
});
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome13'
|
||||||
|
//,size: 'sm' //默认 sm
|
||||||
|
});
|
||||||
|
colorpicker.render({
|
||||||
|
elem: '#test-colorpicker-dome14'
|
||||||
|
,size: 'xs' //mini下拉框
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
591
src/views/component/dropdown/index.html
Normal file
591
src/views/component/dropdown/index.html
Normal file
@@ -0,0 +1,591 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>下拉菜单组件</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>下拉菜单组件</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">初演示</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<div class="layui-btn-container">
|
||||||
|
<button class="layui-btn test-dropdown-demo1">
|
||||||
|
下拉菜单
|
||||||
|
<i class="layui-icon layui-icon-down layui-font-12"></i>
|
||||||
|
</button>
|
||||||
|
<button class="layui-btn layui-btn-primary test-dropdown-demo1">
|
||||||
|
下拉菜单
|
||||||
|
<i class="layui-icon layui-icon-down layui-font-12"></i>
|
||||||
|
</button>
|
||||||
|
<button class="layui-btn" id="test-dropdown-demo100">
|
||||||
|
无限层级 + 跳转 + 事件 + 自定义模板
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-inline" style="width: 235px;">
|
||||||
|
<input name="" placeholder="在输入框提供一些常用的选项" class="layui-input" id="test-dropdown-demo2">
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline layui-word-aux layui-font-gray">
|
||||||
|
可以绑定任意元素，<a href="javascript:;" class="layui-font-blue" id="test-dropdown-demo3">比如这段文字 <i class="layui-icon layui-font-12 layui-icon-down"></i></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">在表格中的应用</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
|
||||||
|
<table class="layui-hide" id="test-dropdown-table" lay-filter="test-dropdown-table"></table>
|
||||||
|
<script type="text/html" id="test-dropdown-toolbar-barDemo">
|
||||||
|
<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit">编辑</a>
|
||||||
|
<a class="layui-btn layui-btn-xs" lay-event="more">更多 <i class="layui-icon layui-icon-down"></i></a>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</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-btn-container">
|
||||||
|
<button class="layui-btn layui-btn-primary" id="test-dropdown-demo4">
|
||||||
|
hover
|
||||||
|
<i class="layui-icon layui-icon-more-vertical layui-font-12"></i>
|
||||||
|
</button>
|
||||||
|
<button class="layui-btn layui-btn-primary" id="test-dropdown-demo5">
|
||||||
|
mousedown
|
||||||
|
<i class="layui-icon layui-icon-down layui-font-12"></i>
|
||||||
|
</button>
|
||||||
|
<button class="layui-btn layui-btn-primary" id="test-dropdown-demo6">
|
||||||
|
dblclick - 双击
|
||||||
|
<i class="layui-icon layui-icon-circle layui-font-12"></i>
|
||||||
|
</button>
|
||||||
|
</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-bg-gray" style="height: 260px; text-align: center;" id="test-dropdown-demo7">
|
||||||
|
<span class="layui-font-gray" style="position: relative; top:50%;">在此区域单击鼠标右键</span>
|
||||||
|
</div>
|
||||||
|
<button class="layui-btn" style="margin-top: 15px;" lay-demoactive="rightclick">
|
||||||
|
开启全局右键菜单
|
||||||
|
</button>
|
||||||
|
|
||||||
|
</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-btn-container">
|
||||||
|
<button class="layui-btn" id="test-dropdown-demo8">
|
||||||
|
重定义样式
|
||||||
|
<i class="layui-icon layui-icon-list layui-font-14"></i>
|
||||||
|
</button>
|
||||||
|
<style>
|
||||||
|
.test-dropdown-demo,
|
||||||
|
.test-dropdown-demo .layui-menu{background-color: #000; border: none;}
|
||||||
|
.test-dropdown-demo .layui-menu li{color: #fff;}
|
||||||
|
.test-dropdown-demo .layui-menu li:hover{background-color: #333;}
|
||||||
|
</style>
|
||||||
|
<button class="layui-btn" id="test-dropdown-demo9">
|
||||||
|
重定义内容
|
||||||
|
<i class="layui-icon layui-icon-list layui-font-14"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'dropdown', 'util', 'layer', 'table'], function(){
|
||||||
|
var dropdown = layui.dropdown
|
||||||
|
,util = layui.util
|
||||||
|
,layer = layui.layer
|
||||||
|
,table = layui.table
|
||||||
|
,$ = layui.jquery;
|
||||||
|
|
||||||
|
//初演示
|
||||||
|
dropdown.render({
|
||||||
|
elem: '.test-dropdown-demo1'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item11'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item22'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item33'
|
||||||
|
,id: 102
|
||||||
|
}]
|
||||||
|
,click: function(obj){
|
||||||
|
layer.tips('点击了：'+ obj.title, this.elem, {tips: [1, '#16b777']})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//初演示 - 绑定输入框
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo2'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 102
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 103
|
||||||
|
},{
|
||||||
|
title: 'menu item 4'
|
||||||
|
,id: 104
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: 105
|
||||||
|
},{
|
||||||
|
title: 'menu item 6'
|
||||||
|
,id: 106
|
||||||
|
}]
|
||||||
|
,click: function(obj){
|
||||||
|
this.elem.val(obj.title);
|
||||||
|
}
|
||||||
|
,style: 'width: 235px;'
|
||||||
|
});
|
||||||
|
|
||||||
|
//初演示 - 绑定文字
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo3'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 101
|
||||||
|
,child: [{ //横向子菜单
|
||||||
|
title: 'menu item 2-1'
|
||||||
|
,id: 1011
|
||||||
|
},{
|
||||||
|
title: 'menu item 2-2'
|
||||||
|
,id: 1012
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 102
|
||||||
|
},{
|
||||||
|
type: '-' //分割线
|
||||||
|
},{
|
||||||
|
title: 'menu group'
|
||||||
|
,id: 103
|
||||||
|
,type: 'group' //纵向菜单组
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 4-1'
|
||||||
|
,id: 1031
|
||||||
|
},{
|
||||||
|
title: 'menu item 4-2'
|
||||||
|
,id: 1032
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
type: '-' //分割线
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: 104
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: 104
|
||||||
|
}]
|
||||||
|
,click: function(obj){
|
||||||
|
this.elem.val(obj.title);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//无限层级
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo100'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,templet: '<i class="layui-icon layui-icon-picture"></i> {{d.title}} <span class="layui-badge-dot"></span>'
|
||||||
|
,id: 100
|
||||||
|
,href: '#'
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,templet: '<img src="https://unpkg.com/outeres/demo/layer.png" style="width: 16px;"> {{d.title}}'
|
||||||
|
,id: 101
|
||||||
|
,href: '/'
|
||||||
|
,target: '_blank'
|
||||||
|
}
|
||||||
|
,{type: '-'} //分割线
|
||||||
|
,{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 102
|
||||||
|
,type: 'group'
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-1'
|
||||||
|
,id: 103
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-2'
|
||||||
|
,id: 104
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-2-1'
|
||||||
|
,id: 105
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-2-2'
|
||||||
|
,id: 11
|
||||||
|
,type: 'group'
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-2-2-1'
|
||||||
|
,id: 111
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-2-2-2'
|
||||||
|
,id: 1111
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-2-3'
|
||||||
|
,id: 11111
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3'
|
||||||
|
,id: 111111
|
||||||
|
,type: 'group'
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-3-1'
|
||||||
|
,id: 22
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3-2'
|
||||||
|
,id: 222
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-3-2-1'
|
||||||
|
,id: 2222
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3-2-2'
|
||||||
|
,id: 22222
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3-2-3'
|
||||||
|
,id: 2222222
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3-3'
|
||||||
|
,id: 333
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
,{type: '-'}
|
||||||
|
,{
|
||||||
|
title: 'menu item 4'
|
||||||
|
,id: 4
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: 5
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 5-1'
|
||||||
|
,id: 55
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 5-1-1'
|
||||||
|
,id: 5555
|
||||||
|
},{
|
||||||
|
title: 'menu item 5-1-2'
|
||||||
|
,id: 55555
|
||||||
|
},{
|
||||||
|
title: 'menu item 5-1-3'
|
||||||
|
,id: 555555
|
||||||
|
}]
|
||||||
|
},{
|
||||||
|
title: 'menu item 5-2'
|
||||||
|
,id: 52
|
||||||
|
},{
|
||||||
|
title: 'menu item 5-3'
|
||||||
|
,id: 53
|
||||||
|
}]
|
||||||
|
},{type:'-'},{
|
||||||
|
title: 'menu item 6'
|
||||||
|
,id: 66
|
||||||
|
,type: 'group'
|
||||||
|
,isSpreadItem: false
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 6-1'
|
||||||
|
,id: 888
|
||||||
|
},{
|
||||||
|
title: 'menu item 6-2'
|
||||||
|
,id: 8888
|
||||||
|
},{
|
||||||
|
title: 'menu item 6-3'
|
||||||
|
,id: 88888
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
,click: function(item){
|
||||||
|
layer.msg(util.escape(JSON.stringify(item)));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// dropdown 在表格中的应用
|
||||||
|
table.render({
|
||||||
|
elem: '#test-dropdown-table'
|
||||||
|
,url: layui.setter.paths.base + '/json/table/demo.js'
|
||||||
|
,title: '用户数据表'
|
||||||
|
,cols: [[
|
||||||
|
{type: 'checkbox', fixed: 'left'}
|
||||||
|
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true}
|
||||||
|
,{field:'username', title:'用户名', width:120, edit: 'text'}
|
||||||
|
,{field:'email', title:'邮箱', minWidth:150}
|
||||||
|
,{fixed: 'right', title:'操作', toolbar: '#test-dropdown-toolbar-barDemo', width:150}
|
||||||
|
]]
|
||||||
|
,height: 355
|
||||||
|
,page: true
|
||||||
|
});
|
||||||
|
//行工具事件
|
||||||
|
table.on('tool(test-dropdown-table)', function(obj){
|
||||||
|
var that = this
|
||||||
|
,data = obj.data;
|
||||||
|
|
||||||
|
if(obj.event === 'edit'){
|
||||||
|
layer.prompt({
|
||||||
|
formType: 2
|
||||||
|
,value: data.email
|
||||||
|
}, function(value, index){
|
||||||
|
obj.update({
|
||||||
|
email: value
|
||||||
|
});
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else if(obj.event === 'more'){
|
||||||
|
//更多下拉菜单
|
||||||
|
dropdown.render({
|
||||||
|
elem: that
|
||||||
|
,show: true //外部事件触发即显示
|
||||||
|
,data: [{
|
||||||
|
title: 'item 1'
|
||||||
|
,id: 'aaa'
|
||||||
|
}, {
|
||||||
|
title: 'item 2'
|
||||||
|
,id: 'bbb'
|
||||||
|
}, {
|
||||||
|
title: '删除'
|
||||||
|
,id: 'del'
|
||||||
|
}]
|
||||||
|
,click: function(data, othis){
|
||||||
|
//根据 id 做出不同操作
|
||||||
|
if(data.id === 'del'){
|
||||||
|
layer.confirm('真的删除行么', function(index){
|
||||||
|
obj.del();
|
||||||
|
layer.close(index);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
layer.msg('得到表格下拉菜单 id：'+ data.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,style: 'margin-left: -45px; box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' //设置额外样式
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
//自定义事件 - hover
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo4'
|
||||||
|
,trigger: 'hover'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 102
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
//自定义事件 - mousedown
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo5'
|
||||||
|
,trigger: 'mousedown'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 102
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
//自定义事件 - dblclick
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo6'
|
||||||
|
,trigger: 'dblclick'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 102
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
//右键菜单
|
||||||
|
var inst = dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo7' //也可绑定到 document，从而重置整个右键
|
||||||
|
,trigger: 'contextmenu' //contextmenu
|
||||||
|
,isAllowSpread: false //禁止菜单组展开收缩
|
||||||
|
,style: 'width: 200px' //定义宽度，默认自适应
|
||||||
|
,id: 'test777' //定义唯一索引
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 'test'
|
||||||
|
}, {
|
||||||
|
title: 'Printing'
|
||||||
|
,id: 'print'
|
||||||
|
},{
|
||||||
|
title: 'Reload'
|
||||||
|
,id: 'reload'
|
||||||
|
},{type:'-'},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: '#3'
|
||||||
|
,child: [{
|
||||||
|
title: 'menu item 3-1'
|
||||||
|
,id: '#1'
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-2'
|
||||||
|
,id: '#2'
|
||||||
|
},{
|
||||||
|
title: 'menu item 3-3'
|
||||||
|
,id: '#3'
|
||||||
|
}]
|
||||||
|
},{type:'-'},{
|
||||||
|
title: 'menu item 4'
|
||||||
|
,id: ''
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: '#1'
|
||||||
|
},{
|
||||||
|
title: 'menu item 6'
|
||||||
|
,id: '#1'
|
||||||
|
}]
|
||||||
|
,click: function(obj, othis){
|
||||||
|
if(obj.id === 'test'){
|
||||||
|
layer.msg('click');
|
||||||
|
} else if(obj.id === 'print'){
|
||||||
|
window.print();
|
||||||
|
} else if(obj.id === 'reload'){
|
||||||
|
location.reload();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//重定义样式
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo8'
|
||||||
|
,data: [{
|
||||||
|
title: 'menu item 1'
|
||||||
|
,id: 100
|
||||||
|
},{
|
||||||
|
title: 'menu item 2'
|
||||||
|
,id: 101
|
||||||
|
},{
|
||||||
|
title: 'menu item 3'
|
||||||
|
,id: 103
|
||||||
|
},{
|
||||||
|
title: 'menu item 4'
|
||||||
|
,id: 104
|
||||||
|
},{
|
||||||
|
title: 'menu item 5'
|
||||||
|
,id: 105
|
||||||
|
},{
|
||||||
|
title: 'menu item 6'
|
||||||
|
,id: 106
|
||||||
|
}]
|
||||||
|
,className: 'test-dropdown-demo'
|
||||||
|
,ready: function(elemPanel, elem){
|
||||||
|
layer.msg('定义了一个 className');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//重定义内容
|
||||||
|
dropdown.render({
|
||||||
|
elem: '#test-dropdown-demo9'
|
||||||
|
,content: ['<div class="layui-tab layui-tab-brief">'
|
||||||
|
,'<ul class="layui-tab-title">'
|
||||||
|
,'<li class="layui-this">Tab header 1</li>'
|
||||||
|
,'<li>Tab header 2</li>'
|
||||||
|
,'<li>Tab header 3</li>'
|
||||||
|
,'</ul>'
|
||||||
|
,'<div class="layui-tab-content">'
|
||||||
|
,'<div class="layui-tab-item layui-text layui-show"><p style="padding-bottom: 10px;">在 content 参数中插入任意的 html 内容，可替代默认的下拉菜单。 从而实现更多有趣的弹出内容。</p><p> 是否发现，dropdown 组件不仅仅只是一个下拉菜单或者右键菜单，它能被赋予许多的想象可能。</p></div>'
|
||||||
|
,'<div class="layui-tab-item">Tab body 2</div>'
|
||||||
|
,'<div class="layui-tab-item">Tab body 3</div>'
|
||||||
|
,'</div>'
|
||||||
|
,'</div>'].join('')
|
||||||
|
,style: 'width: 370px; height: 200px; padding: 0 15px; box-shadow: 1px 1px 30px rgb(0 0 0 / 12%);'
|
||||||
|
,ready: function(){
|
||||||
|
layui.use('element', function(element){
|
||||||
|
element.render('tab');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
//其他操作
|
||||||
|
util.event('lay-demoactive', {
|
||||||
|
//全局右键菜单
|
||||||
|
rightclick: function(othis){
|
||||||
|
if(!othis.data('open')){
|
||||||
|
dropdown.reload('test777', {
|
||||||
|
elem: document //将事件直接绑定到 document
|
||||||
|
});
|
||||||
|
layer.msg('已开启全局右键菜单，请尝试在页面任意处单击右键。')
|
||||||
|
othis.html('取消全局右键菜单');
|
||||||
|
othis.data('open', true);
|
||||||
|
} else {
|
||||||
|
dropdown.reload('test777', {
|
||||||
|
elem: '#test-dropdown-demo7' //重新绑定到指定元素上
|
||||||
|
});
|
||||||
|
layer.msg('已取消全局右键菜单，恢复默认右键菜单')
|
||||||
|
othis.html('开启全局右键菜单');
|
||||||
|
othis.data('open', false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
133
src/views/component/flow/index.html
Normal file
133
src/views/component/flow/index.html
Normal file
@@ -0,0 +1,133 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>流加载</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- 以下样式仅供演示 -->
|
||||||
|
<style>
|
||||||
|
#LAY-flow-demo .flow-default{width: 600px; height: 400px; overflow: auto; font-size: 0;}
|
||||||
|
#LAY-flow-demo .flow-default li{display: inline-block; margin: 0 5px; font-size: 14px; width: 48%; margin-bottom: 10px; height: 100px; line-height: 100px; text-align: center; background-color: #eee;}
|
||||||
|
#LAY-flow-demo .flow-default img{width: 100%; height: 100%;}
|
||||||
|
#LAY-flow-demo .site-demo-flow{width: 600px; height: 300px; overflow: auto; text-align: center;}
|
||||||
|
#LAY-flow-demo .site-demo-flow img{width: 40%; height: 200px; margin: 0 2px 5px 0; border: none;}
|
||||||
|
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
#LAY-flow-demo .flow-default,
|
||||||
|
#LAY-flow-demo .site-demo-flow{width: 100%;}
|
||||||
|
#LAY-flow-demo .flow-default li{width: 45%}
|
||||||
|
#LAY-flow-demo .site-demo-flow img{height: 150px;}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-card layadmin-header">
|
||||||
|
<div class="layui-breadcrumb" lay-filter="breadcrumb">
|
||||||
|
<a lay-href="">主页</a>
|
||||||
|
<a><cite>组件</cite></a>
|
||||||
|
<a><cite>流加载</cite></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-flow-demo">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">信息流 - 滚动加载</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<ul class="flow-default" id="test-flow-auto"></ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">信息流 - 手工加载</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<ul class="flow-default" style="height: 300px;" id="test-flow-manual"></ul>
|
||||||
|
</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="site-demo-flow" id="test-flow-lazyimg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
<img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'flow'], function(){
|
||||||
|
var flow = layui.flow;
|
||||||
|
|
||||||
|
flow.load({
|
||||||
|
elem: '#test-flow-auto' //流加载容器
|
||||||
|
,scrollElem: '#test-flow-auto' //滚动条所在元素，一般不用填，此处只是演示需要。
|
||||||
|
,done: function(page, next){ //执行下一页的回调
|
||||||
|
|
||||||
|
//模拟数据插入
|
||||||
|
setTimeout(function(){
|
||||||
|
var lis = [];
|
||||||
|
for(var i = 0; i < 8; i++){
|
||||||
|
lis.push('<li>'+ ( (page-1)*8 + i + 1 ) +'</li>')
|
||||||
|
}
|
||||||
|
|
||||||
|
//执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
|
||||||
|
//pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
|
||||||
|
next(lis.join(''), page < 10); //假设总页数为 10
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
flow.load({
|
||||||
|
elem: '#test-flow-manual' //流加载容器
|
||||||
|
,scrollElem: '#test-flow-manual' //滚动条所在元素，一般不用填，此处只是演示需要。
|
||||||
|
,isAuto: false
|
||||||
|
,isLazyimg: true
|
||||||
|
,done: function(page, next){ //加载下一页
|
||||||
|
//模拟插入
|
||||||
|
setTimeout(function(){
|
||||||
|
var lis = [];
|
||||||
|
for(var i = 0; i < 6; i++){
|
||||||
|
lis.push('<li><img lay-src="https://unpkg.com/outeres@0.0.5/demo/000.jpg?v='+ ( (page-1)*6 + i + 1 ) +'"></li>')
|
||||||
|
}
|
||||||
|
next(lis.join(''), page < 6); //假设总页数为 6
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//按屏加载图片
|
||||||
|
flow.lazyimg({
|
||||||
|
elem: '#test-flow-lazyimg img'
|
||||||
|
,scrollElem: '#test-flow-lazyimg' //一般不用设置，此处只是演示需要。
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
332
src/views/component/form/element.html
Normal file
332
src/views/component/form/element.html
Normal file
@@ -0,0 +1,332 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>表单元素</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<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 layui-row layui-col-space10 layui-form">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<input type="text" name="title" placeholder="请输入标题" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<input type="text" name="title" placeholder="用户名" autocomplete="off" class="layui-input" lay-affix="clear">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<input type="password" name="title" placeholder="密码" autocomplete="off" class="layui-input" lay-affix="eye">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6">
|
||||||
|
<input type="number" lay-affix="number" placeholder="设置 step 为 0.01" step="0.01" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6">
|
||||||
|
<input type="number" lay-affix="number" placeholder="设置 step,min,max" step="10" min="0" max="100" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6">
|
||||||
|
<input type="number" lay-affix="number" readonly placeholder="不允许输入状态" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6">
|
||||||
|
<input type="number" lay-affix="number" disabled placeholder="禁用状态" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix">
|
||||||
|
<i class="layui-icon layui-icon-username"></i>
|
||||||
|
</div>
|
||||||
|
<input type="text" placeholder="带前缀" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<input type="text" placeholder="带后缀" class="layui-input">
|
||||||
|
<div class="layui-input-suffix">
|
||||||
|
<i class="layui-icon layui-icon-more-vertical"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix">
|
||||||
|
<i class="layui-icon layui-icon-date"></i>
|
||||||
|
</div>
|
||||||
|
<input type="text" placeholder="带前缀和后缀" class="layui-input">
|
||||||
|
<div class="layui-input-suffix">
|
||||||
|
<i class="layui-icon layui-icon-down"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-password"></i>
|
||||||
|
</div>
|
||||||
|
<input type="password" placeholder="带前缀加分隔框" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<input type="text" placeholder="带后缀加分隔框" class="layui-input">
|
||||||
|
<div class="layui-input-suffix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-down"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-date"></i>
|
||||||
|
</div>
|
||||||
|
<input type="text" placeholder="带前缀和后缀加分割框" class="layui-input">
|
||||||
|
<div class="layui-input-suffix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-down"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix">
|
||||||
|
<i class="layui-icon layui-icon-location"></i>
|
||||||
|
</div>
|
||||||
|
<input type="text" placeholder="带前缀无分割框和后缀有分割框" class="layui-input">
|
||||||
|
<div class="layui-input-suffix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-edit"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix layui-input-split">
|
||||||
|
<i class="layui-icon layui-icon-location"></i>
|
||||||
|
</div>
|
||||||
|
<input type="text" placeholder="带前缀有分割框和后缀无分割框" class="layui-input">
|
||||||
|
<div class="layui-input-suffix">
|
||||||
|
<i class="layui-icon layui-icon-edit"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md4">
|
||||||
|
<div class="layui-input-wrap">
|
||||||
|
<div class="layui-input-prefix">
|
||||||
|
<i class="layui-icon layui-icon-form"></i>
|
||||||
|
</div>
|
||||||
|
<select>
|
||||||
|
<option value="">放置 select 元素</option>
|
||||||
|
<option value="北京">北京</option>
|
||||||
|
<option value="上海">上海</option>
|
||||||
|
<option value="广州">广州</option>
|
||||||
|
<option value="深圳">深圳</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card layui-form" lay-filter="component-form-element">
|
||||||
|
<div class="layui-card-header">复选框</div>
|
||||||
|
<div class="layui-card-body layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<input type="checkbox" name="" title="写作" checked>
|
||||||
|
<input type="checkbox" name="" title="发呆">
|
||||||
|
<input type="checkbox" name="" title="禁用" disabled>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<input type="checkbox" name="" title="写作" lay-skin="primary" checked>
|
||||||
|
<input type="checkbox" name="" title="发呆" lay-skin="primary">
|
||||||
|
<input type="checkbox" name="" title="禁用" lay-skin="primary" disabled>
|
||||||
|
<input type="checkbox" name="" lay-skin="primary">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card layui-form" lay-filter="component-form-element">
|
||||||
|
<div class="layui-card-header">开关</div>
|
||||||
|
<div class="layui-card-body layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<input type="checkbox" name="xxx" lay-skin="switch">
|
||||||
|
<input type="checkbox" name="yyy" lay-skin="switch" lay-text="ON|OFF" checked>
|
||||||
|
<input type="checkbox" name="zzz" lay-skin="switch" lay-text="开启|关闭">
|
||||||
|
<input type="checkbox" name="aaa" lay-skin="switch" disabled>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card layui-form" lay-filter="component-form-element">
|
||||||
|
<div class="layui-card-header">单选框</div>
|
||||||
|
<div class="layui-card-body layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<input type="radio" name="sex" value="nan" title="男">
|
||||||
|
<input type="radio" name="sex" value="nv" title="女" checked>
|
||||||
|
<input type="radio" name="sex" value="" title="中性" disabled>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<div class="layui-card layui-form" lay-filter="component-form-element">
|
||||||
|
<div class="layui-card-header">下拉选择框</div>
|
||||||
|
<div class="layui-card-body layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<select name="city" lay-verify="">
|
||||||
|
<option value="">请选择一个城市</option>
|
||||||
|
<option value="010">北京</option>
|
||||||
|
<option value="021">上海</option>
|
||||||
|
<option value="0571">杭州</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<select name="city" lay-verify="">
|
||||||
|
<option value="010">北京</option>
|
||||||
|
<option value="021" disabled>上海（禁用效果）</option>
|
||||||
|
<option value="0571" selected>杭州</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<select name="quiz">
|
||||||
|
<option value="">请选择</option>
|
||||||
|
<optgroup label="城市记忆">
|
||||||
|
<option value="你工作的第一个城市">你工作的第一个城市？</option>
|
||||||
|
</optgroup>
|
||||||
|
<optgroup label="学生时代">
|
||||||
|
<option value="你的工号">你的工号？</option>
|
||||||
|
<option value="你最喜欢的老师">你最喜欢的老师？</option>
|
||||||
|
</optgroup>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md6">
|
||||||
|
<select name="city" lay-verify="required" lay-search>
|
||||||
|
<option value="">带搜索的选择框</option>
|
||||||
|
<option value="1">layer</option>
|
||||||
|
<option value="2">form</option>
|
||||||
|
<option value="3">layim</option>
|
||||||
|
<option value="4">element</option>
|
||||||
|
<option value="5">laytpl</option>
|
||||||
|
<option value="6">upload</option>
|
||||||
|
<option value="7">laydate</option>
|
||||||
|
<option value="8">laypage</option>
|
||||||
|
<option value="9">flow</option>
|
||||||
|
<option value="10">util</option>
|
||||||
|
<option value="11">code</option>
|
||||||
|
<option value="12">tree</option>
|
||||||
|
<option value="13">layedit</option>
|
||||||
|
<option value="14">nav</option>
|
||||||
|
<option value="15">tab</option>
|
||||||
|
<option value="16">table</option>
|
||||||
|
<option value="17">select</option>
|
||||||
|
<option value="18">checkbox</option>
|
||||||
|
<option value="19">switch</option>
|
||||||
|
<option value="20">radio</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md12">
|
||||||
|
<select name="city" lay-verify="">
|
||||||
|
<option value="">请选择一个城市</option>
|
||||||
|
<option value="010">北京</option>
|
||||||
|
<option value="021">上海</option>
|
||||||
|
<option value="0571">杭州</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">响应式组合</div>
|
||||||
|
<div class="layui-card-body">
|
||||||
|
<form class="layui-form" action="" lay-filter="component-form-element">
|
||||||
|
<div class="layui-row layui-col-space10 layui-form-item">
|
||||||
|
<div class="layui-col-lg6">
|
||||||
|
<label class="layui-form-label">员工姓名：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="fullname" lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-lg6">
|
||||||
|
<label class="layui-form-label">技术工种：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<select name="type" lay-verify="required" lay-filter="aihao">
|
||||||
|
<option value=""></option>
|
||||||
|
<option value="0">前端工程师</option>
|
||||||
|
<option value="1">Node.js工程师</option>
|
||||||
|
<option value="2">PHP工程师</option>
|
||||||
|
<option value="3">Java工程师</option>
|
||||||
|
<option value="4">运维</option>
|
||||||
|
<option value="4">视觉设计师</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">兴趣爱好：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="interest[write]" title="写作">
|
||||||
|
<input type="checkbox" name="interest[read]" title="阅读">
|
||||||
|
<input type="checkbox" name="interest[code]" title="代码" checked>
|
||||||
|
<input type="checkbox" name="interest[dreaming]" title="做梦">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">是否婚姻：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="marriage" lay-skin="switch" lay-text="是|否">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">所属职称：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="radio" name="role" value="" title="经理">
|
||||||
|
<input type="radio" name="role" value="" title="主管">
|
||||||
|
<input type="radio" name="role" value="" title="码农" checked>
|
||||||
|
<input type="radio" name="role" value="" title="端水">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">其它信息：</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<textarea name="other" 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="checkbox" name="agreement" title="同意" lay-skin="primary" checked>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<button class="layui-btn" lay-submit lay-filter="component-form-element">立即提交</button>
|
||||||
|
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'form'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,element = layui.element
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
form.render(null, 'component-form-element');
|
||||||
|
element.render('breadcrumb', 'breadcrumb');
|
||||||
|
|
||||||
|
form.on('submit(component-form-element)', function(data){
|
||||||
|
layer.alert(layui.util.escape(JSON.stringify(data.field)));
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
298
src/views/component/form/group.html
Normal file
298
src/views/component/form/group.html
Normal file
@@ -0,0 +1,298 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>表单组合</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="layui-fluid">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header">表单组合</div>
|
||||||
|
<div class="layui-card-body" style="padding: 15px;">
|
||||||
|
<form class="layui-form" action="" lay-filter="component-form-group">
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">单行输入框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" 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="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">验证手机</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">验证邮箱</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="email" lay-verify="email" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">多规则验证</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="number" lay-verify="required|number" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">验证日期</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="text" name="date" id="LAY-component-form-group-date" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">验证链接</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<input type="tel" name="url" lay-verify="url" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">验证身份证</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="text" name="identity" lay-verify="identity" placeholder="" 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="password" name="password" lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-mid layui-word-aux">请填写6到12位密码</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">数字输入框</label>
|
||||||
|
<div class="layui-input-inline" style="width: 100px;">
|
||||||
|
<input type="number" name="price_min" placeholder="" autocomplete="off" class="layui-input" lay-affix="number">
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-mid">-</div>
|
||||||
|
<div class="layui-input-inline" style="width: 100px;">
|
||||||
|
<input type="number" name="price_max" placeholder="" autocomplete="off" class="layui-input" lay-affix="number">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">单行选择框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<select name="interest" lay-filter="aihao">
|
||||||
|
<option value=""></option>
|
||||||
|
<option value="0">写作</option>
|
||||||
|
<option value="1" selected="">阅读</option>
|
||||||
|
<option value="2">游戏</option>
|
||||||
|
<option value="3">音乐</option>
|
||||||
|
<option value="4">旅行</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">分组选择框</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select name="quiz">
|
||||||
|
<option value="">请选择问题</option>
|
||||||
|
<optgroup label="城市记忆">
|
||||||
|
<option value="你工作的第一个城市">你工作的第一个城市</option>
|
||||||
|
</optgroup>
|
||||||
|
<optgroup label="学生时代">
|
||||||
|
<option value="你的工号">你的工号</option>
|
||||||
|
<option value="你最喜欢的老师">你最喜欢的老师</option>
|
||||||
|
</optgroup>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<label class="layui-form-label">搜索选择框</label>
|
||||||
|
<div class="layui-input-inline">
|
||||||
|
<select name="modules" lay-verify="required" lay-search="">
|
||||||
|
<option value="">直接选择或搜索选择</option>
|
||||||
|
<option value="1">layer</option>
|
||||||
|
<option value="2">form</option>
|
||||||
|
<option value="3">layim</option>
|
||||||
|
<option value="4">element</option>
|
||||||
|
<option value="5">laytpl</option>
|
||||||
|
<option value="6">upload</option>
|
||||||
|
<option value="7">laydate</option>
|
||||||
|
<option value="8">laypage</option>
|
||||||
|
<option value="9">flow</option>
|
||||||
|
<option value="10">util</option>
|
||||||
|
<option value="11">code</option>
|
||||||
|
<option value="12">tree</option>
|
||||||
|
<option value="13">layedit</option>
|
||||||
|
<option value="14">nav</option>
|
||||||
|
<option value="15">tab</option>
|
||||||
|
<option value="16">table</option>
|
||||||
|
<option value="17">select</option>
|
||||||
|
<option value="18">checkbox</option>
|
||||||
|
<option value="19">switch</option>
|
||||||
|
<option value="20">radio</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">联动选择框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<div class="layui-inline">
|
||||||
|
<select name="quiz1">
|
||||||
|
<option value="">请选择省</option>
|
||||||
|
<option value="浙江" selected="">浙江省</option>
|
||||||
|
<option value="你的工号">江西省</option>
|
||||||
|
<option value="你最喜欢的老师">福建省</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<select name="quiz2">
|
||||||
|
<option value="">请选择市</option>
|
||||||
|
<option value="杭州">杭州</option>
|
||||||
|
<option value="宁波" disabled="">宁波</option>
|
||||||
|
<option value="温州">温州</option>
|
||||||
|
<option value="温州">台州</option>
|
||||||
|
<option value="温州">绍兴</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<select name="quiz3">
|
||||||
|
<option value="">请选择县/区</option>
|
||||||
|
<option value="西湖区">西湖区</option>
|
||||||
|
<option value="余杭区">余杭区</option>
|
||||||
|
<option value="拱墅区">临安市</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="layui-inline">
|
||||||
|
<div class="layui-form-mid layui-word-aux">此处只是演示联动排版，并未做联动交互</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">复选框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="like[write]" title="写作">
|
||||||
|
<input type="checkbox" name="like[read]" title="阅读" checked="">
|
||||||
|
<input type="checkbox" name="like[game]" title="游戏">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item" pane="">
|
||||||
|
<label class="layui-form-label">原始复选框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="like1[write]" lay-skin="primary" title="写作" checked="">
|
||||||
|
<input type="checkbox" name="like1[read]" lay-skin="primary" title="阅读">
|
||||||
|
<input type="checkbox" name="like1[game]" lay-skin="primary" title="游戏" disabled="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">开关-默认关</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" name="close" lay-skin="switch" lay-text="ON|OFF">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">开关-默认开</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="component-form-switchTest" lay-text="ON|OFF">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<label class="layui-form-label">单选框</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<input type="radio" name="sex" value="男" title="男" checked="">
|
||||||
|
<input type="radio" name="sex" value="女" title="女">
|
||||||
|
<input type="radio" name="sex" value="禁" title="禁用" disabled="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item layui-form-text">
|
||||||
|
<label class="layui-form-label">普通文本域</label>
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<textarea name="text" placeholder="请输入内容" class="layui-textarea"></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item layui-layout-admin">
|
||||||
|
<div class="layui-input-block">
|
||||||
|
<div class="layui-footer" style="left: 0;">
|
||||||
|
<button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>
|
||||||
|
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index', 'form', 'laydate'], function(){
|
||||||
|
var $ = layui.$
|
||||||
|
,admin = layui.admin
|
||||||
|
,element = layui.element
|
||||||
|
,layer = layui.layer
|
||||||
|
,laydate = layui.laydate
|
||||||
|
,form = layui.form;
|
||||||
|
|
||||||
|
form.render(null, 'component-form-group');
|
||||||
|
|
||||||
|
laydate.render({
|
||||||
|
elem: '#LAY-component-form-group-date'
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 自定义验证规则 */
|
||||||
|
form.verify({
|
||||||
|
title: function(value){
|
||||||
|
if(value.length < 5){
|
||||||
|
return '标题至少得5个字符啊';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,pass: [/(.+){6,12}$/, '密码必须6到12位']
|
||||||
|
,content: function(value){
|
||||||
|
layedit.sync(editIndex);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 事件-指定开关 */
|
||||||
|
form.on('switch(component-form-switchTest)', function(data){
|
||||||
|
layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
|
||||||
|
offset: '6px'
|
||||||
|
});
|
||||||
|
layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
|
||||||
|
});
|
||||||
|
|
||||||
|
/* 事件-提交 */
|
||||||
|
form.on('submit(component-form-demo1)', function(data){
|
||||||
|
parent.layer.alert(layui.util.escape(JSON.stringify(data.field)), {
|
||||||
|
title: '最终的提交信息'
|
||||||
|
})
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
80
src/views/component/grid/all.html
Normal file
80
src/views/component/grid/all.html
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>全端复杂组合</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 这段样式只是用于演示 */
|
||||||
|
#LAY-component-grid-all .layui-card-body{display: flex; justify-content: center; flex-direction: column; text-align: center; height: 200px;}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-component-grid-all">
|
||||||
|
<div class="layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-xs6 layui-col-sm7 layui-col-md3">
|
||||||
|
<!-- 填充内容 -->
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm5 layui-col-md3">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm5 layui-col-md3">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm7 layui-col-md3">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm7 layui-col-md9">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm5 layui-col-md3">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm5 layui-col-md3">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-sm7 layui-col-md9">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
123
src/views/component/grid/list.html
Normal file
123
src/views/component/grid/list.html
Normal file
@@ -0,0 +1,123 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>等比例列表排列</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 这段样式只是用于演示 */
|
||||||
|
#LAY-component-grid-list .demo-list .layui-card{height: 267px;}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-component-grid-list">
|
||||||
|
<div class="layui-row layui-col-space10 demo-list">
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<!-- 填充内容 -->
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
|
||||||
|
<div class="layui-card">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
80
src/views/component/grid/mobile-pc.html
Normal file
80
src/views/component/grid/mobile-pc.html
Normal file
@@ -0,0 +1,80 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>移动桌面组合</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 rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
|
||||||
|
<link rel="stylesheet" href="../../../res/adminui/dist/css/admin.css" media="all">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
/* 这段样式只是用于演示 */
|
||||||
|
#LAY-component-grid-mobile-pc .layui-card-body{display: flex; justify-content: center; flex-direction: column; text-align: center; height: 200px;}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="layui-fluid" id="LAY-component-grid-mobile-pc">
|
||||||
|
<div class="layui-row layui-col-space10">
|
||||||
|
<div class="layui-col-xs6 layui-col-md8">
|
||||||
|
<!-- 填充内容 -->
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs12 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs6 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-xs12 layui-col-md4">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-header"></div>
|
||||||
|
<div class="layui-card-body"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="../../../res/layui/layui.js"></script>
|
||||||
|
<script>
|
||||||
|
layui.config({
|
||||||
|
base: '../../../res/' // 静态资源所在路径
|
||||||
|
}).use(['index']);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user