@farris/ide-wizard-prestep v0.0.2

MetadataCreateWizard

新建元数据向导页与前置页组件

This project was generated with Angular CLI version 7.3.9.

//全局引入模块
import { CreateStepModule } from '@farris/ide-wizard-prestep';
//html中使用
<app-create-step [steps]="steps" (clickCancelBtn)="clickCloseModal()" (clickFinishBtn)="clickFinishBtn()" (handleBasicInfo)="handleBasicInfo($event)"></app-create-step>

step组件

组件参数

interface stepItem {
      stepId: string, //步骤id
      title: string,
      component: Component,
      data: Object,
      show: boolean, //是否展示
      nextStep: string, //下一步步骤id
      showFinishBtn: boolean,//是否展示结束按钮
      showCancelBtn: boolean,//是否展示取消按钮
      showLastStepBtn: boolean,//是否展示上一步
      showNextStepBtn: tbooleanrue//是否展示下一步
}
steps:Array<stepItem> //步骤数组
clickCancelBtn: Function //取消按钮
clickFinishBtn:Function //结束按钮
handleBasicInfo:Function //基本信息注册完毕的回调


//组件内定义
validation: () => return boolean //步骤完成时的校验，点击下一步或完成时触发，返回boolean或者Subject<boolean>，true时完成该步骤，false时不做处理
changeStep: () => return Array<stepItem> //进入步骤时触发，用于隐藏、修改步骤相关属性，stepId为必传项，其他为可选项，传入的数组仅为修改数组。
removeStep、addStep //同上，但不推荐使用，需求可通过show字段控制步骤是否可以展示

pre-step组件

//ts中使用
import { PreStepComponent } from '@farris/ide-wizard-prestep';
steps = [
    {
      stepId: 'basicTemplate',
      title: '新建元数据',
      component: PreStepComponent,
      data: this.formInfo,
      show: true,
      nextStep: '',
      showFinishBtn: false,
      showCancelBtn: true,
      showLastStepBtn: false,
      showNextStepBtn: true
    }
  ];
//html中使用