CN113342249B - 可实时预览的内容管理方法、装置、设备及存储介质 - Google Patents

Abstract

本申请涉及开发辅助技术，揭露了可实时预览的内容管理方法、装置、设备及存储介质，包括接收用户的第一拖拽操作和输入的第一数据；基于第一拖拽操作，识别用户在组件库中选择的目标组件，将目标组件拖拽至目标位置；基于目标组件的组件信息，确定待填充位置，将第一数据填入待填充位置，得到第一内容；再次接收用户的第二拖拽操作和输入的第二数据，以得到第二内容；获取用户利用光标对所述第一内容和第二内容的关联操作，将第一内容和第二内容进行组合排列，得到完整的生产内容，根据生产内容生成预览界面；将生产内容发送至服务器端，以完成上线。本申请还涉及区块链技术，组件数据存储于区块链中。本申请提高内容配置的处理效率和降低错误率。

Description

可实时预览的内容管理方法、装置、设备及存储介质

技术领域

本申请涉及开发辅助技术领域，尤其涉及可实时预览的内容管理方法、装置、设备及存储介质。

背景技术

随着科技的不断发展，在各大电商平台，对于各商品页面的配置，都是直接在其对应的网页上进行实施配置，在配置之后在终端(APP/H5)上直接显示出来，由于没有提前预览，使得错误信息的发布，可能会对用户造成损失，而对于活动页面等的配置，需要制作者具备专业的网络编程知识，且现有的配置过程中无法直观的看到实时编辑的内容。现有的技术常常不断地重复开发相同过程，浪费资源。因此，如何提高在各电商平台对各商品或活动页面配置的处理效率以及降低错误率成为了亟待解决的问题。

发明内容

本申请提供了可实时预览的内容管理方法、装置、设备及存储介质，以解决现有技术中电商平台，对各商品或活动页面配置的处理效率不高且错误率较高的问题。

为解决上述问题，本申请提供了可实时预览的内容管理方法，包括：

接收用户的第一拖拽操作和输入的第一数据；

基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

将所述生产内容发送至服务器端，以完成上线。

进一步的，在所述接收用户的第一拖拽操作和输入的第一数据之前，还包括：

预先基于组件化架构对各不同业务需求对应的技术方案进行组件化，得到所述各不同的业务需求分别对应的组件，以构建组件库。

进一步的，所述将所述目标组件拖拽至目标位置包括：

获取所述拖拽操作的所述目标位置；

将所述目标组件的标定位与所述目标位置对齐。

进一步的，其特征在于，在所述将所述目标组件拖拽至目标位置之后，还包括：

当识别到光标点击所述目标组件的边缘，且进行二次拖拽时，识别所述二次拖拽的距离和方向；

若所述方向朝向所述目标组件内部，则基于所述距离，按比例对所述目标组件进行缩小；

若所述方向朝向所述目标组件外部，则基于所述距离，按比例对所述目标组件进行放大。

进一步的，所述根据所述第一内容生成预览界面包括：

将所述第一内容的数据发送至预览器；

所述预览器根据第一内容的数据，进行活动展示，得到所述预览界面。

进一步的，在所述根据所述生产内容生成预览界面之后，还包括：

将所述生产内容发送给第三方用户进行审核，若审核不通过，则将所述生产内容退回所述用户进行修改。

进一步的，在所述将所述生产内容发送给第三方用户进行审核之后，还包括：

获取现有展示数据；

将所述展示数据与所述生产内容在所述第三方用户处的同一预览页面进行分页展示。

为了解决上述问题，本申请还提供可实时预览的内容管理装置，所述装置包括：

接收模块，用于接收用户的第一拖拽操作和输入的第一数据；

拖拽模块，用于基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

填充模块，用于基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

重复拖拽模块，用于再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

关联模块，用于获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

上线模块，用于将所述生产内容发送至服务器端，以完成上线。

为了解决上述问题，本申请还提供一种计算机设备，包括：

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有可被所述至少一个处理器执行的指令，所述指令被所述至少一个处理器执行，以使所述至少一个处理器能够执行如上述所述的可实时预览的内容管理方法。

为了解决上述问题，本申请还提供一种非易失性的计算机可读存储介质，所述计算机可读存储介质上存储有计算机可读指令，所述计算机可读指令被处理器执行时实现如上述所述的可实时预览的内容管理方法。

根据本申请实施例提供的可实时预览的内容管理方法、装置、设备及存储介质，与现有技术相比至少具有以下有益效果：

通过不断接收用户的第一拖拽操作和输入的第一数据，基于所述第一拖拽操作，识别用户在预设的组件库中选定的目标组件，并基于拖拽操作的终点，将所述目标组件拖拽至目标位置；基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，所述第一内容可根据预设的预览界面实时预览，从而实现可视化配置，提高了处理效率，且降低了错误率；再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在第一内容对应的预览界面上进一步显示第二内容，基于用户的关联操作，将第一内容、第二内容进行组合排列，得到完整的生产内容，通过直接拖拽配置的页面的形式，降低了整个页面的设计难度，对应的在所述预览界面可预览所述生产内容，最后将所述生产内容发送至服务器端，以完成上线，提高了处理效率和降低了错误率。

附图说明

为了更清楚地说明本申请中的方案，下面将对本申请实施例描述中所需要使用的附图做一个简单介绍，显而易见地，下面描述中的附图是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本申请一实施例提供的可实时预览的内容管理方法的流程示意图；

图2为本申请一实施例提供的可实时预览的内容管理装置的模块示意图；

图3为本申请一实施例的计算机设备的结构示意图。

具体实施方式

除非另有定义，本文所使用的所有的技术和科学术语与属于本申请的技术领域的技术人员通常理解的含义相同；本文中在申请的说明书中所使用的术语只是为了描述具体的实施例的目的，不是旨在于限制本申请；本申请的说明书和权利要求书及上述附图说明中的术语“包括”和“具有”以及它们的任何变形，意图在于覆盖不排他的包含。本申请的说明书和权利要求书或上述附图中的术语“第一”“第二”等是用于区别不同对象，而不是用于描述特定顺序。

在本文中提及“实施例”意味着，结合实施例描述的特定特征、结构或特性可以包含在本申请的至少一个实施例中。在说明书中的各个位置出现该短语并不一定均是是相同的实施例，也不是与其它实施例相互排斥的独立的或备选的实施例。本领域技术人员显式地或隐式地理解的是，本文所描述的实施例可以与其它实施例相结合。

本申请提供一种可实时预览的内容管理方法。参照图1所示，为本申请一实施例提供的可实时预览的内容管理方法的流程示意图。

所述的可实时预览的内容管理方法不仅可用于电商平台对各商品或活动页面配置，还可用于对例如审批流程的构建和平台的构建等。

在本实施例中，可实时预览的内容管理方法包括：

S1、接收用户的第一拖拽操作和输入的第一数据；

本申请中，接收用户的第一拖拽操作即为识别用户的光标的点击和移动，通过识别光标在预设的组件库中的点击操作，和在点击操作后光标的移动操作，在最终光标停留的位置，所述输入的第一数据为图片或语音等，以及对应链接。

进一步的，在所述接收用户的第一拖拽操作和输入的第一数据之前，还包括：

预先基于组件化架构对各不同业务需求对应的技术方案进行组件化，得到所述各不同的业务需求分别对应的组件，以构建组件库。

具体的，所述组件化架构包括如Vue.js、Angular、React，通过利用Vue.js、Angular、React对不同业务需求对应的技术方案进行组件化，使得完成各功能的代码变得独立，即对代码进行组件化，组件化的目的，是为了让页面中各个部分可以被复用，以减少重复代码。将代码都组件化后，得到多个组件，并且对组件进行可视化，即通过命名或直接设置图标的形式来完成，后形成所述组件库，便于用户根据名称或图标来随时使用。所述组件为一种功能对应代码的集合。

例如对搜索框、banner位、秒杀商品或爆款商品等功能业务设置对应的组件。

通过预先对不同业务需求分别设置对应的组件，以便于后续利用所述组件，提高了后续内容配置的效率。

S2、基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

基于所述第一拖拽操作，即利用拖拽操作时光标在预设组件库中的点击操作，获取到点击的目标组件，并且在光标点击目标组件后光标的移动，获取光标移动最后的停留位置，作为目标位置，所述最后的停留位置即光标松开目标组件的位置，从而实现将目标组件拖拽至目标位置。所述组件库中包括但不限于banner位组件、搜索栏组件、商品组件等，所述banner为组件，为多图片滚动展示，各图片匹配有对应链接，点击图片可跳转至对应页面。

例如对电商平台的首页来说，首先从组件库中拖拽页面组件，作为第一层级，而对于页面上方的banner位组件区域，可以分为第二层级，而在banner位组件上放置的秒杀商品，即作为第三层级，第一层级上可展示多个第二层级，对应的第二层级上也可展示多个第三层级；并且第三层级可直接设置在所述第一层级上方。

进一步的，所述将所述目标组件拖拽至目标位置包括：

获取所述拖拽操作的所述目标位置；

将所述目标组件的标定位与所述目标位置对齐。

具体的，基于所述拖拽操作，得到所述拖拽操作中光标松开所述目标组件的位置，即为终点位置，也即目标位置；并且所述目标组件的标定位即对每一组件提前预设的定位点，在本申请中所述定位点设置在组件对应图标的左上角，即以图标的左上角为标定位，将终点位置与所述目标组件的标定位对齐，实现将目标组件拖拽至目标位置。

通过将目标位置与组件的标定位对齐，实现目标组件精确定位。

进一步的，在所述将所述目标组件拖拽至目标位置之后，还包括：

当识别到光标点击所述目标组件的边缘，且进行二次拖拽时，识别所述二次拖拽的距离和方向；

若所述方向朝向所述目标组件内部，则基于所述距离，按比例对所述目标组件进行缩小；

若所述方向朝向所述目标组件外部，则基于所述距离，按比例对所述目标组件进行放大。

在将目标组件拖拽到生产页面的目标位置后，展示的目标组件为预设大小，通过再次点击目标组件进行拖拽，实现更改目标组件大小，来适应页面；同时识别二次拖拽起点到终点的方向，来判断是缩小或放大；并且通过判断二次拖拽中起点到终点的距离，来得出放大或缩小的倍数。

并且可多次拖动目标组件以更换所处位置，或多次拖拽以更改目标组件大小。

通过二次拖拽来实现对组件的缩放和二次移动，以使所述组件的大小和位置适应生产页面。

S3、基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

根据将所述第一数据中的例如图片数据和目标组件中的例如banner位组件进行结合，即将图片数据置入banner位组件中得到每一个banner位,从而实现在banner位滚动展示图片数据。并且对于各图片数据还可设有对应的链接。

在本申请其他实施例中，还可拖拽另一目标组件与现有的目标组件进行结合，例如首先拖拽一个页面组件至生产页面，随后再将banner位组件拖拽至页面组件上方，实现两者的结合，还可多个目标组件进行结合，得到第一内容。在得到第一内容后，将实时生成对应的预览界面，所述预览界面即将第一内容进行活动展示。

进一步的，所述根据所述第一内容生成预览界面包括：

将所述第一内容的数据发送至预览器；

所述预览器根据第一内容的数据，进行活动展示，得到所述预览界面。

在本实施例中，通过将banner位组件与第一数据进行结合得到，第一内容；banner位组件为滚动展示组件，得到的第一内容，每一滚动页面都设有图片及其对应链接，由于在生产页面第一内容是不会活动展示的，只有在预览界面，通过预览界面将第一内容进行运行，进而得到活动展示的第一内容。

通过将第一内容发送至预览器处，使得预览器和生产页面中的数据相对独立，预览器对第一内容进行活动展示，从而实现可视化。用户在编辑的同时，可以实时观察到效果，从而降低了用户编辑的错误率。

所述预览器可以通过安卓模拟器、ios模拟器或网页模拟器来进行构建，以使得展现第一内容、第二内容等在安卓或ios系统上的活动表现。

S4、再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

通过接收用户的第二拖拽操作和输入的第二数据，得到第二目标组件，并将第二目标组件拖拽至目标位置，通过将第二目标组件和第二数据进行结合，得到对应的第二内容。同理可得到第三内容、第四内容、……、第n内容，直至所述用户确认结束。

且直接将第二内容发送至预览器处，将第一内容和第二内容在同一预览界面中进行展示。同样的，在后续不断得到第三内容、第四内容、……、第n内容后，不断将第三内容、第四内容、……、第n内容发送至预览器，同时在同一预览界面不断显示。

S5、获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

通过利用光标对第一内容和第二内容进行关联操作，所述通过将第一内容和第二内容进行组合排列，即将第一内容和第二内容进行关联，例如对于页面组件和在页面组件之上的商品组件或banner位组件等进行关联，使得第一内容和第二内容的关联性更好。不局限于将第一内容和第二内容进行关联，可由多个内容进行关联组合，以得到最终完整的生产内容。且最后将完整的生产内容发送至预览页面，使用户可实时预览完整的活动页面。具体的，所述关联操作包括将第二内容锁定到第一内容处等。

对应的，接收用户对第一内容、第二内容、第三内容、……、第n内容的关联操作，将第一内容、第二内容、第三内容、……、第n内容进行排列组合。

进一步的，在所述根据所述生产内容生成预览界面之后，还包括：

将所述生产内容发送给第三方用户进行审核，若审核不通过，则将所述生产内容退回所述用户进行修改。

在本申请中，通过将生产内容发送给第三方用户进行审核，以保证生产内容在上线前能准确无误。所述发送的生产内容发送至第三方用户处，可实时预览活动展示的生产内容。若第三方用户审核所述活动展示的生产内容，发现有误时，直接退回所述用户处，使所述用户再次进行修改。

在本申请的另一实施例中，可将所述生产内容发送给多个第三方用户进行审核。

在得到最终的生产内容后，且在将编辑的内容上线之前，还将实时生产内容分发送给第三方用户审核，从而再次降低生产内容的错误率。

进一步的，在所述将所述生产内容发送给第三方用户进行审核之后，还包括：

获取现有展示数据；

将所述展示数据与所述生产内容在所述第三方用户处的同一预览页面进行分页展示。

具体的，若对于同一内容有对应的现有展示数据，则获取对应的展示数据至预览界面处，并且同时将生产内容在预览界面进行展示，通过将两者进行对比展示，使第三方用户更能对比出两者的优缺点，以及问题。

对应的，若出现问题，将生产内容退回所述用户进行修改后，用户修改后得到第二生产内容，再发送到第三方用户进行审核时，可将现有展示数据、第二生产内容和生成内容同时在同一预览页面进行对比展示，即将预览页面分成三个部分，来分别展示。

若有现有展示数据，将现有数据和生产内容在同一预览页面进行分页展示，通过对比展示更容易区分出两者差别。

S6、将所述生产内容发送至服务器端，以完成上线。

具体的，通过将设置完成的生产内容发送至各电商平台的服务器，以完成商品或活动的上线。

进一步的，在所述将所述生产内容发送至服务器端之前还包括，设置定时上传时间，实现对商品或活动的定时上线。

需要强调的是，为了进一步保证数据的私密性和安全性，所有所述组件数据还可以存储于一区块链的节点中。

本申请所指区块链是分布式数据存储、点对点传输、共识机制、加密算法等计算机技术的新型应用模式。区块链(Blockchain)，本质上是一个去中心化的数据库，是一串使用密码学方法相关联产生的数据块，每一个数据块中包含了一批次网络交易的信息，用于验证其信息的有效性(防伪)和生成下一个区块。区块链可以包括区块链底层平台、平台产品服务层以及应用服务层等。

通过不断接收用户的第一拖拽操作和输入的第一数据，基于所述第一拖拽操作，识别用户在预设的组件库中选定的目标组件，并基于拖拽操作的终点，将所述目标组件拖拽至目标位置；基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，所述第一内容可根据预设的预览界面实时预览，从而实现可视化配置，提高了处理效率，且降低了错误率；再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在第一内容对应的预览界面上进一步显示第二内容，基于用户的关联操作，将第一内容、第二内容进行组合排列，得到完整的生产内容，通过直接拖拽配置的页面的形式，降低了整个页面的设计难度，对应的在所述预览界面可预览所述生产内容，最后将所述生产内容发送至服务器端，以完成上线，提高了处理效率和降低了错误率。

如图2所示，是本申请可实时预览的内容管理装置的功能模块图。

本申请所述可实时预览的内容管理装置100可以安装于电子设备中。根据实现的功能，所述可实时预览的内容管理装置100可以包括接收模块101、拖拽模块102、填充模块103、重复拖拽模块104、关联模块105和上线模块106。本申请所述模块也可以称之为单元，是指一种能够被电子设备处理器所执行，并且能够完成固定功能的一系列计算机程序段，其存储在电子设备的存储器中。

在本实施例中，关于各模块/单元的功能如下：

接收模块101，用于接收用户的第一拖拽操作和输入的第一数据；

进一步的，所述可实时预览的内容管理装置100还包括组件构建模块；

所述组件构建模块，用于预先基于组件化架构对各不同业务需求对应的技术方案进行组件化，得到所述各不同的业务需求分别对应的组件，以构建组件库。

所述组件构建模块通过预先对不同业务需求分别设置对应的组件，以便于后续利用所述组件，提高了后续内容配置的效率。

拖拽模块102，用于基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

进一步的，所述拖拽模块102包括终点获取子模块和对齐子模块；

所述终点获取子模块，用于获取所述拖拽操作的目标位置；

所述对齐子模块，用于将所述目标组件的标定位与所述目标位置对齐。

通过终点获取子模块和对齐子模块的配合将终点位置与组件的标定位对齐，实现目标组件精确定位。

进一步的，所述可实时预览的内容管理装置100还包括二次拖拽模块、缩小模块和放大模块；

所述二次拖拽模块，用于当识别到光标点击所述目标组件的边缘，且进行二次拖拽时，识别所述二次拖拽的距离和方向；

所述缩小模块，用于若所述方向朝向所述目标组件内部，则基于所述距离，按比例对所述目标组件进行缩小；

所述放大模块，用于若所述方向朝向所述目标组件外部，则基于所述距离，按比例对所述目标组件进行放大。

通过二次拖拽模块、缩小模块和放大模块的配合，通过二次拖拽来实现对组件的缩放和二次移动，以使所述组件的大小和位置适应生产页面。

填充模块103，用于基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

进一步的，所述填充模块103包括数据发送子模块和预览展示子模块；

所述数据发送子模块，用于将所述第一内容的数据发送至预览器；

所述预览展示子模块，用于所述预览器根据第一内容的数据，进行活动展示，得到所述预览界面。

通过数据发送子模块和预览展示子模块的配合，将第一内容发送至预览器处，使得预览器和生产页面中的数据相对独立，预览器对第一内容进行活动展示，从而实现可视化。用户在编辑的同时，可以实时观察到效果，从而降低了用户编辑的错误率。

重复拖拽模块104，用于再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

关联模块105，用于获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

进一步的，所述可实时预览的内容管理装置100还包括审核模块

所述审核模块，用于将所述生产内容发送给第三方用户进行审核，若审核不通过，则将所述生产内容退回所述用户进行修改。

通过审核模块在得到最终的生产内容后，且在将编辑的内容上线之前，还将实时生产内容分发送给第三方用户审核，从而再次降低生产内容的错误率。

再进一步的，所述可实时预览的内容管理装置100包括展示数据获取模块和分页展示模块；

所述展示数据获取模块，用于获取现有展示数据；

所述分页展示模块，用于将所述展示数据与所述生产内容在所述第三方用户处的同一预览页面进行分页展示。

通过展示数据获取模块和分页展示模块的配合，在有现有展示数据情况下，将现有数据和生产内容在所述第三方用户处的同一预览页面进行分页展示，通过对比展示更容易区分出两者差别。

上线模块106，用于将所述生产内容发送至服务器端，以完成上线。

通过采用上述装置，所述可实时预览的内容管理装置100通过接收模块101、拖拽模块102、填充模块103、重复拖拽模块104、关联模块105和上线模块106的配合使用，使得电商平台对各商品或活动页面配置的处理效率提高且错误率降低。

为解决上述技术问题，本申请实施例还提供计算机设备。具体请参阅图3，图3为本实施例计算机设备基本结构框图。

所述计算机设备4包括通过系统总线相互通信连接存储器41、处理器42、网络接口43。需要指出的是，图中仅示出了具有组件41-43的计算机设备4，但是应理解的是，并不要求实施所有示出的组件，可以替代的实施更多或者更少的组件。其中，本技术领域技术人员可以理解，这里的计算机设备是一种能够按照事先设定或存储的指令，自动进行数值计算和/或信息处理的设备，其硬件包括但不限于微处理器、专用集成电路(ApplicationSpecific Integrated Circuit，ASIC)、可编程门阵列(Field－Programmable GateArray，FPGA)、数字处理器(Digital Signal Processor，DSP)、嵌入式设备等。

所述计算机设备可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。所述计算机设备可以与用户通过键盘、鼠标、遥控器、触摸板或声控设备等方式进行人机交互。

所述存储器41至少包括一种类型的可读存储介质，所述可读存储介质包括闪存、硬盘、多媒体卡、卡型存储器(例如，SD或DX存储器等)、随机访问存储器(RAM)、静态随机访问存储器(SRAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、可编程只读存储器(PROM)、磁性存储器、磁盘、光盘等。在一些实施例中，所述存储器41可以是所述计算机设备4的内部存储单元，例如该计算机设备4的硬盘或内存。在另一些实施例中，所述存储器41也可以是所述计算机设备4的外部存储设备，例如该计算机设备4上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(FlashCard)等。当然，所述存储器41还可以既包括所述计算机设备4的内部存储单元也包括其外部存储设备。本实施例中，所述存储器41通常用于存储安装于所述计算机设备4的操作系统和各类应用软件，例如可实时预览的内容管理方法的计算机可读指令等。此外，所述存储器41还可以用于暂时地存储已经输出或者将要输出的各类数据。

所述处理器42在一些实施例中可以是中央处理器(Central Processing Unit，CPU)、控制器、微控制器、微处理器、或其他数据处理芯片。该处理器42通常用于控制所述计算机设备4的总体操作。本实施例中，所述处理器42用于运行所述存储器41中存储的计算机可读指令或者处理数据，例如运行所述可实时预览的内容管理方法的计算机可读指令。

所述网络接口43可包括无线网络接口或有线网络接口，该网络接口43通常用于在所述计算机设备4与其他电子设备之间建立通信连接。

本实施例通过处理器执行存储在存储器的计算机可读指令时实现如上述实施例可实时预览的内容管理方法的步骤，通过不断接收用户的第一拖拽操作和输入的第一数据，基于所述第一拖拽操作，识别用户在预设的组件库中选定的目标组件，并基于拖拽操作的终点，将所述目标组件拖拽至目标位置；基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，所述第一内容可根据预设的预览界面实时预览，从而实现可视化配置，提高了处理效率，且降低了错误率；再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在第一内容对应的预览界面上进一步显示第二内容，基于用户的关联操作，将第一内容、第二内容进行组合排列，得到完整的生产内容，通过直接拖拽配置的页面的形式，降低了整个页面的设计难度，对应的在所述预览界面可预览所述生产内容，最后将所述生产内容发送至服务器端，以完成上线，提高了处理效率和降低了错误率。

本申请还提供了另一种实施方式，即提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机可读指令，所述计算机可读指令可被至少一个处理器执行，以使所述至少一个处理器执行如上述的可实时预览的内容管理方法的步骤，通过不断接收用户的第一拖拽操作和输入的第一数据，基于所述第一拖拽操作，识别用户在预设的组件库中选定的目标组件，并基于拖拽操作的终点，将所述目标组件拖拽至目标位置；基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，所述第一内容可根据预设的预览界面实时预览，从而实现可视化配置，提高了处理效率，且降低了错误率；再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在第一内容对应的预览界面上进一步显示第二内容，基于用户的关联操作，将第一内容、第二内容进行组合排列，得到完整的生产内容，通过直接拖拽配置的页面的形式，降低了整个页面的设计难度，对应的在所述预览界面可预览所述生产内容，最后将所述生产内容发送至服务器端，以完成上线，提高了处理效率和降低了错误率。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是手机，计算机，服务器，空调器，或者网络设备等)执行本申请各个实施例所述的方法。

显然，以上所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例，附图中给出了本申请的较佳实施例，但并不限制本申请的专利范围。本申请可以以许多不同的形式来实现，相反地，提供这些实施例的目的是使对本申请的公开内容的理解更加透彻全面。尽管参照前述实施例对本申请进行了详细的说明，对于本领域的技术人员来而言，其依然可以对前述各具体实施方式所记载的技术方案进行修改，或者对其中部分技术特征进行等效替换。凡是利用本申请说明书及附图内容所做的等效结构，直接或间接运用在其他相关的技术领域，均同理在本申请专利保护范围之内。

Claims (10)

1.一种可实时预览的内容管理方法，其特征在于，所述方法包括：

接收用户的第一拖拽操作和输入的第一数据；

基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

将所述生产内容发送至服务器端，以完成上线。

2.根据权利要求1所述的可实时预览的内容管理方法，其特征在于，在所述接收用户的第一拖拽操作和输入的第一数据之前，还包括：

预先基于组件化架构对各不同业务需求对应的技术方案进行组件化，得到所述各不同的业务需求分别对应的组件，以构建组件库。

3.根据权利要求1所述的可实时预览的内容管理方法，其特征在于，所述将所述目标组件拖拽至目标位置包括：

获取所述拖拽操作的所述目标位置；

将所述目标组件的标定位与所述目标位置对齐。

4.根据权利要求1至3中任一项所述的可实时预览的内容管理方法，其特征在于，在所述将所述目标组件拖拽至目标位置之后，还包括：

当识别到光标点击所述目标组件的边缘，且进行二次拖拽时，识别所述二次拖拽的距离和方向；

若所述方向朝向所述目标组件内部，则基于所述距离，按比例对所述目标组件进行缩小；

若所述方向朝向所述目标组件外部，则基于所述距离，按比例对所述目标组件进行放大。

5.根据权利要求4所述的可实时预览的内容管理方法，其特征在于，所述根据所述第一内容生成预览界面包括：

将所述第一内容的数据发送至预览器；

所述预览器根据第一内容的数据，进行活动展示，得到所述预览界面。

6.根据权利要求5所述的可实时预览的内容管理方法，其特征在于，在所述根据所述生产内容生成预览界面之后，还包括：

将所述生产内容发送给第三方用户进行审核，若审核不通过，则将所述生产内容退回所述用户进行修改。

7.根据权利要求6所述的可实时预览的内容管理方法，其特征在于，在所述将所述生产内容发送给第三方用户进行审核之后，还包括：

获取现有展示数据；

将所述展示数据与所述生产内容在所述第三方用户处的同一预览页面进行分页展示。

8.一种可实时预览的内容管理装置，其特征在于，所述装置包括：

接收模块，用于接收用户的第一拖拽操作和输入的第一数据；

拖拽模块，用于基于所述第一拖拽操作，识别用户在预设的组件库中选择的目标组件，并将所述目标组件拖拽至目标位置；

填充模块，用于基于所述目标组件的组件信息，确定待填充位置，将所述第一数据填入所述待填充位置处，得到第一内容，并根据所述第一内容生成预览界面；

重复拖拽模块，用于再次接收所述用户的第二拖拽操作和输入的第二数据，以得到第二内容，并在所述第一内容对应的预览界面中展示所述第二内容；

关联模块，用于获取用户利用光标对所述第一内容和第二内容进行的关联操作，将所述第一内容和第二内容进行组合排列，得到完整的生产内容，并根据所述生产内容生成预览界面；

上线模块，用于将所述生产内容发送至服务器端，以完成上线。

9.一种计算机设备，其特征在于，所述计算机设备包括：

至少一个处理器；以及，

与所述至少一个处理器通信连接的存储器；其中，

所述存储器存储有计算机可读指令，所述处理器执行所述计算机可读指令时实现如权利要求1至7中任一所述的可实时预览的内容管理方法。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储有计算机可读指令，所述计算机可读指令被处理器执行时实现如权利要求1至7中任一所述的可实时预览的内容管理方法。

Images