软件锁弹窗还原

src/pages/Product/Lock/Lockstore/components/LocksDetail/LockTabList.jsx

@@ -5,9 +5,10 @@ import consts from '@/consts'
 import { apiSoftwareAddLonglelog } from '@/services/lock'
 import { ProductLabel } from '@/pages/Product/Lock/Lockstore'
 import LockUpgrade from './LockUpgrade'
-import LockReplace from './LockReplace'
-import LockRecover from './LockRecover'
-import LockRemarks from './LockRemarks'
+// import LockUpgrade from './LockUpgrade'
+// import LockReplace from './LockReplace'
+// import LockRecover from './LockRecover'
+// import LockRemarks from './LockRemarks'
 
 const LockTabList = props => {
   const { longleLog, clientId, longleId } = props
@@ -45,12 +46,23 @@ const LockTabList = props => {
     }
     // 请求完了
     setAddLonglelog({ ...addLonglelog, loading: false, visible: false })
-    // 刷新数据
-    // dispatch({
-    //   type: 'refresh/commitAction',
-    //   payload: 'contact'
-    // })
   }
+
+  // const handleAddLonglelog = async values => {
+  //   setAddLonglelog({ ...addLonglelog, loading: true })
+  //   const { code = -1 } = await apiSoftwareAddLonglelog({ ...values, clientId, longleId })
+  //   if (code === consts.RET_CODE.SUCCESS) {
+  //     message.success('新增成功')
+  //     setState({ ...state, data: values })
+  //   }
+  //   // 请求完了
+  //   setAddLonglelog({ ...addLonglelog, loading: false, visible: false })
+  //   // 刷新数据
+  //   // dispatch({
+  //   //   type: 'refresh/commitAction',
+  //   //   payload: 'contact'
+  //   // })
+  // }
   return (
     <div>
       <div className="zh-pd-left-15">
@@ -91,7 +103,7 @@ const LockTabList = props => {
         </Tabs>
       </div>
       <div className="sheet-btns zh-pd-left-15 zh-pd-top-15 zh-flex">
-        {/* <Button
+        <Button
           type="primary"
           ghost
           size="small"
@@ -99,12 +111,17 @@ const LockTabList = props => {
           // onClick={() => setAddService({ ...setAddService, visible: true })}
         >
           借出/销售/赠送
-        </Button> */}
-        <LockUpgrade onConfirm={handleAddLonglelog} />
+        </Button>
+        {/* <LockUpgrade onConfirm={handleAddLonglelog} /> */}
         {/* <LockReplace onConfirm={handleAddLonglelog}></LockReplace>
         <LockRecover onConfirm={handleAddLonglelog}></LockRecover>
         <LockRemarks onConfirm={handleAddLonglelog}></LockRemarks> */}
-        {/* <Button type="primary" ghost size="small" className="zh-mg-right-3">
+        <Button
+          type="primary"
+          ghost
+          size="small"
+          className="zh-mg-right-3"
+          onClick={() => setAddLonglelog({ ...setAddLonglelog, visible: true })}>
           升级
         </Button>
         <Button type="primary" ghost size="small" className="zh-mg-right-3">
@@ -115,7 +132,13 @@ const LockTabList = props => {
         </Button>
         <Button type="primary" ghost size="small">
           备注
-        </Button> */}
+        </Button>
+        <LockUpgrade
+          onConfirm={handleAddLonglelog}
+          loading={addLonglelog.loading}
+          visible={addLonglelog.visible}
+          onCancel={() => setAddLonglelog({ ...addLonglelog, visible: false })}
+        />
       </div>
     </div>
   )

src/pages/Product/Lock/Lockstore/components/LocksDetail/LockUpgrade.jsx

@@ -1,15 +1,65 @@
-import React from 'react'
+import React, { useEffect } from 'react'
 import { Button } from 'antd'
-import { ProFormSelect, ModalForm, ProFormText, ProFormTextArea } from '@ant-design/pro-form'
+import { Modal } from 'antd'
+import ProForm, {
+  ProFormSelect,
+  ModalForm,
+  ProFormText,
+  ProFormTextArea
+} from '@ant-design/pro-form'
+import { useForm } from 'antd/lib/form/Form'
 
 const LockUpgrade = props => {
-  const { onConfirm } = props
+  const [form] = useForm()
+  const { visible, onCancel, onConfirm, loading } = props
   const layout = {
-    layout: 'vertical'
+    layout: 'horizontal'
   }
+  useEffect(() => {
+    if (visible) {
+      form.resetFields()
+    }
+  }, [])
   return (
     <div>
-      <ModalForm
+      <Modal
+        {...layout}
+        title="升级软件锁"
+        visible={visible}
+        confirmLoading={loading}
+        onCancel={onCancel}
+        onOk={() => {
+          form.validateFields().then(values => {
+            onConfirm(values)
+          })
+        }}
+        width={500}>
+        <ProForm
+          submitter={{
+            resetButtonProps: {
+              style: {
+                display: 'none'
+              }
+            },
+            submitButtonProps: {
+              style: {
+                display: 'none'
+              }
+            }
+          }}>
+          <ProFormSelect
+            options={[
+              {
+                value: '广东算量新定额',
+                label: '广东算量新定额'
+              }
+            ]}
+            width="sm"
+            name="name"
+            label="新增产品"></ProFormSelect>
+        </ProForm>
+      </Modal>
+      {/* <ModalForm
         width={500}
         {...layout}
         title="升级软件锁"
@@ -32,8 +82,8 @@ const LockUpgrade = props => {
           placeholder="请选择新增产品"
           rules={[{ required: true, message: '请选择新增产品' }]}
         />
-      </ModalForm>
-      <ModalForm
+      </ModalForm> */}
+      {/* <ModalForm
         width={500}
         {...layout}
         title="更换软件锁"
@@ -83,7 +133,7 @@ const LockUpgrade = props => {
           return true
         }}>
         <ProFormTextArea label="备注" name="mark"></ProFormTextArea>
-      </ModalForm>
+      </ModalForm> */}
     </div>
   )
 }