ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-01 10:32:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

基本完成新的组件架构

Browse Source
This commit is contained in:
augushong
2022-10-21 19:40:31 +08:00
parent 68d95268e7
commit 3921f7a807
10 changed files with 16112 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app/model/Post.php
View File

@@ -6,6 +6,7 @@ namespace app\model;
use Parsedown;
use ScssPhp\ScssPhp\Compiler;
use think\Env as ThinkEnv;
use think\facade\App;
use think\facade\Cache;
use think\facade\Env;
@@ -207,12 +208,25 @@ class Post extends Model
}
$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]['title'] = file_get_contents($components_path . '/_title.txt');
$env_info = new ThinkEnv();
$env_info->load($components_path . '/_index.env');
$list_components_data[$components_name]['config'] = $env_info->get();
$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']);
$uniapp_code = $list_components_data[$components_name]['html'];
$uniapp_code = str_replace('<div', '<view', $uniapp_code);
$uniapp_code = str_replace('div>', 'view>', $uniapp_code);
$list_components_data[$components_name]['uniapp'] = $uniapp_code;
}
Cache::set($cache_key, $list_components_data, 60);

BIN
public/cdn/img/view.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 MiB

15990
public/static/lib/vue/vue.global.js Normal file
View File

File diff suppressed because it is too large Load Diff

3
source/components/list/ul-music-list/_index.env Normal file
View File

@@ -0,0 +1,3 @@
title=音乐列表
padding=0
gray=1

19
source/components/list/ul-music-list/_index.html
View File

@@ -1,16 +1,19 @@
<div class="ul-music-list">
<div class="item">
<div class="image">
<div class="ul-music-list-item" v-for="i in 3">
<div class="ul-music-list-item__image ul-demo-img-bg">
</div>
<div class="number">
11
<div class="ul-music-list-item__number">
{{i}}
</div>
<div class="title">
<div class="ul-music-list-item__title">
星星点灯
</div>
<div class="author">
<div class="ul-music-list-item__dot">
-
</div>
<div class="ul-music-list-item__author">
郑智化
</div>
</div>
</div>

38
source/components/list/ul-music-list/_index.scss
View File

@@ -1,7 +1,39 @@
.ul-music-list {
padding-left: 15px;
.item {
padding: 6px
.ul-music-list-item {
display : flex;
align-items : center;
justify-content: left;
padding: 10px;
&__image {
width : 50px;
height : 50px;
border-radius: 5px
}
&__number {
font-size : 16px;
font-weight: bolder;
margin : 12px;
}
&__title {
color : #303133;
font-size: 16px;
}
&__dot {
color : #303133;
font-size: 16px;
margin : 8px
}
&__author {
color : #999;
font-size: 13px;
}
}
}

1
source/components/list/ul-music-list/_title.txt
View File

@@ -1 +0,0 @@
音乐列表

13
source/scss/_common.scss
View File

@@ -3,6 +3,11 @@
padding: 15px;
}
.ul-margin-md {
margin: 15px;
}
.ul-section {
margin-bottom: 15px;
}
@@ -67,4 +72,10 @@
width: 360px;
}
/* 通用类结束 */
/* 通用类结束 */
.ul-demo-img-bg {
background-image : url("img/view.jpg");
background-size : cover;
background-position: center;
}

1
view/index/common/_require.html
View File

@@ -10,5 +10,6 @@
<script src="/static/lib/jquery/jquery.cookie.js"></script>
<script src="/static/lib/layui/layui.js"></script>
<script src="/static/js/common.js"></script>
<script src="/static/lib/vue/vue.global.js"></script>
{:get_system_config('site_tongji')}

51
view/index/index/index.html
View File

@@ -64,34 +64,56 @@
<div class="ql-snow">
<div class="ql-editor">{$model_post->content_html|raw}</div>
</div>
<div class="demo-page">
<div class="demo-page" id="app-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>
<legend>{$vo.config.TITLE}</legend>
<div class="layui-field-box">
<div class="desc">
{$vo.desc|raw}
</div>
<div class="preview">{$vo.html|raw}</div>
<div class="component-item" style="margin-top: 10px;" data-margin="{$vo.config.MARGIN|default='0'}" data-padding="{$vo.config.PADDING|default='0'}" data-gray="{$vo.config.GRAY|default='0'}">
<div class="">
<span>预览效果</span>
<div class="layui-btn-group" style="margin-left: 10px;">
<button type="button" class="layui-btn layui-btn-xs" @click="padding = 1" :class="padding == 1 ? 'layui-btn-normal' : 'layui-btn-primary'">padding</button>
<button type="button" class="layui-btn layui-btn-xs" @click="padding = 0" :class="padding == 0 ? 'layui-btn-normal' : 'layui-btn-primary'">无</button>
</div>
<div class="layui-btn-group" style="margin-left: 10px;">
<button type="button" class="layui-btn layui-btn-xs" @click="margin = 1" :class="margin == 1 ? 'layui-btn-normal' : 'layui-btn-primary'">margin</button>
<button type="button" class="layui-btn layui-btn-xs" @click="margin = 0" :class="margin == 0 ? 'layui-btn-normal' : 'layui-btn-primary'">无</button>
</div>
<div class="layui-btn-group" style="margin-left: 10px;">
<button type="button" class="layui-btn layui-btn-xs" @click="gray = 1" :class="gray == 1 ? 'layui-btn-normal' : 'layui-btn-primary'">gray</button>
<button type="button" class="layui-btn layui-btn-xs" @click="gray = 0" :class="gray == 0 ? 'layui-btn-normal' : 'layui-btn-primary'">无</button>
</div>
</div>
<div class="" style="margin-top: 10px;">
<div class="preview" :class="{'ul-bg-gray':gray,'ul-padding-md':padding,'ul-margin-md':margin}">{$vo.html|raw}</div>
</div>
</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>
<li>UniApp</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}
<pre class="layui-code" style="margin: 0;">{$vo.scss|raw}</pre>
</div>
<div class="layui-tab-item">
{$vo.css|raw}
<pre class="layui-code" style="margin: 0;">{$vo.css|raw}</pre>
</div>
<div class="layui-tab-item">
<pre class="layui-code" style="margin: 0;">{$vo.uniapp|raw}</pre>
</div>
</div>
</div>
@@ -246,6 +268,23 @@
})
layui.util.fixbar()
const { createApp } = Vue
$('.component-item').each(function (index, elem) {
createApp({
data() {
return {
margin: $(elem).data('margin'),
padding: $(elem).data('padding'),
gray: $(elem).data('gray'),
}
}
}).mount(elem)
})
</script>
</body>