横向/silverstripe-dashboard

为SilverStripe CMS添加自定义仪表板(Unclecheese模块的分支)

安装: 446

依赖者: 1

建议者: 0

安全: 0

星星: 0

关注者: 1

分支: 35

类型:silverstripe-vendormodule

1.0.0 2022-06-22 16:06 UTC

This package is auto-updated.

Last update: 2024-09-22 21:13:38 UTC


README

注意:这是UncleCheese原始模块的一个分支,在SilverStripe 4中没有得到太多关注。目的是使这个模块更加现代化,并为SilverStripe 4维护一个工作副本

仪表板模块为SilverStripe 4 CMS提供了一个带有可配置小部件的启动页面,这些小部件显示相关信息。面板可以轻松创建和扩展。仪表板模块的目的是为用户提供一个快速启动点,用于常见的CMS操作,例如创建特定页面类型或浏览新内容。

截图 & 视频

关于此模块的图片和视频可以在这篇博客文章中找到。

包含的面板

目前没有包含面板。这些面板可以被升级并从此模块的SS3版本中恢复

  • 最近编辑的页面
  • 最近上传的文件
  • RSS Feed
  • 快速链接
  • 区域编辑
  • Google Analytics
  • 天气

安装

  • 将此存储库的内容安装到您的SilverStripe项目的根目录中,目录名为"dashboard"。
  • 运行 /dev/build?flush=1

创建自定义仪表板面板

仪表板面板有自己的MVC架构,易于创建。在这个例子中,我们将创建一个显示虚构网站最近订单的面板。用户可以选择配置面板仅显示已发货的订单。

创建模型

首先,创建一个类作为DashboardPanel的子类。我们将包括定义可配置属性的数据库字段,并在getConfiguration()方法中创建配置字段。

mysite/code/RecentOrders.php

<?php

use SilverStripe\Forms\TextField;
use SilverStripe\Forms\CheckboxField;
use ilateral\SilverStripe\Dashboard\DashboardPanel;

class DashboardRecentOrdersPanel extends DashboardPanel {

  private static $db = [
    'Count' => 'Int',
    'OnlyShowShipped' => 'Boolean'
  ];
  
  
  private static $icon = "mysite/images/dashboard-recent-orders.png";
  
  
  public function getLabel() {
    return _t('Mysite.RECENTORDERS','Recent Orders');
  }
  
  
  public function getDescription() {
    return _t('Mysite.RECENTORDERSDESCRIPTION','Shows recent orders for this fake website.');
  }
  
  
  public function getConfigurationFields() {
    $fields = parent::getConfigurationFields();
    $fields->push(TextField::create("Count", "Number of orders to show"));
    $fields->push(CheckboxField::create("OnlyShowShipped","Only show shipped orders"));
    return $fields;
  }
  
  
  
  public function Orders() {
    $orders = Order::get()->sort("Created DESC")->limit($this->Count);
    return $this->OnlyShowShipped ? $orders->filter(['Shipped' => true]) : $orders;
  }
}

创建模板

面板对象将寻找与其类名匹配的模板。

mysite/templates/Includes/DashboardRecentOrdersPanel.ss

<div class="dashboard-recent-orders">
  <ul>
    <% loop Orders %>
      <li><a href="$Link">$OrderNumber ($Customer.Name)</a></li>
    <% end_loop %>
  </ul>
</div>

运行 /dev/build?flush=1,现在您可以在CMS中创建此仪表板面板。

使用CSS自定义

在继承的DashboardPanel子类的PanelHolder()方法中注入CSS和JavaScript需求是最好的位置。

mysite/code/DashboardRecentOrdersPanel.php

<?php
public function getPanelHolder() {
  Requirements::css("mysite/css/dashboard-recent-orders.css");
  return parent::getPanelHolder();
}

添加图表以可视化数据

仪表板模块包含一个使用Google API创建图表的API。

mysite/code/DashboardRecentOrdersPanel.php

<?php

  public function Chart() {
		$chart = DashboardChart::create("Order history, last 30 days", "Date", "Number of orders");
		$result = DB::query("SELECT COUNT(*) AS OrderCount, DATE_FORMAT(Date,'%d %b %Y') AS Date FROM \"Order\" GROUP BY Date");
		if($result) {
			while($row = $result->nextRecord()) {
				$chart->addData($row['Date'], $row['OrderCount']);
			}
		}
		return $chart;
	}

mysite/code/DashboardRecentOrdersPanel.ss

$Chart

为ModelAdmin / GridField面板创建自定义模板

您可以创建自己的模板以覆盖这些面板类型中的任何一个。由于命名结构,自定义模板将特定于该特定面板,因此您可以针对每个ModelAdmin / GridField面板有单独的模板。

您可以在模板中像通常一样访问您模型的所有属性,以及一个EditLink方法,其中包含CMS编辑链接。

对于模型管理面板,创建一个名为DashboardModelAdminPanel_ModelAdminClass_ModelAdminModel.ss的模板,并将其放置在您的mysite/templates/Includes文件夹中。例如;DashboardModelAdminPanel_MyAdmin_Product.ss

网格字段面板使用类似约定,DashboardGridFieldPanel_PageClassName_GridFieldName.ss

例如;DashboardGridFieldPanel_ContactPage_Submissions.ss

关于Google Analytics面板的说明

您需要将Google Analytics配置信息添加到项目配置文件config.yml中

DashboardGoogleAnalyticsPanel:
  email: [XXXXX]@developer.gserviceaccount.com
  profile: 123456
  key_file_path: google_oauth.p12  

要定位您的配置文件ID,请访问Google Analytics网站,登录并选择网站。URL的末尾将包含类似以下的片段

#report/visitors-overview/a5559982w55599512p12345678
/a[6 digits]w[8 digits]p[8 digits]

紧随“p”之后的8位数字即为您的配置文件ID。例如,上面的示例中就是12345678。

注意:要使用Google Analytics面板,您必须在https://www.google.com/settings/security的账户权限部分启用对不安全应用的访问。

有关设置开发者账户和获取密钥文件的更多信息,请访问https://github.com/erebusnz/gapi-google-analytics-php-interface#instructions-for-setting-up-a-google-service-account-for-use-with-gapi