mirror of
https://gitee.com/ulthon/layui-ul.git
synced 2026-07-01 10:32:49 +08:00
开始新的组件架构
This commit is contained in:
@@ -4,8 +4,11 @@ declare(strict_types=1);
|
||||
|
||||
namespace app\model;
|
||||
|
||||
use Parsedown;
|
||||
use ScssPhp\ScssPhp\Compiler;
|
||||
use think\facade\App;
|
||||
use think\facade\Cache;
|
||||
use think\facade\Env;
|
||||
use think\facade\Request;
|
||||
use think\facade\View;
|
||||
use think\Model;
|
||||
@@ -164,6 +167,60 @@ class Post extends Model
|
||||
return View::fetch($file_path);
|
||||
}
|
||||
|
||||
public function getComponentsAttr()
|
||||
{
|
||||
if (empty($this->getData('tpl_name'))) {
|
||||
return [];
|
||||
}
|
||||
|
||||
$tpl_name = $this->getData('tpl_name');
|
||||
|
||||
$components_type_path = App::getRootPath() . '/source/components/' . $tpl_name;
|
||||
|
||||
if (!is_dir($components_type_path)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
|
||||
$cache_key = 'cache_components_data_' . $tpl_name;
|
||||
|
||||
$list_components_data = Cache::get($cache_key);
|
||||
|
||||
if (!is_null($list_components_data) && !Env::get('APP_DEBUG')) {
|
||||
return $list_components_data;
|
||||
}
|
||||
|
||||
$list_components = scandir($components_type_path);
|
||||
|
||||
|
||||
|
||||
$list_components_data = [];
|
||||
|
||||
|
||||
$scss_compiler = new Compiler();
|
||||
|
||||
$markdown_parser = new Parsedown();
|
||||
|
||||
foreach ($list_components as $components_name) {
|
||||
if ($components_name == '.' || $components_name == '..') {
|
||||
continue;
|
||||
}
|
||||
$components_path = $components_type_path . '/' . $components_name;
|
||||
|
||||
$list_components_data[$components_name]['title'] = file_get_contents($components_path . '/_title.txt');
|
||||
$list_components_data[$components_name]['html'] = file_get_contents($components_path . '/_index.html');
|
||||
$list_components_data[$components_name]['scss'] = file_get_contents($components_path . '/_index.scss');
|
||||
$list_components_data[$components_name]['css'] = $scss_compiler->compileString($list_components_data[$components_name]['scss'])->getCss();
|
||||
$list_components_data[$components_name]['markdown'] = file_get_contents($components_path . '/_index.md');
|
||||
$list_components_data[$components_name]['desc'] = $markdown_parser->text($list_components_data[$components_name]['markdown']);
|
||||
}
|
||||
|
||||
Cache::set($cache_key, $list_components_data, 60);
|
||||
|
||||
return $list_components_data;
|
||||
}
|
||||
|
||||
|
||||
public static function quickSelect($clear = false)
|
||||
{
|
||||
$cacke_key = 'post_list';
|
||||
|
||||
@@ -25,7 +25,9 @@
|
||||
"topthink/think-migration": "^3.0",
|
||||
"topthink/think-helper": "^3.1",
|
||||
"topthink/think-captcha": "^3.0",
|
||||
"topthink/think-multi-app": "^1.0"
|
||||
"topthink/think-multi-app": "^1.0",
|
||||
"scssphp/scssphp": "^1.11",
|
||||
"erusev/parsedown": "^1.7"
|
||||
},
|
||||
"require-dev": {
|
||||
"symfony/var-dumper": "^4.2"
|
||||
|
||||
1
source/components/_index.scss
Normal file
1
source/components/_index.scss
Normal file
@@ -0,0 +1 @@
|
||||
@import './list/ul-music-list/index'
|
||||
16
source/components/list/ul-music-list/_index.html
Normal file
16
source/components/list/ul-music-list/_index.html
Normal file
@@ -0,0 +1,16 @@
|
||||
<div class="ul-music-list">
|
||||
<div class="item">
|
||||
<div class="image">
|
||||
|
||||
</div>
|
||||
<div class="number">
|
||||
11
|
||||
</div>
|
||||
<div class="title">
|
||||
|
||||
</div>
|
||||
<div class="author">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
2
source/components/list/ul-music-list/_index.md
Normal file
2
source/components/list/ul-music-list/_index.md
Normal file
@@ -0,0 +1,2 @@
|
||||
|
||||
适合音乐列表的样式
|
||||
7
source/components/list/ul-music-list/_index.scss
Normal file
7
source/components/list/ul-music-list/_index.scss
Normal file
@@ -0,0 +1,7 @@
|
||||
.ul-music-list {
|
||||
padding-left: 15px;
|
||||
|
||||
.item {
|
||||
padding: 6px
|
||||
}
|
||||
}
|
||||
1
source/components/list/ul-music-list/_title.txt
Normal file
1
source/components/list/ul-music-list/_title.txt
Normal file
@@ -0,0 +1 @@
|
||||
音乐列表
|
||||
@@ -9,6 +9,8 @@
|
||||
@import './footer/index';
|
||||
@import './desciptions/index';
|
||||
@import './header/_index';
|
||||
@import '../components/index';
|
||||
|
||||
|
||||
/* 链接导航开始 */
|
||||
.ul-link-select {
|
||||
|
||||
@@ -66,6 +66,39 @@
|
||||
</div>
|
||||
<div class="demo-page">
|
||||
{$model_post->demo_page|raw}
|
||||
|
||||
{volist name='model_post->components' id='vo'}
|
||||
<fieldset class="layui-elem-field layui-field-title no-parser">
|
||||
<legend>{$vo.title}</legend>
|
||||
<div class="layui-field-box">
|
||||
<div class="desc">
|
||||
{$vo.desc|raw}
|
||||
</div>
|
||||
<div class="preview">{$vo.html|raw}</div>
|
||||
<div class="code">
|
||||
<div class="layui-tab layui-tab-card">
|
||||
<ul class="layui-tab-title">
|
||||
<li class="layui-this">HTML</li>
|
||||
<li>SCSS</li>
|
||||
<li>CSS</li>
|
||||
</ul>
|
||||
<div class="layui-tab-content" style="padding:0">
|
||||
<div class="layui-tab-item layui-show">
|
||||
<pre class="layui-code" style="margin: 0;">{$vo.html}</pre>
|
||||
</div>
|
||||
<div class="layui-tab-item ">
|
||||
{$vo.scss|raw}
|
||||
</div>
|
||||
<div class="layui-tab-item">
|
||||
{$vo.css|raw}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
{/volist}
|
||||
</div>
|
||||
|
||||
|
||||
@@ -73,7 +106,7 @@
|
||||
|
||||
<div class="ul-padding-md">
|
||||
<div id="gitee-container">
|
||||
<fieldset class="layui-elem-field layui-field-title">
|
||||
<fieldset class="layui-elem-field layui-field-title ">
|
||||
<legend>开源信息</legend>
|
||||
<div class="layui-field-box">
|
||||
<script src='https://gitee.com/ulthon/layui-ul/widget_preview' async defer></script>
|
||||
@@ -125,6 +158,9 @@
|
||||
<script>
|
||||
|
||||
$('.main-content h2,.main-content>.demo-page>fieldset').each(function (index, elem) {
|
||||
if ($(elem).hasClass('no-parser')) {
|
||||
return;
|
||||
}
|
||||
if ($(elem).find('.demo-js-src').length == 0) {
|
||||
$(elem).children('.layui-field-box')
|
||||
.addClass('demo-js-src')
|
||||
|
||||
Reference in New Issue
Block a user