Kaynağa Gözat

feat: 修改客户详情显示样式

lanjianrong 5 yıl önce
ebeveyn
işleme
eadc75ae3c

+ 6 - 0
src/basic/css/common.scss

@@ -439,11 +439,17 @@
   overflow: hidden;
   .sheet-box-left {
     height: calc(100vh - 25px);
+    padding: 24px 0 24px 24px;
     overflow-y: auto;
     .sheet-left-panel {
       overflow-x: hidden;
     }
   }
+  .sheet-box-right {
+    padding: 24px 24px 24px 0;
+    // margin: 0 -24px -24px;
+    background-color: #fafafa;
+  }
 }
 .sheet-right-panel,.sheet-panel-record {
   height: calc((100vh - 48px - 92px - 64px) / 2);

+ 1 - 0
src/consts.js

@@ -5,5 +5,6 @@ export default {
   ...BASE_CONSTS,
   // 自定义变量
   PAGE_SIZE: 20, // 分页条数
+  MAX_PAGE_SIZE: 215000,
   ENCRYPTION_ZERO: 'McAlO0O0OdO0O0Oi'
 }

+ 4 - 0
src/layouts/BasicLayout.less

@@ -11,4 +11,8 @@
   // :global(.ant-table-body) {
   //   height: calc(100vh - 48px - 48px - 64px - 46px - 60px);
   // }
+
+  :global(.ant-drawer-body) {
+    padding: 0
+  }
 }

+ 4 - 4
src/pages/Customer/Company/components/CompanyDetail/CompanyLowerList.jsx

@@ -1,15 +1,15 @@
 import { Tabs, List } from 'antd'
 import { dayjsFormat } from '@/utils/utils'
-import { useModal } from '@/components/Modal'
-import ContactDetail from '@/pages/customer/Contact/components/ContactDetail'
+// import { useModal } from '@/components/Modal'
+// import ContactDetail from '@/pages/customer/Contact/components/ContactDetail'
 
 const CompanyLowerList = props => {
-  const { toggleModal, setModalProps } = useModal()
+  // const { toggleModal, setModalProps } = useModal()
   const {
     log: { log: logs = [], total = 0 }
   } = props
   const { TabPane } = Tabs
-  const needSubtractHeight = 48 + 48 + 48 + 64 + 24 // 需要被裁掉的高度
+  // const needSubtractHeight = 48 + 48 + 48 + 64 + 24 // 需要被裁掉的高度
   // const [x, y] = useAutoTable(needSubtractHeight)
 
   // const handleOnClick = id => {

+ 20 - 19
src/pages/Customer/Company/components/CompanyDetail/CompanyTabList.jsx

@@ -7,10 +7,11 @@ import { formatValues } from '@/components/LazyCascader'
 import consts from '@/consts'
 import ProTable from '@ant-design/pro-table'
 import { queryContact } from '@/services/contact'
+// import { useScroll } from '_ahooks@2.10.2@ahooks'
 
 const CompanyTabList = ({ initData, customerId, software }) => {
   const { TabPane } = Tabs
-  const tRef = useRef()
+  const tRef = useRef(null)
   const columns = [
     {
       title: '所有部门',
@@ -57,8 +58,19 @@ const CompanyTabList = ({ initData, customerId, software }) => {
     visible: false
   })
   useEffect(() => {
-    setState({ ...state, params: { ...state.params, customerId } })
-  }, [customerId])
+    const fetchClients = async () => {
+      const { code = -1, data: { client = [] } = { client: [], total: 0 } } = await queryContact({
+        customerId,
+        current: 1,
+        pageSize: consts.MAX_PAGE_SIZE
+      })
+      if (code === consts.RET_CODE.SUCCESS) {
+        setDataSource(client)
+      }
+    }
+    fetchClients()
+  }, [])
+
   const handleAddClient = async values => {
     // 客户id
     const payload = formatValues({ ...values, customerId })
@@ -73,28 +85,17 @@ const CompanyTabList = ({ initData, customerId, software }) => {
       <div className="zh-pd-left-15">
         <Tabs>
           <TabPane tab="联系人" key="联系人">
-            <div className="sheet-right-panel">
+            <div className="sheet-right-panel" ref={tRef}>
               <ProTable
+                size="small"
                 columns={columns}
                 search={false}
+                dataSource={dataSource}
                 toolBarRender={false}
-                params={state.params}
-                actionRef={tRef}
                 rowKey={record => record.id}
-                request={async (params, sort, filter) => {
-                  const {
-                    code = -1,
-                    data: { client = [], total = 0 }
-                  } = await queryContact({ ...params, ...sort, ...filter })
-                  return {
-                    data: client,
-                    success: code === consts.RET_CODE.SUCCESS,
-                    total
-                  }
-                }}
-                // pagination={false}
+                pagination={false}
               />
-              {/* <Table columns={curingcolumns} dataSource={curinglist} pagination={false} /> */}
+              {/* <Table columns={columns} dataSource={state.dataSource} pagination={false} /> */}
             </div>
           </TabPane>
           <TabPane tab="软件锁" key="软件锁">

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

@@ -50,7 +50,7 @@ const Index = props => {
               <CompanyForm customer={state.customer} />
             </div>
           </Col>
-          <Col span={12} flex={{ flexDirection: 'column' }}>
+          <Col span={12} flex={{ flexDirection: 'column' }} className="sheet-box-right">
             <CompanyTabList initData={initData} customerId={id} software={state.software} />
             <CompanyLowerList log={state.log} />
           </Col>

+ 1 - 1
src/pages/Customer/Contact/components/AddContact/index.jsx

@@ -16,7 +16,7 @@ const Addcontact = props => {
       {...layout}
       title="添加联系人"
       trigger={
-        <Button key="button" type="primary">
+        <Button key="button" type="primary" size="small">
           <IconPark type="plus" className="zh-mg-right-5" />
           联系人
         </Button>

+ 1 - 1
src/pages/Customer/Contact/components/ContactDetail/index.jsx

@@ -55,7 +55,7 @@ const ContactDetail = props => {
               <ContanctForm client={state.client} />
             </div>
           </Col>
-          <Col span={12}>
+          <Col span={12} className="sheet-box-right">
             <ContanctTabList clientId={state.client.id} software={state.software} />
             <ContanctLowerList log={state.log} servicelist={state.serviceLog} />
           </Col>