Procházet zdrojové kódy

feat: 步骤配置追加eventbus刷新逻辑

lanjianrong před 2 roky
rodič
revize
8636405681

+ 1 - 0
src/components/Drawer/index.tsx

@@ -17,6 +17,7 @@ import classNames from 'classnames'
 import { isDef } from '@/utils/is'
 type DrawerHocProps = {
   mode?: 'default' | 'innerEdge'
+  beforeOnClose?: () => void
 } & DrawerProps
 const DrawerHoc = memo(
   forwardRef((prop: any, ref) => {

+ 0 - 39
src/components/Footer/index.tsx

@@ -1,39 +0,0 @@
-import { useIntl } from '@umijs/max'
-import { GithubOutlined } from '@ant-design/icons'
-import { DefaultFooter } from '@ant-design/pro-layout'
-
-export default () => {
-  const intl = useIntl()
-  const defaultMessage = intl.formatMessage({
-    id: 'app.copyright.produced',
-    defaultMessage: '蚂蚁集团体验技术部出品'
-  })
-
-  const currentYear = new Date().getFullYear()
-
-  return (
-    <DefaultFooter
-      copyright={`${currentYear} ${defaultMessage}`}
-      links={[
-        {
-          key: 'Ant Design Pro',
-          title: 'Ant Design Pro',
-          href: 'https://pro.ant.design',
-          blankTarget: true
-        },
-        {
-          key: 'github',
-          title: <GithubOutlined />,
-          href: 'https://github.com/ant-design/ant-design-pro',
-          blankTarget: true
-        },
-        {
-          key: '指标库后台',
-          title: '指标库后台',
-          href: 'https://ant.design',
-          blankTarget: true
-        }
-      ]}
-    />
-  )
-}

+ 0 - 126
src/components/NoticeIcon/NoticeIcon.tsx

@@ -1,126 +0,0 @@
-import { BellOutlined } from '@ant-design/icons';
-import { Badge, Spin, Tabs } from 'antd';
-import useMergedState from 'rc-util/es/hooks/useMergedState';
-import React from 'react';
-import classNames from 'classnames';
-import type { NoticeIconTabProps } from './NoticeList';
-import NoticeList from './NoticeList';
-import HeaderDropdown from '../HeaderDropdown';
-import styles from './index.less';
-
-const { TabPane } = Tabs;
-
-export type NoticeIconProps = {
-  count?: number;
-  bell?: React.ReactNode;
-  className?: string;
-  loading?: boolean;
-  onClear?: (tabName: string, tabKey: string) => void;
-  onItemClick?: (item: API.NoticeIconItem, tabProps: NoticeIconTabProps) => void;
-  onViewMore?: (tabProps: NoticeIconTabProps, e: MouseEvent) => void;
-  onTabChange?: (tabTile: string) => void;
-  style?: React.CSSProperties;
-  onPopupVisibleChange?: (visible: boolean) => void;
-  popupVisible?: boolean;
-  clearText?: string;
-  viewMoreText?: string;
-  clearClose?: boolean;
-  emptyImage?: string;
-  children?: React.ReactElement<NoticeIconTabProps>[];
-};
-
-const NoticeIcon: React.FC<NoticeIconProps> & {
-  Tab: typeof NoticeList;
-} = (props) => {
-  const getNotificationBox = (): React.ReactNode => {
-    const {
-      children,
-      loading,
-      onClear,
-      onTabChange,
-      onItemClick,
-      onViewMore,
-      clearText,
-      viewMoreText,
-    } = props;
-    if (!children) {
-      return null;
-    }
-    const panes: React.ReactNode[] = [];
-    React.Children.forEach(children, (child: React.ReactElement<NoticeIconTabProps>): void => {
-      if (!child) {
-        return;
-      }
-      const { list, title, count, tabKey, showClear, showViewMore } = child.props;
-      const len = list && list.length ? list.length : 0;
-      const msgCount = count || count === 0 ? count : len;
-      const tabTitle: string = msgCount > 0 ? `${title} (${msgCount})` : title;
-      panes.push(
-        <TabPane tab={tabTitle} key={tabKey}>
-          <NoticeList
-            clearText={clearText}
-            viewMoreText={viewMoreText}
-            list={list}
-            tabKey={tabKey}
-            onClear={(): void => onClear && onClear(title, tabKey)}
-            onClick={(item): void => onItemClick && onItemClick(item, child.props)}
-            onViewMore={(event): void => onViewMore && onViewMore(child.props, event)}
-            showClear={showClear}
-            showViewMore={showViewMore}
-            title={title}
-          />
-        </TabPane>,
-      );
-    });
-    return (
-      <>
-        <Spin spinning={loading} delay={300}>
-          <Tabs className={styles.tabs} onChange={onTabChange}>
-            {panes}
-          </Tabs>
-        </Spin>
-      </>
-    );
-  };
-
-  const { className, count, bell } = props;
-
-  const [visible, setVisible] = useMergedState<boolean>(false, {
-    value: props.popupVisible,
-    onChange: props.onPopupVisibleChange,
-  });
-  const noticeButtonClass = classNames(className, styles.noticeButton);
-  const notificationBox = getNotificationBox();
-  const NoticeBellIcon = bell || <BellOutlined className={styles.icon} />;
-  const trigger = (
-    <span className={classNames(noticeButtonClass, { opened: visible })}>
-      <Badge count={count} style={{ boxShadow: 'none' }} className={styles.badge}>
-        {NoticeBellIcon}
-      </Badge>
-    </span>
-  );
-  if (!notificationBox) {
-    return trigger;
-  }
-
-  return (
-    <HeaderDropdown
-      placement="bottomRight"
-      overlay={notificationBox}
-      overlayClassName={styles.popover}
-      trigger={['click']}
-      visible={visible}
-      onVisibleChange={setVisible}
-    >
-      {trigger}
-    </HeaderDropdown>
-  );
-};
-
-NoticeIcon.defaultProps = {
-  emptyImage: 'https://gw.alipayobjects.com/zos/rmsportal/wAhyIChODzsoKIOBHcBk.svg',
-};
-
-NoticeIcon.Tab = NoticeList;
-
-export default NoticeIcon;

+ 0 - 103
src/components/NoticeIcon/NoticeList.less

@@ -1,103 +0,0 @@
-@import '~antd/es/style/themes/default.less';
-
-.list {
-  max-height: 400px;
-  overflow: auto;
-  &::-webkit-scrollbar {
-    display: none;
-  }
-  .item {
-    padding-right: 24px;
-    padding-left: 24px;
-    overflow: hidden;
-    cursor: pointer;
-    transition: all 0.3s;
-
-    .meta {
-      width: 100%;
-    }
-
-    .avatar {
-      margin-top: 4px;
-      background: @component-background;
-    }
-    .iconElement {
-      font-size: 32px;
-    }
-
-    &.read {
-      opacity: 0.4;
-    }
-    &:last-child {
-      border-bottom: 0;
-    }
-    &:hover {
-      background: @primary-1;
-    }
-    .title {
-      margin-bottom: 8px;
-      font-weight: normal;
-    }
-    .description {
-      font-size: 12px;
-      line-height: @line-height-base;
-    }
-    .datetime {
-      margin-top: 4px;
-      font-size: 12px;
-      line-height: @line-height-base;
-    }
-    .extra {
-      float: right;
-      margin-top: -1.5px;
-      margin-right: 0;
-      color: @text-color-secondary;
-      font-weight: normal;
-    }
-  }
-  .loadMore {
-    padding: 8px 0;
-    color: @primary-6;
-    text-align: center;
-    cursor: pointer;
-    &.loadedAll {
-      color: rgba(0, 0, 0, 0.25);
-      cursor: unset;
-    }
-  }
-}
-
-.notFound {
-  padding: 73px 0 88px;
-  color: @text-color-secondary;
-  text-align: center;
-  img {
-    display: inline-block;
-    height: 76px;
-    margin-bottom: 16px;
-  }
-}
-
-.bottomBar {
-  height: 46px;
-  color: @text-color;
-  line-height: 46px;
-  text-align: center;
-  border-top: 1px solid @border-color-split;
-  border-radius: 0 0 @border-radius-base @border-radius-base;
-  transition: all 0.3s;
-  div {
-    display: inline-block;
-    width: 50%;
-    cursor: pointer;
-    transition: all 0.3s;
-    user-select: none;
-
-    &:only-child {
-      width: 100%;
-    }
-    &:not(:only-child):last-child {
-      border-left: 1px solid @border-color-split;
-    }
-  }
-}

+ 0 - 113
src/components/NoticeIcon/NoticeList.tsx

@@ -1,113 +0,0 @@
-import { Avatar, List } from 'antd';
-
-import React from 'react';
-import classNames from 'classnames';
-import styles from './NoticeList.less';
-
-export type NoticeIconTabProps = {
-  count?: number;
-  showClear?: boolean;
-  showViewMore?: boolean;
-  style?: React.CSSProperties;
-  title: string;
-  tabKey: API.NoticeIconItemType;
-  onClick?: (item: API.NoticeIconItem) => void;
-  onClear?: () => void;
-  emptyText?: string;
-  clearText?: string;
-  viewMoreText?: string;
-  list: API.NoticeIconItem[];
-  onViewMore?: (e: any) => void;
-};
-const NoticeList: React.FC<NoticeIconTabProps> = ({
-  list = [],
-  onClick,
-  onClear,
-  title,
-  onViewMore,
-  emptyText,
-  showClear = true,
-  clearText,
-  viewMoreText,
-  showViewMore = false,
-}) => {
-  if (!list || list.length === 0) {
-    return (
-      <div className={styles.notFound}>
-        <img
-          src="https://gw.alipayobjects.com/zos/rmsportal/sAuJeJzSKbUmHfBQRzmZ.svg"
-          alt="not found"
-        />
-        <div>{emptyText}</div>
-      </div>
-    );
-  }
-  return (
-    <div>
-      <List<API.NoticeIconItem>
-        className={styles.list}
-        dataSource={list}
-        renderItem={(item, i) => {
-          const itemCls = classNames(styles.item, {
-            [styles.read]: item.read,
-          });
-          // eslint-disable-next-line no-nested-ternary
-          const leftIcon = item.avatar ? (
-            typeof item.avatar === 'string' ? (
-              <Avatar className={styles.avatar} src={item.avatar} />
-            ) : (
-              <span className={styles.iconElement}>{item.avatar}</span>
-            )
-          ) : null;
-
-          return (
-            <List.Item
-              className={itemCls}
-              key={item.key || i}
-              onClick={() => {
-                onClick?.(item);
-              }}
-            >
-              <List.Item.Meta
-                className={styles.meta}
-                avatar={leftIcon}
-                title={
-                  <div className={styles.title}>
-                    {item.title}
-                    <div className={styles.extra}>{item.extra}</div>
-                  </div>
-                }
-                description={
-                  <div>
-                    <div className={styles.description}>{item.description}</div>
-                    <div className={styles.datetime}>{item.datetime}</div>
-                  </div>
-                }
-              />
-            </List.Item>
-          );
-        }}
-      />
-      <div className={styles.bottomBar}>
-        {showClear ? (
-          <div onClick={onClear}>
-            {clearText} {title}
-          </div>
-        ) : null}
-        {showViewMore ? (
-          <div
-            onClick={(e) => {
-              if (onViewMore) {
-                onViewMore(e);
-              }
-            }}
-          >
-            {viewMoreText}
-          </div>
-        ) : null}
-      </div>
-    </div>
-  );
-};
-
-export default NoticeList;

+ 0 - 35
src/components/NoticeIcon/index.less

@@ -1,35 +0,0 @@
-@import '~antd/es/style/themes/default.less';
-
-.popover {
-  position: relative;
-  width: 336px;
-}
-
-.noticeButton {
-  display: inline-block;
-  cursor: pointer;
-  transition: all 0.3s;
-}
-.icon {
-  padding: 4px;
-  vertical-align: middle;
-}
-
-.badge {
-  font-size: 16px;
-}
-
-.tabs {
-  :global {
-    .ant-tabs-nav-list {
-      margin: auto;
-    }
-
-    .ant-tabs-nav-scroll {
-      text-align: center;
-    }
-    .ant-tabs-bar {
-      margin-bottom: 0;
-    }
-  }
-}

+ 0 - 151
src/components/NoticeIcon/index.tsx

@@ -1,151 +0,0 @@
-import { useEffect, useState } from 'react'
-import { Tag, message } from 'antd'
-import { groupBy } from 'lodash'
-import moment from 'moment'
-import { useModel, useRequest } from '@umijs/max'
-import { getNotices } from '@/services/ant-design-pro/api'
-
-import NoticeIcon from './NoticeIcon'
-import styles from './index.less'
-
-export type GlobalHeaderRightProps = {
-  fetchingNotices?: boolean
-  onNoticeVisibleChange?: (visible: boolean) => void
-  onNoticeClear?: (tabName?: string) => void
-}
-
-const getNoticeData = (notices: API.NoticeIconItem[]): Record<string, API.NoticeIconItem[]> => {
-  if (!notices || notices.length === 0 || !Array.isArray(notices)) {
-    return {}
-  }
-
-  const newNotices = notices.map(notice => {
-    const newNotice = { ...notice }
-
-    if (newNotice.datetime) {
-      newNotice.datetime = moment(notice.datetime as string).fromNow()
-    }
-
-    if (newNotice.id) {
-      newNotice.key = newNotice.id
-    }
-
-    if (newNotice.extra && newNotice.status) {
-      const color = {
-        todo: '',
-        processing: 'blue',
-        urgent: 'red',
-        doing: 'gold'
-      }[newNotice.status]
-      newNotice.extra = (
-        <Tag
-          color={color}
-          style={{
-            marginRight: 0
-          }}>
-          {newNotice.extra}
-        </Tag>
-      ) as any
-    }
-
-    return newNotice
-  })
-  return groupBy(newNotices, 'type')
-}
-
-const getUnreadData = (noticeData: Record<string, API.NoticeIconItem[]>) => {
-  const unreadMsg: Record<string, number> = {}
-  Object.keys(noticeData).forEach(key => {
-    const value = noticeData[key]
-
-    if (!unreadMsg[key]) {
-      unreadMsg[key] = 0
-    }
-
-    if (Array.isArray(value)) {
-      unreadMsg[key] = value.filter(item => !item.read).length
-    }
-  })
-  return unreadMsg
-}
-
-const NoticeIconView = () => {
-  const { initialState } = useModel('@@initialState')
-  const { currentUser } = initialState || {}
-  const [notices, setNotices] = useState<API.NoticeIconItem[]>([])
-  const { data } = useRequest(getNotices)
-
-  useEffect(() => {
-    setNotices(data || [])
-  }, [data])
-
-  const noticeData = getNoticeData(notices)
-  const unreadMsg = getUnreadData(noticeData || {})
-
-  const changeReadState = (id: string) => {
-    setNotices(
-      notices.map(item => {
-        const notice = { ...item }
-        if (notice.id === id) {
-          notice.read = true
-        }
-        return notice
-      })
-    )
-  }
-
-  const clearReadState = (title: string, key: string) => {
-    setNotices(
-      notices.map(item => {
-        const notice = { ...item }
-        if (notice.type === key) {
-          notice.read = true
-        }
-        return notice
-      })
-    )
-    message.success(`${'清空了'} ${title}`)
-  }
-
-  return (
-    <NoticeIcon
-      className={styles.action}
-      count={currentUser && currentUser.unreadCount}
-      onItemClick={item => {
-        changeReadState(item.id!)
-      }}
-      onClear={(title: string, key: string) => clearReadState(title, key)}
-      loading={false}
-      clearText="清空"
-      viewMoreText="查看更多"
-      onViewMore={() => message.info('Click on view more')}
-      clearClose>
-      <NoticeIcon.Tab
-        tabKey="notification"
-        count={unreadMsg.notification}
-        list={noticeData.notification}
-        title="通知"
-        emptyText="你已查看所有通知"
-        showViewMore
-      />
-      <NoticeIcon.Tab
-        tabKey="message"
-        count={unreadMsg.message}
-        list={noticeData.message}
-        title="消息"
-        emptyText="您已读完所有消息"
-        showViewMore
-      />
-      <NoticeIcon.Tab
-        tabKey="event"
-        title="待办"
-        emptyText="你已完成所有待办"
-        count={unreadMsg.event}
-        list={noticeData.event}
-        showViewMore
-      />
-    </NoticeIcon>
-  )
-}
-
-export default NoticeIconView

+ 0 - 270
src/components/index.md

@@ -1,270 +0,0 @@
----
-title: 业务组件
-sidemenu: false
----
-
-> 此功能由[dumi](https://d.umijs.org/zh-CN/guide/advanced#umi-%E9%A1%B9%E7%9B%AE%E9%9B%86%E6%88%90%E6%A8%A1%E5%BC%8F)提供,dumi 是一个 📖 为组件开发场景而生的文档工具,用过的都说好。
-
-# 业务组件
-
-这里列举了 Pro 中所有用到的组件,这些组件不适合作为组件库,但是在业务中却真实需要。所以我们准备了这个文档,来指导大家是否需要使用这个组件。
-
-## Footer 页脚组件
-
-这个组件自带了一些 Pro 的配置,你一般都需要改掉它的信息。
-
-```tsx
-/**
- * background: '#f0f2f5'
- */
-import React from 'react'
-import Footer from '@/components/Footer'
-
-export default () => <Footer />
-```
-
-## HeaderDropdown 头部下拉列表
-
-HeaderDropdown 是 antd Dropdown 的封装,但是增加了移动端的特殊处理,用法也是相同的。
-
-```tsx
-/**
- * background: '#f0f2f5'
- */
-import { Button, Menu } from 'antd'
-import React from 'react'
-import HeaderDropdown from '@/components/HeaderDropdown'
-
-export default () => {
-  const menuHeaderDropdown = (
-    <Menu selectedKeys={[]}>
-      <Menu.Item key="center">个人中心</Menu.Item>
-      <Menu.Item key="settings">个人设置</Menu.Item>
-      <Menu.Divider />
-      <Menu.Item key="logout">退出登录</Menu.Item>
-    </Menu>
-  )
-  return (
-    <HeaderDropdown overlay={menuHeaderDropdown}>
-      <Button>hover 展示菜单</Button>
-    </HeaderDropdown>
-  )
-}
-```
-
-## HeaderSearch 头部搜索框
-
-一个带补全数据的输入框,支持收起和展开 Input
-
-```tsx
-/**
- * background: '#f0f2f5'
- */
-import { Button, Menu } from 'antd'
-import React from 'react'
-import HeaderSearch from '@/components/HeaderSearch'
-
-export default () => {
-  return (
-    <HeaderSearch
-      placeholder="站内搜索"
-      defaultValue="umi ui"
-      options={[
-        { label: 'Ant Design Pro', value: 'Ant Design Pro' },
-        {
-          label: '指标库后台',
-          value: '指标库后台'
-        },
-        {
-          label: 'Pro Table',
-          value: 'Pro Table'
-        },
-        {
-          label: 'Pro Layout',
-          value: 'Pro Layout'
-        }
-      ]}
-      onSearch={value => {
-        console.log('input', value)
-      }}
-    />
-  )
-}
-```
-
-### API
-
-| 参数            | 说明                               | 类型                         | 默认值 |
-| --------------- | ---------------------------------- | ---------------------------- | ------ |
-| value           | 输入框的值                         | `string`                     | -      |
-| onChange        | 值修改后触发                       | `(value?: string) => void`   | -      |
-| onSearch        | 查询后触发                         | `(value?: string) => void`   | -      |
-| options         | 选项菜单的的列表                   | `{label,value}[]`            | -      |
-| defaultVisible  | 输入框默认是否显示,只有第一次生效 | `boolean`                    | -      |
-| visible         | 输入框是否显示                     | `boolean`                    | -      |
-| onVisibleChange | 输入框显示隐藏的回调函数           | `(visible: boolean) => void` | -      |
-
-## NoticeIcon 通知工具
-
-通知工具提供一个展示多种通知信息的界面。
-
-```tsx
-/**
- * background: '#f0f2f5'
- */
-import { message } from 'antd'
-import React from 'react'
-import NoticeIcon from '@/components/NoticeIcon/NoticeIcon'
-
-export default () => {
-  const list = [
-    {
-      id: '000000001',
-      avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png',
-      title: '你收到了 14 份新周报',
-      datetime: '2017-08-09',
-      type: 'notification'
-    },
-    {
-      id: '000000002',
-      avatar: 'https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png',
-      title: '你推荐的 曲妮妮 已通过第三轮面试',
-      datetime: '2017-08-08',
-      type: 'notification'
-    }
-  ]
-  return (
-    <NoticeIcon
-      count={10}
-      onItemClick={item => {
-        message.info(`${item.title} 被点击了`)
-      }}
-      onClear={(title: string, key: string) => message.info('点击了清空更多')}
-      loading={false}
-      clearText="清空"
-      viewMoreText="查看更多"
-      onViewMore={() => message.info('点击了查看更多')}
-      clearClose>
-      <NoticeIcon.Tab
-        tabKey="notification"
-        count={2}
-        list={list}
-        title="通知"
-        emptyText="你已查看所有通知"
-        showViewMore
-      />
-      <NoticeIcon.Tab
-        tabKey="message"
-        count={2}
-        list={list}
-        title="消息"
-        emptyText="您已读完所有消息"
-        showViewMore
-      />
-      <NoticeIcon.Tab
-        tabKey="event"
-        title="待办"
-        emptyText="你已完成所有待办"
-        count={2}
-        list={list}
-        showViewMore
-      />
-    </NoticeIcon>
-  )
-}
-```
-
-### NoticeIcon API
-
-| 参数 | 说明 | 类型 | 默认值 |
-| --- | --- | --- | --- |
-| count | 有多少未读通知 | `number` | - |
-| bell | 铃铛的图表 | `ReactNode` | - |
-| onClear | 点击清空数据按钮 | `(tabName: string, tabKey: string) => void` | - |
-| onItemClick | 未读消息列被点击 | `(item: API.NoticeIconData, tabProps: NoticeIconTabProps) => void` | - |
-| onViewMore | 查看更多的按钮点击 | `(tabProps: NoticeIconTabProps, e: MouseEvent) => void` | - |
-| onTabChange | 通知 Tab 的切换 | `(tabTile: string) => void;` | - |
-| popupVisible | 通知显示是否展示 | `boolean` | - |
-| onPopupVisibleChange | 通知信息显示隐藏的回调函数 | `(visible: boolean) => void` | - |
-| clearText | 清空按钮的文字 | `string` | - |
-| viewMoreText | 查看更多的按钮文字 | `string` | - |
-| clearClose | 展示清空按钮 | `boolean` | - |
-| emptyImage | 列表为空时的兜底展示 | `ReactNode` | - |
-
-### NoticeIcon.Tab API
-
-| 参数         | 说明               | 类型                                 | 默认值 |
-| ------------ | ------------------ | ------------------------------------ | ------ |
-| count        | 有多少未读通知     | `number`                             | -      |
-| title        | 通知 Tab 的标题    | `ReactNode`                          | -      |
-| showClear    | 展示清除按钮       | `boolean`                            | `true` |
-| showViewMore | 展示加载更         | `boolean`                            | `true` |
-| tabKey       | Tab 的唯一 key     | `string`                             | -      |
-| onClick      | 子项的单击事件     | `(item: API.NoticeIconData) => void` | -      |
-| onClear      | 清楚按钮的点击     | `()=>void`                           | -      |
-| emptyText    | 为空的时候测试     | `()=>void`                           | -      |
-| viewMoreText | 查看更多的按钮文字 | `string`                             | -      |
-| onViewMore   | 查看更多的按钮点击 | `( e: MouseEvent) => void`           | -      |
-| list         | 通知信息的列表     | `API.NoticeIconData`                 | -      |
-
-### NoticeIconData
-
-```tsx | pure
-export interface NoticeIconData {
-  id: string
-  key: string
-  avatar: string
-  title: string
-  datetime: string
-  type: string
-  read?: boolean
-  description: string
-  clickClose?: boolean
-  extra: any
-  status: string
-}
-```
-
-## RightContent
-
-RightContent 是以上几个组件的组合,同时新增了 plugins 的 `SelectLang` 插件。
-
-```tsx | pure
-<Space>
-  <HeaderSearch
-    placeholder="站内搜索"
-    defaultValue="umi ui"
-    options={[
-      { label: <a href="https://umijs.org/zh/guide/umi-ui.html">umi ui</a>, value: 'umi ui' },
-      {
-        label: <a href="next.ant.design">指标库后台</a>,
-        value: '指标库后台'
-      },
-      {
-        label: <a href="https://protable.ant.design/">Pro Table</a>,
-        value: 'Pro Table'
-      },
-      {
-        label: <a href="https://prolayout.ant.design/">Pro Layout</a>,
-        value: 'Pro Layout'
-      }
-    ]}
-  />
-  <Tooltip title="使用文档">
-    <span
-      className={styles.action}
-      onClick={() => {
-        window.location.href = 'https://pro.ant.design/docs/getting-started'
-      }}>
-      <QuestionCircleOutlined />
-    </span>
-  </Tooltip>
-  <Avatar />
-  {REACT_APP_ENV && (
-    <span>
-      <Tag color={ENVTagColor[REACT_APP_ENV]}>{REACT_APP_ENV}</Tag>
-    </span>
-  )}
-  <SelectLang className={styles.action} />
-</Space>
-```

+ 2 - 1
src/enums/emit.ts

@@ -1,3 +1,4 @@
 export enum EmitterType {
-  BUSINESS_STEP_REFRESH = 'business_step_refresh'
+  BUSINESS_STEP_REFRESH = 'refresh:businessStep',
+  BUSINESS_STEP_CHANGE = 'change:businessStep'
 }

+ 2 - 2
src/pages/Business/Process/components/MemberItem.tsx

@@ -14,7 +14,7 @@ enum AuditType {
 
 const auditTypeOptions = [
   { label: '用户', value: AuditType.ACCOUNT },
-  { label: '单位角色', value: AuditType.INSTITUTION }
+  { label: '审批单位', value: AuditType.INSTITUTION }
   // { label: '审批角色', value: 'role'}
 ]
 
@@ -70,7 +70,7 @@ const MemberItem: React.FC<MemberItemProps> = ({ value, onChange }) => {
       let requestFn: Nullable<() => Promise<void>> = null
       switch (state.auditType) {
         case AuditType.ACCOUNT:
-          requestFn = () => queryAcountListByInstitutionID({ pageSize: consts.MAX_PAGE_SIZE })
+          requestFn = () => queryAcountListByInstitutionID({ enable: 'true', pageSize: consts.MAX_PAGE_SIZE })
           break
         case AuditType.INSTITUTION:
           requestFn = () => queryInstitutionRoleList({ pageSize: consts.MAX_PAGE_SIZE })

+ 1 - 1
src/pages/Business/Process/index.tsx

@@ -86,7 +86,7 @@ const Process: React.FC<ProcessProps> = ({ executorMap }) => {
   const handleMenuOnChange = (key: string) => {
     const [gatherID, businessType] = key.split('_')
     setState({ ...state, activeKey: key })
-    !executorMap?.[state.activeKey] && query({ gatherID, businessType, pageSize: 214000 })
+    query({ gatherID, businessType, pageSize: 214000 })
   }
   return (
     <PageContainer title={false}>

+ 0 - 1
src/pages/Business/Step/components/Flow/components/Drawer/Auditor/index.tsx

@@ -18,7 +18,6 @@ type AuditorProps = {
 
 const Auditor: React.FC<AuditorProps> = ({ nodeId, nodeData: { name, participantInfo } }) => {
   const [form] = Form.useForm()
-
   const [stepMatters, setStepMatters] = useState(participantInfo?.stepMatters || [])
   const {
     flowStore: { dataID, executorList, process, drawer, elements, matterList },

+ 0 - 1
src/pages/Business/Step/components/Flow/components/Drawer/Condition/index.tsx

@@ -39,7 +39,6 @@ const Condition: React.FC<ConditionProps> = ({ nodeId, nodeData }) => {
   const { flowStore, dispatch } = useContext(FlowContext)
   // const dvaDispatch = useDispatch()
   const { conditionSchema } = useStore().getState().business
-
   const formSchema = useMemo(() => {
     let schema = conditionSchema?.[flowStore.dataID]?.schema as Schema
     if (schema && isString(schema)) {

+ 0 - 1
src/pages/Business/Step/components/Flow/components/Edge/BaseEdge.tsx

@@ -17,7 +17,6 @@ const foreignObjectSize = 48
 export default ({ id, source, target, path, centerY, sourceX, style }: BaseEdgeProps) => {
   const [open, setOpen] = useState(false)
   const { flowStore, dispatch } = useContext(FlowContext)
-
   const showForeignObject = ![NodeType.OPERATION, NodeType.OPERATION_BTN].includes(
     flowStore.elements.find(item => item.id === source)?.type
   )

+ 4 - 1
src/pages/Business/Step/components/Flow/components/Toolbar/index.tsx

@@ -5,10 +5,12 @@ import { FlowContext } from '../../context'
 import { addApprovalFlow } from '@/services/api/project'
 import consts from '@/utils/consts'
 import { transformToApprovalProcess } from '../../shared/transformer'
+import useEventEmitter from '@/utils/emit'
+import { EmitterType } from '@/enums/emit'
 
 export default function ToolBar() {
   const { flowStore } = useContext(FlowContext)
-
+  const event$ = useEventEmitter({ global: true })
   const handleSave = () => {
     Modal.confirm({
       title: '确定发布该审批流程',
@@ -23,6 +25,7 @@ export default function ToolBar() {
         })
         if (code === consts.RET_CODE.SUCCESS) {
           message.success('发布成功')
+          event$.emit(EmitterType.BUSINESS_STEP_REFRESH, { gatherID, businessType })
         }
       }
     })

+ 3 - 2
src/pages/Business/Step/components/Flow/index.tsx

@@ -12,14 +12,15 @@ type ApprovalFlowProps<T> = {
   matterList: any[]
 }
 
-function ApprovalFlow<T>({ defaultValue, dataID, executorList, matterList }: ApprovalFlowProps<T>) {
+function ApprovalFlow<T>({ defaultValue, dataID, executorList, matterList, event$ }: ApprovalFlowProps<T>) {
   return (
     <div className="flow-container h-full w-full">
       <FlowContextProvider
         initialProcess={defaultValue}
         dataID={dataID}
         executorList={executorList}
-        matterList={matterList}>
+        matterList={matterList}
+        event$={event$}>
         <ReactFlowProvider>
           {/** 顶部工具栏 */}
           <ToolBar />

+ 20 - 10
src/pages/Business/Step/index.tsx

@@ -1,6 +1,8 @@
 import useDrawer from '@/components/Drawer'
+import { EmitterType } from '@/enums/emit'
 import { queryApprovalDetail } from '@/services/api/project'
 import consts from '@/utils/consts'
+import useEventEmitter from '@/utils/emit'
 import { PageContainer } from '@ant-design/pro-layout'
 import ProTable, { ProColumns } from '@ant-design/pro-table'
 import { connect } from '@umijs/max'
@@ -33,6 +35,7 @@ type iState = {
   process: {
     detail: API.ApprovalProcess[]
     list: any[]
+    changed: boolean
   }
   subjectName?: string
 }
@@ -43,16 +46,23 @@ const Step: React.FC<StepProps> = ({ executorMap, matterMap, conditionSchema, di
     process: {}
   })
 
-  useEffect(() => {
-    async function initData(params: { gatherID: string; businessType: string }) {
-      const {
-        code = -1,
-        data: { process = [], processList = [] }
-      } = await queryApprovalDetail(params)
-      if (code === consts.RET_CODE.SUCCESS) {
-        setState({ ...state, process: { detail: process, list: processList } })
-      }
+  async function initData(params: { gatherID: string; businessType: string }) {
+    const {
+      code = -1,
+      data: { process = [], processList = [] }
+    } = await queryApprovalDetail(params)
+    if (code === consts.RET_CODE.SUCCESS) {
+      setState({ ...state, process: { detail: process, list: processList, changed: false } })
     }
+  }
+
+  const event$ = useEventEmitter({ global: true })
+  event$.useSubscription(EmitterType.BUSINESS_STEP_REFRESH, ({ params }) => {
+    const { gatherID, businessType } = params[0]
+
+    initData({ gatherID, businessType })
+  })
+  useEffect(() => {
     if (state.activeKey) {
       const [gatherID, businessType] = state.activeKey.split('_')
       if (!executorMap?.[state.activeKey]) {
@@ -110,11 +120,11 @@ const Step: React.FC<StepProps> = ({ executorMap, matterMap, conditionSchema, di
           matterList={matterMap[state.activeKey]}
           dataID={state.activeKey}
           defaultValue={transformToFlowNodes(state.process.detail)}
-          // defaultValue={mockNodes}
         />
       )
     })
   }
+
   return (
     <PageContainer title={false}>
       <div className="w-full flex flex-row">