-
页面JS基本使用与管理 - 产品数字化协同平台云服务
页面JS基本使用与管理 编写JS脚本 单击左侧插件栏中页面JS按钮即可打开页面JS面板。在代码编辑区中编写好代码后单击右上角保存按钮。 图1 代码编辑区 系统预先编写好了一些范例脚本，单击“展示使用帮助”可以查看提供的范例脚本。
-
页面JS及事件绑定 - 产品数字化协同平台云服务
页面JS及事件绑定 页面JS基本使用与管理 绑定API 父主题： UI编辑器使用帮助
-
准备工作 - 产品数字化协同平台云服务
准备工作 开发技能要求 熟悉前端JS，能够编写JS代码。 了解基本的Vue框架，熟悉前端应用构建。 环境要求 已安装Node.js环境。 安装Node及Npm Node.js是一个JavaScript的运行环境，它能帮我们在服务器端运行JavaScript代码。
-
绑定API - 产品数字化协同平台云服务
父主题： 页面JS及事件绑定
-
变量绑定及使用 - 产品数字化协同平台云服务
图3 绑定成功 修改变量 添加的状态通常是一个可以随不同状态有不同值的变量，如果想要改变它，可以在JS面板中通过this.state.xxx或this.global.xxx获取到页面，应用状态并且改变它。 父主题： 状态管理及变量绑定
-
日期选择器 - 产品数字化协同平台云服务
数据传递格式 设置数据传递格式，有如下格式： 图1 数据传递格式 禁用日期 通过编写JS代码，设置禁用的日期。
-
评审页面模板 - 产品数字化协同平台云服务
图1 使用插槽 评审结论获取方法 获取评审结论的方法已写到JS帮助文档中，使用时直接调用此函数就可以获取。
-
调试工具 - 产品数字化协同平台云服务
调试工具 Vue Devtools是一个专为Vue.js开发者设计的浏览器扩展。它提供了一系列强大的功能，帮助开发者更容易地调试和优化他们的Vue应用程序。
-
步骤四：绘制流程页面 - 产品数字化协同平台云服务
图15 提交按钮 选择左侧插件栏的JS，进入JS页面，单击“展示使用帮助”。如图16所示。 模板中预置了常用的JS脚本模板，可以直接复制编辑使用。 提交节点可以粘贴提交模版事件，审批节点粘贴审批模版事件。
-
总体开发思路 - 产品数字化协同平台云服务
通过Webpack进行组件打包构建成为独立JS。 独立JS能够被懒加载。 在管理页面进行卡片创建，上传管理。 创建卡片实例，关联独立JS包，进行版本控制。 父主题： 卡片配置指南
-
开发指导 - 产品数字化协同平台云服务
打包后的js文件运行逻辑已在门户专门处理，按照下列方式配置打包入口文件即可。 在package目录下新建index.js文件，代码如下： import demoCard from '.
-
状态管理 - 产品数字化协同平台云服务
插入JS函数：单击，给变量插入js方法（显示为object对象），可以在JS方法中通过this.state.xxx()或this.global.xxx()调用。 格式化：单击，格式化代码，格式化初始值，使其代码整洁美观。 全屏：单击，在页面中心区域内显示面板。
-
卡片上传使用 - 产品数字化协同平台云服务
图4 zip示例截图 图5 上传卡片 Vue CLI生成的卡片输出为完整js，需要将其重命名为index.js，放置在zip压缩包内。否则会出现验证不通过的异常。 使用卡片 卡片上传完成之后就可以在角色桌面中查看并使用了。
-
开发概述 - 产品数字化协同平台云服务
工作原理 组件化开发思想 采用Vue.js的组件化开发思想，将整体功能模块包装成一个个独立且可复用的组件，独立维护自身的状态及样式，更好地隔离多方合作伙伴的不同诉求，提升代码的可维护性。
-
UI编辑器使用帮助 - 产品数字化协同平台云服务
UI编辑器使用帮助 设计器界面 物料及模板 业务组件 IPD组件 流程模板 属性面板设置 高级面板设置 国际化词条 页面JS及事件绑定 状态管理及变量绑定 资源管理 父主题： 流程配置指南
-
设计器界面 - 产品数字化协同平台云服务
画布清除工具 清空当前画布页面相关的所有信息（如页面schema、页面状态、页面JS等配置）。 画布刷新工具 刷新当前页面信息，重新载入页面。 保存工具 保存当前页面的所有配置信息。 预览工具 在浏览器中打开新的标签页，预览当前编辑好的页面。
-
按钮 - 产品数字化协同平台云服务
高级事件 表2 高级事件 序号 事件名 触发条件 说明 1 onClick 单击按钮 单击按钮后触发JS方法或绑定的API接口 父主题： 表单组件
-
消息提示框 - 产品数字化协同平台云服务
组件图标： 基本属性 表1 基础信息 序号 属性名 说明 设置器类型 可选值 默认值 支持变量绑定 1 显示 通过JS方法或事件，控制弹框显示或隐藏 switch开关 开/关 开 √ 2 类型 选择消息提示框类型 select选择框 信息，成功，告警，错误，弱信息 信息 √ 3 消息内容
-
步骤二：配置服务定义 - 产品数字化协同平台云服务
选择“脚本任务”组件，填写JS脚本信息，如图11所示。 表示将“服务任务1”获取的token传入“服务任务2”。
-
下载轻量化文件 - 产品数字化协同平台云服务
filePath=1804036975960895488/0/model.js 响应示例 状态码： 200 二进制文件流 状态码： 400 错误响应 示例一： { "error_code" : "01090001", "error_msg" : "系统错误，请联系管理员！"
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
