ulthon/ulthon_admin
1
0
Fork 0
mirror of https://gitee.com/ulthon/ulthon_admin.git synced 2026-07-01 15:32:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

页面适配手机,新增皮肤切换功能

Browse Source
This commit is contained in:
augushong
2020-03-19 14:48:57 +08:00
parent d26aec260f
commit 50d00ff77a
13 changed files with 440 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
public/static/css/common.css Normal file
View File

@@ -0,0 +1,100 @@
@media screen and (max-width: 768px){
.layui-body{
left: 0;
}
.layui-layout-admin .layui-footer{
left: 0;
}
.layui-layout-admin .layui-logo{
width: 115px;
}
.layui-layout-admin .layui-side{
width: 100%;
overflow-x: hidden;
height: 100%;
position: unset;
}
.layui-layer-content .layui-hide-xs{
display: unset !important;
}
.layui-nav-tree{
width: 100%;
height: 100%;
}
}
.left-bottom-options{
position: fixed;
left: 20px;
bottom: 60px;
background: rgba(0,0,0,0.4);
color: #fff;
font-size: 35px;
padding: 3px 5px;
}
.skin-1 .layui-nav-tree .layui-nav-item a:hover{
background-color: #6699CC;
}
.skin-1 .layui-bg-black{
background-color: #66CCFF !important;
}
.skin-1 .layui-nav-tree .layui-nav-child dd.layui-this,
.skin-1 .layui-nav-tree .layui-nav-child dd.layui-this a,
.skin-1 .layui-nav-tree .layui-this,
.skin-1 .layui-nav-tree .layui-this > a,
.skin-1 .layui-nav-tree .layui-this > a:hover{
background-color: #6699CC;
}
.skin-1 .layui-layout-admin .layui-logo{
color: #fff;
}
.skin-1 .layui-layout-admin .layui-header{
background-color: #66CCFF;
}
.skin-1 .layui-nav {
background-color: #66CCFF;
}
.skin-1 .layui-nav .layui-nav-item a {
color: #FFFFFF
}
.skin-1 .layui-nav .layui-nav-child a {
color: #66CCFF;
}
.skin-1 .layui-nav .layui-this::after,
.skin-1 .layui-nav-bar,
.skin-1 .layui-nav-tree .layui-nav-itemed::after {
background-color: #CCFFFF;
}
.skin-1 .layui-tab-brief > .layui-tab-title .layui-this{
color: #66CCFF;
}
.skin-1 .layui-tab-brief > .layui-tab-more li.layui-this::after, .layui-tab-brief > .layui-tab-title .layui-this::after{
border-color: #66CCFF;
}
.skin-1 .layui-btn{
background-color: #66CCFF;
}
.skin-1 .layui-form-radio > i:hover, .layui-form-radioed > i{
color: #66CCFF;
}
.skin-1 .layui-elem-quote{
border-color: #66CCFF;
}

117
public/static/lib/jquery/jquery.cookie.js Normal file
View File

@@ -0,0 +1,117 @@
/*!
* jQuery Cookie Plugin v1.4.1
* https://github.com/carhartl/jquery-cookie
*
* Copyright 2013 Klaus Hartl
* Released under the MIT license
*/
(function (factory) {
if (typeof define === 'function' && define.amd) {
// AMD
define(['jquery'], factory);
} else if (typeof exports === 'object') {
// CommonJS
factory(require('jquery'));
} else {
// Browser globals
factory(jQuery);
}
}(function ($) {
var pluses = /\+/g;
function encode(s) {
return config.raw ? s : encodeURIComponent(s);
}
function decode(s) {
return config.raw ? s : decodeURIComponent(s);
}
function stringifyCookieValue(value) {
return encode(config.json ? JSON.stringify(value) : String(value));
}
function parseCookieValue(s) {
if (s.indexOf('"') === 0) {
// This is a quoted cookie as according to RFC2068, unescape...
s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
}
try {
// Replace server-side written pluses with spaces.
// If we can't decode the cookie, ignore it, it's unusable.
// If we can't parse the cookie, ignore it, it's unusable.
s = decodeURIComponent(s.replace(pluses, ' '));
return config.json ? JSON.parse(s) : s;
} catch(e) {}
}
function read(s, converter) {
var value = config.raw ? s : parseCookieValue(s);
return $.isFunction(converter) ? converter(value) : value;
}
var config = $.cookie = function (key, value, options) {
// Write
if (value !== undefined && !$.isFunction(value)) {
options = $.extend({}, config.defaults, options);
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setTime(+t + days * 864e+5);
}
return (document.cookie = [
encode(key), '=', stringifyCookieValue(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// Read
var result = key ? undefined : {};
// To prevent the for loop in the first place assign an empty array
// in case there are no cookies at all. Also prevents odd result when
// calling $.cookie().
var cookies = document.cookie ? document.cookie.split('; ') : [];
for (var i = 0, l = cookies.length; i < l; i++) {
var parts = cookies[i].split('=');
var name = decode(parts.shift());
var cookie = parts.join('=');
if (key && key === name) {
// If second argument (value) is a function it's a converter...
result = read(cookie, value);
break;
}
// Prevent storing a cookie that we couldn't decode.
if (!key && (cookie = read(cookie)) !== undefined) {
result[name] = cookie;
}
}
return result;
};
config.defaults = {};
$.removeCookie = function (key, options) {
if ($.cookie(key) === undefined) {
return false;
}
// Must not alter options, thus extending a fresh object...
$.cookie(key, '', $.extend({}, options, { expires: -1 }));
return !$.cookie(key);
};
}));

16
public/static/lib/layui/lib/cropper/croppers.js
View File

@@ -10,21 +10,21 @@ layui.config({
var html = "<link rel=\"stylesheet\" href=\"/static/lib/layui/lib/cropper/cropper.css\">\n" +
"<div class=\"layui-fluid showImgEdit\" style=\"display: none\">\n" +
" <div class=\"layui-form-item\">\n" +
" <div class=\"layui-input-inline layui-btn-container\" style=\"width: auto;\">\n" +
" <div class=\"layui-input-inline layui-btn-container\" style=\"width: auto;margin-left:0\">\n" +
" <label for=\"cropper_avatarImgUpload\" class=\"layui-btn layui-btn-primary\">\n" +
" <i class=\"layui-icon\">&#xe67c;</i>选择图片\n" +
" </label>\n" +
" <input class=\"layui-upload-file\" id=\"cropper_avatarImgUpload\" type=\"file\" value=\"选择图片\" name=\"file\">\n" +
" </div>\n" +
" <div class=\"layui-form-mid layui-word-aux\">头像的尺寸限定150x150px,大小在50kb以内</div>\n" +
" <div class=\"layui-form-mid layui-word-aux\" style=\"margin-left:0\">头像的尺寸限定150x150px,大小在50kb以内</div>\n" +
" </div>\n" +
" <div class=\"layui-row layui-col-space15\">\n" +
" <div class=\"layui-col-xs9\">\n" +
" <div class=\"layui-col-xs12 layui-col-md9 \">\n" +
" <div class=\"readyimg\" style=\"height:450px;background-color: rgb(247, 247, 247);\">\n" +
" <img src=\"\" >\n" +
" </div>\n" +
" </div>\n" +
" <div class=\"layui-col-xs3\">\n" +
" <div class=\"layui-col-xs12 layui-col-md3 \">\n" +
" <div class=\"img-preview\" style=\"width:200px;height:200px;overflow:hidden\">\n" +
" </div>\n" +
" </div>\n" +
@@ -63,6 +63,14 @@ layui.config({
data = e.data,
done = e.done;
if(area === true){
if(window.innerWidth > 900){
area = '900px'
}else{
area = ['100%','100%']
}
}
var content = $('.showImgEdit')
,image = $(".showImgEdit .readyimg img")
,preview = '.showImgEdit .img-preview'

2
view/admin/admin/admin_log.html
View File

@@ -34,7 +34,7 @@
<div>
</div>
<div>
<div style="overflow: auto;">
<table class="layui-table">
<colgroup>
<col width="150">

2
view/admin/admin/index.html
View File

@@ -34,7 +34,7 @@
<div>
<a class="layui-btn" href="{:url('Admin/create')}">添加管理员</a>
</div>
<div>
<div style="overflow: auto;">
<table class="layui-table">
<thead>
<tr>

2
view/admin/admin_group/index.html
View File

@@ -34,7 +34,7 @@
<a class="layui-btn" href="{:url('AdminGroup/create')}">添加分组</a>
</div>
</div>
<div>
<div style="overflow: auto;">
<table class="layui-table">
<thead>
<tr>

89
view/admin/admin_permission/index.html
View File

@@ -31,8 +31,9 @@
</span>
</div>
<div class="main-container">
<div>
<div style="overflow: auto;">
<table class="layui-table">
<thead>
<tr>
@@ -44,7 +45,7 @@
</thead>
<tbody>
{volist name='list' id='vo'}
<tr class="item" data-id="{$vo.id}" data-is-log="{$vo->getData('is_log')}">
<td>{$vo.id}</td>
<td>
@@ -53,27 +54,29 @@
</td>
<td>
<span>{$vo.app}/{$vo.controller}/{$vo.action}</span>
<div class="layui-btn layui-btn-sm set-url" data-url="{$vo.app}/{$vo.controller}/{$vo.action}">设置</div>
<div class="layui-btn layui-btn-sm set-url"
data-url="{$vo.app}/{$vo.controller}/{$vo.action}">设置</div>
</td>
<td>
<div class="layui-btn-container">
<div class="layui-btn layui-btn-sm is-log" >{$vo.is_log}</div>
<div class="layui-btn layui-btn-sm is-log">{$vo.is_log}</div>
<div class="layui-btn layui-btn-sm delete">删除</div>
</div>
</td>
</tr>
{/volist}
{if condition="count($list) eq 0" }
<tr>
<td colspan="3">暂无数据</td>
</tr>
{/if}
{if condition="count($list) eq 0" }
<tr>
<td colspan="3">暂无数据</td>
</tr>
{/if}
</tbody>
</table>
<div>
{$list->render()|raw}
</div>
</div>
</div>
</div>
</div>
@@ -82,75 +85,75 @@
{include file="common/_footer"}
<script>
layui.use(['layer'],function(){
$('.set-name').click(function(){
layui.use(['layer'], function () {
$('.set-name').click(function () {
var item = this;
layer.prompt({
value:$(item).data('name')
},function(value,index){
$.post('{:url("AdminPermission/update")}',{
id:$(item).parents('tr').data('id'),
name:value
},function(result){
value: $(item).data('name')
}, function (value, index) {
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
name: value
}, function (result) {
layer.close(index)
$(item).siblings('span').text(value)
})
})
})
$('.set-url').click(function(){
$('.set-url').click(function () {
var item = this;
layer.prompt({
value:$(item).data('url')
},function(value,index){
$.post('{:url("AdminPermission/update")}',{
id:$(item).parents('tr').data('id'),
url:value
},function(result){
value: $(item).data('url')
}, function (value, index) {
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
url: value
}, function (result) {
layer.close(index)
$(item).siblings('span').text(value)
})
})
})
$('.delete').click(function(){
$('.delete').click(function () {
var item = this;
layer.confirm('确定要删除吗?',function(){
$.get('{:url("AdminPermission/delete")}',{
id:$(item).parents('tr').data('id')
},function(result){
if(result.code == 0){
layer.confirm('确定要删除吗?', function () {
$.get('{:url("AdminPermission/delete")}', {
id: $(item).parents('tr').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
$(item).parents('tr').remove();
}else{
} else {
layer.msg(result.msg)
}
})
})
})
$('.is-log').click(function(){
$('.is-log').click(function () {
var item = this;
var isLog = $(item).parents('tr').data('is-log')
if(isLog == 0){
if (isLog == 0) {
isLog = 1
}else{
} else {
isLog = 0
}
$.post('{:url("AdminPermission/update")}',{
id:$(item).parents('tr').data('id'),
is_log:isLog
},function(){
if(isLog == 1){
$.post('{:url("AdminPermission/update")}', {
id: $(item).parents('tr').data('id'),
is_log: isLog
}, function () {
if (isLog == 1) {
$(item).text('记录')
}else{
} else {
$(item).text('不记录')
}
})
})
})
</script>
</div>
</body>

68
view/admin/common/_header.html
View File

@@ -1,14 +1,14 @@
<div class="layui-header">
<a class="layui-logo" href="/">{:get_system_config('site_name')}</a>
<!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-left">
<!-- 头部区域（可配合layui已有的水平导航） PC端显示 -->
<ul class="layui-nav layui-layout-left layui-hide-xs pc-nav-container">
<li class="layui-nav-item header-nav-item" data-name="Index" ><a href="{:url('admin/Index/index')}">首页</a></li>
<li class="layui-nav-item header-nav-item" data-name="User" ><a href="{:url('admin/User/index')}">用户管理</a></li>
<li class="layui-nav-item header-nav-item" data-name="File" ><a href="{:url('admin/File/index')}">文件管理</a></li>
<li class="layui-nav-item header-nav-item" data-name="Admin" ><a href="{:url('admin/Admin/index')}">管理员管理</a></li>
<li class="layui-nav-item header-nav-item" data-name="System" ><a href="{:url('admin/System/index')}">系统设置</a></li>
</ul>
<ul class="layui-nav layui-layout-right">
<ul class="layui-nav layui-layout-right layui-hide-xs">
<li class="layui-nav-item header-nav-item" data-name="Login">
<a href="javascript:;">
<img src="{$admin.avatar}" class="layui-nav-img">
@@ -22,4 +22,64 @@
<li class="layui-nav-item"><a href="{:url('Login/logout')}">退出</a></li>
</ul>
</div>
<!-- 手机端显示 -->
<div class="left-bottom-options layui-show-xs-block layui-hide-md layui-icon layui-icon-right">
</div>
<div class="layui-nav layui-layout-right layui-show-xs-block layui-hide-md">
<li class="layui-nav-item">
<a href="javascript:;" class="mobile-nav-current-title">菜单</a>
<dl class="layui-nav-child mobile-nav-container"> <!-- 二级菜单 -->
</dl>
</li>
<li class="layui-nav-item header-nav-item" data-name="Login">
<a href="javascript:;">
<img src="{$admin.avatar}" class="layui-nav-img">
</a>
<dl class="layui-nav-child">
<dd><a href="{:url('Admin/edit')}">基本资料</a></dd>
<dd><a href="{:url('Admin/password')}">安全设置</a></dd>
<dd><a href="{:url('Login/logout')}">退出</a></dd>
</dl>
</li>
</div>
</div>
<div class="tpl" style="display: none;">
<dd class="mobile-nav-item header-nav-item"><a href="{:url('Admin/edit')}">基本资料</a></dd>
</div>
<script>
$(function(){
$('.pc-nav-container').children().each(function(n,e){
var nav = $('.tpl .mobile-nav-item').clone();
nav.data('name',$(e).data('name'))
nav.html($(e).html())
nav.appendTo('.mobile-nav-container')
})
$('.left-bottom-options').click(function(){
layer.open({
type:1,
content:$('.layui-side'),
anim:3,
offset:'l',
area:['60%','100%'],
shadeClose:true,
title:false,
closeBtn:false,
})
})
})
</script>

74
view/admin/common/_require.html
View File

@@ -1,42 +1,76 @@
<link rel="stylesheet" href="/static/css/reset.css">
<link rel="stylesheet" href="/static/css/pagination.css">
<link rel="stylesheet" href="/static/lib/layui/css/layui.css">
<link rel="stylesheet" href="/static/css/common.css">
<script src="/static/lib/jquery/jquery-3.4.1.min.js"></script>
<script src="/static/lib/jquery/jquery.cookie.js"></script>
<script src="/static/lib/layui/layui.js"></script>
<script src="/static/js/common.js"></script>
<style>
.main-container{
.main-container {
margin-top: 10px;
}
.layui-table img{
.layui-table img {
max-width: 60px;
max-height: 60px;;;
max-height: 60px;
}
</style>
<script>
//JavaScript代码区域
layui.use(['element','layer'], function () {
layui.use(['element', 'layer', 'util'], function () {
var element = layui.element;
var util = layui.util;
var defaultCookieSetting = {
path:'/',
expires: 7,
}
//执行
util.fixbar({
bar1: '&#xe656;'
, click: function (type) {
console.log(type);
if (type === 'bar1') {
var skinName = $.cookie('skin-name')
$('body').removeClass()
if(skinName == 'skin-1'){
$.cookie('skin-name','skin-0',defaultCookieSetting)
$('body').addClass('skin-0')
}else{
$.cookie('skin-name','skin-1',defaultCookieSetting)
$('body').addClass('skin-1')
}
}
}
});
$('.layui-side').addClass('layui-hide-xs')
});
$(function(){
if(typeof currentHeaderNavItem != "undefined"){
$('.header-nav-item').each(function(i,e){
if($(e).data('name') == currentHeaderNavItem){
$(e).addClass('layui-this')
}
})
}
if(typeof currentLeftNavItem != "undefined"){
$('.left-nav-item').each(function(i,e){
if($(e).data('name') == currentLeftNavItem){
$(e).addClass('layui-this')
}
})
}
$(function () {
var skinName = $.cookie('skin-name')
$('body').addClass(skinName)
setTimeout(() => {
if (typeof currentHeaderNavItem != "undefined") {
$('.header-nav-item').each(function (i, e) {
if ($(e).data('name') == currentHeaderNavItem) {
$(e).addClass('layui-this')
}
})
}
if (typeof currentLeftNavItem != "undefined") {
$('.left-nav-item').each(function (i, e) {
if ($(e).data('name') == currentLeftNavItem) {
$(e).addClass('layui-this')
}
})
}
}, 1);
})
</script>
{:get_system_config('site_tongji')}
{:get_system_config('site_tongji')}

53
view/admin/file/index.html
View File

@@ -32,7 +32,7 @@
</div>
<div class="main-container">
<div>
<form action="" lay-filter="filter" class="layui-form">
<form action="" lay-filter="filter" class="layui-form layui-form-pane ">
<input type="hidden" name="type" value="{$Request.param.type|default=1}">
<div class="layui-form-item">
<div class="layui-inline">
@@ -43,8 +43,8 @@
<option value="0">未使用(仅供预览)</option>
<option value="1">已使用</option>
<option value="2">已删除</option>
<option value="3">已清除</option>
</select>
<option value="3">已清除</option>
</select>
</div>
</div>
@@ -55,7 +55,7 @@
</form>
</div>
<div>
<div style="overflow: auto;">
<table class="layui-table">
<thead>
@@ -63,7 +63,7 @@
<th>ID</th>
<th>预览</th>
<th>文件信息</th>
<th>状态时间</th>
<th style="min-width: 200px;">状态时间</th>
<th>操作</th>
</tr>
</thead>
@@ -103,14 +103,15 @@
<td>
<div class="layui-btn-container">
{if condition="empty($vo->getData('clear_time'))" }
{if condition="!empty($vo->getData('used_time')) && empty($vo->getData('delete_time'))" }
{if condition="!empty($vo->getData('used_time')) &&
empty($vo->getData('delete_time'))" }
<div class="layui-btn layui-btn-sm force-clear">强制清除文件</div>
{else /}
<div class="layui-btn layui-btn-sm clear">清除文件</div>
<div class="layui-btn layui-btn-sm clear">清除文件</div>
{/if}
{/if}
{if condition="empty($vo->getData('clear_time'))" }
<a class="layui-btn layui-btn-sm" href="{$vo.src}" target="_blank">下载</a>
<a class="layui-btn layui-btn-sm" href="{$vo.src}" target="_blank">下载</a>
{/if}
</div>
@@ -132,42 +133,42 @@
{include file="common/_footer"}
<script>
layui.use(['layer','form'],function(){
layui.use(['layer', 'form'], function () {
var form = layui.form;
form.val('filter',{
status:'{$Request.param.status}'
form.val('filter', {
status: '{$Request.param.status}'
})
$('.clear').click(function(){
$('.clear').click(function () {
var item = this;
console.log($(item).parents('tr').data('id'));
layer.confirm('确定要清除吗?清除后不能恢复',function(){
$.get('{:url("File/clear")}',{
id:$(item).parents('tr').data('id')
},function(result){
if(result.code == 0){
layer.confirm('确定要清除吗?清除后不能恢复', function () {
$.get('{:url("File/clear")}', {
id: $(item).parents('tr').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
$(item).parents('td').children().remove()
}else{
} else {
layer.msg(result.msg)
}
})
})
})
$('.force-clear').click(function(){
$('.force-clear').click(function () {
var item = this;
layer.confirm('确定要强制清除吗?该文件有可能正在使用',function(){
$.get('{:url("File/clear")}',{
id:$(item).parents('tr').data('id')
},function(result){
if(result.code == 0){
layer.confirm('确定要强制清除吗?该文件有可能正在使用', function () {
$.get('{:url("File/clear")}', {
id: $(item).parents('tr').data('id')
}, function (result) {
if (result.code == 0) {
layer.msg('删除成功');
$(item).parents('td').children().remove()
}else{
} else {
layer.msg(result.msg)
}
})

3
view/admin/login/index.html
View File

@@ -54,7 +54,8 @@
<div class="layui-input-block">
<input type="text" name="captcha" required lay-verify="required"
placeholder="请输入验证码" autocomplete="off" value="test(直接登陆即可)" class="layui-input">
<img class="captcha" src="/api/Captcha/build" onclick="this.src = '/api/Captcha/build?v='+Math.random()" style="cursor: pointer" alt="">
<img class="captcha" src="/api/Captcha/build" onclick="this.src = '/api/Captcha/build?v='+Math.random()" style="cursor: pointer;width:
100%;" alt="">
</div>
</div>

28
view/admin/user/edit.html
View File

@@ -55,11 +55,10 @@
<div class="layui-form-item">
<div class="layui-form-label">密码</div>
<div class="layui-input-block">
<input type="password" name="password"
value="" class="layui-input">
<input type="password" name="password" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-form-label">头像</div>
<div class="layui-input-block">
@@ -67,10 +66,11 @@
<div class="layui-btn upload-admin-avatar">上传</div>
</div>
<div>
<img class="layui-circle admin-avatar" style="width: 80px" src="{$user.avatar}"
alt="{$user.avatar}" srcset="">
<img class="layui-circle admin-avatar" style="width: 80px"
src="{$user.avatar}" alt="{$user.avatar}" srcset="">
</div>
<input type="hidden" name="avatar" value="{$user->getData('avatar')}" class="layui-input">
<input type="hidden" name="avatar" value="{$user->getData('avatar')}"
class="layui-input">
</div>
</div>
<div class="layui-form-item">
@@ -91,7 +91,7 @@
<script>
layui.config({
base: '/static/lib/layui/lib/cropper/'
}).use(['layer', 'upload', 'croppers','form'], function () {
}).use(['layer', 'upload', 'croppers', 'form'], function () {
var upload = layui.upload;
var croppers = layui.croppers;
@@ -103,13 +103,13 @@
type: 3,
dir: 'user_avatar'
},
saveW: 150 //保存宽度
,
saveH: 150,
mark: 1 / 1 //选取比例
,
area: '900px' //弹窗宽度
,
saveW: 200, //保存宽度
saveH: 200,
mark: 1 / 1, //选取比例
area: true, //弹窗宽度
accept: 'images',
done: function (result) {
if (result.code == 0) {

2
view/admin/user/index.html
View File

@@ -34,7 +34,7 @@
<div >
<a class="layui-btn" href="{:url('create')}"> 添加用户</a>
</div>
<div>
<div style="overflow: auto;">
<table class="layui-table" lay-skin="line">
<thead>
<tr>