aldehyde 0.2.461 → 0.2.462

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

@@ -12,7 +12,7 @@ interface LtmplDrawPageProps extends LtmplTableProps {
 }
 
 interface LtmplDrawPageState {
-
+    drawerSize?: number | string;
 }
 
 export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps, LtmplDrawPageState> {
@@ -27,30 +27,32 @@ export default class LtmplDrawer extends React.PureComponent<LtmplDrawPageProps,
         placement: 'left',
     }
     state = {
-
+        drawerSize: 0
     }
 
+    async componentDidMount() {
+        const { width } = this.props;
+        this.setState({ drawerSize: width });
+    }
 
     render() {
         const { title, width, onCancel, open, ...other } = this.props;
+        const { drawerSize } = this.state;
         const placement = this.props.placement || 'left';
+        const maxSize = document.documentElement.clientWidth * 0.9;
 
         return (<Drawer
             title={title}
             placement={placement}
+            resizable={{ onResize: (newSize => this.setState({ drawerSize: newSize })) }}
             closable={true}
             mask={false}
             onClose={onCancel}
             open={open}
-            width={width}
-            style={{
-                maxWidth: '92vw',
-            }}
-        // extra={
-        //     <Space>{this.getFooter()}</Space>
-        // }
+            size={drawerSize}
+            maxSize={maxSize}
         >
-            <LtmplTable {...other}></LtmplTable>
+            <LtmplTable {...other} />
         </Drawer>
         )
 

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

@@ -54,6 +54,7 @@ export interface LtmplTableState {
   collapse?: boolean;
   addTmplId?: string;
   dtmplSourceId?: string;
+  drawerSize?: number | string; // 抽屉组件
 }
 
 class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
@@ -71,6 +72,7 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
     collapse: false,
     addTmplId: undefined,
     dtmplSourceId: undefined,
+    drawerSize: "92vw"
   };
   static contextType = LocaleContext;
   context: React.ContextType<typeof LocaleContext>;
@@ -252,7 +254,7 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
       ractionId,
       showDraw,
       collapse,
-      addTmplId, dtmplSourceId,
+      addTmplId, dtmplSourceId, drawerSize
     } = this.state;
     const {
       sourceId, mainCode,
@@ -350,15 +352,13 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
             <Drawer
               placement={"left"}
               title={translate("${关联查询}")}
+              resizable={{ onResize: (newSize => this.setState({ drawerSize: newSize })) }}
+              size={drawerSize}
               closable={true}
               mask={false}
               onClose={this.closeDrawer}
               open={showDraw}
-              width="100%"
-              rootStyle={{
-                width: "calc(100% - 280px)",
-                maxWidth: 1960,
-              }}
+              styles={{ body: { minWidth: "720px" } }}
               extra={
                 <Space>
                   <Button onClick={this.closeDrawer}>
@@ -367,13 +367,7 @@ class LtmplTable extends React.PureComponent<LtmplTableProps, LtmplTableState> {
                 </Space>
               }
             >
-              {
-                <LtmplTable
-                  serverKey={serverKey}
-                  sourceId={ractionId}
-                  mainCode={selectedCode}
-                ></LtmplTable>
-              }
+              <LtmplTable serverKey={serverKey} sourceId={ractionId} mainCode={selectedCode} />
             </Drawer> : null}
         </>
       );

package/src/aldehyde/routable/ltmpl-route.tsx

@@ -44,6 +44,7 @@ export interface LtmplRouteState {
     userPageConfigLoading?: boolean; // 缓存配置请求状态
     themeConfig?: ThemeConfig;
     pageSizeOptions?: number[]; // 分页条数
+    drawerSize?: number | string; // 抽屉组件
 }
 
 class LtmplRoute extends React.PureComponent<LtmplRouteProps, LtmplRouteState> {
@@ -73,7 +74,8 @@ class LtmplRoute extends React.PureComponent<LtmplRouteProps, LtmplRouteState> {
         userPageConfig: undefined,
         userPageConfigLoading: true,
         themeConfig: undefined,
-        pageSizeOptions: []
+        pageSizeOptions: [],
+        drawerSize: "92vw"
     };
 
     async componentDidMount() {
@@ -374,7 +376,7 @@ class LtmplRoute extends React.PureComponent<LtmplRouteProps, LtmplRouteState> {
         const {
             ltmplConfigRes, showDraw, showWindowType, ractionId, selectedCode,
             showViewDrawer, showViewModal, showEdit, editSourceId, viewSourceId, toCustomPage, userPageConfig,
-            themeConfig, pageSizeOptions, userPageConfigLoading
+            themeConfig, pageSizeOptions, userPageConfigLoading, drawerSize
         } = this.state;
         const { location, params, tableType, rowOperatable, defShowType } = this.props;
         const { sourceId } = params;
@@ -427,11 +429,8 @@ class LtmplRoute extends React.PureComponent<LtmplRouteProps, LtmplRouteState> {
                         <Drawer
                             placement={"left"} title={translate("${关联查询}")} closable={true} mask={false} onClose={this.doClose}
                             open={showDraw}
-                            width="100%"
-                            rootStyle={{
-                                width: "calc(100% - 280px)",
-                                maxWidth: 1960,
-                            }}
+                            resizable={{ onResize: (newSize => this.setState({ drawerSize: newSize })) }}
+                            size={drawerSize}
                             extra={
                                 <Space>
                                     <Button onClick={this.doClose}>
@@ -439,10 +438,9 @@ class LtmplRoute extends React.PureComponent<LtmplRouteProps, LtmplRouteState> {
                                     </Button>
                                 </Space>
                             }
+                            styles={{ body: { minWidth: "720px" } }}
                         >
-                            {
-                                <LtmplTable serverKey={null} sourceId={ractionId} mainCode={selectedCode}></LtmplTable>
-                            }
+                            <LtmplTable serverKey={null} sourceId={ractionId} mainCode={selectedCode} />
                         </Drawer>
                     ) : null}
                     {showViewDrawer && selectedCode ? (

package/src/aldehyde/routable/splitview-ltmpl-route.tsx

@@ -41,6 +41,7 @@ const Index = (props: Props) => {
     const [userPageConfigLoading, setUserPageConfigLoading] = useState<boolean>(true);
     const [pageSizeOptions, setPageSizeOptions] = useState<number[]>([]); // 分页条数
     const [themeConfig, setThemeConfig] = useState<ThemeConfig>();     // 主题配置信息
+    const [drawerSize, setDrawerSize] = useState<number | string>("92vw");
     const { sourceId } = useParams();
     const { search } = useLocation();
     const { translate } = useLocale();
@@ -310,11 +311,9 @@ const Index = (props: Props) => {
             <Drawer
                 placement="left" title={translate("${关联查询}")} closable={true} mask={false} onClose={doCloseShowDraw}
                 open={showDraw}
-                width="100%"
-                rootStyle={{
-                    width: "calc(100% - 280px)",
-                    maxWidth: 1960,
-                }}
+                resizable={{ onResize: (newSize => setDrawerSize(newSize)) }}
+                size={drawerSize}
+                styles={{ body: { minWidth: "720px" } }}
                 extra={
                     <Space>
                         <Button onClick={doCloseShowDraw}>{translate("${关闭}")}</Button>

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

@@ -115,6 +115,7 @@ interface ActTableStat {
   tabsOptions?: { key: string, value: string, label: React.ReactNode, title?: string, id?: string, ids?: string[] }[]; // tabs选项
   tabActiveKey?: string; // Tabs选中项
   pageSizeOptions?: number[]; // 设备分页数
+  customDrawerSize?: number | string; // 自定义页面抽屉宽度
 }
 let serial_number = new Date().getTime();
 let busyReminderTime = 0;
@@ -150,7 +151,8 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
     delModalOpen: false, // 强删除弹窗是否打开
     tabsOptions: [],
     tabActiveKey: "all",
-    pageSizeOptions: defPageSizeOptions
+    pageSizeOptions: defPageSizeOptions,
+    customDrawerSize: undefined
   };
 
   static contextType = LocaleContext;
@@ -381,7 +383,7 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
       | "right-drawer"
   ) => {
     const { translate } = this.context;
-    const { customButton, customButtonData } = this.state;
+    const { customButton, customButtonData, customDrawerSize } = this.state;
 
     if (!customButton) {
       return "";
@@ -451,10 +453,12 @@ class ActTable extends React.PureComponent<ActTableProps, ActTableStat> {
           placement={
             customButton.windowPosition == "right-drawer" ? "right" : "left"
           }
-          width={customButton.windowWidth}
+          resizable={{ onResize: (newSize => this.setState({ customDrawerSize: newSize })) }}
+          size={customDrawerSize !== undefined ? customDrawerSize : customButton.windowWidth}
           onClose={() => {
             this.setState({ customButton: undefined });
           }}
+          styles={{ body: { minWidth: customButton.windowWidth } }}
         >
           {customElement}
         </Drawer>

package/src/aldehyde/table/column/column-builder.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { ActionRenderProps, ColumnConfig, DtmplData, LtmplConfig, FieldConfig } from "../../tmpl/interface";
+import { ActionRenderProps, ColumnConfig, DtmplData, LtmplConfig, FieldConfig, CustomButton, CQueryConfig } from "../../tmpl/interface";
 import TableUnits from "../table-util";
 import SupportInputTypes from "../../tmpl/control-type-supportor";
 import { Button, Popconfirm, Popover, Space, Tooltip, Form as AntdForm } from "antd";
@@ -25,6 +25,7 @@ import NewinFileView from "../../controls/file-view/newin-file-view";
 import { EntryControl } from "../../index";
 import TmplConfigAnalysis from "../../tmpl/tmpl-config-analysis";
 import Icon from "../../icon/aliIcon";
+import SelectCodeExport from "../../controls/file-export/select-code-export";
 import "./index.less";
 
 const FormItem = AntdForm.Item;
@@ -83,7 +84,7 @@ export default {
             columnResize
         } = props;
 
-        const { primaryColumn, primaryColumnLabel } = ltmplConfig
+        const { primaryColumn, secondColumn, primaryColumnLabel } = ltmplConfig;
 
         let tableColumns = [];
         let s = 0;
@@ -184,6 +185,40 @@ export default {
                         }
                     }
 
+                    // 首字段渲染
+                    const renderPrimaryColumn = <div className="column-table-primary">
+                        <div className="primary-column" onClick={() => detailParams && showView(detailParams)}>
+                            <ViewControl
+                                serverKey={serverKey}
+                                fieldConfig={item}
+                                value={record[item.id]}
+                                holderType="table"
+                            />
+                        </div>
+                        {primaryColumnLabel?.id ?
+                            <div className="primary-column-label" >
+                                <ViewControl
+                                    serverKey={serverKey}
+                                    fieldConfig={primaryColumnLabel}
+                                    value={record[primaryColumnLabel.id]}
+                                    holderType="table"
+                                />
+                            </div> :
+                            ""}
+                        {/* 首字段操作按钮 */}
+                        {this.renderColumnAction(props, record, "primary")}
+                    </div>;
+                    // 次字段渲染
+                    const renderSecondColumn = <div className="column-table-second">
+                        <ViewControl
+                            serverKey={serverKey}
+                            fieldConfig={item}
+                            value={record[item.id]}
+                            holderType="table"
+                        />
+                        {this.renderColumnAction(props, record, "secondary")}
+                    </div>;
+
                     return (editings.includes(record.code) || buttons.includes("multiRowEdit") ?
                         <FormItem style={{ margin: 0 }}
                             name={record.code + "_" + item.id}
@@ -197,35 +232,15 @@ export default {
                             />
                         </FormItem> :
                         <div className={record['dataType'] ? record['dataType'] === "小计" ? "xiaoji" : 'heji' : ""}>
-                            {primaryColumn?.id === item.id ?
-                                <div className="column-table-primary">
-                                    <div className="primary-column" onClick={() => detailParams && showView(detailParams)}>
-                                        <ViewControl
-                                            serverKey={serverKey}
-                                            fieldConfig={item}
-                                            value={record[item.id]}
-                                            holderType="table"
-                                        />
-                                    </div>
-                                    {primaryColumnLabel?.id ?
-                                        <div className="primary-column-label" >
-                                            <ViewControl
-                                                serverKey={serverKey}
-                                                fieldConfig={primaryColumnLabel}
-                                                value={record[primaryColumnLabel.id]}
-                                                holderType="table"
-                                            />
-                                        </div> :
-                                        ""}
-                                </div>
-                                : <ViewControl
+                            {primaryColumn?.id === item.id ? renderPrimaryColumn : secondColumn?.id === item.id ? renderSecondColumn :
+                                <ViewControl
                                     serverKey={serverKey}
                                     fieldConfig={item}
                                     value={record[item.id]}
                                     holderType="table"
                                 />
                             }
-                        </div >
+                        </div>
                     );
                 };
             }
@@ -423,7 +438,100 @@ export default {
         }
         return undefined;
     },
-    renderAction(props: ActionRenderProps, record: DtmplData) {
+    renderColumnAction(props: ActionRenderProps, record: DtmplData, type: "primary" | "secondary") { // 主列/次列悬浮按钮渲染
+        const { ltmplConfig, serverKey, doRowAction, doRAction, doCustomButton, translate, readOnly } = props;
+        const { primaryColumnButtons, secondColumnButtons } = ltmplConfig;
+        const temButtons = type === "primary" ? primaryColumnButtons : secondColumnButtons;
+        if (readOnly || !temButtons?.length) {
+            return null;
+        }
+        const actionButtons: any[] = temButtons.map(item => {
+            switch (item.functionType) {
+                case "action": // 操作按钮
+                    if (ActionUtils.isShow(item.preposes, [record], undefined)) {
+                        return <Action
+                            serverKey={serverKey}
+                            iconType={"icon"}
+                            key={item.id}
+                            data={[record]}
+                            actionConfig={item}
+                            doAction={doRowAction}
+                            buttonSize={"small"}
+                            serial={1}
+                        />;
+                    } else {
+                        return undefined;
+                    }
+                case "raction": // 关系按钮
+                    if (ActionUtils.isShow(item?.preposes, [record], undefined)) {
+                        return <Button
+                            key={item.id}
+                            size="small"
+                            type="dashed"
+                            onClick={() => doRAction(item.id, record.code)}
+                        >
+                            {item.icon ?
+                                <Tooltip placement="top" title={translate("${" + item.title + "}")}>
+                                    <Icon type={item.icon} />
+                                </Tooltip>
+                                : translate("${" + item.title + "}")}
+                        </Button>;
+                    } else {
+                        return undefined;
+                    }
+                case "customButton": // 自由按钮
+                    if (ActionUtils.isShow(item.preposes, [record], undefined)) {
+                        return <Button
+                            key={item.id}
+                            size="small"
+                            type={item.buttonType || "dashed"}
+                            onClick={() => doCustomButton(item as unknown as CustomButton, [record])}
+                        >
+                            {item.icon ?
+                                <Tooltip placement="top" title={translate("${" + item.title + "}")}>
+                                    <Icon type={item.icon} />
+                                </Tooltip>
+                                : translate("${" + item.title + "}")}
+                        </Button>
+                    } else {
+                        return undefined;
+                    };
+                case "fileExport": // 文件导出
+                    if (ActionUtils.isShow(item.preposes, [record], undefined)) {
+                        return <SelectCodeExport
+                            serverKey={serverKey}
+                            hiddenType="disabled"
+                            codes={[record.code]}
+                            key={item.id}
+                            fileExport={item}
+                            disabled={false}
+                        />;
+                    } else {
+                        return undefined;
+                    }
+                case "customExport": // 自定义导出
+                    return undefined;
+                case "cQuery": // 关联查询
+                    if (ActionUtils.isShow(item.preposes, [record], undefined)) {
+                        const config: CQueryConfig = item;
+                        return <CquickButton
+                            serverKey={serverKey}
+                            key={config.id}
+                            size={"small"}
+                            pageType={"drawer"}
+                            cQueryConfig={config}
+                            mainCode={config.mainCodeColId ? record[config.mainCodeColId] : record.code}
+                        />;
+                    } else {
+                        return undefined;
+                    }
+                default:
+                    return undefined;
+            }
+        }).filter(Boolean);
+        return actionButtons?.length ? <div className="column-action"><Space wrap size={4}>{actionButtons}</Space></div> : undefined;
+    },
+    renderAction(props: ActionRenderProps, record: DtmplData) { // 操作列按钮渲染
         const { ltmplConfig, showView,
             doEdit,
             doRAction,

package/src/aldehyde/table/column/index.less

@@ -13,8 +13,6 @@
 }
 
 .column-table-primary {
-    display: flex;
-    align-items: center;
 
     .primary-column {
         text-overflow: ellipsis;
@@ -33,4 +31,34 @@
             white-space: nowrap;
         }
     }
+}
+
+.column-table-primary,
+.column-table-second {
+    display: flex;
+    align-items: center;
+
+    .column-action {
+        display: none;
+        position: absolute;
+        right: 8px;
+        top: 50%;
+        transform: translateY(-50%);
+        z-index: 1;
+        padding: 2px;
+        background-color: var(--ant-color-primary-bg);
+        border-radius: 4px;
+        border: 1px dashed var(--ant-color-primary-border);
+
+        button {
+            margin-right: 0;
+        }
+    }
+}
+
+.column-table-primary:hover,
+.column-table-second:hover {
+    .column-action {
+        display: block;
+    }
 }

package/src/aldehyde/tmpl/interface.tsx

@@ -159,6 +159,7 @@ export type ActTableMode = "simple" | "common" | "complete";
 export interface ActionConfig extends ButtonConfig {
   preposes: FieldConfig[];
   writes: FieldConfig[];
+  functionType?: "action" | "raction" | "customButton" | "fileExport" | "cQuery" | "customExport";
 }
 
 export interface BuinButtonConfig extends ButtonConfig {
@@ -628,6 +629,8 @@ export interface LtmplConfig extends SelectConfig {
   defaultDtmplData?: DtmplData;
   rightPercent?: number;
   pageLayout?: "leftRightSplit" | "upDownSplit" | "quadSplit" | "none" | "leftRightSplit-21" | "leftRightSplit-12";
+  primaryColumnButtons?: ActionConfig[]; // 首字段操作按钮
+  secondColumnButtons?: ActionConfig[]; // 次字段操作按钮
   // 甘特图配置
   gttTableProportion?: number;
   gttBeginTime?: ColumnConfig;

package/src/aldehyde/tmpl/web-socket.ts

@@ -128,7 +128,7 @@ class WebSocket {
                     "hydrocarbon-program-token": programCode
                 },
                 onConnect: (frame) => { // 连接成功回调
-                    console.log("连接成功：frame", frame);
+                    // console.log("连接成功：frame", frame);
                     this.state = ConnectionState.CONNECTED;
                     this.reconnectAttempts = 0;
                     this.connectPromises.forEach(({ resolve }) => resolve());

package/src/aldehyde/welcome/components/user-menus.tsx

@@ -59,6 +59,7 @@ interface PageConfig extends Level2Menu {
 const RenderDrawer = (props: DrawerProps) => {
   const { open, onClose, menus, selectMenus, onOk, btnLoading } = props;
   const [checkMenus, setCheckMenus] = useState<string[]>([]);
+  const [drawerSize, setDrawerSize] = useState<number | string>();
   const { translate } = useLocale();
 
   useEffect(() => {
@@ -89,6 +90,9 @@ const RenderDrawer = (props: DrawerProps) => {
     title={translate("我的菜单")}
     onClose={onClose}
     open={open}
+    size={drawerSize}
+    resizable={{ onResize: (newSize => setDrawerSize(newSize)) }}
+    styles={{ body: { minWidth: "280px" }, title: { whiteSpace: "nowrap" } }}
     extra={
       <Button loading={btnLoading} type="primary" disabled={!treeData?.length} onClick={() => onOk(checkMenus)}>{translate("${保存}")}</Button>
     }