update: ui

.umirc.ts

@@ -12,13 +12,15 @@ const ROUTE_PATHS = {
   problemRectification: '/problem_rectification',
   issueRectificationArchive: '/issue_rectification_archive',
   problemRectificationForm: '/problem_rectification_form',
+  problemRectificationFlowTable: '/problem_rectification_flow_table',
 } as const;
+const APP_BASE_PATH = '/problem_rectification_new/';
 
 export default defineConfig({
   layout: false,
   fastRefresh: true,
-  base: '/problem_rectification_new/',
-  publicPath: '/problem_rectification_new/',
+  base: APP_BASE_PATH,
+  publicPath: APP_BASE_PATH,
   alias: {
     react: resolvePackageRoot('react'),
     'react-dom': resolvePackageRoot('react-dom'),
@@ -58,6 +60,10 @@ export default defineConfig({
           path: ROUTE_PATHS.problemRectificationForm,
           component: './problem_rectification/form/index',
         },
+        {
+          path: ROUTE_PATHS.problemRectificationFlowTable,
+          component: './problem_rectification/flow-table/index',
+        },
       ],
     },
   ],
@@ -88,5 +94,6 @@ export default defineConfig({
   define: {
     STREAMS_API_URL: '/api',
     STREAMS_PARSER_URL: '/parser',
+    PROBLEM_RECTIFICATION_APP_BASE_PATH: APP_BASE_PATH,
   },
 });

src/catalyst-ui-kit/javascript/table.jsx

@@ -16,6 +16,7 @@ export function Table({
   dense = false,
   grid = false,
   striped = false,
+  scrollable = true,
   className,
   children,
   ...props
@@ -27,7 +28,9 @@ export function Table({
           {...props}
           className={clsx(
             className,
-            '-mx-(--gutter) overflow-x-auto whitespace-nowrap',
+            '-mx-(--gutter)',
+            scrollable && 'overflow-x-auto',
+            'whitespace-nowrap',
           )}
         >
           <div

src/pages/RecordDetailDrawer/index.jsx

@@ -15,6 +15,8 @@ import {
   isViewAccessible,
 } from '@/utils/subjectView';
 
+const EMPTY_ARRAY = [];
+
 function CloseIcon() {
   return (
     <svg viewBox="0 0 20 20" fill="none" aria-hidden="true" className="size-5">
@@ -46,6 +48,7 @@ const RecordDetailDrawer = (props, ref) => {
     readonly = false,
     filterView = [],
     preferredViewName,
+    disabledFields = EMPTY_ARRAY,
   } = props;
 
   const [refreshKey, setRefreshKey] = useState(() => Date.now());
@@ -122,6 +125,15 @@ const RecordDetailDrawer = (props, ref) => {
 
   const activeView = detailViews.find((view) => view.name === activeTabKey) || detailViews[0];
   const drawerWidth = isFullscreen ? '100vw' : typeof width === 'number' ? `${width}px` : width;
+  const disabledFieldSet = useMemo(
+    () =>
+      new Set(
+        disabledFields.flatMap((fieldName) => [fieldName, `metadata.${fieldName}`]),
+      ),
+    [disabledFields],
+  );
+  const isDrawerFieldDisabled = (fieldPath, currentView) =>
+    disabledFieldSet.has(fieldPath) || isFieldDisabled(fieldPath, currentView);
 
   const closeDrawer = () => {
     onClose?.();
@@ -209,7 +221,7 @@ const RecordDetailDrawer = (props, ref) => {
                       onFieldUpdate={handleFieldUpdate}
                       onDataChange={onDataChange}
                       readonly={readonly}
-                      isFieldDisabled={isFieldDisabled}
+                      isFieldDisabled={isDrawerFieldDisabled}
                     />
                   )}
                 </main>

src/pages/problem_rectification/problemRectificationFormService.js

@@ -10,7 +10,10 @@ import {
   sendNotice,
   updateRecord,
 } from '@/services/DataService';
-import { normalizeProblemRectificationRecord } from './problemRectificationListService';
+import {
+  getProblemRectificationFormUrl,
+  normalizeProblemRectificationRecord,
+} from './problemRectificationListService';
 import { normalizeText, toArray } from '@/utils/subjectView';
 
 const MESSAGE_REFERENCE_SUBJECT = 'message_reference_id';
@@ -147,11 +150,7 @@ async function sendFlowNotice({ title, content, fromUserId, toUserIds = [] }) {
 }
 
 function buildReturnUrl(messageName) {
-  if (typeof window === 'undefined') {
-    return `/problem_rectification_form?id=${messageName}`;
-  }
-
-  return `${window.location.origin}/problem_rectification_form?id=${messageName}`;
+  return getProblemRectificationFormUrl(messageName);
 }
 
 function resolveCurrentStep(messageRecord) {