feat: 软件锁维护状态 增加筛选"空"的数据

src/pages/Product/Lock/LockStore/components/LockDetail/LowerList.jsx

@@ -1,23 +1,35 @@
-import { Tabs, Table } from 'antd'
+import { Tabs } from 'antd'
 import consts from '@/consts'
 import { isDevMode } from '@/utils/env'
+import ProTable from '@ant-design/pro-table'
+import type { ProColumns } from '@ant-design/pro-table'
+import { VList } from 'virtuallist-antd'
+import { useMemo } from 'react'
+type LockLowerListProps = {
+  logList: {
+    log: any[]
+  }
+  serviceList: API.ServiceLogItem[]
+}
 
-const LockLowerList = props => {
+const LockLowerList: React.FC<LockLowerListProps> = props => {
   const {
     log: { log: logs = [] }
   } = props
   const { TabPane } = Tabs
-  const columns = [
+  const tableHeight = (document.body.clientHeight - 124 - 54 - 40 - 40 - 4) / 2
+  const columns: ProColumns<API.LogItem>[] = [
     {
       title: '日期',
       dataIndex: 'createTime',
       key: 'createTime',
-      width: 100
+      width: 160
     },
     {
       title: '操作人',
       dataIndex: 'operatorName',
       key: 'operatorName',
+      ellipsis: true,
       width: 115,
       render: (_, record) => (
         <div className="flex items-center flex-row ml-2">
@@ -36,22 +48,39 @@ const LockLowerList = props => {
       title: '操作',
       dataIndex: 'operationType',
       key: 'operationType',
+      ellipsis: true,
       width: 75
     },
     {
       title: '操作内容',
       dataIndex: 'content',
-      key: 'content',
-      width: 150
+      ellipsis: true,
+      key: 'content'
     }
   ]
+  const vList = useMemo(() => {
+    return VList({
+      height: tableHeight,
+      vid: 'lock_log_list'
+    })
+  }, [])
   return (
     <div>
       <div className="pl-4">
         <Tabs>
           <TabPane tab="日志" key="日志">
             <div className="sheet-panel-record">
-              <Table rowKey="id" size="small" columns={columns} dataSource={logs} pagination={false} />
+              <ProTable<API.LogItem>
+                search={false}
+                toolBarRender={false}
+                rowKey="id"
+                columns={columns}
+                dataSource={logs}
+                pagination={false}
+                scroll={{ y: tableHeight }}
+                size="small"
+                components={vList}
+              />
             </div>
           </TabPane>
         </Tabs>

src/pages/Product/Lock/LockStore/components/LockDetail/TabList.jsx

@@ -2,14 +2,23 @@ import React, { useState } from 'react'
 import { Row, Col, List, Tabs, message, Button, Popconfirm } from 'antd'
 import { dayjsFormat } from '@/utils/utils'
 import consts from '@/consts'
+import classNames from 'classnames'
+import { isDevMode } from '@/utils/env'
 import { apiSoftwareAddLonglelog, apiDelLonglelog } from '@/services/product'
 import { ProductLabel } from '@/pages/Product/Lock/LockStore'
 import { lockTypeEnum } from './OpreateLock'
 import { servicelogEnum, showProductsStatus, showNewLongleStatus, showMarkStatus } from './consts'
 import { useDispatch, useAccess } from 'umi'
 import { useModal } from '@/components/ModalStore'
+import TimeLineList from '@/components/TimeLineList'
 
-const LockTabList = props => {
+type LockTabListProps = {
+  logList: {
+    log: any[]
+  }
+  serviceList: API.ServiceLogItem[]
+}
+const LockTabList: React.FC<LockTabListProps> = props => {
   const {
     longle: { id: longleId, keyNum, status, stockStatus, sellStatus, preserveStatus } = {},
     longleLog,
@@ -99,17 +108,33 @@ const LockTabList = props => {
     })
   }
 
+  const renderServiceLogItem = (item: API.ServiceLogItem) => {
+    return (
+      <div className="flex justify-start">
+        <div className="flex">daad</div>
+        <div className="flex flex-col items-center ml-2">我</div>
+      </div>
+    )
+  }
+
   return (
     <div>
       <div className="pl-4">
         <Tabs>
           <TabPane tab="记录内容" key="记录内容">
             <div className="sheet-panel-record">
-              <Row>
+              <TimeLineList<API.ServiceLogItem>
+                rowkey="id"
+                mode="line"
+                dataField="createTime"
+                dataSource={longleLog}
+                renderItem={item => renderServiceLogItem(item)}
+              />
+              {/* <Row>
                 <Col span="8">类型/时间</Col>
                 <Col span="16">服务内容</Col>
-              </Row>
-              <List
+              </Row> */}
+              {/* <List
                 dataSource={longleLog}
                 split={false}
                 renderItem={item => (
@@ -125,13 +150,9 @@ const LockTabList = props => {
                         <br />
                         <a>@{item.operator}</a>{' '}
                         <span className="text-gray-500">{dayjsFormat(item.dateline, 'YYYY-MM-DD')}</span>
-                        {/* <List.Item.Meta
-                          description={ dayjsFormat(item.updatetime, 'MM-DD HH:mm')}
-                        /> */}
                       </Col>
                       <Col span="16">
                         {renderLongleCon(item)}
-                        {/* <RenderLongleCon longleService={item} /> */}
                         {hasAddPerm &&
                         (item.status === 3 || item.status === 4 || item.status === 5 || item.status === 9) ? (
                           <Popconfirm
@@ -148,26 +169,13 @@ const LockTabList = props => {
                     </Row>
                   </List.Item>
                 )}
-              />
+              /> */}
             </div>
           </TabPane>
         </Tabs>
       </div>
       <div className="sheet-btns pl-4 pt-4 flex">
-        {/* <Button
-          type="primary"
-          ghost
-          size="small"
-          className="mr-3px"
-          onClick={() => openLockModal(lockTypeEnum.RECEIVE)}>
-          {[1].includes(stockStatus) ? '接收' : null}
-          {([1, 2].includes(stockStatus) && [0].includes(sellStatus)) || [3].includes(preserveStatus)
-            ? '借销赠'
-            : null}
-          {[1, 2].includes(sellStatus) && [1, 3].includes(preserveStatus) ? '更换' : null}
-          {[1, 2].includes(preserveStatus) ? '收回' : null}
-        </Button> */}
-        {stockStatus !== 2 ? (
+        {[1].includes(stockStatus) ? (
           <Button
             type="primary"
             ghost
@@ -177,7 +185,7 @@ const LockTabList = props => {
             接收
           </Button>
         ) : null}
-        {(stockStatus !== 0 && sellStatus === 0) || preserveStatus === 3 ? (
+        {([1, 2].includes(stockStatus) && sellStatus === 0) || preserveStatus === 3 ? (
           <Button
             type="primary"
             ghost
@@ -187,7 +195,7 @@ const LockTabList = props => {
             借销赠
           </Button>
         ) : null}
-        {sellStatus !== 0 && preserveStatus !== 2 ? (
+        {[1, 2].includes(sellStatus) && [1, 3].includes(preserveStatus) ? (
           <Button
             type="primary"
             ghost
@@ -197,7 +205,7 @@ const LockTabList = props => {
             更换
           </Button>
         ) : null}
-        {preserveStatus !== 3 ? (
+        {[0, 1, 2].includes(preserveStatus) ? (
           <Button
             type="primary"
             ghost

src/pages/Product/Lock/LockStore/index.jsx

@@ -183,7 +183,7 @@ const LockStore = ({ prodList = [], dispatch, shouldUpdate }) => {
         1: { text: '升级' },
         2: { text: '更换' },
         3: { text: '收回' },
-        4: { text: '无维护' }
+        99: { text: '无维护' }
       },
       render: (_, { preserveStatus }) => {
         return <>{longlePreserveStatusNum[preserveStatus]?.text}</>