chore: use drawer for creation

2026-01-07 15:55:26 +08:00
parent bbf09c2ea9
commit 28a73d2a6e
9 changed files with 113 additions and 69 deletions
@@ -0,0 +1,59 @@
+import ModalFooter from '@/components/modal-footer';
+import GSDrawer from '@/components/scroller-modal/gs-drawer';
+import ColumnWrapper from '@/pages/_components/column-wrapper';
+
+const ModalFooterStyle = {
+  padding: '16px 24px 8px',
+  display: 'flex',
+  justifyContent: 'flex-end'
+};
+
+type AddModalProps = {
+  title: string;
+  open: boolean;
+  onCancel: () => void;
+  children?: React.ReactNode;
+  onSubmit: () => void;
+  width?: number;
+};
+const FormDrawer: React.FC<AddModalProps> = ({
+  title,
+  open,
+  onCancel,
+  onSubmit,
+  children,
+  width = 600
+}) => {
+  return (
+    <GSDrawer
+      title={title}
+      open={open}
+      onClose={onCancel}
+      destroyOnHidden={true}
+      closeIcon={false}
+      maskClosable={false}
+      keyboard={false}
+      styles={{
+        wrapper: { width }
+      }}
+      footer={false}
+    >
+      <ColumnWrapper
+        styles={{
+          container: { paddingBlock: 0 }
+        }}
+        footer={
+          <ModalFooter
+            onOk={onSubmit}
+            onCancel={onCancel}
+            style={ModalFooterStyle}
+          ></ModalFooter>
+        }
+      >
+        {children}
+      </ColumnWrapper>
+    </GSDrawer>
+  );
+};
+
+export default FormDrawer;