Просмотр исходного кода

feat: 云版cld客户详情调整成卡片的形式

outaozhen 4 лет назад
Родитель
Сommit
849c479c5b

+ 1 - 1
src/components/ModalStore/src/CreateProvider.tsx

@@ -164,7 +164,7 @@ class ModalStore extends React.Component<ModalStoreProps, ModalStoreState> {
     if (currentIdx === 0) return item
     if (currentIdx === 0) return item
     if (currentIdx > 0) {
     if (currentIdx > 0) {
       // 大于0说明是第二或以上的抽屉了
       // 大于0说明是第二或以上的抽屉了
-      console.log(len, currentIdx)
+      // console.log(len, currentIdx)
 
 
       return {
       return {
         ...item,
         ...item,

+ 1 - 1
src/pages/Customer/Company/components/ChangeCompany/index.jsx

@@ -40,7 +40,7 @@ const ChangeCompanyInput = props => {
     editable = true
     editable = true
   } = props
   } = props
   const refreshClient = () => {
   const refreshClient = () => {
-    console.log('actionPayload', actionPayload)
+    // console.log('actionPayload', actionPayload)
     dispatch({
     dispatch({
       type: 'refresh/commitAction',
       type: 'refresh/commitAction',
       payload: actionPayload
       payload: actionPayload

+ 47 - 0
src/pages/Product/Cloud/components/CardDetail/index.jsx

@@ -0,0 +1,47 @@
+import { Card } from 'antd'
+import React, { useState } from 'react'
+import { useModal } from '@/components/ModalStore'
+import styles from './index.less'
+
+const CardClientDetail = props => {
+  const { client } = props
+  const dispatchModal = useModal()
+  const [state, setState] = useState({
+    orderIds: []
+  })
+  return (
+    <div className="pt-3 border-t-1px border-hex-f3f3f3">
+      <Card title="CLD客户" size="small" type="inner" className={styles.cardBoxBg}>
+        <div className="py-3">
+          客户姓名:
+          <span
+            onClick={() =>
+              dispatchModal('D_CLIENT_DETAIL', { dataId: client.id, orderIds: state.orderIds })
+            }
+            className="text-primary cursor-pointer hover:text-[#967bbd]">
+            {client.clientName}
+          </span>
+        </div>
+        <div className="py-3">
+          单位名称:
+          <span
+            onClick={() =>
+              dispatchModal('D_COMPANY_DETAIL', {
+                dataId: client.companyId,
+                orderIds: state.orderIds
+              })
+            }
+            className="text-primary cursor-pointer hover:text-[#967bbd]">
+            {client.companyName}
+          </span>
+        </div>
+        <div className="py-3">手机:{client.telephone}</div>
+        <div className="py-3">QQ:{client.qq}</div>
+        <div className="py-3">部门:{client.department}</div>
+        <div className="py-3">职务:{client.position}</div>
+      </Card>
+    </div>
+  )
+}
+
+export default CardClientDetail

+ 10 - 0
src/pages/Product/Cloud/components/CardDetail/index.less

@@ -0,0 +1,10 @@
+.cardBoxBg {
+  margin-top: 15px !important;
+  border: 1px solid #e5e5e5 !important;
+  :global(.ant-card-head) {
+    background: #e5e5e5 !important;
+  }
+  :global(.ant-card-body) {
+    background: #f7f7f7 !important;
+  }
+}

+ 5 - 5
src/pages/Product/Cloud/components/Detail/index.jsx

@@ -9,6 +9,7 @@ import LowerList from './LowerList'
 import TabList from './TabList'
 import TabList from './TabList'
 import { apiRoadpricingDetail, apiRoadPricingUnLinkClient } from '@/services/product'
 import { apiRoadpricingDetail, apiRoadPricingUnLinkClient } from '@/services/product'
 import { useModal } from '@/components/ModalStore'
 import { useModal } from '@/components/ModalStore'
+import CardClientDetail from '../CardDetail'
 
 
 const CloudDetail = props => {
 const CloudDetail = props => {
   const {
   const {
@@ -100,7 +101,8 @@ const CloudDetail = props => {
                 {state.cloudUser.cld?.clientId ? (
                 {state.cloudUser.cld?.clientId ? (
                   <>
                   <>
                     <div className="mt-4">
                     <div className="mt-4">
-                      <ClientDetail client={state.client} filterTag={true} updateKey={updateKey} />
+                      <CardClientDetail client={state.client} />
+                      {/* <ClientDetail client={state.client} filterTag={true} updateKey={updateKey} /> */}
                     </div>
                     </div>
                     <div className="text-center mt-6">
                     <div className="text-center mt-6">
                       <Tooltip placement="right" title="移除CLD客户">
                       <Tooltip placement="right" title="移除CLD客户">
@@ -110,8 +112,7 @@ const CloudDetail = props => {
                           size="small"
                           size="small"
                           onClick={() => {
                           onClick={() => {
                             pricingUnLinkClient(state.cloudUser.cld?.clientId)
                             pricingUnLinkClient(state.cloudUser.cld?.clientId)
-                          }}
-                        >
+                          }}>
                           <LinkInterrupt size="14" />
                           <LinkInterrupt size="14" />
                           <span className="ml-5px">移除CLD客户</span>
                           <span className="ml-5px">移除CLD客户</span>
                         </Button>
                         </Button>
@@ -135,8 +136,7 @@ const CloudDetail = props => {
               // lg={{ span: 15 }}
               // lg={{ span: 15 }}
               // xl={{ span: 15 }}
               // xl={{ span: 15 }}
               flex={{ flexDirection: 'column' }}
               flex={{ flexDirection: 'column' }}
-              className="sheet-box-right"
-            >
+              className="sheet-box-right">
               <TabList
               <TabList
                 compilationList={state.compilationList}
                 compilationList={state.compilationList}
                 cloudUser={state.cloudUser}
                 cloudUser={state.cloudUser}

+ 3 - 1
src/pages/Product/Road/Personal/components/Detail/index.jsx

@@ -9,6 +9,7 @@ import LowerList from './LowerList'
 import TabList from './TabList'
 import TabList from './TabList'
 import ClientDetail from '@/pages/Customer/Client/components/ClientDetail/Form'
 import ClientDetail from '@/pages/Customer/Client/components/ClientDetail/Form'
 import { useModal } from '@/components/ModalStore'
 import { useModal } from '@/components/ModalStore'
+import CardClientDetail from '@/pages/Product/Cloud/components/CardDetail'
 
 
 const PersonalDetail = props => {
 const PersonalDetail = props => {
   const {
   const {
@@ -99,7 +100,8 @@ const PersonalDetail = props => {
                 {state.cloudUser.cld?.clientId ? (
                 {state.cloudUser.cld?.clientId ? (
                   <>
                   <>
                     <div className="mt-4">
                     <div className="mt-4">
-                      <ClientDetail client={state.client} filterTag={filterTag} />
+                      <CardClientDetail client={state.client} />
+                      {/* <ClientDetail client={state.client} filterTag={filterTag} /> */}
                     </div>
                     </div>
                     <div className="text-center mt-6">
                     <div className="text-center mt-6">
                       <Tooltip placement="right" title="移除CLD客户">
                       <Tooltip placement="right" title="移除CLD客户">

+ 4 - 2
src/pages/Product/Road/Personal/index.jsx

@@ -84,13 +84,15 @@ const Personal = props => {
       title: 'CLD客户',
       title: 'CLD客户',
       dataIndex: 'cld',
       dataIndex: 'cld',
       key: 'cld',
       key: 'cld',
-      width: 150
+      width: 150,
+      renderText: cld => cld.clientName
     },
     },
     {
     {
       title: 'CLD单位',
       title: 'CLD单位',
       dataIndex: 'customerName',
       dataIndex: 'customerName',
       key: 'customerName',
       key: 'customerName',
-      width: 150
+      width: 150,
+      renderText: (_, record) => record.cld?.customerName
     },
     },
     {
     {
       title: '最近登录',
       title: '最近登录',