aldehyde 0.2.517 → 0.2.519

package/src/aldehyde/detail/view/audit-data-popover.tsx

@@ -0,0 +1,70 @@
+import React, { useMemo } from "react";
+import { Button, Popover, Table } from "antd";
+import { OneToOneOutlined } from "@ant-design/icons";
+import { AuditData, DtmplConfig } from "../../tmpl/interface";
+import ViewControl from "../../controls/view-control";
+
+interface Props {
+    translate: Function;
+    auditData: AuditData;
+    serverKey: string;
+    dtmplConfig?: DtmplConfig;
+}
+
+const Index = (props: Props) => {
+    const { translate, auditData, dtmplConfig, serverKey } = props;
+
+    const columns = [
+        {
+            title: translate("${变更数据}"),
+            dataIndex: 'fieldTitle',
+        },
+        {
+            title: translate("${当前数据}"),
+            dataIndex: 'entityVal',
+            render: (text, record) => {
+                return <ViewControl
+                    serverKey={serverKey}
+                    holderType={"table"}
+                    fieldConfig={record.field}
+                    value={record.entityVal}
+                />;
+            }
+        },
+        {
+            title: translate("${变更前}"),
+            dataIndex: 'previousVal',
+            render: (text, record) => {
+                return <ViewControl
+                    serverKey={serverKey}
+                    holderType={"table"}
+                    fieldConfig={record.field}
+                    value={record.previousVal}
+                />;
+            }
+        },
+    ];
+
+    const dataSource = useMemo(() => {
+        if (!auditData) return [];
+        const { changeInfo, entity, previous } = auditData;
+        const fields = dtmplConfig?.groups?.[0]?.fields || [];
+        const temData = changeInfo?.changeFields?.map(item => {
+            const field = fields?.find(r => r.id === item);
+            const entityVal = entity?.fieldMap?.[item];
+            const previousVal = previous?.fieldMap?.[item];
+            return { fieldTitle: translate("${" + field?.title + "}"), entityVal, previousVal, field };
+        });
+        return temData;
+    }, [auditData])
+
+    const content = <Table columns={columns} dataSource={dataSource} pagination={false} />;
+
+    return <Popover content={content} trigger="click">
+        <Button className="hoverbig" title={translate("${数据对比}")}>
+            <OneToOneOutlined />
+        </Button>
+    </Popover>;
+};
+
+export default Index;

package/src/aldehyde/detail/view/dtmpl-view.tsx

@@ -3,7 +3,7 @@ import {
   DtmplBaseProps,
   DtmplConfig,
   DtmplData,
-  FieldGroupConfig,
+  FieldGroupConfig, AuditData
 } from "../../tmpl/interface";
 import RelationTable from "../../table/relation-table";
 import FieldViewGroup from "./field-view-group";
@@ -16,6 +16,7 @@ import TmplConfigAnalysis from "../../tmpl/tmpl-config-analysis";
 import { Card, Tabs } from "antd";
 import LtmplTable from "../../module/ltmpl-table";
 import DtmplViewCard from "../../module/dtmpl-view-card";
+import { ProgramConfig } from "../../index";
 
 export interface DtmplViewProps extends DtmplBaseProps {
   versionId?: number;
@@ -23,6 +24,8 @@ export interface DtmplViewProps extends DtmplBaseProps {
   refreshCode?: string;
   parentId?: string;
   tabBarExtraContent?: ReactNode;
+  isAudit?: boolean; // 是否审计
+  getAuditData?: (val: AuditData) => void; // 获取审计变更数据
 }
 
 export interface DtmplViewStat {
@@ -31,12 +34,14 @@ export interface DtmplViewStat {
   dtmplData?: DtmplData;
   premisesTitle?: string;
   layout?: object;
+  auditData?: AuditData;
 }
 
 class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
   static defaultProps = {
     showRightNav: true,
     maxColsOnRow: 2,
+    isAudit: false,
   };
 
   state = {
@@ -44,6 +49,7 @@ class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
     id: "dtmplView" + Units.getRandomNum(6),
     snapshotOpen: false,
     dtmplData: undefined,
+    auditData: undefined,
     premisesTitle: "默认字段",
     layout: {
       labelCol: { span: 8 },
@@ -72,36 +78,24 @@ class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
   }
 
   loadData = async () => {
-    const {
-      sourceId,
-      code: propsCode,
-      versionId,
-      serverKey,
-      codeSource,
-    } = this.props;
+    const { sourceId, code: propsCode, versionId, serverKey, codeSource, isAudit, getAuditData } = this.props;
     let code = propsCode;
     if (!code && codeSource) {
       code = await HcserviceV3.queryCode(sourceId, codeSource, serverKey);
     }
     if (code) {
-      this.setState({
-        loading: true,
-        dtmplData: undefined,
-      });
-      const dtmplData = await HcserviceV3.requestViewDtmplData(
-        serverKey,
-        sourceId,
-        code,
-        versionId
-      );
-      this.setState({
-        dtmplData,
-        loading: false,
-      });
+      this.setState({ loading: true, dtmplData: undefined });
+      let dtmplData, auditData;
+      if (isAudit) { // 审计查看页面
+        auditData = await HcserviceV3.requestViewDtmplAuditData(serverKey, sourceId, code, versionId);
+        dtmplData = { ...(auditData?.entity || {}), sourceId: auditData?.sourceId };
+        getAuditData(auditData);
+      } else { // 普通查看页面
+        dtmplData = await HcserviceV3.requestViewDtmplData(serverKey, sourceId, code, versionId);
+      }
+      this.setState({ dtmplData, auditData, loading: false });
     } else {
-      this.setState({
-        loading: false,
-      });
+      this.setState({ loading: false });
     }
   };
 
@@ -111,9 +105,9 @@ class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
       serverKey,
       mainCode,
       showRightNav,
-      parentId, maxColsOnRow, code
+      parentId, maxColsOnRow, code, isAudit
     } = this.props;
-    const { dtmplData, loading, id } = this.state;
+    const { dtmplData, loading, id, auditData } = this.state;
     const { pageLayout } = dtmplConfig;
     let groups: FieldGroupConfig[] = [];
     if (dtmplConfig) {
@@ -224,6 +218,7 @@ class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
             value={data}
             viewOrEdit={"view"}
             showCollapseCard={pageLayout !== "horizontalTabs"}
+            audit={{ isAudit, previousData: ProgramConfig.arrayToMap(auditData?.previous?.arrayMap?.[item.id], "code"), changeInfo: auditData?.changeInfo?.arrayChangeInfos?.[item.id] }}
           />;
           return pageLayout === "horizontalTabs" ? { key: item.id, label: item.title, children } : children;
         }
@@ -234,6 +229,7 @@ class DtmplView extends React.PureComponent<DtmplViewProps, DtmplViewStat> {
           fields={item.fields}
           valueMap={dtmplData ? dtmplData.fieldMap : undefined}
           width={220}
+          audit={{ isAudit, auditMap: auditData?.previous?.fieldMap || undefined, changeFields: auditData?.changeInfo?.changeFields }}
         />;
         return (
           pageLayout === "horizontalTabs" ?

package/src/aldehyde/detail/view/field-view-group.tsx

@@ -1,5 +1,5 @@
-import React from "react";
-import { Descriptions } from "antd";
+import React, { ReactNode } from "react";
+import { Descriptions, Tooltip } from "antd";
 import { FieldConfig } from "../../tmpl/interface";
 import ViewControl from "../../controls/view-control";
 import { LocaleContext } from "../../locale/LocaleProvider";
@@ -12,6 +12,7 @@ interface FieldViewGroupProps {
   width?: number;
   dataCode?: string;
   column?: number;
+  audit?: { isAudit: boolean, auditMap?: object, changeFields?: string[] }; // 是否审计查看，审计查看配置
 }
 
 interface FieldViewGroupState {
@@ -30,41 +31,37 @@ export default class FieldViewGroup extends React.PureComponent<
   }
   static defaultProps = {
     column: 2,
+    audit: { isAudit: false }
   };
   static contextType = LocaleContext;
   context: React.ContextType<typeof LocaleContext>;
 
   initViewList = () => {
-    const { fields, valueMap, serverKey, dataCode } = this.props;
+    const { fields, valueMap, serverKey, dataCode, audit } = this.props;
     const { translate } = this.context;
     const formItemList = [];
 
     if (fields.length > 0) {
       fields.forEach((item, index) => {
-        const title = item.title;
         let fieldValue = valueMap ? valueMap[item.id] : undefined;
         //fieldValue 没有值时不能为null 要为 undefined。antd input所限制
-        fieldValue = fieldValue
-          ? fieldValue
-          : item.defaultValue
-            ? item.defaultValue
-            : undefined;
-        const fieldKey = item.id + Math.random() * 100;
-
-        if (item.extControlType != "hidden" && !item.hidden) {
+        fieldValue = fieldValue ? fieldValue : item.defaultValue ? item.defaultValue : undefined;
+        let label: ReactNode = translate("${" + item.title + "}");
+        if (audit?.isAudit && audit.changeFields?.includes(item.id)) { // 审计查看页面-上次更新内容在label标注
+          const tValue = audit.auditMap ? audit.auditMap[item.id] : undefined;
+          const tTitle = <ViewControl dataCode={dataCode} serverKey={serverKey} holderType={"descriptions"} value={tValue} fieldConfig={item} />
+          label = <span style={{ cursor: "pointer", color: "#ff4d4f" }}>{label}</span>;
+          label = (tValue || tValue === 0) ? <Tooltip title={tTitle}>{label}</Tooltip> : label;
+        }
+        if (item.extControlType !== "hidden" && !item.hidden) {
           const formItem = (
             <Descriptions.Item
-              label={translate("${" + item.title + "}")}
+              label={label}
               span={item.colSpan}
               key={index}
               className="labelcss"
             >
-              <div
-                className="description-content"
-                style={{
-                  width: "100%",
-                }}
-              >
+              <div className="description-content" style={{ width: "100%" }}>
                 <ViewControl
                   dataCode={dataCode}
                   serverKey={serverKey}

package/src/aldehyde/form/dtmpl-form.tsx

@@ -4,7 +4,7 @@ import {
   Card,
   Form as AntdForm,
   message,
-  Switch,
+  Switch, Collapse
 } from "antd";
 import {
   DtmplConfig,
@@ -27,6 +27,9 @@ import LtmplTable from "../module/ltmpl-table";
 import TmplConfigAnalysis from "../tmpl/tmpl-config-analysis";
 import DtmplViewCard from "../module/dtmpl-view-card";
 import { LocaleContext } from "../locale/LocaleProvider";
+import AuditDataPopover from "../detail/view/audit-data-popover";
+
+interface AuditData { entity: DtmplData, previous?: DtmplData, changeInfo?: { changeFields: string[], arrayChangeInfos: object } }; // 审计对比数据
 
 interface DtmplFormStat {
   loading?: boolean;
@@ -35,6 +38,7 @@ interface DtmplFormStat {
   embedForm?: object;
   embedRefValue?: object;
   editingGroups?: string[];
+  auditData?: AuditData;
 }
 
 export default class DtmplForm extends React.PureComponent<
@@ -49,6 +53,7 @@ export default class DtmplForm extends React.PureComponent<
   state = {
     loading: true,
     currentDtmplData: undefined,
+    auditData: undefined,
     appDtmplConfig: undefined,
     embedForm: {},
     embedRefValue: {},
@@ -58,6 +63,7 @@ export default class DtmplForm extends React.PureComponent<
     maxCols: 2,
     showHeader: true,
     showRightNav: false,
+    isAudit: false,
   };
 
   async componentDidMount() {
@@ -73,51 +79,31 @@ export default class DtmplForm extends React.PureComponent<
   }
 
   loadData = async () => {
-    const {
-      sourceId,
-      code,
-      formRef,
-      dtmplData,
-      dtmplConfig,
-      serverKey,
-    } = this.props;
-    let dtmplData_;
-    if (code) {
-      this.setState({
-        loading: true,
-      });
-      dtmplData_ = await HcserviceV3.requestDtmplData(
-        serverKey,
-        sourceId,
-        code,
-        null
-      );
-    } else if (dtmplData) {
-      dtmplData_ = dtmplData;
+    const { sourceId, code, formRef, dtmplData, serverKey, isAudit } = this.props;
+    let dtmplData_, auditData_;
+    if (isAudit && code) { // 审计编辑页面
+      auditData_ = await HcserviceV3.requestViewDtmplAuditData(serverKey, sourceId, code, null);
+      dtmplData_ = { ...(auditData_?.entity || {}), sourceId: auditData_?.sourceId };
     } else {
-      dtmplData_ = {
-        code: undefined,
-        title: undefined,
-        fieldMap: {},
-        arrayMap: {},
-      };
+      if (dtmplData) {
+        dtmplData_ = dtmplData;
+      } else if (code) {
+        this.setState({ loading: true });
+        dtmplData_ = await HcserviceV3.requestDtmplData(serverKey, sourceId, code, null);
+      } else {
+        dtmplData_ = { code: undefined, title: undefined, fieldMap: {}, arrayMap: {} };
+      }
     }
     //应用静态配置
-    let appDtmplConfig = ProgramConfig.getAppDtmplConfig(
-      dtmplConfig,
-      dtmplData,
-      this.props
-    );
+    let appDtmplConfig = ProgramConfig.getAppDtmplConfig(this.props.dtmplConfig, dtmplData, this.props);
     this.setState({
       appDtmplConfig,
       currentDtmplData: dtmplData_,
+      auditData: auditData_,
       loading: false,
       embedRefValue: {},
     });
-    setTimeout(
-      () => (formRef.current ? formRef.current.resetFields() : undefined),
-      200
-    );
+    setTimeout(() => (formRef.current ? formRef.current.resetFields() : undefined), 200);
   };
 
   doRefresh = async () => {
@@ -271,16 +257,8 @@ export default class DtmplForm extends React.PureComponent<
     }
   };
 
-  fieldGroupList = (dtmplConfig: DtmplConfig, dtmplData: DtmplData) => {
-    const {
-      parentId,
-      maxColsOnRow,
-      mainCode,
-      formRef,
-      serverKey,
-      showRightNav,
-      valueFieldMap
-    } = this.props;
+  fieldGroupList = (dtmplConfig: DtmplConfig, dtmplData: DtmplData, auditData: AuditData) => {
+    const { parentId, maxColsOnRow, mainCode, formRef, serverKey, showRightNav, valueFieldMap, isAudit } = this.props;
     const { loading, embedForm } = this.state;
     let groups: FieldGroupConfig[] = [];
     if (dtmplConfig) {
@@ -383,8 +361,16 @@ export default class DtmplForm extends React.PureComponent<
           if (dtmplData) {
             data = dtmplData.arrayMap[item.id];
           }
-          debugger
-          return (
+          return <CollapseCard
+            showRightNav={showRightNav}
+            initCollapse={item.displayConfig.includes("folded")}
+            title={item.title}
+            tip={item.tip}
+            id={parentId + item.id}
+            className="hoverable"
+            styles={{ header: { background: "#f2f4f5" }, body: { padding: "6px" } }}
+            loading={loading}
+          >
             <RelationTable
               showRightNav={showRightNav}
               serverKey={serverKey}
@@ -396,12 +382,30 @@ export default class DtmplForm extends React.PureComponent<
               value={data}
               parentFormInstance={formRef?.current}
               viewOrEdit={item.readOnly ? "view" : "edit"}
-              onEditing={(editing) => {
-                this.onGroupEditing(item.id, editing);
-              }}
+              onEditing={(editing) => this.onGroupEditing(item.id, editing)}
               onChange={this.onGroupChange}
+              showCollapseCard={false}
             />
-          );
+            {(isAudit && auditData?.changeInfo?.arrayChangeInfos?.[item.id]?.length) ?
+              <Collapse ghost size="small"
+                styles={{ header: { padding: "6px 0", color: "red" } }}
+                items={[{
+                  key: "audit", label: "变更数据",
+                  children: <RelationTable
+                    serverKey={serverKey}
+                    initCollapse={dtmplData && (!data || data.length <= 0)}
+                    loading={loading}
+                    parentId={parentId}
+                    key={item.id}
+                    fieldGroupConfig={item}
+                    value={data}
+                    viewOrEdit={"view"}
+                    showCollapseCard={false}
+                    audit={{ isAudit, previousData: ProgramConfig.arrayToMap(auditData?.previous?.arrayMap?.[item.id], "code"), changeInfo: auditData?.changeInfo?.arrayChangeInfos?.[item.id] }}
+                  />
+                }]} />
+              : ""}
+          </CollapseCard>;
         }
       } else {
         //字段组
@@ -431,6 +435,7 @@ export default class DtmplForm extends React.PureComponent<
                 valueMap={dtmplData ? dtmplData.fieldMap : undefined}
                 valueFieldMap={valueFieldMap}
                 editStatus={dtmplData?.code ? "changed" : "new"} // 新增或修改状态
+                audit={{ dataCode: dtmplData ? dtmplData.code : null, isAudit, auditMap: auditData?.previous?.fieldMap || undefined, changeFields: auditData?.changeInfo?.changeFields }}
               />}
           </CollapseCard>
         );
@@ -489,9 +494,9 @@ export default class DtmplForm extends React.PureComponent<
       code,
       parentId,
       showHeader,
-      serverKey, dtmplData,
+      serverKey, dtmplData, isAudit
     } = this.props;
-    const { currentDtmplData, appDtmplConfig } = this.state;
+    const { currentDtmplData, appDtmplConfig, auditData } = this.state;
     const { translate } = this.context;
     if (!dtmplConfig || !dtmplData) {
       return <Card loading={true}>{translate("${加载中}")}... ...</Card>;
@@ -514,6 +519,7 @@ export default class DtmplForm extends React.PureComponent<
                 : translate("[${新增}]")}
               {dtmplConfig ? <ToolTipBar content={dtmplConfig.tip} /> : null}
               <div className="fr">
+                {isAudit ? <AuditDataPopover translate={translate} auditData={auditData} dtmplConfig={dtmplConfig} serverKey={serverKey} /> : ""}
                 {buttons && buttons.includes("fusionMode") ? (
                   <Switch
                     checkedChildren={translate("${开}")}
@@ -549,7 +555,7 @@ export default class DtmplForm extends React.PureComponent<
           <AntdForm.Item hidden={true} name={"actionId"}></AntdForm.Item>
           <AntdForm.Item hidden={true} name={"mainCode"}></AntdForm.Item>
           {this.addHiddenItem(dtmplConfig.hiddenFields)}
-          {this.fieldGroupList(appDtmplConfig, currentDtmplData)}
+          {this.fieldGroupList(appDtmplConfig, currentDtmplData, auditData)}
         </AntdForm>
         {premises && premises.length > 0 ? (
           <CollapseCard

package/src/aldehyde/form/form-Item-group.tsx

@@ -1,7 +1,8 @@
-import React, { RefObject, useState, useMemo } from "react";
-import { Col, Form, Row, Popconfirm } from "antd";
+import React, { RefObject, useState, useMemo, ReactNode } from "react";
+import { Col, Form, Row, Popconfirm, Tooltip } from "antd";
 import { FieldConfig, EditStatus } from "../tmpl/interface";
 import EntryControl from "../controls/entry-control";
+import ViewControl from "../controls/view-control";
 import Units from "../units";
 import { FormInstance } from "antd/lib/form/hooks/useForm";
 import { LocaleContext } from "../locale/LocaleProvider";
@@ -66,7 +67,8 @@ export interface FieldGroupProps {
   dataCode?: string,
   layout?: "horizontal" | "vertical";
   valueFieldMap?: { [key: string]: any }; // 表单关联项配置
-  editStatus?: EditStatus
+  editStatus?: EditStatus;
+  audit?: { dataCode: string; isAudit: boolean, auditMap?: object, changeFields?: string[] }; // 是否审计编辑，审计编辑配置
 }
 
 interface FieldGroupState {
@@ -80,6 +82,7 @@ export default class FormItemGroup extends React.PureComponent<
   static defaultProps = {
     nameAttr: "id",
     maxColsOnRow: 2,
+    audit: { isAudit: false }
   };
   static contextType = LocaleContext;
   context: React.ContextType<typeof LocaleContext>;
@@ -125,7 +128,7 @@ export default class FormItemGroup extends React.PureComponent<
     return fieldConfig;
   };
   initFormItem = (fieldConfig: FieldConfig, fieldValue) => {
-    const { nameAttr, maxColsOnRow, layout } = this.props;
+    const { nameAttr, maxColsOnRow, layout, serverKey, audit } = this.props;
     const { translate } = this.context;
     let item = this.getFieldConfig(fieldConfig);
 
@@ -139,9 +142,17 @@ export default class FormItemGroup extends React.PureComponent<
       wrapperColSpan = maxColsOnRow == 1 ? 18 : item.colSpan == 1 ? 15 : 19;
     }
 
+    let label: ReactNode = translate("${" + item.title + "}");
+    if (audit?.isAudit && audit.changeFields?.includes(item.id)) { // 审计查看页面-上次更新内容在label标注
+      const tValue = audit.auditMap ? audit.auditMap[item.id] : undefined;
+      const tTitle = <ViewControl dataCode={audit.dataCode} serverKey={serverKey} holderType={"descriptions"} value={tValue} fieldConfig={item} />
+      label = <span style={{ cursor: "pointer", color: "#ff4d4f" }}>{label}</span>;
+      label = (tValue || tValue === 0) ? <Tooltip title={tTitle}>{label}</Tooltip> : label;
+    }
+
     return (
       <FormItem
-        label={translate("${" + item.title + "}")}
+        label={label}
         noStyle={item.noStyle || false}
         hidden={item.hidden}
         name={fieldConfig.controlType == "field-history" ? undefined : item[nameAttr]}

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

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useLocale } from "../../locale/useLocale";
-import { Card, Row, Col, Empty } from "antd";
+import { Card, Row, Col, Empty, Space } from "antd";
 import ViewControl from "../../controls/view-control";
 import { CardListConfig } from "../../tmpl/interface";
 import CustomDetailModalPage from "../../custom-page/custom-detail-modal-page";
@@ -14,7 +14,7 @@ type Props = {
     sourceId?: string;
 };
 
-const dataKeys = ["primaryColumn", "primaryColumnLabel", "secondColumn", "secondColumnLabel", "cardShowCols", "labelColumn", "mainPicture", "mainPictureLabel"];
+const dataKeys = ["primaryColumn", "primaryColumnLabel", "secondColumn", "secondColumnLabel", "cardShowCols", "labelColumn", "mainPicture", "mainPictureLabel", "secondaryPicture"];
 
 const Index = (props: Props) => {
     const { cardListConfig, item, renderOpt, serverKey, sourceId } = props;
@@ -40,7 +40,7 @@ const Index = (props: Props) => {
         const value = item[itemConfig.id];
         const element = <ViewControl serverKey={serverKey} holderType="table" value={value} fieldConfig={type === "mainPicture" ? { ...itemConfig, isFallback: true, preview: false, defShowIcon: false } : itemConfig} />;
         const title = itemConfig.title;
-        return { element, value, title };
+        return { element, value, title, itemConfig };
     }
 
     useEffect(() => {
@@ -60,6 +60,28 @@ const Index = (props: Props) => {
         setDetailOpen(true);
     }
 
+    const renderPictures = () => {
+        const secondaryPictureConfig = cardListConfig["secondaryPicture"];
+        if (secondaryPictureConfig) { // 存在次图片字段，显示图片列表
+            let tElement;
+            const dMainPicture = data["mainPicture"];
+            const dSPicture = data["secondaryPicture"];
+            if (["relfile", "relimage"].includes(secondaryPictureConfig.controlType)) {
+                const dSValue = JSON.parse(dSPicture?.value || "[]");
+                const tValue = dMainPicture?.value ? [dMainPicture?.value, ...dSValue] : dSValue;
+                tElement = dSPicture ? <ViewControl serverKey={serverKey} holderType="table" value={tValue} fieldConfig={dSPicture?.itemConfig} /> : dMainPicture?.element;
+            } else {
+                tElement = <Space wrap>{dMainPicture?.element}{dSPicture?.element}</Space>
+            }
+            return <div style={{ padding: "6px" }}>{tElement}</div>;
+        } else { // 普通主图
+            return data["mainPicture"] ? <div className="card-main-picture">
+                {data["mainPicture"].value ? data["mainPicture"].element : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={translate("${暂无图片}")} />}
+                <div className="card-main-picture-label">{data["mainPictureLabel"].element}</div>
+            </div> : "";
+        }
+    }
+
     return (
         <Card className="card-list-item" styles={{ body: { height: "100%", padding: "0 12px 12px" } }} >
             <div className="card-list-item-body">
@@ -84,10 +106,7 @@ const Index = (props: Props) => {
                         </div>
                     </div>
                     <div className="card-list-item-main" onClick={onClickDetail}>
-                        {data["mainPicture"] ? <div className="card-main-picture">
-                            {data["mainPicture"].value ? data["mainPicture"].element : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description={translate("${暂无图片}")} />}
-                            <div className="card-main-picture-label">{data["mainPictureLabel"].element}</div>
-                        </div> : ""}
+                        {renderPictures()}
                         {data["cardShowCols"] ?
                             <div className="card-show-cols">
                                 <Row gutter={6}>

package/src/aldehyde/module/dtmpl-edit-page.tsx

@@ -41,6 +41,7 @@ interface ModalEditorProps extends DtmplBaseProps {
   title?: ReactNode;
   extendButtons?: ReactNode[];
   isCopy?: boolean;
+  isAudit?: boolean; // 是否审计编辑页
 }
 
 interface ModalEditorState {
@@ -488,11 +489,12 @@ export default class DtmplEditPage extends React.PureComponent<
       sourceId,
       open,
       mainCode,
+      code,
       width,
       pageType,
       maxColsOnRow,
       title,
-      serverKey, parentFormInstance
+      serverKey, parentFormInstance, isAudit
     } = this.props;
     const { dtmplConfig, id, dtmplData, valueFieldMap, drawerSize } = this.state;
     const placement = this.props.placement || "left";
@@ -535,6 +537,8 @@ export default class DtmplEditPage extends React.PureComponent<
                   onValuesChange={this.onValuesChange}
                   parentFormInstance={parentFormInstance}
                   valueFieldMap={valueFieldMap}
+                  isAudit={isAudit}
+                  code={code}
                 />
               </div>
             </Scrollbars>}
@@ -550,6 +554,7 @@ export default class DtmplEditPage extends React.PureComponent<
             size={drawerSize}
             maxSize={maxSize}
             closable={true}
+            destroyOnHidden={true}
             mask={false}
             onClose={onCancel}
             open={open}
@@ -572,6 +577,8 @@ export default class DtmplEditPage extends React.PureComponent<
                 onValuesChange={this.onValuesChange}
                 parentFormInstance={parentFormInstance}
                 valueFieldMap={valueFieldMap}
+                isAudit={isAudit}
+                code={code}
               />
             </div>
           </Drawer>
@@ -591,6 +598,8 @@ export default class DtmplEditPage extends React.PureComponent<
               onValuesChange={this.onValuesChange}
               parentFormInstance={parentFormInstance}
               valueFieldMap={valueFieldMap}
+              isAudit={isAudit}
+              code={code}
             />
           </Card>
         )}