新增移动端组件;移动端新增分组导航组件

app/model/Post.php

@@ -151,9 +151,10 @@ class Post extends Model
       return '';
     }
 
-    $base_dir = App::getRootPath() . '/demo/';
+    $base_dir = App::getRootPath() . '/demo/' . $this->getAttr('category')->getData('tpl_name') . '/';
 
     $file_path = $base_dir . $this->getData('tpl_name') . '.html';
+    
     if (!file_exists($file_path)) {
       return '';
     }
@@ -190,7 +191,7 @@ class Post extends Model
 
     if (empty($model_post) || $clear) {
       $model_post = Post::find($id);
-      Cache::set($cache_key, $model_post, 600);
+      Cache::set($cache_key, $model_post, get_system_config('cache_expire_time'));
     }
 
     return $model_post;

config/view_type.php

@@ -2,9 +2,11 @@
 
 return [
   'category' => [
-    '' => '普通:',
+    '' => '普通',
+    'pc' => '电脑端',
+    'mb' => '移动端',
   ],
   'post' => [
-    '' => '普通:',
+    '' => '普通',
   ]
 ];

demo/mb/nav.html

@@ -0,0 +1,28 @@
+<fieldset class="layui-elem-field layui-field-title">
+  <legend>分组卡片导航</legend>
+  <div class="layui-field-box ">
+    <div class="ul-padding-md ul-bg-gray ul-mb-ui-container">
+      <div class="ul-mb-nav-group-card" data-repeat="3">
+        <div class="ul-mb-nav-group-card-title">
+          美图
+        </div>
+        <div class="ul-mb-nav-group-card-list">
+          <div class="ul-mb-nav-group-card-item" data-repeat="3">
+            <div class="ul-mb-nav-group-card-item-icon" style="background-image: url(/static/images/view.jpg);">
+              
+            </div>
+            <div class="ul-mb-nav-group-card-item-info">
+              <div class="ul-mb-nav-group-card-item-title">
+                模特写真
+              </div>
+              <div class="ul-mb-nav-group-card-item-desc">
+                美艳大片
+              </div>
+
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</fieldset>

public/cdn/layui-ul-mb.css

@@ -0,0 +1,49 @@
+.ul-mb-ui-container{
+  width: 300px;
+  max-height: 500px;
+  overflow: scroll;
+}
+
+.ul-mb-nav-group-card{
+
+}
+
+.ul-mb-nav-group-card-title{
+  font-weight: 600;
+  line-height: 2;
+  font-size: 16px;
+}
+.ul-mb-nav-group-card-list{
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+.ul-mb-nav-group-card-item{
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  background-color: #fff;
+  border-radius: 3px;
+  padding: 8px;
+  margin-bottom: 15px;
+  width: 42%;
+}
+
+.ul-mb-nav-group-card-item-icon{
+  width: 50px;
+  height: 50px;
+  background-position: center;
+  background-size: cover;
+  margin-right: 8px;
+  
+}
+.ul-mb-nav-group-card-item-title{
+  line-height: 2;
+  font-size: 14px;
+}
+
+.ul-mb-nav-group-card-item-desc{
+  color: #999;
+  font-size: 12px;
+}

view/admin/system/index.html

@@ -111,6 +111,13 @@
                         class="layui-input">
                     </div>
                   </div>
+                  <div class="layui-form-item">
+                    <div class="layui-form-label">缓存时长(秒)</div>
+                    <div class="layui-input-block">
+                      <input type="text" name="cache_expire_time" value="{:get_system_config('cache_expire_time')}"
+                        class="layui-input">
+                    </div>
+                  </div>
                   <div class="layui-form-item">
                     <div class="layui-form-label">二维码</div>
                     <div class="layui-input-block">

view/index/common/_require.html

@@ -5,6 +5,7 @@
 <link rel="stylesheet" href="/static/css/common.css">
 <link rel="stylesheet" href="/cdn/layui-ul-change.css">
 <link rel="stylesheet" href="/cdn/layui-ul.css">
+<link rel="stylesheet" href="/cdn/layui-ul-mb.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>