aldehyde 0.2.409 → 0.2.410

package/src/aldehyde/list/vertical-list/item.tsx

@@ -0,0 +1,130 @@
+import React, { useEffect, useState, useMemo } from "react";
+import { Row, Col, Space, Button, Descriptions } from "antd";
+import { DownOutlined, UpOutlined } from '@ant-design/icons';
+import { useLocale } from "../../locale/useLocale";
+import ViewControl from "../../controls/view-control";
+import { CardListConfig, FieldConfig } from "../../tmpl/interface";
+import "./index.less";
+
+type Props = {
+    listConfig?: CardListConfig;
+    current?: any;
+    renderOpt?: React.ReactNode;
+    serverKey?: string;
+    columnConfigs?: FieldConfig[];
+};
+
+const dataKeys = ["primaryColumn", "primaryColumnLabel", "secondColumn", "secondColumnLabel", "cardShowCols", "labelColumn", "mainPicture", "mainPictureLabel"];
+
+const Index = (props: Props) => {
+    const { listConfig, current, renderOpt, serverKey, columnConfigs } = props;
+    const [detailOpen, setDetailOpen] = useState<boolean>(false);
+    const [listIds, setListIds] = useState<string[]>([]);
+    const { translate } = useLocale();
+
+    const initViewList = () => {
+        const formItemList = [];
+        if (columnConfigs.length > 0) {
+            columnConfigs.forEach((item, index) => {
+                if (!["10000", "20000", ...listIds].includes(item.id) && !["操作", "序号"].includes(item.title)) {
+                    let fieldValue = current ? current[item.id] : undefined;
+                    //fieldValue 没有值时不能为null 要为 undefined。antd input所限制
+                    fieldValue = fieldValue ? fieldValue : item.defaultValue ? item.defaultValue : undefined;
+                    const formItem = (
+                        <Descriptions.Item
+                            label={translate("${" + item.title + "}")}
+                            key={index}
+                        >
+                            <ViewControl
+                                serverKey={serverKey}
+                                holderType={"table"}
+                                value={fieldValue}
+                                fieldConfig={item}
+                            />
+                        </Descriptions.Item>
+                    );
+                    formItemList.push(formItem);
+                }
+            });
+        }
+        return formItemList;
+    };
+
+    const handleData = (item, type: string) => {
+        const itemConfig = listConfig[type];
+        if (!itemConfig) {
+            return "";
+        }
+        if (type === "cardShowCols") {
+            return itemConfig.map(r => {
+                const value = item[r.id];
+                const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={r} />;
+                const title = r.title;
+                return { element, value, title, id: r.id };
+            });
+        }
+        const value = item[itemConfig.id];
+        const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={type === "mainPicture" ? { ...itemConfig, preview: false } : itemConfig} />;
+        const title = itemConfig.title;
+        return { element, value, title, id: itemConfig.id };
+    }
+
+    const temData = useMemo(() => {
+        const dataObj = dataKeys.reduce((total, next) => {
+            total[next] = handleData(current, next);
+            return total;
+        }, {});
+        const ids = Object.values(dataObj).flat().filter(Boolean).map((r: any) => r.id);
+        setListIds(ids);
+        return dataObj;
+    }, [current]);
+
+    return <div className="list-item">
+        <div className="list-item-head">
+            <div className="list-item-head-title">
+                {temData["primaryColumn"] ?
+                    <div className="list-item-head-primary">
+                        <div className="primary-column">{temData["primaryColumn"]?.element}</div>
+                        <div className="primary-column-label">{temData["primaryColumnLabel"]?.element}</div>
+                    </div>
+                    : ""}
+                <div className="label-column">{temData["labelColumn"]?.element}</div>
+            </div>
+            <div className="list-item-head-title">
+                {temData["secondColumn"] ?
+                    <div className="list-item-head-second">
+                        <div className="second-column">{temData["secondColumn"].value ? temData["secondColumn"]?.element : "-"}</div>
+                        <div className="second-column-label">{temData["secondColumnLabel"]?.element}</div>
+                    </div>
+                    : ""}
+            </div>
+        </div>
+        <div className="list-content">
+            <Row gutter={12}>
+                <Col span={15}>
+                    {temData["cardShowCols"] ?
+                        <Space size="large" wrap={true}>
+                            {temData["cardShowCols"].map((col, index) =>
+                                <div className="card-show-item" key={index}>
+                                    <div className="title">{col.title}：</div>
+                                    <div className="element">{(col.value || col.value === 0) ? col.element : "-"}</div>
+                                </div>)}
+                        </Space> :
+                        ""}
+                </Col>
+                <Col span={9} style={{ textAlign: "right" }}>
+                    {renderOpt}
+                    <Button size="small" type="text" onClick={() => setDetailOpen(!detailOpen)}>{detailOpen ? <UpOutlined /> : <DownOutlined />}</Button>
+                </Col>
+            </Row>
+            {detailOpen ?
+                <div className="detail-content">
+                    <Descriptions column={4}>
+                        {initViewList()}
+                    </Descriptions>
+                </div> : ""}
+        </div>
+    </div>;
+};
+
+export default Index;

package/src/aldehyde/module/ltmpl-table.tsx

@@ -1,5 +1,5 @@
 import React, { ReactNode } from "react";
-import { AddOrUpdate, LtmplConfigRes, ActTableMode, DoEditParam, ShowViewParam } from "../tmpl/interface";
+import { AddOrUpdate, LtmplConfigRes, ActTableMode, DoEditParam, ShowViewParam, ActTableViewModel } from "../tmpl/interface";
 import Units from "../units";
 import ActTable from "../table/act-table";
 // import StatActTable from '../table/stat-act-table'
@@ -33,6 +33,8 @@ export interface LtmplTableProps {
   readOnly?: boolean;
   rowOperatable?: boolean;
   defaultCriteriaValue?: object;
+  defShowType?: ActTableViewModel;
+  showPagination?: boolean; // 是否显示分页
 }
 
 export interface LtmplTableState {
@@ -75,6 +77,7 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
     initCollapse: false,
     readOnly: false,
     rowOperatable: true,
+    showPagination: true,
   };
 
   async componentDidMount() {
@@ -252,7 +255,7 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
       doRAction, funcMode,
       tip, title, collapsible,
       initCollapse, doCustomEdit, doCustomCreate,
-      serverKey, rowOperatable, readOnly,
+      serverKey, rowOperatable, readOnly, defShowType, showPagination
     } = this.props;
     const { translate } = this.context;
 
@@ -276,6 +279,8 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
             customEditable={doCustomEdit ? true : false}
             customCreatable={doCustomCreate ? true : false}
             ltmplConfig={ltmplConfigRes.ltmplConfig}
+            defShowType={defShowType}
+            showPagination={showPagination}
           />
           {buttons.includes("detail") && showDtmplView ? (
             <ModalDtmplView

package/src/aldehyde/sso-Login/index.tsx

@@ -0,0 +1,49 @@
+import React, { useState, useMemo, useEffect } from "react";
+import { useLocation } from "react-router-dom";
+import { Spin } from "antd";
+import HCserviceV3 from "../tmpl/hcservice-v3";
+import HCDataSource from "../tmpl/hc-data-source";
+import ProgramConfig from "../units";
+
+interface Props {
+    serverKey?: string;
+}
+
+const Index = (props: Props) => {
+    const { serverKey } = props;
+    const [loading, setLoading] = useState<boolean>(true);
+    const { search } = useLocation();
+    const theme = ProgramConfig.getAllThemes()?.[0] || "v2";
+
+    const params = useMemo(() => {
+        const temParams = new URLSearchParams(search);
+        const username = temParams.get("username");
+        const ssoToken = temParams.get("ssoToken");
+        const programCode = temParams.get("programCode");
+        return { username, ssoToken, programCode };
+    }, [search]);
+
+    const login = async () => {
+        setLoading(true);
+        const { username, ssoToken, programCode } = params;
+        const res = await HCserviceV3.ssoTokenLogin({ username, ssoToken }, programCode, serverKey);
+        if (res.status === "success") {
+            HCDataSource.clear();
+            window.location.hash = `/${theme}/home`;
+            ProgramConfig.setHydrocarbonToken(res.token);
+        } else if (res.status === "error") {
+            window.location.hash = ["v2", "v5"].includes(theme) ? "/login2" : "login3";
+        }
+        setLoading(false);
+    };
+
+    useEffect(() => {
+        if (params) {
+            login();
+        }
+    }, [params])
+
+    return <Spin spinning={loading} fullscreen />;
+}
+
+export default Index;

package/src/aldehyde/table/act-table.tsx

@@ -68,6 +68,7 @@ interface ActTableProps extends TmplBaseProps {
   operatable?: boolean;
   onSelectChange?: (val: { selectedRows: SelectedRow[], selectedDatas: DtmplData[] }) => void;
   defShowType?: ActTableViewModel; // 默认视图
+  showPagination?: boolean; // 是否显示分页
 }
 
 interface ActTableStat {
@@ -145,6 +146,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
     initCollapse: false,
     readOnly: false,
     operatable: true,
+    showPagination: true
   };
 
   // 获取标签选项
@@ -1328,7 +1330,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
       mainCode, sourceId, ltmplConfig, funcMode, operatable,
       title, collapsible,
       onChangePage, serverKey, criteriaData,
-      showView, doEdit, doRAction, customEditable, readOnly, tableType
+      showView, doEdit, doRAction, customEditable, readOnly, tableType, showPagination
     } = this.props;
     const { translate } = this.context;
 
@@ -1421,6 +1423,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
         cardListConfig={{ primaryColumn, primaryColumnLabel, secondColumn, secondColumnLabel, mainPicture, mainPictureLabel, labelColumn, cardShowCols, rowCardCount, buttons, customViewPagePath, mainCode }}
         ltmplConfig={ltmplConfig}
         showView={showView}
+        showPagination={showPagination}
       />);
 
     return (

package/src/aldehyde/table/query-table.tsx

@@ -65,7 +65,8 @@ class QueryTable extends React.PureComponent<QueryTableProps, QueryTableStat> {
     rowTotalCols: 4,
     defaultShowTotalCols: 7,
     cardListConfig: {},
-    ltmplConfig: {}
+    ltmplConfig: {},
+    showPagination: true,
   };
 
   defaultAggregateShowSize = 7;
@@ -439,7 +440,8 @@ class QueryTable extends React.PureComponent<QueryTableProps, QueryTableStat> {
       serverKey, rowTotalCols,
       cardListConfig,
       ltmplConfig,
-      showView
+      showView,
+      showPagination
     } = this.props;
     //debugger
     const { touchEnd, aggregateVO, loading, virtualEndPageNo, dataSource, aggregateShowSize, errorText } = this.state;
@@ -574,7 +576,7 @@ class QueryTable extends React.PureComponent<QueryTableProps, QueryTableStat> {
 
     return (
       <>
-        {aggregateVO && aggregateVO.aggregates && aggregateVO.aggregates.length > 0 ?
+        {aggregateVO?.aggregates?.length > 0 ?
           <Card variant="borderless" styles={{ body: { paddingLeft: 10, paddingTop: 4, paddingBottom: 4, paddingRight: 10 } }}>
             <Descriptions
               column={rowTotalCols} colon={false}
@@ -657,9 +659,8 @@ class QueryTable extends React.PureComponent<QueryTableProps, QueryTableStat> {
             columnConfigs={columnConfigs}
             serverKey={serverKey}
             columns={columns}
-            primaryColumn={cardListConfig.primaryColumn}
-            primaryColumnLabel={cardListConfig.primaryColumnLabel}
             errorText={errorText}
+            listConfig={cardListConfig}
           />
         ) : (
           ""
@@ -680,13 +681,13 @@ class QueryTable extends React.PureComponent<QueryTableProps, QueryTableStat> {
         {viewModels.includes("ganttChart") ?
           <Gantt showView={showView} onRefresh={() => this.props.doSearch({})} serverKey={serverKey} sourceId={this.props.sourceId} loading={loading} dataSource={dataSource} ltmplConfig={ltmplConfig} errorText={errorText} getChildrenData={this.getChildrenData} /> : ""}
         {viewModels.includes("calendar") ? <Calendar showView={showView} serverKey={serverKey} columns={current_cols} ltmplConfig={ltmplConfig} dataSource={dataSource} loading={loading} errorText={errorText} /> : ""}
-        <Pagination key={queryKey ? queryKey.key : Units.getReactKey()}
+        {showPagination ? <Pagination key={queryKey ? queryKey.key : Units.getReactKey()}
           touchEnd={touchEnd}
           pageInfo={{ ...pageInfo, virtualEndPageNo }}
           pageTo={this.pageTo}
           queryTotal={this.queryTotal}
           total={aggregateVO?.count}
-        />
+        /> : ""}
       </>
     );
   }

package/src/aldehyde/tmpl/hcservice-v3.tsx

@@ -1321,4 +1321,16 @@ export default class HcserviceV3 {
     });
     return res;
   }
+
+  static async ssoTokenLogin(json: { username: string, ssoToken: string }, programCode?: string, serverKey?: string) {
+    let res = await Super.super({
+      url: "/v3/auth/sso/token",
+      serverKey,
+      header: { programCode },
+      query: json,
+      method: "GET",
+    });
+    return res;
+  }
+
 }

package/src/aldehyde/tmpl/interface.tsx

@@ -89,6 +89,7 @@ export interface QueryTableProps extends ReportTableProps {
   cardListConfig?: CardListConfig;
   ltmplConfig?: LtmplConfig;
   showView?: (showVievParam: ShowViewParam) => void;
+  showPagination?: boolean;
 }
 
 export interface AggregateVO {
@@ -242,11 +243,13 @@ export interface Level2Menu extends MenuBase {
   count?: number;
   disabled?: boolean;
   hiddenOnDisabled?: boolean;
-  defaultCriteriaValue?: object;
+  defaultCriteriaValue?: { [key: string]: any };
   pageType: "列表" | "详情" | "编辑" | "添加" | "编辑或添加" | "树" | "导入" | "报表";
   programAuths?: ProgramAuth[];
   linkTarget?: HTMLAttributeAnchorTarget;
   icon?: string;
+  themeColor?: string;
+  fullScreen?: boolean;
 }
 
 export interface Level1Menu extends MenuBase {
@@ -843,4 +846,6 @@ export interface BlockType {
   items?: BlockType[];
   fullScreen?: boolean; // 是否全屏展示
   icon?: string;
+  themeColor?: string;
+  funcDescription?: string;
 }

package/src/aldehyde/welcome/HCWelcome.js

@@ -1,12 +1,16 @@
 import React, { useEffect, useState } from "react";
-import QuickEntrance from "./quick-entrance";
-import Workbench from "./workbench";
+import { Row, Col } from "antd";
+import { useParams } from "react-router-dom";
+import QuickEntrance from "./components/quick-entrance";
+import Workbench from "./components/workbench";
+import MenuCard from "./components/menu-card";
+import PageCard from "./components/page-card";
 import "./index.css";
 import Units from "../units";
 import withRouter from "../routable/withroute";
 import WelcomeBg from "./img/welcome.png";
 import welcomeBg2 from "./img/welcome2.png";
-import { useParams } from "react-router-dom";
+import { getMenuConfig } from "../layout2/page";
 
 // interface HCWelcomeProps {}
 
@@ -277,6 +281,23 @@ import { useParams } from "react-router-dom";
 //   }
 // }
 
+// 处理菜单
+const handleMenu = (arr) => {
+  const temMenus = arr.filter(r => !r.disabled);
+  return temMenus.map(item => {
+    const newItem = {
+      ...item,
+      value: item.id,
+      title: item.label
+    };
+    if (item.children && Array.isArray(item.children) && item.children.length > 0) {
+      newItem.children = handleMenu(item.children);
+      newItem.url = newItem.children[0].url; // 存在子菜单时，url 为第一个子菜单的 url
+    }
+    return newItem;
+  });
+}
+
 // 处理图片地址
 const handleImgUrl = (basePath) => {
   if (basePath.startsWith("http")) {
@@ -295,6 +316,7 @@ const HCWelcome = (props) => {
   const { programCode } = useParams();
   if (programCode) Units.setProgramCode(programCode);
   const [orgHomeImg, setOrgHomeImg] = useState();
+  const [menus, setMenus] = useState([]);
 
   const initUserConfig = async () => {
     let userInfo = await Units.getCurrentUserInfo();
@@ -311,37 +333,41 @@ const HCWelcome = (props) => {
     }
   };
 
+  const getMenus = async () => {
+    const temData = await getMenuConfig(layoutRootPath || "v2");
+    const temMenus = handleMenu(temData?.menu || []);
+    setMenus(temMenus);
+  }
+
   useEffect(() => {
     initUserConfig();
+    getMenus();
   }, []);
 
   return (
     <>
-      <div
-        style={{
-          width: "100%",
-          display: "flex",
-          flexDirection: "row",
-        }}
-      >
-        <div
-          style={{
-            width: "50%",
-            boxSizing: "border-box",
-            padding: 10,
-          }}
-        >
-          <Workbench></Workbench>
-        </div>
-        <div
-          style={{
-            width: "50%",
-            boxSizing: "border-box",
-            padding: 10,
-          }}
-        >
-          <QuickEntrance></QuickEntrance>
-        </div>
+      <div style={{ width: "100%", paddingTop: "12px" }} >
+        <Row gutter={[0]}>
+          <Col span={24}>
+            <Workbench layoutRootPath={layoutRootPath} menus={menus[0]?.children || []} />
+          </Col>
+          <Col span={24}>
+            <Row gutter={16}>
+              <Col span={16}>
+                <Row gutter={[0, 16]}>
+                  <Col span={24}><QuickEntrance layoutRootPath={layoutRootPath} menus={menus[0]?.children || []} /></Col>
+                  <Col span={24}><MenuCard menus={menus} /></Col>
+                </Row>
+              </Col>
+              <Col span={8}>
+                <Row gutter={[16, 16]}>
+                  <Col span={24}><PageCard fastMenu="RightSidebar01" layoutRootPath={layoutRootPath} menus={menus} menuOrder={1} /></Col>
+                  <Col span={24}><PageCard fastMenu="RightSidebar02" layoutRootPath={layoutRootPath} menus={menus} menuOrder={2} /></Col>
+                </Row>
+              </Col>
+            </Row>
+          </Col>
+        </Row>
       </div>
       <img src={orgHomeImg || homeImg || (!layoutRootPath || (["v2", "v5"].includes(layoutRootPath)) ? WelcomeBg : welcomeBg2)} alt="" width="100%" height="100%" style={{ borderRadius: "8px", margin: "0 10px", width: "calc(100% - 20px)" }} />
     </>

package/src/aldehyde/welcome/components/menu-card.less

@@ -0,0 +1,96 @@
+.menu-card {
+    width: 100%;
+
+    .item-card {
+        position: relative;
+        overflow: hidden;
+        border-radius: 0.75rem;
+        padding: 1.25rem;
+        transition-property: transform, box-shadow;
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        border: 1px solid;
+        cursor: pointer;
+
+        .ant-row {
+            width: 100%;
+        }
+
+        .icon-wrapper {
+            position: relative;
+            display: flex;
+            height: 3rem;
+            width: 3rem;
+            align-items: center;
+            justify-content: center;
+            transition-property: all;
+            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+            transition-duration: 0.3s;
+            animation-duration: 0.3s;
+            border-radius: 0.75rem;
+            opacity: 1;
+        }
+
+        .item-title {
+            margin-bottom: 6px;
+            font-weight: 600;
+            font-size: 18px;
+        }
+
+        .tag {
+            padding: 4px 10px;
+            border-radius: 9999px;
+            font-size: 12px;
+            line-height: 16px;
+        }
+
+        .progress-bar {
+            overflow: hidden;
+            position: absolute;
+            right: 0;
+            bottom: 0;
+            left: 0;
+            border-bottom-right-radius: 0.75rem;
+            border-bottom-left-radius: 0.75rem;
+            height: 2px;
+
+            .bar {
+                height: 100%;
+                width: 100%;
+                transform-origin: left;
+                transform: scaleX(0);
+                transition-property: transform;
+                transition-duration: 500ms;
+                transition-timing-function: ease-out;
+            }
+        }
+
+    }
+
+    .item-card:hover {
+        transform: translateY(-1px);
+        box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+
+        .icon-wrapper {
+            transform: scale(1.1);
+            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
+        }
+
+        .item-title {
+            color: var(--ant-color-primary);
+        }
+
+        .progress-bar .bar {
+            transform: scaleX(1);
+        }
+    }
+
+    .icon-animated {
+        font-size: 24px;
+        transition-property: all;
+        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+        transition-duration: 300ms;
+    }
+
+}

package/src/aldehyde/welcome/components/menu-card.tsx

@@ -0,0 +1,68 @@
+import React, { useEffect, useState } from "react";
+import { theme, Row, Col, Space, Flex } from "antd";
+import { RocketTwoTone } from "@ant-design/icons";
+import { useNavigate } from "react-router-dom";
+import "antd/dist/reset.css";
+import { MenuType } from "../../layout2/type/layout-type";
+import IconFont from "../../icon/aliIcon";
+import "./menu-card.less";
+
+const { useToken } = theme;
+
+interface Props {
+    menus: MenuType[];
+}
+
+const Index = (props: Props) => {
+    const { menus } = props;
+    const navigate = useNavigate();
+    const [menu, setMenu] = useState<MenuType[]>([]);
+    const { token } = useToken();
+
+    useEffect(() => {
+        if (menus?.length) {
+            setMenu(menus.slice(0, 4));
+        }
+    }, [menus]);
+
+    const renderItem = (item: MenuType) => {
+        const renderIcon = item.icon ? <IconFont type={item.icon} /> : <RocketTwoTone />;
+        const iconColor = item.themeColor || token.colorPrimary;
+        const children = item.children?.filter(r => !r.disabled).slice(0, 3) || [];
+        const funcDescription = item.funcDescription || `${children.map(r => r.label).join("、")}等功能`;
+        return <div className="item-card" style={{ borderColor: `${token.colorBorder}CC`, backgroundColor: token.colorBgContainer }} onClick={() => navigate(`/${item.url}`)}>
+            <Space size={16} align="start" style={{ marginBottom: "16px" }}>
+                <div className="icon-wrapper" style={{ color: iconColor, background: `${iconColor}1A` }}>
+                    <div className="icon-animated">{renderIcon}</div>
+                </div>
+                <div>
+                    <h3 className="item-title">{item.label}</h3>
+                    <p style={{ color: token.colorTextSecondary }}>
+                        {funcDescription}
+                    </p>
+                    <Flex gap="small" align="center" wrap>
+                        {children.map((cItem) => (
+                            <span
+                                onClick={(e) => {
+                                    e.stopPropagation();
+                                    navigate(`/${cItem.url}`);
+                                }}
+                                key={cItem.id} className="tag" style={{ color: iconColor, background: `${iconColor}1A` }}>
+                                {cItem.label}
+                            </span>
+                        ))}
+                    </Flex>
+                </div>
+            </Space>
+            <div className="progress-bar"><div className="bar" style={{ backgroundColor: iconColor }} /></div>
+        </div>;
+    }
+
+    return <div className="menu-card">
+        <Row gutter={[16, 16]}>
+            {menu.map((item) => <Col span={12}>{renderItem(item)}</Col>)}
+        </Row>
+    </div>;
+}
+
+export default Index;