Parcourir la source

feat: 云版详情、大司空2.0企业版详情中左侧栏附加项的ui界面

lanjianrong il y a 4 ans
Parent
commit
f5ecea0913

+ 5 - 6
.prettierrc.js

@@ -9,8 +9,7 @@ module.exports = {
   trailingComma: 'none',
   bracketSpacing: true,
   arrowParens: 'avoid',
-
-  printWidth: 100,
+  printWidth: 120,
   tabWidth: 2,
   singleQuote: true,
   quoteProps: 'as-needed',
@@ -26,8 +25,8 @@ module.exports = {
     {
       files: '*.md',
       options: {
-        tabWidth: 2,
-      },
-    },
-  ],
+        tabWidth: 2
+      }
+    }
+  ]
 }

+ 30 - 33
src/pages/Product/Cloud/components/CardDetail/index.jsx

@@ -1,4 +1,4 @@
-import { Card } from 'antd'
+import { Descriptions } from 'antd'
 import React, { useState } from 'react'
 import { useModal } from '@/components/ModalStore'
 import styles from './index.less'
@@ -6,41 +6,38 @@ 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>
+    <Descriptions title={<h2 className="font-medium">CLD客户</h2>} bordered size="small">
+      <Descriptions.Item label="客户姓名" span={3} labelStyle={{ width: '120px' }}>
+        <div
+          onClick={() => dispatchModal('D_CLIENT_DETAIL', { dataId: client.id })}
+          className="text-primary cursor-pointer hover:text-hex-967bbd"
+        >
+          {client.clientName}
         </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>
+      </Descriptions.Item>
+
+      <Descriptions.Item label="单位名称" span={3} labelStyle={{ width: '120px' }}>
+        <div
+          onClick={() => dispatchModal('D_COMPANY_DETAIL', { dataId: client.companyId })}
+          className="text-primary cursor-pointer hover:text-hex-967bbd"
+        >
+          {client.companyName}
         </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>
+      </Descriptions.Item>
+      <Descriptions.Item label="手机" span={3} labelStyle={{ width: '120px' }}>
+        {client.telephone}
+      </Descriptions.Item>
+      <Descriptions.Item label="QQ" span={3} labelStyle={{ width: '120px' }}>
+        {client.qq}
+      </Descriptions.Item>
+      <Descriptions.Item label="部门" span={3} labelStyle={{ width: '120px' }}>
+        {client.department}
+      </Descriptions.Item>
+      <Descriptions.Item label="职务" span={3} labelStyle={{ width: '120px' }}>
+        {client.position}
+      </Descriptions.Item>
+    </Descriptions>
   )
 }
 

+ 0 - 36
src/pages/Product/Road/Enterprise/components/ComapnyDetail/index.jsx

@@ -1,36 +0,0 @@
-import { Card } from 'antd'
-import React, { useState } from 'react'
-import { useModal } from '@/components/ModalStore'
-import styles from '@/pages/Product/Cloud/components/CardDetail/index.less'
-
-const CardComapnyDetail = props => {
-  const { company } = 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_COMPANY_DETAIL', {
-                dataId: company.id,
-                orderIds: state.orderIds
-              })
-            }
-            className="text-primary cursor-pointer hover:text-[#967bbd]">
-            {company.companyName}
-          </span>
-        </div>
-        <div className="py-3">单位地区:{company.districtName}</div>
-        <div className="py-3">单位电话:{company.phone}</div>
-        <div className="py-3">单位性质:{company.tagCooperationName}</div>
-      </Card>
-    </div>
-  )
-}
-
-export default CardComapnyDetail

+ 35 - 0
src/pages/Product/Road/Enterprise/components/Detail/CldCompany.jsx

@@ -0,0 +1,35 @@
+import { Card, Descriptions } from 'antd'
+import React, { useState } from 'react'
+import { useModal } from '@/components/ModalStore'
+import styles from '@/pages/Product/Cloud/components/CardDetail/index.less'
+import { isNullOrUnDef } from '@/utils/is'
+const CldCompany = ({ company }) => {
+  const dispatchModal = useModal()
+  return isNullOrUnDef(company) ? null : (
+    <Descriptions title={<h2 className="font-medium">CLD单位信息</h2>} bordered size="small">
+      <Descriptions.Item label="单位全称" span={3} labelStyle={{ width: '120px' }}>
+        <div
+          onClick={() =>
+            dispatchModal('D_COMPANY_DETAIL', {
+              dataId: company.id
+            })
+          }
+          className="text-primary cursor-pointer hover:text-hex-967bbd"
+        >
+          {company.companyName}
+        </div>
+      </Descriptions.Item>
+      <Descriptions.Item label="地区" span={3} labelStyle={{ width: '120px' }}>
+        {company.districtName}
+      </Descriptions.Item>
+      <Descriptions.Item label="手机" span={3} labelStyle={{ width: '120px' }}>
+        {company.phone}
+      </Descriptions.Item>
+      <Descriptions.Item label="QQ" span={3} labelStyle={{ width: '120px' }}>
+        {company.tagCooperationName}
+      </Descriptions.Item>
+    </Descriptions>
+  )
+}
+
+export default CldCompany

+ 5 - 11
src/pages/Product/Road/Enterprise/components/Detail/index.jsx

@@ -6,19 +6,12 @@ import consts from '@/consts'
 import EnterpriseForm from './Form'
 import EnterpriseLowerList from './LowerList'
 import EnterpriseTabList from './TabList'
-import CardComapnyDetail from '@/pages/Product/Road/Enterprise/components/ComapnyDetail'
+import CldCompany from './CldCompany'
 import { LinkInterrupt, LinkOne } from '@icon-park/react'
 import { useModal } from '@/components/ModalStore'
 
 const EnterpriseDetail = props => {
-  const {
-    dispatch,
-    updateKey = 'enterprise',
-    refresh,
-    visible,
-    dataId = '',
-    ...resetDrawerProps
-  } = props
+  const { dispatch, updateKey = 'enterprise', refresh, visible, dataId = '', ...resetDrawerProps } = props
   const [state, setState] = useState({
     loading: false,
     company: {},
@@ -117,7 +110,7 @@ const EnterpriseDetail = props => {
                 {state.company.cld?.customerId ? (
                   <>
                     <div className="mt-4">
-                      <CardComapnyDetail company={state.customer} />
+                      <CldCompany company={state.customer} />
                     </div>
                     <div className="text-center mt-6">
                       <Tooltip placement="right" title="移除CLD客户">
@@ -125,7 +118,8 @@ const EnterpriseDetail = props => {
                           type="primary"
                           ghost
                           size="small"
-                          onClick={() => pricingUnLinkCompany(state.company.cld?.customerId)}>
+                          onClick={() => pricingUnLinkCompany(state.company.cld?.customerId)}
+                        >
                           <LinkInterrupt size="14" />
                           <span className="ml-5px">移除CLD单位信息</span>
                         </Button>

+ 0 - 6
windi.config.ts

@@ -25,12 +25,6 @@ export default defineConfig({
       },
       boxShadow: {
         card: '0 0 13px 0 rgba(74, 53, 107, 0.08)'
-      },
-      zIndex: {
-        max: 999,
-        1060: 1060,
-        1050: 1050,
-        1040: 1040
       }
     }
   }