diff --git a/public/favicon.ico b/public/favicon.ico old mode 100755 new mode 100644 index 05b9d163e..75a4c3dfd Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/src/App.js b/src/App.js index 556d5c4d3..5105d3ec7 100644 --- a/src/App.js +++ b/src/App.js @@ -73,6 +73,10 @@ const EducoderLogin = Loadable({ loader: () => import('./modules/login/EducoderLogin'), loading: Loading, }) +const Search = Loadable({ + loader: () => import('./modules/search/'), + loading: Loading, +}) class App extends Component { constructor(props) { @@ -247,6 +251,10 @@ class App extends Component { {/*404*/} + + {/* 查询 */} + + {/* 个人主页 */} { + const [openSearch, setOpenSearch] = useState(false); + + function onGlobalSearch(value) { + history.push('/search?value=' + value); + // window.location.href = `search?value=` + value; + // history.push({ + // pathname:'/search', + // state:value + // }) + } + return ( + + { + openSearch ? +
{ + setTimeout(() => { + setOpenSearch(false) + }, 500) + }} + > + +
+ : + { + setOpenSearch(true) + }} /> + } + + ) +}; diff --git a/src/forge/Component/SiderBar.js b/src/forge/Component/SiderBar.js index 8267959ba..3d6b8acf8 100644 --- a/src/forge/Component/SiderBar.js +++ b/src/forge/Component/SiderBar.js @@ -43,7 +43,7 @@ function SiderBar() { { list && list.map((i,k)=>{ return( -
  • {i.question}
    • +
  • {i.question}
    • ) }) } diff --git a/src/forge/Head/Header.js b/src/forge/Head/Header.js index 0ea38b41b..d02430891 100644 --- a/src/forge/Head/Header.js +++ b/src/forge/Head/Header.js @@ -5,6 +5,9 @@ import axios from 'axios'; import { Input , notification , Dropdown , Menu } from 'antd'; import LoginDialog from '../../modules/login/LoginDialog'; +import GotoQQgroup from '../../modal/GotoQQgroup'; +import HeadSearch from '../Component/HeadSearch'; + import AddProjectModal from './AddProjectModal'; import '../../modules/tpm/TPMIndex.css'; @@ -76,36 +79,35 @@ class NewHeader extends Component { } catch (e) {} } - SearchInput = (open,item)=>{ - if(open){ - return( -
    { - setTimeout(() => { - this.setState({ - openSearch:false - }) - }, 300) - }} - > - this.onGlobalSearch(value,item)} - autoFocus={true} - style={{width:"260px"}} - /> -
    - ) - }else{ - return { - this.setState({openSearch:true}) - }} /> - } - } + // SearchInput = (open,item)=>{ + // if(open){ + // return( + //
    { + // setTimeout(() => { + // this.setState({ + // openSearch:false + // }) + // }, 300) + // }} + // > + // this.onGlobalSearch(value,item)} + // autoFocus={true} + // /> + //
    + // ) + // }else{ + // return { + // this.setState({openSearch:true}) + // }} /> + // } + // } - onGlobalSearch=(value,item)=>{ - window.location.href=`${item}?value=` + value; - } + // onGlobalSearch=(value,item)=>{ + // window.location.href=`${item}?value=` + value; + // } openNotification = (messge) => { notification.open({ @@ -264,7 +266,7 @@ class NewHeader extends Component { { list.map((item,key)=>{ return( - (item.name !=="加入课堂" && item.name !=="加入开发项目") && {item.name} + (item.name !=="加入课堂" && item.name !=="加入开发项目") && {item.name} ) }) } @@ -383,7 +385,7 @@ class NewHeader extends Component { }) } - let search_url = settings && settings.common && settings.common.search; + // let search_url = settings && settings.common && settings.common.search; let notice_url = settings && settings.common && settings.common.notice; return (
    @@ -447,7 +449,8 @@ class NewHeader extends Component { }
    - {search_url ? this.SearchInput(openSearch,search_url):""} + {/* {search_url ? this.SearchInput(openSearch,search_url):""} */} + { current_user && (current_user.main_site || current_user.login) && (settings && settings.add && settings.add.length>0)? diff --git a/src/modules/search/ItemList.jsx b/src/modules/search/ItemList.jsx new file mode 100644 index 000000000..79094d53a --- /dev/null +++ b/src/modules/search/ItemList.jsx @@ -0,0 +1,31 @@ +import React from 'react'; +import './index.scss'; +export default (props) => { + const { list } = props; + + function itemClick(item) { + item.url && window.open(item.url); + } + + return ( + + list.map((item, i) => { + return ( +
    +
    +

    { itemClick(item) }}>

    + + {item.type == 1 &&

    + {item.watchersCount} + {item.praisesCount} + {item.forkedCount} +

    } + +
    +

    +
    {item.updateTime}
    +
    + ) + }) + ) +} \ No newline at end of file diff --git a/src/modules/search/index.jsx b/src/modules/search/index.jsx new file mode 100644 index 000000000..483309d7f --- /dev/null +++ b/src/modules/search/index.jsx @@ -0,0 +1,249 @@ +import React, { useEffect, useState } from 'react'; +import { Input, Row, Col, Tabs, Pagination } from 'antd'; +import axios from 'axios'; +import { TPMIndexHOC } from '../tpm/TPMIndexHOC'; +import { SnackbarHOC } from 'educoder'; +import ItemList from './ItemList'; +import Nodata from '../../forge/Nodata'; +import './index.scss'; + +const { Search } = Input; +const { TabPane } = Tabs; + +// const https = 'http://192.168.0.77:8081'; //曾伟内网后台 +// const https = 'http://192.168.31.104:8081'; //曾伟外网后台 +// const https='http://106.75.31.211:58081'; +const https = 'https://test-statistics.trustie.net'; + +const GlobalSearch = ({ location, showNotification, history }) => { + + const size = 10; + let defaultValue = decodeURI(location.search.split("=")[1] || ""); + + const [term, setTerm] = useState(defaultValue); + const [searchValue, setSearchValue] = useState(defaultValue); + + const [type, setType] = useState(1); + const [page, setPage] = useState(1); + const [total, setTotal] = useState(0); + const [dataList, setDataList] = useState([]); + + const [forcesearch, setForcesearch] = useState(false); + + const [totalType1, setTotalType1] = useState(0); + const [totalType2, setTotalType2] = useState(0); + const [totalType3, setTotalType3] = useState(0); + const [totalType4, setTotalType4] = useState(0); + const [totalType5, setTotalType5] = useState(0); + + const [ref, setRef] = useState(undefined); + const [focus, setFocus] = useState(0); + + + useEffect(() => { + searchDataList(); + }, [type, page, term, forcesearch]); + + useEffect(() => { + if (ref) { + ref && ref.input.input.focus(); + } + }, [focus]) + + + function searchFun(val) { + setTerm(val); + setPage(1); + setForcesearch(!forcesearch); + } + + function searchDataList() { + const url = https + '/search'; + if (!term) { + // showNotification('请输入关键字'); + setFocus(focus + 1); + return; + } + axios.defaults.withCredentials = true; + axios.get(url, { + params: { + page, + size, + term, + type, + } + }).then(res => { + if (res && res.status === 200 && res.data && res.data.code === '1') { + const data = res.data.data; + setDataList(data.rows); + setTotal(data.total); + for (const item of data.searchItemTypes) { + if (item.type == 1) { + setTotalType1(item.count); + } else if (item.type == 2) { + setTotalType2(item.count); + } else if (item.type == 3) { + setTotalType3(item.count); + } else if (item.type == 4) { + setTotalType4(item.count); + } else if (item.type == 5) { + setTotalType5(item.count); + } + } + } else if (res && res.data) { + showNotification(res.data.data.message); + setDataList([]); + setTotal(0); + } else { + showNotification('查询失败！'); + setDataList([]); + setTotal(0); + } + }).catch(err => { + showNotification('查询失败！返回错误'); + setDataList([]); + setTotal(0); + }) + } + + + function changeTab(type) { + setType(type); + setPage(1); + } + + useEffect(() => { + history.listen(historyLocation => { + setSearchValue(historyLocation.search.split("=")[1] || ""); + setTerm(historyLocation.search.split("=")[1] || ""); + }) + }, [history]); + + + + return ( +
    +
    + + + + { setSearchValue(e.target.value) }} + ref={(el) => setRef(el)} + /> + {!searchValue && 请输入搜索关键字} + + +
    + + + + +
    +

    {`找到${totalType1}条结果`}

    + +
    + { + dataList.length ? + size} + onChange={(page) => { setPage(page) }} + current={page} + total={total} + showTotal={total => `共 ${total} 条`} + /> + : + } +     + + +
    +

    {`找到${totalType2}条结果`}

    + +
    + { + dataList.length ? + size} + onChange={(page) => { setPage(page) }} + current={page} + total={total} + showTotal={total => `共 ${total} 条`} + /> : + } +     + + {/* +
    +

    {`找到${totalType3}条结果`}

    + +
    + { + dataList.length ? + size} + onChange={(page) => { setPage(page) }} + current={page} + total={total} + showTotal={total => `共 ${total} 条`} + /> : + } +     + + +
    +

    {`找到${totalType4}条结果`}

    + +
    + { + dataList.length ? + size} + onChange={(page) => { setPage(page) }} + current={page} + total={total} + showTotal={total => `共 ${total} 条`} + /> : + } +     */} + + +
    +

    {`找到${totalType5}条结果`}

    + +
    + { + dataList.length ? + size} + onChange={(page) => { setPage(page) }} + current={page} + total={total} + showTotal={total => `共 ${total} 条`} + /> : + } +     +     + +
    + ); +} + + +export default SnackbarHOC()(TPMIndexHOC(GlobalSearch)); diff --git a/src/modules/search/index.scss b/src/modules/search/index.scss new file mode 100644 index 000000000..e3af7834e --- /dev/null +++ b/src/modules/search/index.scss @@ -0,0 +1,89 @@ +.suit-main { + .search-head { + background: #eef2f5; + } + + .search-box { + width: 1200px; + height: 110px; + margin: 0 auto; + .ant-form-explain{ + color: #f5222d; + } + } + + .global-search { + margin-top: 40px; + } + .required-search{ + .ant-input{ + border-color: #f5222d !important; + } + } + .ant-tabs-top { + background: #eef2f5; + } + .ant-tabs-tabpane { + background: #fff; + } + .ant-tabs-bar { + width: 1200px; + margin: 0 auto; + } + .ant-tabs-tab-active { + color: #000; + font-weight: 600; + } + .ant-tabs-nav .ant-tabs-tab:hover { + color: #000; + font-weight: 600; + } + + /* 列表 */ + .search-content { + width: 1200px; + margin: 1.5vw auto; + p{ + margin-bottom: .75em !important; + } + } + .search-item { + padding: .75em 0; + border-top:1px solid #e1e4e8; + .search-item-tit{ + display: flex; + justify-content: space-between; + } + .search-item-title{ + cursor: pointer; + &:hover{ + color: #1890ff; + } + span{ + color: #1890ff; + } + } + .search-item-content{ + span{ + color: #1890ff; + } + } + .search-icon{ + margin-right: 2em; + color: #aaa; + } + } + + .ant-pagination{ + text-align: center; + margin-bottom: 3vw; + } + + .none_panels{ + display: flex; + justify-content: center; + align-items: center; + flex-flow: column nowrap; + height: 40vh; + } +}