!2519 优化:调整历史记录界面样式

Merge pull request !2519 from 林三/op_histroy_ui

src/Add-on/File/OpenHistoryBody.tsx

@@ -102,8 +102,8 @@ export class OpenHistoryList extends React.Component<HistoryProp, {}>
             <HTMLTable bordered={true} interactive={true} style={{ lineHeight: 0.5, width: "100%", padding: "5px 5px 0px 5px", border: "1px solid #DBDCDD" }}>
                 <thead>
                     <tr>
-                        <th>操作</th>
-                        <th style={{ width: "120px" }}>用户名</th>
+                        <th style={{ width: 50 }}>操作</th>
+                        <th style={{ width: 190 }}>用户名</th>
                         <th>日期
                             <Checkbox
                                 label="只显示能还原记录"
@@ -136,7 +136,17 @@ export class OpenHistoryList extends React.Component<HistoryProp, {}>
                         this._LastOper = d.oper_type_name;
                         return <tr key={d.oper_date}>
                             <td>{d.oper_type_name}</td>
-                            <td>{d.oper_user}</td>
+                            <td
+                                style={{
+                                    textOverflow: "ellipsis",
+                                    overflow: "hidden",
+                                    whiteSpace: "nowrap",
+                                    maxWidth: 150
+                                }}
+                                title={`${d.oper_user}`}
+                            >
+                                {d.oper_user}
+                            </td>
                             <td>
                                 {d.oper_date}
                                 {this._ButtonEl(d.oper_type_name, d.oper_date, this.props.files[this._Index])}
@@ -159,11 +169,21 @@ export class OpenHistoryList extends React.Component<HistoryProp, {}>
                         if (!this._HasHistoryFile(d.oper_type_name, d.oper_date, this.props.files[this._Index])) return;
                         return <tr>
                             <td>{d.oper_type_name}</td>
-                            <td>{d.oper_user}</td>
+                            <td
+                                style={{
+                                    textOverflow: "ellipsis",
+                                    overflow: "hidden",
+                                    whiteSpace: "nowrap",
+                                    maxWidth: 150
+                                }}
+                                title={`${d.oper_user}`}
+                            >
+                                {d.oper_user}
+                            </td>
                             <td>
                                 {d.oper_date}
                                 <Button
-                                    className="button"
+                                    className="histroyBtn"
                                     value={this._Index++}
                                     text="打开"
                                     onClick={(e) =>
@@ -187,7 +207,7 @@ export class OpenHistoryList extends React.Component<HistoryProp, {}>
         if (!this._HasHistoryFile(name, oper_date, file_date)) return;
         return (
             <Button
-                className="button"
+                className="histroyBtn"
                 value={this._Index++}
                 text="打开"
                 onClick={(e) =>

src/Add-on/File/OperLogsModal.tsx

@@ -47,7 +47,7 @@ export class OperLogsModal extends React.Component<HistoryProp, {}>
                     </div>
                     <div
                         className={Classes.DIALOG_BODY}
-                        style={{ width: 500, height: "100%", backgroundColor: "white", margin: 0, overflow: "auto", maxHeight: 400, minHeight: 200 }}
+                        style={{ width: 500, height: "100%", margin: 0, overflow: "auto", maxHeight: 400, minHeight: 200 }}
                     >
                         <OpenHistoryList
                             fileId={this.props.fileId}

src/UI/Css/style.less

@@ -1047,8 +1047,8 @@ img {
         position: relative;
     }
 
-    .button {
-        right: 10%;
+    .histroyBtn {
+        right: 9%;
         top: 15%;
         padding: 0px 5px 0px 5px;
         position: absolute;
@@ -1061,8 +1061,8 @@ img {
 }
 
 #HistoryFile {
-    min-height: 100px;
-    max-height: 300px;
+    min-height: 140px;
+    max-height: 340px;
     width: 480px;
 
     .bp3-button-group.bp3-minimal {
@@ -1079,8 +1079,8 @@ img {
         position: relative;
     }
 
-    .button {
-        right: 10%;
+    .histroyBtn {
+        right: 9%;
         top: 15%;
         padding: 0px 5px 0px 5px;
         position: absolute;