README

论坛小部件

Flarum 核心扩展，用于管理论坛小部件。

安装

请记住，这只是一个论坛小部件编辑器，它实际上并没有包含任何小部件。

使用 composer 安装

composer require afrux/forum-widgets-core:"*"

以下是您可以安装的当前兼容小部件列表

• 在线用户
• 论坛统计
• 顶级发帖者
• 新闻淡入

更新中

composer update afrux/forum-widgets-core:"*"
php flarum migrate
php flarum cache:clear

扩展

希望使用这个小型框架创建小部件的扩展开发者，以下解释了如何注册一个新的小部件，目前您应该为每个扩展只注册一个小部件。

1. 在您的扩展的 composer.json 中需要此扩展

"require": {
  "flarum/core": "^1.0.0",
  "afrux/forum-widgets-core": "^0.1.0"
},

1. 在 common/components 中创建您的小部件组件，通过扩展此包提供的基类 Widget 组件。

import Widget from 'flarum/extensions/afrux-forum-widgets-core/common/components/Widget';

export default class MyWidget extends Widget {
  className() {
    // Custom class name.
    // You can also use the class "AfruxWidgets-Widget--flat" for a flat widget (not contained in a block).
    // Please avoid strong custom styling so that it looks consistent in other themes.
    return 'MyWidget';
  }

  icon() {
    // Widget icon.
    return 'fas fa-cirlce';
  }

  title() {
    // Widget title.
    // Can return empty for a titleless widget.
    return app.translator.trans('afrux-online-users-widget.forum.widget.title');
  }

  content() {
    return (
      <div className="Afrux-OnlineUsersWidget-users">
        // ...
      </div>
    );
  }
}

1. 在管理和论坛前端注册您的组件

• 在 common 中创建一个新的 registerWidget.js 文件

import Widgets from 'flarum/extensions/afrux-forum-widgets-core/common/extend/Widgets';

import MyWidget from './components/MyWidget';

export default function(app) {
  (new Widgets).add({
    key: 'onlineUsers',
    component: MyWidget,
    
    // Can be a callback that returns a boolean value.
    // example: () => app.forum.attribute('myCustomExtension.mySetting')
    isDisabled: false,
    
    // Is this a one time use widget ? leave true if you don't know.
    isUnique: true,
    
    // The following values are default values that can be changed by the admin.
    placement: 'end',
    position: 1,
  }).extend(app, 'my-extension-id');
};

• 在两个前端 admin/index.js & forum/index.js 中注册小部件

import registerWidget from '../common/registerWidget';

app.initializers.add('my-extension-id', () => {
  registerWidget(app);
});

1. 如果您正在使用 TypeScript，您可以通过在 tsconfig.json 文件中的 paths 键中添加以下内容来添加此包的类型定义

"flarum/extensions/afrux-forum-widgets-core/*": ["../vendor/afrux/forum-widgets-core/js/dist-typings/*"]

您还可以检查 Afrux GitHub 组织中的其他示例小部件。

链接

• Packagist
• GitHub
• 讨论