CN117608568A - 配置界面生成方法、装置、设备及存储介质 - Google Patents
配置界面生成方法、装置、设备及存储介质 Download PDFInfo
- Publication number
- CN117608568A CN117608568A CN202311349507.3A CN202311349507A CN117608568A CN 117608568 A CN117608568 A CN 117608568A CN 202311349507 A CN202311349507 A CN 202311349507A CN 117608568 A CN117608568 A CN 117608568A
- Authority
- CN
- China
- Prior art keywords
- interface
- data
- configuration
- configuration information
- target structure
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 60
- 238000000547 structure data Methods 0.000 claims description 51
- 238000009877 rendering Methods 0.000 claims description 34
- 238000012986 modification Methods 0.000 claims description 18
- 230000004048 modification Effects 0.000 claims description 18
- 230000008569 process Effects 0.000 claims description 14
- 230000004044 response Effects 0.000 claims description 9
- 238000000605 extraction Methods 0.000 claims description 7
- 238000013507 mapping Methods 0.000 claims description 7
- 238000011161 development Methods 0.000 abstract description 11
- 238000013461 design Methods 0.000 abstract description 4
- 238000010586 diagram Methods 0.000 description 12
- 238000006243 chemical reaction Methods 0.000 description 8
- 230000006870 function Effects 0.000 description 8
- 238000005516 engineering process Methods 0.000 description 6
- 238000012795 verification Methods 0.000 description 4
- 238000012546 transfer Methods 0.000 description 3
- 230000009286 beneficial effect Effects 0.000 description 2
- 238000007796 conventional method Methods 0.000 description 2
- 238000007726 management method Methods 0.000 description 2
- 238000012545 processing Methods 0.000 description 2
- 230000006399 behavior Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 230000008094 contradictory effect Effects 0.000 description 1
- 238000013499 data model Methods 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000002035 prolonged effect Effects 0.000 description 1
- 230000008707 rearrangement Effects 0.000 description 1
- 230000003068 static effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44505—Configuring for program initiating, e.g. using registry, configuration files
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Abstract
本申请提供了一种配置界面生成方法、装置、设备及存储介质,涉及前端界面设计领域,解决了生成配置界面耗时长且繁琐的问题,本申请方案能对应量多且复杂的需求时快速生成对应的配置界面,有效地减少开发人员的开发耗时。
Description
技术领域
本申请涉及前端界面设计领域,尤其涉及一种配置界面生成方法、装置、设备及存储介质。
背景技术
随着互联网的发展,前端技术不断迭代更新,从最开始的原生javaScript编写界面,到后来出现React、Vue、Angular等前端框架,在前端的配置界面所采用的技术越来越繁杂。为了优化界面,人们又开发了Ant Design、Bootstrap等UI(User Interface,用户界面)框架。所以对于嵌入式开发人员来说,要想生成嵌入式软件调试配置界面需要学习React、Vue、jsvaScript、html(HyperText Markup Language,超文本标记语言)、css(CascadingStyle Sheets,层叠样式表)等等很多前端知识,前端设计的学习成本越来越高。
但是有时候需求仅仅是一个简单的调试配置界面,不需要很多复杂的功能,对开发人员来说学习多种前端知识的成本就显得很高。而且生成嵌入式软件调试配置界面的传统做法是根据需求编写html渲染结构、css调整样式、javascript实现功能和填入数据。进而导致开发人员在生成配置界面时,需要学习大量的前端知识并且按照上述的做法编写代码,当出现量多且复杂的需求以需要生成其他配置界面时,开发人员需要编写大量且重复的代码,浪费了很多时间,使得开发周期长,提高了开发成本。
发明内容
本申请提供了一种配置界面生成方法、设备、装置及存储介质,解决了生成配置界面耗时长且繁琐的问题,能对应量多且复杂的需求时快速生成对应的配置界面,有效地减少开发人员的开发耗时。
第一方面,本申请提供一种配置界面生成方法,配置界面包括菜单子界面和表单子界面,该方法包括:
在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作;
根据节数据集合中存储的节数据,绘制菜单子界面,菜单子界面中排列有若干个与节数据对应的属性参数;
响应于对菜单子界面上的属性参数的选取操作,获取属性参数对应的节数据中的配置信息,以将配置信息转换为关联于AMIS框架的目标结构数据;
基于目标结构数据,调用AMIS组件渲染表单子界面;
在渲染完成后,调用第一应用程序接口获取初始数据,以对表单子界面进行初始化设置。
第二方面,本申请还提供一种配置界面生成装置,配置界面包括菜单子界面和表单子界面,配置界面生成装置包括:
信息获取模块,配置为在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作;
界面绘制模块,配置为根据节数据集合中存储的节数据,绘制菜单子界面,菜单子界面中排列有若干个与节数据对应的属性参数;
操作响应模块,配置为响应于对菜单子界面上的属性参数的选取操作,获取属性参数对应的节数据中的配置信息,以将配置信息转换为关联于AMIS框架的目标结构数据;
界面渲染模块,配置为基于目标结构数据,调用AMIS组件渲染表单子界面;
界面设置模块,配置为在渲染完成后,调用第一应用程序接口获取初始数据,以对表单子界面进行初始化设置。
第三方面,本申请还提供了一种电子设备,其包括:
一个或多个处理器;
存储装置,用于存储一个或多个程序,当一个或多个程序被一个或多个处理器执行,使得一个或多个处理器实现如上述的配置界面生成方法。
第四方面,本申请还提供了一种存储介质,存储有计算机可执行指令,计算机可执行指令在由处理器执行时用于执行如上述的配置界面生成方法。
本申请方案可通过节数据集合对开发人员输入的配置信息进行存储,以在渲染配置界面时基于AMIS框架对配置信息进行转化,从而根据转换后的数据进行渲染,以得到所需要的配置界面,无需开发人员编写大量重复的代码,而且对于所需要生成的配置界面较多的情况,开发人员通过输入满足预设置格式的配置信息,即可实现对配置界面的渲染,有效地减少了开发人员的开发耗时。
附图说明
图1为本申请一实施例提供的配置界面生成方法的步骤示意图;
图2为本申请一实施例提供的数据转换的步骤示意图;
图3为本申请一实施例提供的生成目标结构数据的步骤示意图;
图4为本申请一实施例提供的对表单子界面进行初始化设置的步骤示意图;
图5为本申请一实施例提供的配置界面生成装置的结构示意图;
图6为本申请一实施例提供的电子设备的结构示意图。
具体实施方式
下面结合附图和实施例对本申请实施例作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅用于解释本申请实施例,而非对本申请实施例的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本申请实施例相关的部分而非全部结构,本领域技术人员在阅读本申请说明书后,应该能够想到,只要技术特征不互相矛盾,那么技术特征的任意组合均可以构成可选的实施方式。
本申请的说明书和权利要求书中的术语“第一”、“第二”等是用于区别类似的对象,而不用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便本申请的实施例能够以除了在这里图示或描述的那些以外的顺序实施,且“第一”、“第二”等所区分的对象通常为一类,并不限定对象的个数,例如第一对象可以是一个,也可以是多个。此外,说明书以及权利要求中“和/或”表示所连接对象的至少其中之一,字符“/”,一般表示前后关联对象是一种“或”的关系。在本申请的描述中,“多个”表示两个及以上,“若干”表示一个及以上。
电子设备需要在显示窗口中显示相应的配置界面,以供用户进行输入、登录、保存等操作,如网页的登录界面、注册界面、信息配置界面等。配置界面包括菜单子界面和表单子界面,可以想到的是,菜单子界面上具有多个可供用户选择的选项,以在表单子界面上显示相应的内容。如菜单子界面可以显示于显示窗口的左侧、上侧等位置,而表单子界面则显示于显示窗口中除了菜单子界面外的其余位置,如右侧、下侧等位置。
随着相关技术的发展,前端开发所采用的技术也越来越繁杂,为了更好地为用户呈现相应的配置界面。开发人员需要学习大量的前端知识,而且在面对量多且复杂的需求时,开发人员若是按照传统的做法根据需求编写html渲染结构、css调整样式、javascript实现功能和填入数据来生成配置界面,则需要编写大量且重复的代码,浪费时间做大量重复的工作,而且还使得开发周期延长,提高了开发成本。
为此,本申请提供了一种配置界面生成方法,如图1所示,图1为本申请一实施例提供的配置界面生成方法的步骤示意图,具体步骤如下:
步骤S110、在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作。
节数据集合中包括有若干个节数据,该节数据是按照相应的数据结构存储相关信息的。例如,一个节数据包括用于渲染界面的配置信息和对应节数据的属性参数。其中,一个属性参数可对应若干个节数据。进而将从后端数据源获取的配置信息存储在相应的节数据集合中。因此,开发人员可以根据需求自定义编辑部分配置信息,以使得设备根据相应的配置信息渲染配置界面。
对应地,还创建有第一应用程序接口,以用于执行初始化操作,可以理解的是,第一应用程序接口可提供进行初始化操作的功能函数,以通过调用第一应用程序接口执行初始化操作。
在一些实施例中,为了便于管理,还可以将节数据集合以及第一应用程序接口注册在相应的管理器中,从而能够快速查找和调用。
步骤S120、根据节数据集合中存储的节数据,绘制菜单子界面,菜单子界面中排列有若干个与节数据对应的属性参数。
节数据中携带有对应的属性参数,因此,通过在节数据集合中提取节数据,可确定节数据集合所对应的属性参数,进而在绘制的菜单子界面上将若干个属性参数依序排列,以供选取。可以想到的是,对于不同属性参数的选取,在显示窗口中渲染形成的表单子界面不同。即对应地,在待渲染的表单子界面中可以显示同一属性参数下的若干个节数据的配置信息,以供用户做出相应的操作。
步骤S130、响应于对菜单子界面上的属性参数的选取操作,获取属性参数对应的节数据中的配置信息,以将配置信息转换为关联于AMIS框架的目标结构数据。
可以想到的是,选取操作可以是键控输入操作、触控输入操作等,相应地,在菜单子界面上排列的属性参数可以以可选取的选项显示。对于任一属性参数的选取操作,在获取属性参数对应的节数据中的配置信息后,配置信息需要进行转换,以得到能够进行渲染的目标结构数据,该目标结构数据关联于AMIS框架,即目标结构数据的数据格式对应AMIS框架中的数据格式。AMIS框架是一种基于JSON配置的低代码框架,并提供相应的组件和模板,以便于开发人员可通过简单的JSON配置来定义应用程序的界面和行为。而且配置信息并非符合AMIS框架要求的数据,因此需要将数据进行转换后才能做进一步的界面渲染操作。
步骤S140、基于目标结构数据,调用AMIS组件渲染表单子界面。
步骤S150、在渲染完成后,调用第一应用程序接口获取初始数据,以对表单子界面进行初始化设置。
AMIS组件作为AMIS框架提供的渲染组件,其可以基于目标结构数据执行相应的界面渲染操作,从而渲染生成对应配置信息的表单子界面。而且可以想到的是,配置界面都是具有初始配置的,对应于初始配置的初始数据,其可存储于后端的数据库中。因此,在渲染完成后,表单子界面还需要进行初始化配置,以配置表单子界面上的内容。如在完成渲染后,调用第一应用程序接口,以获取初始数据,从而利用初始数据对表单子界面进行初始化配置。
由上述方案可知,开发人员通过输入满足预设置格式的配置信息,设备则可通过节数据集合对配置信息进行存储,以在渲染配置界面时基于AMIS框架对配置信息进行转化,从而根据转换后的数据进行渲染,以得到所需要的配置界面。无需开发人员编写大量重复的代码,而且对于所需要生成的配置界面较多的情况,开发人员通过输入满足预设置格式的配置信息,即可实现对配置界面的渲染,有效地减少了开发人员的开发耗时。
在一实施例中,对于选取操作的响应,设备在确定所选取的属性参数后,获取相应的节数据以提取配置信息,进而进行数据转换。如图2所示,图2为本申请一实施例提供的数据转换的步骤示意图,具体步骤如下:
步骤S210、基于属性参数,访问节数据集合并从中获取对应的节数据,以提取节数据中的配置信息。
步骤S220、遍历配置信息并将配置信息中的参数映射至目标结构数据的对应项中,以将配置信息转换为目标结构数据。
可以理解的是,由于属性参数与节数据存在对应关系,响应于选取操作,设备通过访问节数据集合以获取配置信息,如基于属性参数从节数据集合中获取对应的节数据,进而提取相应的配置信息。可以想到的是,对于配置信息与目标结构数据两者之间所采用的数据结构不同的情况,例如,配置信息采用JSON格式的数据结构表示,而目标结构数据则采用AMIS框架对应的数据结构表示。对应地,设备遍历配置信息,以将配置信息的参数,如配置信息中定义的字段名、布局类型等参数映射至目标结构数据的对应项中,从而实现数据转化。示例性的,配置信息中的字段名的字符串可以映射至目标结构数据中的输入项中,配置信息中的字段名的数值可以映射至目标结构数据中的数值项。
可以想到的是,开发人员可以通过编辑配置信息完成对配置界面的定制,如在配置信息中添加自定义规范的数据,或修改配置信息中预设置的数据,进而通过上述的数据转换过程将配置信息转换为目标格式数据,以便于进行配置界面的渲染。
图3为本申请一实施例提供的生成目标结构数据的步骤示意图,如图所示,具体步骤如下:
步骤S310、将配置属性数据的参数映射至目标结构数据的对应项中,并判断是否设置有对应UI插件的目标接口。
步骤S320、若存在目标接口,则调用UI插件以获取与目标结构数据的数据结构对应的目标参数。
步骤S330、检查UI数据中所设置的布局类型。
步骤S340、若UI数据的布局类型为第一布局类型,则添加当前布局所需的样式数据并将目标参数合并至目标结构数据。
步骤S350、若UI数据的布局类型为第二布局类型,则将目标参数合并至目标结构数据。
可以理解的是,在一些实施例中,配置信息包括预定义规范的配置属性数据和自定义规范的UI(User Interface,用户界面)数据,其中,配置属性数据作为预定义规范的数据,而UI数据中自定义在表单子界面呈现的元素的整体布局,示例性的,开发人员可在UI数据中自定义布局类型,如需要元素按照垂直方向布局,则可设置对应的类型为垂直布局类型;如需要垂直布局中设置一些元素可水平摆放,则可将水平布局嵌套在垂直布局中。
对配置信息进行转换的过程中,若配置信息是存在UI数据,则再查找是否存在对应UI插件的目标接口。可以想到的是,在数据库中可以通过在相应的接口管理器中注册应用程序接口,以进行接口的管理,因此,通过查询接口管理器确定是否存在目标接口,从而在存在目标接口时,调用UI插件获取与目标结构数据的数据结构对应的目标参数。
而且还对UI数据中所设置的布局类型进行检查。若UI数据的布局类型为第一布局类型,添加当前布局所需要的样式数据并将目标参数合并至目标结构数据。对于存在多组UI数据的情况,对一组数据进行数据转换,通过相应的数组暂存样式数据,再对另一组数据进行数据转换。当然,对于UI数据的布局类型为第二类型的情况,直接将目标参数合并至目标结构数据。
在一实施例中,UI数据中可设置的布局类型包括基础布局类型、分组布局类型、垂直布局类型、水平布局类型和标签类型,其中,第一布局类型包括垂直布局类型、水平布局类型和分组布局类型,第二布局类型包括基础布局类型和标签类型。因此,在确定对应的布局类型后,按照所划分的布局类型,执行相应的操作。
需要说明的是,在一些实施例中,当配置信息包括预定义规范的配置属性数据而不包括自定义规范的UI数据时,设备将配置属性数据的参数映射至目标结构数据的对应项中即可,无需对再UI插件进行查找。
图4为本申请一实施例提供的对表单子界面进行初始化设置的步骤示意图,如图4所示,在第一次渲染完成后,会进入提取配置模式,以设置初始数据。
具体步骤如下:
步骤S410、进入提取配置模式,并创建会话对象,以调用会话对象在接口管理器中查找第一应用程序接口。
步骤S420、调用第一应用程序接口,以调用获取初始数据的获取操作。
步骤S430、在获取初始数据后,基于AMIS组件对表单子界面进行渲染。
可以理解的是,在进入提取配置模式后,创建有一个会话对象,如调用相应的方法或函数创建一个会话对象进而返回AMIS组件,以使AMIS组件调用会话对象在接口管理器中查找第一应用程序接口。接口管理器用于管理和存储应用程序接口,应用程序接口均在接口管理器中注册。查找到第一应用程序接口后,调用第一应用程序接口执行相应的操作从而调用获取初始数据的获取操作。进而,在获取到初始数据后,将数据返回至AMIS组件,从而渲染表单子界面,完成初始化数据的配置。
示例性的,在设备中可通过设置节数据section的节数据集合sections以对各节数据section进行管理,当然对节数据集合sections还可以通过节管理器SectionManager进行管理,而一些应用程序接口也可以通过接口管理器UiSchemaMethodManager进行管理和存储,例如,在接口管理器UiSchemaMethodManager中利用对象数组methods存储各应用程序接口,如第一应用程序接口FormApiForInit、第二应用程序接口FormApiForCommit等。
从后端数据源如Schema数据源中获取的配置信息存储到节数据集合sections中,并且创建第一应用程序接口FormApiForInit。根据节数据集合sections中的节数据section绘制左侧的菜单子界面,在节数据section对应有相应的属性参数path,将不同的属性参数path排列在菜单子界面中,以供选择。
在选择了相应属性参数path后,可通过相应的组件SectionViewRouter访问节管理器SectionManager,经而将属性参数path传递至节管理器SectionManager,以获取在节数据section中存储的配置信息。
在获取到配置信息后,对配置信息进行数据转换。如将配置信息传递至预设置的数据转换器SchemaConvertor中,该数据转换器SchemaConvertor可通过遍历配置信息,从而将配置信息中的参数映射至按照基于AMIS框架规范数据结构的目标结构数据AmisSchema的对应项中。
对于配置信息中包括配置属性信息dateSchema和UI数据uiSchema的情况,将配置属性信息dataSchema转换成我们需要的目标结构数据AmisSchema,目标结构数据AmisSchema可以以数组形式表示,每一个数组元素对应一个表单子界面中的表单元素。而且,数组中可以以Map结构进行保存,其中,Map结构的key值即为表单元素的name,value即为当前表单元素对象。
而UI数据uiSchema需要进一步处理,如可以创建相应的数组以存储转换后的数据。且对于存在UI数据uiSchema的情况,还需要判断是否存在对应UI插件的目标接口UiWidget,可以想到的是,UI插件根据相应的UI数据uiSchema输出相应的满足AMIS架构规范的数据。此外,还需要检查UI数据uiSchema中的布局类型type,若布局类型type为水平布局类型VerticalLayout、垂直布局类型HorizontalLayout或分组类型布局Group,对应地还需要添加当前布局所需要的样式数据,进而暂存于数组中。而对于其他布局类型,如标签类型Label或者基础布局类型Control,则不需要添加相应的样式数据。最后将数组中暂存的数据与对应配置属性信息dataSchema转换后的数据进行合并以传递至AMIS组件中进行渲染。
在渲染完成后,可通过进入提取配置模式fetcher,调用初始数据进行表单子界面的初始化配置。接口管理器UiSchemaMethodManager中可以记录对应创建会话对象httpSession的方法或程序,因此,进入提取配置模式fetcher后,可以由AMIS组件向接口管理器UiSchemaMethodManager要求返回一个会话对象httpSession,以通过调用会话对象httpSession在接口管理器UiSchemaMethodManager中查找第一应用程序接口FormApiForInit,进而执行相应的获取初始化数据的获取操作。将初始化数据返回AMIS组件以对表单子界面进行渲染完成对表单子界面的初始化配置。
在一些实施例中,在第一次渲染完成后,还可以对初始数据进行修改。对此,还创建有第二应用程序接口,用于执行数据的修改和提交操作。与获取初始化数据的过程相似,会话对象还可用于传递修改数据。在获取到该修改数据后,调用第二应用程序接口。
接口管理器用于管理和存储应用程序接口,且应用程序接口均在接口管理器中注册,因此,通过接口管理器查找第二应用程序接口并调用第二应用程序接口。在调用第二应用接口后,利用相应的程序或方法执行对初始数据的修改操作。
示例性的,与初始化配置过程相似,在对初始数据进行修改时,还可以通过调用会话对象httpSession在接口管理器UiSchemaMethodManager中调用第二应用程序接口FormApiForCommit进行数据传递,从而将修改数据传递至存储初始数据的数据模型dataModel并进行数据修改。
在修改数据的过程中,还需要对数据进行验证,即从节管理器SectionManager获取需要验证的节数据section,将节数据section和传递的修改数据传递至表单验证插件FormValidator。可以想到的是,表单验证插件FormValidator作为对表单中的配置数据进行验证的插件,如验证数据长度、数据类型等,其可通过返回的验证结果表示数据是否出错,如返回true表示数据未出错,否则表示出错,从而在表单子界面上显示错误提示。
因此,通过对数据的修改和验证,设备能够在修改初始数据时还能够对修改数据进行验证,以便于在数据不符合要求时,可通过表单子界面做出相应的错误提示,以告知用户重新修订数据。
在一些实施例中,对于初始数据的修改,还存在后端修改的情况,即并非主动修改时,可以利用观察者模式对后端修改的数据进行记录。即在调用AMIS组件的过程中,开启预设置的观察者模式,从而接收后端修改数据并传递至AMIS组件。可以理解的是,在观察者模式中,设置有相应的接口,以在数据更新后进行传递的过程中调用该接口对更改的数据接收并记录。
因此,利用观察者模式对后端修改数据进行记录,以使得表单子界面的配置数据能够跟随后端修改数据进行修改,实现被动改变表单子界面的配置数据的效果。
图5为本申请一实施例提供的配置界面生成装置的结构示意图,该装置用于执行如上述实施例提供的配置界面生成方法,并具备执行方法相应的功能模块和有益效果。其中,配置界面包括菜单子界面和表单子界面。如图所示,该装置包括信息获取模块501、界面绘制模块502、操作响应模块503、界面渲染模块504和界面设置模块505。
信息获取模块501配置为在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作;
界面绘制模块502配置为根据节数据集合中存储的节数据,绘制菜单子界面,菜单子界面中排列有若干个与节数据对应的属性参数;
操作响应模块503配置为响应于对菜单子界面上的属性参数的选取操作,获取属性参数对应的节数据中的配置信息,以将配置信息转换为关联于AMIS框架的目标结构数据;
界面渲染模块504配置为基于目标结构数据,调用AMIS组件渲染表单子界面;
界面设置模块505配置为在渲染完成后,调用第一应用程序接口获取初始数据,以对表单子界面进行初始化设置。
在上述实施例的基础上,操作响应模块503还配置为:
基于属性参数,访问节数据集合并从中获取对应的节数据,以提取节数据中的配置信息;
遍历配置信息并将配置信息中的参数映射至目标结构数据的对应项中,以将配置信息转换为目标结构数据。
在上述实施例的基础上,在配置信息包括预定义规范的配置属性数据和自定义规范的UI数据的情况下,操作响应模块503还配置为:
将配置属性数据的参数映射至目标结构数据的对应项中,并判断是否设置有对应UI插件的目标接口;
若存在目标接口,则调用UI插件以获取与目标结构数据的数据结构对应的目标参数;
检查UI数据中所设置的布局类型;
若UI数据的布局类型为第一布局类型,则添加当前布局所需的样式数据并将目标参数合并至目标结构数据;
若UI数据的布局类型为第二布局类型,则将目标参数合并至目标结构数据。
在上述实施例的基础上,第一布局类型包括垂直布局类型、水平布局类型和分组布局类型,第二布局类型包括基础布局类型和标签类型。
在上述实施例的基础上,界面设置模块505还配置为:
进入提取配置模式,并创建会话对象,以调用会话对象在接口管理器中查找第一应用程序接口,接口管理器用于管理和存储应用程序接口;
调用第一应用程序接口,以调用获取初始数据的获取操作;
在获取初始数据后,基于AMIS组件对表单子界面进行渲染。
在上述实施例的基础上,还创建有第二应用程序接口,以用于执行数据的修改和提交操作,配置界面生成装置还包括修改验证模块,修改验证模块配置为:
调用第二应用程序接口,以在接收通过会话对象传递的修改后的配置数据后对存储的初始数据进行修改;
在修改初始数据的过程,对节数据和修改后的配置数据进行验证,以在数据出错时表单子界面显示错误提示。
在上述实施例的基础上,配置界面生成装置还包括修改记录模块,修改记录模块配置为:
在调用AMIS组件的过程中,开启预设置的观察者模式,以接收后端修改数据并传递至AMIS组件。
值得注意的是,上述配置界面生成装置的实施例中,各模块只是按照功能逻辑进行划分的,但并不局限于上述划分,只要能够实现相应的功能即可;另外,各模块的具体名称也只是为了便于互相区分,并不用于限制本申请的保护范围。
图6为本申请一实施例提供的电子设备的结构示意图,该设备用于执行如上述实施例提供的配置界面生成方法,并具备执行方法相应的功能模块和有益效果。如图所示,其包括处理器601、存储器602、输入装置603和输出装置604。处理器601的数量可以是一个或多个,图中以一个处理器601为例;处理器601、存储器602、输入装置603和输出装置604可以通过总线或其他方式连接,图中以通过总线连接为例。存储器602作为一种计算机可读的存储介质,可用于存储软件程序、计算机可执行程序以及模块,如本申请实施例中的配置界面生成方法对应的程序指令/模块。处理器601通过运行存储在存储器602中的软件程序、指令以及模块,从而执行相应的各种功能应用以及数据处理,即实现上述的配置界面生成方法。
存储器602可主要包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需的应用程序;存储数据区可存储根据使用过程中所记录或创建的数据等。此外,存储器602可以包括高速随机存取存储器,还可以包括非易失性存储器,例如至少一个磁盘存储器件、闪存器件、或其他非易失性固态存储器件。在一些实施例中,存储器602可进一步包括相对于处理器601远程设置的存储器,这些远程设置的存储器可以通过网络连接至终端设备。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
输入装置603可用于向处理器601输入相应的数字或字符信息,以及产生与设备的用户设置以及功能控制有关的键信号输入;输出装置604可用于发送或显示与设备的用户设置以及功能控制有关的键信号输出。
本申请实施例还提供一种存储有计算机可执行指令的存储介质,计算机可执行指令在由处理器执行时用于执行本申请任一实施例提供的配置界面生成方法中的相关操作。
计算机可读的存储介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带、磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。
还需要说明的是,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括要素的过程、方法、商品或者设备中还存在另外的相同要素。
注意,上述仅为本申请的较佳实施例及所运用技术原理。本领域技术人员会理解,本申请不限于这里所述的特定实施例,对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本申请的保护范围。因此,虽然通过以上实施例对本申请进行了较为详细的说明,但是本申请不仅仅限于以上实施例,在不脱离本申请构思的情况下,还可以包括更多其他等效实施例,而本申请的范围由所附的权利要求范围决定。
Claims (10)
1.一种配置界面生成方法,其特征在于,配置界面包括菜单子界面和表单子界面,所述方法包括:
在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作;
根据节数据集合中存储的节数据,绘制所述菜单子界面,所述菜单子界面中排列有若干个与节数据对应的属性参数;
响应于对所述菜单子界面上的属性参数的选取操作,获取所述属性参数对应的节数据中的配置信息,以将所述配置信息转换为关联于AMIS框架的目标结构数据;
基于所述目标结构数据,调用AMIS组件渲染所述表单子界面;
在渲染完成后,调用第一应用程序接口获取初始数据,以对所述表单子界面进行初始化设置。
2.根据权利要求1所述的配置界面生成方法,其特征在于,所述响应于对所述菜单子界面上的属性参数的选取操作,获取所述属性参数对应的节数据中的配置信息,以将所述配置信息转换为关联于AMIS框架的目标结构数据,包括:
基于所述属性参数,访问所述节数据集合并从中获取对应的节数据,以提取所述节数据中的配置信息;
遍历所述配置信息并将所述配置信息中的参数映射至所述目标结构数据的对应项中,以将所述配置信息转换为所述目标结构数据。
3.根据权利要求2所述的配置界面生成方法,其特征在于,在所述配置信息包括预定义规范的配置属性数据和自定义规范的UI数据的情况下,所述遍历所述配置信息并将所述配置信息中的参数映射至所述目标结构数据的对应项中,以将所述配置信息转换为所述目标结构数据,包括:
将所述配置属性数据的参数映射至所述目标结构数据的对应项中,并判断是否设置有对应UI插件的目标接口;
若存在所述目标接口,则调用所述UI插件以获取与所述目标结构数据的数据结构对应的目标参数;
检查所述UI数据中所设置的布局类型;
若所述UI数据的布局类型为第一布局类型,则添加当前布局所需的样式数据并将所述目标参数合并至所述目标结构数据;
若所述UI数据的布局类型为第二布局类型,则将所述目标参数合并至所述目标结构数据。
4.根据权利要求3所述的配置界面生成方法,其特征在于,所述第一布局类型包括垂直布局类型、水平布局类型和分组布局类型,所述第二布局类型包括基础布局类型和标签类型。
5.根据权利要求1所述的配置界面生成方法,其特征在于,所述在渲染完成后,调用第一应用程序接口获取初始数据,以对所述表单子界面进行初始化设置,包括:
进入提取配置模式,并创建会话对象,以调用所述会话对象在接口管理器中查找所述第一应用程序接口,所述接口管理器用于管理和存储应用程序接口;
调用所述第一应用程序接口,以调用获取所述初始数据的获取操作;
在获取所述初始数据后,基于所述AMIS组件对所述表单子界面进行渲染。
6.根据权利要求1或5所述的配置界面生成方法,其特征在于,还创建有第二应用程序接口,以用于执行数据的修改和提交操作,所述方法还包括:
调用所述第二应用程序接口,以在接收通过会话对象传递的修改数据后对存储的所述初始数据进行修改;
在修改所述初始数据的过程,对所述节数据和修改后的配置数据进行验证,以在数据出错时表单子界面显示错误提示。
7.根据权利要求1所述的配置界面生成方法,其特征在于,所述方法还包括:
在调用所述AMIS组件的过程中,开启预设置的观察者模式,以接收后端修改数据并传递至所述AMIS组件。
8.一种配置界面生成装置,其特征在于,配置界面包括菜单子界面和表单子界面,所述装置包括:
信息获取模块,配置为在节数据集合中存储从后端数据源获取的用于渲染界面的配置信息,并创建第一应用程序接口,以用于执行初始化操作;
界面绘制模块,配置为根据节数据集合中存储的节数据,绘制所述菜单子界面,所述菜单子界面中排列有若干个与节数据对应的属性参数;
操作响应模块,配置为响应于对所述菜单子界面上的属性参数的选取操作,获取所述属性参数对应的节数据中的配置信息,以将所述配置信息转换为关联于AMIS框架的目标结构数据;
界面渲染模块,配置为基于所述目标结构数据,调用AMIS组件渲染所述表单子界面;
界面设置模块,配置为在渲染完成后,调用第一应用程序接口获取初始数据,以对所述表单子界面进行初始化设置。
9.一种电子设备,其特征在于,包括:
一个或多个处理器;
存储装置,用于存储一个或多个程序,当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如权利要求1-7中任一项所述的配置界面生成方法。
10.一种存储计算机可执行指令的存储介质,其特征在于,所述计算机可执行指令在由处理器执行时用于执行如权利要求1-7中任一项所述的配置界面生成方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202311349507.3A CN117608568B (zh) | 2023-10-18 | 配置界面生成方法、装置、设备及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202311349507.3A CN117608568B (zh) | 2023-10-18 | 配置界面生成方法、装置、设备及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN117608568A true CN117608568A (zh) | 2024-02-27 |
CN117608568B CN117608568B (zh) | 2024-04-26 |
Family
ID=
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20170006135A1 (en) * | 2015-01-23 | 2017-01-05 | C3, Inc. | Systems, methods, and devices for an enterprise internet-of-things application development platform |
CN114237594A (zh) * | 2021-11-16 | 2022-03-25 | 唯品会(广州)软件有限公司 | 一种表单界面生成方法、装置、系统及可读存储介质 |
CN114706580A (zh) * | 2022-03-30 | 2022-07-05 | 湖南快乐阳光互动娱乐传媒有限公司 | 前端网页开发方法、装置、存储介质和电子设备 |
CN116431118A (zh) * | 2023-04-18 | 2023-07-14 | 上海中通吉网络技术有限公司 | 报表开发方法及装置 |
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20170006135A1 (en) * | 2015-01-23 | 2017-01-05 | C3, Inc. | Systems, methods, and devices for an enterprise internet-of-things application development platform |
CN114237594A (zh) * | 2021-11-16 | 2022-03-25 | 唯品会(广州)软件有限公司 | 一种表单界面生成方法、装置、系统及可读存储介质 |
CN114706580A (zh) * | 2022-03-30 | 2022-07-05 | 湖南快乐阳光互动娱乐传媒有限公司 | 前端网页开发方法、装置、存储介质和电子设备 |
CN116431118A (zh) * | 2023-04-18 | 2023-07-14 | 上海中通吉网络技术有限公司 | 报表开发方法及装置 |
Non-Patent Citations (2)
Title |
---|
GAYATRI: "Low Code Form Builder", Retrieved from the Internet <URL:https://www.dronahq.com/low-code-form-builder/> * |
百度AMIS开发团队: "可视化编辑器", Retrieved from the Internet <URL:https://aisuda.bce.baidu.com/amis/zh-CN/docs/extend/editor> * |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106598591B (zh) | 一种网页动态菜单生成方法及装置 | |
US7610545B2 (en) | Annotations for tracking provenance | |
US8365203B2 (en) | Method for creating a native application for mobile communications device in real-time | |
CN111666526A (zh) | 页面生成方法、装置、设备及存储介质 | |
CN104111826A (zh) | 一种软件项目开发方法及装置 | |
US11797273B2 (en) | System and method for enhancing component based development models with auto-wiring | |
CN106354483B (zh) | 一种数据处理方法、装置及电子设备 | |
Fill | SeMFIS: a flexible engineering platform for semantic annotations of conceptual models | |
US20220374334A1 (en) | Techniques for visual software test automation management | |
CN110297636A (zh) | 一种基于页面配置文件的页面自动生成和参数管理方法、系统和装置 | |
CN110275754A (zh) | 用于用户界面呈现的交互方法、装置、设备及存储介质 | |
CN111581920A (zh) | 文档转换方法、装置、设备及计算机存储介质 | |
Bellucci et al. | Automatic reverse engineering of interactive dynamic web applications to support adaptation across platforms | |
US10776351B2 (en) | Automatic core data service view generator | |
US20200394055A1 (en) | System and method for providing a configurable user interface using a self-describing data system | |
CN114594927A (zh) | 低代码开发方法、装置、系统、服务器及存储介质 | |
CN117608568B (zh) | 配置界面生成方法、装置、设备及存储介质 | |
CN117608568A (zh) | 配置界面生成方法、装置、设备及存储介质 | |
CN115964042A (zh) | 菜单的生成方法及装置、存储介质、电子设备 | |
CN112506943B (zh) | 一种异构数据服务提供方法、装置、设备和介质 | |
CN114063868A (zh) | 一种ai拖拽建模系统、方法、计算机设备及应用 | |
CN116595284B (zh) | 网页系统运行方法、装置、设备、存储介质和程序 | |
Bandelloni et al. | Reverse engineering cross-modal user interfaces for ubiquitous environments | |
US20240037325A1 (en) | Ability to add non-direct ancestor columns in child spreadsheets | |
Tesoriero et al. | Transformation architecture for multi-layered webapp source code generation |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant |