CN113821201A - 一种代码开发方法、装置及电子设备和存储介质 - Google Patents
一种代码开发方法、装置及电子设备和存储介质 Download PDFInfo
- Publication number
- CN113821201A CN113821201A CN202111130024.5A CN202111130024A CN113821201A CN 113821201 A CN113821201 A CN 113821201A CN 202111130024 A CN202111130024 A CN 202111130024A CN 113821201 A CN113821201 A CN 113821201A
- Authority
- CN
- China
- Prior art keywords
- target
- component
- code
- end code
- data item
- 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.)
- Withdrawn
Links
- 238000000034 method Methods 0.000 title claims abstract description 55
- 238000011161 development Methods 0.000 title claims abstract description 53
- 238000009877 rendering Methods 0.000 claims abstract description 27
- 238000012800 visualization Methods 0.000 claims description 19
- 238000012986 modification Methods 0.000 claims description 18
- 230000004048 modification Effects 0.000 claims description 18
- 238000012544 monitoring process Methods 0.000 claims description 13
- 238000004590 computer program Methods 0.000 claims description 10
- 230000000007 visual effect Effects 0.000 description 15
- 238000010586 diagram Methods 0.000 description 13
- 230000001360 synchronised effect Effects 0.000 description 8
- 230000006870 function Effects 0.000 description 5
- 238000007405 data analysis Methods 0.000 description 4
- 230000003287 optical effect Effects 0.000 description 4
- 238000004891 communication Methods 0.000 description 3
- 238000013500 data storage Methods 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 238000012545 processing Methods 0.000 description 3
- 239000008186 active pharmaceutical agent Substances 0.000 description 2
- 238000006243 chemical reaction Methods 0.000 description 2
- 230000000694 effects Effects 0.000 description 2
- 230000010354 integration Effects 0.000 description 2
- 230000003993 interaction Effects 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 238000012546 transfer Methods 0.000 description 2
- 230000009466 transformation Effects 0.000 description 2
- 239000004606 Fillers/Extenders Substances 0.000 description 1
- 230000006399 behavior Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 239000012769 display material Substances 0.000 description 1
- 238000013507 mapping Methods 0.000 description 1
- 238000004806 packaging method and process Methods 0.000 description 1
- 230000008569 process Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
Images
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/34—Graphical or visual programming
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
-
- 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/33—Intelligent editors
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开了一种代码开发方法、装置及一种电子设备和计算机可读存储介质，该方法包括：接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；将所述前端代码和所述后端代码部署于云端。本申请提供的代码开发方法，实现了各***之间的数据互通，提高了代码开发效率。
Description
技术领域
本申请涉及计算机技术领域，更具体地说，涉及一种代码开发方法、装置及一种电子设备和一种计算机可读存储介质。
背景技术
在当前大数据时代，各个企业均面临数智化转型，如何将云端存储的大数据进行分析及可视化展示，如何解决企业难以满足的可视化大屏定制需求，成为企业数智化转型成功与否的关键。
低代码开发工具(Low-Code Development)指无需编码，或只需要少量代码，就可以快速生成应用程序的软件开发模式。在相关技术中，低代码开发工具多用于构建单一***，各***之间数据无法互通、难以实现一体化的数据分析和实时呈现，代码开发效率较低。
因此，如何实现各***之间的数据互通、提高代码开发效率是本领域技术人员需要解决的技术问题。
发明内容
本申请的目的在于提供一种代码开发方法、装置及一种电子设备和一种计算机可读存储介质，实现了各***之间的数据互通，提高了代码开发效率。
为实现上述目的，本申请提供了一种代码开发方法，包括：
接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
将所述前端代码和所述后端代码部署于云端。
其中，所述接收目标组件的拖拽命令之后，还包括：
显示所述目标组件的默认参数信息；
相应的，所述方法还包括：
若接收到已渲染页面中组件的点击命令，则显示所述组件的当前参数信息；
通过输入组件接收配置指令，根据所述配置指令对所述当前参数信息进行更新。
其中，所述数据源地址具体为目标数据库的地址或目标服务器的地址，所述根据所述数据源地址获取所述目标数据项，包括：
通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项。
其中，所述通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项之后，还包括：
对获取到的所述目标数据项进行格式化处理，并将格式化处理后的数据转换为JSON格式，以渲染页面。
其中，所述目标数据项具体为目标数据指标的监控数据，所述目标组件具体为目标可视化组件；
相应的，所述基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面包括：
基于所述目标可视化组件的参数信息在页面中渲染所述目标可视化组件，并利用所述目标可视化组件显示所述目标数据指标的监控数据。
其中，将所述前端代码和所述后端代码部署于云端之前，还包括：
输出所有所述Restful接口对应的代码；
通过输入组件接收第一修改指令，根据所述第一修改指令对所述Restful接口对应的代码进行修改。
其中，将所述前端代码和所述后端代码部署于云端之前，还包括：
输出所述前端代码和所述后端代码；
通过输入组件接收第二修改指令，根据所述第二修改指令对所述前端代码和/或所述后端代码进行修改。
为实现上述目的，本申请提供了一种代码开发装置，包括：
第一生成模块，用于接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
第二生成模块，用于为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
渲染模块，用于根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
部署模块，用于将所述前端代码和所述后端代码部署于云端。
为实现上述目的，本申请提供了一种电子设备，包括：
存储器，用于存储计算机程序；
处理器，用于执行所述计算机程序时实现如上述代码开发方法的步骤。
为实现上述目的，本申请提供了一种计算机可读存储介质，所述计算机可读存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现如上述代码开发方法的步骤。
通过以上方案可知，本申请提供的一种代码开发方法，包括：接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；将所述前端代码和所述后端代码部署于云端。
本申请提供的代码开发方法，目标用户可以在操作界面中通过拖拽命令进行页面布局，通过配置数据源地址和目标数据项从数据库或其他***的服务器中拉取数据，实现了各***之间的数据互通。进一步的，本申请基于目标组件的参数信息、配置的数据源地址和目标数据项自动生成前端代码和后端代码，提高了代码开发效率。本申请还公开了一种代码开发装置及一种电子设备和一种计算机可读存储介质，同样能实现上述技术效果。
应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本申请。
附图说明
为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。附图是用来提供对本公开的进一步理解，并且构成说明书的一部分，与下面的具体实施方式一起用于解释本公开，但并不构成对本公开的限制。在附图中：
图1为根据一示例性实施例示出的一种代码开发方法的流程图；
图2为根据一示例性实施例示出的一种代码开发***的架构图；
图3为根据一示例性实施例示出的一种大屏编辑器的操作界面示意图；
图4为根据一示例性实施例示出的一种代码开发装置的结构图；
图5为根据一示例性实施例示出的一种电子设备的结构图。
具体实施方式
下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述。显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。另外，在本申请实施例中，“第一”、“第二”等是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。
本申请实施例公开了一种代码开发方法，实现了各***之间的数据互通，提高了代码开发效率。
参见图1，根据一示例性实施例示出的一种代码开发方法的流程图，如图1所示，包括：
S101：接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
本实施例的目的在于为用户提供可视化的大屏编辑器，并根据用户的操作行为与画布的页面布局自动生成相应的前端代码。在本步骤中，用户在操作界面中拖拽目标组件至目标位置，基于此自动生成前端代码。
作为一种可行的实施方式，本步骤之前，还包括：在布局模板库中选择目标模板，并显示所述目标模板包含的所有组件。在具体实施中，目标用户可以根据需求在布局模板库中选中所需的模板，也可选择自定义布局，操作后，画布中会展示相应的布局，给出占位区域提示，并提供参考线标尺来辅助用户布局。选中模板后，即可根据具体需要展示的数据信息类型，布局模板库主要深入不同应用场景为用户提供相应的一些布局解决方案，从布局组件库中选择基础组件与可视化组件。基础组件库可使用如ElementUI等现有的UI(UserInterface，界面)组件库或直接使用JavaScript进行组件封装开发，可视化组件可以包括柱形图、条形图、折线图、面积图、饼图、双轴图、甘特图及地图等图表类型，用户可以拖拽目标组件进入画布容器中，大屏编辑器会监听拖拽(Drag)结束事件，获取组件的定位坐标(x,y)等渲染相关的信息，输出给画布渲染器用于渲染组件。
作为一种优选实施方式，所述接收目标组件的拖拽命令之后，还包括：显示所述目标组件的默认参数信息；相应的，所述方法还包括：若接收到已渲染页面中组件的点击命令，则显示所述组件的当前参数信息；通过输入组件接收配置指令，根据所述配置指令对所述当前参数信息进行更新。在具体实施中，当目标用户拖拽或选中模板或组件时，会加载该模板或组件的当前参数信息，例如背景图、颜色、尺寸、位置等，并显示在参数配置区中，目标用户可以通过输入组件对模板或组件的当前参数信息进行修改。
进一步的，可以设置视图存储器用于存储用户操作生成的可视化大屏页面的前端代码，后续用于源码输出及页面绘制，便于用户对代码进行功能扩展。
S102：为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
在本实施例中，数据链接器作为转接模块，连接大屏编辑器与数据源，本实施例中的数据源既可以为数据库，也可以为其他***的的服务器，也即所述数据源地址具体为目标数据库的地址或目标服务器的地址。作为一种可行的实施方式，数据链接器可以通过Restful(Representational State Transfer，一种网络应用程序的设计风格和开发方式)接口连接其他***的的服务器，也即，所述根据所述数据源地址获取所述目标数据项，包括：通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项。
优选的，对获取到的所述目标数据项进行格式化处理，并将格式化处理后的数据转换为JSON格式，以渲染页面。在具体实施中，目标用户配置数据源地址、请求前缀、需要请求的目标数据项等信息。其中，数据源地址用于数据链接器连接数据源，请求前缀用于前端代码向数据链接器获取数据使用。数据链接器根据目标用户的配置，获取所有数据源地址并连接至各***的数据库或服务器。在此基础上根据各***具体需要展示的节点数据，分别从各***的数据库或服务器获取数据。数据链接器将对获取的数据进行格式化处理，并将其装换为JSON格式并生成平台内部的数据请求接口。数据将输出给大屏展示器用于数据回填，数据接口将输出给代码扩展器反馈给用户。可视化大屏在加载页面时，根据数据链接器提供的接口初始化数据，数据链接器在初始化时则根据数据源地址及各数据接口请求相应的数据；后续服务器或数据库中的数据更新时，则通过数据订阅推送技术(如webSocket)更新页面渲染。
进一步的，可以设置数据存储器用于用户数据的本地临时存储，记录用户的使用状态、大屏展示状态等信息，如自定义添加了对某一数据指标的监控图等。数据存储器将可视化大屏的配置信息与接口转换映射信息存储在平台服务器中。
作为一种具体的实施实施方式，所述目标数据项具体为目标数据指标的监控数据，所述目标组件具体为目标可视化组件；相应的，所述基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面包括：基于所述目标可视化组件的参数信息在页面中渲染所述目标可视化组件，并利用所述目标可视化组件显示所述目标数据指标的监控数据。在具体实施中，用户可以仅从一个目标***中获取数据并对其进行必要的指标可视化监控，即利用目标可视化组件对目标数据指标进行监控。需要说明的是，用户可以根据需求添加多个***，通过数据链接器获取各个***的后台数据，并对其数据指标进行可视化呈现及一体化的数据分析。
S103：根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
在本步骤中，画布渲染器从大屏编辑器获取目标组件的参数信息、从数据链接器中获取目标数据项，在画布上实时渲染绘制出相应的可视化大屏页面。目标用户可以根据需求选择将大屏渲染页面导出为图片，用作宣传海报或展示材料。
S104：将所述前端代码和所述后端代码部署于云端。
在本步骤中，根据前端代码和后端代码在IDE(集成开发环境，IntegratedDevelopment Environment)中执行打包和上传命令，自动传输、同步代码到代码托管云中，自动CI/CD(持续集成Continuous Integration和持续交付Continuous Delivery)，并将代码部署到云端。
需要说明的是，本实施例还可以提供代码扩展功能，即本步骤之前，还包括：输出所有所述Restful接口对应的代码；通过输入组件接收第一修改指令，根据所述第一修改指令对所述Restful接口对应的代码进行修改。输出所述前端代码和所述后端代码；通过输入组件接收第二修改指令，根据所述第二修改指令对所述前端代码和/或所述后端代码进行修改。在具体实施中，可以输出前端代码、后端代码和连接数据库或服务器的所有Restful接口，采用全源码交付模式，目标用户可以对输出的代码进行二次开发。目标用户根据需求查询对应的API(Application Programming Interface，应用程序接口)接口文件，使用接口请求数据进行定制化开发。
本申请实施例提供的代码开发方法，目标用户可以在操作界面中通过拖拽命令进行页面布局，通过配置数据源地址和目标数据项从数据库或其他***的服务器中拉取数据，实现了各***之间的数据互通。进一步的，本申请实施例基于目标组件的参数信息、配置的数据源地址和目标数据项自动生成前端代码和后端代码，提高了代码开发效率。
下面对本申请提供的一种具体的应用场景进行介绍，代码开发***如图2所示，包括代码扩展器、大屏编辑器、画布渲染器、视图存储器、数据链接器、数据存储器和代码构建器。
代码扩展器用于目标用户对本发明的输出程序源码进行二次开发。该模块会收集汇总程序源码中的所有API，并将其暴露给用户，用户可根据需求获取数据，进行定制化需求的开发。
大屏编辑器的操作界面示意图如图3所示，主要包括布局模板库、基础组件库、可视化组件库、画布、模板和组件的参数配置等子模块，具有根据界面可视化操作生成前端代码的功能。首先，用户在布局模板库选中所需的模板，也可自定义布局；选中模板后，即可根据具体需要展示的数据信息类型，在组件库中选择需要的基础组件与可视化组件，通过“拖拉拽”的方式将其拖放在画布上的目标位置；与此同时，选中的模板或组件的参数信息与该节点的数据结构将展示在界面右侧的参数配置区域；画布会提供参考线标尺来辅助用户布局；特别的，大屏编辑器模块包含***集成功能，可以通过数据链接器获取不同***的监控数据，对其数据指标进行可视化呈现及一体化的数据分析。
画布渲染器根据组件的拖拽位置坐标及参数配置等信息，在画布上实时渲染出相应的可视化大屏示范效果，可以将某一时刻的大屏渲染页面实时导出为图片。
视图存储器用于生成并存储可视化界面的UI代码，后续用于源码输出，便于用户对代码进行功能扩展。
数据链接器连接可视化大屏与数据源，作为可视化大屏UI界面与跨***后台服务的转接模块，进行数据和接口的转换。本发明中，数据链接器既可以直接连接数据库，也可通过Restful接口连接目标***的服务端进行数据获取，并输出JSON格式的Restful数据，供前端代码统一调用；同时，借助微服务架构与容器化思想，数据链接器可以根据用户需求同时连接到多个***的数据库或服务器，辅助大屏编辑器对不同***数据进行统一的数据分析呈现。
数据存储器用于用户数据的本地临时存储，记录用户的使用状态等信息，如自定义添加了对某一数据指标的监控图等；当数据有变动时，通过数据链接器同步数据库或服务器的数据；
代码构建器根据大屏编辑器生成的前端代码及数据链接器生成的后端代码，在IDE中执行命令，自动传输、同步代码到代码托管云中，自动CI/CD，并将代码部署到云端。
下面对本申请实施例提供的一种代码开发装置进行介绍，下文描述的一种代码开发装置与上文描述的一种代码开发方法可以相互参照。
参见图4，根据一示例性实施例示出的一种代码开发装置的结构图，如图4所示，包括：
第一生成模块401，用于接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
第二生成模块402，用于为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
渲染模块403，用于根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
部署模块404，用于将所述前端代码和所述后端代码部署于云端。
本申请实施例提供的代码开发装置，目标用户可以在操作界面中通过拖拽命令进行页面布局，通过配置数据源地址和目标数据项从数据库或其他***的服务器中拉取数据，实现了各***之间的数据互通。进一步的，本申请实施例基于目标组件的参数信息、配置的数据源地址和目标数据项自动生成前端代码和后端代码，提高了代码开发效率。
在上述实施例的基础上，作为一种优选实施方式，还包括：
第一显示模块，用于显示所述目标组件的默认参数信息；
第二显示模块，用于若接收到已渲染页面中组件的点击命令，则显示所述组件的当前参数信息；
更新模块，用于通过输入组件接收配置指令，根据所述配置指令对所述当前参数信息进行更新。
在上述实施例的基础上，作为一种优选实施方式，所述数据源地址具体为目标数据库的地址或目标服务器的地址，所述渲染模块403包括：
获取单元，用于通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项；
渲染单元，用于基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面。
在上述实施例的基础上，作为一种优选实施方式，所述渲染模块403还包括：
转换单元，用于对获取到的所述目标数据项进行格式化处理，并将格式化处理后的数据转换为JSON格式，以渲染页面。
在上述实施例的基础上，作为一种优选实施方式，所述目标数据项具体为目标数据指标的监控数据，所述目标组件具体为目标可视化组件；
相应的，所述渲染单元具体为基于所述目标可视化组件的参数信息在页面中渲染所述目标可视化组件，并利用所述目标可视化组件显示所述目标数据指标的监控数据的单元。
在上述实施例的基础上，作为一种优选实施方式，还包括：
第一输出模块，用于输出所有所述Restful接口对应的代码；
第一修改模块，用于通过输入组件接收第一修改指令，根据所述第一修改指令对所述Restful接口对应的代码进行修改。
在上述实施例的基础上，作为一种优选实施方式，还包括：
第二输出模块，用于输出所述前端代码和所述后端代码；
第二修改模块，用于通过输入组件接收第二修改指令，根据所述第二修改指令对所述前端代码和/或所述后端代码进行修改。
关于上述实施例中的装置，其中各个模块执行操作的具体方式已经在有关该方法的实施例中进行了详细描述，此处将不做详细阐述说明。
基于上述程序模块的硬件实现，且为了实现本申请实施例的方法，本申请实施例还提供了一种电子设备，图5为根据一示例性实施例示出的一种电子设备的结构图，如图5所示，电子设备包括：
通信接口1，能够与其它设备比如网络设备等进行信息交互；
处理器2，与通信接口1连接，以实现与其它设备进行信息交互，用于运行计算机程序时，执行上述一个或多个技术方案提供的代码开发方法。而所述计算机程序存储在存储器3上。
当然，实际应用时，电子设备中的各个组件通过总线***4耦合在一起。可理解，总线***4用于实现这些组件之间的连接通信。总线***4除包括数据总线之外，还包括电源总线、控制总线和状态信号总线。但是为了清楚说明起见，在图5中将各种总线都标为总线***4。
本申请实施例中的存储器3用于存储各种类型的数据以支持电子设备的操作。这些数据的示例包括：用于在电子设备上操作的任何计算机程序。
可以理解，存储器3可以是易失性存储器或非易失性存储器，也可包括易失性和非易失性存储器两者。其中，非易失性存储器可以是只读存储器(ROM，Read Only Memory)、可编程只读存储器(PROM，Programmable Read-Only Memory)、可擦除可编程只读存储器(EPROM，Erasable Programmable Read-Only Memory)、电可擦除可编程只读存储器(EEPROM，Electrically Erasable Programmable Read-Only Memory)、磁性随机存取存储器(FRAM，ferromagnetic random access memory)、快闪存储器(Flash Memory)、磁表面存储器、光盘、或只读光盘(CD-ROM，Compact Disc Read-Only Memory)；磁表面存储器可以是磁盘存储器或磁带存储器。易失性存储器可以是随机存取存储器(RAM，Random AccessMemory)，其用作外部高速缓存。通过示例性但不是限制性说明，许多形式的RAM可用，例如静态随机存取存储器(SRAM，Static Random Access Memory)、同步静态随机存取存储器(SSRAM，Synchronous Static Random Access Memory)、动态随机存取存储器(DRAM，Dynamic Random Access Memory)、同步动态随机存取存储器(SDRAM，SynchronousDynamic Random Access Memory)、双倍数据速率同步动态随机存取存储器(DDRSDRAM，Double Data Rate Synchronous Dynamic Random Access Memory)、增强型同步动态随机存取存储器(ESDRAM，Enhanced Synchronous Dynamic Random Access Memory)、同步连接动态随机存取存储器(SLDRAM，SyncLink Dynamic Random Access Memory)、直接内存总线随机存取存储器(DRRAM，Direct Rambus Random Access Memory)。本申请实施例描述的存储器2旨在包括但不限于这些和任意其它适合类型的存储器。
上述本申请实施例揭示的方法可以应用于处理器2中，或者由处理器2实现。处理器2可能是一种集成电路芯片，具有信号的处理能力。在实现过程中，上述方法的各步骤可以通过处理器2中的硬件的集成逻辑电路或者软件形式的指令完成。上述的处理器2可以是通用处理器、DSP，或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。处理器2可以实现或者执行本申请实施例中的公开的各方法、步骤及逻辑框图。通用处理器可以是微处理器或者任何常规的处理器等。结合本申请实施例所公开的方法的步骤，可以直接体现为硬件译码处理器执行完成，或者用译码处理器中的硬件及软件模块组合执行完成。软件模块可以位于存储介质中，该存储介质位于存储器3，处理器2读取存储器3中的程序，结合其硬件完成前述方法的步骤。
处理器2执行所述程序时实现本申请实施例的各个方法中的相应流程，为了简洁，在此不再赘述。
在示例性实施例中，本申请实施例还提供了一种存储介质，即计算机存储介质，具体为计算机可读存储介质，例如包括存储计算机程序的存储器3，上述计算机程序可由处理器2执行，以完成前述方法所述步骤。计算机可读存储介质可以是FRAM、ROM、PROM、EPROM、EEPROM、Flash Memory、磁表面存储器、光盘、或CD-ROM等存储器。
本领域普通技术人员可以理解：实现上述方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成，前述的程序可以存储于一计算机可读取存储介质中，该程序在执行时，执行包括上述方法实施例的步骤；而前述的存储介质包括：移动存储设备、ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。
或者，本申请上述集成的单元如果以软件功能模块的形式实现并作为独立的产品销售或使用时，也可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请实施例的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台电子设备(可以是个人计算机、服务器、或者网络设备等)执行本申请各个实施例所述方法的全部或部分。而前述的存储介质包括：移动存储设备、ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。
以上所述，仅为本申请的具体实施方式，但本申请的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以所述权利要求的保护范围为准。
Claims (10)
1.一种代码开发方法，其特征在于，包括：
接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
将所述前端代码和所述后端代码部署于云端。
2.根据权利要求1所述代码开发方法，其特征在于，所述接收目标组件的拖拽命令之后，还包括：
显示所述目标组件的默认参数信息；
相应的，所述方法还包括：
若接收到已渲染页面中组件的点击命令，则显示所述组件的当前参数信息；
通过输入组件接收配置指令，根据所述配置指令对所述当前参数信息进行更新。
3.根据权利要求1所述代码开发方法，其特征在于，所述数据源地址具体为目标数据库的地址或目标服务器的地址，所述根据所述数据源地址获取所述目标数据项，包括：
通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项。
4.根据权利要求3所述代码开发方法，其特征在于，所述通过Restful接口从所述目标数据库或所述目标服务器中获取所述目标数据项之后，还包括：
对获取到的所述目标数据项进行格式化处理，并将格式化处理后的数据转换为JSON格式，以渲染页面。
5.根据权利要求3所述代码开发方法，其特征在于，所述目标数据项具体为目标数据指标的监控数据，所述目标组件具体为目标可视化组件；
相应的，所述基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面包括：
基于所述目标可视化组件的参数信息在页面中渲染所述目标可视化组件，并利用所述目标可视化组件显示所述目标数据指标的监控数据。
6.根据权利要求3所述代码开发方法，其特征在于，将所述前端代码和所述后端代码部署于云端之前，还包括：
输出所有所述Restful接口对应的代码；
通过输入组件接收第一修改指令，根据所述第一修改指令对所述Restful接口对应的代码进行修改。
7.根据权利要求1所述代码开发方法，其特征在于，将所述前端代码和所述后端代码部署于云端之前，还包括：
输出所述前端代码和所述后端代码；
通过输入组件接收第二修改指令，根据所述第二修改指令对所述前端代码和/或所述后端代码进行修改。
8.一种代码开发装置，其特征在于，包括：
第一生成模块，用于接收目标组件的拖拽命令，并基于所述目标组件和所述拖拽命令对应的目标位置生成前端代码；
第二生成模块，用于为所述目标组件配置数据源地址和目标数据项，并基于所述数据源地址和所述目标数据项生成后端代码；
渲染模块，用于根据所述数据源地址获取所述目标数据项，并基于所述目标组件的参数信息和获取到的所述目标数据项渲染页面；
部署模块，用于将所述前端代码和所述后端代码部署于云端。
9.一种电子设备，其特征在于，包括：
存储器，用于存储计算机程序；
处理器，用于执行所述计算机程序时实现如权利要求1至7任一项所述代码开发方法的步骤。
10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现如权利要求1至7任一项所述代码开发方法的步骤。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111130024.5A CN113821201A (zh) | 2021-09-26 | 2021-09-26 | 一种代码开发方法、装置及电子设备和存储介质 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202111130024.5A CN113821201A (zh) | 2021-09-26 | 2021-09-26 | 一种代码开发方法、装置及电子设备和存储介质 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN113821201A true CN113821201A (zh) | 2021-12-21 |
Family
ID=78921234
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202111130024.5A Withdrawn CN113821201A (zh) | 2021-09-26 | 2021-09-26 | 一种代码开发方法、装置及电子设备和存储介质 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113821201A (zh) |
Cited By (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN115080042A (zh) * | 2022-06-30 | 2022-09-20 | 中孚安全技术有限公司 | 一种基于内嵌式数据模板的自定义页面布局方法及*** |
| CN116048490A (zh) * | 2023-01-28 | 2023-05-02 | 广州钛动科技股份有限公司 | 业务事件处理方法、装置、计算机设备和存储介质 |
| CN116821195A (zh) * | 2023-05-31 | 2023-09-29 | 郑州富铭科技股份有限公司 | 一种基于数据库自动生成应用的方法 |
| CN117331551A (zh) * | 2022-06-27 | 2024-01-02 | 国家电投集团数字科技有限公司 | 一种大屏数据可视化***及方法 |
-
2021
- 2021-09-26 CN CN202111130024.5A patent/CN113821201A/zh not_active Withdrawn
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN117331551A (zh) * | 2022-06-27 | 2024-01-02 | 国家电投集团数字科技有限公司 | 一种大屏数据可视化***及方法 |
| CN115080042A (zh) * | 2022-06-30 | 2022-09-20 | 中孚安全技术有限公司 | 一种基于内嵌式数据模板的自定义页面布局方法及*** |
| CN116048490A (zh) * | 2023-01-28 | 2023-05-02 | 广州钛动科技股份有限公司 | 业务事件处理方法、装置、计算机设备和存储介质 |
| CN116048490B (zh) * | 2023-01-28 | 2023-07-14 | 广州钛动科技股份有限公司 | 业务事件处理方法、装置、计算机设备和存储介质 |
| CN116821195A (zh) * | 2023-05-31 | 2023-09-29 | 郑州富铭科技股份有限公司 | 一种基于数据库自动生成应用的方法 |
| CN116821195B (zh) * | 2023-05-31 | 2024-06-07 | 郑州富铭科技股份有限公司 | 一种基于数据库自动生成应用的方法 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN113821201A (zh) | 一种代码开发方法、装置及电子设备和存储介质 | |
| CN110795095B (zh) | 建立业务逻辑组件与业务组件及生成页面的方法与*** | |
| US7661076B2 (en) | Two dimensional trees to edit graph-like diagrams | |
| KR101494844B1 (ko) | 메타 데이터를 이용한 차트 변환 시스템 및 그 방법 | |
| CN111079047B (zh) | 一种面向web的页面构建*** | |
| CN104216691A (zh) | 一种创建应用的方法及装置 | |
| CN110795148A (zh) | 编排文件的生成方法、装置及电子设备 | |
| CN103092612A (zh) | 实现安卓操作***3d桌面贴图的方法及电子装置 | |
| KR20180082845A (ko) | 전자책 서비스 제공방법 및 그를 위한 컴퓨터 프로그램 | |
| CN110633436A (zh) | 可视化、自定义全景编辑方法、***、存储介质及设备 | |
| KR20130047071A (ko) | 모바일용 혼합현실 어플리케이션 개발 장치 및 그 방법 | |
| CN115495069A (zh) | 基于模型驱动的煤炭工业软件流程实现方法、装置及设备 | |
| US10289388B2 (en) | Process visualization toolkit | |
| CN114647409A (zh) | 大屏可视化应用创建平台、方法、计算设备和存储介质 | |
| US20200013034A1 (en) | Remote document generation | |
| CN110764864A (zh) | 一种基于Terraform的可视化资源编排方法 | |
| CN116962807A (zh) | 视频渲染方法、装置、设备及存储介质 | |
| CN103810312B (zh) | 用于人机接口动画图形元素的计算机辅助设计的方法及装置 | |
| CN112083911A (zh) | 一种服务编排模型的生成方法、装置、设备及介质 | |
| GB2431848A (en) | Formatting image data for display on a device management tool | |
| CN116610319B (zh) | 一种基于低代码平台构建地图应用的方法及*** | |
| CN112015324B (zh) | 导向牌控制方法及相关设备 | |
| CN114900734A (zh) | 车型对比视频生成方法、装置、存储介质及计算机设备 | |
| CN117348856A (zh) | 特效素材包生成方法、装置、设备及计算机介质 | |
| US20060200447A1 (en) | Method and system for managing information on a product |
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 | ||
| WW01 | Invention patent application withdrawn after publication |
Application publication date: 20211221 |
|
| WW01 | Invention patent application withdrawn after publication |