Jelajahi Sumber

feat: 完善leftmenu顶部的项目名称

lanjianrong 4 tahun lalu
induk
melakukan
99b602139d

+ 9 - 0
src/assets/css/common.scss

@@ -629,3 +629,12 @@
     @include space-calc($i, 6);
   }
 }
+
+@for $i from 1 through 2 {
+  .pi-ellipsis-#{$i} {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: #{$i};
+    overflow: hidden;
+  }
+}

+ 14 - 5
src/components/LeftSide/index.tsx

@@ -1,12 +1,17 @@
 import SvgIcon from '@/components/SvgIcon'
 import { userStore } from '@/store/mobx'
 import { iNavSide } from '@/types/router'
+import { Tooltip } from 'antd'
 import { observer } from 'mobx-react'
-import React from 'react'
+import React, { useEffect } from 'react'
 import { Link } from 'react-router-dom'
 import "./index.scss"
-
-const leftSide:React.FC<iNavSide> = ({ childRoutes, location }) => {
+const LeftSide:React.FC<iNavSide> = ({ childRoutes, location }) => {
+  useEffect(() => {
+    if (!userStore.projectInfo.id) {
+      userStore.getProjectInfo()
+    }
+  }, [])
   const pathname = location.pathname
   const route = childRoutes.find(item => pathname.indexOf(item.path) !== -1)
   let basePathname = location.pathname
@@ -16,7 +21,11 @@ const leftSide:React.FC<iNavSide> = ({ childRoutes, location }) => {
   return (
     <div className={userStore.showLeftSide ? "panel-sidebar" : "scale-out-hor-left"}>
       <div>
-        <div className="pi-pd-10 pi-mg-bottom-10 sidebar-title">项目设置</div>
+        <Tooltip title={userStore.projectName} placement="right">
+          <div className="pi-pd-10 pi-mg-bottom-10 sidebar-title ">
+            <span className="pi-ellipsis-2">{userStore.projectName}</span>
+          </div>
+        </Tooltip>
         <div className="pi-flex-column pi-justify-start">
           { childRoutes.map((item, idx) =>
             item.meta && <Link key={idx} to={{ pathname: basePathname + item.path }} className={pathname.indexOf(item.path) !== -1 ? 'nav-link active' : 'nav-link'}>{item.meta.icon ? <SvgIcon type={item.meta.icon}></SvgIcon> : ''} {item.meta.title}</Link>
@@ -34,4 +43,4 @@ const leftSide:React.FC<iNavSide> = ({ childRoutes, location }) => {
   )
 }
 
-export default observer(leftSide)
+export default observer(LeftSide)

+ 0 - 1
src/index.scss

@@ -5,7 +5,6 @@ body {
   padding: 0;
   margin: 0;
   font-size: 12px;
-  background: #e4e7ea;
   #root {
     width: 100%;
     height: 100%;

+ 5 - 1
src/pages/Contract/List/index.tsx

@@ -8,13 +8,14 @@ import { CaretDownOutlined } from '@ant-design/icons'
 import { useContractTree, useTableExpand } from '@/utils/common/customHooks'
 import { Button, Dropdown, Menu, Table } from 'antd'
 import { ColumnsType } from 'antd/lib/table'
-import React, { useEffect } from 'react'
+import React, { useState, useEffect } from 'react'
 import { useAliveController } from 'react-activation'
 import { RouteComponentProps, withRouter } from 'react-router-dom'
 import { apiContractList } from './api'
 import styles from './index.module.scss'
 const List: React.FC<RouteComponentProps> = (props) => {
   const { clear } = useAliveController()
+  const [ loading, setLoading ] = useState<boolean>(false)
   useEffect(() => {
     // 清除所有的缓存页面
     clear()
@@ -22,9 +23,11 @@ const List: React.FC<RouteComponentProps> = (props) => {
   }, [])
 
   const getTree = async () => {
+    setLoading(true)
     const { data, code = -1 } = await apiContractList()
     if (code === consts.RET_CODE.SUCCESS) {
       setTree(data)
+      setLoading(false)
     }
   }
 
@@ -115,6 +118,7 @@ const List: React.FC<RouteComponentProps> = (props) => {
       <div className={styles.tableContent}>
         <Table<ContractTree>
           columns={columns}
+          loading={loading}
           dataSource={tree.children}
           pagination={false}
           rowKey={record => record.id}

+ 4 - 9
src/pages/Quality/List/index.tsx

@@ -14,10 +14,6 @@ import { RouteComponentProps, withRouter } from 'react-router-dom'
 import { apiContractList } from './api'
 import styles from './index.module.scss'
 
-interface TableState {
-  loading: boolean
-  expandedIds: string[]
-}
 const List: React.FC<RouteComponentProps> = props => {
   const { clear } = useAliveController()
   useEffect(() => {
@@ -27,14 +23,13 @@ const List: React.FC<RouteComponentProps> = props => {
   }, [])
   const [ tree, setTree ] = useContractTree()
   const [ expandedRowKeys, setRowKeys ] = useTableExpand(tree)
-
-  const [ tableState, setTableState ] = useState<TableState>({ loading: false, expandedIds: [] })
+  const [ loading, setLoading ] = useState<boolean>(false)
   const getTree = async () => {
-    setTableState({ ...tableState, loading: true })
+    setLoading(true)
     const { data, code = -1 } = await apiContractList()
     if (code === consts.RET_CODE.SUCCESS) {
       setTree(data)
-      setTableState({ ...tableState, loading: false })
+      setLoading(false)
     }
   }
 
@@ -117,7 +112,7 @@ const List: React.FC<RouteComponentProps> = props => {
       </Header>
       <div className={styles.tableContent}>
         <Table<ContractTree>
-          loading={tableState.loading}
+          loading={loading}
           columns={columns}
           dataSource={tree.children}
           pagination={false}

+ 25 - 11
src/pages/Safe/List/index.tsx

@@ -13,17 +13,20 @@ import { useAliveController } from 'react-activation'
 import { RouteComponentProps, withRouter } from 'react-router-dom'
 import { apiContractList } from './api'
 import styles from './index.module.scss'
-const List: React.FC<RouteComponentProps> = (props) => {
+const List: React.FC<RouteComponentProps> = props => {
   const { clear } = useAliveController()
+  const [ loading, setLoading ] = useState<boolean>(false)
   useEffect(() => {
     // 清除所有的缓存页面
     clear()
     getTree()
   }, [])
   const getTree = async () => {
+    setLoading(true)
     const { data, code = -1 } = await apiContractList()
     if (code === consts.RET_CODE.SUCCESS) {
       setTree(data)
+      setLoading(false)
     }
   }
   const [ tree, setTree ] = useContractTree()
@@ -33,7 +36,7 @@ const List: React.FC<RouteComponentProps> = (props) => {
     tenderStore.saveTenderInfo({ bidsectionId: id, name })
     props.history.push('/console/safe/content/summary')
   }
-  const columns:ColumnsType<ContractTree> = [
+  const columns: ColumnsType<ContractTree> = [
     {
       title: '名称',
       dataIndex: 'name',
@@ -41,12 +44,21 @@ const List: React.FC<RouteComponentProps> = (props) => {
       width: '40%',
       render: (text: string, record: ContractTree) => {
         if (record.isfolder) {
-          return <div style={{ verticalAlign: "baseline" }}><SvgIcon type={record.hasFolder ? "xxh-folder-open" : "xxh-folder"} /><span className="pi-mg-left-2">{text}</span></div>
+          return (
+            <div style={{ verticalAlign: 'baseline' }}>
+              <SvgIcon type={record.hasFolder ? 'xxh-folder-open' : 'xxh-folder'} />
+              <span className="pi-mg-left-2">{text}</span>
+            </div>
+          )
         } else {
-        return <div><span style={{ color: '#6c757d', marginRight: '.5rem' }}>{record.isEnd ? '└' : '├'}</span>
-          {/* <Link to={{ pathname: '/console/safe/content/summary', search: `?bid=${record.id}` }}>{text}</Link> */}
-          <span className="pi-link-blue" onClick={() => linkHandler(record.bidsectionId, record.name)}>{text}</span>
-        </div>
+          return (
+            <div>
+              <span style={{ color: '#6c757d', marginRight: '.5rem' }}>{record.isEnd ? '└' : '├'}</span>
+              <span className="pi-link-blue" onClick={() => linkHandler(record.bidsectionId, record.name)}>
+                {text}
+              </span>
+            </div>
+          )
         }
       }
     },
@@ -90,21 +102,23 @@ const List: React.FC<RouteComponentProps> = (props) => {
       <Header>
         <Slot>
           <Dropdown overlay={menu}>
-            <Button type="text" size="small" className={styles.textBtn}>展开/收起<CaretDownOutlined /></Button>
+            <Button type="text" size="small" className={styles.textBtn}>
+              展开/收起
+              <CaretDownOutlined />
+            </Button>
           </Dropdown>
         </Slot>
       </Header>
       <div className={styles.tableContent}>
         <Table<ContractTree>
           columns={columns}
+          loading={loading}
           dataSource={tree.children}
           pagination={false}
           rowKey={record => record.id}
           indentSize={20}
           expandable={{ expandedRowKeys, onExpand: setRowKeys }}
-          bordered
-        >
-        </Table>
+          bordered></Table>
       </div>
     </div>
   )

+ 0 - 1
src/store/mobx/tender/index.ts

@@ -25,7 +25,6 @@ class Tender {
     name: ''
   }
 
-  // @observable projectInfo:ProjectInfo = { name: '', code: '' }
   @observable permission:AuthController = {
     contract: { access: 0, add: 0, delete: 0 },
     quality: { access: 0, add: 0, delete: 0 },