Merge branch 'develop'

Author: daun

Dashboard.css

@@ -135,17 +135,21 @@ class DashboardPanelCollection extends DashboardPanel
         if ($markup === 'actions__') {
             $content = $this->renderPageActions($page);
         }
+        // Special case: page icon
+        elseif ($markup === 'page_icon') {
+            $content = $this->renderIcon($page->getIcon());
+        }
         // Special case: page status
         elseif ($markup === 'status__') {
             $content = $this->renderStatusIcon($page);
         }
         // Special case: published status toggle
-        elseif (in_array($markup, ['published__', 'visible__'])) {
-            $content = $this->renderStatusToggle($page, $markup);
+        elseif ($markup === 'published__') {
+            $content = $this->renderStatusToggle($page, 'published');
         }
-        // Special case: page icon
-        elseif ($markup === 'page_icon') {
-            $content = $this->renderIcon($page->getIcon());
+        // Special case: visible status toggle
+        elseif ($markup === 'visible__') {
+            $content = $this->renderStatusToggle($page, 'visible');
         }
         // Special case: system timestamps
         elseif (in_array($markup, ['modified', 'created'])) {
@@ -285,6 +289,8 @@ class DashboardPanelCollection extends DashboardPanel
     {
         parent::setup();
 
+        $this->wire()->modules->get('JqueryUI')->use('vex');
+
         $this->editUrl = $this->config->urls->admin.'page/edit/';
         $this->addUrl = $this->config->urls->admin.'page/add/';
         $this->listUrl = $this->config->urls->admin.'page/list/';
@@ -307,6 +313,8 @@ class DashboardPanelCollection extends DashboardPanel
         $this->editMode = $this->data['editMode'] ?? self::windowModeBlank;
         $this->viewMode = $this->data['viewMode'] ?? self::windowModeBlank;
         $this->addUrlParams = $this->data['addUrlParams'] ?? [];
+        $this->confirmTrash = $this->data['confirmTrash'] ?? true;
+        $this->confirmTrashMessage = $this->data['confirmTrashMessage'] ?? $this->_('Are you sure?');
 
         if (is_string($this->collection)) {
             $this->collection = $this->pages->find($this->collection);
@@ -504,7 +512,9 @@ class DashboardPanelCollection extends DashboardPanel
                     'attributes' => [
                         'data-action'  => "[trash][{$page}]",
                         'data-action-value'  => "1",
-                    ],
+                    ] + ($this->confirmTrash ? [
+                        'data-action-confirm' => $this->confirmTrashMessage,
+                    ] : []),
                 ];
             }
         }

Dashboard.js

@@ -17,16 +17,31 @@
   --dashboard-color-body-bg: #f0f3f7;
   --dashboard-color-panel-bg: #fff;
   --dashboard-color-separator: #e5e5e5;
+
   --dashboard-color-text-light: #97aab4;
+
   --dashboard-color-icon: #97aab4;
+
   --dashboard-color-button-bg: #f0f3f7;
   --dashboard-color-button-border: #d7dadf;
   --dashboard-color-button-text: #354b60;
   --dashboard-color-button-hover-bg: #6c8dae;
   --dashboard-color-button-hover-text: #fff;
+
   --dashboard-color-th-bg: #fafbfc;
+
   --dashboard-color-list-hover-bg: #fafbfc;
 
+  --dashboard-color-success: hsl(151, 45%, 47%);
+  --dashboard-color-success-bg: hsl(151, 45%, 95%);
+  --dashboard-color-warning: hsl(26, 84%, 51%);
+  --dashboard-color-warning-bg: hsl(26, 84%, 94%);
+  --dashboard-color-error: hsl(4, 74%, 57%);
+  --dashboard-color-error-bg: hsl(4, 74%, 96%);
+  --dashboard-color-progress: #354b60;
+  --dashboard-color-progress-bg: hsl(201, 16%, 80%);
+
+  /* Font sizes */
   --dashboard-fontsize-icon: 1.25em;
 
   /* Panels */

DashboardPanelCollection.js

@@ -1,6 +1,11 @@
 /* global $ */
 
 function initPanel($panel) {
+
+  const submitParamsAndReload = (params) => {
+    $panel.trigger('reload', { animate: false, params });
+  };
+
   const $reloadlinks = $panel.find('.pw-modal[data-reload-on-close]');
   if ($reloadlinks.length) {
     const page = $panel.data('page') || 1;
@@ -16,9 +21,8 @@ function initPanel($panel) {
       event.preventDefault();
       const url = event.currentTarget.href;
       const page = (url.match(/\d+$/) || [])[0] || 1;
-      const params = { page };
       $panel.data('page', page);
-      $panel.trigger('reload', { animate: false, params });
+      submitParamsAndReload({ page });
     });
   }
 
@@ -27,10 +31,16 @@ function initPanel($panel) {
     $actionButtons.on('click', (event) => {
       event.preventDefault();
       const action = event.currentTarget.dataset.action;
+      const confirm = event.currentTarget.dataset.actionConfirm;
       const key = `actions${action}`
       const value = event.currentTarget.dataset.actionValue;
       const params = { [key]: value };
-      $panel.trigger('reload', { animate: false, params });
+      console.log(confirm);
+      if (confirm) {
+        ProcessWire.confirm(confirm, () => submitParamsAndReload(params));
+      } else {
+        submitParamsAndReload(params);
+      }
     });
   }
 
@@ -42,7 +52,7 @@ function initPanel($panel) {
       const checked = event.target.checked;
       const value = checked ? 1 : '';
       const params = { [name]: value };
-      $panel.trigger('reload', { animate: false, params });
+      submitParamsAndReload(params);
     });
   }
 }

DashboardPanelCollection.module

@@ -59,6 +59,8 @@
     padding: var(--dashboard-card-padding-list-y) var(--dashboard-card-padding-content-x);
     border-bottom: 1px solid var(--dashboard-color-separator);
     white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
     &:hover {
       background: var(--dashboard-color-list-hover-bg);
     }