style: cluster advanced scroller

src/pages/cluster-management/components/cluster-form.tsx

@@ -1,6 +1,6 @@
-import { useScrollerContext } from '@/components/scroller-modal/use-scroller-context';
 import SealInput from '@/components/seal-form/seal-input';
 import SealTextArea from '@/components/seal-form/seal-textarea';
+import { PageAction } from '@/config';
 import { PageActionType } from '@/config/types';
 import CollapsePanel from '@/pages/_components/collapse-panel';
 import { json2Yaml, yaml2Json } from '@/pages/backends/config';
@@ -25,7 +25,6 @@ type AddModalProps = {
 };
 const ClusterForm: React.FC<AddModalProps> = forwardRef(
   ({ action, provider, currentData, credentialList, onFinish }, ref) => {
-    const { scrollToBottom } = useScrollerContext();
     const [form] = Form.useForm();
     const intl = useIntl();
     const [activeKey, setActiveKey] = React.useState<string[]>([]);
@@ -33,14 +32,21 @@ const ClusterForm: React.FC<AddModalProps> = forwardRef(
 
     const handleOnCollapseChange = async (keys: string | string[]) => {
       setActiveKey(Array.isArray(keys) ? keys : [keys]);
-      if (keys?.includes?.('advanceConfig')) {
-        await new Promise((resolve) => {
-          setTimeout(resolve, 500);
-        });
-        scrollToBottom();
-      }
     };
 
+    useEffect(() => {
+      if (
+        activeKey?.includes?.('advanceConfig') &&
+        action === PageAction.EDIT
+      ) {
+        const el = document.querySelector('.scroller-to-holder');
+        if (!el) return;
+        setTimeout(() => {
+          el.scrollIntoView({ behavior: 'smooth' });
+        }, 300);
+      }
+    }, [activeKey, action]);
+
     const handleOnFinish = (values: FormData) => {
       const workerConfig = yaml2Json(advanceConfigRef.current?.getYamlValue());
 

src/pages/cluster-management/components/pool-form.tsx

@@ -256,7 +256,7 @@ const PoolForm: React.FC<AddModalProps> = forwardRef((props, ref) => {
 
   const handleOsImageChange = (value: string, option: any) => {
     form.setFieldsValue({
-      os_image: option.os_image || value
+      os_image: option?.os_image || value
     });
   };
 

src/pages/cluster-management/step-forms/advance-config.tsx

@@ -89,6 +89,7 @@ const ClusterAdvanceConfig: React.FC<{
         }}
         schema={schema}
       ></YamlEditor>
+      <div className="scroller-to-holder" style={{ height: 1 }}></div>
     </>
   );
 });

src/pages/cluster-management/step-forms/worker-pools-form.tsx

@@ -116,8 +116,13 @@ const WorkerPoolsForm = forwardRef((props: WorkerPoolsFormProps, ref) => {
       form?.validateFields()
     );
     const results = await Promise.allSettled(promises);
-    console.log('results========0', promises, results);
-    if (results.some((result) => result.status === 'rejected')) {
+    const rejectIndex = results.findIndex(
+      (result) => result.status === 'rejected'
+    );
+    if (rejectIndex !== -1) {
+      setActiveKey(() => {
+        return new Set([rejectIndex]);
+      });
       return Promise.reject({
         values: {
           worker_pools: gatherFormValues(results)