diff --git a/app/command/make/Component.php b/app/command/make/Component.php
new file mode 100644
index 0000000..2a3a1bb
--- /dev/null
+++ b/app/command/make/Component.php
@@ -0,0 +1,103 @@
+setName('make:component')
+
+ ->addArgument('tpl', Argument::REQUIRED, '组件类型')
+ ->addArgument('component', Argument::REQUIRED, '组件文件名')
+ ->addArgument('component-title', Argument::OPTIONAL, '组件名称')
+ ->addOption('force', 'f', Option::VALUE_NONE, '强制覆盖')
+ ->setDescription('the make:component command');
+ }
+
+ protected function execute(Input $input, Output $output)
+ {
+ // 指令输出
+ $output->writeln('make:component');
+
+ $tpl = $input->getArgument('tpl');
+ $component = $input->getArgument('component');
+ $component_title = $input->getArgument('component-title') ?: $component;
+
+ $component_title;
+
+ $component_tpl_dir = App::getRootPath() . '/source/components/';
+ $target_dir = $component_tpl_dir . $tpl . '/' . $component;
+
+ if (is_dir($target_dir)) {
+ if (!$input->hasOption('force')) {
+ $output->error('目标组件已存在:' . $target_dir);
+ $output->error('如需覆盖请添加参数 -f');
+ return false;
+ }
+ } else {
+ mkdir($target_dir, 0777, true);
+ }
+
+
+ $assign_data = [
+ 'component' => $component,
+ 'component_title' => $component_title
+ ];
+
+ $files = [
+ '_index.env',
+ '_index.html',
+ '_index.md',
+ '_index.scss',
+ ];
+
+ foreach ($files as $file_name) {
+
+ $file_content = View::fetch(__DIR__ . '/component/tpl/' . $file_name, $assign_data);
+
+ $file_path = $target_dir . '/' . $file_name;
+
+ file_put_contents($file_path, $file_content);
+
+ $output->info('创建:' . $file_path);
+ }
+
+ $output->info('创建完成');
+
+
+ $dir_tpl = scandir($component_tpl_dir);
+
+ $index_scss = '';
+
+ foreach ($dir_tpl as $dir_name) {
+ if ($dir_name == '.' || $dir_name == '..') {
+ continue;
+ }
+
+ $list_component = scandir($component_tpl_dir . '/' . $dir_name);
+
+ foreach ($list_component as $component_name) {
+
+ if ($component_name == '.' || $component_name == '..') {
+ continue;
+ }
+
+ $index_scss .= "@import './{$dir_name}/{$component_name}/index';";
+ }
+ }
+
+ file_put_contents(App::getRootPath() . '/source/components/_index.scss');
+ }
+}
diff --git a/app/command/make/component/tpl/_index.env b/app/command/make/component/tpl/_index.env
new file mode 100644
index 0000000..076824a
--- /dev/null
+++ b/app/command/make/component/tpl/_index.env
@@ -0,0 +1,5 @@
+title={$component_title}
+
+padding=0
+margin=0
+gray=0
\ No newline at end of file
diff --git a/app/command/make/component/tpl/_index.html b/app/command/make/component/tpl/_index.html
new file mode 100644
index 0000000..cbdc20a
--- /dev/null
+++ b/app/command/make/component/tpl/_index.html
@@ -0,0 +1,3 @@
+
+
+
\ No newline at end of file
diff --git a/app/command/make/component/tpl/_index.md b/app/command/make/component/tpl/_index.md
new file mode 100644
index 0000000..e69de29
diff --git a/app/command/make/component/tpl/_index.scss b/app/command/make/component/tpl/_index.scss
new file mode 100644
index 0000000..a319492
--- /dev/null
+++ b/app/command/make/component/tpl/_index.scss
@@ -0,0 +1,3 @@
+.{$component} {
+
+}
\ No newline at end of file
diff --git a/config/console.php b/config/console.php
index 8e555c3..c6a8870 100644
--- a/config/console.php
+++ b/config/console.php
@@ -3,6 +3,7 @@
// | 控制台配置
// +----------------------------------------------------------------------
+use app\command\make\Component;
use app\command\make\View;
use app\command\ScanDemo;
@@ -11,6 +12,7 @@ return [
'commands' => [
'app\command\ResetPassword',
View::class,
- ScanDemo::class
+ ScanDemo::class,
+ Component::class
],
];
diff --git a/demo/pc/list.html b/demo/pc/list.html
index 9a8d9f7..25146c9 100644
--- a/demo/pc/list.html
+++ b/demo/pc/list.html
@@ -494,53 +494,4 @@
-
-
-
\ No newline at end of file
diff --git a/source/components/_index.scss b/source/components/_index.scss
index 98f28a7..0a327da 100644
--- a/source/components/_index.scss
+++ b/source/components/_index.scss
@@ -1 +1,2 @@
-@import './list/ul-music-list/index'
\ No newline at end of file
+@import './list/ul-music-list/index';
+@import './list/ul-order-list-simple-card/index';
\ No newline at end of file
diff --git a/source/components/list/ul-order-list-simple-card/_index.env b/source/components/list/ul-order-list-simple-card/_index.env
new file mode 100644
index 0000000..7e7b5a3
--- /dev/null
+++ b/source/components/list/ul-order-list-simple-card/_index.env
@@ -0,0 +1,4 @@
+title=订单列表-简约卡片
+padding=1
+margin=0
+gray=1
\ No newline at end of file
diff --git a/source/components/list/ul-order-list-simple-card/_index.html b/source/components/list/ul-order-list-simple-card/_index.html
new file mode 100644
index 0000000..7c07159
--- /dev/null
+++ b/source/components/list/ul-order-list-simple-card/_index.html
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
+
+
商品名称商品名称商品名称商品名称商品名称商品名称
+
+
+ ¥1300.00
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/source/components/list/ul-order-list-simple-card/_index.md b/source/components/list/ul-order-list-simple-card/_index.md
new file mode 100644
index 0000000..e69de29
diff --git a/source/components/list/ul-order-list-simple-card/_index.scss b/source/components/list/ul-order-list-simple-card/_index.scss
new file mode 100644
index 0000000..ab7c089
--- /dev/null
+++ b/source/components/list/ul-order-list-simple-card/_index.scss
@@ -0,0 +1,86 @@
+.ul-order-list-simple-card {
+ .item {
+ box-shadow : 0 0 3px #ddd;
+ border-radius: 2px;
+ padding : 15px;
+ margin-bottom: 15px;
+ background-color: #fff;
+ }
+
+ .item-header {
+ display : flex;
+ align-items : center;
+ justify-content: space-between;
+ font-size : 13px;
+ margin-bottom : 5px;
+
+ .item-header-status {
+ color: #1E9FFF;
+ }
+ }
+
+ .item-body {
+ margin-top : 10px;
+ padding-bottom: 10px;
+
+ .item-body-item {
+ display : flex;
+ align-items : center;
+ justify-content: space-between;
+ padding : 5px 0;
+
+ .item-image {
+ width : 90px;
+ height : 90px;
+ background-size : cover;
+ background-position: center;
+ box-shadow : 0 0 2px #999;
+
+ }
+
+ .item-info {
+ width : calc(100% - 90px - 15px);
+ margin-left: 15px;
+ height : 90px;
+ position : relative;
+
+ .ul-info-title {
+ font-weight : 500;
+ font-size : 15px;
+ margin-bottom : 5px;
+ text-overflow : -o-ellipsis-lastline;
+ overflow : hidden;
+ text-overflow : ellipsis;
+ display : -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ }
+
+ .ul-info-value {
+ display : flex;
+ align-items : center;
+ justify-content: space-between;
+ color : #999;
+ font-size : 14px;
+ }
+
+ .ul-info-money {
+ position : absolute;
+ bottom : 0;
+ left : 0;
+ font-size : 15px;
+ font-weight: 600;
+ }
+ }
+ }
+ }
+
+ .item-footer {
+ padding-top : 15px;
+ margin-top : 5px;
+ border-top : 1px solid #eee;
+ display : flex;
+ align-items : center;
+ justify-content: space-between;
+ }
+}
\ No newline at end of file