OpenStack(kilo)界面dashboard的二次开发(一)-增加Panel

入行到现在对openstack的界面进行过一些定制,现在进行个梳理总结。博文中如有说得不对的地方请大家谅解,同时欢迎大家指正,共同提升。

  • 基本认识

  • 增加Panel

一、基本认识:

openstack的dashboard是允许用户管理openstack资源和服务的一个web接口。openstack的界面相关的代码有三部分:

1、各类控件的基类,页面的通用模板等

1/usr/lib/python2.7/site-packages/horizon

2、界面具体样式,数据获取等

1/usr/share/openstack-dashboard

3、还有个容易被忽略的,登录认证界面

1/usr/lib/python2.7/site-packages/openstack_auth

openstack的菜单总共分为三级,Dashboard、Panelgroup、Panel,分别如下图标记1/2/3所示:

OpenStack(kilo)界面dashboard的二次开发(一)-增加Panel

有了以上认识,接下来就看看如何增加Panel

二、增加Panel

要增加一个panel首先得简单看看代码结构,进入/usr/share/openstack-dashbaord/openstack_dashboard/dashboards目录,会看到如下的结构:

1|--__init__.py
2|--admin
3|--project
4|--identity
5|--router
6|--settings

以上几个文件夹就代表了openstack界面上的几个一级菜单(Dashboard),分别是admin(管理员)、project(项目)、identity(Identity)、settings(设置,这个一级菜单需要点击右上角下拉中的设置才会显示出来)、router(配置文件中将profile_support打开可见,ciso nexus 1000v的管理面板)。现在选择admin进去看看它的目录结构。 

admin

 1admin
2|--__init__.py
3|--aggregates
4|--dashboard.py
5|--defaults
6|--flavors
7|--hypervisors
8|--images
9|--info
10|--instances
11|--metadta_defs
12|--metering
13|--models.py
14|--networks
15|--overview
16|--routers
17|--volumes


仔细研究可以发现这些文件夹都一一对应了管理员(admin)下的各个Panel,首先看看Dashboard的类似于配置文件的东西dashboard.py,它就是描述Dashboard的python文件。


 1|-dashboard.py
2from django.utils.translation import ugettext_lazy as _
3
4import horizon
5
6
7class SystemPanels(horizon.PanelGroup):
8    slug = "admin"
9    name = _("System")
10    panels = ('overview', 'metering', 'hypervisors', 'aggregates',
11              'instances', 'volumes', 'flavors', 'images',
12              'networks', 'routers', 'defaults', 'metadata_defs', 'info')
13
14
15class Admin(horizon.Dashboard):
16    name = _("Admin")
17    slug = "admin"
18    panels = (SystemPanels,)
19    default_panel = 'overview'
20    permissions = ('openstack.roles.admin',)
21
22
23horizon.register(Admin)

浏览一遍该文件可以看到代码结构还是非常清晰的。其中class Admin即是描述管理员Dashboard的类,它继承了horizon(/usr/lib/python2.7/site-packages/horizon)中的Dashboard基类(描述一级菜单的基类),class Admin中有几个属性,分别为name、slug、panels、default_panel、permissions,根据基类提供的信息可以知道它们分别代表的是名称、id、该Dashboard下的panels、默认panel、权限。除此之外,还有一个class SystemPanels,可以看到它是继承horizon中的PanelGroup,根据openstack三级菜单结构可以知道它应该就是描述的二级菜单了,class SystemPanels有slug、name、panels三个属性,分别代表的是id、名称、属于它的panel。最后有一个horizon.register就是注册Dashboard了。现在看来,如果要增加一个panel到Admin这个菜单下面,无非需要做两步:

1、一个描述panel的文件夹;

2、在这个class SystemPanels下的panels属性中增加一个panel的id。

接下来就要看看代表panel的文件夹下有什么东西了。进入instances(实例)文件夹,目录结构如下:

1|--instances
2  |--forms.py
3  |--__init__.py
4  |--panel.py
5  |--tables.py
6  |--templates
7  |--tests.py
8  |--urls.py
9  |--views.py

该文件夹下的东西就是描述Panel instances(实例)的相关文件了。看这文件结构应该就是一个django app了。分别看看各个文件:

forms.py是表单,描述的是弹出框之类的,现在主要目的是增加一个panel,暂且不看。

panel.py应该就是描述这个panel基本信息的文件了,这个必须看看

 1from django.utils.translation import ugettext_lazy as _
2
3import horizon
4
5from openstack_dashboard.dashboards.admin import dashboard
6
7class Instances(horizon.Panel):
8    name = _("Instances")
9    slug = 'instances'
10    permissions = ('openstack.roles.admin', 'openstack.services.compute')
11
12
13dashboard.Admin.register(Instances)

可以看到以上代码结构与dashboard.py是非常类似的。这里class Instances继承了horzion中的Panel这个基类,很明显这就是描述panel的基类了。这Instances现在有三个属性,分别是name(名称)、slug(id)、permissions(权限)。注意最后一行代码,这行代码是import的前面我所说到的dashboard.py。最后一行也就是说Admin的Dashboard类用register方法注册了该panel,层级关系非常清晰。

tables.py顾名思义是描述表格之类的,看看它的代码,(这里省略了部分代码)


 1...
2class AdminInstancesTable(tables.DataTable):
3    TASK_STATUS_CHOICES = (
4        (None, True),
5        ("none", True)
6    )
7    STATUS_CHOICES = (
8        ("active", True),
9        ("shutoff", True),
10        ("suspended", True),
11        ("paused", True),
12        ("error", False),
13        ("rescue", True),
14        ("shelved", True),
15        ("shelved_offloaded", True),
16    )
17    tenant = tables.Column("tenant_name", verbose_name=_("Project"))
18    # NOTE(gabriel): Commenting out the user column because all we have
19    # is an ID, and correlating that at production scale using our current
20    # techniques isn't practical. It can be added back in when we have names
21    # returned in a practical manner by the API.
22    # user = tables.Column("user_id", verbose_name=_("User"))
23    host = tables.Column("OS-EXT-SRV-ATTR:host",
24                         verbose_name=_("Host"),
25                         classes=('nowrap-col',))
26    name = tables.Column("name",
27                         link="horizon:admin:instances:detail",
28                         verbose_name=_("Name"))
29    image_name = tables.Column("image_name",
30                               verbose_name=_("Image Name"))
31    ip = tables.Column(project_tables.get_ips,
32                       verbose_name=_("IP Address"),
33                       attrs={'data-type': "ip"})
34    size = tables.Column(project_tables.get_size,
35                         verbose_name=_("Size"),
36                         attrs={'data-type': 'size'})
37    status = tables.Column(
38        "status",
39        filters=(title, filters.replace_underscores),
40        verbose_name=_("Status"),
41        status=True,
42        status_choices=STATUS_CHOICES,
43        display_choices=project_tables.STATUS_DISPLAY_CHOICES)
44    task = tables.Column("OS-EXT-STS:task_state",
45                         verbose_name=_("Task"),
46                         empty_value=project_tables.TASK_DISPLAY_NONE,
47                         status=True,
48                         status_choices=TASK_STATUS_CHOICES,
49                         display_choices=project_tables.TASK_DISPLAY_CHOICES)
50    state = tables.Column(project_tables.get_power_state,
51                          filters=(title, filters.replace_underscores),
52                          verbose_name=_("Power State"),
53                          display_choices=project_tables.POWER_DISPLAY_CHOICES)
54    created = tables.Column("created",
55                            verbose_name=_("Time since created"),
56                            filters=(filters.parse_isotime,
57                                     filters.timesince_sortable),
58                            attrs={'data-type': 'timesince'})
59    class Meta(object):
60        name = "instances"
61        verbose_name = _("Instances")
62        status_columns = ["status", "task"]
63        table_actions = (project_tables.TerminateInstance,
64                         AdminInstanceFilterAction)
65        row_class = AdminUpdateRow
66        row_actions = (project_tables.ConfirmResize,
67                       project_tables.RevertResize,
68                       AdminEditInstance,
69                       project_tables.ConsoleLink,
70                       project_tables.LogLink,
71                       project_tables.CreateSnapshot,
72                       project_tables.TogglePause,
73                       project_tables.ToggleSuspend,
74                       MigrateInstance,
75                       LiveMigrateInstance,
76                       project_tables.SoftRebootInstance,
77                       project_tables.RebootInstance,
78                       project_tables.TerminateInstance)
79

因为该文件是描述表格的,在这省略了部分代码,只看关键描述表格的这部分。class AdminInstancesTable继承的是DataTable这个基类,看看代码的结构可以很容易看出tables.Column就是描述表格的每一列的,其中class Meta顾名思义是描述该表格的元数据的类。它有表格的名字、动作、表动作等属性。

templates是静态模板,先只看看index.html

1{% extends 'base.html' %}
2{% load i18n %}
3{% block title %}{% trans "Instances" %}{% endblock %}
4
5{% block main %}
6    {{ table.render }}
7{% endblock %}

该模板继承了base.html,然后一个标题块block title、一个主要部分block main,table.render是传过来的值,它就是代表的表格那一块了。

tests.py为测试代码;

urls.py是决定了界面的url;


 1from django.conf.urls import patterns
2from django.conf.urls import url
3
4from openstack_dashboard.dashboards.admin.instances import views
5
6
7INSTANCES = r'^(?P<instance_id>[^/]+)/%s$'
8
9
10urlpatterns = patterns(
11    'openstack_dashboard.dashboards.admin.instances.views',
12    url(r'^$', views.AdminIndexView.as_view(), name='index'),
13    url(INSTANCES % 'update', views.AdminUpdateView.as_view(), name='update'),
14    url(INSTANCES % 'detail', views.DetailView.as_view(), name='detail'),
15    url(INSTANCES % 'console', 'console', name='console'),
16    url(INSTANCES % 'vnc', 'vnc', name='vnc'),
17    url(INSTANCES % 'spice', 'spice', name='spice'),
18    url(INSTANCES % 'rdp', 'rdp', name='rdp'),
19    url(INSTANCES % 'live_migrate', views.LiveMigrateView.as_view(),
20        name='live_migrate'),
21)

该文件每个url对应了views的一个函数或者类,index是描述主页的,其它url是相关功能的url。

views.py处理用户请求,从urls.py中反应过来,获取数据。


 1...
2class AdminIndexView(tables.DataTableView):
3    table_class = project_tables.AdminInstancesTable
4    template_name = 'admin/instances/index.html'
5    page_title = _("Instances")
6
7    def has_more_data(self, table):
8        return self._more
9
10    def get_data(self):
11        ...
12

省略了views.py的部分代码,以后的博文中会对其它的进行描述,现在只是增加panel,只看看描述index页面的类。class AdminIndexView继承的是DataTableView这个类,这个类有table_class、template_name等几个属性,可以比较明显的看出它应该就是为那个表格类服务的了,主要功能就是获取数据,设置页面title、指定静态模板了。

那么现在就可以模仿以上这个结构自行增加一个panel了,构造一个类似的文件夹:


1mypanel
2|--__init__.py
3|--panel.py
4|--tables.py
5|--templates
6  |--mypanel
7    |--index.html
8|--urls.py
9|--views.py

它们代码如下:

1、panel.py

 1import horizon
2
3from openstack_dashboard.dashboards.admin import dashboard
4
5
6class Mypanel(horizon.Panel):
7    name = "mypanel"
8    slug = 'mypanel'
9    permissions = ('openstack.roles.admin', 'openstack.services.compute')
10
11
12dashboard.Admin.register(Mypanel)

2、tables.py

1from horizon import tables
2
3class MypanelTable(tables.DataTable):
4    column1 = tables.Column("column1", verbose_name="column1")
5    class Meta(object):
6        name = "mypaneltable"
7        verbose_name = "mypaneltable"

3、index.html

1{% extends 'base.html' %}
2{% load i18n %}
3{% block title %}{% trans "mypanel" %}{% endblock %}
4
5{% block main %}
6    {{ table.render }}
7{% endblock %}

4、urls.py

 1from django.conf.urls import patterns
2from django.conf.urls import url
3
4from openstack_dashboard.dashboards.admin.mypanel import views
5
6
7
8
9urlpatterns = patterns(
10    'openstack_dashboard.dashboards.admin.mypanel.views',
11    url(r'^$', views.MypanelIndexView.as_view(), name='index'),
12)

5、views.py

 1from horizon import tables
2
3from openstack_dashboard.dashboards.admin.mypanel \
4    import tables as project_tables
5
6class MypanelIndexView(tables.DataTableView):
7    table_class = project_tables.MypanelTable
8    template_name = 'admin/mypanel/index.html'
9    page_title = "mypanel"
10
11    def get_data(self):
12        data = []
13        return data

除此之外,在admin中的dashboard.py加上这个panel的slug。 

- dashboard.py

 1from django.utils.translation import ugettext_lazy as _
2
3import horizon
4
5
6class SystemPanels(horizon.PanelGroup):
7    slug = "admin"
8    name = _("System")
9    panels = ('overview', 'metering', 'hypervisors', 'aggregates',
10              'instances', 'volumes', 'flavors', 'images',
11              'networks', 'routers', 'defaults', 'metadata_defs', 'info','mypanel')  #加到属性panels下
12
13
14class Admin(horizon.Dashboard):
15    name = _("Admin")
16    slug = "admin"
17    panels = (SystemPanels,)
18    default_panel = 'overview'
19    permissions = ('openstack.roles.admin',)
20
21
22horizon.register(Admin)

然后重启httpd服务,查看页面 

OpenStack(kilo)界面dashboard的二次开发(一)-增加Panel


上一篇:C# RAS生成.NET公钥与私钥以及.NET公钥与私钥转Java公钥私钥类


下一篇:Kubernetes Dashboard安装步骤