Explorar el Código

feat: 软件锁责任人弹窗相关

outaozhen hace 5 años
padre
commit
663c823ffa

+ 11 - 0
src/pages/Product/Lock/Lockstore/components/SoftwareDetail/LowerList.jsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+const LowerList = () => {
+  return (
+    <div>
+      <b>ffawdwa</b>
+    </div>
+  )
+}
+
+export default LowerList

+ 46 - 0
src/pages/Product/Lock/Lockstore/components/SoftwareDetail/StaffDetail.jsx

@@ -0,0 +1,46 @@
+import React from 'react'
+import { Row, Col, Divider } from 'antd'
+
+const StaffDetail = props => {
+  const { staff } = props
+  console.log(staff)
+  return (
+    <div>
+      <Row>
+        <Col span={8}>
+          <h2 className="text-gray-500">责任人</h2>
+        </Col>
+        {/* className={[ 'text-right', styles.textMuted ]} */}
+        <Col span={16} className="text-right text-gray-500">
+          注册于 {staff.hiredate}
+        </Col>
+        <Col span={22}>
+          <h2 className="text-2xl pb-4">{staff.username}</h2>
+        </Col>
+        <Col span={2} />
+      </Row>
+      <Row>
+        <Divider />
+        <Col span={6}>性别</Col>
+        <Col span={18}>{staff.gender}</Col>
+        <Divider />
+        <Col span={6}>部门</Col>
+        <Col span={18}>{staff.departmentName}</Col>
+        <Divider />
+        <Col span={6}>手机</Col>
+        <Col span={18}>{staff.avtelephoneatar}</Col>
+        <Divider />
+        <Col span={6}>电话</Col>
+        <Col span={18}>{staff.phone}</Col>
+        <Divider />
+        <Col span={6}>QQ</Col>
+        <Col span={18}>{staff.qq}</Col>
+        <Divider />
+        <Col span={6}>邮箱</Col>
+        <Col span={18}>{staff.email}</Col>
+      </Row>
+    </div>
+  )
+}
+
+export default StaffDetail

+ 11 - 0
src/pages/Product/Lock/Lockstore/components/SoftwareDetail/TabList.jsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+const TabList = () => {
+  return (
+    <div>
+      <b>fsfsef</b>
+    </div>
+  )
+}
+
+export default TabList

+ 59 - 0
src/pages/Product/Lock/Lockstore/components/SoftwareDetail/index.jsx

@@ -0,0 +1,59 @@
+import React, { useState, useEffect } from 'react'
+import { Row, Col } from 'antd'
+import consts from '@/consts'
+import { apiStaffDetail } from '@/services/staff'
+import Detail from './StaffDetail'
+import TabList from './TabList'
+import LowerList from './LowerList'
+import { connect } from 'dva'
+
+const SoftwareDetail = props => {
+  const { dispatch, shouldUpdate, visible, dataId = '' } = props
+  const [state, setState] = useState({
+    loading: false,
+    staff: {},
+    log: []
+  })
+  const initData = async id => {
+    setState({ ...state, loading: true })
+    const {
+      data: { staff = {}, log = [] },
+      code = -1
+    } = await apiStaffDetail(id)
+    if (code === consts.RET_CODE.SUCCESS) {
+      if (shouldUpdate) {
+        dispatch({
+          type: 'refresh/commitAction',
+          payload: 'stafflist'
+        })
+      }
+      setState({ ...state, staff, log, loading: false })
+    }
+  }
+  useEffect(() => {
+    shouldUpdate && initData(dataId)
+  }, [shouldUpdate])
+  useEffect(() => {
+    visible && initData(dataId)
+  }, [visible])
+  return (
+    <div className="sheet-box">
+      <Row>
+        <Col span={12} className="sheet-box-left">
+          <div className="sheet-left-panel pr-4">
+            <Detail longle={state.staff} />
+          </div>
+        </Col>
+        <Col span={12} className="sheet-box-right">
+          <TabList />
+          <LowerList />
+        </Col>
+      </Row>
+    </div>
+  )
+}
+
+export default connect(({ refresh, single }) => ({
+  visible: single.drawer.visible,
+  shouldUpdate: refresh.stafflist
+}))(SoftwareDetail)

+ 23 - 2
src/pages/Product/Lock/Lockstore/index.jsx

@@ -5,6 +5,7 @@ import consts from '@/consts'
 import { queryLock } from '@/services/lock'
 import LocksDetail from '@/pages/Product/Lock/LockStore/components/LocksDetail'
 import ContactDetail from '@/pages/Customer/Client/components/ContactDetail'
+import SoftwareDetail from '@/pages/Product/Lock/LockStore/components/SoftwareDetail'
 import { useModal } from '@/components/Modal'
 import { useTableScroll } from '@/hooks/useAutoTable'
 
@@ -63,7 +64,7 @@ const LockStore = () => {
     })
     toggleDrawer()
   }
-  // 展示drawer
+  // 展示DrawerClient
   const showDrawerClient = id => {
     setDrawerProps({
       closable: true,
@@ -76,6 +77,19 @@ const LockStore = () => {
     })
     toggleDrawer()
   }
+  // 展示DrawerResponsible
+  const showDrawerResponsible = id => {
+    setDrawerProps({
+      closable: true,
+      onClose: () => toggleDrawer(),
+      bodyStyle: {
+        height: '100vh',
+        overflowY: 'hidden'
+      },
+      children: <SoftwareDetail dataId={id} orderIds={state.orderIds} />
+    })
+    toggleDrawer()
+  }
   const columns = [
     {
       title: '锁号',
@@ -122,7 +136,14 @@ const LockStore = () => {
       title: '责任人',
       dataIndex: 'responsible',
       key: 'responsible',
-      width: 150
+      width: 150,
+      render: (responsible, record) => (
+        <span
+          onClick={() => showDrawerResponsible(record.clientId)}
+          className="text-primary cursor-pointer hover:text-[#967bbd]">
+          {responsible}
+        </span>
+      )
     },
     {
       title: '状态',