优化后台任务显示

app/admin/controller/Base.php

@@ -44,8 +44,9 @@ class Base extends Controller
     public function index()
     {
         $this->_query(SystemBase::class)->layTable(function () {
-            $this->applyTypes();
             $this->title = '数据字典管理';
+            $this->types = (new SystemBase)->types();
+            $this->type = input('get.type') ?: ($this->types[0] ?? '-');
         }, function (QueryHelper $query) {
             $query->where(['deleted' => 0])->equal('type')->like('code,name,status')->dateBetween('create_at');
         });
@@ -82,9 +83,14 @@ class Base extends Controller
     protected function _form_filter(array &$data)
     {
         if ($this->request->isGet()) {
-            $this->applyTypes(true);
+            $this->types = (new SystemBase)->types();
+            $this->types[] = '--- 新增类型 ---';
+            $this->type = input('get.type') ?: ($this->types[0] ?? '-');
         } else {
-            $map = [['type', '=', $data['type']], ['code', '=', $data['code']], ['deleted', '=', 0]];
+            $map = [];
+            $map[] = ['deleted', '=', 0];
+            $map[] = ['code', '=', $data['code']];
+            $map[] = ['type', '=', $data['type']];
             if (isset($data['id'])) $map[] = ['id', '<>', $data['id']];
             if ($this->app->db->name($this->table)->where($map)->count() > 0) {
                 $this->error("同类型的数据编码已经存在！");
@@ -111,17 +117,4 @@ class Base extends Controller
     {
         $this->_delete($this->table);
     }
-
-    /**
-     * 初始化数据类型
-     * @param false $add
-     */
-    private function applyTypes(bool $add = false)
-    {
-        $query = $this->app->db->name($this->table)->where(['deleted' => 0]);
-        $this->types = $query->distinct(true)->order('id asc')->column('type');
-        if (empty($this->types)) $this->types = ['身份权限'];
-        $this->type = input('get.type') ?: ($this->types[0] ?? '-');
-        if ($add) $this->types[] = '--- 新增类型 ---';
-    }
 }

app/admin/controller/Config.php

@@ -102,5 +102,4 @@ class Config extends Controller
             $this->success('修改文件存储成功！');
         }
     }
-
 }

app/admin/controller/Login.php

@@ -120,5 +120,4 @@ class Login extends Controller
         $this->app->session->destroy();
         $this->success('退出登录成功!', sysuri('admin/login/index'));
     }
-
 }

app/admin/controller/Oplog.php

@@ -100,5 +100,4 @@ class Oplog extends Controller
     {
         $this->_delete($this->table);
     }
-
 }

app/admin/controller/Queue.php

@@ -70,8 +70,8 @@ class Queue extends Controller
                 if ($item['status'] === 4) $this->total['ers'] = $item['count'];
             });
         }, function (QueryHelper $query) {
-            $query->timeBetween('enter_time,exec_time')->dateBetween('create_at');
             $query->equal('status')->like('code,title,command');
+            $query->timeBetween('enter_time,exec_time')->dateBetween('create_at');
         });
     }
 

app/admin/controller/User.php

@@ -264,5 +264,4 @@ class User extends Controller
             sysoplog('系统用户管理', "删除系统用户[{$id}]成功");
         }
     }
-
 }

app/admin/controller/api/Runtime.php

@@ -116,5 +116,4 @@ class Runtime extends Controller
             $this->error('只有超级管理员才能操作！');
         }
     }
-
 }

app/admin/controller/api/Update.php

@@ -74,5 +74,4 @@ class Update extends Controller
     {
         $this->success('获取模块信息成功！', ModuleService::instance()->getModules());
     }
-
 }

app/admin/controller/api/Upload.php

@@ -218,5 +218,4 @@ class Upload extends Controller
         foreach (['<?php ', '<% ', '<script '] as $key) if (stripos($bins, $key) !== false) return true;
         return preg_match("/(3c25.*?28.*?29.*?253e)|(3c3f.*?28.*?29.*?3f3e)|(3C534352495054)|(2F5343524950543E)|(3C736372697074)|(2F7363726970743E)/is", $hexs);
     }
-
 }

app/admin/model/SystemBase.php

@@ -22,6 +22,7 @@ use think\Model;
  * 数据字典数据模型
  * Class SystemBase
  * @package app\admin\model
+ * @method \think\db\Query distinct(bool $true)
  */
 class SystemBase extends Model
 {
@@ -42,6 +43,18 @@ class SystemBase extends Model
     }
 
     /**
+     * 获取所有数据类型
+     * @param boolean $simple
+     * @return array
+     */
+    public function types(bool $simple = false): array
+    {
+        $types = $this->where(['deleted' => 0])->distinct(true)->column('type');
+        if (empty($types) && empty($simple)) $types = ['身份权限'];
+        return $types;
+    }
+
+    /**
      * 格式化创建时间
      * @param string $value
      * @return string

app/admin/view/auth/index.html

@@ -31,7 +31,7 @@
                 {field: 'desc', title: '权限描述', sort: false, align: 'center', templet: '<div>{{d.desc||"-"}}</div>'},
                 {field: 'create_at', title: '创建时间', align: 'center', sort: true},
                 {field: 'status', title: '权限状态', align: 'center', minWidth: 110, fixed: 'right', templet: '#StatusSwitchTpl'},
-                {toolbar: '#toolbar', align: 'center', minWidth: 200, title: '权限操作', fixed: 'right'},
+                {toolbar: '#toolbar', title: '操作面板', align: 'center', minWidth: 200, fixed: 'right'},
             ]]
         });
 

app/admin/view/menu/index.html

@@ -54,7 +54,7 @@
                 </td>
                 <td class='text-center'><i class="{$vo.icon} font-s18"></i></td>
                 <td class="nowrap"><span class="color-desc">{$vo.spl|raw}</span>{$vo.title}</td>
-                <td class='layui-hide-xs'>{$vo.url}</td>
+                <td class='layui-hide-xs layui-elip'>{$vo.url}</td>
                 <td class='text-center nowrap'>{eq name='vo.status' value='0'}<span class="color-red">已禁用</span>{else}<span class="color-green">已激活</span>{/eq}</td>
                 <td class='text-center nowrap notselect'>
 

app/admin/view/oplog/index.html

@@ -32,7 +32,7 @@
                 {field: 'geoip', title: '访问地址', sort: true},
                 {field: 'geoisp', title: '网络服务商', sort: false},
                 {field: 'create_at', title: '操作时间', minWidth: 170, align: 'center', sort: true},
-                {toolbar: '#toolbar', align: 'center', fixed: 'right'}
+                {toolbar: '#toolbar', title: '操作面板', align: 'center', fixed: 'right'}
             ]]
         });
     });

app/admin/view/queue/index.html

@@ -69,10 +69,10 @@
             cols: [[
                 {checkbox: true, fixed: 'left'},
                 {field: 'code', title: '任务编号', width: 140, sort: true},
-                {field: 'title', title: '任务名称', minWidth: 160},
-                {field: 'command', title: '任务指令', minWidth: 160},
+                {field: 'title', title: '任务名称', minWidth: 150},
+                {field: 'command', title: '任务指令', minWidth: 150},
                 {
-                    field: 'exec_time', title: '计划时间', minWidth: 250, templet: function (d) {
+                    field: 'exec_time', title: '计划时间', minWidth: 245, templet: function (d) {
                         d.exec_time = d.exec_time || 0, d.loops_time = d.loops_time || 0;
                         if (d.loops_time > 0) {
                             return d.exec_time + ' ( 每 <b class="color-blue">' + d.loops_time + '</b> 秒 ) ';
@@ -87,13 +87,14 @@
                         if (d.enter_time.length > 12) {
                             return d.enter_time.substr(12) + '<span class="color-desc"> ( 耗时 ' + d.outer_time + ' )</span>';
                         } else {
-                            return '<span class="color-desc">未执行</span>'
+                            return '<span class="color-desc">任务未执行</span>'
                         }
                     }
                 },
-                {field: 'attempts', title: '执行次数', minWidth: 80, align: 'center', sort: true, templet: "<div>{{d.attempts||0}}</div>"},
-                {field: 'create_at', title: '创建时间', minWidth: 170, align: 'center'},
-                {toolbar: '#toolbar', title: '操作面板', align: 'left', fixed: 'right', minWidth: 270}
+                {field: 'attempts', title: '执行次数', width: 95, align: 'center', sort: true, templet: "<div>{{d.attempts||0}}</div>"},
+                {field: 'exec_desc', title: '执行结果', minWidth: 180},
+                {field: 'create_at', title: '创建时间', minWidth: 170},
+                {toolbar: '#toolbar', title: '操作面板', align: 'left', fixed: 'right', minWidth: 225}
             ]]
         });
     });

app/admin/view/user/form.html

@@ -33,7 +33,7 @@
             </div>
         </fieldset>
 
-        {if !empty($authorizes) || !empty($bases)}
+        {if !empty($bases) || !empty($authorizes)}
         <fieldset>
             <legend><b class="layui-badge think-bg-violet">用户权限</b></legend>
             {if !empty($bases)}
@@ -53,11 +53,11 @@
             <div class="layui-form-item">
                 <span class="color-green font-w7">访问权限</span>
                 <span class="color-desc margin-left-5">User Permission</span>
-                <div class="layui-textarea" style="min-height:50px">
+                <div class="layui-textarea" style="min-height:42px;line-height:28px">
                     {if isset($vo.username) and $vo.username eq $superName}
                     <span class="color-desc">超级用户不需要配置权限</span>
                     {else}{foreach $authorizes as $authorize}
-                    <label class="think-checkbox layui-unselect">
+                    <label class="think-checkbox layui-unselect margin-top-5">
                         {if in_array($authorize.id, $vo.authorize)}
                         <input type="checkbox" checked name="authorize[]" value="{$authorize.id}" lay-ignore>{$authorize.title}
                         {else}

app/admin/view/user/index.html

@@ -55,7 +55,7 @@
                 {field: 'login_at', title: '最后登录', sort: true, align: 'center', minWidth: 170},
                 {field: 'create_at', title: '创建时间', align: 'center', minWidth: 170, sort: true},
                 {field: 'status', title: '权限状态', align: 'center', minWidth: 110, fixed: 'right', templet: '#StatusSwitchTpl'},
-                {toolbar: '#toolbar', title: '操作', align: 'center', minWidth: 160, fixed: 'right'}
+                {toolbar: '#toolbar', title: '操作面板', align: 'center', minWidth: 160, fixed: 'right'}
             ]]
         });
 

public/static/admin.js

@@ -361,7 +361,9 @@ $(function () {
                 }).trigger('resize');
                 /*! Mini 菜单模式时TIPS文字显示 */
                 $('[data-target-tips]').mouseenter(function () {
-                    if ($menu.hasClass(miniClass)) $(this).attr('index', layer.tips(this.dataset.targetTips || '', this));
+                    if ($menu.hasClass(miniClass)) {
+                        $(this).attr('index', layer.tips(this.dataset.targetTips || '', this, {time: 0}));
+                    }
                 }).mouseleave(function () {
                     layer.close($(this).attr('index'));
                 });
@@ -559,10 +561,12 @@ $(function () {
 
     /*! 全局文件上传入口 */
     $.fn.uploadFile = function (callable) {
-        if (this.data('inited')) return false;
-        var that = this, mult = '|one|btn|'.indexOf(this.data('file') || 'one') ? 0 : 1;
-        this.data('inited', true).data('multiple', mult), require(['upload'], function (apply) {
-            apply.call(this, that, callable);
+        return this.each(function () {
+            if ($(this).data('inited')) return false;
+            var that = $(this), mult = '|one|btn|'.indexOf(that.data('file') || 'one') ? 0 : 1;
+            that.data('inited', true).data('multiple', mult), require(['upload'], function (apply) {
+                apply.call(this, that, callable);
+            });
         });
     };
 
@@ -592,7 +596,7 @@ $(function () {
 
             function showImageContainer(srcs) {
                 $(srcs).each(function (idx, src, $image) {
-                    $image = $('<div class="uploadimage uploadimagemtl transition"><a class="layui-icon margin-right-5">&#xe602;</a><a class="layui-icon margin-right-5">&#x1006;</a><a class="layui-icon margin-right-5">&#xe603;</a></div>');
+                    $image = $('<div class="uploadimage uploadimagemtl transition"><a class="layui-icon">&#xe602;</a><a class="layui-icon">&#x1006;</a><a class="layui-icon">&#xe603;</a></div>');
                     $image.attr('data-tips-image', encodeURI(src)).css('backgroundImage', 'url(' + encodeURI(src) + ')').on('click', 'a', function (event, index, prevs, $item) {
                         event.stopPropagation(), $item = $(this).parent(), index = $(this).index(), prevs = $bt.prevAll('div.uploadimage').length;
                         if (index === 0 && $item.index() !== prevs) $item.next().after($item);
@@ -864,6 +868,18 @@ $(function () {
     onEvent('click', '[data-tips-image]', function () {
         $.previewImage(this.dataset.tipsImage || this.dataset.lazySrc || this.src, this.dataset.with);
     });
+    /*! 注册 data-tips-image Hover 事件 */
+    onEvent('mouseenter', '[data-tips-image][data-tips-hover]', function () {
+        var img = new Image(), that = this;
+        img.referrerPolicy = 'no-referrer', img.style.maxWidth = '260px', img.style.maxHeight = '260px';
+        img.src = this.dataset.tipsImage || this.dataset.lazySrc || this.src, img.onload = function () {
+            $(that).attr('index', layer.tips(img.outerHTML, that, {time: 0, skin: 'layui-layer-image', scrollbar: false, anim: 5, isOutAnim: false}));
+        }
+        $(this).off('mouseleave').on('mouseleave', function () {
+            layer.close($(this).attr('index'));
+        });
+    })
+
     $.previewImage = function (src, area) {
         var img = new Image(), defer = $.Deferred(), load = $.msg.loading();
         img.style.background = '#FFFFFF', img.referrerPolicy = 'no-referrer';

public/static/theme/css/console.custom.less

@@ -106,174 +106,6 @@
   }
 }
 
-.pull- {
-  &left {
-    float: left !important
-  }
-
-  &right {
-    float: right !important
-  }
-}
-
-.full- {
-  &width {
-    width: 100% !important
-  }
-
-  &height {
-    height: 100% !important
-  }
-}
-
-.color- {
-  &red {
-    color: #e44 !important
-  }
-
-  &blue {
-    color: #29f !important
-  }
-
-  &desc {
-    color: #999 !important
-  }
-
-  &text {
-    color: #333 !important
-  }
-
-  &green {
-    color: #090 !important
-  }
-}
-
-.sub-span- {
-  &red span {
-    color: #e44 !important
-  }
-
-  &blue span {
-    color: #29f !important
-  }
-
-  &desc span {
-    color: #999 !important
-  }
-
-  &text span {
-    color: #333 !important
-  }
-
-  &green span {
-    color: #090 !important
-  }
-}
-
-.sub-strong- {
-  &s10 b {
-    font-size: 10px;
-  }
-
-  &s12 b {
-    font-size: 12px;
-  }
-
-  &s14 b {
-    font-size: 14px;
-  }
-
-  &red b {
-    color: #ec494e !important
-  }
-
-  &blue b {
-    color: #2494f2 !important
-  }
-
-  &desc b {
-    color: #999 !important
-  }
-
-  &text b {
-    color: #333 !important
-  }
-
-  &green b {
-    color: #090 !important
-  }
-}
-
-.text- {
-  &top {
-    vertical-align: top !important
-  }
-
-  &left {
-    text-align: left !important
-  }
-
-  &right {
-    text-align: right !important
-  }
-
-  &center {
-    text-align: center !important
-  }
-
-  &middle {
-    vertical-align: middle !important
-  }
-
-  &bottom {
-    vertical-align: bottom !important
-  }
-}
-
-.think-bg- {
-  &white {
-    background: white !important
-  }
-
-  &blue {
-    background: linear-gradient(-125deg, #57bdbf, #2f9de2) !important
-  }
-
-  &orig {
-    background: linear-gradient(-141deg, #ecca1b, #f39526) !important
-  }
-
-  &red {
-    background: linear-gradient(-125deg, #ff7d7d, #fb2c95) !important
-  }
-
-  &gray {
-    background: linear-gradient(-113deg, #EEEEEE, #EFEFEF) !important
-  }
-
-  &violet {
-    background: linear-gradient(-113deg, #c543d8, #925cc3) !important
-  }
-}
-
-/* 分隔线条 */
-.hr-line- {
-  &dashed {
-    color: #fff;
-    height: 1px;
-    margin: 15px 0;
-    background-color: #fff;
-    border-top: 1px dashed #e7eaec
-  }
-
-  &solid {
-    margin-top: 15px;
-    margin-bottom: 15px;
-    border-bottom: 1px solid #e7eaec;
-    background-color: rgba(0, 0, 0, 0)
-  }
-}
-
 .input-right-icon {
   top: 1px;
   right: 1px;
@@ -292,6 +124,17 @@
   }
 }
 
+[data-tips-image] {
+  cursor: zoom-in !important
+}
+
+[data-lazy-src] {
+  overflow: hidden;
+  position: relative;
+  background-size: cover;
+  background-position: center center;
+}
+
 /** 加载进度 */
 .pace-inactive {
   display: none
@@ -338,14 +181,15 @@
   margin-right: 8px;
 
   a {
-    color: #fff;
+    float: right;
+    color: #EEE;
     width: 20px;
     height: 20px;
-    float: right;
+    margin: 4px 4px 0 0;
     display: none;
     text-align: center;
-    line-height: 22px;
-    background: rgba(0, 0, 0, .5)
+    line-height: 20px;
+    background: rgba(0, 0, 0, 0.6);
   }
 
   &:hover a {
@@ -353,21 +197,36 @@
     display: inline-block;
 
     &:hover {
-      color: #fff;
+      color: #FFF;
       text-decoration: none
     }
   }
 }
 
-[data-tips-image] {
-  cursor: zoom-in !important
+.upload-image-smbox,
+.upload-image-mdbox,
+.upload-image-lgbox {
+  a {
+    width: 30px;
+    height: 30px;
+    margin: 1px 1px 0 0;
+    line-height: 30px;
+  }
 }
 
-[data-lazy-src] {
-  overflow: hidden;
-  position: relative;
-  background-size: cover;
-  background-position: center center;
+.upload-image-smbox .uploadimage {
+  width: 120px;
+  height: 120px;
+}
+
+.upload-image-mdbox .uploadimage {
+  width: 180px;
+  height: 180px;
+}
+
+.upload-image-lgbox .uploadimage {
+  width: 260px;
+  height: 260px;
 }
 
 .portal-block-container {
@@ -477,59 +336,171 @@
   }
 }
 
-.border {
-  &-0 {
-    border: 0 !important
+/* 分隔线条 */
+.hr-line- {
+  &dashed {
+    color: #fff;
+    height: 1px;
+    margin: 15px 0;
+    background-color: #fff;
+    border-top: 1px dashed #e7eaec
   }
 
-  &-line {
-    border: 1px solid @BoxBorderColor;
+  &solid {
+    margin-top: 15px;
+    margin-bottom: 15px;
+    border-bottom: 1px solid #e7eaec;
+    background-color: rgba(0, 0, 0, 0)
   }
+}
 
-  &-bottom-line {
-    border-bottom: 1px solid @BoxBorderColor;
+.pull- {
+  &left {
+    float: left !important
   }
 
-  &-top-0 {
-    border-top: 0 !important;
+  &right {
+    float: right !important
   }
+}
 
-  &-left-0 {
-    border-left: 0 !important;
+.full- {
+  &width {
+    width: 100% !important
   }
 
-  &-right-0 {
-    border-right: 0 !important;
+  &height {
+    height: 100% !important
   }
+}
 
-  &-bottom-0 {
-    border-bottom: 0 !important;
+.color- {
+  &red {
+    color: #e44 !important
   }
 
-  &-radius {
-    border-radius: 50% !important;
+  &blue {
+    color: #29f !important
+  }
 
-    &-0 {
-      border-radius: 0 !important
-    }
+  &desc {
+    color: #999 !important
+  }
 
-    &-5 {
-      border-radius: 5px !important;
-    }
+  &text {
+    color: #333 !important
+  }
 
-    &-6 {
-      border-radius: 6px !important;
-    }
+  &green {
+    color: #090 !important
+  }
+}
 
-    &-left-0 {
-      border-top-left-radius: 0 !important;
-      border-bottom-left-radius: 0 !important
-    }
+.sub-span- {
+  &red span {
+    color: #e44 !important
+  }
 
-    &-right-0 {
-      border-top-right-radius: 0 !important;
-      border-bottom-right-radius: 0 !important
-    }
+  &blue span {
+    color: #29f !important
+  }
+
+  &desc span {
+    color: #999 !important
+  }
+
+  &text span {
+    color: #333 !important
+  }
+
+  &green span {
+    color: #090 !important
+  }
+}
+
+.sub-strong- {
+  &s10 b {
+    font-size: 10px;
+  }
+
+  &s12 b {
+    font-size: 12px;
+  }
+
+  &s14 b {
+    font-size: 14px;
+  }
+
+  &red b {
+    color: #ec494e !important
+  }
+
+  &blue b {
+    color: #2494f2 !important
+  }
+
+  &desc b {
+    color: #999 !important
+  }
+
+  &text b {
+    color: #333 !important
+  }
+
+  &green b {
+    color: #090 !important
+  }
+}
+
+.think-bg- {
+  &white {
+    background: white !important
+  }
+
+  &blue {
+    background: linear-gradient(-125deg, #57bdbf, #2f9de2) !important
+  }
+
+  &orig {
+    background: linear-gradient(-141deg, #ecca1b, #f39526) !important
+  }
+
+  &red {
+    background: linear-gradient(-125deg, #ff7d7d, #fb2c95) !important
+  }
+
+  &gray {
+    background: linear-gradient(-113deg, #EEEEEE, #EFEFEF) !important
+  }
+
+  &violet {
+    background: linear-gradient(-113deg, #c543d8, #925cc3) !important
+  }
+}
+
+.text- {
+  &top {
+    vertical-align: top !important
+  }
+
+  &left {
+    text-align: left !important
+  }
+
+  &right {
+    text-align: right !important
+  }
+
+  &center {
+    text-align: center !important
+  }
+
+  &middle {
+    vertical-align: middle !important
+  }
+
+  &bottom {
+    vertical-align: bottom !important
   }
 }
 
@@ -615,495 +586,550 @@
   }
 }
 
-.padding {
+.border {
   &-0 {
-    padding: 0 !important
+    border: 0 !important
+  }
+
+  &-line {
+    border: 1px solid @BoxBorderColor;
+  }
+
+  &-bottom-line {
+    border-bottom: 1px solid @BoxBorderColor;
+  }
+
+  &-top-0 {
+    border-top: 0 !important;
+  }
+
+  &-left-0 {
+    border-left: 0 !important;
+  }
+
+  &-right-0 {
+    border-right: 0 !important;
+  }
+
+  &-bottom-0 {
+    border-bottom: 0 !important;
+  }
+
+  &-radius {
+    border-radius: 50% !important;
+
+    &-0 {
+      border-radius: 0 !important
+    }
+
+    &-5 {
+      border-radius: 5px !important;
+    }
+
+    &-6 {
+      border-radius: 6px !important;
+    }
+
+    &-left-0 {
+      border-top-left-radius: 0 !important;
+      border-bottom-left-radius: 0 !important
+    }
+
+    &-right-0 {
+      border-top-right-radius: 0 !important;
+      border-bottom-right-radius: 0 !important
+    }
+  }
+}
+
+.margin {
+  &-0 {
+    margin: 0 !important
   }
 
   &-5 {
-    padding: 5px !important
+    margin: 5px !important
   }
 
   &-10 {
-    padding: 10px !important
+    margin: 10px !important
   }
 
   &-15 {
-    padding: 15px !important
+    margin: 15px !important
   }
 
   &-20 {
-    padding: 20px !important
+    margin: 20px !important
   }
 
   &-25 {
-    padding: 25px !important
+    margin: 25px !important
   }
 
   &-30 {
-    padding: 30px !important
+    margin: 30px !important
   }
 
   &-40 {
-    padding: 40px !important
+    margin: 40px !important
   }
 
   &-col {
     &-0 {
-      padding-left: 0 !important;
-      padding-right: 0 !important;
+      margin-left: 0 !important;
+      margin-right: 0 !important;
     }
 
     &-5 {
-      padding-left: 5px !important;
-      padding-right: 5px !important;
+      margin-left: 5px !important;
+      margin-right: 5px !important;
     }
 
     &-10 {
-      padding-left: 10px !important;
-      padding-right: 10px !important;
+      margin-left: 10px !important;
+      margin-right: 10px !important;
     }
 
     &-15 {
-      padding-left: 15px !important;
-      padding-right: 15px !important;
+      margin-left: 15px !important;
+      margin-right: 15px !important;
     }
 
     &-20 {
-      padding-left: 20px !important;
-      padding-right: 20px !important;
+      margin-left: 20px !important;
+      margin-right: 20px !important;
     }
 
     &-25 {
-      padding-left: 25px !important;
-      padding-right: 25px !important;
+      margin-left: 25px !important;
+      margin-right: 25px !important;
     }
 
     &-30 {
-      padding-left: 30px !important;
-      padding-right: 30px !important;
+      margin-left: 30px !important;
+      margin-right: 30px !important;
     }
 
     &-40 {
-      padding-left: 40px !important;
-      padding-right: 40px !important;
+      margin-left: 40px !important;
+      margin-right: 40px !important;
     }
   }
 
   &-row {
     &-0 {
-      padding-top: 0 !important;
-      padding-bottom: 0 !important;
+      margin-top: 0 !important;
+      margin-bottom: 0 !important;
     }
 
     &-5 {
-      padding-top: 5px !important;
-      padding-bottom: 5px !important;
+      margin-top: 5px !important;
+      margin-bottom: 5px !important;
     }
 
     &-10 {
-      padding-top: 10px !important;
-      padding-bottom: 10px !important;
+      margin-top: 10px !important;
+      margin-bottom: 10px !important;
     }
 
     &-15 {
-      padding-top: 15px !important;
-      padding-bottom: 15px !important;
+      margin-top: 15px !important;
+      margin-bottom: 15px !important;
     }
 
     &-20 {
-      padding-top: 20px !important;
-      padding-bottom: 20px !important;
+      margin-top: 20px !important;
+      margin-bottom: 20px !important;
     }
 
     &-25 {
-      padding-top: 25px !important;
-      padding-bottom: 25px !important;
+      margin-top: 25px !important;
+      margin-bottom: 25px !important;
     }
 
     &-30 {
-      padding-top: 30px !important;
-      padding-bottom: 30px !important;
+      margin-top: 30px !important;
+      margin-bottom: 30px !important;
     }
 
     &-40 {
-      padding-top: 40px !important;
-      padding-bottom: 40px !important;
+      margin-top: 40px !important;
+      margin-bottom: 40px !important;
     }
   }
 
   &-top {
     &-0 {
-      padding-top: 0 !important
+      margin-top: 0 !important
     }
 
     &-5 {
-      padding-top: 5px !important
+      margin-top: 5px !important
     }
 
     &-10 {
-      padding-top: 10px !important
+      margin-top: 10px !important
     }
 
     &-15 {
-      padding-top: 15px !important
+      margin-top: 15px !important
     }
 
     &-20 {
-      padding-top: 20px !important
+      margin-top: 20px !important
+    }
+
+    &-25 {
+      margin-top: 25px !important
     }
 
     &-30 {
-      padding-top: 30px !important
+      margin-top: 30px !important
     }
 
     &-40 {
-      padding-top: 40px !important
+      margin-top: 40px !important;
     }
   }
 
   &-left {
     &-0 {
-      padding-left: 0 !important
+      margin-left: 0 !important
     }
 
     &-5 {
-      padding-left: 5px !important
+      margin-left: 5px !important
     }
 
     &-10 {
-      padding-left: 10px !important
+      margin-left: 10px !important
     }
 
     &-15 {
-      padding-left: 15px !important
+      margin-left: 15px !important
     }
 
     &-20 {
-      padding-left: 20px !important
+      margin-left: 20px !important
+    }
+
+    &-25 {
+      margin-left: 25px !important
     }
 
     &-30 {
-      padding-left: 30px !important
+      margin-left: 30px !important
     }
 
     &-40 {
-      padding-left: 40px !important
+      margin-left: 40px !important
     }
   }
 
   &-right {
     &-0 {
-      padding-right: 0 !important
+      margin-right: 0 !important
     }
 
     &-5 {
-      padding-right: 5px !important
+      margin-right: 5px !important
     }
 
     &-10 {
-      padding-right: 10px !important
+      margin-right: 10px !important
     }
 
     &-15 {
-      padding-right: 15px !important
+      margin-right: 15px !important
     }
 
     &-20 {
-      padding-right: 20px !important
+      margin-right: 20px !important
+    }
+
+    &-25 {
+      margin-right: 25px !important
     }
 
     &-30 {
-      padding-right: 30px !important
+      margin-right: 30px !important
     }
 
     &-40 {
-      padding-right: 40px !important
+      margin-right: 40px !important
     }
   }
 
   &-bottom {
     &-0 {
-      padding-bottom: 0 !important
+      margin-bottom: 0 !important
     }
 
     &-5 {
-      padding-bottom: 5px !important
+      margin-bottom: 5px !important
     }
 
     &-10 {
-      padding-bottom: 10px !important
+      margin-bottom: 10px !important
     }
 
     &-15 {
-      padding-bottom: 15px !important
+      margin-bottom: 15px !important
     }
 
     &-20 {
-      padding-bottom: 20px !important
+      margin-bottom: 20px !important
+    }
+
+    &-25 {
+      margin-bottom: 25px !important
     }
 
     &-30 {
-      padding-bottom: 30px !important
+      margin-bottom: 30px !important
     }
 
     &-40 {
-      padding-bottom: 40px !important
+      margin-bottom: 40px !important
     }
   }
 }
 
-
-.margin {
+.padding {
   &-0 {
-    margin: 0 !important
+    padding: 0 !important
   }
 
   &-5 {
-    margin: 5px !important
+    padding: 5px !important
   }
 
   &-10 {
-    margin: 10px !important
+    padding: 10px !important
   }
 
   &-15 {
-    margin: 15px !important
+    padding: 15px !important
   }
 
   &-20 {
-    margin: 20px !important
+    padding: 20px !important
   }
 
   &-25 {
-    margin: 25px !important
+    padding: 25px !important
   }
 
   &-30 {
-    margin: 30px !important
+    padding: 30px !important
   }
 
   &-40 {
-    margin: 40px !important
+    padding: 40px !important
   }
 
   &-col {
     &-0 {
-      margin-left: 0 !important;
-      margin-right: 0 !important;
+      padding-left: 0 !important;
+      padding-right: 0 !important;
     }
 
     &-5 {
-      margin-left: 5px !important;
-      margin-right: 5px !important;
+      padding-left: 5px !important;
+      padding-right: 5px !important;
     }
 
     &-10 {
-      margin-left: 10px !important;
-      margin-right: 10px !important;
+      padding-left: 10px !important;
+      padding-right: 10px !important;
     }
 
     &-15 {
-      margin-left: 15px !important;
-      margin-right: 15px !important;
+      padding-left: 15px !important;
+      padding-right: 15px !important;
     }
 
     &-20 {
-      margin-left: 20px !important;
-      margin-right: 20px !important;
+      padding-left: 20px !important;
+      padding-right: 20px !important;
     }
 
     &-25 {
-      margin-left: 25px !important;
-      margin-right: 25px !important;
+      padding-left: 25px !important;
+      padding-right: 25px !important;
     }
 
     &-30 {
-      margin-left: 30px !important;
-      margin-right: 30px !important;
+      padding-left: 30px !important;
+      padding-right: 30px !important;
     }
 
     &-40 {
-      margin-left: 40px !important;
-      margin-right: 40px !important;
+      padding-left: 40px !important;
+      padding-right: 40px !important;
     }
   }
 
   &-row {
     &-0 {
-      margin-top: 0 !important;
-      margin-bottom: 0 !important;
+      padding-top: 0 !important;
+      padding-bottom: 0 !important;
     }
 
     &-5 {
-      margin-top: 5px !important;
-      margin-bottom: 5px !important;
+      padding-top: 5px !important;
+      padding-bottom: 5px !important;
     }
 
     &-10 {
-      margin-top: 10px !important;
-      margin-bottom: 10px !important;
+      padding-top: 10px !important;
+      padding-bottom: 10px !important;
     }
 
     &-15 {
-      margin-top: 15px !important;
-      margin-bottom: 15px !important;
+      padding-top: 15px !important;
+      padding-bottom: 15px !important;
     }
 
     &-20 {
-      margin-top: 20px !important;
-      margin-bottom: 20px !important;
+      padding-top: 20px !important;
+      padding-bottom: 20px !important;
     }
 
     &-25 {
-      margin-top: 25px !important;
-      margin-bottom: 25px !important;
+      padding-top: 25px !important;
+      padding-bottom: 25px !important;
     }
 
     &-30 {
-      margin-top: 30px !important;
-      margin-bottom: 30px !important;
+      padding-top: 30px !important;
+      padding-bottom: 30px !important;
     }
 
     &-40 {
-      margin-top: 40px !important;
-      margin-bottom: 40px !important;
+      padding-top: 40px !important;
+      padding-bottom: 40px !important;
     }
   }
 
   &-top {
     &-0 {
-      margin-top: 0 !important
+      padding-top: 0 !important
     }
 
     &-5 {
-      margin-top: 5px !important
+      padding-top: 5px !important
     }
 
     &-10 {
-      margin-top: 10px !important
+      padding-top: 10px !important
     }
 
     &-15 {
-      margin-top: 15px !important
+      padding-top: 15px !important
     }
 
     &-20 {
-      margin-top: 20px !important
-    }
-
-    &-25 {
-      margin-top: 25px !important
+      padding-top: 20px !important
     }
 
     &-30 {
-      margin-top: 30px !important
+      padding-top: 30px !important
     }
 
     &-40 {
-      margin-top: 40px !important;
+      padding-top: 40px !important
     }
   }
 
   &-left {
     &-0 {
-      margin-left: 0 !important
+      padding-left: 0 !important
     }
 
     &-5 {
-      margin-left: 5px !important
+      padding-left: 5px !important
     }
 
     &-10 {
-      margin-left: 10px !important
+      padding-left: 10px !important
     }
 
     &-15 {
-      margin-left: 15px !important
+      padding-left: 15px !important
     }
 
     &-20 {
-      margin-left: 20px !important
-    }
-
-    &-25 {
-      margin-left: 25px !important
+      padding-left: 20px !important
     }
 
     &-30 {
-      margin-left: 30px !important
+      padding-left: 30px !important
     }
 
     &-40 {
-      margin-left: 40px !important
+      padding-left: 40px !important
     }
   }
 
   &-right {
     &-0 {
-      margin-right: 0 !important
+      padding-right: 0 !important
     }
 
     &-5 {
-      margin-right: 5px !important
+      padding-right: 5px !important
     }
 
     &-10 {
-      margin-right: 10px !important
+      padding-right: 10px !important
     }
 
     &-15 {
-      margin-right: 15px !important
+      padding-right: 15px !important
     }
 
     &-20 {
-      margin-right: 20px !important
-    }
-
-    &-25 {
-      margin-right: 25px !important
+      padding-right: 20px !important
     }
 
     &-30 {
-      margin-right: 30px !important
+      padding-right: 30px !important
     }
 
     &-40 {
-      margin-right: 40px !important
+      padding-right: 40px !important
     }
   }
 
   &-bottom {
     &-0 {
-      margin-bottom: 0 !important
+      padding-bottom: 0 !important
     }
 
     &-5 {
-      margin-bottom: 5px !important
+      padding-bottom: 5px !important
     }
 
     &-10 {
-      margin-bottom: 10px !important
+      padding-bottom: 10px !important
     }
 
     &-15 {
-      margin-bottom: 15px !important
+      padding-bottom: 15px !important
     }
 
     &-20 {
-      margin-bottom: 20px !important
-    }
-
-    &-25 {
-      margin-bottom: 25px !important
+      padding-bottom: 20px !important
     }
 
     &-30 {
-      margin-bottom: 30px !important
+      padding-bottom: 30px !important
     }
 
     &-40 {
-      margin-bottom: 40px !important
+      padding-bottom: 40px !important
     }
   }
-}
+}

public/static/theme/css/console.display.less

@@ -1,5 +1,4 @@
 @charset "UTF-8";
-@charset "UTF-8";
 @import "console.config.less";
 
 // +----------------------------------------------------------------------
@@ -72,6 +71,22 @@ fieldset {
   }
 }
 
+.layui-layer-tips {
+  &.layui-layer-image .layui-layer-content {
+    width: auto !important;
+    padding: 4px !important;
+
+    img {
+      z-index: 2;
+      position: relative;
+    }
+
+    i.layui-layer-TipsR {
+      z-index: 1;
+    }
+  }
+}
+
 .layui-tab, .layui-card {
   border-radius: @BoxBorderRadius;
 }
@@ -237,7 +252,6 @@ fieldset {
   }
 }
 
-
 /* 表单验证异常提示 */
 .label-required {
   &-prev:before {