【技术实现步骤摘要】
本专利技术涉及前端开发，具体地说是一种基于可视化拖拉拽的门户工作台页面生成方法及系统。
技术介绍
1、门户工作台页面通常用于集成多个应用程序、服务和信息源，以提供用户个性化的工作环境。在门户工作台页面的创建过程中，传统的方法通常依赖于复杂的编程技巧，需要开发人员手动编写前端代码，以实现页面的设计、布局和功能。
2、传统上，门户工作台页面的设计和布局需要复杂的编程技巧，且存在以下一些挑战和限制：
3、①技术门槛高：传统的门户工作台页面设计需要开发人员具备深入的编程知识，包括html、css、javascript等技术，这使得非技术人员难以参与页面设计和定制；
4、②耗时耗力：手动编写和调试代码是一项繁琐的任务，需要大量的时间和精力，特别是在需要频繁更新和修改页面时；
5、③定制性受限：传统方法中，一旦页面代码编写完成，对于后续的定制和调整可能需要额外的开发工作，这会限制了页面的灵活性和可定制性；
6、④错误和兼容性问题：手动编写的代码容易引入错误和兼容性问题，不同浏览器之间的差异可能导致页面在不同平台上的显示问题。
7、故如何使用户能够直观地创建个性化门户工作台页面，无需编程知识，降低技术门槛，使更多的用户能够参与页面的设计和定制是目前亟待解决的技术问题。
技术实现思路
1、本专利技术的技术任务是提供一种基于可视化拖拉拽的门户工作台页面生成方法及系统，来解决如何使用户能够直观地创建个性化门户工作台页面，无需编程知
2、本专利技术的技术任务是按以下方式实现的，一种基于可视化拖拉拽的门户工作台页面生成方法，该方法具体如下：
3、在管理端封装新闻动态的展示组件；
4、在管理端内创建门户工作台管理页面；
5、从后台获取之前保存的配置文件；
6、根据配置文件初始化组件配置、位置及储存；
7、在布局区域调整组件位置与尺寸，在配置区域修改组件配置；
8、预览布局页面；
9、保存配置文件到后台；
10、门户端导入组件并根据配置文件渲染页面。
11、作为优选，在管理端封装新闻动态的展示组件具体如下：
12、根据模块具体功能，将模块的代码封装为不同的组件；其中，组件是一种用于构建网页用户界面(ui)的可重用模块或元素，模块或元素是前端开发中常见的概念，用于将用户界面分解为独立的、可管理的部分，从而使开发更加模块化、可维护和可扩展；组件通常包括html、css和javascript的结合，用于定义和控制特定部分的外观和行为；每个组件视为一个自包含的小型应用程序，具有自己的属性或参数作为输入和渲染的ui部分或事件作为输出；有许多框架和库(如react、vue.js等)提供了强大的组件化工具和模式，使开发者能够更轻松地创建、管理和维护前端组件；
13、定义props，props即组件的输入(属性或参数)；
14、定义一个config对象接收组件的具体配置，组件具体配置包括宽度、标题颜色、标题文本及通用按钮文本；不同的组件类型接收不同的配置参数；
15、为组件提供默认的配置值，当未给组件提供配置时保证组件的正常使用。
16、作为优选，门户工作台管理页面分为三部分，具体如下：
17、第一部分为选择组件的区域，选择组件即为创建的展示组件；
18、第二部分为包含修改组件配置的表单；
19、第三部分为具体的拖拉拽区域，组件在该区域通过鼠标操作进行宽高及放置位置的调整；
20、页面组件通过配置文件的方式进行管理，以尽量减少页面文件内的代码长度，方便后期的开发维护。
21、作为优选，从后台获取之前保存的配置文件具体如下：
22、当打开门户工作台管理页面时，从后台服务器获取之前保存的门户工作台页面配置文件；
23、若是首次创建页面，则从客户端侧初始化配置文件。
24、作为优选，在布局区域调整组件位置与尺寸，在配置区域修改组件配置具体如下：
25、布局区域通过鼠标拖拉拽的方式调整组件的位置及宽高的参数，并提供删除组件的按钮，点击具体的任一组件，在组件编辑区域展示该组件相关的配置表单；
26、组件编辑区域中包括业务组件相关的配置表单，通用配置为组件的宽度；
27、通知类组件包括标题文本、标题字体大小、标题字体颜色及右上角文本的配置；
28、页头组件包括logo及背景图片的配置。
29、作为优选，门户端导入组件并根据配置文件渲染页面具体如下：
30、门户端页面导入同名的组件文件；
31、登录门户系统，从后台服务器接口中获取配置文件并加载；
32、前端通过读取配置文件，并通过动态组件来生成页面内容并渲染。
33、一种基于可视化拖拉拽的门户工作台页面生成系统，该系统用于实现上述的基于可视化拖拉拽的门户工作台页面生成方法；该系统包括管理端和门户端，门户端导入组件并根据配置文件渲染页面；
34、其中，管理端包括：
35、封装模块，用于在管理端封装新闻动态的展示组件；
36、创建模块，用于在管理端内创建门户工作台管理页面；
37、获取模块，用于从后台获取之前保存的配置文件；
38、初始化模块，用于根据配置文件初始化组件配置、位置及储存；
39、调整模块，用于在布局区域调整组件位置与尺寸，在配置区域修改组件配置；
40、预览模块，用于预览布局页面；
41、保存模块，用于保存配置文件到后台。
42、作为优选，所述门户端的工作过程具体如下：
43、(1)门户端页面导入同名的组件文件；
44、(2)登录门户系统，从后台服务器接口中获取配置文件并加载；
45、(3)前端通过读取配置文件，并通过动态组件来生成页面内容并渲染。
46、一种电子设备，包括：存储器和至少一个处理器；
47、其中，所述存储器上存储有计算机程序；
48、所述至少一个处理器执行所述存储器存储的计算机程序，使得所述至少一个处理器执行如上述的基于可视化拖拉拽的门户工作台页面生成方法。
49、一种计算机可读存储介质，所述计算机可读存储介质中存储有计算机程序，所述计算机程序可被处理器执行以实现如上述的基于可视化拖拉拽的门户工作台页面生成方法。
50、本专利技术的基于可视化拖拉拽的门户工作台页面生成方法及系统具有以下优点：
51、(一)本专利技术使用户能够直观地创建个性化门户工作台页面，无需编程技能，同时提供了高度可定制性，允许用户轻松地重新排列、添加或删除组件，以满足不断变化的需求；
52、(二)本专利技术通本文档来自技高网...
【技术保护点】
1.一种基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，该方法具体如下：
2.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，在管理端封装新闻动态的展示组件具体如下：
3.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，门户工作台管理页面分为三部分，具体如下：
4.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，从后台获取之前保存的配置文件具体如下：
5.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，在布局区域调整组件位置与尺寸，在配置区域修改组件配置具体如下：
6.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，门户端导入组件并根据配置文件渲染页面具体如下：
7.一种基于可视化拖拉拽的门户工作台页面生成系统，其特征在于，该系统用于实现权利要求1-6中任一项所述的基于可视化拖拉拽的门户工作台页面生成方法；该系统包括管理端和门户端，门户端导入组件并根据配置文件渲染页面；>
8.根据权利要求7所述的基于可视化拖拉拽的门户工作台页面生成系统，其特征在于，所述门户端的工作过程具体如下：
9.一种电子设备，其特征在于，包括：存储器和至少一个处理器；
10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质中存储有计算机程序，所述计算机程序可被处理器执行以实现如权利要求1至6中任一项所述的基于可视化拖拉拽的门户工作台页面生成方法。
...【技术特征摘要】
1.一种基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，该方法具体如下：
2.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，在管理端封装新闻动态的展示组件具体如下：
3.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，门户工作台管理页面分为三部分，具体如下：
4.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，从后台获取之前保存的配置文件具体如下：
5.根据权利要求1所述的基于可视化拖拉拽的门户工作台页面生成方法，其特征在于，在布局区域调整组件位置与尺寸，在配置区域修改组件配置具体如下：
6.根据权利要求1所述的基于可视化拖拉拽的门户工作台页...
【专利技术属性】
技术研发人员：刘世豪，于秀娟，白玉坤，张亮，
申请(专利权)人：智慧泉城智能科技有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。