首页 > 技术文章 > Moqui 入门案例

Xmingzi 2017-03-28 17:37 原文

创建第一个组件

第一步:

下载并运行框架

1.1:下载地址:https://github.com/moqui/moqui-framework/releases

1.2:初始化框架:

    使用ant load加载---à使用ant run 运行框架。

       也可以使用gradlew命令,gradlew tasks(这个命令好像是安装gradle)

    然后使用gradlew load---àgradlew run 运行框架。

1.3:访问:

    使用地址localhost:8080并点击左下角的Join Don按钮浏览演示环境。

到这里你已经安装好了moqui,接下来进一步学习吧。

 

 

 

创建一个组件

Moqui依照“配置优于编码”的原则,创建组件就是创建目录。Moqui的组件都在:runtime/component下。(base-component)

现在我们将创建名叫tutorial的组件。

创建如下目录结构:

添加一个界面

制作一个hello world的界面

编码位置为:runtime/component/tutorial/screen/tutorial.xml

<screen require-authentication="false">

<widgets>

<label type="h1"text="Hello world!"/>

</widgets>

</screen>

 

注:screen中的require-authentication=“false”

    这个属性如果为true的话,该页面会被要求授权,也就是出现没有权限访问页面的现象。

    <Widgets>标签中的内容为界面表现的内容。

以子界面的方式挂载

将这个界面放到某个已经存在的界面的子界面中。Moqui中的URI和功能菜单都是以界面的方式驱动的。

我们使用webroot组件的界面作为根界面。(将我们的页面作为Webroot的子界面)webroot的位置为:runtime/component/webroot

我们使用webroot下的screen/webroot/apps.xml界面作为根,在subscreens元素下添加一个subscreens-item元素,如下:

 

 

注:除了这种直接在已存在的界面中使用subscreens-item的方式挂载子界面的  方式外,还可以通过“修改数据库记录”的方式达到挂载子界面的目的。

主要代码如下:

 

 

界面内嵌入内容

1:创建一个HTML文件

    位置:runtime/component/tutorial/screen/tutorial/hello.html

2:在screen/tutorial.xml将HTML页面包含。

使用<render-mode>和<text>(渲染模式为text)标签声明html文件。

如图:

 

 

第二种界面子内容的方式

1:对screen设置include-child-content属性为“true”。目的是声明该页面包含了子内容。

2:在widgets下创建subscreens-active元素。目的是确定界面包含子内容的位置。

 

 

注意:被包含的文件必须放在与这个界面同名的子目录下例如:

 

 

hello.html文件放在了tutorial.xml同名的tutorial下

第二步:

创建第一个实体

一条实体就等价于数据中的一行记录。接下来我们定义一个实体,然后使用实体门面模式去使用实体。

    1:创建一个包含tutorialid和description两个字段的xml实体文件。

位于:runtime/component/tutorial/entity/TutorialEntities.xml如图:

添加一些数据

1:创建一个实体门面的XML文件(为实体添加数据):

    runtime/component/tutorial/data/TutorialData.xml

如图:

 

 

2:使用ant load 或者别的命令load,加载数据。

自动查找表单

在tutorial界面下添加一个子界面的XML文件。

位置:runtime/component/tutorial/screen/tutorial/FindTutorial.xml

 

 

使用URL路径:http://localhost:8080/apps/tutorial/FindTutorial

指定查询字段

如何按照需要展现description呢?

只需要在form-list中的auto-fields-entity之后添加field元素。

添加一个新建表单

1:在FindTutorial.xml添加一个转换,

如图:

这个转换只是调用了create#Tutorial服务,然后跳转回了当前界面。

上面的这个服务的名字由两部分组成,动词#名词

    动词:create,update,store,delete.

    名词:一个有效的实体。

只要写成这个样子,服务门面就会认为这是一个隐式的自动实体服务。

2:添加一个按钮,点击后弹出一个隐藏的容器界面。

在之前创建的FindTutorial界面中,添加容器到widget元素内的form-list元素上面,这样就会在列表表单

 

第三步:

自定义新增服务

上面的transition中使用了create#Tutorial(隐式自动实体服务),下面我们来手动实现一个服务。

定义一个服务,使用默认的自动实体增删改查实现。

位置为:runtime/component/tutorial/service/tutorial/TutorialServices.xml

 

 

Groovy服务

你也可以使用Groovy脚本实现服务可以如下操作:

   

 

注意:这里服务的Type为script,并且使用location指定脚本的位置。

Location后的资源路径在下一章中介绍

Groovy脚本内容:

EntityValuetutorial = ec.entity.makeValue("Tutorial")

tutorial.setAll(context)

if (!tutorial.tutorialId) tutorial.setSequencedIdPrimary()

tutorial.create()

         使用Groovy语言时你会用到Moqui中的ExecutionContext类。可以查询Moqui官方提供的API查询用法:

    官网文档位置为:

       http://www.moqui.org/javadoc/index.html

推荐阅读