6.13 logo和项目名称查询修改

This commit is contained in:
jl-zhoujl2
2022-06-13 09:49:31 +08:00
parent e51a0f4103
commit 3d80e4b210
2 changed files with 163 additions and 130 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 71 KiB

After

Width:  |  Height:  |  Size: 129 KiB

View File

@ -1,9 +1,9 @@
import React, { useEffect, useRef, useState } from 'react';
import { Avatar, Card, DatePicker, Descriptions, Input, List, Radio, Space, Tag, Typography } from 'antd';
import { Avatar, Button, Card, DatePicker, Descriptions, Input, List, Radio, Space, Spin, Tag, Typography } from 'antd';
import './index.less';
import styles from './index.less';
import logo from '@/images/opening/logo.svg';
import { UserSwitchOutlined, CarryOutOutlined, EnvironmentOutlined } from '@ant-design/icons';
import { UserSwitchOutlined, CarryOutOutlined, EnvironmentOutlined, SearchOutlined } from '@ant-design/icons';
import moment from 'moment';
import { getSessionUserData } from '@/utils/session';
import { getProvince } from '../AuctionAnnouncementData/service';
@ -35,6 +35,8 @@ export default () => {
const kssj = useRef<string>('');
//拍卖时间-结束日期
const jssj = useRef<string>('');
//项目名称
const name = useRef<string>('');
//省字典
const provinces = useRef<any[]>([]);
//最低价ref
@ -56,6 +58,7 @@ export default () => {
isNotEmpty(zgjg.current) ? params['zgjg'] = zgjg.current : null;
isNotEmpty(kssj.current) ? params['kssj'] = kssj.current : null;
isNotEmpty(jssj.current) ? params['jssj'] = jssj.current : null;
isNotEmpty(name.current) ? params['projectName'] = name.current : null;
setLoading(true);
await getList(params).then(async res => {
if (res?.code == 200) {
@ -141,6 +144,14 @@ export default () => {
pageNo.current = page;
getParticipateList();
}
const nameChange = (e: any) => {
e.persist();
name.current = e.target.value;
if (e.currentTarget?.value == "") {
pageNo.current = 1;
getParticipateList();
}
}
//点击商品进入详情
const cardClick = (id: string) => {
let projectData = {
@ -149,6 +160,13 @@ export default () => {
sessionStorage.setItem('projectData', JSON.stringify(projectData));
window.open("/AuctionParticipateDetail");
}
//项目名称模糊查询
const onSearch = () => {
if (isNotEmpty(name.current)) {
pageNo.current = 1;
getParticipateList();
}
};
useEffect(() => {
getProvinces();
@ -173,140 +191,155 @@ export default () => {
</ul>
</div>
<div style={{ display: 'flex', justifyContent: 'center', height: innerHeight - 57, overflowY: 'auto' }}>
<div style={{ width: 1248 }}>
<div style={{ margin: '12px 0px', display: 'flex' }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<img src={participateLogo} height={60} width={60} />
<span style={{ fontSize: '22px', fontWeight: 'bold', marginLeft: '8px', color: '#b30000' }}> · </span>
</div>
</div>
<Descriptions
bordered={true}
column={1}
labelStyle={{ background: '#f2f2f2', width: '15%', textAlign: 'center' }}
contentStyle={{ padding: "12px 20px" }}
style={{ margin: '16px 0px' }}
>
<Descriptions.Item label="所属省份">
<Radio.Group defaultValue="all" buttonStyle="solid" onChange={sfbmChange}>
<Space wrap>
<Radio.Button value="all" key="all"></Radio.Button>
{sfbms.map(item => <Radio.Button value={item} key={item}>{getProvinceName(item)}</Radio.Button>)}
</Space>
</Radio.Group>
</Descriptions.Item>
<Descriptions.Item label="拍卖状态">
<Radio.Group defaultValue="all" buttonStyle="solid" onChange={bidOpeningStatusChange}>
<Space wrap>
<Radio.Button value="all"></Radio.Button>
<Radio.Button value="0"></Radio.Button>
<Radio.Button value="1"></Radio.Button>
</Space>
</Radio.Group>
</Descriptions.Item>
<Descriptions.Item label="当前/起拍价">
<div className="site-input-group-wrapper">
<Input.Group compact>
<Input
style={{ width: 150, textAlign: 'center' }}
placeholder="最低价"
prefix="¥"
allowClear
maxLength={11}
type="number"
ref={zdjgRef}
id="zdjgId"
onBlur={(event) => zdjgBlur(event)}
onPressEnter={() => zdjgRef.current.blur()}
/>
<Input
className="site-input-split"
style={{
width: 30,
borderLeft: 0,
borderRight: 0,
pointerEvents: 'none',
}}
placeholder="~"
disabled
/>
<Input
className="site-input-right"
style={{
width: 150,
textAlign: 'center',
}}
placeholder="最高价"
allowClear
maxLength={11}
type="number"
ref={zgjgRef}
onBlur={(event) => zgjgBlur(event)}
onPressEnter={() => zgjgRef.current.blur()}
/>
</Input.Group>
<Spin spinning={loading}>
<div style={{ width: 1248 }}>
<div style={{ margin: '12px 0px', display: 'flex', justifyContent: 'space-between' }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<img src={participateLogo} height={60} width={60} />
<span style={{ fontSize: '22px', fontWeight: 'bold', marginLeft: '8px', color: '#b30000', position: 'relative', top: '-2px' }}> · </span>
</div>
</Descriptions.Item>
<Descriptions.Item label="开拍时间">
<DatePicker.RangePicker style={{ width: '328px' }} onChange={sjChange} />
</Descriptions.Item>
</Descriptions>
<List
grid={{ gutter: 16, column: 4 }}
dataSource={productList}
loading={loading}
pagination={{
size: "small",
hideOnSinglePage: true,
onChange: page => pageChange(page),
pageSize: 12,
}}
renderItem={item => (
<List.Item>
<Card
hoverable
bodyStyle={{
padding: 0,
MozUserSelect: 'none',/* Firefox私有属性 */
WebkitUserSelect: 'none',/* WebKit内核私有属性 */
msUserSelect: 'none',/* IE私有属性(IE10及以后) */
userSelect: 'none'/* CSS3属性 */
}}
cover={
<img
alt="example"
height="245px"
// src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
src={item.dfzpUrl}
<div style={{ display: 'flex', alignItems: 'center' }}>
{/* <Search
placeholder="标的物名称"
allowClear
enterButton="搜索"
size="large"
onSearch={onSearch}
prefix={<SearchOutlined />}
/> */}
<div style={{ display: 'flex', justifyContent: 'left', border: '2px solid #d9d9d9', borderRadius: '22px' }}>
<Input size="large" placeholder="标的物名称" prefix={<SearchOutlined />} allowClear bordered={false} onChange={nameChange} onPressEnter={() => onSearch()} />
<Button size="large" type='primary' shape="round" onClick={() => onSearch()}></Button>
</div>
</div>
</div>
<Descriptions
bordered={true}
column={1}
labelStyle={{ background: '#f2f2f2', width: '15%', textAlign: 'center' }}
contentStyle={{ padding: "12px 20px" }}
style={{ margin: '16px 0px' }}
>
<Descriptions.Item label="所属省份">
<Radio.Group defaultValue="all" buttonStyle="solid" onChange={sfbmChange}>
<Space wrap>
<Radio.Button value="all" key="all"></Radio.Button>
{sfbms.map(item => <Radio.Button value={item} key={item}>{getProvinceName(item)}</Radio.Button>)}
</Space>
</Radio.Group>
</Descriptions.Item>
<Descriptions.Item label="拍卖状态">
<Radio.Group defaultValue="all" buttonStyle="solid" onChange={bidOpeningStatusChange}>
<Space wrap>
<Radio.Button value="all"></Radio.Button>
<Radio.Button value="0"></Radio.Button>
<Radio.Button value="1"></Radio.Button>
</Space>
</Radio.Group>
</Descriptions.Item>
<Descriptions.Item label="当前/起拍价">
<div className="site-input-group-wrapper">
<Input.Group compact>
<Input
style={{ width: 150, textAlign: 'center' }}
placeholder="最低价"
prefix="¥"
allowClear
maxLength={11}
type="number"
ref={zdjgRef}
id="zdjgId"
onBlur={(event) => zdjgBlur(event)}
onPressEnter={() => zdjgRef.current.blur()}
/>
}
onClick={() => cardClick(item.id)}
>
<div className={item.bidOpeningStatus == "0" ? 'auction-start-time' : 'auction-final-time'}>
{item.bidOpeningStatus == "0" ? `竞拍开始时间:${item.jpkssj}` : `竞拍结束时间:${item.jpjssj}`}
</div>
<div style={{ padding: "10px 12px 12px 16px" }}>
<div>
<Text>{item.projectName}</Text>
<Input
className="site-input-split"
style={{
width: 30,
borderLeft: 0,
borderRight: 0,
pointerEvents: 'none',
}}
placeholder="~"
disabled
/>
<Input
className="site-input-right"
style={{
width: 150,
textAlign: 'center',
}}
placeholder="最高价"
allowClear
maxLength={11}
type="number"
ref={zgjgRef}
onBlur={(event) => zgjgBlur(event)}
onPressEnter={() => zgjgRef.current.blur()}
/>
</Input.Group>
</div>
</Descriptions.Item>
<Descriptions.Item label="开拍时间">
<DatePicker.RangePicker style={{ width: '328px' }} onChange={sjChange} />
</Descriptions.Item>
</Descriptions>
<List
grid={{ gutter: 16, column: 4 }}
dataSource={productList}
pagination={{
size: "small",
hideOnSinglePage: true,
onChange: page => pageChange(page),
pageSize: 12,
}}
renderItem={item => (
<List.Item>
<Card
hoverable
bodyStyle={{
padding: 0,
MozUserSelect: 'none',/* Firefox私有属性 */
WebkitUserSelect: 'none',/* WebKit内核私有属性 */
msUserSelect: 'none',/* IE私有属性(IE10及以后) */
userSelect: 'none'/* CSS3属性 */
}}
cover={
<img
alt="example"
height="245px"
// src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
src={item.dfzpUrl}
/>
}
onClick={() => cardClick(item.id)}
>
<div className={item.bidOpeningStatus == "0" ? 'auction-start-time' : 'auction-final-time'}>
{item.bidOpeningStatus == "0" ? `竞拍开始时间:${item.jpkssj}` : `竞拍结束时间:${item.jpjssj}`}
</div>
<div style={{ marginTop: 6 }}>
<div style={{ textAlign: 'right' }}>
<Text style={{ fontSize: '90%' }}>
<EnvironmentOutlined style={{ color: '#aaaaaa' }} />{getProvinceName(item.sfbm)}
</Text>
<div style={{ padding: "10px 12px 12px 16px" }}>
<div>
<Text>{item.projectName}</Text>
</div>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-end' }}>
<Text strong style={{ fontSize: 'large', color: item.bidOpeningStatus == "0" ? '#4b7902' : '#b30000' }}>{item.bidOpeningStatus == "0" ? `起拍价:${item.qpjg}` : `当前价:${item.dqjg}`}</Text>
<Text type={item.bidOpeningStatus == "0" ? "secondary" : void 0} style={{ fontSize: '90%' }}>{item.offerNumber}</Text>
<div style={{ marginTop: 6 }}>
<div style={{ textAlign: 'right' }}>
<Text style={{ fontSize: '90%' }}>
<EnvironmentOutlined style={{ color: '#aaaaaa' }} />{getProvinceName(item.sfbm)}
</Text>
</div>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-end' }}>
<Text strong style={{ fontSize: 'large', color: item.bidOpeningStatus == "0" ? '#4b7902' : '#b30000' }}>{item.bidOpeningStatus == "0" ? `起拍价:${item.qpjg}` : `当前价:${item.dqjg}`}</Text>
<Text type={item.bidOpeningStatus == "0" ? "secondary" : void 0} style={{ fontSize: '90%' }}>{item.offerNumber}</Text>
</div>
</div>
</div>
</div>
<Tag className={item.bidOpeningStatus == "0" ? "auction-wks-tag" : "auction-jpz-tag"}>{item.bidOpeningStatus == "0" ? '未开始' : '竞拍中'}</Tag>
</Card>
</List.Item>
)}
/>
</div>
<Tag className={item.bidOpeningStatus == "0" ? "auction-wks-tag" : "auction-jpz-tag"}>{item.bidOpeningStatus == "0" ? '未开始' : '竞拍中'}</Tag>
</Card>
</List.Item>
)}
/>
</div>
</Spin>
</div>
</div>
)