优化软件锁和客户抽屉内容

src/components/PopContent/Companys/index.jsx

@@ -48,37 +48,24 @@ const Index = props => {
   return (
     <div>
       <div className="sheet-box">
-        <Drawer
-          title="公司"
-          placement="right"
-          bodyStyle={{
-            height: y,
-            overflowY: 'hidden'
-          }}
-          width={clientWidth}
-          closable
-          onClose={onClose}
-          visible={visible}
-          // mask={false}
-        >
-          <Row>
-            <Col span={12} className="sheet-box-left">
-              <div className="sheet-left-panel zh-pd-right-15">
-                <CompanyForm customer={state.customer} />
-              </div>
-            </Col>
-            <Col span={12}>
-              <CompanyTabList />
-              <CompanyLowerList log={state.log} />
-            </Col>
-          </Row>
-        </Drawer>
+        <Row>
+          <Col span={12} className="sheet-box-left">
+            <div className="sheet-left-panel zh-pd-right-15">
+              <CompanyForm customer={state.customer} />
+            </div>
+          </Col>
+          <Col span={12}>
+            <CompanyTabList />
+            <CompanyLowerList log={state.log} />
+          </Col>
+        </Row>
       </div>
     </div>
   )
 }
 
 // export default index
-export default connect(({ refresh }) => ({
-  shouldUpdate: refresh.company
+export default connect(({ refresh, single }) => ({
+  shouldUpdate: refresh.company,
+  visible: single.drawer.visible
 }))(Index)

src/components/PopContent/Locks/index.jsx

@@ -7,9 +7,10 @@ import { apiSoftwareDetail } from '@/services/lock'
 import LockForm from '@/components/PopContent/Locks/LockForm'
 import LockLowerList from '@/components/PopContent/Locks/LockLowerList'
 import LockTabList from '@/components/PopContent/Locks/LockTabList'
+import { connect } from 'dva'
 
 const Index = props => {
-  const { visible, onClose, collapsed, id = '' } = props
+  const { collapsed, visible, id = '' } = props
   const needSubtractHeight = 55 // 需要被裁掉的高度
   // const needSubtractWidth = (collapsed ? 208 : 48) + 48 + 48 + 48 // 需要被裁掉的高度
   const [x, y] = useAutoTable(collapsed, needSubtractHeight)
@@ -43,7 +44,18 @@ const Index = props => {
   return (
     <div>
       <div className="sheet-box">
-        <Drawer
+        <Row>
+          <Col span={12} className="sheet-box-left">
+            <div className="sheet-left-panel zh-pd-right-15">
+              <LockForm longle={state.longle} />
+            </div>
+          </Col>
+          <Col span={12}>
+            <LockTabList longleLog={state.longleLog} />
+            <LockLowerList log={state.log} />
+          </Col>
+        </Row>
+        {/* <Drawer
           title="软件锁"
           placement="right"
           bodyStyle={{
@@ -56,21 +68,13 @@ const Index = props => {
           visible={visible}
           // mask={false}
         >
-          <Row>
-            <Col span={12} className="sheet-box-left">
-              <div className="sheet-left-panel zh-pd-right-15">
-                <LockForm longle={state.longle} />
-              </div>
-            </Col>
-            <Col span={12}>
-              <LockTabList longleLog={state.longleLog} />
-              <LockLowerList log={state.log} />
-            </Col>
-          </Row>
-        </Drawer>
+        </Drawer> */}
       </div>
     </div>
   )
 }
 
-export default Index
+// export default Index
+export default connect(({ single }) => ({
+  visible: single.drawer.visible
+}))(Index)

src/pages/Customer/Company/index.jsx

@@ -8,8 +8,10 @@ import { queryCompany, apiAddCompany } from '@/services/company'
 import LazyCascader from '@/components/LazyCascader'
 import Companys from '@/components/PopContent/Companys'
 import AddCompany from '@/pages/Customer/Company/AddCompany'
+import { useModal } from '@/components/Modal'
 
 const Company = props => {
+  const { toggleDrawer, setDrawerProps } = useModal()
   const { collapsed } = props
   const needSubtractHeight = 48 + 48 + 48 + 64 + 24 + 32 // 需要被裁掉的高度
   const needSubtractWidth = (collapsed ? 208 : 48) + 48 + 48 + 48 // 需要被裁掉的高度
@@ -61,17 +63,25 @@ const Company = props => {
 
   // 展示drawer
   const showDrawer = id => {
-    // console.log(id);
-    setState({ ...state, id, visible: true })
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: <Companys id={id} />
+    })
+    toggleDrawer()
   }
 
   // 隐藏drawer
-  const hideDrawer = () => {
-    setState({ ...state, visible: false, id: '' })
-  }
-  const onCreate = values => {
-    console.log(values)
-  }
+  // const hideDrawer = () => {
+  //   setState({ ...state, visible: false, id: '' })
+  // }
+  // const onCreate = values => {
+  //   console.log(values)
+  // }
   const columns = [
     {
       title: '客户名称',
@@ -180,7 +190,6 @@ const Company = props => {
     }
   })
 
-
   return (
     <div>
       <ProTable
@@ -197,8 +206,7 @@ const Company = props => {
             <Button
               key="button"
               type="primary"
-              onClick={() => setAddCompany({ ...addCompany, visible: true })}
-            >
+              onClick={() => setAddCompany({ ...addCompany, visible: true })}>
               <SvgIcon type="icon-plus" />
               客户
             </Button>
@@ -221,7 +229,7 @@ const Company = props => {
         visible={addCompany.visible}
         onCancel={() => setAddCompany({ ...addCompany, visible: false })}
       />
-      <Companys onClose={hideDrawer} visible={state.visible} onCreate={onCreate} id={state.id} />
+      {/* <Companys onClose={hideDrawer} visible={state.visible} onCreate={onCreate} id={state.id} /> */}
     </div>
   )
 }

src/pages/Product/Lock/Lockstore/index.jsx

@@ -5,6 +5,7 @@ import useAutoTable from '@/hooks/useAutoTable'
 import consts from '@/consts'
 import { queryLock } from '@/services/lock'
 import Locks from '@/components/PopContent/Locks'
+import { useModal } from '@/components/Modal'
 
 // 渲染产品标签
 export const ProductLabel = ({ data }) => {
@@ -25,6 +26,7 @@ export const ProductLabel = ({ data }) => {
 }
 
 const Lockstore = props => {
+  const { toggleDrawer, setDrawerProps } = useModal()
   const { collapsed } = props
   const needSubtractHeight = 48 + 48 + 48 + 64 + 24 + 32 // 需要被裁掉的高度
   const needSubtractWidth = (collapsed ? 208 : 48) + 48 + 48 + 48 // 需要被裁掉的高度
@@ -43,9 +45,6 @@ const Lockstore = props => {
     if (code === consts.RET_CODE.SUCCESS) {
       setState({ ...state, data: longle, log, total })
     }
-    // console.log(longle[0].product)
-    // const productArr = longle[0].product.split('+')
-    // console.log(productArr)
   }
   useEffect(() => {
     // props.getlist();
@@ -56,16 +55,16 @@ const Lockstore = props => {
   }
   // 展示drawer
   const showDrawer = id => {
-    // console.log(id);
-    setState({ ...state, id, visible: true })
-  }
-
-  // 隐藏drawer
-  const hideDrawer = () => {
-    setState({ ...state, visible: false, id: '' })
-  }
-  const onCreate = values => {
-    console.log(values)
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: <Locks id={id} />
+    })
+    toggleDrawer()
   }
   const columns = [
     {
@@ -138,7 +137,7 @@ const Lockstore = props => {
           }
         }}
       />
-      <Locks onClose={hideDrawer} visible={state.visible} onCreate={onCreate} id={state.id} />
+      {/* <Locks onClose={hideDrawer} visible={state.visible} onCreate={onCreate} id={state.id} /> */}
     </div>
   )
 }