Merge pull request '增加记录创客任务筛选条件的功能,我关注的竞赛列表调整样式' (#462) from tongChong/forgeplus-react:pre_dev_military into pre_dev_military

This commit is contained in:
tongChong 2022-10-25 13:47:38 +08:00
commit b18cd18c57
8 changed files with 104 additions and 44 deletions

View File

@ -38,6 +38,7 @@ export default Form.create()(({ form, match, history, current_user, showNotifica
identifier: details.identifier,
content: details.content,
banner_url: details.banner_url,
applet_banner_url: details.applet_banner_url,
video_url: details.video_url,
enroll_template: details.enroll_template,
guide: details.guide,
@ -138,6 +139,10 @@ export default Form.create()(({ form, match, history, current_user, showNotifica
setFieldsValue({
[key]: `/api/attachments/${info.file.response.id}`
})
} else if (key === 'applet_banner_url') {
setFieldsValue({
[key]: `/api/attachments/${info.file.response.id}`
})
}
}
}
@ -204,7 +209,6 @@ export default Form.create()(({ form, match, history, current_user, showNotifica
<Input placeholder="请输入参赛单位" onBlur={() => { verify("identifier") }} />
)}
<Form.Item className="video-box" label="Banner图">
<Row gutter={8}>
<Col span={12}>
@ -225,6 +229,26 @@ export default Form.create()(({ form, match, history, current_user, showNotifica
</Row>
</Form.Item>
<Form.Item className="video-box" label="封面图">
<Row gutter={8}>
<Col span={12}>
{getFieldDecorator('applet_banner_url', {
rules: [],
})(<Input placeholder="请上传封面图或填写封面图地址" onBlur={() => { verify("video_url") }} />)}
</Col>
<Col span={12}>
<Upload
accept=".png,jpg,.jpeg,.svg"
action={getUploadActionUrl()}
onChange={(info) => { handleChange(info, 'applet_banner_url') }}
showUploadList={false}
>
<Button className="upload"><Icon type="upload" />上传封面图</Button>
</Upload>
</Col>
</Row>
</Form.Item>
<Form.Item className="video-box" label="视频地址" >
<Row gutter={8}>
<Col span={12}>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 305 KiB

View File

@ -4,7 +4,6 @@ import { SnackbarHOC, getImageUrl } from "educoder";
import { ImageLayerOfCommentHOC } from "../../../modules/page/layers/ImageLayerOfCommentHOC";
import { CNotificationHOC } from "../../../modules/courses/common/CNotificationHOC";
import { TPMIndexHOC } from "../../../modules/tpm/TPMIndexHOC";
import bg2 from '../image/myfocus1.png';
import title1 from '../image/myfocus2.png';
import title2 from '../image/myfocus3.png';
import {focusCompetitionList} from '../api.js'
@ -40,8 +39,8 @@ const MyFocusCompetitions = (props) => {
item.comState = 3;
}
}
if(item.created_at && item.upload_date){
item.comTime = item.created_at.substring(0, 10).replaceAll('-', '.') + '-' + item.upload_date.substring(0, 10).replaceAll('-', '.')
if(item.start_at && item.upload_date){
item.comTime = item.start_at.substring(0, 10).replaceAll('-', '.') + '-' + item.upload_date.substring(0, 10).replaceAll('-', '.')
}
item.content = item.content.replaceAll('font-size', '');
item.content = item.content.replaceAll('line-height', '');
@ -53,26 +52,25 @@ const MyFocusCompetitions = (props) => {
},[search])
return (
<div className="myFocusBgBox">
<img src={bg2} alt="" className="bg2"/>
<div className="myFocusBgBox newMain">
<div className="myFocusList">
<div className="titleMan">
<img src={title1} alt="" width={100}/>
<img src={title1} alt="" width={80}/>
竞赛管理
<img src={title2} alt="" width={100}/>
<img src={title2} alt="" width={80}/>
</div>
<div className="searchCom">
<div className="font-15 til">我关注的竞赛</div>
<Input.Search placeholder="请输入竞赛名称进行搜索" enterButton allowClear onSearch={(e)=>{setSearch(e)}}/>
<div className="font-16 til">我关注的竞赛</div>
<Input.Search placeholder="请输入竞赛名称进行搜索" enterButton={<i className="iconfont icon-sousuo"></i>} allowClear onSearch={(e)=>{setSearch(e)}}/>
<div style={{width: '120px'}}></div>
</div>
<div className="listBox mt30">
{list && list.map((item, index)=>{
return <div className="flexBox itemBoxCom" key={index}>
{item.banner_url && <div className="comImgBox mr20"><img src={mygetHelmetapi.current_main_site_url + item.banner_url} alt=""/></div>}
{item.banner_url && <div className="comImgBox mr20"><img src={mygetHelmetapi.current_main_site_url + `${item.applet_banner_url ? item.applet_banner_url : item.banner_url}`} alt=""/></div>}
<div className="contCom">
<a className="title font-20" href={`/competition/${item.identifier}`}>{item.title}</a>
<RenderHtml className="comContentIntro font-14" value={item.content}/>
<RenderHtml className="comContentIntro font-16" value={item.content}/>
<div className="flexBox ot font-14">
<div>
<span className="timeTitleComItem mr15">竞赛时间</span>

View File

@ -1,7 +1,6 @@
.myFocusBgBox{
position: relative;
z-index: 0;
background-image:linear-gradient(175.09deg,#f3f9ff 0%,#d6e9ff 100%);
min-height: 75vh;
padding-bottom: 100px;
.bg1, .bg2{
@ -23,10 +22,10 @@
justify-content: center;
}
.titleMan{
padding: 20px 0 10px;
padding: 20px 0;
font-weight:500;
color:#2e3341;
font-size:30px;
font-size:26px;
}
.searchCom{
justify-content: space-between;
@ -44,6 +43,16 @@
border-radius:20px;
}
}
.ant-input{
border: none;
box-shadow:0px 3px 12px rgba(0, 0, 0, 0.02);
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.ant-input-search-button{
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.ant-input-search{
width: 480px;
}
@ -51,14 +60,14 @@
height: 44px;
}
.ant-input:hover{
border-color: #6e81ff;
border: 1px solid#6e81ff;
}
}
.listBox{
padding: 0 30px;
background-image:linear-gradient(178.28deg,#ecf3f9 0%,#ffffff 100%);
background-color: rgba(255, 255, 255, 1);
border:1.5px solid #ffffff;
box-shadow:0px 3px 12px rgba(181, 210, 255, 0.23);
box-shadow:0px 3px 12px rgba(0, 0, 0, 0.02);
.itemBoxCom{
justify-content: start;
padding: 20px 0;
@ -73,6 +82,7 @@
img{
width: 100%;
height: 100%;
border-radius: 6px;
}
}
.contCom{
@ -88,10 +98,12 @@
text-overflow: ellipsis;
word-break: break-all;
overflow: hidden;
margin: 15px 0 55px;
margin: 15px 0 30px;
color:#595959;
}
.timeTitleComItem{
height: 32px;
line-height: 27px;
display: inline-block;
padding: 2px 10px;
color:#4154f1;
@ -104,8 +116,9 @@
}
.statusComItem{
color:#ffffff;
width:78px;
width:85px;
height:32px;
line-height: 32px;
background-image:linear-gradient(175.37deg,#ffaa00 0%,#ff7617 100%);
border-radius:4px;
text-align: center;

View File

@ -6,19 +6,24 @@ export default memo((props) => {
const { title, options, changeOptionId, type, size, defaultOption } = props;
const [option, setOption] = useState(defaultOption || { code: "", dicItemName: "", dicItemCode: "" });
useEffect(() => {
changeOptionId(option, type);
}, [option])
// useEffect(() => {
// changeOptionId(option, type);
// }, [option])
function itemClick(item){
setOption(item);
changeOptionId(item, type)
}
return (
<div className={classNames({ "choose-box": true, "choose-box-big": size })}>
<div className="choose-title">{title}</div>
<div className="choose-list">
<div className={classNames({ "choose-item-checked": option.dicItemCode === "", "choose-item": true })} key={"all"} onClick={() => { setOption({ dicItemCode: "", dicItemName: "" }) }}>全部</div>
<div className={classNames({ "choose-item-checked": option.dicItemCode === "", "choose-item": true })} key={"all"} onClick={() => { itemClick({ dicItemCode: "", dicItemName: "" }) }}>全部</div>
{
options.map((item) => {
return <div className={classNames({ "choose-item-checked": option.dicItemCode == item.dicItemCode, "choose-item": true })} key={item.dicItemCode} onClick={() => { setOption(item) }} >{item.dicItemName}</div>
return <div className={classNames({ "choose-item-checked": option.dicItemCode == item.dicItemCode, "choose-item": true })} key={item.dicItemCode} onClick={() => { itemClick(item) }} >{item.dicItemName}</div>
})
}
</div>

View File

@ -4,19 +4,19 @@ import classNames from 'classnames';
import './index.scss';
export default memo((props) => {
const { options, changeOptionId, type } = props;
const { options, changeOptionId, type ,defaultOption} = props;
const [myOptions, setMyOptions] = useState(()=>{
return JSON.parse(JSON.stringify(options));
});
const [option, setOption] = useState({
const [option, setOption] = useState(defaultOption ||{
name: '综合',
type: 'default',
});
useEffect(() => {
changeOptionId(option, type);
}, [option]);
// useEffect(() => {
// changeOptionId(option, type);
// }, [option]);
function itemClick(activeItem) {
const newOption = {
@ -29,15 +29,19 @@ export default memo((props) => {
}
}
setOption(newOption);
changeOptionId(newOption, type)
setMyOptions(myOptions);
}
console.log('option');
console.log(options);
console.log(option);
return (
<div className="sort-box">
{
myOptions.map((item) => {
return <div className={classNames({ "sort-item-checked": option.type === item.type, "sort-item": true })} key={item.type} onClick={() => { itemClick(item) }} >
return <div className={classNames({ "sort-item-checked": option.type.startsWith(item.type), "sort-item": true })} key={item.type} onClick={() => { itemClick(item) }} >
{item.name}
{
item.icon && <span className="caret-up-down">

View File

@ -70,7 +70,7 @@ export default (props) => {
<div className="edu-txt-center mt20 mb20">
{total > pageSize && <Pagination
showQuickJumper
onChange={(page) => { changePage(page) }}
onChange={(page) => { changePage(page);console.log(111111111) }}
current={curPage}
total={total}
showTotal={total => `${total}`}

View File

@ -14,20 +14,20 @@ const Search = Input.Search;
export default ({ history, current_user, showLoginDialog, location, mygetHelmetapi }) => {
// console.log(current_user);
let initType = getUrlToken('type', location.search) || '';
let taskParams=sessionStorage.getItem("taskParams")?JSON.parse(sessionStorage.getItem("taskParams")):{};
const [loading, setLoading] = useState(false);
const [taskCategoryArr, setTaskCategoryArr] = useState([]);
const [categoryId, setCategoryId] = useState(initType);
const [taskModeId, setTaskModeId] = useState('');
const [expiredStartTime, setExpiredStartTime] = useState('');
const [expiredEndTime, setExpiredEndTime] = useState('');
const [statusString, setStatusString] = useState('3,4,5,6,7,8');
const [searchInput, setSearchInput] = useState('');
const [orderBy, setOrderBy] = useState('');
const [curPage, setCurPage] = useState(1);
const [categoryId, setCategoryId] = useState(initType||taskParams.categoryId||'');
const [taskModeId, setTaskModeId] = useState(taskParams.taskModeId||'');
const [expiredStartTime, setExpiredStartTime] = useState('');//taskParams.expiredStartTime|| shi xian
const [expiredEndTime, setExpiredEndTime] = useState('');//taskParams.expiredEndTime||
const [statusString, setStatusString] = useState(taskParams.statusString||'3,4,5,6,7,8');
const [searchInput, setSearchInput] = useState(taskParams.searchInput||'');
const [orderBy, setOrderBy] = useState(taskParams.orderBy||'');
const [curPage, setCurPage] = useState(taskParams.curPage||1);
const [total, setTotal] = useState(0);
const [taskList, setTaskList] = useState([]);
const [visible,setVisible]=useState(false);
@ -46,7 +46,7 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
}, []);
//
useEffect(() => {
useEffect(() => {
const params = {
categoryId,
taskModeId,
@ -90,6 +90,7 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
} else if (type === 'taskStatus') {
setStatusString(option.dicItemCode || '3,4,5,6,7,8');
}
setCurPage(1);
}, []);
function surplusTime(item) {
@ -137,6 +138,17 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
// showLoginDialog();
// return;
// }
let params={
categoryId,
taskModeId,
// expiredStartTime,
// expiredEndTime,
statusString,
searchInput,
orderBy,
curPage,
}
sessionStorage.setItem("taskParams",JSON.stringify(params));
history.push(`/task/taskDetail/${id}`);
}
@ -187,7 +199,7 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
options={taskCategoryArr}
changeOptionId={changeOptionId}
size='big'
defaultOption={{ code: initType || "", dicItemName: "", dicItemCode: initType || "" }}
defaultOption={{ code: categoryId || "", dicItemName: "", dicItemCode: categoryId || "" }}
/>
<ChooseNav
@ -196,6 +208,7 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
title={'任务模式:'}
options={taskModeIdArr}
changeOptionId={changeOptionId}
defaultOption={{ code: taskModeId || "", dicItemName: "", dicItemCode: taskModeId || "" }}
size='big'
/>
@ -214,6 +227,7 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
title={'任务状态:'}
options={taskStatusArr}
changeOptionId={changeOptionId}
defaultOption={{ code: statusString=='3,4,5,6,7,8'?"":statusString, dicItemName: "", dicItemCode: statusString=='3,4,5,6,7,8'?"":statusString }}
size='big'
/>
</div>
@ -223,15 +237,17 @@ export default ({ history, current_user, showLoginDialog, location, mygetHelmeta
<SortBox
options={sortArr}
defaultOption={orderBy?{ type: orderBy || "" }:''}
changeOptionId={changeSort}
/>
<div className="center-right-but">
<Search
defaultValue={searchInput}
maxLength={20}
style={{ width: "300px" }}
placeholder="请输入任务编号/任务名称关键字"
onSearch={(value) => { setSearchInput(value); setCurPage(1); }}
onSearch={(value) => { setSearchInput(value); setCurPage(1) }}
/>
<Button className="mr20 font-12 demand_submission" type="primary" onClick={goAdd}><i className="iconfont icon-zaibianji font-12 mr3"></i>需求提报</Button>