june-ui v0.2.37

公用组件库

安装

npm

$ npm i june-ui -S 

yarn

$ yarn add june-ui 

更新

npm

$ npm update june-ui@latest 

yarn

$ yarn upgrade june-ui@latest 

组件列表

• FlowList <流程列表>
• FlowDetail <流程详情>
• FlowRecord <审批日志>
• FlowViewer <流程图>
• FlowActionButtons <转办、同意、驳回组合按钮>
• FlowTransferModal <转办弹出框>
• FlowFullScreen <全屏按钮>

示例

FlowList

import React from 'react';
import { config } from 'ice';
import { appHistory } from '@ice/stark';
import { FlowList } from 'june-ui';
import { get, post } from '@/api/request';

export default function FlowListPage(props) {

  /**
  * 传入的请求方法
  *
  */
  const request = (req) => {
    switch (req.method) {
      case 'GET':
        return get(req.url, req.data, true);
      case 'POST':
        return post(req.url, { data: req.data }, true);
      default:
        break;
    }
  };

  /**
  * 列表 查看按钮点击事件 
  * record 点击行数据
  */
  const onLinkClick = (_, record, index) => {
    // 路由跳转
  };

  return <FlowList request={request} onLinkClick={onLinkClick} />;
}

FlowList props

FlowDetail

import React, { useEffect, useState } from 'react';
import { FlowDetail } from 'june-ui';
import { useParams } from 'ice';
import { get, post } from '@/api/request';

export default FlowDetailPage function () {

  const [id, setId] = useState()
  const params = useParams()

  const request = (config) => {
    switch (config.method) {
      case 'GET':
        return get(config.url, config.data, true);
      case 'POST':
        return post(config.url, { data: config.data }, true);
      default:
        break;
    }
  };

  useEffect(() => {
    setId(params.id)
    return () => {};
  }, []);

  return <FlowDetail id={id} request={request} />;
};

FlowDetail props