feat: 单位下展示-商机数据

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

@@ -10,9 +10,10 @@ import ProTable from '@ant-design/pro-table'
 import { useModal } from '@/components/Modal'
 import { useDispatch } from 'umi'
 import AddRecord from '@/pages/Customer/Client/components/ClientDetail/AddRecord'
+import Detail from '@/pages/Customer/Business/components/BusinessDetail'
 import SyncClient from './SyncClient'
 
-const CompanyTabList = ({ initData, customerId, client, software, customer }) => {
+const CompanyTabList = ({ initData, customerId, client, software, customer, business }) => {
   const dispatch = useDispatch()
   const { toggleDrawer, setDrawerProps } = useModal()
   const { TabPane } = Tabs
@@ -50,6 +51,23 @@ const CompanyTabList = ({ initData, customerId, client, software, customer }) =>
     })
     toggleDrawer(true)
   }
+  // 展示商机详情
+  const showDrawerBusiness = (id, isCompany = false) => {
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: isCompany ? (
+        <CompanyDetail dataId={id} />
+      ) : (
+        <Detail dataId={id} orderIds={state.orderIds} />
+      )
+    })
+    toggleDrawer(true)
+  }
   const columns = [
     {
       title: '所有部门',
@@ -123,6 +141,40 @@ const CompanyTabList = ({ initData, customerId, client, software, customer }) =>
       dataIndex: 'responsible'
     }
   ]
+  const columnBusiness = [
+    {
+      title: '商机名称',
+      dataIndex: 'name',
+      width: '30%',
+      render: (text, record) => (
+        <span
+          onClick={() => showDrawerBusiness(record.id)}
+          className="text-primary cursor-pointer hover:text-[#967bbd]">
+          {text}
+        </span>
+      )
+    },
+    {
+      title: '状态',
+      width: '15%',
+      dataIndex: 'businessStatusName'
+    },
+    {
+      title: '负责人',
+      width: '15%',
+      dataIndex: 'responsible'
+    },
+    {
+      title: '商机金额',
+      width: '15%',
+      dataIndex: 'price'
+    },
+    {
+      title: '预计成交',
+      width: '15%',
+      dataIndex: 'finalTime'
+    }
+  ]
 
   const [addCustomerService, setAddCustomerService] = useState({
     visible: false,
@@ -188,6 +240,19 @@ const CompanyTabList = ({ initData, customerId, client, software, customer }) =>
               />
             </div>
           </TabPane>
+          <TabPane tab="商机" key="商机">
+            <div className="sheet-right-panel">
+              <ProTable
+                size="small"
+                columns={columnBusiness}
+                search={false}
+                toolBarRender={false}
+                rowKey={record => record.id}
+                dataSource={business.business}
+                pagination={false}
+              />
+            </div>
+          </TabPane>
         </Tabs>
       </div>
       <div className="sheet-btns pl-15px pt-15px flex items-center">

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

@@ -18,12 +18,13 @@ const CompanyDetail = props => {
     log: [],
     serviceLog: [],
     software: {},
-    client: {}
+    client: {},
+    business: {}
   })
   const initData = async (id = dataId) => {
     setState({ ...state, loading: true })
     const {
-      data: { customer = {}, log = [], serviceLog = [], software = {}, client = {} },
+      data: { customer = {}, log = [], serviceLog = [], software = {}, client = {}, business = {} },
       code = -1
     } = await apiCompanyDetail(id)
     if (code === consts.RET_CODE.SUCCESS) {
@@ -33,7 +34,7 @@ const CompanyDetail = props => {
           payload: updateKey
         })
       }
-      setState({ ...state, customer, log, serviceLog, software, loading: false, client })
+      setState({ ...state, customer, log, serviceLog, software, loading: false, client, business })
     }
   }
   const { flipFn, flipConsts } = useFlipOver(initData, dataId, orderIds)
@@ -96,6 +97,7 @@ const CompanyDetail = props => {
               software={state.software}
               client={state.client}
               customer={state.customer}
+              business={state.business}
             />
             <CompanyLowerList log={state.log} servicelist={state.serviceLog} />
           </Col>