update Grid UI

src/pages/AuditLog/AuditLogTable.js

@@ -27,6 +27,7 @@ export default function AuditLogTable({recordList}) {
             field: 'modified',
             headerName: 'Date',
             flex: isMdOrLg ? 1 : undefined,
+            minWidth: 200,
             valueGetter:(params)=>{
                 return DateUtils.datetimeStr(params?.value);
             }
@@ -36,36 +37,42 @@ export default function AuditLogTable({recordList}) {
             field: 'modifiedByName',
             headerName: 'Username',
             flex: isMdOrLg ? 1 : undefined,
+            minWidth: 80,
         },
         {
             id: 'tableName',
             field: 'tableName',
             headerName: 'Table Name',
             flex: isMdOrLg ? 1 : undefined,
+            minWidth: 80,
         },
         {
             id: 'ref',
             field: 'ref',
             headerName: 'Ref',
             flex: isMdOrLg ? 1 : undefined,
+            minWidth: 80,
         },
         {
             id: 'actionType',
             field: 'actionType',
             headerName: 'Action',
             flex: isMdOrLg ? 1 : undefined,
+            minWidth: 80,
         },
         {
             id: 'oldData',
             field: 'oldData',
             headerName: 'Old Data',
-            flex: isMdOrLg ? 2 : undefined,
+            flex: isMdOrLg ? 5 : undefined,
+            minWidth: 300,
         },
         {
             id: 'newData',
             field: 'newData',
             headerName: 'New Data',
-            flex: isMdOrLg ? 2 : undefined,
+            flex: isMdOrLg ? 5 : undefined,
+            minWidth: 300,
         },
     ];
 

src/pages/EmailTemplate/Search_GLD/DataGrid.js

@@ -45,36 +45,42 @@ export default function EmailTemplateTable({ recordList }) {
             field: 'tempKey',
             headerName: 'Key',
             flex: 1,
+            minWidth: 250,
         },
         {
             id: 'description',
             field: 'description',
             headerName: 'Description',
             flex: 1,
+            minWidth: 350,
         },
         {
             id: 'params',
             field: 'params',
             headerName: 'Parameters',
             flex: 1,
+            minWidth: 250,
         },
         {
             id: 'subjectCht',
             field: 'subjectCht',
             headerName: 'Subject (Cht)',
             flex: 1,
+            minWidth: 400,
         },
         {
             id: 'subjectChs',
             field: 'subjectChs',
             headerName: 'Subject (Chs)',
             flex: 1,
+            minWidth: 350,
         },
         {
             id: 'subjectEng',
             field: 'subjectEng',
             headerName: 'Subject (Eng)',
             flex: 1,
+            minWidth: 350,
         },
     ];
 

src/pages/GazetteIssue/DataGrid.js

@@ -25,6 +25,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'issueYear',
             headerName: 'Year',
             flex: 1,
+            minWidth: 100,
             renderCell: (params) => {
                 return <div style={{ margin: 4 }}>{params.row.issueYear}</div>
             },
@@ -34,6 +35,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'volume',
             headerName: 'Volume',
             flex: 1,
+            minWidth: 100,
             renderCell: (params) => {
                 return <div style={{ margin: 4 }}>{params.row.volume}</div>
             },
@@ -43,6 +45,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'issueNo',
             headerName: 'Issue No',
             flex: 1,
+            minWidth: 100,
             renderCell: (params) => {
                 return <div style={{ margin: 4 }}>{params.row.issueNo}</div>
             },
@@ -52,6 +55,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'issueDate',
             headerName: 'Issue Date',
             flex: 2,
+            minWidth: 150,
             renderCell: (params) => {
                 let issueDate = params.row.issueDate;
                 return <div style={{ margin: 4 }}>{dateStr(issueDate)}</div>
@@ -62,6 +66,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'closingDate',
             headerName: 'Closing Date',
             flex: 2,
+            minWidth: 150,
             renderCell: (params) => {
                 let closingDate = params.row.closingDate;
                 return <div style={{ margin: 4 }}>{dateStr(closingDate)}</div>
@@ -72,6 +77,7 @@ export default function GazetteIssueTable({ recordList }) {
             field: 'issueDesc',
             headerName: 'Description',
             flex: 2,
+            minWidth: 200,
         },
     ];
 

src/pages/Setting/SystemSetting/Table.js

@@ -42,6 +42,7 @@ const Table = ({onRowClick, dataList}) => {
             field: 'value',
             headerName: 'Value',
             flex: 1,
+            minWidth: 400,
             renderCell:(params)=>{
                 return <div dangerouslySetInnerHTML={{__html: params.value}} />
             }