diff --git a/src/App.js b/src/App.js index 442d4f323..3072aca5b 100644 --- a/src/App.js +++ b/src/App.js @@ -97,10 +97,10 @@ const ProjectIndex = Loadable({ loading: Loading, }); -const CreateMerge = Loadable({ - loader: () => import('./forge/Merge/NewMerge'), - loading: Loading, -}) +// const CreateMerge = Loadable({ +// loader: () => import('./forge/Merge/NewMerge'), +// loading: Loading, +// }) // 此处仅维护前端可能的一级路由，不用进行项目或者组织判断的字段。 const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize"]; @@ -279,7 +279,7 @@ class App extends Component { } /> {/* 项目PR */} - () } diff --git a/src/forge/Activity/ActivityItem.js b/src/forge/Activity/ActivityItem.js index 2b1ad3c8c..48a72e797 100644 --- a/src/forge/Activity/ActivityItem.js +++ b/src/forge/Activity/ActivityItem.js @@ -27,7 +27,7 @@ class ActivityItem extends Component { : // 如果是合并请求

- {item.name} + {item.name} {item.trend_type}

} diff --git a/src/forge/Main/CoderDepot.jsx b/src/forge/Main/CoderDepot.jsx index f2e4e149a..8dd5e4681 100644 --- a/src/forge/Main/CoderDepot.jsx +++ b/src/forge/Main/CoderDepot.jsx @@ -426,7 +426,7 @@ function CoderDepot(props){
{ baseOperate && - urlLink(`/${owner}/${projectsId}/pulls/new/${branchName || defaultBranch}`)} >+ 合并请求 + urlLink(`/${owner}/${projectsId}/compare/master...${branchName || defaultBranch}`)} >+ 合并请求 } { baseOper && diff --git a/src/forge/Main/Detail.js b/src/forge/Main/Detail.js index 157b0e26c..06d2fc44b 100644 --- a/src/forge/Main/Detail.js +++ b/src/forge/Main/Detail.js @@ -70,7 +70,7 @@ const MergeIndexDetail = Loadable({ }) const CreateMerge = Loadable({ - loader: () => import('../Merge/NewMerge'), + loader: () => import('../Merge/CreateMerge'), loading: Loading, }) @@ -150,7 +150,9 @@ function checkPathname(projectsId, owner, pathname) { name = "about" } else if (url.indexOf("/issues") > -1 || url.indexOf("Milepost") > 0) { name = "issues"; - } else if (url.indexOf("/pulls") > -1) { + } else if (url.indexOf("/pulls") > -1 || url.indexOf("/compare") > -1) { + // /pulls，合并请求除新建合并请求外， + // /compare，新建合并请求 name = "pulls" } else if (url.indexOf("/milestones") > -1) { name = "milestones" @@ -318,6 +320,9 @@ class Detail extends Component { const url = `/${owner}/${projectsId}/detail.json`; axios.get(url).then((result) => { if (result && result.data) { + if (result.data.status === 404) { + this.props.history.push('/nopage'); + } this.setState({ projectDetail: result.data, project_id: result.data.project_id, @@ -713,22 +718,32 @@ class Detail extends Component { } > {/* 新建合并请求 */} - () + } + > */} + () } > - () - } - > - () } > - () + } + > + () + } + > + () } diff --git a/src/forge/Main/tree/Index.jsx b/src/forge/Main/tree/Index.jsx index 84220a0bb..2fc574349 100644 --- a/src/forge/Main/tree/Index.jsx +++ b/src/forge/Main/tree/Index.jsx @@ -91,7 +91,7 @@ function Index(props) {
{ (isManager || isDeveloper) && (projectDetail && projectDetail.type!==2) && - + 合并请求 + + 合并请求 } 下载 diff --git a/src/forge/Merge/CreateMerge.js b/src/forge/Merge/CreateMerge.js new file mode 100644 index 000000000..0f6859071 --- /dev/null +++ b/src/forge/Merge/CreateMerge.js @@ -0,0 +1,438 @@ +import React, { Component } from 'react'; +import { Input, Select, Spin, Alert } from 'antd'; +import axios from 'axios'; +import MergeForm from './merge_form'; +import MergeFooter from './merge_footer'; + +import '../Order/order.css'; +import './merge.css'; + +/** + * 根据url获取目标仓库、目标分支、源仓库、源分支 + * 路由规则：owner/projectId/compare/merge...pullowner:pullBranch + * 可能存在的情况 + * 1、代码库首页跳转，仓库相同，目标分支为默认分支，owner/projectId/compare/pullBranch + * 2、代码库分支列表，仓库相同，目标分支为默认分支，owner/projectId/compare/pullBranch + * 3、合并请求列表页（新建、无数据时的提示），仓库相同，源、目标都为默认分支，owner/projectId/compare + * 4、新建页面，切换分支、切换目标仓库、刷新页面等，存在所有可能情况 + */ +function getBranchParams(pathname) { + const result = { + // 目标仓库所有者 + mergeOwner: undefined, + // 目标分支 + mergeBranch: 'master', + // 源仓库所有者 + pullOwner: undefined, + // 源分支 + pullBranch: 'master', + // 仓库名称 + projectId: undefined, + }; + // 去掉第一个字符/ + const _pathname = pathname.slice(1); + const [ownerProject, branchUrl] = _pathname.split('/compare'); + const [mergeOwner, projectId] = ownerProject.split('/'); + // 同仓库时 + result.mergeOwner = mergeOwner; + result.pullOwner = mergeOwner; + result.projectId = projectId; + if (branchUrl) { + // 如果存在具体的分支 + const _branchUrl = branchUrl.slice(1); + if (_branchUrl.indexOf('...') > -1) { + // 存在源分支与目标分支 + const [mergeBranch, pullObj] = _branchUrl.split('...'); + result.mergeBranch = mergeBranch; + if (pullObj.indexOf(':') > -1) { + // 存在源仓库 + const [pullOwner, pullBranch] = pullObj.split(':'); + result.pullOwner = pullOwner; + result.pullBranch = pullBranch; + } else { + result.pullBranch = pullObj; + } + } else { + result.pullBranch = _branchUrl; + } + } + return result; +} + +const Option = Select.Option; + +class CreateMerge extends Component { + constructor(props) { + super(props); + const { pullBranch, mergeBranch } = getBranchParams( + this.props.location.pathname + ); + this.state = { + data: undefined, + pullBranches: undefined, + mergeBranches: undefined, + mergeProjects: undefined, + merge: mergeBranch || 'master', + pull: pullBranch || 'master', + id: undefined, + // isFork: false, + projects_names: undefined, + isSpin: true, + showMessage: false, + merge_head: false, // 是否向fork后的源项目发起合并请求 + defaultMessage: '必须选择不同的分支', + project_id: undefined, // 当前项目的id，也即开始发送合并请求的源项目id + merge_project_user: undefined, + comparesData: undefined, //提交和文件的内容，保存compare接口返回的数据 + // 比较分支时的加载效果 + isCompareSpin: true, + // 是否是初次加载，用这个字段来控制提示组件和文件组件的显示、隐藏比直接用isCompareSpin交互友好些 + isFirstLoading: true, + }; + } + + componentDidMount = () => { + // 初始化时根据url获取目标仓库、分支，源仓库、分支； + // 再获取对应的仓库列表、分支列表 + // 再调用比较接口 + const branchParams = getBranchParams(this.props.location.pathname); + console.log('componentDidMount branchParams', branchParams); + this.getMergeInfo(branchParams); + }; + + componentDidUpdate = (preProps) => { + // url变化触发时（切换源分支、切换目标仓库、切换目标分支；回退） + const oldPathname = preProps.location.pathname; + const newPathname = this.props.location.pathname; + if (oldPathname !== newPathname) { + const branchParams = getBranchParams(newPathname); + console.log('componentDidUpdate branchParams', branchParams); + this.getMergeInfo(branchParams); + } + }; + + //获取新建合并请求数据 + getMergeInfo = (branchParams) => { + this.setState({ isSpin: true }); + const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } = + branchParams; + const url = `/${pullOwner}/${projectId}/pulls/new.json`; + axios + .get(url) + .then((result) => { + if (result) { + // 如果url上的分支不存在，取默认值master + const noMergeBranch = + (result.data.branches || []).filter( + (branch) => branch.name === mergeBranch + ).length === 0; + const noPullBranch = + (result.data.branches || []).filter( + (branch) => branch.name === pullBranch + ).length === 0; + this.setState({ + // isFork: result.data.is_fork, + projects_names: result.data.projects_names, + mergeProjects: result.data.merge_projects, + pullBranches: result.data.branches, + mergeBranches: result.data.branches, + project_id: result.data.project_id, + id: result.data.id, + merge: mergeBranch, + pull: pullBranch, + }); + + if (!noMergeBranch && !noPullBranch) { + this.compareProject(result.data.id, branchParams); + } else { + const _message = []; + noMergeBranch && _message.push('目标分支不存在'); + noPullBranch && _message.push('源分支不存在'); + this.setState({ + showMessage: true, + defaultMessage: _message.join(' , '), + isCompareSpin: false, + }); + } + } + if (pullOwner !== mergeOwner) { + this.getBranchList(branchParams); + } + this.setState({ isSpin: false }); + }) + .catch((error) => { + this.setState({ isSpin: false }); + console.log(error); + }); + }; + + // compare接口，获取分支对比信息 + compareProject = (baseid, branchParams) => { + // const { project } = this.props; + // const { owner, projectsId } = this.props.match.params; + const projectObj = this.props.project; + const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } = + branchParams; + + let url = `/${mergeOwner}/${projectId}/compare`; + if (projectObj) { + if (baseid === projectObj.id) { + url += `/${pullBranch}...${mergeBranch}.json`; + } else { + url += `/${mergeBranch}...${pullOwner}/${projectId}:${pullBranch}.json`; + } + this.setState({ isSpin: false, isCompareSpin: true }); + axios + .get(url) + .then((result) => { + if (result) { + if (result.data.status === 0) { + this.setState({ + showMessage: false, + }); + } else { + this.setState({ + showMessage: true, + defaultMessage: result.data.message, + }); + } + this.setState({ + comparesData: result.data, + }); + } + this.setState({ + isFirstLoading: false, + isSpin: false, + isCompareSpin: false, + }); + }) + .catch((error) => { + this.setState({ isSpin: false, isCompareSpin: false }); + }); + } + }; + + // 根据所有者、仓库名，获取分支列表，目前仅涉及目标仓库分支查询 + getBranchList = ({ mergeOwner, projectId, mergeBranch }) => { + this.setState({ isSpin: true }); + const url = `/${mergeOwner}/${projectId}/pulls/get_branches.json`; + axios + .get(url) + .then((result) => { + if (result) { + const noMergeBranch = + (result.data || []).filter((branch) => branch.name === mergeBranch) + .length === 0; + this.setState({ + mergeBranches: result.data, + merge: noMergeBranch ? 'master' : mergeBranch, + }); + } + this.setState({ isSpin: false }); + }) + .catch((error) => { + this.setState({ isSpin: false }); + console.log(error); + }); + }; + + // 切换分支事件 + selectBrach = (type, value) => { + const { pullOwner, pullBranch, mergeOwner, mergeBranch, projectId } = + getBranchParams(this.props.location.pathname); + let _url = `/${mergeOwner}/${projectId}/compare/`; + // type为pull时，pullBranch取value，否则取原有值 + // type为pull时，mergeBranch取原有值，否则取value + let _pullBranch = type === 'pull' ? value : pullBranch; + let _mergeBranch = type === 'pull' ? mergeBranch : value; + if (pullOwner === mergeOwner) { + // 如果仓库相同, compare/目标分支...源分支 + _url += `${_mergeBranch}...${_pullBranch}`; + } else { + // 如果仓库不同, compare/目标分支...源分支 + _url += `${_mergeBranch}...${pullOwner}:${_pullBranch}`; + } + this.props.history.push(_url); + }; + + // 切换仓库响应事件，目前仅目标分支可切换仓库 + selectProjectName = (value) => { + const { projects_names, id } = this.state; + const { pullOwner, pullBranch } = getBranchParams( + this.props.location.pathname + ); + let arr = + projects_names && projects_names.filter((item) => item.id === value); + let identifier = arr && arr[0].project_id; + let login = arr && arr[0].project_user_login; + // 目标仓库与源仓库不是一个仓库 + let is_fork = parseInt(value, 10) !== parseInt(id, 10); + this.setState({ + isSpin: true, + // merge_head: is_fork, + data: { + is_original: is_fork, + fork_project_id: is_fork ? id : '', + merge_user_login: is_fork + ? projects_names[0].project_user_login + : undefined, + }, + }); + if (login === pullOwner) { + // 如果切换后, 仓库与源仓库一致了 + this.props.history.push( + `/${login}/${identifier}/compare/master...${pullBranch}` + ); + } else { + this.props.history.push( + `/${login}/${identifier}/compare/master...${pullOwner}:${pullBranch}` + ); + } + // this.newMergelist(login, identifier); + }; + + // 渲染分支列表 + renderBrances = (list) => { + if (list && list.length > 0) { + return list.map((item, key) => { + return ( + + ); + }); + } + }; + + // 渲染项目列表 + renderProjectNames = (list) => { + if (list && list.length > 0) { + return list.map((item, key) => { + return ( + + ); + }); + } + }; + + // 渲染html内容 + withHtml = (html) => { + return
; + }; + + render() { + const { + data, + pullBranches, + mergeBranches, + mergeProjects, + pull, + merge, + isSpin, + isCompareSpin, + isFirstLoading, + showMessage, + defaultMessage, + projects_names, + id, + comparesData, + } = this.state; + + let { project } = this.props; + + return ( +
+ +
+
+
+
源分支:
+ + + + +
+
+ +
+
+
+
目标分支:
+ + + + +
+
+
+ {/* 非加载状态且有提示 */} + {!isCompareSpin && showMessage && ( +
+ +
+ )} + {/* 非加载状态且可以提交 */} + {!isCompareSpin && !showMessage && ( + + )} +
+ {!isFirstLoading && ( + + )} + +
+ ); + } +} + +export default CreateMerge; diff --git a/src/forge/Merge/MergeDetail.js b/src/forge/Merge/MergeDetail.js index 76c31ba0a..11bd3858b 100644 --- a/src/forge/Merge/MergeDetail.js +++ b/src/forge/Merge/MergeDetail.js @@ -228,7 +228,7 @@ class MergeDetail extends Component {
{ data && data.issue.user_permission ? - 编辑 + 编辑 : '' }
diff --git a/src/forge/Merge/MergeItem.js b/src/forge/Merge/MergeItem.js index 884c50feb..dadd6d8a5 100644 --- a/src/forge/Merge/MergeItem.js +++ b/src/forge/Merge/MergeItem.js @@ -62,7 +62,7 @@ class MergeItem extends Component {

@@ -175,7 +175,7 @@ class MergeItem extends Component { {item.journals_count ? ( {item.journals_count} @@ -196,7 +196,7 @@ class MergeItem extends Component { >

diff --git a/src/forge/Merge/MergeLinkFooter.jsx b/src/forge/Merge/MergeLinkFooter.jsx new file mode 100644 index 000000000..2c9aa4814 --- /dev/null +++ b/src/forge/Merge/MergeLinkFooter.jsx @@ -0,0 +1,210 @@ +import React, { Component } from 'react'; +import { Tabs, Spin } from 'antd'; +import { Link } from 'react-router-dom'; +import axios from 'axios'; + +import Commits from './Commits'; +import Comments from '../comments/comments'; +import Files from './Files'; + +import '../Order/order.css'; +import './merge.css'; + +const { TabPane } = Tabs; + +class MergeFooter extends Component { + constructor(props) { + super(props); + this.state = { + commitsData: [], + filesData: undefined, + isSpin: false, + activeKey: '1', + commitCount: 0, + filesCount: 0, + // 总评论数量，包含回复 + commentsTotalCount: 0, + }; + } + componentDidMount() { + this.Init(); + // 为父组件绑定当前，以方便调用方法 + this.props.bindFootRef && this.props.bindFootRef(this); + } + + componentDidUpdate(prevProps) { + // 解决切换tab后浏览器回退不刷新的问题、点击tab后url变化但tab未切换的问题 + const newPathname = this.props.location.pathname; + const prevPathname = prevProps.location.pathname; + if (newPathname !== prevPathname) { + this.Init(true); + } + } + + Init = (isTabChange) => { + const { data, location, match } = this.props; + const { pathname } = location; + const { projectsId, owner, mergeId } = match.params; + + let activeKey = '1'; + if (pathname.indexOf('commits') > -1) { + activeKey = '2'; + this.getCommit(owner, projectsId, mergeId); + } else if (pathname.indexOf('files') > -1) { + activeKey = '3'; + this.getFile(owner, projectsId, mergeId); + } + if (isTabChange && activeKey === '1') { + this.refreshComment(); + } + this.setState({ + activeKey: activeKey, + commitCount: data && data.commits_count, + filesCount: data && data.files_count, + }); + }; + + bindCommentRef = (commentRef) => { + this.childComment = commentRef; + } + + refreshComment = () => { + this.childComment && this.childComment.getjournalslist(); + } + + getCommit = (owner, projectsId, mergeId) => { + this.setState({ isSpin: true }); + const url = `/${owner}/${projectsId}/pulls/${mergeId}/commits.json`; + axios + .get(url) + .then((result) => { + if (result) { + this.setState({ + commitsData: result.data.commits, + commitCount: result.data.commits_count, + }); + } + this.setState({ isSpin: false }); + }) + .catch((error) => { + this.setState({ isSpin: false }); + }); + }; + + getFile = (owner, projectsId, mergeId) => { + this.setState({ isSpin: true }); + const url = `/${owner}/${projectsId}/pulls/${mergeId}/files.json`; + axios + .get(url) + .then((result) => { + if (result) { + this.setState({ + filesData: result.data, + filesCount: result.data.files_count, + }); + } + this.setState({ isSpin: false }); + }) + .catch((error) => { + this.setState({ isSpin: false }); + }); + }; + + render() { + const { projectsId, owner, mergeId } = this.props.match.params; + + const { order_id, data = {} } = this.props; + const { + isSpin, + activeKey, + filesCount, + commitCount, + filesData, + commitsData = [], + } = this.state; + + // 评论数量优先取Comment组件中列表接口返回的，其次取合并请求详情接口中的，都没有取默认值0 + const commentsTotalCount = parseInt( + this.state.commentsTotalCount || data.comments_total_count || 0, + 10 + ); + + return ( +
+ + + + 评论 + {commentsTotalCount > 0 && ( + {commentsTotalCount} + )} + + } + key="1" + > + { + this.setState({ commentsTotalCount: commentsCount || 0 }); + }} + {...this.props} + bindCommentRef={this.bindCommentRef} + /> + + {commitCount > 0 && ( + + 提交 + {commitCount > 0 && ( + {commitCount} + )} + + } + key="2" + > + {commitsData.length > 0 && ( + + )} + + )} + {filesCount > 0 && ( + + 文件 + {filesCount > 0 && ( + {filesCount} + )} + + } + key="3" + > + + + )} + + +
+ ); + } +} +export default MergeFooter; diff --git a/src/forge/Merge/MessageCount.js b/src/forge/Merge/MessageCount.js index 8f78c0934..685f42355 100644 --- a/src/forge/Merge/MessageCount.js +++ b/src/forge/Merge/MessageCount.js @@ -1,7 +1,6 @@ import React, { Component } from "react"; import { Tabs } from 'antd'; import { Link } from "react-router-dom"; -import { AlignCenter } from '../Component/layout'; import axios from "axios"; import { getImageUrl } from "educoder"; import { @@ -11,7 +10,6 @@ import { Dropdown, Icon, Menu, - Select, Tag, Button, Alert, @@ -19,9 +17,8 @@ import { import "./merge.css"; import RenderHtml from "../../components/render-html"; import "../Order/order.css"; -import MergeFooter from "./merge_footer"; +import MergeLinkFooter from "./MergeLinkFooter"; -const Option = Select.Option; const TextArea = Input.TextArea; function turnbar(str){ @@ -61,6 +58,11 @@ class MessageCount extends Component { // this.clickBody(); }; + + bindFootRef = (footRef) => { + this.footRef = footRef; + } + clickBody=()=>{ document.body.addEventListener('click', e => { let name = e.target.className; @@ -150,6 +152,8 @@ class MessageCount extends Component { }); const { getDetail } = this.props; getDetail && getDetail(); + // 调用子组件的方法刷新评论列表 + this.footRef && this.footRef.refreshComment(); } else { this.setState({ SpinMerge: false }); } @@ -283,13 +287,13 @@ class MessageCount extends Component { conflict_files && conflict_files.length>0 &&

如下文件有代码冲突：

-

+

{ conflict_files.map((i,k)=>{ - return

{i}

+ return

{i}

}) } -

+
}
@@ -448,7 +452,7 @@ class MessageCount extends Component { type="green" ghost className="ml20" - onClick={()=>{this.props.history.push(`/${owner}/${projectsId}/pulls/${mergeId}/UpdateMerge`);}} + onClick={()=>{this.props.history.push(`/${owner}/${projectsId}/pulls/${mergeId}/edit`);}} > 编辑 @@ -543,7 +547,7 @@ class MessageCount extends Component { onChange={this.changbodypr} />
-

@@ -558,19 +562,19 @@ class MessageCount extends Component { 取消 -

+
)} - + bindFootRef={this.bindFootRef} + > ) : ( "" diff --git a/src/forge/Merge/NewMerge.js b/src/forge/Merge/NewMerge.js index 8913b0d1c..900dea824 100644 --- a/src/forge/Merge/NewMerge.js +++ b/src/forge/Merge/NewMerge.js @@ -6,6 +6,11 @@ import "./merge.css"; import MergeForm from "./merge_form"; import MergeFooter from "./merge_footer"; const Option = Select.Option; +/** + * 此文件已废弃，新文件为CreateMerge.js + * 2021.10.12 + */ + class NewMerge extends Component { constructor(props) { super(props); @@ -194,7 +199,7 @@ class NewMerge extends Component { // this.ischeckmerge(); let { id ,merge , pull } = this.state; if(type==="pull"){ - this.props.history.push(`/${owner}/${projectsId}/pulls/new/${pull}`) + this.props.history.push(`/${owner}/${projectsId}/compare/${pull}`) this.compareProject(id,value,merge); }else{ this.compareProject(id,pull,value); @@ -216,7 +221,7 @@ class NewMerge extends Component { merge_user_login: is_fork_id ? projects_names[0].project_user_login : undefined } }) - this.props.history.push(`/${login}/${identifier}/pulls/new`); + this.props.history.push(`/${login}/${identifier}/compare`); this.newMergelist(login,identifier); }; diff --git a/src/forge/Merge/UpdateMerge.js b/src/forge/Merge/UpdateMerge.js index 8ed8034af..001bedd57 100644 --- a/src/forge/Merge/UpdateMerge.js +++ b/src/forge/Merge/UpdateMerge.js @@ -69,7 +69,7 @@ class UpdateMerge extends Component { {" "} {" "} @@ -88,7 +88,7 @@ class UpdateMerge extends Component { {" "} {" "} diff --git a/src/forge/Merge/merge.css b/src/forge/Merge/merge.css index d5ce68d19..3ea2620cb 100644 --- a/src/forge/Merge/merge.css +++ b/src/forge/Merge/merge.css @@ -211,5 +211,6 @@ form .ant-cascader-picker, form .ant-select { } .mergeRequest .folders{ - width: 72rem; + /* width: 72rem; */ + width: 100%; } \ No newline at end of file diff --git a/src/forge/Merge/merge.js b/src/forge/Merge/merge.js index 399c9bd91..8a0eaedea 100644 --- a/src/forge/Merge/merge.js +++ b/src/forge/Merge/merge.js @@ -213,7 +213,7 @@ class merge extends Component { checkOperation() { const { projectsId,owner } = this.props.match.params; - this.props.history.push(`/${owner}/${projectsId}/pulls/new`); + this.props.history.push(`/${owner}/${projectsId}/compare/master...master`); } render() { const { projectsId , owner } = this.props.match.params; diff --git a/src/forge/Merge/merge_footer.js b/src/forge/Merge/merge_footer.js index 5e3a75560..868e736fe 100644 --- a/src/forge/Merge/merge_footer.js +++ b/src/forge/Merge/merge_footer.js @@ -1,169 +1,84 @@ -import React, { Component } from "react"; -import { Tabs, Spin } from "antd"; -import "../Order/order.css"; -import "./merge.css"; -import Commits from "./Commits"; -import Comments from "../comments/comments"; -import Files from "./Files"; -import axios from 'axios'; +import React, { Component } from 'react'; +import { Tabs } from 'antd'; +import Commits from './Commits'; +import Files from './Files'; + +import '../Order/order.css'; +import './merge.css'; + const { TabPane } = Tabs; class MergeFooter extends Component { - constructor(props){ + constructor(props) { super(props); - this.state={ - pageData:undefined, - commitsData:undefined, - filesData:undefined, - isSpin:false, - activeKey:"1", - commitCount:0, - filesCount:0 - } - } - componentDidMount=()=>{ - const { footer_type ,data } = this.props; - if(footer_type){ - const { projectsId , owner , mergeId } = this.props.match.params; - this.getCommit(owner,projectsId,mergeId); - this.getFile(owner,projectsId,mergeId); - } - this.setState({ - activeKey:footer_type ? "1" : "2", - commitCount:data && data.commits_count, - filesCount:data && data.files_count - }) - } - componentDidUpdate=(prevProps)=>{ - const { comparesData } = this.props; - const { footer_type } = this.props; - if(footer_type){ - const { data } = this.props; - if(data !== prevProps.data){ - this.setState({ - commitCount:data && data.commits_count, - filesCount:data && data.files_count - }) - } - } - if(comparesData !== prevProps.comparesData){ - this.setState({ - activeKey:footer_type ? "1" : "2" - }) - this.changeTab(footer_type ? "1" : "2"); - } + this.state = { + activeKey: '1', + }; } - changeTab=(index)=>{ + changeTab = (index) => { this.setState({ - isSpin:true - }) - this.setState({ - activeKey:index - }) - const { footer_type , comparesData } = this.props; - const { projectsId , owner , mergeId } = this.props.match.params; - - if(footer_type){ - if(index === "2"){ - this.getCommit(owner,projectsId,mergeId); - }else if(index === "3"){ - this.getFile(owner,projectsId,mergeId); - }else{ - this.setState({ - isSpin:false - }) - } - }else{ - this.setState({ - commitsData:comparesData.commits, - filesData:comparesData.diff, - commitCount:comparesData.commits_count, - filesCount:comparesData.diff && comparesData.diff.files_count, - isSpin:false - }) - } - } - - getCommit =(owner,projectsId,mergeId)=>{ - const url = `/${owner}/${projectsId}/pulls/${mergeId}/commits.json`; - axios.get(url).then(result=>{ - if(result){ - this.setState({ - commitsData:result.data.commits, - isSpin:false, - commitCount:result.data.commits_count - }) - } - }).catch(error=>{}) - } - - getFile =(owner,projectsId,mergeId)=>{ - const url = `/${owner}/${projectsId}/pulls/${mergeId}/files.json`; - axios.get(url).then(result=>{ - if(result){ - this.setState({ - filesData:result.data, - isSpin:false, - filesCount:result.data.files_count, - }) - } - }).catch(error=>{}) - } + activeKey: index, + }); + }; render() { - const { projectsId , owner } = this.props.match.params; + const { projectsId, owner } = this.props.match.params; + const { comparesData = {} } = this.props; + const { commits, diff, commits_count } = comparesData; + const { activeKey } = this.state; - const { footer_type, order_id, data , comparesData } = this.props; - let { isSpin , activeKey , filesCount, commitCount , filesData , commitsData } = this.state; - - return ( - !footer_type && !comparesData || (comparesData && ((comparesData.commits && comparesData.commits.length===0)||(comparesData && !comparesData.diff)) )?"": -
- - - { - footer_type && - 评论 - {data && parseInt(data.comments_count) > 0 && {data.comments_count}} - - } key="1"> - - - } - { - commitsData && commitsData.length > 0 && - 提交 - {commitCount > 0 && {commitCount}} - } key="2"> - - - } - { - filesData && filesData.files && filesData.files.length>0 && - 文件 - {filesCount > 0 && {filesCount}} - - } key="3"> - - - } - - - + return (commits && commits.length === 0) || !diff ? ( + '' + ) : ( +
+ + {commits && commits.length > 0 && ( + + 提交 + {commits_count > 0 && ( + {commits_count} + )} + + } + key="1" + > + + + )} + {diff && diff.files && diff.files.length > 0 && ( + + 文件 + {diff.files_count > 0 && ( + {diff.files_count} + )} + + } + key="3" + > + + + )} +
); } diff --git a/src/forge/Merge/merge_form.js b/src/forge/Merge/merge_form.js index 5df9794bb..4716bdfca 100644 --- a/src/forge/Merge/merge_form.js +++ b/src/forge/Merge/merge_form.js @@ -165,7 +165,8 @@ class MergeForm extends Component { this.setState({ isSpin: false, }); - this.props.history.push(`/${owner}/${projectsId}/pulls`); + const { pull_request_id } = result.data; + this.props.history.push(`/${owner}/${projectsId}/pulls/${pull_request_id}`); const { getDetail } = this.props; getDetail && getDetail(); } else { @@ -195,7 +196,7 @@ class MergeForm extends Component { isSpin: false, }); this.props.history.push( - `/${owner}/${projectsId}/pulls/${mergeId}/Messagecount` + `/${owner}/${projectsId}/pulls/${mergeId}` ); } else { this.setState({ @@ -287,7 +288,7 @@ class MergeForm extends Component { type="default" className="ml30" onClick={()=>{ - this.props.history.push(merge_type === "new" ? `/${owner}/${projectsId}/pulls` : `/${owner}/${projectsId}/pulls/${mergeId}/detail`) + this.props.history.push(merge_type === "new" ? `/${owner}/${projectsId}/pulls` : `/${owner}/${projectsId}/pulls/${mergeId}`) }} > 取消 diff --git a/src/forge/Merge/no_data.js b/src/forge/Merge/no_data.js index d5584797f..d5e4ca89b 100644 --- a/src/forge/Merge/no_data.js +++ b/src/forge/Merge/no_data.js @@ -12,7 +12,7 @@ class Nodata extends Component{

欢迎使用合并请求！

- 合并请求可以帮助您与他人协作编写代码。在使用之前，请先创建一个 合并请求 + 合并请求可以帮助您与他人协作编写代码。在使用之前，请先创建一个 合并请求
diff --git a/src/forge/comments/children_comments.js b/src/forge/comments/children_comments.js index 450a30f13..75330161a 100644 --- a/src/forge/comments/children_comments.js +++ b/src/forge/comments/children_comments.js @@ -17,6 +17,7 @@ class children_comments extends Component { page: 1, journal_spin: false, search_count: 0, + isSpin: false, }; } @@ -71,6 +72,9 @@ class children_comments extends Component { .then((result) => { if (result) { this.getChildrenJournals(); + // 删除回复后，如果需手动调用父组件查询评论列表的接口，以保持角标（评论数量）的一致（合并请求页面）， + // 否则直接查顶级评论列表，否则只查询当前子评论列表（易修页面） + this.props.refreshCommentList && this.props.refreshCommentList(); } }) .catch((error) => { @@ -80,9 +84,15 @@ class children_comments extends Component { // 翻页 ChangePage = (page) => { - this.state.page = page; - this.state.isSpin = true; - this.getChildrenJournals(); + // this.state.page = page; + // this.state.isSpin = true; + // 使用回调的写法，这样在getChildrenJournals中使用的就是最新的state + this.setState({ + page, + isSpin: true + }, () => { + this.getChildrenJournals(); + }); }; commentCtx = (v) => { @@ -183,7 +193,7 @@ class children_comments extends Component { size="large" loading={isSpin} dataSource={journalsdata.issue_journals} - renderItem={(item) => {this.renderList(item)}} + renderItem={(item) => {this.renderList(item)}} /> {this.Paginations()} diff --git a/src/forge/comments/comments.js b/src/forge/comments/comments.js index c27bb12af..dca7581f2 100644 --- a/src/forge/comments/comments.js +++ b/src/forge/comments/comments.js @@ -35,6 +35,8 @@ class comments extends Component { componentDidMount = () => { this.getjournalslist(); + // 给父组件绑定，以使父组件可以使用组件内方法，用于切换tab时重新请求评论列表、合并请求完之后重新请求评论列表 + this.props.bindCommentRef && this.props.bindCommentRef(this); }; //添加评论 @@ -151,6 +153,8 @@ class comments extends Component { isSpin: false, fileList: undefined, }); + const { updateCommentsNum } = this.props; + updateCommentsNum && updateCommentsNum(result.data.journals_total_count); } }) .catch((error) => { @@ -372,7 +376,7 @@ class comments extends Component { const renderList = (item) => { return ( -
+
@@ -500,7 +505,7 @@ class comments extends Component { loading={isSpin} header="" dataSource={journalsdata.issue_journals} - renderItem={(item) => {renderList(item)}} + renderItem={(item) => {renderList(item)}} /> )} {this.Paginations()} @@ -558,7 +563,7 @@ class comments extends Component { header="" dataSource={journalsdata.issue_journals} renderItem={(item) => ( - {renderList(item)} + {renderList(item)} )} /> )}