</head> | </head> | ||||
<body> | <body> | ||||
<div id="root"></div> | <div id="root"></div> | ||||
<script src="/umi.23f5ba2d.js"></script> | |||||
<script src="/umi.7e8d979f.js"></script> | |||||
</body> | </body> | ||||
</html> | </html> |
.with-prefix:before{content:"";width:8px;height:8px;margin-right:16px;display:inline-block;background-color:#19be6e;transform:translateY(-1px)} |
const height = loginHeightRef.current.offsetHeight; | const height = loginHeightRef.current.offsetHeight; | ||||
getHeight(height) | getHeight(height) | ||||
} | } | ||||
}, []); | |||||
}, [loginHeightRef.current]); | |||||
return ( | return ( | ||||
<> | <> |
.with-prefix::before { | |||||
content: ""; | |||||
width: 8px; | |||||
height: 8px; | |||||
margin-right: 16px; | |||||
display: inline-block; | |||||
background-color: #19be6e; | |||||
transform: translateY(-1px); | |||||
} |
import { useState, useEffect, useRef } from 'react'; | import { useState, useEffect, useRef } from 'react'; | ||||
import { ProList, PageContainer } from '@ant-design/pro-components'; | import { ProList, PageContainer } from '@ant-design/pro-components'; | ||||
import { ConfigProvider, Button, Flex, Input, Space, Tabs, Select, Row, List, Carousel, Tag, Card, Avatar, Typography } from 'antd'; | |||||
import { ConfigProvider, Button, Flex, Input, Space, Tabs, Select, Row, List, Carousel, Tag, Card, Segmented, Typography } from 'antd'; | |||||
import { SearchOutlined, FireOutlined, MessageOutlined, RightOutlined } from '@ant-design/icons'; | import { SearchOutlined, FireOutlined, MessageOutlined, RightOutlined } from '@ant-design/icons'; | ||||
import { useModel, connect, history, Link } from 'umi'; | import { useModel, connect, history, Link } from 'umi'; | ||||
import { GetSectionDetailByCode, GetArticleList } from '@/services/apis/information'; | import { GetSectionDetailByCode, GetArticleList } from '@/services/apis/information'; | ||||
import './index.less' | |||||
interface TalentHomeInformationProps { | interface TalentHomeInformationProps { | ||||
height: number | height: number | ||||
const TalentHomeInformation: React.FC<TalentHomeInformationProps> = ({ height }) => { | const TalentHomeInformation: React.FC<TalentHomeInformationProps> = ({ height }) => { | ||||
const [list, setList] = useState<object[]>([]) | const [list, setList] = useState<object[]>([]) | ||||
const [newsType, setNewsType] = useState<string>('政策补贴') | |||||
const [newHeight, setNewHeight] = useState<number>(475) | |||||
useEffect(() => { | useEffect(() => { | ||||
GetSectionDetailByCode({ code: 'WZSYZX' }).then(res => { | |||||
GetSectionDetailByCode({ code: 'JYFCZC' }).then(res => { | |||||
GetArticleList({ page: 1, pagesize: 10, section_id: res.data.id }).then(res1 => { | GetArticleList({ page: 1, pagesize: 10, section_id: res.data.id }).then(res1 => { | ||||
setList(res1.data.articles) | setList(res1.data.articles) | ||||
}) | }) | ||||
}) | }) | ||||
}, []); | }, []); | ||||
return ( | return ( | ||||
<> | <> | ||||
<ConfigProvider | <ConfigProvider | ||||
} | } | ||||
}} | }} | ||||
> | > | ||||
<Card size='small' style={{ width: '100%', height: height, borderRadius: 8, overflow: 'hidden' }}> | |||||
<Space direction='vertical' size={0} style={{ width: '100%', overflow: 'hidden' }}> | |||||
<Space direction='vertical' size={0} style={{ width: '100%', overflow: 'hidden', height: newHeight }}> | |||||
<Segmented | |||||
size='large' | |||||
block | |||||
value={newsType} | |||||
options={['政策补贴', '最新资讯']} | |||||
onChange={(value) => { | |||||
setNewsType(value) | |||||
if (value === '政策补贴') { | |||||
GetSectionDetailByCode({ code: 'JYFCZC' }).then(res => { | |||||
GetArticleList({ page: 1, pagesize: 10, section_id: res.data.id }).then(res1 => { | |||||
setList(res1.data.articles) | |||||
}) | |||||
}) | |||||
} else { | |||||
GetSectionDetailByCode({ code: 'WZSYZX' }).then(res => { | |||||
GetArticleList({ page: 1, pagesize: 10, section_id: res.data.id }).then(res1 => { | |||||
setList(res1.data.articles) | |||||
}) | |||||
}) | |||||
} | |||||
}} | |||||
/> | |||||
<div style={{ padding: '20px 8px', borderRadius: 10, height: newHeight }}> | |||||
{ | { | ||||
list && list.length > 0 && list.map(item => (<> | list && list.length > 0 && list.map(item => (<> | ||||
<Link to={{ pathname: `/talent/information/detail?id=${item.id}` }} target='_blank'> | <Link to={{ pathname: `/talent/information/detail?id=${item.id}` }} target='_blank'> | ||||
<Flex justify='space-between'> | |||||
<Typography.Paragraph ellipsis={{ rows: 1 }} style={{ color: '#000', fontSize: 16 }}> | |||||
{item.title} | |||||
<Flex align='center'> | |||||
<Typography.Paragraph className="with-prefix" ellipsis={{ rows: 1 }} style={{ color: '#000', fontSize: 16 }}> | |||||
{item.title} | |||||
</Typography.Paragraph> | </Typography.Paragraph> | ||||
</Flex> | </Flex> | ||||
</Link> | </Link> | ||||
</>)) | </>)) | ||||
} | } | ||||
</Space> | |||||
</Card> | |||||
</div> | |||||
</Space> | |||||
</ConfigProvider > | </ConfigProvider > | ||||
<Cascader style={{ width: '50%' }} placeholder="请选择地区" options={dictModel.areaList} fieldNames={cascaderfieldNames} onChange={(value) => { | <Cascader style={{ width: '50%' }} placeholder="请选择地区" options={dictModel.areaList} fieldNames={cascaderfieldNames} onChange={(value) => { | ||||
setSearchJobParams(prevState => ({ | setSearchJobParams(prevState => ({ | ||||
...prevState, | ...prevState, | ||||
location: value && value.length > 0 ? value[length - 1] : 0, | |||||
location: value && value.length > 0 ? value[value.length - 1] : 0, | |||||
})); | })); | ||||
}} /> | }} /> | ||||
</Space> | </Space> |
<Space> | <Space> | ||||
<Popconfirm | <Popconfirm | ||||
showCancel={false} | showCancel={false} | ||||
placement="bottom" | |||||
placement="right" | |||||
title='地区' | title='地区' | ||||
icon={null} | icon={null} | ||||
description={<> | description={<> | ||||
onChange={() => { | onChange={() => { | ||||
cityChange(item, index) | cityChange(item, index) | ||||
setAreaItem({ item: item, index: index }) | setAreaItem({ item: item, index: index }) | ||||
searchCityChange(item, index) | |||||
}} | }} | ||||
> | > | ||||
{item.name} | {item.name} | ||||
onChange={() => { | onChange={() => { | ||||
cityChange(item, index) | cityChange(item, index) | ||||
setAreaItem({ item: item, index: index }) | setAreaItem({ item: item, index: index }) | ||||
searchCityChange(item, index) | |||||
}} | }} | ||||
> | > | ||||
{item.name} | {item.name} | ||||
)) | )) | ||||
} | } | ||||
</Flex> | </Flex> | ||||
<Cascader style={{ width: '50%' }} placeholder="请选择地区" options={dictModel.areaList} fieldNames={cascaderfieldNames} /> | |||||
<Cascader style={{ width: '50%' }} placeholder="请选择地区" options={dictModel.areaList} changeOnSelect fieldNames={cascaderfieldNames} onChange={(value, selectedOptions) => { | |||||
console.log(value, selectedOptions) | |||||
setSearchJobParams(prevState => ({ | |||||
...prevState, | |||||
province: value && value[0] ? value[0] : 0, | |||||
city: value && value[1] ? value[1] : 0, | |||||
district: value && value[2] ? value[2] : 0, | |||||
street: value && value[3] ? value[3] : 0, | |||||
})); | |||||
}} /> | |||||
</Space> | </Space> | ||||
</> | </> | ||||
} | } | ||||
okText="搜索" | |||||
onConfirm={() => searchCityChange(areaItem.item, areaItem.index)} | |||||
> | > | ||||
<Button size='small'>选择地址</Button> | <Button size='small'>选择地址</Button> | ||||
</Popconfirm> | </Popconfirm> | ||||
</Popconfirm> | </Popconfirm> | ||||
<Popconfirm | <Popconfirm | ||||
showCancel={false} | showCancel={false} | ||||
placement="bottom" | |||||
placement="right" | |||||
title='职位' | title='职位' | ||||
icon={null} | icon={null} | ||||
description={<> | description={<> |
const [page, setPage] = useState<number>(1) | const [page, setPage] = useState<number>(1) | ||||
const [pageSize, setPageSize] = useState<number>(3) | const [pageSize, setPageSize] = useState<number>(3) | ||||
const [positionList, setPositionList] = useState<any[]>([]); | const [positionList, setPositionList] = useState<any[]>([]); | ||||
const [loginHeight, setLoginHeight] = useState<number>(432) // 获取登录的高度 | |||||
const [loginHeight, setLoginHeight] = useState<number>(475) // 获取登录的高度 | |||||
const [keywordName, setKeywordName] = useState<string>(''); | const [keywordName, setKeywordName] = useState<string>(''); | ||||
const [positionType, setPositionType] = useState<string>('热门职位') | const [positionType, setPositionType] = useState<string>('热门职位') | ||||
const [type, setType] = useState<string>('jobseeker') | const [type, setType] = useState<string>('jobseeker') | ||||
const [openPreview, setOpenPreview] = useState(false); | const [openPreview, setOpenPreview] = useState(false); | ||||
dispatch({ type: 'dictModel/getList', payload: { code: 2027, type: 'setIndustryPostList' } }) | |||||
// useEffect(() => { | // useEffect(() => { | ||||
// PostJobSearch({ page: 1, pagesize: 3, keyword: '文员' }).then(res => { | // PostJobSearch({ page: 1, pagesize: 3, keyword: '文员' }).then(res => { | ||||
setLoginHeight(value) | setLoginHeight(value) | ||||
} | } | ||||
return ( | return ( | ||||
<> | <> | ||||
</PageContainer> | </PageContainer> | ||||
{/* 未登录的登录页 */} | {/* 未登录的登录页 */} | ||||
<Flex vertical justify='center' align='center' style={{ background: '#ffffff', width: '100%', marginBottom: 40, position: 'relative' }}> | |||||
<Flex vertical justify='center' align='center' style={{ background: '#edfff3', padding: '40px 314px', width: '100%' }}> | |||||
<Flex vertical justify='center' align='center' style={{ width: '100%', marginBottom: 40, position: 'relative' }}> | |||||
<Flex vertical justify='center' align='center' style={{ background: '#ffffff', padding: '40px 314px', width: '100%' }}> | |||||
<Flex justify='space-bewteen' style={{ width: '100%' }}> | <Flex justify='space-bewteen' style={{ width: '100%' }}> | ||||
<Row gutter={[16, 16]}> | <Row gutter={[16, 16]}> | ||||
<Col span={6}> | |||||
<Tabs | |||||
size='small' | |||||
style={{ height: '300px', zIndex: 99 , background: '#ffffff' }} | |||||
tabPosition='left' | |||||
items={dictModel.industryPostList.map((item, index) => { | |||||
return { | |||||
key: item.id, | |||||
label: item.name, | |||||
children: (<> | |||||
<Space direction='vertical' style={{ height: '600px', overflow: 'auto' }}> | |||||
{ | |||||
item.children.map((childrenItem, childrenIndex) => ( | |||||
<> | |||||
<Typography.Title level={5}> | |||||
{ | |||||
childrenItem.name | |||||
} | |||||
</Typography.Title> | |||||
<Space wrap> | |||||
{ | |||||
childrenItem.children.map((thirdItem, thirdIndex) => ( | |||||
<> | |||||
<Space> | |||||
{thirdItem.name} | |||||
</Space> | |||||
</> | |||||
)) | |||||
} | |||||
</Space> | |||||
</> | |||||
)) | |||||
} | |||||
</Space> | |||||
</>) | |||||
} | |||||
})} | |||||
/> | |||||
</Col> | |||||
<Col span={12}> | |||||
<Col span={16}> | |||||
<TalentHomeBanner getHeight={getHeight}></TalentHomeBanner> | <TalentHomeBanner getHeight={getHeight}></TalentHomeBanner> | ||||
</Col> | </Col> | ||||
<Col span={6} style={{ height: loginHeight, width: '100%' }}> | |||||
<Col span={8} style={{ height: loginHeight, width: '100%' }}> | |||||
<Flex justify='flex-end' style={{ height: loginHeight, width: '100%' }}> | <Flex justify='flex-end' style={{ height: loginHeight, width: '100%' }}> | ||||
<TalentHomeInformation height={loginHeight}></TalentHomeInformation> | <TalentHomeInformation height={loginHeight}></TalentHomeInformation> | ||||
</Flex> | </Flex> |