新增手机端浏览模式

This commit is contained in:
2023-09-27 16:32:38 +08:00
parent c77257730c
commit 4356de36b3
11 changed files with 310 additions and 28 deletions

View File

@@ -3,8 +3,10 @@
namespace base\admin\controller; namespace base\admin\controller;
use app\admin\model\SystemAdmin; use app\admin\model\SystemAdmin;
use app\admin\model\SystemMenu;
use app\admin\model\SystemQuick; use app\admin\model\SystemQuick;
use app\common\controller\AdminController; use app\common\controller\AdminController;
use app\common\service\MenuService;
class IndexBase extends AdminController class IndexBase extends AdminController
{ {
@@ -116,4 +118,39 @@ class IndexBase extends AdminController
return $this->fetch(); return $this->fetch();
} }
public function mobile()
{
$pid = $this->request->param('pid', 0);
$menuService = new MenuService(session('admin.id'));
$home_info = $menuService->getHomeInfo();
$list_menu = SystemMenu::with(['children' => function ($query) {
$query->order('sort', 'desc')->order('id', 'asc');
}])->where('pid', $pid)->order([
'sort' => 'desc',
'id' => 'asc',
])
->where('status', 1)
->select();
$list_menu_pid = SystemMenu::group('pid')->column('pid');
foreach ($list_menu as $model_menu) {
foreach ($model_menu->children as $model_child) {
if (in_array($model_child->id, $list_menu_pid)) {
$model_child->href = __url('mobile', ['pid' => $model_child->pid]);
} else {
$model_child->href = __url($model_child->href);
}
}
}
$this->assign('home_info', $home_info);
$this->assign('list_menu', $list_menu);
return $this->fetch();
}
} }

View File

@@ -2,6 +2,7 @@
namespace base\admin\model; namespace base\admin\model;
use app\admin\model\SystemMenu;
use app\common\constants\MenuConstant; use app\common\constants\MenuConstant;
use app\common\model\TimeModel; use app\common\model\TimeModel;
@@ -9,6 +10,11 @@ class SystemMenuBase extends TimeModel
{ {
protected $deleteTime = 'delete_time'; protected $deleteTime = 'delete_time';
public function children()
{
return $this->hasMany(SystemMenu::class, 'pid', 'id');
}
public function getPidMenuList() public function getPidMenuList()
{ {
$list = $this->field('id,pid,title') $list = $this->field('id,pid,title')

View File

@@ -30,4 +30,5 @@
<script src="__STATIC__/plugs/jq-module/city-picker/js/city-picker.data.min.js"></script> <script src="__STATIC__/plugs/jq-module/city-picker/js/city-picker.data.min.js"></script>
<script src="__STATIC__/plugs/jq-module/city-picker/js/city-picker.min.js"></script> <script src="__STATIC__/plugs/jq-module/city-picker/js/city-picker.min.js"></script>
<script src="__STATIC__/plugs/clipboard.js/clipboard.min.js"></script> <script src="__STATIC__/plugs/clipboard.js/clipboard.min.js"></script>
<script src="__STATIC__/plugs/ulthon-admin/table.js"></script>
<script src="__STATIC__/plugs/ulthon-admin/ulthon-admin.js"></script> <script src="__STATIC__/plugs/ulthon-admin/ulthon-admin.js"></script>

View File

@@ -0,0 +1,31 @@
<div class="ul-section ul-padding-md">
<div class="ul-group-title">基本</div>
<div class="ul-nav-grid colord box">
<a href="{:__url('admin/index/welcome')}" class="item">
<div class="icon">
<div class="main"><i class="{$home_info.icon}"></i></div>
</div>
<div class="title">{$home_info.title}</div>
</a>
</div>
</div>
{volist name='list_menu' id='vo'}
{notempty name='vo.children'}
<div class="ul-section ul-padding-md">
<div class="ul-group-title">{$vo.title}</div>
<div class="ul-nav-grid colord box">
{volist name='vo.children' id='vovo'}
<a href="{$vovo.href}" class="item">
<div class="icon">
<div class="main"><i class="{$vovo.icon}"></i></div>
</div>
<div class="title">{$vovo.title}</div>
</a>
{/volist}
</div>
</div>
{/notempty}
{/volist}

View File

View File

@@ -30,6 +30,38 @@
</head> </head>
<body> <body>
{if $Request.isMobile }
<link rel="stylesheet" href="//layui.ulthon.com/cdn/layui-ul.css">
<div class="ul-section">
<div class="ul-header">
<div class="ul-header-main" style="max-width: 600px;">
<div class="ul-header-left">
<a href="{:__url('admin/index/mobile')}" class="">
<img class="ul-header-logo" src="{$logo_info.image}" alt="">
</a>
</div>
{notempty name='session_admin'}
<div class="ul-header-right">
<div class="ul-header-user">
<div class="ul-header-user-avatar" style="background-image: url('{$session_admin.head_img}');">
</div>
<div class="ul-header-user-info">
<div class="ul-header-user-name">
{$session_admin.username}
</div>
<div class="ul-header-user-options">
<i class="ul-icon-exit"></i>
<span>退出</span>
</div>
</div>
</div>
</div>
{/notempty}
</div>
</div>
</div>
{/if}
{__CONTENT__} {__CONTENT__}
<script style="display: none;" id="data-brage" type="text/plain">{$data_brage|raw|default='[]'}</script> <script style="display: none;" id="data-brage" type="text/plain">{$data_brage|raw|default='[]'}</script>
</body> </body>

View File

@@ -366,6 +366,15 @@ class AdminControllerBase extends BaseController
]; ];
View::assign($data); View::assign($data);
if ($this->request->isMobile()) {
$logo_info = [
'title' => sysconfig('site', 'logo_title'),
'image' => sysconfig('site', 'logo_image'),
'href' => __url('index/index'),
];
$this->assign('logo_info', $logo_info);
}
} }
/** /**

View File

@@ -337,6 +337,11 @@ table样式
padding: 10px 0px; padding: 10px 0px;
} }
/* 手机端的表格头部操作 */
.layuimini-container .main-tool {
padding: 15px;
}
/** /**
开关 开关
*/ */
@@ -560,4 +565,24 @@ table样式
} }
@media (max-width: 768px) {} @media (max-width: 768px) {
.layuimini-form .layui-form-item {
padding-right: 0;
}
.layuimini-form .layui-form-item .layui-form-label {
float: unset;
display: inline-block;
width: auto;
padding-left: 0;
padding-bottom: 0px;
}
.layuimini-form .layui-form-item .layui-input-block {
margin-left: 0;
}
.layuimini-form.multiple-columns .layui-form-item.full-line {
width: calc(100% - 0px);
}
}

View File

@@ -9,11 +9,11 @@ loading.show = function (count) {
} }
if (loading.showCount == 0) { if (loading.showCount == 0) {
loading.index = layer.load() loading.index = layer.load();
} }
loading.showCount += count; loading.showCount += count;
} };
loading.hide = function (count) { loading.hide = function (count) {
@@ -37,4 +37,26 @@ loading.hide = function (count) {
layer.close(loading.index); layer.close(loading.index);
} }
} };
const tools = {};
tools.checkMobile = function () {
var userAgentInfo = navigator.userAgent;
var mobileAgents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var mobile_flag = false;
//根据userAgent判断是否是手机
for (var v = 0; v < mobileAgents.length; v++) {
if (userAgentInfo.indexOf(mobileAgents[v]) > 0) {
mobile_flag = true;
break;
}
}
var screen_width = window.screen.width;
var screen_height = window.screen.height;
//根据屏幕分辨率判断是否是手机
if (screen_width < 600 && screen_height < 800) {
mobile_flag = true;
}
return mobile_flag;
};

View File

@@ -0,0 +1,123 @@
(function () {
var table = {};
table.render = function (options) {
console.log(options);
var divId = options.elem + 'MB';
$(options.elem).hide();
var dataContainer = $(
`<div id="${divId.substring(1)}'" style="margin:-15px">
<div class="main-tool"></div>
<div class="main-data"></div>
</div>`
).insertAfter(options.elem);
// 暂时隐藏按钮
// var containerToobar = dataContainer.find('.main-tool');
// containerToobar.prepend(options.toolbar);
var containerBox = dataContainer.find('.main-data');
loadPage();
var page = 1;
function loadPage() {
$.get(options.url, { page: page }, function (res) {
res.data.forEach(row => {
var rowItem = $.extend(true, {}, row);
var baseElem = $(baseItem).appendTo(containerBox);
if (options.cols[0][0].type == 'checkbox' || options.cols[0[0]].type == 'radio') {
$('<input name="layTableCheckbox" type="' + options.cols[0][0].type + '">')
.appendTo(baseElem.find('.header').find('.plus'));
}
rowItem.LAY_COL = $.extend(true, {}, options.cols[0][1]);
baseElem.find('.header').find('.main').find('span').html(
options.cols[0][1].templet(rowItem)
);
options.cols[0].forEach(LAY_COL => {
var dataItem = $.extend(true, {}, row);
dataItem.LAY_COL = $.extend(true, {}, LAY_COL);
if (LAY_COL.type == 'checkbox' || LAY_COL.type == 'radio') {
return;
}
if (LAY_COL.templet == ua.table.tool) {
// 暂时隐藏按钮
// baseElem.find('.footer .plus').html(dataItem.LAY_COL.templet(dataItem));
return;
}
if (LAY_COL.field == 'create_time') {
baseElem.find('.footer .main').html(dataItem.LAY_COL.templet(dataItem));
return;
}
var baseDataItemElem = $(baseDataItem).appendTo(baseElem.find('.body .main'));
baseDataItemElem.find('.item-title').html(
dataItem.LAY_COL.title + ':'
);
baseDataItemElem.find('.item-value').html(
dataItem.LAY_COL.templet(dataItem)
);
});
});
});
}
var baseItem = `
<div class="ul-data-card">
<div class="header">
<div class="main">
#
<span></span>
</div>
<div class="plus">
</div>
</div>
<div class="body">
<div class="main">
</div>
</div>
<div class="footer">
<div class="main">
</div>
<div class="plus">
<div class="layui-btn layui-btn-sm layui-btn-normal">删除</div>
<div class="layui-btn layui-btn-sm layui-btn-primary">修改</div>
</div>
</div>
</div>`;
var baseDataItem = `
<div class="item">
<div class="item-title">
</div>
<div class="item-value">
</div>
</div>`;
};
table.on = function (event, callback) {
// console.log(event, callback);
};
window.uaTable = table;
})();

View File

@@ -19,7 +19,6 @@
var form = layui.form, var form = layui.form,
layer = layui.layer, layer = layui.layer,
table = layui.table,
laydate = layui.laydate, laydate = layui.laydate,
upload = layui.upload, upload = layui.upload,
element = layui.element, element = layui.element,
@@ -37,6 +36,13 @@
upload_exts: '', upload_exts: '',
}; };
var table;
if (tools.checkMobile()) {
table = window.uaTable;
} else {
table = layui.table;
}
var extGroup = { var extGroup = {
// 图片扩展名数组 // 图片扩展名数组
@@ -1445,23 +1451,7 @@
} }
}, },
checkMobile: function () { checkMobile: function () {
var userAgentInfo = navigator.userAgent; return tools.checkMobile();
var mobileAgents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var mobile_flag = false;
//根据userAgent判断是否是手机
for (var v = 0; v < mobileAgents.length; v++) {
if (userAgentInfo.indexOf(mobileAgents[v]) > 0) {
mobile_flag = true;
break;
}
}
var screen_width = window.screen.width;
var screen_height = window.screen.height;
//根据屏幕分辨率判断是否是手机
if (screen_width < 600 && screen_height < 800) {
mobile_flag = true;
}
return mobile_flag;
}, },
open: function (title, url, width, height, isResize, shadeClose = false) { open: function (title, url, width, height, isResize, shadeClose = false) {
isResize = isResize === undefined ? true : isResize; isResize = isResize === undefined ? true : isResize;
@@ -1591,12 +1581,18 @@
clientHeight = '100%'; clientHeight = '100%';
} }
admin.open( // 如果是手机版,则直接跳转
$(this).attr('data-title'), if (admin.checkMobile()) {
external ? url : admin.url(url), location.href = external ? url : admin.url(url);
clienWidth, } else {
clientHeight, admin.open(
); $(this).attr('data-title'),
external ? url : admin.url(url),
clienWidth,
clientHeight,
);
}
}); });
// 放大图片 // 放大图片