feat: 大司空2.0企业版创建企业弹窗

src/components/ModalStore/index.tsx

@@ -22,6 +22,7 @@ import MessageDetail from '@/pages/Hr/Notification/components/MessageDetail'
 import CloudDetail from '@/pages/Product/Cloud/components/Detail'
 import PersonalDetail from '@/pages/Product/Road/Personal/components/Detail'
 import EnterpriseDetail from '@/pages/Product/Road/Enterprise/components/Detail'
+import AddEnterprise from '@/pages/Product/Road/Enterprise/components/AddEnterprise'
 const modalMap = {
   M_CLIENT_ADD: AddClient, // 添加客户弹窗
   M_COMPANY_ADD: AddCompany, // 添加单位弹窗
@@ -44,7 +45,8 @@ const modalMap = {
   D_NOTICE_DETAIL: MessageDetail, // 通知详情
   D_CLOUD_DETAIL: CloudDetail, // 云版详情
   D_PERSONAL_DETAIL: PersonalDetail, // 大司空2.0个人版详情
-  D_ENTERPRISE_DETAIL: EnterpriseDetail // 大司空2.0企业版详情
+  D_ENTERPRISE_DETAIL: EnterpriseDetail, // 大司空2.0企业版详情
+  M_ENTERPRISE_ADD: AddEnterprise // 大司空2.0企业版添加企业
 }
 
 export const useModal = createModalHook<typeof modalMap>()

src/pages/Customer/Company/components/AddCompany/CompanyFormItem.jsx

@@ -79,8 +79,7 @@ const CompanyFormItem = ({ value, onChange, validateFn }) => {
               <p key={item.id}>
                 <span
                   className="text-primary cursor-pointer hover:text-hex-967bbd"
-                  onClick={() => dispatchModal('D_COMPANY_DETAIL', { dataId: item.id })}
-                >
+                  onClick={() => dispatchModal('D_COMPANY_DETAIL', { dataId: item.id })}>
                   {item.companyName}
                 </span>
                 <span className="mx-1">/</span>
@@ -89,8 +88,7 @@ const CompanyFormItem = ({ value, onChange, validateFn }) => {
             )
           })}
         </ul>
-      }
-    >
+      }>
       <Input
         type="text"
         autoComplete="false"

src/pages/Product/Road/Enterprise/components/AddEnterprise/EnterpriseFormItem.jsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+const EnterpriseFormItem = () => {
+  return (
+    <div>
+      <span>弹窗</span>
+    </div>
+  )
+}
+
+export default EnterpriseFormItem

src/pages/Product/Road/Enterprise/components/AddEnterprise/index.jsx

@@ -0,0 +1,83 @@
+import { ProFormText } from '@ant-design/pro-form'
+import { Button, Form, Input, InputNumber, Modal, Select, Space } from 'antd'
+import React from 'react'
+
+const AddEnterprise = (visible, onCancel, onConfirm, ...resetModalProps) => {
+  const layout = {
+    layout: 'horizontal',
+    labelCol: { flex: '100px' }
+  }
+  const selectProps = {
+    mode: 'multiple',
+    style: { width: '100%' },
+    placeholder: '请选择授权定额',
+    maxTagCount: 'responsive'
+  }
+  const [formRef] = Form.useForm()
+  const handleOnOk = () => {
+    formRef
+      ?.validateFields()
+      .then(async values => {
+        try {
+          const successs = await onConfirm(values)
+          if (successs) {
+            !isNullOrUnDef(reload) && reload()
+            formRef?.resetFields()
+            setTimeout(() => {
+              setValidStatusFcn('')
+              onCancel()
+            }, 80)
+          }
+        } catch (error) {}
+      })
+      .catch(({ values }) => {
+        if ('companyName' in values && !values.companyName) {
+          setValidStatusFcn(validateEnum.Error)
+        }
+      })
+  }
+  return (
+    <Modal
+      {...resetModalProps}
+      visible={visible}
+      onCancel={onCancel}
+      title="创建企业"
+      width="43vw"
+      footer={
+        <div>
+          <Button type="default" className="mr-2" onClick={onCancel}>
+            取消
+          </Button>
+          <Button type="primary" onClick={handleOnOk}>
+            确认
+          </Button>
+        </div>
+      }>
+      <Form {...layout} form={formRef}>
+        <ProFormText
+          name="companyName"
+          label="创建企业"
+          placeholder="请输入企业"
+          rules={[{ required: true, message: '请输入企业' }]}
+        />
+        <Form.Item name="licenceNum" label="授权数量" rules={[{ required: true }]}>
+          <InputNumber />
+        </Form.Item>
+        <Form.Item name="licenceNum" label="授权定额" rules={[{ required: true }]}>
+          <Space direction="vertical" style={{ width: '100%' }}>
+            <Select {...selectProps} />
+          </Space>
+        </Form.Item>
+        {/* <ProFormText name="cptList" label="授权定额" rules={[{ required: true }]} /> */}
+        <ProFormText
+          name="adminID"
+          label="管理员名称"
+          rules={[{ required: true }]}
+          disabled={true}
+        />
+      </Form>
+    </Modal>
+  )
+}
+
+export default AddEnterprise

src/pages/Product/Road/Enterprise/components/Detail/Form.jsx

@@ -61,11 +61,11 @@ const EnterpriseForm = props => {
         <Col span={8}>
           <h2 className="text-gray-500">企业信息</h2>
         </Col>
-        <Col span={16}>
-          {company.name}创建于 {company.registerTime}
+        <Col span={16} className="text-right text-gray-500">
+          {company.client_name}创建于 {company.registerTime}
         </Col>
         <Col span={22}>
-          <h2 className="text-2xl pb-4">{company.mobile}</h2>
+          <h2 className="text-2xl pb-4">{company.name}</h2>
         </Col>
         <Col span={2} />
       </Row>

src/pages/Product/Road/Enterprise/components/Detail/TabList.jsx

@@ -1,8 +1,11 @@
 import { Button, Tabs, Tag } from 'antd'
 import React, { useRef } from 'react'
 import ProTable from '@ant-design/pro-table'
+import { renderBadge } from '@/pages/Workbench/Dashboard/components/RatioPanels'
 
-const EnterpriseTabList = () => {
+const EnterpriseTabList = props => {
+  const { authUsers, compilationList } = props
+  console.log(authUsers.users)
   const { TabPane } = Tabs
   const tRef = useRef(null)
   const columns = [
@@ -28,29 +31,23 @@ const EnterpriseTabList = () => {
       width: '10%'
     }
   ]
-  // const columnOnline = [
-  //   {
-  //     title: '产品',
-  //     dataIndex: 'name',
-  //     width: '30%',
-  //     render: (_, record) => <Tag color="purple">{record.name}</Tag>
-  //   },
-  //   {
-  //     title: '状态',
-  //     dataIndex: 'isUpgrade',
-  //     width: '8%'
-  //   },
-  //   {
-  //     title: '限期',
-  //     dataIndex: 'deadline',
-  //     width: '10%'
-  //   },
-  //   {
-  //     title: '责任人',
-  //     dataIndex: 'a1',
-  //     width: '10%'
-  //   }
-  // ]
+  const columnOnline = [
+    {
+      title: '姓名',
+      dataIndex: 'name',
+      width: '15%'
+    },
+    {
+      title: '手机',
+      dataIndex: 'phone',
+      width: '8%'
+    },
+    {
+      title: '职位',
+      dataIndex: 'position',
+      width: '10%'
+    }
+  ]
   return (
     <div>
       <div className="pl-15px">
@@ -63,24 +60,24 @@ const EnterpriseTabList = () => {
                 search={false}
                 toolBarRender={false}
                 // eslint-disable-next-line no-underscore-dangle
-                // rowKey={record => record._id}
-                // dataSource={compilationList}
+                rowKey={record => record._id}
+                dataSource={compilationList}
                 pagination={false}
               />
             </div>
           </TabPane>
-          <TabPane tab={<span>授权用户</span>} key="2">
+          <TabPane tab={<span>授权用户{renderBadge(authUsers.total, true)}</span>} key="2">
             <div className="sheet-right-panel">
-              {/* <ProTable
+              <ProTable
                 size="small"
                 columns={columnOnline}
                 search={false}
                 toolBarRender={false}
                 // eslint-disable-next-line no-underscore-dangle
-                // rowKey={record => record._id}
-                // dataSource={online_list}
+                rowKey={record => record.id}
+                dataSource={authUsers.users}
                 pagination={false}
-              /> */}
+              />
             </div>
           </TabPane>
         </Tabs>

src/pages/Product/Road/Enterprise/components/Detail/index.jsx

@@ -20,6 +20,7 @@ const EnterpriseDetail = props => {
     loading: false,
     company: {},
     compilationList: [],
+    authUsers: {},
     client: [],
     serviceLog: [],
     log: {}
@@ -34,7 +35,14 @@ const EnterpriseDetail = props => {
   const initData = async id => {
     setState({ ...state, loading: true })
     const {
-      data: { company = {}, compilationList = [], client = [], serviceLog = [], log = {} },
+      data: {
+        company = {},
+        compilationList = [],
+        authUsers = {},
+        client = [],
+        serviceLog = [],
+        log = {}
+      },
       code = -1
     } = await apiRoadcompanyDetail({ companyId: id })
     if (code === consts.RET_CODE.SUCCESS) {
@@ -44,7 +52,16 @@ const EnterpriseDetail = props => {
           payload: updateKey
         })
       }
-      setState({ ...state, company, compilationList, client, serviceLog, log, loading: false })
+      setState({
+        ...state,
+        company,
+        compilationList,
+        authUsers,
+        client,
+        serviceLog,
+        log,
+        loading: false
+      })
     }
   }
   useEffect(() => {
@@ -64,7 +81,10 @@ const EnterpriseDetail = props => {
               </div>
             </Col>
             <Col span={15} className="sheet-box-right">
-              <EnterpriseTabList />
+              <EnterpriseTabList
+                compilationList={state.compilationList}
+                authUsers={state.authUsers}
+              />
               <EnterpriseLowerList log={state.log} />
             </Col>
           </Row>

src/pages/Product/Road/Enterprise/index.jsx

@@ -1,12 +1,12 @@
 import BasicTable from '@/components/Table'
-import { queryRoadcompanyList } from '@/services/product'
+import { apiRoadAddCompany, queryRoadcompanyList } from '@/services/product'
 import { Button, Input } from 'antd'
 import React, { useState, useRef } from 'react'
 import { generateSortField } from '@/utils/utils'
 import consts from '@/consts'
 import { useModal } from '@/components/ModalStore'
 
-const Enterprise = props => {
+const Enterprise = () => {
   const dispatchModal = useModal()
   const [state, setState] = useState({
     params: {
@@ -14,6 +14,15 @@ const Enterprise = props => {
     }
   })
   const tRef = useRef()
+  const handleAddEnterprise = async values => {
+    const params = formatValues(values)
+    const { code = -1 } = await apiRoadAddCompany(params)
+    if (code === consts.RET_CODE.SUCCESS) {
+      message.success('新增成功')
+      initData()
+    }
+    return code === consts.RET_CODE.SUCCESS
+  }
   const columns = [
     {
       title: '企业名称',
@@ -103,7 +112,15 @@ const Enterprise = props => {
             />
           ),
           actions: [
-            <Button type="primary" key="addClientBtn">
+            <Button
+              type="primary"
+              key="addClientBtn"
+              onClick={() =>
+                dispatchModal('M_ENTERPRISE_ADD', {
+                  onConfirm: handleAddEnterprise,
+                  reload: () => tRef.current?.reload()
+                })
+              }>
               创建企业
             </Button>
           ]