add prompt js page

src/pages/container/layouts/index.tsx

@@ -1,15 +1,41 @@
-import { Outlet } from 'react-router';
+import { PlusOutlined } from '@ant-design/icons';
+import { Button } from 'antd';
+import { Outlet, useLocation } from 'react-router';
+import { useContainerStore } from '../store';
+import { useEffect } from 'react';
+import { useShallow } from 'zustand/react/shallow';
 
 export const Main = () => {
+  const containerStore = useContainerStore(
+    useShallow((state) => {
+      return {
+        setFormData: state.setFormData,
+        setShowEdit: state.setShowEdit,
+      };
+    }),
+  );
+  const location = useLocation();
+  const isEdit = location.pathname.includes('edit/list');
   return (
-    <div className='flex w-full h-full flex-col bg-gray-200'>
-      <div className='h-12 bg-white p-2 mb-2'>Container</div>
+    <div className='flex w-full h-full flex-col'>
+      <div className='layout-menu'>
+        Container
+        <Button
+          className={!isEdit ? 'hidden' : ''}
+          icon={<PlusOutlined />}
+          onClick={() => {
+            console.log('add');
+            containerStore.setFormData({});
+            containerStore.setShowEdit(true);
+          }}
+        />
+      </div>
       <div
         className='flex'
         style={{
-          height: 'calc(100vh - 4rem)',
+          height: 'calc(100vh - 3rem)',
         }}>
-        <div className='flex-grow overflow-hidden mx-2'>
+        <div className='flex-grow overflow-hidden'>
           <div className='w-full h-full rounded-lg'>
             <Outlet />
           </div>