/*
 * @Author: code4eat awesomedema@gmail.com
 * @Date: 2022-12-15 09:20:58
 * @LastEditors: code4eat awesomedema@gmail.com
 * @LastEditTime: 2023-09-26 10:32:05
 * @FilePath: /BudgetManaSystem/src/components/BMSPageContainer/index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

import { createFromIconfontCN } from '@ant-design/icons';
import { PageContainer, PageContainerProps } from '@ant-design/pro-components';
import { useModel } from '@umijs/max';
import { useState } from 'react';
import './style.less';
import '../../utils/zhongtaiA';

const IconFont = createFromIconfontCN({
  scriptUrl: '',
});

export type KCIMPagecontainerPropType = PageContainerProps & {};

interface MenuItem {
  function: any;
  path: string;
  name: string;
  description?: string;
  children?: MenuItem[];
}

function findMenuItem(menu: MenuItem[], path: string): MenuItem | undefined {
  for (let i = 0; i < menu.length; i++) {
    if (`/budgetManaSystem${menu[i].path}` === path) {
      return menu[i];
    } else if (menu[i].children) {
      let found = findMenuItem(menu[i].children as MenuItem[], path);
      if (found) return found;
    }
  }
}

const KCIMPagecontainer = (props: KCIMPagecontainerPropType) => {
  const { children, header, ...rest } = props;

  const { initialState } = useModel('@@initialState');

  const [open, set_open] = useState(false);

  let description: undefined | string = undefined;

  if (initialState) {
    const thisPageData = findMenuItem(initialState.memuData, location.pathname);
    description = thisPageData?.description;
  }

  return (
    <PageContainer
      {...rest}
      header={{
        ...header,
        breadcrumb: {},
        style: { padding: 0 },
        childrenContentStyle: { padding: 0 },
      }}
    >
      {children}
      {description && (
        <div
          className={open ? 'pageHelp active' : 'pageHelp'}
          style={{
            position: 'fixed',
            bottom: 24,
            right: 24,
            zIndex: 999,
            width: 40,
            height: 40,
          }}
          onClick={(e) => {
            e.stopPropagation();
            set_open(!open);
          }}
        >
          <div
            className={open ? 'helpContent open' : 'helpContent'}
            onClick={(e) => e.stopPropagation()}
          >
            <div className="contentHeader">
              帮助中心
              <div className="closeBtn" onClick={() => set_open(false)}>
                <IconFont type="iconquxiao" />
              </div>
            </div>
            <div className="content">
              <img src={require('../../../static/mingcijieshi.png')} alt="" />
              <div className="container">
                <div
                  className="inner"
                  dangerouslySetInnerHTML={{
                    __html: description ? description : '',
                  }}
                ></div>
              </div>
            </div>
          </div>
          <IconFont
            className="boolIcon"
            type="icon-bangzhuzhongxin-weixuanzhong"
          />
        </div>
      )}
    </PageContainer>
  );
};

export default KCIMPagecontainer;
