版本对比

src/service/datamodeler.js

@@ -158,7 +158,7 @@ export function getVersions(payload) {
 }
 
 export function compare(payload) {
-  return Post("/datamodeler/easyDataModelerCURD/compare", payload);
+  return PostJSON("/datamodeler/easyDataModelerCURD/compare", payload);
 }
 
 export function getDataModelByVersionId(payload) {

src/view/Manage/Model/Component/HistoryAndVersionDrawer.jsx

@@ -14,7 +14,7 @@ const HistoryAndVersionDrawer = (props) => {
       title=''
       placement="right"
       closable={true}
-      width={1000}
+      width={'90%'}
       onClose={() => {
         onCancel && onCancel();
       }}

src/view/Manage/Model/Component/VersionCompare.jsx

@@ -18,6 +18,7 @@ const VersionCompare = (props) => {
   const [ incVersion, setIncVersion ] = useState('');
   const [ incVersions, setIncVersions ] = useState([]);
   const [ loading, setLoading ] = useState(false);
+  const [ compareData, setCompareData ] = useState(null);
   const [ loadingCompare, setLoadingCompare ] = useState(false);
   const [ onlyShowChange, setOnlyShowChange ] = useState(false);
  
@@ -97,16 +98,33 @@ const VersionCompare = (props) => {
       callback: data => {
         setLoadingCompare(false);
 
-        var target = document.getElementById('model-version-compare-container');
-        var converter = new showdown.Converter({    
+        setCompareData(data);
+
+        if (data?.left) {
+          Object.keys(data?.left).forEach((key, index) => {
+            var target = document.getElementById(`model-version-compare-left${index+1}`);
+            var converter = new showdown.Converter({});
+
+            converter.setFlavor('github');
+
+            var html = converter.makeHtml((data?.left[key]||'').toString());
           
-        });
+            target.innerHTML = html;
+          })
+        }
 
-        converter.setFlavor('github');
+        if (data?.right) {
+          Object.keys(data?.right).forEach((key, index) => {
+            var target = document.getElementById(`model-version-compare-right${index+1}`);
+            var converter = new showdown.Converter({});
 
-        var html = converter.makeHtml(data||'');
-        
-        target.innerHTML = html;
+            converter.setFlavor('github');
+
+            var html = converter.makeHtml((data?.right[key]||'').toString());
+
+            target.innerHTML = html;
+          })
+        }
       },
       error: () => {
         setLoadingCompare(false);
@@ -167,7 +185,26 @@ const VersionCompare = (props) => {
 
       <div className='py-5'>    
         <Spin spinning={loadingCompare} >
-          <div id="model-version-compare-container"></div>
+        {
+          compareData && <div className='flex'>
+            <div style={{ flex: 1, borderRight: '1px solid #EFEFEF', paddingRight: 10}}>
+              <h4>基本信息</h4>
+              <div id="model-version-compare-left1"></div>
+              <h4>数据表结构</h4>
+              <div id="model-version-compare-left2"></div>
+              <h4>数据表索引</h4>
+              <div id="model-version-compare-left3"></div>
+            </div>
+            <div style={{ flex: 1, paddingLeft: 10}}>
+              <h4>基本信息</h4>
+              <div id="model-version-compare-right1"></div>
+              <h4>数据表结构</h4>
+              <div id="model-version-compare-right2"></div>
+              <h4>数据表索引</h4>
+              <div id="model-version-compare-right3"></div>
+            </div>
+          </div>
+        }
         </Spin>
       </div>
     </div>