feat: 客户、联系人软件锁详情

src/pages/Customer/Client/components/ClientDetail/TabList.jsx

@@ -2,6 +2,8 @@ import { message, Tabs } from 'antd'
 import React, { useEffect, useState, useRef } from 'react'
 import consts from '@/consts'
 import { apiAddService } from '@/services/customer'
+import LocksDetail from '@/pages/Product/Lock/LockStore/components/LocksDetail'
+import { useModal } from '@/components/Modal'
 import AddRecord from './AddRecord'
 import { useDispatch } from 'dva'
 import ProTable from '@ant-design/pro-table'
@@ -9,15 +11,37 @@ import ProTable from '@ant-design/pro-table'
 const ContanctTabList = ({ clientId, software }) => {
   // console.log(clientId)
   const dispatch = useDispatch()
+  const { toggleDrawer, setDrawerProps } = useModal()
   const [state, setState] = useState({
     params: {},
     visible: false
   })
   const tRef = useRef()
+  // 展示软件锁drawer
+  const showLongleDrawer = id => {
+    toggleDrawer()
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: <LocksDetail dataId={id} orderIds={state.orderIds} />
+    })
+    toggleDrawer()
+  }
   const columns = [
     {
       title: '锁号',
-      dataIndex: 'keyNum'
+      dataIndex: 'keyNum',
+      render: (clientName, record) => (
+        <span
+          onClick={() => showLongleDrawer(record.id)}
+          className="text-primary cursor-pointer hover:text-[#967bbd]">
+          {clientName}
+        </span>
+      )
     },
     {
       title: '产品',

src/pages/Customer/Company/components/CompanyDetail/TabList.jsx

@@ -1,4 +1,5 @@
 import ContactDetail from '@/pages/Customer/Client/components/ClientDetail'
+import LocksDetail from '@/pages/Product/Lock/LockStore/components/LocksDetail'
 import React, { useRef, useState } from 'react'
 import { Tabs, message } from 'antd'
 import AddContact from '@/pages/Customer/Client/components/AddClient'
@@ -33,6 +34,20 @@ const CompanyTabList = ({ initData, customerId, client, software, customer }) =>
     })
     toggleDrawer()
   }
+  // 展示软件锁drawer
+  const showLongleDrawer = id => {
+    toggleDrawer()
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: <LocksDetail dataId={id} orderIds={state.orderIds} />
+    })
+    toggleDrawer()
+  }
   const columns = [
     {
       title: '所有部门',
@@ -73,7 +88,14 @@ const CompanyTabList = ({ initData, customerId, client, software, customer }) =>
   const columnLongle = [
     {
       title: '锁号',
-      dataIndex: 'keyNum'
+      dataIndex: 'keyNum',
+      render: (clientName, record) => (
+        <span
+          onClick={() => showLongleDrawer(record.id)}
+          className="text-primary cursor-pointer hover:text-[#967bbd]">
+          {clientName}
+        </span>
+      )
     },
     {
       title: '产品',

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

@@ -10,7 +10,7 @@ import { Down, Up } from '@icon-park/react'
 import { FlipOverEnum, useFlipOver } from '@/hooks/web/useFlipOver'
 
 const Index = props => {
-  const { dispatch, visible, dataId = '', shouldUpdate, orderIds } = props
+  const { dispatch, visible, dataId = '', shouldUpdate, orderIds = [] } = props
   const [state, setState] = useState({
     longle: {},
     log: [],