新增手机端浏览模式

public/static/admin/css/public.css

@@ -337,6 +337,11 @@ table样式
     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);
+    }
+}

public/static/common/js/app.js

@@ -9,11 +9,11 @@ loading.show = function (count) {
     }
 
     if (loading.showCount == 0) {
-        loading.index = layer.load()
+        loading.index = layer.load();
     }
 
     loading.showCount += count;
-}
+};
 
 loading.hide = function (count) {
 
@@ -37,4 +37,26 @@ loading.hide = function (count) {
         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;
+};

public/static/plugs/ulthon-admin/table.js

@@ -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;
+})();

public/static/plugs/ulthon-admin/ulthon-admin.js

@@ -19,7 +19,6 @@
 
     var form = layui.form,
         layer = layui.layer,
-        table = layui.table,
         laydate = layui.laydate,
         upload = layui.upload,
         element = layui.element,
@@ -37,6 +36,13 @@
         upload_exts: '',
     };
 
+    var table;
+
+    if (tools.checkMobile()) {
+        table = window.uaTable;
+    } else {
+        table = layui.table;
+    }
 
     var extGroup = {
         // 图片扩展名数组
@@ -1445,23 +1451,7 @@
             }
         },
         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;
+            return tools.checkMobile();
         },
         open: function (title, url, width, height, isResize, shadeClose = false) {
             isResize = isResize === undefined ? true : isResize;
@@ -1591,12 +1581,18 @@
                     clientHeight = '100%';
                 }
 
-                admin.open(
-                    $(this).attr('data-title'),
-                    external ? url : admin.url(url),
-                    clienWidth,
-                    clientHeight,
-                );
+                // 如果是手机版，则直接跳转
+                if (admin.checkMobile()) {
+                    location.href = external ? url : admin.url(url);
+                } else {
+                    admin.open(
+                        $(this).attr('data-title'),
+                        external ? url : admin.url(url),
+                        clienWidth,
+                        clientHeight,
+                    );
+                }
+
             });
 
             // 放大图片