xlyErp / xlyUmi

Commit 0582a5b6f5c8787fd91e3df61aa6597f1bc1ad93

Authored by zhangzzzz
1 parent 567f68cd

优化指令集可视化功能；

Inline Side-by-side
Showing 2 changed files with 46 additions and 13 deletions
src/components/Common/CommonComponent/index.js
  View file @0582a5b
... ... @@ -3352,6 +3352,7 @@ export default class CommonComponent extends Component {
3352 3352 ...this.props,
3353 3353 ...this.state,
3354 3354 instructSetSettingVisible: true,
  3355 + instructSetSettingId: commonUtils.createSid(),
3355 3356 onSaveData: (value) => {
3356 3357 this.handleSelectOptionEvent(value);
3357 3358 this.setState({ instructSetSettingProps: {} });
... ...
src/components/Common/InstructSetSetting/index.js
  View file @0582a5b
... ... @@ -3,23 +3,33 @@ import AntDraggableModal from "../AntdDraggableModal";
3 3 import * as commonUtils from "@/utils/utils";
4 4 import styles from "./index.less";
5 5 import { Input, Button, Space } from "antd-v4";
  6 +import { MinusOutlined, CloseOutlined } from "@ant-design/icons";
6 7  
7 8 const IFRAMEURL = "http://project.xlyprint.cn";
  9 +// const IFRAMEURL = "http://localhost:9099";
8 10  
9 11 const InstructSetSetting = (props = {}) => {
10 12 const { instructSetSettingVisible } = props;
11 13 if (!instructSetSettingVisible) return "";
12 14  
13   - const { onCancelInstructSetSettingModal, showConfig, dataValue } = props;
  15 + const { onCancelInstructSetSettingModal, showConfig, dataValue, instructSetSettingId } = props;
14 16 const { showName, sName } = showConfig;
15 17  
16 18 const instructSet = commonUtils.convertStrToObj(dataValue, {});
17 19 const { bConfigured } = instructSet;
18 20  
19 21 const [value, setValue] = useState(dataValue);
20   - const [mode, setMode] = useState(bConfigured ? "config" : "edit");
  22 + const [mode, setMode] = useState("edit");
21 23 const iframeRef = useRef(null);
22 24  
  25 + const [formatFlag, setFormatFlag] = useState(0);
  26 + useEffect(() => {
  27 + try {
  28 + const newValue = JSON.stringify(JSON.parse(value.replace(/[\r\n]/g, "")), null, 2);
  29 + setValue(newValue);
  30 + } catch (e) {}
  31 + }, [formatFlag]);
  32 +
23 33 const onReceiveData = event => {
24 34 // 验证来源
25 35 if (event.origin !== IFRAMEURL) {
... ... @@ -29,11 +39,11 @@ const InstructSetSetting = (props = {}) => {
29 39 const { command, data } = event.data;
30 40  
31 41 if (command === "initData") {
32   - if (!bConfigured) return;
  42 + if (!bConfigured && props.name !== "master") return;
33 43 iframeRef.current.contentWindow.postMessage(
34 44 {
35 45 command: "initData",
36   - value: instructSet.data || [],
  46 + value: instructSet.change || instructSet.blur || (instructSet ? [instructSet] : []),
37 47 },
38 48 IFRAMEURL
39 49 );
... ... @@ -43,19 +53,17 @@ const InstructSetSetting = (props = {}) => {
43 53 let newValue = data;
44 54 if (props.name === "master" && sName === "sInstruct") {
45 55 newValue = {
46   - opr: "btnhandle",
  56 + ...(newValue[0] || {}),
47 57 bConfigured: true,
48   - data: newValue,
49 58 };
50 59 } else if (sName === "sOnChangeInstruct") {
51 60 newValue = {
52   - opr: "onchange",
  61 + change: newValue,
53 62 bConfigured: true,
54   - data: newValue,
55 63 };
56 64 }
57   -
58   - props.onSaveData(JSON.stringify(newValue))
  65 +
  66 + props.onSaveData(JSON.stringify(newValue));
59 67 // setMode("edit");
60 68 // setValue(JSON.stringify(newValue));
61 69 };
... ... @@ -68,22 +76,46 @@ const InstructSetSetting = (props = {}) => {
68 76 };
69 77 }, []);
70 78  
  79 + const [visible, setVisible] = useState(true);
  80 + useEffect(() => {
  81 + setVisible(true);
  82 + }, [instructSetSettingId]);
  83 +
71 84 return (
72 85 <AntDraggableModal
73 86 title={showName}
74   - visible={instructSetSettingVisible}
  87 + visible={instructSetSettingVisible && visible}
75 88 onCancel={onCancelInstructSetSettingModal}
76 89 width="100w"
77 90 height="100vh"
78 91 style={{ top: 0 }}
79 92 footer={null}
  93 + closeIcon={
  94 + <Space>
  95 + <MinusOutlined
  96 + onClick={e => {
  97 + e.stopPropagation();
  98 + setVisible(false);
  99 + }}
  100 + />
  101 + <CloseOutlined />
  102 + </Space>
  103 + }
80 104 >
81 105 <div className={styles.contents}>
82 106 {mode === "edit" ? (
83 107 <>
84   - <Input.TextArea rows={10} value={value} onChange={e => setValue(e.target.value)} />
  108 + <Input.TextArea style={{ height: "calc(100% - 40px)", fontSize: 14 }} value={value} onChange={e => setValue(e.target.value)} />
85 109 <Space style={{ marginTop: 6, float: "right" }}>
86   - <Button type="primary" onClick={() => props.onSaveData(value)}>
  110 + <Button
  111 + type="primary"
  112 + onClick={() => {
  113 + setFormatFlag(pre => pre + 1);
  114 + }}
  115 + >
  116 + 格式化
  117 + </Button>
  118 + <Button type="primary" onClick={() => props.onSaveData(JSON.stringify(JSON.parse(value.replace(/[\r\n]/g, ""))))}>
87 119 保存
88 120 </Button>
89 121 <Button type="primary" onClick={() => setMode("config")}>
... ...