* refactor block-create view.

module/block/control.php

@@ -62,7 +62,7 @@ class block extends control
 
             $this->block->create($formData);
             if(dao::isError()) return $this->send(array('result' => 'fail', 'message' => dao::getError()));
-            return $this->send(array('result' => 'success', 'message' => $this->lang->saveSuccess, 'load' => $this->createLink($this->app->tab, 'index'), 'closeModal' => true));
+            return $this->send(array('result' => 'success', 'message' => $this->lang->saveSuccess, 'callback' => "loadComponent('#dashboard')", 'closeModal' => true));
         }
 
         $modules = $this->blockZen->getAvailableModules($dashboard);

module/block/css/create.ui.css

@@ -1,4 +0,0 @@
-#blockCreateForm .bg-secondary-pale {background: #F3F6FA;}
-#blockCreateForm #paramsRow:not(.hidden)~:not(.hidden), #blockCreateForm #codesRow:not(.hidden)~:not(.hidden) {margin: 0;}
-#blockCreateForm #paramsRow .form-row {--tw-space-y-reverse: 0; margin-bottom: calc(1rem*var(--tw-space-y-reverse)); margin-top: calc(1rem*(1 - var(--tw-space-y-reverse)));}
-#blockCreateForm .form-actions {margin-top: 20px; margin-bottom: 20px;}

module/block/js/create.ui.js

@@ -1,10 +1,15 @@
 function getForm(event)
 {
-    const field  = $(event.target).attr('name');
-    const module = field == 'code' ? $('#blockCreateForm #module').val() : $(event.target).attr('data-tab');
-    const code   = field == 'code' ? $(event.target).val() : '';
-    const url    = $.createLink('block', 'create', 'dashboard=' + dashboard + '&module=' + module + '&code=' + (code ? code : ''));
-    loadPage(url, '#blockCreateForm #codesRow, #blockCreateForm #paramsRow, #blockCreateForm #module');
+    const $target = $(event.target).closest('a,input');
+    const field   = $target.attr('name');
+    const module  = field == 'code' ? $('#blockCreateForm #module').val() : $target.attr('data-module');
+    const code    = field == 'code' ? $target.val() : '';
+    const url     = $.createLink('block', 'create', 'dashboard=' + dashboard + '&module=' + module + '&code=' + (code ? code : ''));
+    loadPartial(url, '#blockCreateForm #codesRow, #blockCreateForm #paramsRow, #blockCreateForm #module');
+
+    const $nav = $('#blockCreateForm .block-modules-nav');
+    $nav.find('.nav-item>.active').removeClass('active');
+    $nav.find(`.nav-item>a[data-module="${module}"]`).addClass('active');
 }
 
 /**
@@ -21,7 +26,7 @@ function onParamsTypeChange()
     /* When creating a test version block in the project dashboard, directly take the name of the block of type.*/
     if($('#module').val() == 'scrumtest' && $('#paramstype').val() != 'all')
     {
-        $('#title').val($code.options[$code.selectedIndex].text);
+        $('#title').val($code.options[$code.selectedIndex].text || '');
         return;
     }
 

module/block/js/edit.ui.js

@@ -1,10 +1,10 @@
 function getForm(event)
 {
     const $target = $(event.target).closest('a,input');
-    const field  = $target.attr('name');
-    const module = field == 'code' ? $('#blockEditForm #module').val() : $target.attr('data-module');
-    const code   = field == 'code' ? $target.val() : '';
-    const url    = $.createLink('block', 'edit', 'blockID=' + blockID + '&module=' + module + '&code=' + (code ? code : ''));
+    const field   = $target.attr('name');
+    const module  = field == 'code' ? $('#blockEditForm #module').val() : $target.attr('data-module');
+    const code    = field == 'code' ? $target.val() : '';
+    const url     = $.createLink('block', 'edit', 'blockID=' + blockID + '&module=' + module + '&code=' + (code ? code : ''));
     loadPartial(url, '#blockCreateForm #codesRow, #blockCreateForm #paramsRow, #blockCreateForm #module');
 
     const $nav = $('#blockEditForm .block-modules-nav');

module/block/ui/create.html.php

@@ -11,6 +11,8 @@ declare(strict_types=1);
  */
 namespace zin;
 
+include 'common.ui.php';
+
 set::title($title);
 jsVar('dashboard', $dashboard);
 jsVar('blockTitle', $lang->block->blockTitle);
@@ -24,75 +26,20 @@ foreach($widths as $width) $widthOptions[$width] = zget($lang->block->widthOptio
 
 $defaultWidth = !empty($config->block->size[$module][$code]) ? reset(array_keys($config->block->size[$module][$code])) : 1;
 
-$paramsRows  = array();
-foreach($params as $key => $row)
-{
-    $paramsRows[] = formRow
-    (
-        formGroup
-        (
-            set::label($row['name']),
-            set::name("params[$key]"),
-            set::value(zget($row, 'default', '')),
-            set::control(array
-            (
-                'id'       => "params$key",
-                'type'     => $row['control'],
-                'items'    => isset($row['options']) ? $row['options'] : null,
-            )),
-            $row['control'] == 'picker' ? set::required(true) : '',
-        ),
-    );
-}
-
-$moduleTabs = array();
-foreach($modules as $moduleKey => $moduleName)
-{
-    if(!$moduleKey || !$moduleName) continue;
-    if($moduleKey == 'welcome') $moduleTabs[] = li(width('calc(100% - 2rem)'), setClass('nav-divider'));
-    $moduleTabs[] = li
-    (
-        setClass('nav-item w-full'),
-        a
-        (
-            setClass('ellipsis text-dark title' . ($moduleKey == $module ? ' active' : '')),
-            on::click('getForm'),
-            set('data-tab', $moduleKey),
-            set('data-toggle', 'tab'),
-            $moduleName
-        ),
-        span
-        (
-            setClass('link flex-1 text-right pr-2 hidden'),
-            icon
-            (
-                setClass('text-primary'),
-                'arrow-right'
-            )
-        )
-    );
-}
-
-div
+row
 (
     set::id('blockCreateForm'),
-    setClass('flex h-full overflow-hidden'),
     $showModules ? cell
     (
-        width('128px'),
-        setClass('bg-secondary-pale overflow-y-auto'),
-        ul
-        (
-            setClass('nav nav-tabs nav-stacked my-2'),
-            $moduleTabs
-        ),
-    ) : '',
+        set::width(128),
+        set::class('flex-none bg-surface rounded rounded-r-none rounded-tl-none overflow-y-auto'),
+        buildBlockModuleNav()
+    ) : null,
     cell
     (
-        width('calc(100% - ' . ($showModules ? '130' : '2') .  'px)'),
+        setClass('flex-auto pr-6 pb-4'),
         form
         (
-            setClass('border-b-0'),
             on::change('#code', 'getForm'),
             on::change('#paramstype', 'onParamsTypeChange'),
             formRow
@@ -126,17 +73,18 @@ div
             div
             (
                 set::id('paramsRow'),
+                set::class('space-y-4'),
                 formRow
                 (
                     formGroup
                     (
                         set::label($lang->block->name),
                         set::name('title'),
-                        set::value($blockTitle),
+                        set::value(''),
                         set::control('input')
                     ),
                 ),
-                $paramsRows,
+                buildParamsRows(),
                 formRow
                 (
                     setClass(empty($code) ? 'hidden' : ''),
@@ -165,4 +113,11 @@ div
     )
 );
 
+if(isInModal())
+{
+    set::condensed(true);
+    set::bodyClass('border-t');
+    set::bodyProps(array('style' => array('padding' => 0)));
+}
+
 render();

module/block/ui/dashboard.html.php

@@ -15,8 +15,6 @@ foreach($blocks as $block)
 {
     $block->color  = isset($block->params->color) ? $block->params->color : null;
     $block->fetch  = $block->blockLink;
-    $block->height = $block->height ? $block->height : 3;
-    $block->size   = array($block->width, $block->height);
     unset($block->title);
 }