扩展函数

1 自定义组件弹窗函数openWindow

• url 被打开页面的源码路径   其格式为 src 下至被打开的页面名，只支持 Vue 页面，去除.vue 后缀   常用路径

  1. views/basic/dynamicModel/list/Form  表单页面
  2. views/workFlow/components/FlowBox  流程表单页面
  3. views/basic/dynamicModel/list/index  列表页面
  4. views/infra/word/wordPBSTemplate/index  自定义页面例如

• popupType 弹窗类型，general-普通弹窗，fullScreen-无 dialog 弹出,drwan-抽屉弹出；注意如果弹出页面出现两次，则需要使用fullScreen

• refresh  在关闭表单后刷新与表单链接的列表，刷新只针对两个函数 init 和 initPage

• showFooter 是否展示弹窗底部(确认，取消按钮)

• showHeader 是否展示弹窗头部(标题，按钮等)

• openTabsOnBrowser 是否在浏览器新 tab 页中打开

• width 弹窗宽度

• height 弹窗高度

• title 弹窗标题

• isDetail 是否为详情页，详情页会禁用组件，隐藏弹出上面的按钮

• data 类型应为 Object 会通过 init 传入被打开页面内部，可通过被打开页面的自定义 JS 方法的参数获取

  • TmplCode  打开配置页面必不可缺的参数，它是配置页面的结构数据 id,功能设计 id
  • flowId 对于打开高开的流程表单使用这个参数，他是流程设计的id(TmplCode和flowId只需要一个)
  • id  打开页面的真实数据 ID，通常情况下会根据此 id 在被打开页面的 init 方法中使用
  • formType  表单类型，是开发模式=1,配置模式=2，如果要打开流程页面时，是必须的
  • opType  流程状态，待审，已审，抄送，发起等
  • defVal  自定义数据集，用作生成默认值，或传递数据 id
  • taskId  流程任务 id(可选)
  • taskNodeId  流程任务节点 id(可选)

• onDestroy  回调函数

  • confirm  确认后调用
    • data  弹窗数据-表单数据
    • selectedData  弹窗数据-选择数据
  • componentClose  回调关闭后调用
    • close  关闭弹窗

({ data, request, toast, refresh, initDynamicModelData, openWindow }) => {
  let that = this;
  openWindow({
    url: "views/infra/word/wordPBSTemplate/index",
    height: "800px",
    width: "800px",
    title: "选择数据",
    showHeader: true,
    showFooter: true,
    refresh: true,
    popupType: "general",
    isDetail: false,
    data: {
      TmplCode: "547062297219039429",
      id: "585007185948316677",
      taskNodeId: "585007187017864198",
      taskId: "585025915570885637",
      opType: "1",
    },
    onDestroy: {
      confirm: ({ data, selectedData }) => {
        console.log(data, selectedData, "confirm======data=======");
        this.close();
      },
      componentClose: () => {
        console.log("componentClose==========");
        this.close();
      },
    },
  });
};

2 根据枚举值和枚举列表获取枚举文本getEnumText

• enumItemCodes  枚举值, 例如 enumItemCodes: "aa,bb,cc"
• enumItemList  枚举列表, 例如 enumItemList: [{code: "aa", value: "aa"}, {code: "bb", value: "bb"}, {code: "cc", value: "cc"}]

this.jnpf.getEnumText(enumItemCodes, enumItemList);

3 格式化函数format

该函数在 extend.js 中定义，功能如下：

• 为枚举做转换 enumFormat
• 转换日期格式 dateFormat
• 为数字做千分位 thousand
• 为数字做小数点位数(精度) precision
• 为数字添加单位及添加特殊字符(货币符号等) currency
• 为列表列做合计处理(目前只支持以下四种，这四种都解决了 js 浮点数计算的问题) totalInfo
  • 平均值
  • 合计值
  • 最大值
  • 最小值
• 展示动态文本(字符串和变量拼接) textDecoration
• 为文本添加颜色 textColor
• 解构对象类型(展示对象嵌套类型内部属性) arrayObjectShowField
• 外链链接 hyperlink
• 内链参数(参数是为 CC 提供的) linkCC

4 返回值函数相关returnParam

支持绑定值至 dataForm，dataForm的属性上(即子表)，与 dataForm 同级的属性(父级组件的属性)，不符合上述条件则绑定至父级组件 this 上

• labelText 显示文本
• returnParams 返回参数键值对
• customParamsChange 处理函数
• target 绑定目标，可以是 this， dataFrom，或子表或任意属性
• rowIndex 处于子表时的行数

<user-select
  v-model="dataForm.CREATORUSER"
  :labelText="item.labelText"
  :returnParams="{ CREATORUSERNAME: 'fullName' }"
  @customParamsChange="selectChange(...arguments, item)"
/>

import { setSelectParams } from "@/utils/base.js";

selectChange(info, target, rowIndex) {
  if (!target) {
     this[target] = this.dataForm[target];
  }
  setSelectParams.call(this, { ...info, target, rowIndex });
}