[0001] 本发明涉及金融科技领域，尤其涉及一种模板库配置方法、装置、设备及介质。

[0002] 产品活动模板是为市场营销活动设计的预制模板，旨在通过标准化和简化活动页面的创建过程来提高效率和吸引力。这些模板通常用于在线促销、新品发布、节日营销、限时折扣等活动。以下是一些产品活动模板包含的关键元素和特性：视觉设计元素：定制的配色方案和字体，以符合品牌形象。高质量的横幅图像或视频背景，以吸引用户注意。统一的品牌标识和Logo。页面布局：灵活的页面布局，以适应不同的内容和设计需求。响应式设计，确保在各种设备和屏幕尺寸上都能提供良好的用户体验。产品展示：突出的产品图片或视频，展示产品特点和优势。产品细节和规格说明，帮助用户了解产品。产品使用场景或客户评价，增加信任感。互动组件：轮播图或幻灯片，展示产品系列或活动亮点。社交媒体分享按钮，鼓励用户分享活动。嵌入式表单，用于收集用户信息或反馈。促销信息：明确的促销信息，如折扣、优惠券、赠品等。倒计时计时器，增加紧迫感，促使用户采取行动。行动号召(CTA)：突出的CTA按钮，引导用户进行购买、注册或了解更多信息。CTA链接到购买页面或更多信息页面，简化用户操作流程。SEO优化：搜索引擎优化(SEO)元素，提高页面在搜索引擎中的排名。关键词优化的标题和描述，吸引目标用户。法律合规性：包含必要的法律声明、隐私政策和使用条款。确保活动符合相关法律法规。数据分析：集成的跟踪代码，用于监控用户行为和活动效果。数据分析工具的接口，帮助分析用户参与度和转化率。用户引导：清晰的导航和指引，帮助用户了解活动流程和如何参与。常见问题解答(FAQ)或帮助按钮，提供即时支持。通过使用产品活动模板，企业可以快速启动和执行营销活动，同时保持品牌形象的一致性。这些模板可以基于不同的行业和产品类型进行定制，以满足特定的营销目标和用户需求。

[0003] 尤其金融产品活动模板是为金融机构或商家提供的一种预先设计好的活动页面框架，它允许这些机构快速启动营销活动，而无需从零开始设计和开发活动页面。这些模板通常包含了一系列预定义的元素和功能，旨在吸引用户参与并促进金融产品的营销和销售。

[0004] 目前现有系统主要面向M端(机构)运营人员，支持运营人员做可视化配置活动，活动页内容相对单一。然而不同的金融商品相对不同B端(商家)有不同的品类、价格等差异化，例如品类差异(如股票、债券、基金等)和价格差异(如利率、手续费等)，这样就对商家需要能够根据自己的营销策略和目标客户群体自主创建和定制活动，以提高用户参与度和销售转化率，同时要求商家能够自主管理活动的运营和销售过程，包括活动发布、监控、分析和优化，因为前述的需求，商家需要填写繁琐的表单，导致了效率低下的技术问题。

[0027] 下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

[0028] 本发明实施例提供的模板库配置方法，可应用在如图1的应用环境中，其中，客户端(前端)通过网络与服务端进行通信。服务端可以获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数；判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库；获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据；保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图，在本发明中，针对常见的一些点击率预测模型并没有在推荐或是广告系统中充分利用用户决策的上下文信息，所以不能达到较好的性能表现，能同时提取商品中的显式和隐式信息。其中，客户端(前端)可以但不限于各种个人计算机、笔记本电脑、智能手机、平板电脑和便携式可穿戴设备。服务端可以用独立的服务器或者是多个服务器组成的服务器集群来实现。下面通过具体的实施例对本发明进行详细的描述。

[0029] 请参阅图2所示，图2为本发明实施例提供的模板库配置方法的一个流程示意图，包括如下步骤：

[0030] S10：获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数；

[0031] 本实施例中，获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数具体包括：

[0032] 获取前端发送的所述模板页面配置请求，按照预设权限验证方式验证用户权限；

[0033] 提取所述模板页面配置请求中的所述复制判断参数和所述页面标识符参数。

[0034] 获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数，之前还包括：

[0035] 采用页面组件配置函数在所述前端的模板页面配置界面添加复制键；

[0036] 对所述复制键绑定事件监听器。

[0037] 在一实施例中，具体的是前端新增复制按钮，跳转编辑页面，url带上是否复制标识和pageld。这个步骤意味着在现有的系统列表页中，将增加一个“复制”按钮，用户可以通过点击这个按钮来创建一个新的页面版本。当用户点击“复制”按钮时，系统将跳转到编辑页面，并且URL中会包含一个标识符isCopy，用于标识该操作是复制操作，同时还会包含一个pageld参数，用于记录原始页面的ID。

[0038] 可以理解的是，具体的实现可以是如下：

[0039] a.复制按钮的添加：

[0040] 在页面列表中，为每个可复制的页面添加一个“复制”按钮。当用户点击这个按钮时，会触发一个事件处理函数。

[0041] javascript

[0042] //假设有一个页面列表，每个页面都有一个复制按钮

[0043] document.querySelectorAll('.copy‑button').forEach(button＝>{

[0044] button.addEventListener('click',function(event){

[0045] const pageId＝this.getAttribute('data‑page‑id')；//获取当前页面的pageId

[0046] copyPage(pageId)；//调用复制页面的函数

[0047] })；

[0048] })；

[0049] function copyPage(pageId){

[0050] const isCopy＝true；//标识这是一个复制操作

[0051] //构造一个带有isCopy和pageId参数的URL，跳转到编辑页面

[0052] const editUrl＝`/edit？pageId＝${pageId}&isCopy＝${isCopy}`；

[0053] window.location.href＝editUrl；//重定向到编辑页面

[0054] }

[0055] b.页面数据的读取：

[0056] 在编辑页面，根据传递的pageId和isCopy参数，前端需要向后端请求原始页面的数据。

[0057] javascript

[0058] //假设使用了FetchAPI来获取页面数据

[0059] function fetchPageData(pageId){

[0060] return fetch(`/api/pages/${pageId}`)

[0061] .then(response＝>response.json())

[0062] .then(data＝>{

[0063] //使用获取的数据填充编辑页面的表单

[0064] populateEditor(data)；

[0065] })

[0066] .catch(error＝>console.error('Error fetching page data:',error))；

[0067] }

[0068] function populateEditor(data){

[0069] //填充编辑器的逻辑，例如设置表单字段的值

[0070] //...

[0071] }

[0072] 因此，前端通过点击【复制】按钮自动读取当前行的pageId，并通过window.open方法自动打开新页面，由程序向服务器获取已有模板数据进行填充，无需用户手动录入所有表单项和拖拽原子组件，相比现有方案，可以减少繁琐的录入流程。

[0073] 在系统列表页的每个页面条目旁边添加一个“复制”按钮。为“复制”按钮绑定一个事件监听器，当用户点击时，触发一个函数。该函数读取当前页面的pageId，并构建一个新的URL，包含参数isCopy＝true和pageId＝<原始页面ID>。使用window.open方法打开新页面，传递构建的URL。接收到带有isCopy和pageId参数的请求后，验证用户权限。根据pageId参数获取原始页面的数据。

[0074] 前述的按照预设权限验证方式验证用户权限可以是：

[0075] 用户身份认证：首先，需要确认用户已经通过身份认证。这通常通过Session、JWT或其他认证机制实现。例如，使用Spring Security框架，可以利用AuthenticationManager来校验用户的凭证，如用户名和密码。

[0076] 权限验证：

[0077] 在用户身份认证通过后，需要验证用户是否具有执行复制操作的权限。这可以通过角色基础的访问控制(RBAC)模型来实现，其中用户被分配到一个或多个角色，每个角色具有一组权限。

[0078] 权限验证可以在前端通过路由守卫实现，例如在Vue.js中，可以使用beforeEach钩子来检查用户的权限，并根据权限决定是否允许访问特定的路由。

[0079] 在后端，可以使用Spring Security的FilterSecurityInterceptor过滤器来拦截请求，并根据用户的角色和权限来决定是否放行。

[0080] 参数验证：

[0081] 对于isCopy和pageId参数，需要进行验证以确保它们是有效的。例如，pageId应该是一个有效的页面标识符，而isCopy应该是一个布尔值。

[0082] 参数验证可以在后端使用Spring Boot的参数校验功能来实现，例如使用@Valid或@Validated注解来确保传入的参数符合预期的格式和业务规则。

[0083] 业务逻辑处理：

[0084] 如果用户具有相应的权限，并且参数验证通过，那么后端可以继续处理复制页面的业务逻辑。如果isCopy＝true，则生成一个新的pageId并创建页面副本；如果isCopy＝false或不存在，则使用提供的pageId更新现有页面。

[0085] 异常处理：

[0086] 在整个验证过程中，如果发生任何异常，如用户未认证、权限不足或参数无效，都应该有相应的异常处理机制。例如，可以返回一个错误响应，状态码可能是401(未认证)、403(禁止)或400(坏请求)。

[0087] 日志记录：

[0088] 对于所有的认证和授权操作，建议记录详细的日志，以便于问题排查和安全审计。

[0089] S11、判断所述复制判断参数是否有效，若有效，则执行步骤S12，若无效则执行步骤S13；

[0090] 需要说明的是，需要提供一个接口来处理页面数据的获取请求，并根据isCopy参数决定是返回原始页面数据还是创建一个新的页面副本。

[0091] 在一实施例中，检查请求中是否包含isCopy参数：在保存新页面之前，检查请求中是否包含isCopy参数，具体可以是如下：

[0092] #假设有一个存储页面数据的字典

[0093] pages＝{}

[0094] @app.route('/api/save‑page',methods＝['POST'])

[0095] defsave_page():

[0096] data＝request.get_json()

[0097] page_id＝data.get('pageId')

[0098] is_copy＝data.get('isCopy',False)

[0099] new_page_data＝data.get('pageData')

[0100] ifis_copy:

[0101] #生成一个新的唯一pageId

[0102] new_page_id＝str(uuid.uuid4())

[0103] #使用新pageId创建新页面

[0104] pages[new_page_id]＝new_page_data

[0105] returnjsonify({'success':True,'newPageId':new_page_id}),201

[0106] else:

[0107] #使用请求中的pageId更新现有页面

[0108] ifpage_id in pages:

[0109] pages[page_id]＝new_page_data#更新页面数据

[0110] returnjsonify({'success':True}),200

[0111] else:

[0112] returnjsonify({'success':False,'error':'Page not found'}),404S12、生成新页面标识符参数，并更新模板页面数据至模板库；

[0113] 本实施例中，生成新页面标识符参数，根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库。

[0114] 可以理解的是，当用户选择复制一个页面时，系统需要为新页面创建一个唯一的标识符，即新的pageId。这个操作通常在后端进行，因为数据库需要确保这个新的pageId是唯一的，不会与现有页面的pageId冲突。生成新的pageId后，系统会使用这个新的标识符来创建页面的数据记录，确保新旧页面在数据库层面是完全独立的。

[0115] 需要理解的是，在一实施例中，在前端页面中，为每个页面条目添加一个“复制”按钮。用户点击此按钮时，前端通过事件监听器捕获点击事件，并构建一个新的URL，包含参数isCopy＝true和pageId＝<原始页面ID>。

[0116] 使用HTML5的history.pushState方法来改变URL，实现无需刷新页面即可跳转到编辑页面，并带上新的URL参数。

[0117] 后端提供一个API接口，用于接收前端发送的带有isCopy和pageId参数的请求。这个接口应该能够处理multipart/form‑data类型的请求，以便于上传文件。

[0118] 后端需要验证用户权限，确保用户有权限复制页面。这可以通过Spring Security等安全框架来实现权限控制。

[0119] 生成新的pageId：如果isCopy＝true，则后端需要生成一个新的唯一pageId。这可以通过数据库的自增字段或者分布式ID生成策略来生成，如使用Snowflake算法。新的pageId生成后，后端使用它来创建新页面的数据记录。

[0120] 前后端的数据交互通常通过HTTP协议进行。前端通过AJAX请求向后端发送数据，后端处理请求并返回数据。这个过程可以通过axios等HTTP客户端库来实现。

[0121] 为了提升用户体验，可以在复制操作后提供即时的反馈，例如通过一个提示框或者页面上的消息提示来告知用户操作成功。

[0122] 在跳转至编辑页面时，可以使用前端路由库(如Vue Router或ReactRouter)来管理页面跳转，以实现单页应用(SPA)的效果，提高页面加载效率和用户体验。

[0123] 错误处理和日志记录：在生成pageId和创建数据记录的过程中，后端应实现错误处理机制，以应对可能出现的异常情况，如网络错误、数据格式错误等。同时，后端应记录关键操作的日志，以便于问题排查和审计。日志应包含足够的上下文信息，如时间戳、日志级别、线程信息、类名、简短描述和可能的异常信息。确保上传的图片文件和页面数据不会引入安全漏洞，如跨站脚本攻击(XSS)。对上传的文件进行病毒扫描，以防止恶意软件的上传。

[0124] S13、根据提取的所述页面标识符参数检索所述模板库中对应的当前模板页面数据，根据所述当前模板页面数据对当前模板进行更新，并保存至所述模板库；

[0125] 在一实施例中，判断是否有复制标识isCopy，如果isCopy＝true，则在保存前重新生成pageld，如果isCopy＝false或不存在，则使用url上的pageld进行更新。这个步骤说明在保存新页面之前，如果存在复制标识，系统将重新生成一个新的pageld(即页面ID)，以便与原始页面区分开来。如果没有复制标识，则使用URL中提供的pageld进行页面更新。前端在用户点击“保存”按钮时，收集页面数据和isCopy状态，然后发送一个POST请求到后端。后端接收请求，检查isCopy参数。如果isCopy为true，则生成一个新的唯一pageId并保存新页面。如果isCopy为false或不存在，则使用请求中的pageId更新现有页面。使用uuid库生成新的唯一的pageId，确保每个页面都有一个唯一的标识符。

[0126] isCopy＝false或不存在的情况通常发生在以下几种场景：

[0127] 原始创建页面：当用户首次创建一个新页面，而不是复制现有页面时，isCopy参数不会被设置，因此默认为false或不存在。

[0128] 编辑现有页面：如果用户正在编辑一个已经存在的页面，而不是创建一个新页面的副本，那么isCopy参数同样不会被设置。

[0129] 直接访问编辑页面：如果用户通过直接访问编辑页面的URL(可能是通过书签、历史记录或直接输入URL)进入编辑页面，而没有通过点击“复制”按钮，那么isCopy参数将不存在。

[0130] 非复制操作的API调用：在某些情况下，后端API可能被设计为接受不带isCopy参数的请求，以处理非复制相关的操作。

[0131] 前端逻辑错误：如果前端代码中存在逻辑错误，可能导致在应该设置isCopy参数时未能正确设置。

[0132] 手动URL修改：用户或开发者可能手动修改了URL，导致isCopy参数被删除或设置为false。

[0133] 后端应该能够处理这些情况，确保无论isCopy参数是否存在或其值如何，系统都能正确地响应请求。例如，如果isCopy参数不存在或为false，后端可以决定加载一个空白页面模板供用户编辑，或者加载一个已有页面的数据以供更新。

[0134] 当isCopy＝false或不存在时，通常意味着用户正在进行除复制页面之外的操作，例如直接编辑现有页面或创建一个全新的页面。在这种情况下，需要确保能够正确识别用户的意图，并根据用户的权限和操作来更新或创建页面数据记录。例如：请求拦截与参数解析：在后端，设置一个拦截器来处理所有进入的请求，解析URL中的参数，如isCopy和pageId。如果isCopy参数不存在或为false，则继续执行现有页面数据的更新流程。

[0135] 权限验证：在处理请求之前，验证用户是否具有更新页面的权限。这可以通过检查用户的角色、权限列表或页面的所有权来实现。如果用户没有足够的权限，返回一个错误响应，如HTTP状态码403(禁止访问)。

[0136] 数据更新逻辑：如果用户有权限，根据提供的pageId参数，从数据库中检索相应的页面数据记录。执行数据更新操作，这可能包括修改页面内容、元数据或其他相关字段。确保数据库事务的完整性，以防止在更新过程中发生的数据不一致问题。

[0137] 前端实时反馈：在前端，可以使用轮询、长轮询、WebSocket或Server‑Sent Events(SSE)等技术来实现数据的实时更新。例如，使用WebSocket建立一个持久的连接，以便服务器可以实时推送更新到客户端，无需客户端频繁发送请求。

[0138] 数据版本控制：为了处理并发更新，可以实现一个乐观锁机制，通过在数据记录中包含一个版本号或时间戳来检测更新冲突。如果在更新过程中检测到版本冲突，通知用户并提供解决冲突的选项。

[0139] 前端页面刷新策略：使用前端框架(如Vue.js或React)的路由守卫和生命周期钩子来管理页面刷新。例如，可以在路由守卫中检查用户的操作，决定是否需要刷新页面或仅刷新页面的特定部分。

[0140] 错误处理和日志记录：在整个更新流程中，添加错误处理逻辑来捕获并响应可能发生的任何异常。记录关键操作的日志，以便于问题排查和审计。

[0141] 用户界面反馈：在前端，为用户提供明确的操作反馈，如操作成功或失败的提示信息。对于长时间操作，提供加载指示器或进度条，以提高用户体验。

[0142] 最终可以确保用户在点击复制按钮时，能够顺利跳转到编辑页面，并且URL中携带了正确的复制标识和页面ID，同时后端能够正确处理这些参数，创建新的页面数据记录。

[0143] S14、获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据；

[0144] 本实施例中，获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图；提取提取所述模板页面数据，将所述模板页面数据转换成对应字符串，并保存至所述预置模板列表，具体可以是在捕获页面内容的同时，收集页面的结构和数据信息，包括但不限于表单字段、用户设置的选项和其他动态数据。将收集到的数据进行序列化，以便于传输和存储。

[0145] 生成对应的页面模板预览图通过canvas绘制技术，将页面DOM节点进行按需生成图片file文件，向后端服务器按需请求保存，后续用户可以在模板库看到自己需要的模板，降低操作难度和理解成本。

[0146] 具体的可以是使用JavaScript遍历DOM树：通过JavaScript遍历DOM树，捕获页面的结构和数据信息。将收集到的数据进行序列化。接收序列化的数据：通过AJAX请求接收前端发送的序列化数据。将解析后的pageData对象存储到数据库中，可以使用MongoDB、MySQL等数据库系统。

[0147] 最终可以在捕获页面内容的同时，收集页面的结构和数据信息，并将这些信息序列化以便于传输和存储。在前端，通过遍历DOM树收集表单字段、用户设置的选项和其他动态数据，然后将这些数据序列化为JSON字符串。在后端，接收序列化的数据，将其解析为对象，并存储到数据库中。这样，就可以有效地捕获和存储页面的详细数据，以便后续的处理和分析。

[0148] 为了优化手动截图的繁琐过程，本步骤提出了一个自动化的解决方案。具体来说，系统将提供一个单独的【生成模板】功能，用户可以通过这个功能快速生成页面的模板截图。此外，在保存页面时，系统还将提供【是否生成模板】的选项，以便用户根据自身需求选择是否创建模板。

[0149] S15、保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图。

[0150] 本实施例中，保存所述模板页面数据至模板列表，并创建与前端关联的模板列表调用接口；通过所述模板列表调用接口获取到前端发送的模板展示指令；解析所述模板展示指令，根据对应的模板标识符参数发送所述页面模板预览图至所述前端进行可视化。

[0151] 列表、新增页新增【模板库】入口，展示所有已生成的模板截图。在这个步骤中，系统将在列表和新增页面中增加一个【模板库】入口，通过这个入口可以查看所有已经生成的模板截图。用户可以通过点击【应用模板】按钮跳转到新增页面，并带入模板ID。通过查询模板数据，可以将相关模板信息回显到页面上，例如一个页面的模块卡片，比如有轮播幻灯片模块，商品模块、领券模块。

[0152] 【模板库】支持缩略图展示、按钮支持【大图预览】、【删除】、【应用模板】。在这个步骤中，我们将对【模板库】的功能进行扩展，使其支持缩略图展示、大图预览、删除和应用等操作。这样用户可以更方便地管理和使用模板库中的内容。

[0153] 【页面列表】展示【复制】按钮。最后一步是在【页面列表】中增加一个【复制】按钮的显示功能。这样用户可以更方便地找到并使用复制功能来创建新的页面版本。

[0154] 本实施例提供的模板库配置方法，可以通过获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数，判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库，获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据，保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图，解决了目前现有当不同的金融商品相对不同B端(商家)有不同的品类、价格等差异化，例如品类差异(如股票、债券、基金等)和价格差异(如利率、手续费等)，对商家需要能够根据自己的营销策略和目标客户群体自主创建和定制活动，以提高用户参与度和销售转化率，同时要求商家能够自主管理活动的运营和销售过程，包括活动发布、监控、分析和优化，因为前述的需求，商家需要填写繁琐的表单，导致的效率低下的技术问题。

[0155] 同时，判断所述复制判断参数是否有效，若有效，则生成新页面标识符参数，根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库，实现了可以快速套用现成活动模板，无需每次重新拖拉拽编辑活动模板。

[0156] 进一步，获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图，使得用户可以在模板库看到自己需要的模板，降低操作难度和理解成本。

[0157] 在一实施例中，提供一种模板库配置装置，该模板库配置装置与上述实施例中模板库配置方法一一对应。如图3所示，该模板库配置装置包括获取模块101、判断模块102、生成模块103、可视化模块104。各功能模块详细说明如下：

[0158] 获取模块101，用于获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数；

[0159] 在一实施例中，获取模块101，具体用于以下步骤：

[0160] 获取前端发送的所述模板页面配置请求，按照预设权限验证方式验证用户权限；

[0161] 提取所述模板页面配置请求中的所述复制判断参数和所述页面标识符参数。

[0162] 判断模块102，用于判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库；

[0163] 在一实施例中，判断模块102，具体用于以下步骤：

[0164] 判断所述复制判断参数是否有效，若有效，则生成新页面标识符参数；

[0165] 根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库。

[0166] 同时，若判断所述复制判断参数为无效，则根据提取的所述页面标识符参数检索所述模板库中对应的当前模板页面数据；

[0167] 根据所述当前模板页面数据对当前模板进行更新，并保存至所述模板库。

[0168] 生成模块103，用于获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据；

[0169] 在一实施例中，生成模块103，具体用于以下步骤：

[0170] 获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图；

[0171] 提取提取所述模板页面数据，将所述模板页面数据转换成对应字符串，并保存至所述预置模板列表。

[0172] 可视化模块104，用于保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图。

[0173] 在一实施例中，可视化模块104，具体用于以下步骤：

[0174] 保存所述模板页面数据至模板列表，并创建与前端关联的模板列表调用接口；

[0175] 通过所述模板列表调用接口获取到前端发送的模板展示指令；

[0176] 解析所述模板展示指令，根据对应的模板标识符参数发送所述页面模板预览图至所述前端进行可视化。

[0177] 本实施例中，还包括：

[0178] 复制键添加模块，用于采用页面组件配置函数在所述前端的模板页面配置界面添加复制键，对所述复制键绑定事件监听器。

[0179] 本实施例提供的模板库配置装置，可以通过获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数，判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库，获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据，保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图，解决了目前现有当不同的金融商品相对不同B端(商家)有不同的品类、价格等差异化，例如品类差异(如股票、债券、基金等)和价格差异(如利率、手续费等)，对商家需要能够根据自己的营销策略和目标客户群体自主创建和定制活动，以提高用户参与度和销售转化率，同时要求商家能够自主管理活动的运营和销售过程，包括活动发布、监控、分析和优化，因为前述的需求，商家需要填写繁琐的表单，导致的效率低下的技术问题。

[0180] 同时，判断所述复制判断参数是否有效，若有效，则生成新页面标识符参数，根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库，实现了可以快速套用现成活动模板，无需每次重新拖拉拽编辑活动模板。

[0181] 进一步，获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图，使得用户可以在模板库看到自己需要的模板，降低操作难度和理解成本。

[0182] 关于模板库配置装置的具体限定可以参见上文中对于模板库配置方法的限定，在此不再赘述。上述模板库配置装置中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中，也可以以软件形式存储于计算机设备中的存储器中，以便于处理器调用执行以上各个模块对应的操作。

[0183] 在一个实施例中，提供了一种计算机设备，该计算机设备可以是服务端，其内部结构图可以如图4所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中，该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性和/或易失性存储介质、内存储器。该非易失性存储介质存储有操作系统、计算机程序和数据库。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的网络接口用于与外部的客户端通过网络连接通信。该计算机程序被处理器执行时以实现一种模板库配置方法服务端侧的功能或步骤。

[0184] 在一个实施例中，提供了一种计算机设备，该计算机设备可以是客户端，其内部结构图可以如图5所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口、显示屏和输入装置。其中，该计算机设备的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统和计算机程序。该内存储器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的网络接口用于与外部服务器通过网络连接通信。该计算机程序被处理器执行时以实现一种模板库配置方法客户端侧的功能或步骤。

[0185] 在一个实施例中，提供了一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，处理器执行计算机程序时实现以下步骤：

[0186] 获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数；

[0187] 判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库；

[0188] 获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据；

[0189] 保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图。

[0190] 本实施例提供的计算机设备，可以通过获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数，判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库，获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据，保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图，解决了目前现有当不同的金融商品相对不同B端(商家)有不同的品类、价格等差异化，例如品类差异(如股票、债券、基金等)和价格差异(如利率、手续费等)，对商家需要能够根据自己的营销策略和目标客户群体自主创建和定制活动，以提高用户参与度和销售转化率，同时要求商家能够自主管理活动的运营和销售过程，包括活动发布、监控、分析和优化，因为前述的需求，商家需要填写繁琐的表单，导致的效率低下的技术问题。

[0191] 同时，判断所述复制判断参数是否有效，若有效，则生成新页面标识符参数，根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库，实现了可以快速套用现成活动模板，无需每次重新拖拉拽编辑活动模板。

[0192] 进一步，获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图，使得用户可以在模板库看到自己需要的模板，降低操作难度和理解成本。

[0193] 在一个实施例中，提供了一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现以下步骤：

[0194] 获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数；

[0195] 判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库；

[0196] 获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据；

[0197] 保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图。

[0198] 本实施例提供的计算机可读存储介质，可以通过获取前端发送的模板页面配置请求，并从所述模板页面配置请求中提取复制判断参数和页面标识符参数，判断所述复制判断参数是否有效，若有效，则生成与当前模板页面关联的新页面标识符参数，并根据所述新页面标识符参数更新模板页面数据至模板库，获取所述前端发送的模板生成指令，根据所述模板生成指令生成当前模板页面对应的页面模板预览图，并提取当前模板页面的所述模板页面数据，保存所述模板页面数据至预置模板列表，并发送至所述前端，供所述前端可视化所述页面模板预览图，解决了目前现有当不同的金融商品相对不同B端(商家)有不同的品类、价格等差异化，例如品类差异(如股票、债券、基金等)和价格差异(如利率、手续费等)，对商家需要能够根据自己的营销策略和目标客户群体自主创建和定制活动，以提高用户参与度和销售转化率，同时要求商家能够自主管理活动的运营和销售过程，包括活动发布、监控、分析和优化，因为前述的需求，商家需要填写繁琐的表单，导致的效率低下的技术问题。

[0199] 同时，判断所述复制判断参数是否有效，若有效，则生成新页面标识符参数，根据生成的所述新页面标识符参数，创建对应的新页面数据记录，并更新模板页面数据至模板库，实现了可以快速套用现成活动模板，无需每次重新拖拉拽编辑活动模板。

[0200] 进一步，获取前端发送的模板生成指令，采用预设图形绘制模块对当前模板页面进行绘制，生成对应的页面模板预览图，使得用户可以在模板库看到自己需要的模板，降低操作难度和理解成本。

[0201] 需要说明的是，上述关于计算机可读存储介质或计算机设备所能实现的功能或步骤，可对应参阅前述方法实施例中，服务端侧以及客户端侧的相关描述，为避免重复，这里不再一一描述。

[0202] 本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一非易失性计算机可读取存储介质中，该计算机程序在执行时，可包括如上述各方法的实施例的流程。其中，本申请所提供的各实施例中所使用的对存储器、存储、数据库或其它介质的任何引用，均可包括非易失性和/或易失性存储器。非易失性存储器可包括只读存储器(ROM)、可编程ROM(PROM)、电可编程ROM(EPROM)、电可擦除可编程ROM(EEPROM)或闪存。易失性存储器可包括随机存取存储器(RAM)或者外部高速缓冲存储器。作为说明而非局限，RAM以多种形式可得，诸如静态RAM(SRAM)、动态RAM(DRAM)、同步DRAM(SDRAM)、双数据率SDRAM(DDRSDRAM)、增强型SDRAM(ESDRAM)、同步链路(Synchlink)DRAM(SLDRAM)、存储器总线(Rambus)直接RAM(RDRAM)、直接存储器总线动态RAM(DRDRAM)、以及存储器总线动态RAM(RDRAM)等。

[0203] 所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，仅以上述各功能单元、模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能单元、模块完成，即将所述装置的内部结构划分成不同的功能单元或模块，以完成以上描述的全部或者部分功能。

[0204] 以上所述实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围，均应包含在本发明的保护范围之内。

[0205] 应当说明的是，本申请实施例中若出现了非本公司的软件工具或组件，仅仅是用于举例介绍，并不代表实际使用。