pr列表页排序及列表优化

forge
dingyongkang 5 years ago
parent 0f2e3eb5dc
commit f38a7b5d27

@ -2,6 +2,21 @@ import React , { Component } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
class MergeItem extends Component{ class MergeItem extends Component{
set_issue_tags =(issue_tags)=>{
if(issue_tags && issue_tags.length > 0){
return(
issue_tags.map((item,key)=>{
return(
<span className="issue-tag-show" style={{background: item.color}}>{item.name}</span>
)
})
)
}else{
return("--")
}
}
render(){ render(){
const { issues , search_count , page , limit } = this.props; const { issues , search_count , page , limit } = this.props;
const { projectsId } = this.props.match.params; const { projectsId } = this.props.match.params;
@ -21,6 +36,13 @@ class MergeItem extends Component{
{ item.journals_count ? <span className="ml20"><i className="iconfont icon-pinglun1 mr3 font-16"></i>{item.journals_count}</span> : "" } { item.journals_count ? <span className="ml20"><i className="iconfont icon-pinglun1 mr3 font-16"></i>{item.journals_count}</span> : "" }
</p> </p>
</div> </div>
<ul className="topWrapper_select">
<li>{this.set_issue_tags(item.issue_tags)}</li>
{/*<li>{item.issue_type || "--"}</li>*/}
<li>{item.version || "--"}</li>
<li>{item.author_name || "--"}</li>
<li>{ item.journals_count ? <span><i className="iconfont icon-pinglun1 mr3 font-16"></i>{item.journals_count}</span> : "" }</li>
</ul>
</div> </div>
) )
}) })

@ -134,23 +134,23 @@ class UpdateMerge extends Component{
const { fileList } = this.state; const { fileList } = this.state;
this.props.form.validateFieldsAndScroll((err, values) => { this.props.form.validateFieldsAndScroll((err, values) => {
if(!err){ if(!err){
const { projectsId} = this.props.match.params; const { projectsId,mergeId} = this.props.match.params;
const { subject ,data} = this.state; const { subject ,data} = this.state;
const url = `/projects/${projectsId}/issues/${data.issue.id}.json`; const url = `/projects/${projectsId}/pull_requests/${mergeId}.json`;
if(values.issue_tag_ids===0){
values.issue_tag_ids = "" if(values.issue_tag_ids===''){
values.issue_tag_ids = []
}else{ }else{
values.issue_tag_ids = [values.issue_tag_ids]
} }
if(values.assigned_to_id===0){ if(values.assigned_to_id===0){
values.assigned_to_id = "" values.assigned_to_id = ""
} }
axios.put(url,{ axios.put(url,{
project_id:projectsId, project_id:projectsId,
subject:subject,
id: data.issue.id, id: data.issue.id,
description:this.state.textcount,
attachment_ids:fileList, attachment_ids:fileList,
...values ...values
}).then(result=>{ }).then(result=>{
@ -184,7 +184,7 @@ class UpdateMerge extends Component{
<Link to={``}><img class="user_img" src={getImageUrl(`images/${current_user && current_user.image_url}`)} alt=""/></Link> <Link to={``}><img class="user_img" src={getImageUrl(`images/${current_user && current_user.image_url}`)} alt=""/></Link>
<div className="new_context"> <div className="new_context">
<Form.Item> <Form.Item>
{getFieldDecorator('subject', { {getFieldDecorator('title', {
rules: [{ rules: [{
required: true, message: '请填写工单标题' required: true, message: '请填写工单标题'
}], }],
@ -194,7 +194,7 @@ class UpdateMerge extends Component{
)} )}
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator('description', { {getFieldDecorator('body', {
rules: [], rules: [],
initialValue: textcount initialValue: textcount
})( })(

@ -43,6 +43,11 @@ class merge extends Component{
//设置选择高亮 //设置选择高亮
openselect:1, openselect:1,
closeselect:undefined, closeselect:undefined,
issue_tag_ids:'标签筛选',
issue_versions:'里程碑筛选',
assigned_to_ids:'指派人筛选',
paix:'排序'
} }
} }
@ -67,12 +72,12 @@ class merge extends Component{
} }
// 获取列表数据 // 获取列表数据
getIssueList=(page,limit,search,author_id,assigned_to_id,id,value,status_type)=>{ getIssueList=(page,limit,search,author_id,assigned_to_id,id,value,status_type,order_type,order_name)=>{
const { projectsId } = this.props.match.params; const { projectsId } = this.props.match.params;
const url = `/projects/${projectsId}/pull_requests.json`; const url = `/projects/${projectsId}/pull_requests.json`;
axios.get(url,{ axios.get(url,{
params:{ params:{
page,limit,search,author_id,assigned_to_id,status_type, page,limit,search,author_id,assigned_to_id,status_type,order_type,order_name,
[id]:value [id]:value
} }
}).then((result)=>{ }).then((result)=>{
@ -89,7 +94,25 @@ class merge extends Component{
}) })
} }
getOption=(e,id)=>{ getOption=(e,id,name)=>{
if(id+'s'==="issue_tag_ids"){
this.setState({
[id]:e.key,
issue_tag_ids:name
})
}
if(id+'s'==="issue_versions"){
this.setState({
[id]:e.key,
issue_versions:name
})
}
if(id+'s'==="assigned_to_ids"){
this.setState({
[id]:e.key,
assigned_to_ids:name
})
}
this.setState({ this.setState({
[id]:e.key [id]:e.key
}) })
@ -104,11 +127,11 @@ class merge extends Component{
renderMenu =(array,name,id)=>{ renderMenu =(array,name,id)=>{
return( return(
<Menu> <Menu>
<Menu.Item key={"all"} onClick={(e)=>this.getOption(e,id)}>{name}</Menu.Item> <Menu.Item key={"all"} onClick={(e)=>this.getOption(e,id,name)}>{name}</Menu.Item>
{ {
array && array.length > 0 && array.map((item,key)=>{ array && array.length > 0 && array.map((item,key)=>{
return( return(
<Menu.Item key={item.id} onClick={(e)=>this.getOption(e,id)}>{item.name}</Menu.Item> <Menu.Item key={item.id} onClick={(e)=>this.getOption(e,id,item.name)}>{item.name}</Menu.Item>
) )
}) })
} }
@ -160,41 +183,37 @@ class merge extends Component{
} }
arrayList=(e)=>{
// 筛选:全部、指派给我、由我创建
ChangeAssign=(type)=>{
const { limit, search} = this.state; const { limit, search} = this.state;
if(e.key==='created_on'){
if(e.item.props.value==="desc"){
this.setState({ this.setState({
isSpin:true paix:'到期日从近到远'
}) })
if(type){ }else{
const { current_user } = this.props;
if(type===1){
this.setState({ this.setState({
page:1, paix:'到期日从远到近'
author_id:undefined,
assigned_to_id:current_user.user_id
}) })
this.getIssueList(1,limit,search,undefined,current_user.user_id); }
}else{ }else{
if(e.item.props.value==="desc"){
this.setState({ this.setState({
page:1, paix:'完成度从低到高'
author_id:current_user.user_id,
assigned_to_id:undefined
}) })
this.getIssueList(1,limit,search,current_user.user_id,undefined);
}
}else{ }else{
this.setState({ this.setState({
page:1, paix:'完成度从高到低'
author_id:undefined,
assigned_to_id:undefined
}) })
this.getIssueList(1,limit,search,undefined,undefined);
} }
} }
this.setState({
order_name:e.key,
order_type:e.item.props.value
})
this.getIssueList(1,limit,search,undefined,undefined,undefined,undefined,undefined, e.item.props.value,e.key);
}
render(){ render(){
const { issue_chosen , issues , limit , page , search_count , data , isSpin,openselect,closeselect } = this.state; const { issue_chosen , issues , limit , page , search_count , data , isSpin,openselect,closeselect } = this.state;
@ -202,12 +221,10 @@ class merge extends Component{
const menu = ( const menu = (
<Menu onClick={this.arrayList}> <Menu onClick={this.arrayList}>
<Menu.Item key={'created_at'} value="desc">到期日从近到远</Menu.Item> <Menu.Item key={'created_on'} value="desc">到期日从近到远</Menu.Item>
<Menu.Item key={'created_at'} value="asc">到期日从远到近</Menu.Item> <Menu.Item key={'created_on'} value="asc">到期日从远到近</Menu.Item>
<Menu.Item key={'issues_count'} value="desc">完成度从低到高</Menu.Item> <Menu.Item key={'updated_on'} value="desc">完成度从低到高</Menu.Item>
<Menu.Item key={'issues_count'} value="asc">完成度从高到低</Menu.Item> <Menu.Item key={'updated_on'} value="asc">完成度从高到低</Menu.Item>
<Menu.Item key={'issues_count'} value="asc">工单从多到少</Menu.Item>
<Menu.Item key={'issues_count'} value="asc">工单从少到多</Menu.Item>
</Menu> </Menu>
) )
@ -251,27 +268,23 @@ class merge extends Component{
<ul className="topWrapper_select"> <ul className="topWrapper_select">
<li> <li>
<Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.issue_tag,'标签','issue_tag_id')} trigger={['click']} placement="bottomCenter"> <Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.issue_tag,'标签','issue_tag_id')} trigger={['click']} placement="bottomCenter">
<span>标签筛选<Icon type="caret-down" className="ml5" /></span> <span>{this.state.issue_tag_ids}<Icon type="caret-down" className="ml5" /></span>
</Dropdown> </Dropdown>
</li> </li>
<li> <li>
<Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.issue_version,'里程碑','issue_version')} trigger={['click']} placement="bottomCenter"> <Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.issue_version,'里程碑','issue_version')} trigger={['click']} placement="bottomCenter">
<span>里程碑筛选<Icon type="caret-down" className="ml5" /></span> <span>{this.state.issue_versions}<Icon type="caret-down" className="ml5" /></span>
</Dropdown> </Dropdown>
</li> </li>
<li> <li>
<Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.assign_user,'指派人','assigned_to_id')} trigger={['click']} placement="bottomCenter"> <Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.assign_user,'指派人','assigned_to_id')} trigger={['click']} placement="bottomCenter">
<span>指派人筛选<Icon type="caret-down" className="ml5" /></span> <span>{this.state.assigned_to_ids}<Icon type="caret-down" className="ml5" /></span>
</Dropdown>
</li>
<li>
<Dropdown className="topWrapperSelect" overlay={this.renderMenu(issue_chosen && issue_chosen.issue_type,'类型','issue_type')} trigger={['click']} placement="bottomCenter">
<span>类型筛选<Icon type="caret-down" className="ml5" /></span>
</Dropdown> </Dropdown>
</li> </li>
<li> <li>
<Dropdown className="topWrapperSelect" overlay={menu} trigger={['click']} placement="bottomCenter"> <Dropdown className="topWrapperSelect" overlay={menu} trigger={['click']} placement="bottomCenter">
<span>排序<Icon type="caret-down" className="ml5" /></span> <span>{this.state.paix}<Icon type="caret-down" className="ml5" /></span>
</Dropdown> </Dropdown>
</li> </li>
</ul> </ul>

Loading…
Cancel
Save