aldehyde 0.2.97 → 0.2.99

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

@@ -1,138 +1,191 @@
-import React from 'react'
-import {Button, Card, Tooltip} from 'antd'
-import {DtmplBaseProps, DtmplConfig} from "../../tmpl/interface";
-import {ReloadOutlined, ScheduleOutlined,EditOutlined} from '@ant-design/icons';
+import React from "react";
+import { Button, Card, Tooltip } from "antd";
+import { DtmplBaseProps, DtmplConfig } from "../../tmpl/interface";
+import {
+  ReloadOutlined,
+  ScheduleOutlined,
+  EditOutlined,
+} from "@ant-design/icons";
 import HCDataSource from "../../tmpl/hc-data-source";
-import '../dtmpl.css';
+import "../dtmpl.css";
 import SnapshotTimeline from "./snapshot-timeline";
 import DtmplView from "./dtmpl-view";
-import Units from '../../units'
+import Units from "../../units";
 import ToolTipBar from "../tooltipbar";
+import { LocaleContext } from "../../locale/LocaleProvider";
 
 export interface ActDtmplViewProps extends DtmplBaseProps {
-    versionId?: number;
-    title?:any,
-    showHeader?:boolean
-};
+  versionId?: number;
+  title?: any;
+  showHeader?: boolean;
+}
 
 export interface ActDtmplViewStat {
-    loading?: boolean,
-    dtmplConfig?: DtmplConfig,
-    premisesTitle?: string,
-    snapshotOpen?: boolean,
-    layout?: object,
-    refreshCode?: string,
-};
-
-class ActDtmplView extends React.PureComponent<ActDtmplViewProps, ActDtmplViewStat> {
-    static defaultProps = {
-        showRightNav: true,
-        rightBarPositionRight: 15,
-        showHeader:true,
-    }
-
-    state = {
-        loading: true,
-        dtmplConfig: undefined,
-        snapshotOpen: false,
-        premisesTitle: "默认字段",
-        layout: {
-            labelCol: {span: 8},
-            wrapperCol: {span: 16},
-        },
-        refreshCode: undefined
-    }
-
-    async componentDidMount() {
-        const { sourceId,serverKey} = this.props;
-        let dtmplConfig = await HCDataSource.requestViewDtmplConfig(serverKey,sourceId);
-        this.setState({
-            dtmplConfig,
-        })
-    }
-
-    doRefresh = async () => {
-        this.setState({
-            refreshCode: Units.getRandomNum(6)
-        })
-    };
-
-    goEdit = () => {
-        const {goDtmpl,code}=this.props;
-        goDtmpl(code);
-    }
-
-    showSnapshot = () => {
-        this.setState({
-                snapshotOpen: true,
-            }
-        )
-    }
-
-    onSnapshotClose = () => {
-
-        this.setState({
-                snapshotOpen: false,
-            }
-        )
-
-    }
-
-
-    toSnapshot = () => {
+  loading?: boolean;
+  dtmplConfig?: DtmplConfig;
+  premisesTitle?: string;
+  snapshotOpen?: boolean;
+  layout?: object;
+  refreshCode?: string;
+}
 
+class ActDtmplView extends React.PureComponent<
+  ActDtmplViewProps,
+  ActDtmplViewStat
+> {
+  static defaultProps = {
+    showRightNav: true,
+    rightBarPositionRight: 15,
+    showHeader: true,
+  };
+  static contextType = LocaleContext;
+  context: React.ContextType<typeof LocaleContext>;
+
+  state = {
+    loading: true,
+    dtmplConfig: undefined,
+    snapshotOpen: false,
+    premisesTitle: "默认字段",
+    layout: {
+      labelCol: { span: 8 },
+      wrapperCol: { span: 16 },
+    },
+    refreshCode: undefined,
+  };
+
+  async componentDidMount() {
+    const { sourceId, serverKey } = this.props;
+    let dtmplConfig = await HCDataSource.requestViewDtmplConfig(
+      serverKey,
+      sourceId
+    );
+    this.setState({
+      dtmplConfig,
+    });
+  }
+
+  doRefresh = async () => {
+    this.setState({
+      refreshCode: Units.getRandomNum(6),
+    });
+  };
+
+  goEdit = () => {
+    const { goDtmpl, code } = this.props;
+    goDtmpl(code);
+  };
+
+  showSnapshot = () => {
+    this.setState({
+      snapshotOpen: true,
+    });
+  };
+
+  onSnapshotClose = () => {
+    this.setState({
+      snapshotOpen: false,
+    });
+  };
+
+  toSnapshot = () => {};
+
+  render() {
+    const {
+      showRightNav,
+      rightBarPositionRight,
+      code,
+      sourceId,
+      goDtmpl,
+      serverKey,
+      codeSource,
+      title,
+      showHeader,
+    } = this.props;
+    const {
+      dtmplConfig,
+      premisesTitle,
+      loading,
+      layout,
+      snapshotOpen,
+      refreshCode,
+    } = this.state;
+    const { translate } = this.context;
+
+    const buttons = dtmplConfig ? dtmplConfig.buttons : undefined;
+    const premises = dtmplConfig ? dtmplConfig.premises : undefined;
+    let showRightNav_ = showRightNav;
+    if (dtmplConfig && dtmplConfig.groups.length < 4) {
+      showRightNav_ = false;
     }
-
-    render() {
-        const {showRightNav, rightBarPositionRight, code,  sourceId,goDtmpl,serverKey,codeSource,title,showHeader} = this.props;
-        const {dtmplConfig, premisesTitle, loading, layout, snapshotOpen,refreshCode} = this.state;
-        const buttons = dtmplConfig ? dtmplConfig.buttons : undefined;
-        const premises = dtmplConfig ? dtmplConfig.premises : undefined;
-        let showRightNav_ = showRightNav;
-        if (dtmplConfig && dtmplConfig.groups.length < 4) {
-            showRightNav_ = false;
-        }
-        return (
-            <div className={`detailPage ${showRightNav_ ? 'showRightNav' : 'noRightNav'}`}>
-                { showHeader? <Card bordered={false} size={'small'}
-                      key={"detailTitle"}
-                      className="hoverable pageHeader"
+    return (
+      <div
+        className={`detailPage ${
+          showRightNav_ ? "showRightNav" : "noRightNav"
+        }`}
+      >
+        {showHeader ? (
+          <Card
+            bordered={false}
+            size={"small"}
+            key={"detailTitle"}
+            className="hoverable pageHeader"
+          >
+            <h3>
+              {title ? title : translate("${详情}")}
+              {dtmplConfig ? <ToolTipBar content={dtmplConfig.tip} /> : null}
+              <div className="fr">
+                {buttons &&
+                buttons.includes("dtmplEdit") &&
+                goDtmpl &&
+                !dtmplConfig.editAction ? (
+                  <Button className="hoverbig" onClick={this.goEdit}>
+                    <EditOutlined />
+                  </Button>
+                ) : (
+                  ""
+                )}
+                {buttons && buttons.includes("history") ? (
+                  <Tooltip title={translate("${数据快照}")}>
+                    <Button className="hoverbig" onClick={this.showSnapshot}>
+                      <ScheduleOutlined />
+                    </Button>
+                  </Tooltip>
+                ) : (
+                  ""
+                )}
+                <Button
+                  className="hoverbig"
+                  title={translate("${刷新}")}
+                  onClick={this.doRefresh}
                 >
-                    <h3>
-                        {title?title:'详情'}{dtmplConfig?<ToolTipBar content={dtmplConfig.tip} />:null}
-                        <div className="fr">
-                            {buttons && buttons.includes("dtmplEdit") && goDtmpl && !dtmplConfig.editAction ?
-                                    <Button
-                                        className="hoverbig"
-                                        onClick={this.goEdit}>
-                                        <EditOutlined/>
-                                    </Button> : ""}
-                            {buttons && buttons.includes("history") ?
-                                <Tooltip title="数据快照">
-                                    <Button
-                                        className="hoverbig"
-                                        onClick={this.showSnapshot}>
-                                        <ScheduleOutlined/>
-                                    </Button></Tooltip> : ""}
-                            <Button
-                                className="hoverbig"
-                                title="刷新"
-                                onClick={this.doRefresh}
-                            ><ReloadOutlined/></Button>
-                            <SnapshotTimeline serverKey={serverKey} dtmplConfig={dtmplConfig} code={code} onClose={this.onSnapshotClose}
-                                              showSnapshot={this.toSnapshot} sourceId={sourceId}
-                                              open={snapshotOpen}></SnapshotTimeline>
-                        </div>
-                    </h3>
-                </Card>:null}
-                <DtmplView codeSource={codeSource} serverKey={serverKey} refreshCode={refreshCode} showRightNav={showRightNav_} rightBarPositionRight={rightBarPositionRight}
-                           dtmplConfig={dtmplConfig} sourceId={sourceId}
-                           code={code}></DtmplView>
-            </div>
-        );
-    }
+                  <ReloadOutlined />
+                </Button>
+                <SnapshotTimeline
+                  serverKey={serverKey}
+                  dtmplConfig={dtmplConfig}
+                  code={code}
+                  onClose={this.onSnapshotClose}
+                  showSnapshot={this.toSnapshot}
+                  sourceId={sourceId}
+                  open={snapshotOpen}
+                ></SnapshotTimeline>
+              </div>
+            </h3>
+          </Card>
+        ) : null}
+        <DtmplView
+          codeSource={codeSource}
+          serverKey={serverKey}
+          refreshCode={refreshCode}
+          showRightNav={showRightNav_}
+          rightBarPositionRight={rightBarPositionRight}
+          dtmplConfig={dtmplConfig}
+          sourceId={sourceId}
+          code={code}
+        ></DtmplView>
+      </div>
+    );
+  }
 }
 
-
 export default ActDtmplView;
-