任务模块前端组件使用参考文档(erdf-task-manage)

69 阅读3分钟

目录结构及文件描述

image.png

目录文件类别描述
BoardBoard看板任务统计
MixinsdataSource内置的数据方法混入到taskModel文件
taskInfobtnGrid按钮区内容内置了任务的新增、删除、启动、完成、导入、导出方法,可传参自定义方法
 fatherTask父任务选择组件taskInfo文件选择父任务
 gantt任务甘特图组件甘特图视图(gantt)
 resourceSelector资源选择组件taskInfo文件选择资源
 tableGrid单列表组件列表视图(list)
 taskConfig甘特图内使用的任务信息新增编辑组件需搭配gantt组件使用
 taskInfo任务信息组件任务信息的新增、编辑组件
 taskSearch搜索区组件可传参自定义搜索项
 totalCofing甘特图功能设置组件需搭配gantt组件使用
 totalDataGrid表格底部组件目前搭配列表tableGrid使用
taskModel 任务模块组件组装taskInfo内小组件
index 自定义界面-主页引用taskModel组件,完成自定义配置使用
detail 自定义界面-详情引用taskInfo,插槽自定义业务字段

文件配置

1. Index.vue引入taskModel 配置项说明

taskModel.vue 组件配置项类型详情
busSourceString任务类型(通过provide注入)
microservicesString微服务名称(通过provide注入)
resourceString资源名称(通过provide注入)
basePathString外层路径
mainBtnsConfigureProp按钮配置见附1
gridColumnBtnsConfigureProp表格内按钮配置见附2
gridColumnFieldsConfigureProp表格内字段配置见附3
gridColumnStatusConfigure表格内状态字段表现配置见附4
@getcomponentView获取表格对象的事件返回实例
crumbsArrPropArray面包屑
isShowToolbarBoolean是否展示工具栏(暂时没用,可不管)
showImportButtonsBoolean是否需要导入导出
queryFormConfigure搜索项配置见附6

2.detail.vue引入taskInfo 配置项说明

detail.vue组件配置项类型详情
microservices****String****微服务名
resource****String****资源名
busSourceString任务类型
busFormObject外部默认插槽表单
readOnlyBoolean外部通过operate执行类型判断是否只读
@confirm事件确认事件,提交内外部数据并回传信息
@cancel事件获取取消的回传事件
@getOtherBusInfo事件内部请求回的数据回传
hasResourceBoolean是否需要资源选择

参数附录

附1 mainBtnsConfigureProp(按钮区按钮)

参数详情类型
name按钮名称String
text按钮文本String
location位置String
icon图标String
click事件(可选项,无click时内部通过name选择执行内部定义方法)String

附2 gridColumnBtnsConfigureProp(列表内按钮)

参数详情类型
text按钮文本String
operate执行类型'edit'、'view'、'add'
disabled禁用条件['state', 'in', ['完成', '中止']]
path跳转的路径String

附3 gridColumnFieldsConfigureProp(列表字段)

参数详情类型
caption字段名称String
dataField字段String
alignment..String
fixed..String
allowHiding..String
sortOrder..String
allowSorting..String

 

附4 gridColumnFieldsConfigureProp(任务状态,也可通过插槽自定义状态)

参数详情类型
text状态文本String
dataField状态字段名名称String
dataFieldValue状态字段值'待启动'、'执行中'...
type状态类型'primary'、'warning'、'success' 、'danger'

附5 queryFormConfigure(搜索区搜索项)

参数详情类型
editorType编辑类型String(见官网)
labelText搜索名称String
dataField查询字段String
colSpan搜索行行宽Number
list如果是选择项组件需填选项数组Array

w=374&h=420&s=23002&e=png&b=f3f3f3)