aldehyde 0.2.319 → 0.2.321

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

@@ -1,6 +1,9 @@
-import React from 'react'
-import "./index.css"
-import {DtmplData, QueryKey, SelectConfig,SelectedRow} from "../tmpl/interface";
+import React from 'react';
+import { Space, Button, Popconfirm } from "antd";
+import { DeleteOutlined, EditOutlined, AlignCenterOutlined } from "@ant-design/icons";
+import debounce from "lodash/debounce";
+import "./index.css";
+import { DtmplData, QueryKey, SelectConfig, SelectedRow, ControlBaseProps, LtmplConfig } from "../tmpl/interface";
 import TableUnits from "./table-util";
 import SupportInputTypes from '../tmpl/control-type-supportor';
 import HCDataSource from '../tmpl/hc-data-source';
@@ -9,13 +12,16 @@ import QueryTable from './query-table';
 import CriteriaForm from "../form/criteria-form";
 import ViewControl from "../controls/view-control";
 import { LocaleContext } from "../locale/LocaleProvider";
+import DtmplViewDrawer from "../module/dtmpl-view-drawer";
+import DtmplEditPage from "../module/dtmpl-edit-page";
+import DtmplCustomEditModalPage from "../custom-page/dtmpl-custom-edit-modal-page";
 
-interface SelectTableProps {
-    mainCode?:string,
+interface SelectTableProps extends ControlBaseProps {
+    mainCode?: string,
     maxSelectedRows?: number,
-    serverKey?:string,
+    serverKey?: string,
     sourceId: string,
-    showActions?:boolean,
+    showActions?: boolean,
     selectedRows: SelectedRow[];
     selectedDatas?: DtmplData[];
     // onCancel: () => void,
@@ -29,8 +35,12 @@ interface SelectTableStat {
     queryKey?: QueryKey;
     loading?: boolean;
     criteriaData?: object;
-    pageNo?:number,
-    pageSize?:number,
+    pageNo?: number,
+    pageSize?: number,
+    showView?: boolean;
+    drawCode?: string;
+    showEdit?: boolean;
+    ltmplConfig?: LtmplConfig;
 };
 
 class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat> {
@@ -39,8 +49,8 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
 
     static defaultProps = {
         maxSelectedRows: 1000,
-        selectedDatas:[],
-        showActions:false
+        selectedDatas: [],
+        showActions: false
     }
     state = {
         selectConfig: undefined,
@@ -49,32 +59,34 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
         loading: true,
         criteriaData: undefined,
         disableCols: undefined,
-        pageNo:1,
-        pageSize:undefined,
+        pageNo: 1,
+        pageSize: undefined,
+        showView: false,
+        drawCode: undefined,
+        showEdit: false,
+        ltmplConfig: undefined,
     }
 
-    loadData = async (selectConfig: SelectConfig, criteriaData: object,npageNo?:number) => {
-        this.setState({
-            loading: true,
-        })
-        const {mainCode,serverKey,sourceId}=this.props;
-        const {pageNo,pageSize}=this.state;
-        const {defaultPageSize} = selectConfig;
-        const pno=npageNo?npageNo:pageNo;
+    loadData = async (selectConfig: SelectConfig, criteriaData: object, npageNo?: number) => {
+        this.setState({ loading: true });
+        const { mainCode, serverKey, sourceId } = this.props;
+        const { pageNo, pageSize } = this.state;
+        const { defaultPageSize } = selectConfig;
+        const pno = npageNo ? npageNo : pageNo;
         let pageInfo = {
             pageNo: pno,
-            pageSize: pageSize?pageSize:defaultPageSize ? defaultPageSize : 10,
+            pageSize: pageSize ? pageSize : defaultPageSize ? defaultPageSize : 10,
             virtualEndPageNo: undefined,
         }
         /** 构建 dataSource **/
-            //构建过滤条件
-        let queryKey: QueryKey = await HcserviceV3.requestLtmplQueryKey(serverKey,sourceId, {...criteriaData, ...pageInfo,mainCode});
+        //构建过滤条件
+        let queryKey: QueryKey = await HcserviceV3.requestLtmplQueryKey(serverKey, sourceId, { ...criteriaData, ...pageInfo, mainCode });
         this.setState({
-            pageNo:pno,
+            pageNo: pno,
             queryKey,
             criteriaData,
             loading: false,
-        })
+        });
     }
 
     async componentDidMount() {
@@ -83,76 +95,100 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
 
     loadConfig = async () => {
         const { translate } = this.context;
-        const {sourceId,serverKey,showActions} = this.props;
-        this.setState({
-            loading: true,
-        })
-
-        let selectConfig = await HCDataSource.requestSelectConfig(serverKey,sourceId);
+        const { sourceId, serverKey, showActions, fieldConfig } = this.props;
+        const actions = fieldConfig.actions;
+        this.setState({ loading: true });
+        let selectConfig = await HCDataSource.requestSelectConfig(serverKey, sourceId);
         /** 构建column **/
         let columns = [];
-
         let s = 0;
         selectConfig.columns.forEach((item) => {
             let column = {};
-
-            if (item.title == "操作" && showActions) {
-                columns.push(column);
-            }else{
-                columns.push(column);
-            }
             column['dataIndex'] = item.id;
             column["title"] = translate("${" + item.title + "}");
             column["width"] = item.colWidth ? item.colWidth : 160;
             column["align"] = item.valueAlign ? item.valueAlign : "left";
-            // column['ellipsis']= true;
             s++;
             let itemType = SupportInputTypes.getSupportControlType(item);
             if (s < 12 && item.sortable) {
                 TableUnits.sort(column, itemType);
             }
             //特殊列处理
-            //序号
             if (item.title === "序号") {
                 column["width"] = item.colWidth ? item.colWidth : 50;
                 column["align"] = item.valueAlign ? item.valueAlign : "center";
-                column['render'] = (text, record, index) => (
-                    <label>{index + 1}</label>
-                )
-                item['sorter'] = undefined;
+                column['render'] = (text, record, index) => (<label>{index + 1}</label>);
+                column['sorter'] = undefined;
             } else {
-                column['render'] = (text, record) => {
-                    return <ViewControl serverKey={serverKey} holderType={'table'} fieldConfig={item} value={record[item.id]}/>
+                if (item.title === "操作" && actions) {
+                    column['render'] = (text, record) => {
+                        const actionButtons = [];
+                        if (actions.includes("detail")) {
+                            actionButtons.push(
+                                <Button
+                                    size="small"
+                                    type="primary"
+                                    icon={<AlignCenterOutlined />}
+                                    onClick={() => this.showItem(record.code)}
+                                />
+                            );
+                        }
+                        if (actions.includes("edit")) {
+                            actionButtons.push(<Button
+                                size="small"
+                                type="dashed"
+                                icon={<EditOutlined />}
+                                onClick={() => this.editItem(record.code)}
+                            />);
+                        }
+                        if (actions.includes("delete")) {
+                            actionButtons.push(<Popconfirm
+                                placement="rightBottom"
+                                title={translate("${确定要[删除]此数据吗}?")}
+                                onConfirm={() => this.doDeleteByCode(record.code)}
+                                okText={translate("${确定}")}
+                                cancelText={translate("${取消}")}
+                                okType={"danger"}
+                            >
+                                <Button size="small" type="dashed" danger>
+                                    <DeleteOutlined />
+                                </Button>
+                            </Popconfirm>);
+                        }
+                        return <Space size={[0, 4]} wrap>{actionButtons}</Space>;
+                    }
+                } else {
+                    column['render'] = (text, record) => <ViewControl serverKey={serverKey} holderType={'table'} fieldConfig={item} value={record[item.id]} />;
                 }
             }
+            const isAction = actions?.some(r => ["detail", "edit", "delete"].includes(r));
+            if (item.title !== "操作" || (item.title === "操作" && showActions && isAction)) {
+                columns.push(column);
+            }
         });
         this.setState({
             columns,
             selectConfig,
             loading: false,
-        })
+        });
         return selectConfig;
     }
 
     async componentDidUpdate(prevProps) {
-        const {} = this.props;
-        const {selectConfig, criteriaData, queryKey, loading} = this.state;
-        const {exceptCodes: preExceptCodes, open: preOpen} = prevProps;
+        const { selectConfig, criteriaData, queryKey, loading } = this.state;
         let config = selectConfig;
-        //if (visible) {
         if (!config) {
             config = await this.loadConfig();
         }
         if (!queryKey && !loading) {
             await this.loadData(config, criteriaData);
         }
-        //}
     }
 
     doSearch = async (params_) => {
-        const {selectConfig} = this.state;
-        let params = {...params_}
-        await this.loadData(selectConfig, params,1);
+        const { selectConfig } = this.state;
+        let params = { ...params_ }
+        await this.loadData(selectConfig, params, 1);
     }
 
     // handleOk = () => {
@@ -176,7 +212,7 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
         //console.log('changeRowSelection:', allRowKeys);
         let selectedRows_new: SelectedRow[];
         let selectedDatas_new: DtmplData[] = [];
-        const {selectedRows, selectedDatas, onChange, maxSelectedRows} = this.props;
+        const { selectedRows, selectedDatas, onChange, maxSelectedRows } = this.props;
         if (allRowKeys) {
             let selectedKeys = [];
             let selectedRows_1: SelectedRow[] = [];
@@ -225,28 +261,86 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
         onChange(selectedRows_new, selectedDatas_new);
     }
 
-    onChangePage=(pageNo,pageSize)=>{
+    onChangePage = (pageNo, pageSize) => {
+        this.setState({ pageNo, pageSize });
+    }
 
-        this.setState({pageNo,pageSize})
+    loadLtmplConfig = async () => {
+        const { sourceId, serverKey } = this.props;
+        const { ltmplConfig } = this.state;
+        let ltmplConfig_ = ltmplConfig;
+        if (!ltmplConfig_) {
+            ltmplConfig_ = (await HCDataSource.requestLtmplConfig(serverKey, sourceId))?.ltmplConfig;
+        }
+        this.setState({ ltmplConfig: ltmplConfig_ });
+        return ltmplConfig_;
+    };
 
-    }
+    doClose = () => {
+        this.setState({
+            drawCode: undefined,
+            showEdit: false,
+            showView: false,
+        });
+    };
 
+    drawSubmited = () => {
+        this.doClose();
+        debounce(() => this.loadData(this.state.selectConfig, {}), 100)();
+    };
 
-    render() {
-        let {maxSelectedRows, selectedRows, selectedDatas,serverKey,sourceId} = this.props;
-        let {queryKey, columns, selectConfig, criteriaData, loading,pageNo,pageSize} = this.state;
+    showItem = async (code) => {
+        let ltmplConfig = await this.loadLtmplConfig();
+        this.setState({
+            showEdit: false,
+            showView: true,
+            drawCode: code,
+            ltmplConfig,
+        });
+    };
 
+    editItem = async (code?) => {
+        let ltmplConfig = await this.loadLtmplConfig();
+        this.setState({
+            showEdit: true,
+            showView: false,
+            drawCode: code,
+            ltmplConfig,
+        });
+    };
+
+    doDeleteByCode = async (code: string) => {
+        const { sourceId, serverKey, mainCode } = this.props;
+        this.setState({ loading: true });
+        let result: boolean = await HcserviceV3.deleteByCode(
+            serverKey,
+            sourceId,
+            [code],
+            mainCode
+        );
+        if (result) {  //重新加载数据
+            this.loadData(this.state.selectConfig, {});
+        } else {
+            this.setState({ loading: false });
+        }
+    };
+
+
+    render() {
+        let { maxSelectedRows, selectedRows, selectedDatas, serverKey, sourceId, mainCode, fieldConfig } = this.props;
+        let { queryKey, columns, selectConfig, criteriaData, loading, pageNo, pageSize, showView, drawCode, showEdit, ltmplConfig } = this.state;
         if (!selectConfig) {
             return <>
             </>
         }
-        let {buttons, criterias, jumps, actions,fileExports} = selectConfig
+        let { actions } = fieldConfig;
+        let { buttons, criterias, jumps, fileExports } = selectConfig;
         let displayCriteriaCard: boolean = false;
         if (buttons.includes('batchDelete') || (buttons.includes('query') && criterias && criterias.length > 0) ||
-            (actions && actions.length > 0) || (jumps && jumps.length > 0) || (fileExports && fileExports.length>0)) {
+            (actions && actions.length > 0) || (jumps && jumps.length > 0) || (fileExports && fileExports.length > 0)) {
             displayCriteriaCard = true;
         }
-       // debugger
+        // debugger
         return (
             // <Card
             //     // title={<SelectedRowsCard value={selectedRows} onChange={this.changeRowSelection}></SelectedRowsCard>}
@@ -254,20 +348,68 @@ class SelectTable extends React.PureComponent<SelectTableProps, SelectTableStat>
             //     // onOk={this.handleOk}
             // >
             <div className="actTable"
-                // style={{width: 1100,maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)',overflow:'auto'}}
+            // style={{width: 1100,maxWidth: 'calc(100vw - 60px)', maxHeight: 'calc(100vh - 50px)',overflow:'auto'}}
             >
-                <CriteriaForm key={"CriteriaForm"+sourceId}  serverKey={serverKey} selectedRows={selectedRows} selectedDatas={selectedDatas} ltmplConfig={selectConfig}
-                              data={criteriaData}
-                              doSearch={this.doSearch} loading={loading}/>
-                <QueryTable key={"QueryTable"+sourceId} serverKey={serverKey} maxSelectedRows={maxSelectedRows?maxSelectedRows:selectConfig.maxSelectedRows}
-                            selectedRows={selectedRows}
-                            primaryColumn={selectConfig.primaryColumn}
-                            columns={columns}
-                            pageInfo={{pageNo,
-                                pageSize: pageSize?pageSize:selectConfig.defaultPageSize}}
-                            onChangePage={this.onChangePage}
-                            queryKey={queryKey}
-                            onChangeRowSelection={this.changeRowSelection}/>
+                <div style={{ position: 'relative' }}>
+                    <CriteriaForm
+                        key={"CriteriaForm" + sourceId}
+                        serverKey={serverKey}
+                        selectedRows={selectedRows}
+                        selectedDatas={selectedDatas}
+                        ltmplConfig={{ ...selectConfig, customButtons: actions?.includes("add") ? [...(selectConfig.customButtons || []), { id: "add", buttonType: 'primary', title: '添加', defDisabled: false, onClick: () => { this.editItem() } }] : selectConfig.customButtons }}
+                        data={criteriaData}
+                        doSearch={this.doSearch} loading={loading}
+                        doCustomButton={() => this.editItem()}
+                    />
+                </div>
+                <QueryTable key={"QueryTable" + sourceId} serverKey={serverKey} maxSelectedRows={maxSelectedRows ? maxSelectedRows : selectConfig.maxSelectedRows}
+                    selectedRows={selectedRows}
+                    primaryColumn={selectConfig.primaryColumn}
+                    columns={columns}
+                    pageInfo={{
+                        pageNo,
+                        pageSize: pageSize ? pageSize : selectConfig.defaultPageSize
+                    }}
+                    onChangePage={this.onChangePage}
+                    queryKey={queryKey}
+                    onChangeRowSelection={this.changeRowSelection}
+                    sortColumnData={[]}
+                    doSearch={this.doSearch}
+                />
+                {showView && drawCode ? (
+                    <DtmplViewDrawer
+                        serverKey={serverKey}
+                        placement={"left"}
+                        onClose={this.doClose}
+                        open={showView}
+                        sourceId={sourceId}
+                        code={drawCode}
+                    />
+                ) : null}
+                {showEdit && ltmplConfig ? (
+                    ltmplConfig.customEditPagePath ? (
+                        <DtmplCustomEditModalPage
+                            open={showEdit}
+                            onOk={this.drawSubmited}
+                            customPath={ltmplConfig.customEditPagePath}
+                            sourceId={sourceId}
+                            mainCode={mainCode}
+                            code={drawCode}
+                        />
+                    ) : (
+                        <DtmplEditPage
+                            defaultDtmplData={fieldConfig.defaultDtmplData}
+                            serverKey={serverKey}
+                            pageType={"modal"}
+                            open={showEdit}
+                            onCancel={this.doClose}
+                            mainCode={mainCode}
+                            sourceId={sourceId}
+                            code={drawCode}
+                            onOk={this.drawSubmited}
+                        />
+                    )
+                ) : null}
             </div>
             // </Card>
         );

package/src/aldehyde/tmpl/control-type-supportor.tsx

@@ -74,6 +74,8 @@ SupportInputTypes.add('table-entity-select');
 SupportInputTypes.add('modal-entity-select');
 SupportInputTypes.add('color');
 SupportInputTypes.add('url');
+SupportInputTypes.add('pc-icon-selector');
+SupportInputTypes.add('app-icon-selector');
 SupportInputTypes.add('hidden');
 SupportInputTypes.add('lab-tree-select');
 SupportInputTypes.add('tree-entity-select-value');

package/src/aldehyde/tmpl/interface.tsx

@@ -149,6 +149,7 @@ export interface CustomButton extends ButtonConfig {
   windowHeight: string;
   windowWidth: string;
   preposes: FieldConfig[];
+  defDisabled?: boolean;
 }
 
 export interface FileExportButton extends ButtonConfig {
@@ -329,7 +330,7 @@ export interface FieldGroupConfig extends OrderableTmplBase {
   viewModel?: "table" | "verticalList";
   addOrEditType?: "singleCol" | "doubleCol" | "tableRow";
   batchAddFileField?: FieldConfig;
-  addRowPosition?:"begin"|"end";
+  addRowPosition?: "begin" | "end";
 }
 
 export type SaveJumpType = "list" | "add" | "edit";
@@ -411,7 +412,7 @@ export interface FieldConfig extends FieldBase {
   sortable?: boolean;
   itemBreakLine?: boolean;
   configChanged?: boolean;
-  rowEditType?:"editable"|"readonly"|"editonly"|"addonly";
+  rowEditType?: "editable" | "readonly" | "editonly" | "addonly";
 }
 
 export interface ActionRenderProps {