• render 方法


    在使用 render 方法之前需引入相应的方法。

    import { dateTimeRender, enableRender } from 'utils/renderer';
    

    enableRender

    返回 启用/禁用 对应的多语言,并加上状态标记。

    参数

    [v = 0 | 1](Number) :状态

    返回

    (string): 1 返回 enable(多语言),0 返回 disabled(多语言)。

    示例

    
    const columns = [
      ...
      {
        title: intl.get('hzero.common.status').d('状态'),
        dataIndex: 'enabledFlag',
        width: 80,
        render: enableRender,
      },
    ]
    

    yesOrNoRender

    返回 是/否 多语言 并加上对应的状态标记。

    参数

    [v = 0 | 1](Number):值

    返回

    (string): 1 返回 yes(多语言),0 返回 no(多语言)。

    示例

    const columns = [
      ...
      {
        title: intl.get('hfile.storage.model.storage.defaultFlag').d('默认'),
        dataIndex: 'defaultFlag',
        width: 100,
        render: yesOrNoRender,
      }
    ]
    

    totalRender

    用于显示数据总量和当前数据顺序。

    参数

    [total](number):数据总量

    [range](number[]):当前数据的第一条数据序号, 当前数据最后一条数据序号

    返回

    (string): 返回分页总数的多语言。

    示例

      pagination: {
        ...
        showSizeChanger: true,
        showTotal: totalRender,
      },
    

    dateRender

    将日期格式化成当前用户选择的日期格式

    参数

    [dateStr](string):日期字符串

    返回

    (string): 返回格式化后的日期字符串。

    示例

    dateRender('2018/2/2')
    
    const columns = [
      {
        title: intl.get('hiam.subAccount.model.user.endDateActive').d('有效期至'),
        dataIndex: 'endDateActive',
        width: 100,
        render: dateRender,
      }
    ]
    

    dateTimeRender

    将日期时间格式化成当前用户选择的日期时间格式

    参数

    [dateTimeStr](string):日期时间字符串

    返回

    (string): 返回格式化后的日期时间字符串。

    示例

    dateTimeRender('2018/2/2 21:21:21')
    
    const columns = [
      {
        title: intl.get('hiam.subAccount.model.user.endDateActive').d('有效期至'),
        dataIndex: 'endDateActive',
        width: 100,
        render: dateTimeRender,
      }
    ]
    

    timerRender

    将时间格式化成当前用户选择的时间格式

    参数

    [timeStr](string):时间字符串

    返回

    (string): 返回格式化后的时间字符串。

    示例

    timerRender('21:21:21')
    
    const columns = [
      {
        title: intl.get('hiam.subAccount.model.user.endDateActive').d('有效期至'),
        dataIndex: 'endDateActive',
        width: 100,
        render: timerRender,
      }
    ]
    

    numberRender

    格式化数值

    参数

    [value](number):需要格式化的数

    [precision = 0](number):数值精度 必须为自然数(0+正整数)

    [allowThousandth = true](boolean):是否加上千分位

    [allowEndZero = true](boolean):是否补全末尾0

    返回

    (string): 返回格式化后的数值。

    示例

    const columns = [
      {
        title: `${intl.get('hpfm.taxRate.model.taxRate.taxRate').d('税率')}(%)`,
        width: 100,
        dataIndex: 'taxRate',
        render: value => numberRender(value, 2, false),
      }
    ]
    

    TagRender

    返回状态标记

    参数

    [status](number):当前状态值

    [statusList = []](object[]):状态列表:[{ color: '' , status: '' }]

    [text = ‘'](string):当前状态文本值

    返回

    (string): 相应的状态标记。

    示例

    const columns = [
      ...
      {
        title: intl.get(`${modelPrompt}.refreshStatus`).d('刷新状态'),
        dataIndex: 'refreshStatus',
        width: 100,
        render: val => {
          const statusList = [
            { status: 1, color: 'green', text: '刷新成功' },
            { status: 0, color: 'red', text: '刷新失败' },
            { status: 'default', text: '未刷新' },
          ];
          return TagRender(val, statusList);
        },
      },
      {
        title: intl.get('hsdr.concRequest.model.concRequest.jobStatus').d('状态'),
        dataIndex: 'jobStatusMeaning',
        width: 100,
        fixed: 'right',
        render: (text, record) => {
          const statusList = [
            { status: 'NORMAL', color: 'green' },
            { status: 'PAUSED', color: 'gold' },
            { status: 'BLOCKED', color: 'volcano' },
            { status: 'ERROR', color: 'red' },
            { status: 'COMPLETE', color: '' },
            { status: 'NONE', color: '' },
          ];
          return TagRender(record.jobStatus, statusList, text);
        },
      },
    ]