切换新版layui；增加表格多模板机制；增加local操作方法；增加页面记忆操作方法；删除多余代码；

extend/base/admin/view/layout/default.html

@@ -17,6 +17,7 @@
             IS_SUPER_ADMIN: "{$isSuperAdmin|default='false'}",
             VERSION: "{$version|default='1.0.0'}",
             CSRF_TOKEN: "{:token()}",
+            PAGE_KEY_NAME:'{$pageKeyName|default=$Request.url}'
         };
 
         var PATH_CONFIG = {

extend/base/common/controller/AdminControllerBase.php

@@ -19,6 +19,8 @@ class AdminControllerBase extends BaseController
 {
     use \app\common\traits\JumpTrait;
 
+    protected $pageKeyName = null;
+
     /**
      * 当前模型.
      * @Model
@@ -108,6 +110,10 @@ class AdminControllerBase extends BaseController
      */
     protected function initialize()
     {
+        if(empty($this->pageKeyName)){
+            $this->pageKeyName = $this->request->controller().'_'. $this->request->action();
+        }
+
         parent::initialize();
         $this->layout && $this->app->view->engine()->layout($this->layout);
         $this->isDemo = Env::get('adminsystem.is_demo', false);
@@ -364,18 +370,12 @@ class AdminControllerBase extends BaseController
             'autoloadJs' => $autoloadJs,
             'isSuperAdmin' => $isSuperAdmin,
             'version' => env('app_debug') ? time() : sysconfig('site', 'site_version'),
+            'pageKeyName'=>$this->pageKeyName
         ];
 
         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);
-        }
     }
 
     /**

public/static/admin/css/public.css

@@ -1,8 +1,8 @@
-@import url("../../plugs/layui-v2.8.17/css/layui.css");
+@charset "UTF-8";
+@import url("../../plugs/layui-v2.9.18/css/layui.css");
 @import url("../../plugs/font-awesome-4.7.0/css/font-awesome.min.css");
 @import url("../css/iconfont.css");
-@import url('../../plugs/jq-module/city-picker/css/city-picker.css');
+@import url("../../plugs/jq-module/city-picker/css/city-picker.css");
-
 html,
 body {
   height: 100%;
@@ -59,7 +59,6 @@ body {
   width: calc(100% - 62px);
 }
 
-
 .easy-bg-white {
   background-color: #ffffff;
   height: auto;
@@ -105,7 +104,7 @@ body {
 
 /**必填红点 */
 .layuimini-form > .layui-form-item .required:after {
-    content: '*';
+  content: "*";
   color: red;
   position: absolute;
   margin-left: 4px;
@@ -164,6 +163,7 @@ body {
 
 .layuimini-upload-show a img {
   height: 80px;
+  -o-object-fit: cover;
      object-fit: cover;
 }
 
@@ -207,7 +207,7 @@ body {
   color: #ffffff;
   border-radius: 3px;
   size: 8px !important;
-    padding: 2px
+  padding: 2px;
 }
 
 .layuimini-table-url:hover {
@@ -215,19 +215,18 @@ body {
   color: #ffffff;
   border-radius: 3px;
   size: 8px !important;
-    padding: 2px
+  padding: 2px;
 }
 
 /**后台权限隐藏*/
 /*[auth] { display: none; }*/
-
 .layui-form-label {
   width: 100px;
 }
 
 .layui-input-block {
   margin-left: 130px;
-    min-height: 36px
+  min-height: 36px;
 }
 
 /**
@@ -306,7 +305,6 @@ table样式
   padding: 0;
 }
 
-
 /**
 按钮
  */
@@ -404,8 +402,6 @@ table样式
 }
 
 .layui-layer-easy .layui-layer-moves {
-    -webkit-box-sizing: content-box;
-    -moz-box-sizing: content-box;
   box-sizing: content-box;
 }
 
@@ -504,13 +500,11 @@ table样式
     line-height: 24px;
   }
 }
-
 @media screen and (max-width: 768px) {
   .easyadmin-export-btn {
     display: none;
   }
 }
-
 /**
 资源加载锁
  */
@@ -526,10 +520,6 @@ table样式
   white-space: nowrap;
 }
 
-
-
-
-
 .search-hide-item {
   display: none;
 }
@@ -544,13 +534,12 @@ table样式
 }
 
 /* 重写地区选择器的样式 */
-
 .city-picker-span {
   height: 38px;
   border-width: 1px;
   border-style: solid;
   background-color: #fff;
-    color: rgba(0, 0, 0, .85);
+  color: rgba(0, 0, 0, 0.85);
   border-radius: 2px;
   border-color: #eee;
 }
@@ -568,16 +557,46 @@ table样式
   border-color: #d2d2d2 !important;
 }
 
-[data-toggle="copy-text"].copy-rendered {
+[data-toggle=copy-text].copy-rendered {
   cursor: pointer;
 }
 
+.table-tpl-container {
+  position: absolute;
+  z-index: 9999999999;
+  right: 0;
+  white-space: nowrap;
+  border: 1px solid #d2d2d2;
+  text-align: left;
+  overflow-y: auto;
+  background-color: #fff;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
+}
+
+.ul-nav-block .item.current {
+  background-color: rgb(22, 183, 119);
+}
+
+.ul-nav-block .item:hover {
+  background-color: rgba(22, 183, 119, 0.7);
+}
+
+.ul-nav-block .item .item-icon {
+  margin-right: 8;
+}
+
+.ul-nav-block .item {
+  padding: 8px 18px;
+}
+
+.ul-nav-block {
+  border-radius: 0;
+}
 
 @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;
@@ -585,30 +604,23 @@ table样式
     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);
   }
-
   .layui-table-tool-temp {
     padding-right: unset;
     padding-bottom: 40px;
-        
   }
-
   .layuimini-container .layui-table-tool-self {
     right: 0;
     bottom: 10px;
     top: unset;
   }
 }
-
 .w-e-text-container,
 .w-e-bar {
   border: 1px solid #d2d2d2;
-
 }

public/static/admin/css/public.scss

@@ -0,0 +1,649 @@
+@import url("../../plugs/layui-v2.9.18/css/layui.css");
+@import url("../../plugs/font-awesome-4.7.0/css/font-awesome.min.css");
+@import url("../css/iconfont.css");
+@import url('../../plugs/jq-module/city-picker/css/city-picker.css');
+
+html,
+body {
+    height: 100%;
+    background: #f2f2f2;
+}
+
+.layuimini-container {
+    min-height: 250px;
+    padding: 15px;
+    margin-right: auto;
+    margin-left: auto;
+    padding-left: 15px;
+    padding-right: 15px;
+}
+
+.layuimini-main {
+    position: relative;
+    padding: 15px 15px;
+    background-color: #ffffff;
+    border: 1px solid #f2f2f2;
+    border-radius: 5px;
+}
+
+.text-center {
+    text-align: center;
+}
+
+.layuimini-form {
+    margin-top: 10px;
+}
+
+.layuimini-form .layui-form-item {
+    position: relative;
+    padding: 0 60px 0 0;
+    line-height: 24px;
+}
+
+.layuimini-form.multiple-columns .hr-line {
+    width: 100%;
+}
+
+.layuimini-form.multiple-columns .hr-line+.layui-form-item {
+    width: 100%;
+}
+
+.layuimini-form.multiple-columns .layui-form-item {
+    display: inline-block;
+    width: calc(50% - 62px);
+    flex-shrink: 1;
+}
+
+.layuimini-form.multiple-columns .layui-form-item.full-line {
+    display: block;
+    width: calc(100% - 62px);
+}
+
+
+.easy-bg-white {
+    background-color: #ffffff;
+    height: auto;
+}
+
+.hr-line {
+    color: #fff;
+    height: 1px;
+    margin: 30px 0;
+    background-color: #fff;
+    border-top: 1px dashed #e7eaec;
+}
+
+/**重写layui表格自适应*/
+.layuimini-container .layui-table-cell {
+    max-width: 100%;
+}
+
+/**数据表格-搜索表单样式*/
+.layuimini-container .table-search-fieldset {
+    margin: 0;
+    border: 1px solid #e6e6e6;
+    padding: 10px 20px 5px 20px;
+    color: #6b6b6b;
+}
+
+.layuimini-container .table-search-fieldset input::-webkit-input-placeholder {
+    color: #a9a9a9;
+}
+
+.layuimini-container .table-search-fieldset input:-ms-input-placeholder {
+    color: #a9a9a9;
+}
+
+.layuimini-container .table-search-fieldset input::-ms-input-placeholder {
+    color: #a9a9a9;
+}
+
+/**图标选择器*/
+.layui-iconpicker-body.layui-iconpicker-body-page .hide {
+    display: none;
+}
+
+/**必填红点 */
+.layuimini-form>.layui-form-item .required:after {
+    content: '*';
+    color: red;
+    position: absolute;
+    margin-left: 4px;
+    font-weight: bold;
+    line-height: 1.8em;
+    top: 6px;
+    right: 5px;
+}
+
+/*.layuimini-form>.layui-form-item>.layui-form-label {width:120px !important;}*/
+/*.layuimini-form>.layui-form-item>.layui-input-block {margin-left:150px !important;}*/
+.layuimini-form>.layui-form-item>.layui-input-block tip,
+.layuimini-form>.layui-form-item>.layui-inline tip {
+    display: inline-block;
+    margin-top: 10px;
+    line-height: 15px;
+    font-size: 10px;
+    color: #a29c9c;
+}
+
+/** 按钮背景色 */
+.layuimini-container .layuimini-btn-primary {
+    color: #fff;
+    background-color: #2c3e50;
+}
+
+.layuimini-container .layui-btn-sm i {
+    font-size: 12px !important;
+}
+
+/**文件上传样式*/
+.layuimini-upload {
+    position: relative;
+}
+
+.layuimini-upload .layuimini-upload-btn {
+    display: inline-block;
+    position: absolute;
+    right: 0px;
+    background-color: #fff;
+}
+
+.layuimini-upload-show {
+    margin-top: 10px;
+    margin-bottom: 0;
+}
+
+.layuimini-upload-show li {
+    position: relative;
+    display: inline-block;
+    padding: 5px 0 5px 0;
+    padding-left: 10px;
+    padding-right: 10px;
+    border: 1px solid #e2e2e2;
+}
+
+.layuimini-upload-show a img {
+    height: 80px;
+    object-fit: cover;
+}
+
+.layuimini-upload-show .uploads-delete-tip {
+    position: absolute;
+    right: 10px;
+    font-size: 12px;
+}
+
+.bg-red {
+    background-color: #e74c3c !important;
+}
+
+.color-red {
+    color: #e74c3c !important;
+}
+
+.badge {
+    display: inline-block;
+    min-width: 10px;
+    padding: 3px 7px;
+    font-size: 11px;
+    font-weight: bold;
+    color: #fff;
+    line-height: 1;
+    vertical-align: middle;
+    white-space: nowrap;
+    text-align: center;
+    background-color: #777777;
+    border-radius: 10px;
+}
+
+/**vue隐藏样式*/
+[v-cloak] {
+    display: none;
+}
+
+/**表格url样式*/
+.layuimini-table-url {
+    background-color: #1497f3;
+    color: #ffffff;
+    border-radius: 3px;
+    size: 8px !important;
+    padding: 2px
+}
+
+.layuimini-table-url:hover {
+    background-color: #1497f3;
+    color: #ffffff;
+    border-radius: 3px;
+    size: 8px !important;
+    padding: 2px
+}
+
+/**后台权限隐藏*/
+/*[auth] { display: none; }*/
+
+.layui-form-label {
+    width: 100px;
+}
+
+.layui-input-block {
+    margin-left: 130px;
+    min-height: 36px
+}
+
+/**
+table样式
+ */
+.layuimini-container .layui-laypage .layui-laypage-curr .layui-laypage-em {
+    border-radius: 30px !important;
+    background-color: #1e9fff !important;
+}
+
+.layuimini-container .layui-table-tool {
+    background-color: #ffffff;
+    border-bottom: none !important;
+    padding-bottom: 15px !important;
+}
+
+.layuimini-container .layui-table-view {
+    border: none !important;
+}
+
+.layuimini-container .layui-table-view::after {
+    content: "";
+    display: block;
+    clear: both;
+    height: 0;
+    visibility: hidden;
+}
+
+.layuimini-container .layui-table-box {
+    border-width: 1px;
+    border-style: solid;
+    border-color: #e6e6e6;
+}
+
+.layuimini-container .layui-table-page,
+.layui-table-total {
+    border-width: 0px 0 0;
+}
+
+.layuimini-container .layui-table-box .layui-table-header th {
+    font-weight: bold !important;
+    color: #565656 !important;
+}
+
+/**
+搜索
+ */
+.form-search .layui-btn {
+    height: 32px;
+    line-height: 28px;
+    font-size: 12px;
+    padding: 0 10px;
+}
+
+.form-search .layui-form-label {
+    padding: 0 8px;
+    height: 32px;
+    line-height: 30px;
+}
+
+.form-search .layui-input-inline {
+    width: 170px;
+}
+
+.form-search .layui-input-inline input,
+.form-search .layui-input-inline select {
+    width: 100%;
+    height: 32px;
+    padding: 2px 8px;
+    line-height: 1em;
+    font-size: 12px;
+}
+
+.form-search .layui-form-select dl {
+    top: 31px;
+    padding: 0;
+}
+
+
+/**
+按钮
+ */
+.layuimini-container .layui-btn-success {
+    color: #fff;
+    background-color: #4bb368;
+    border-color: #4bb368;
+}
+
+.layuimini-container .layui-btn-danger {
+    color: #fff;
+    background-color: #f56c6c;
+    border-color: #f56c6c;
+}
+
+.layuimini-container .layui-table-tool .layui-btn+.layui-btn {
+    margin-left: 5px;
+}
+
+.layuimini-container .layui-table-tool .layui-inline[lay-event] {
+    width: 30px;
+    height: 30px;
+    line-height: 30px;
+    padding: 0px;
+}
+
+.layuimini-container .layui-table-tool .layui-inline .layui-icon {
+    font-size: 16px;
+}
+
+.layuimini-container .layui-table-tool-self {
+    right: 0px;
+}
+
+.layuimini-container .layui-table-tool {
+    padding: 10px 0px;
+}
+
+/* 手机端的表格头部操作 */
+.layuimini-container .main-tool {
+    padding: 15px;
+}
+
+/**
+开关
+ */
+.layuimini-container .layui-form-switch {
+    border: 1px solid #f56d6d;
+    background-color: #f56d6d;
+}
+
+.layuimini-container .layui-form-switch em {
+    color: #fff !important;
+}
+
+.layuimini-container .layui-form-switch i {
+    background-color: #ffffff;
+}
+
+.layuimini-container .layui-form-onswitch {
+    border-color: #1f9fff;
+    background-color: #1f9fff;
+}
+
+/**
+下拉选择
+ */
+.layuimini-container .layui-form-select dl dd.layui-this {
+    background-color: #1e9fff !important;
+    color: #fff;
+}
+
+/**
+弹出层样式
+ */
+.layui-layer-easy .layui-layer-title {
+    background: #2c3e50 !important;
+    color: #fff !important;
+    border-bottom: none;
+}
+
+.layui-layer-easy .layui-layer-title~.layui-layer-setwin>a {
+    height: 42px;
+    line-height: 42px;
+    display: inline-block;
+}
+
+.layui-layer-easy.layui-layer-border {
+    border: none !important;
+    box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.3) !important;
+}
+
+.layui-layer-easy.layui-layer-iframe {
+    overflow: visible;
+}
+
+.layui-layer-easy .layui-layer-moves {
+    -webkit-box-sizing: content-box;
+    -moz-box-sizing: content-box;
+    box-sizing: content-box;
+}
+
+.layui-layer-easy .layui-layer-btn {
+    text-align: center !important;
+    padding: 10px !important;
+    background: #ecf0f1;
+    overflow: hidden;
+}
+
+.layui-layer-easy .layui-layer-btn a {
+    background-color: #95a5a6;
+    border-color: #95a5a6;
+    color: #fff !important;
+    height: 31px;
+    margin-top: 0;
+    border: 1px solid transparent;
+}
+
+.layui-layer-easy .layui-layer-btn .layui-layer-btn0 {
+    background-color: #1E9FFF;
+    border-color: #1E9FFF;
+}
+
+.layui-layer-easy .layui-layer-footer {
+    padding: 8px 20px;
+    background-color: #ecf0f1;
+    height: auto;
+    text-align: inherit !important;
+}
+
+.layui-layer-easy .layui-layer-setwin>span {
+    color: #fff;
+}
+
+.layui-layer-easy .layui-layer-setwin>a {
+    background: none !important;
+}
+
+.layui-layer-easy .layui-layer-setwin>a cite {
+    display: none;
+}
+
+.layui-layer-easy .layui-layer-setwin>a:after {
+    content: "\e625";
+    font-family: iconfont;
+    font-style: normal;
+    font-weight: normal;
+    text-decoration: inherit;
+    position: absolute;
+    font-size: 18px;
+    color: #fff;
+    margin: 0;
+    z-index: 1;
+}
+
+.layui-layer-easy .layui-layer-setwin>a:hover {
+    text-decoration: none !important;
+    background: none !important;
+}
+
+.layui-layer-easy .layui-layer-setwin>a:focus {
+    text-decoration: none !important;
+}
+
+.layui-layer-easy .layui-layer-setwin .layui-layer-max::after,
+.layui-layer-easy .layui-layer-setwin .layui-layer-max::before {
+    border-color: #fff;
+}
+
+.layui-layer-easy .layui-layer-setwin .layui-layer-min::before {
+    background-color: #fff;
+}
+
+.layui-layer-content {
+    clear: both;
+}
+
+.layui-layer-easy-msg {
+    min-width: 100px;
+}
+
+.layui-layer-easy-tab .layui-layer-title .layui-this {
+    color: #333;
+}
+
+.layui-layer-easy-tab .layui-layer-content .layui-layer-tabmain {
+    margin: 0;
+    padding: 0;
+}
+
+@media screen and (max-width: 1024px) {
+    .layuimini-form .layui-form-item {
+        position: relative;
+        padding: 0 30px 0 0;
+        line-height: 24px;
+    }
+}
+
+@media screen and (max-width: 768px) {
+    .easyadmin-export-btn {
+        display: none;
+    }
+}
+
+/**
+资源加载锁
+ */
+.easy-load-lock {
+    cursor: not-allowed;
+}
+
+.line-limit-length {
+    width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    background: goldenrod;
+    white-space: nowrap;
+}
+
+
+
+
+
+.search-hide-item {
+    display: none;
+}
+
+.form-item-time-limit .layui-input-inline {
+    display: flex;
+    width: 274px;
+}
+
+.form-item-number-limit .layui-input-inline {
+    display: flex;
+}
+
+/* 重写地区选择器的样式 */
+
+.city-picker-span {
+    height: 38px;
+    border-width: 1px;
+    border-style: solid;
+    background-color: #fff;
+    color: rgba(0, 0, 0, .85);
+    border-radius: 2px;
+    border-color: #eee;
+}
+
+.city-picker-span:hover {
+    border-color: #eee !important;
+}
+
+.city-picker-span>.placeholder {
+    padding-left: 10px;
+}
+
+.city-picker-span.focus,
+.city-picker-span.open {
+    border-color: #d2d2d2 !important;
+}
+
+[data-toggle="copy-text"].copy-rendered {
+    cursor: pointer;
+}
+
+.table-tpl-container {
+    position: absolute;
+    z-index: 9999999999;
+    right: 0;
+    white-space: nowrap;
+    border: 1px solid #d2d2d2;
+    text-align: left;
+    overflow-y: auto;
+    background-color: #fff;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
+
+}
+
+.ul-nav-block .item.current {
+    background-color: rgb(22, 183, 119);
+}
+
+.ul-nav-block .item:hover {
+    background-color: rgb(22, 183, 119, 0.7);
+}
+
+.ul-nav-block .item .item-icon {
+    margin-right: 8;
+}
+
+.ul-nav-block .item {
+    padding: 8px 18px;
+}
+.ul-nav-block{
+    border-radius: 0;
+}
+
+.layui-table-custom{
+
+}
+
+@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);
+    }
+
+    .layui-table-tool-temp {
+        padding-right: unset;
+        padding-bottom: 40px;
+
+    }
+
+    .layuimini-container .layui-table-tool-self {
+        right: 0;
+        bottom: 10px;
+        top: unset;
+    }
+}
+
+.w-e-text-container,
+.w-e-bar {
+    border: 1px solid #d2d2d2;
+
+}

public/static/common/js/app.js

@@ -39,8 +39,27 @@ loading.hide = function (count) {
 
 };
 
+
 const tools = {};
 
+
+// 操作本地缓存，实现set和get
+tools.setLocal = function (key, value) {
+    value = JSON.stringify([value]);
+    return localStorage.setItem(key, value);
+    
+};
+
+tools.getLocal = function (key, defaultValue) {
+    var value = localStorage.getItem(key);
+    
+    if (value) {
+        value = JSON.parse(value)[0];
+        return value;
+    }
+    return defaultValue;
+};
+
 tools.checkMobile = function () {
     var userAgentInfo = navigator.userAgent;
     var mobileAgents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];

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

@@ -1,3 +1,4 @@
+
 (function () {
 
     window.onInitElemStyle = function () {
@@ -313,6 +314,19 @@
                         icon: 'layui-icon-template-1',
                         extend: 'data-table-id="' + options.id + '"'
                     });
+
+                    if (options.layoutDefault === true) {
+                        // 自动判断，手机端默认card，电脑端默认table
+                        if (admin.checkMobile()) {
+                            options.layoutDefault = 'card';
+                        } else {
+                            options.layoutDefault = 'table';
+                        }
+                    }
+
+                    options.layoutDefault = admin.trySetPageSetting('table-layout-default', options.layoutDefault);
+
+
                 }
 
                 if (options.search) {
@@ -328,7 +342,13 @@
                 }
 
 
-
+                var optionBefore = function () { };
+                if (options.before != undefined) {
+                    optionBefore = options.before;
+                }
+                options.before = function (tableIns) {
+                    optionBefore(tableIns);
+                };
 
                 var optionDone = function () { };
                 if (options.done != undefined) {
@@ -336,7 +356,6 @@
                 }
                 options.done = function (res, curr, count) {
                     optionDone(res, curr, count);
-                    console.log(res, curr, count);
 
                     // 监听表格内的复制组件
                     admin.api.copyText('[lay-id=' + options.id + ']');
@@ -718,46 +737,190 @@
                 }
 
                 var tableId = options.id;
-                var elem = options.elem;
-                console.log(tableId);
 
+                var layuiTableElemName = '[lay-table-id="' + tableId + '"]';
+                var elem = options.elem;
 
                 // 初始化参数
-                options.labelList = options.layoutList.map((item) => {
+                options.layoutList = options.layoutList.map((item) => {
                     if (item == 'table') {
                         return {
                             name: 'table',
+                            icon: 'layui-icon layui-icon-table',
                             title: '默认表格',
 
                         };
-                    }
+                    } else if (item == 'card') {
-                    if (item == 'card') {
                         return {
                             name: 'card',
                             title: '默认卡片',
-                            'tplFunction': function (data) {
+                            icon: 'layui-icon layui-icon-form',
+                            tplFunction: function (options, res, container) {
+                                console.log('card func');
+
+                                console.log(options);
+                                console.log(res);
+                                console.log(container);
+
+                                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>
+                                        </div>
+                                    </div>`;
+                                var baseDataItem = `
+                                    <div class="item">
+                                        <div class="item-title">
+                                            
+                                        </div>
+                                        <div class="item-value">
+                                            
+                                        </div>
+                                    </div>`;
+
+                                res.data.forEach(row => {
+
+                                    var rowItem = $.extend(true, {}, row);
+
+                                    var baseElem = $(baseItem).appendTo(container);
+
+                                    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)
+                                        );
+                                    });
+
+                                });
+
                                 return '';
                             }
                         };
+                    } else {
+                        if (item.icon == undefined) {
+                            item.icon = 'layui-icon layui-icon-component';
+                        }
+                        if (item.title == undefined) {
+                            item.title = item.name;
+                        }
                     }
                     return item;
                 });
 
+                var optionBefore = options.before;
+                options.before = function (res, curr, count) {
+                    optionBefore(res, curr, count);
+                    console.log('layout before fun');
+
+                    var currentLayout = admin.getPageSetting('table-layout-default', 'table');
+                    // 隐藏所有数据体内容
+                    var layuiTableElem = $(layuiTableElemName);
+
+                    options.layoutList.forEach((item) => {
+                        if (item.name == 'table') {
+                            layuiTableElem.find('.layui-table-box').hide();
+                        } else {
+                            layuiTableElem.find('.layui-table-custom.layui-table-custom-' + item.name).hide();
+                        }
+                    });
+
+                    if (currentLayout == 'table') {
+                        layuiTableElem.find('.layui-table-box').show();
+                    } else {
+                        var className = '.layui-table-custom.layui-table-custom-' + currentLayout;
+                        // 如果不存在则创建
+                        if (!layuiTableElem.find(className).length) {
+                            layuiTableElem.find('.layui-table-box').before('<div class="layui-table-custom layui-table-custom-' + currentLayout + '"></div>');
+                        }
+                        layuiTableElem.find(className).show();
+                        loading.show();
+                    }
+                };
+
                 var optionDone = options.done;
                 options.done = function (res, curr, count) {
                     optionDone(res, curr, count);
+                    console.log('layout done fun');
 
+                    var currentLayout = admin.getPageSetting('table-layout-default', 'table');
+                    // 隐藏所有数据体内容
+                    var layuiTableElem = $(layuiTableElemName);
+
+                    options.layoutList.forEach((item) => {
+                        if (currentLayout == 'table') {
+                            // 如果是table，则不用生成数据，显示出来就行，before已经显示过了
+                            return;
+                        }
+
+                        if (currentLayout != item.name) {
+                            // 如果不是，则不进行任何操作
+                            return;
+                        }
+
+                        var className = '.layui-table-custom.layui-table-custom-' + item.name;
+
+                        // 清空里面的数据
+                        layuiTableElem.find(className).html('');
+                        loading.hide()                   
+
+                        item.tplFunction(options, res, layuiTableElem.find(className));
+
+
+
+
+                    });
 
                 };
-                // 生成html
-                var layoutElemId = 'layout-list-option-' + tableId;
-                // 构建下拉选择
-                var layoutHtml = '<div id="' + layoutElemId + '" class="">';
-
-                layoutHtml += '</div>';
-
-                $(elem).before(layoutHtml);
-                
 
                 return options;
 
@@ -1413,7 +1576,10 @@
             },
             listenToolbar: function (layFilter, tableId) {
                 table.on('toolbar(' + layFilter + ')', function (obj) {
+                    console.log(obj);
 
+                    var options = obj.config;
+                    var tableId = obj.config.id;
                     // 搜索表单的显示
                     switch (obj.event) {
                         case 'TABLE_SEARCH':
@@ -1426,13 +1592,64 @@
                             }
                             break;
                         case 'TABLE_LAYOUT':
-                            var searchFieldsetId = 'searchFieldset_' + tableId;
+                            var layoutElemId = 'layout-list-option-' + tableId;
-                            var _that = $("#" + searchFieldsetId);
+                            var layoutElemIdName = '#' + layoutElemId;
-                            if (_that.hasClass("layui-hide")) {
+
-                                _that.removeClass('layui-hide');
+                            var currentLayout = admin.getPageSetting('table-layout-default', 'table');
-                            } else {
+
-                                _that.addClass('layui-hide');
+                            // 构建下拉选择
+                            var layoutHtml = '<div id="' + layoutElemId + '" class="ul-nav-block table-tpl-container">';
+
+                            options.layoutList.forEach(item => {
+                                var currentClassName = '';
+                                if (item.name == currentLayout) {
+                                    currentClassName = 'current';
                                 }
+                                layoutHtml += `
+                                <div class="item ${currentClassName}" data-name="${item.name}">
+                                    <div class="item-icon"><i class="${item.icon}"></i></div>
+                                    <div class="item-title">${item.title}</div>
+                                </div>`;
+                            });
+
+                            layoutHtml += '</div>';
+
+                            var toolbarLayoutElem = $('[lay-table-id="' + tableId + '"]').find('[lay-event="TABLE_LAYOUT"]');
+                            if (toolbarLayoutElem.find(layoutElemIdName).length > 0) {
+                                // If it is, remove the HTML
+                                $(layoutElemIdName).remove();
+                            }
+                            layoulElem = $(layoutHtml);
+                            layoulElem.appendTo(toolbarLayoutElem);
+
+
+                            layoulElem.on('click', function (event) {
+
+                                var item = $(event.target).closest('.item');
+                                if (item.length > 0) {
+                                    // 点击操作
+                                    item.addClass('current').siblings().removeClass('current');
+
+                                    var layoutName = item.data('name');
+                                    admin.setPageSetting('table-layout-default', layoutName);
+
+                                    table.reloadData(tableId, {}, true);
+                                } else {
+                                    // 其他区域操作
+                                }
+
+                                // 不要冒泡
+                                event.stopPropagation();
+                            });
+
+                            // Remove any existing click event listeners to avoid duplicates
+                            $(document).off('click.table-layout').on('click.table-layout', function (event) {
+
+                                if (!$(event.target).closest(toolbarLayoutElem).length) {
+                                    // If it is, remove the HTML
+                                    $(layoutElemIdName).remove();
+                                }
+                            });
                             break;
                     }
                 });
@@ -2671,8 +2888,39 @@
                 pwd += $chars.charAt(Math.floor(Math.random() * maxPos));
             }
             return pwd;
+        },
+        getPageSetting(key, defaultValue, global = false) {
+            if (!global) {
+                key = window.CONFIG.PAGE_KEY_NAME + '_' + key;
+            }
+            return tools.getLocal(key, defaultValue);
+        },
+        setPageSetting(key, value, global) {
+            if (!global) {
+                key = window.CONFIG.PAGE_KEY_NAME + '_' + key;
+            }
+            return tools.setLocal(key, value);
+        },
+        /**
+         * 如果不存在则写入，返回有效的值
+         * 如果不存在则返回新的值，否则返回之前设置的值
+         * 
+         * @param {string} key 
+         * @param {mixed} value 
+         * @param {boolean} global 
+         * @returns 
+         */
+        trySetPageSetting(key, value, global) {
+            var oldValue = admin.getPageSetting(key, undefined, global);
+            if (!oldValue) {
+                admin.setPageSetting(key, value, global);
+                return value;
+            }
+
+            return oldValue;
         }
     };
 
+
     window.ulAdmin = window.ua = admin;
 })();

view/index/welcome.html

@@ -10,8 +10,8 @@
     <title>ulthon_admin | 一款基于ThinkPHP8和Layui的快速开发的后台管理框架系统</title>
     <link rel="stylesheet" href="//layui.ulthon.com/cdn/layui-ul.css">
     <link rel="stylesheet" href="__STATIC__/common/css/welcome.css?v={$version}">
-    <link rel="stylesheet" href="/static/plugs/layui-v2.8.17/css/layui.css">
+    <link rel="stylesheet" href="/static/plugs/layui-v2.9.18/css/layui.css">
-    <script src="/static/plugs/layui-v2.8.17/layui.js"></script>
+    <script src="/static/plugs/layui-v2.9.18/layui.js"></script>
 
 
 </head>