# 插件示例 ## 简介 本工程是GMS业务中台中写插件的样例代码。编写插件的主要场景是:产品上通过编写插件,让产品可以在所有app打开之前,做一些必要的初始化工作。 例如扩展默认的单据控件,单据动作等。 ## 模块介绍 ### 1. 模块名 gms-plugin-sample ### 2. 部分功能文件介绍 1. plugin.js-------- 入口文件 2. src/control -------扩展的控件内容部分 3. src/actions --------扩展动作部分 4. src/fomula -------扩展公式 5. emcon.js ---------注册清单(定义控件名,绑定控件功能,控件相关参数配置) 6. mcon.js --------- 运行期注册 ### 3. 扩展流程介绍 #### 3.1 新建控件页面 在src/control 文件夹下,创建新的.vue 文件,开发扩展控件 ,列如 testplugin.vue ``` <template> <div> <div>这里是个测试扩展组件</div> </div> </template> <script> export default { name: "", data() { return { } } } </script> <style scoped> </style> ``` #### 3.2 注册扩展控件 在mcon.js文件中注册扩展的控件如下,导出的billAction、billControl、formula这三个key值不能变 ``` //actions import sampleAction from './actions/sampleAction'; //control import sampleControl from './control/testplugin.vue'; //formula import SubColSum from './formula/SubColSum.js'; export default { billAction: { sampleAction }, billControl: { sampleControl }, formula:{ SubColSum } } ``` #### 3.3 添加控件相关参数配置 在 emcon.js 文件中添加新扩展的控件配置信息,用于页面读取 ``` export default { billControl: [ { "title": "测试扩展", //控件名称 "description":"", //控件描述 "discard": false, "dynamicComponent":'billForm', // "path": "资产/通用", "value":"sampleControl", //绑定的控件,与mcon.js 中导出的控件名一致 "extends":{} //该控件配置信息的集合 } ] } ``` ### 4. 在项目中的使用( 该功能模块将作为一个依赖包,从制品库中下载下来使用 ) 1. 在 solution.json 中引用,在 "@gms" 模块下添加依赖模块 gms-plugin-sample ``` "@gms":[ { "name": "gms-plugin-sample", "version": "latest" } ], ``` 2. 初始化项目,从制品库拉依赖 ``` os-cli init dev ``` 3. 终端切到该模块下,安装模块所需依赖 ``` npm i ``` 4. 编译该模块 ``` npm run build-dev ``` 5. 切换回上级项目路径下,启动项目 ``` os-cli serve ``` ### 5. 查看并使用扩展的组件 项目启动后,进入工作空间,在单据的界面设计页签中,可看到扩展的控件 ### 用法 1. 修改package.json以及app.config.json里面的name属性,其他的不用动 2. 在src的mcon.js文件中,按照扩展规范,注册扩展的控件、动作等。 3. npm run build构建插件 4. npm publish发布插件到npm仓库 5. 项目上通过在solution文件中引用这个插件来使用插件。