heyday / unclecheese-dashboard

为 SilverStripe CMS 添加仪表板

安装: 14

依赖项: 0

建议者: 0

安全: 0

星星: 0

观察者: 6

分支: 0

类型:silverstripe-module

1.1.3 2021-09-19 22:07 UTC

This package is auto-updated.

Last update: 2024-09-20 04:18:38 UTC


README

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

屏幕截图 & 视频

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

包含的面板

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

安装

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

创建自定义仪表板面板

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

创建模型

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

mysite/code/RecentOrders.php

<?php

class DashboardRecentOrdersPanel extends DashboardPanel {

  private static $db = array (
    '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 getConfiguration() {
    $fields = parent::getConfiguration();
    $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(array('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 PanelHolder() {
  Requirements::css("mysite/css/dashboard-recent-orders.css");
  return parent::PanelHolder();
}

添加图表以可视化数据

仪表板模块提供了一个 API,用于使用 Google 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