Nigel
/
forgeplus-react
forked from Gitlink/forgeplus-react
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

@who（缺优化）

This commit is contained in:
谢思 2021-10-21 09:41:17 +08:00
parent e3f49db5c0
commit 18b289b84c
4 changed files with 151 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/forge/Merge/merge_form.js
View File

@ -25,6 +25,7 @@ class MergeForm extends Component {
issue_tags: undefined,
issue_versions: undefined,
issue_priories: undefined,
atWhoLoginList:undefined
};
}
@ -146,7 +147,15 @@ class MergeForm extends Component {
} else {
values.issue_tag_ids = [];
}
const { desc } = this.state;
const { desc , atWhoLoginList } = this.state;
//发送消息
if(atWhoLoginList.length != 0){
axios.post(`/users/${owner}/messages.json`,{
type:"atme",
receivers_login:atWhoLoginList,
atmeable_type:"PullRequest"
})
}
if (merge_type === "new") {
let url = `/${owner}/${projectsId}/pulls.json`;
axios.post(url, {
@ -224,6 +233,13 @@ class MergeForm extends Component {
});
};
//合并请求中at谁列表（存储：login）
changeAtWhoLoginList = (loginList) =>{
this.setState({
atWhoLoginList:loginList,
});
};
render() {
const { merge_type } = this.props;
const { getFieldDecorator } = this.props.form;
@ -272,6 +288,8 @@ class MergeForm extends Component {
mdID={"merge-new-description"}
initValue={desc}
onChange={this.onContentChange}
isCanAtme = {true}
changeAtWhoLoginList = {this.changeAtWhoLoginList}
></MDEditor>
<p className="clearfix mt20">
<Button

24
src/forge/Order/order_form.js
View File

@ -35,7 +35,8 @@ class order_form extends Component {
get_attachments: undefined,
show_token: false,
cannot_edit: false,
issue_current_user: true
issue_current_user: true,
atWhoLoginList:undefined
};
}
componentDidUpdate=(prevPros)=>{
@ -152,7 +153,16 @@ class order_form extends Component {
if (values.issue_tag_ids.length > 0) {
values.issue_tag_ids = [values.issue_tag_ids];
}
const { description, start_date, due_date, issue_type } = this.state;
const { description, start_date, due_date, issue_type , atWhoLoginList } = this.state;
//发送消息
if(atWhoLoginList.length != 0){
console.log('issue发送消息',atWhoLoginList);
axios.post(`/users/${owner}/messages.json`,{
type:"atme",
receivers_login:atWhoLoginList,
atmeable_type:"Issue"
})
}
if (form_type !== "edit") {
const url = `/${owner}/${projectsId}/issues.json`;
axios.post(url, {
@ -221,6 +231,14 @@ class order_form extends Component {
description: value,
});
};
//issue中at谁列表（存储：login）
changeAtWhoLoginList = (loginList) =>{
this.setState({
atWhoLoginList:loginList,
});
};
// 修改开始时间
changeBeginTime = (start_date, value) => {
this.setState({
@ -329,6 +347,8 @@ class order_form extends Component {
mdID={"order-new-description"}
initValue={description}
onChange={this.onContentChange}
isCanAtme = {true}
changeAtWhoLoginList = {this.changeAtWhoLoginList}
></MDEditor>
</div>
{get_attachments && get_attachments.length > 0 ? (

24
src/forge/comments/comments.js
View File

@ -30,6 +30,7 @@ class comments extends Component {
reply_id: undefined,
reply_content: undefined,
new_journal_id: undefined,
atWhoLoginList:undefined
};
}
@ -49,6 +50,7 @@ class comments extends Component {
});
return;
}
this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) {
const {
@ -58,10 +60,21 @@ class comments extends Component {
orderId,
reply_id,
is_reply,
atWhoLoginList,
} = this.state;
const url = `/issues/${orderId}/journals.json`;
const { owner } = this.props.match.params;
//发送消息
if(atWhoLoginList.length != 0){
axios.post(`/users/${owner}/messages.json`,{
type:"atme",
receivers_login:atWhoLoginList,
atmeable_type:"Issue"
})
}
const url = `/issues/${orderId}/journals.json`;
axios
.post(url, {
...values,
@ -258,6 +271,13 @@ class comments extends Component {
}
};
//评论中at谁列表（存储：login）
changeAtWhoLoginList = (loginList) =>{
this.setState({
atWhoLoginList:loginList,
});
};
onRef = (ref) => {
this.child = ref;
};
@ -335,6 +355,8 @@ class comments extends Component {
onChange={
is_reply ? this.replyContentChange : this.onContentChange
}
isCanAtme = {true}
changeAtWhoLoginList = {this.changeAtWhoLoginList}
></MDEditor>
<p className="quillFlag">
{quillFlag && <span className="">请输入评论内容</span>}

150
src/modules/tpm/challengesnew/tpm-md-editor.js
View File

@ -73,12 +73,14 @@ function md_elocalStorage(editor, mdu, id) {
return tid
}
export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, className = '', noStorage = false, imageExpand = true, placeholder = '', width = '100%', height = 400, initValue = '', emoji, watch, showNullButton = false, showResizeBar = false, startInit = true , forMember = true }) => {
export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, className = '', noStorage = false, imageExpand = true, placeholder = '', width = '100%', height = 400, initValue = '', emoji, watch, showNullButton = false, showResizeBar = false, startInit = true , forMember = true , isCanAtme = false ,changeAtWhoLoginList }) => {
const editorEl = useRef();
const resizeBarEl = useRef();
const [editorInstance, setEditorInstance] = useState();
const [atWhoVisible, setAtWhoVisible] = useState(false);
const [atWhoLoginListState, setAtWhoLoginListState] = useState([]);
const atWhoLoginList = useRef([]);
const containerId = `mdEditor_${mdID}`;
const editorBodyId = `mdEditors_${mdID}`;
const tipId = `e_tips_mdEditor_${mdID}`;
@ -86,7 +88,7 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
const users = [{image_url: "system/lets/letter_avatars/2/J/241_157_191/120.png",login: "jasonjun",profile_completed: false,user_id: 84965,username: "jasonjun"},
{image_url: "system/lets/letter_avatars/2/E/122_185_146/120.png",login: "Eo9ygbqns",profile_completed: false,user_id: 84963,username: "Eo9ygbqns"},
{image_url: "system/lets/letter_avatars/2/P/238_117_19/120.png",login: "postwoman",profile_completed: true,user_id: 84961,username: "PostWoman"},
{image_url: "system/lets/letter_avatars/2/X/70_163_90/120.png",login: "Es5ghtfik",profile_completed: false,user_id: 89516,username: "徐准"},
{image_url: "system/lets/letter_avatars/2/X/70_163_90/120.png",login: "xuzhun",profile_completed: false,user_id: 89516,username: "徐准"},
{image_url: "system/lets/letter_avatars/2/X/70_163_90/120.png",login: "Es5ghtfik",profile_completed: false,user_id: 89516,username: "徐准1"}]
function onLayout() {
@ -115,53 +117,23 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
const ch = cursor.ch;//列
//替换最后的内容
cm.replaceRange(username+" ",{line,ch},{line,ch});
//将此user的login存储到atWhoLoginList集合中
atWhoLoginListState
const list = new Set(atWhoLoginList.current);
users.map((item)=>{
item.username === username && list.add(item.login);
})
atWhoLoginList.current = Array.from(list);
setAtWhoLoginListState(Array.from(list));
}
// useEffect (()=>{
// //监听上下键和enter键 选中atwo
// atWhoVisible && document.onkeydown((e)=>{
// //上
// if(e.key === "ArrowUp"){
// console.log('上');
// }
// //下
// if(e.key === "ArrowDown"){
// console.log('下');
// }
// //enter
// if(e.key === "Enter"){
// console.log('Enter');
// }
// })
// },[])
// function handleKeyDown(e){
// //上
// if(e.key === "ArrowUp"){
// console.log('上');
// }
// //下
// if(e.key === "ArrowDown"){
// console.log('下');
// }
// //enter
// if(e.key === "Enter"){
// console.log('Enter');
// }
// }
useEffect(()=>{
console.log('@谁列表发生变化,atWhoLoginList.current：',atWhoLoginList.current,'atWhoLoginListState: ',atWhoLoginListState);
changeAtWhoLoginList && changeAtWhoLoginList(atWhoLoginListState);
},[atWhoLoginListState])
const atWhoList = (
// <Menu className="at_who_list" id="at_who_list">
// {users && users.map((item,key)=>{
// return(
// <Menu.item>
// { item.image_url && <img src={getImageUrl(item.image_url)}></img> }
// <span>{item.username}</span>
// </Menu.item>
// )
// })}
// </Menu>
<div className="at_who_list" id="at_who_list" onkeydown ={(e)=>{handleKeyDown(e)}}>
<div className="at_who_list" id="at_who_list" >
{users && users.map((item,key)=>{
return(
<div key={key} className="at_who" onClick={()=>{selectAtWho(item.username)}}>
@ -274,24 +246,78 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
if (!noStorage) {
tid = md_elocalStorage(editorInstance, `MDEditor__${containerId}`, containerId)
}
//isCanAtme:只有issue和合并请求以及评论部分可以@他人操作
//当光标或选中内容时触发绑定@事件
editorInstance.cm.on("focus", () => {
if (forMember) {
document.onkeydown = (e) => {
// console.log('e',e);
if (e.key === "@") {
// 输入@键后在对应的位置显示可选的项目成员
setAtWhoVisible(true);
//获取光标位置
const cssStyle = document.getElementsByClassName("CodeMirror cm-s-default CodeMirror-wrap")[0].firstChild.style;
//设置弹框位置
document.getElementById("at_who_list").style.top = (parseInt(cssStyle.getPropertyValue("top").replace("px",""))+60)+"px";
document.getElementById("at_who_list").style.left = (parseInt(cssStyle.getPropertyValue("left").replace("px",""))+20)+"px";
} else {
setAtWhoVisible(false);
isCanAtme && editorInstance.cm.on("focus", () => {
document.onkeydown = (e) => {
if (e.key === "@") {
// 输入@键后在对应的位置显示可选的项目成员
setAtWhoVisible(true);
//获取光标位置
const cssStyle = document.getElementsByClassName("CodeMirror cm-s-default CodeMirror-wrap")[0].firstChild.style;
//设置弹框位置
document.getElementById("at_who_list").style.top = (parseInt(cssStyle.getPropertyValue("top").replace("px",""))+60)+"px";
document.getElementById("at_who_list").style.left = (parseInt(cssStyle.getPropertyValue("left").replace("px",""))+20)+"px";
} else {
setAtWhoVisible(false);
}
if(atWhoLoginList.current.length != 0){
console.log('initValue',initValue);
const codemirror = editorInstance.cm;
const value = codemirror.getValue();
//处理初始内容就自带@谁的情况
if(initValue){
users.map(item=>{
if(initValue.indexOf(item.username)!=-1 && initValue.charAt(initValue.indexOf(item.username)-1) === "@" && initValue.indexOf(`@${item.username}`)===value.indexOf(`@${item.username}`)){
//初始内容中有符合@+名字的格式并且当前内容未删除初始内容
value.replace(`@${username}`,"");
}
})
Array.from(atWhoMap.keys()).map(username=>{
if(initValue.indexOf(username)!=-1 && value.charAt(value.indexOf(username)-1) === "@"){
}
})
console.log('剔除初始内容中的@who',value);
}
};
}
//以username为主键，login为value的map集合
let atWhoMap = new Map();
Array.from(atWhoLoginList.current).map(item=>{
users.map(i=>{
if(i.login === item){
atWhoMap.set(i.username,i.login);
}
})
});
if(value.indexOf("@") === -1){
//已经有要@的列表，但是没有@符号 -> 清空@集合
atWhoLoginList.current = [];
setAtWhoLoginListState([]);
return;
}
const cursor = codemirror.doc.getCursor();
const line = cursor.line;
const ch = cursor.ch;
const lineContent = codemirror.getLine(line);
if(lineContent && lineContent.indexOf("@") != -1){//此行有@谁
Array.from(atWhoMap.keys()).map(username=>{
//判断lineContent是不是以列表中的某个username结尾
if(lineContent.endsWith(username)){
codemirror.setSelection({line,ch:ch-username.length-1},{line,ch});
return;
}
//处理有名字但是无@符号，有@但是名字对不上的情况
if(value.indexOf(username)===-1 || value.charAt(value.indexOf(username)-1) !="@"){
//符合任意一种情况->踢掉这个人 不给他发消息
const list = new Set(atWhoLoginList.current);
list.delete(atWhoMap.get(username));
atWhoLoginList.current = Array.from(list);
setAtWhoLoginListState(Array.from(list));
}
})
}
}
};
});
editorInstance.cm.on("blur", () => {
document.onkeydown = null ;
@ -299,8 +325,6 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
editorInstance.cm.on("change", (cm) => {
onChange && onChange(cm.getValue());
});
if (onChange) {
}
ro = onLayout()
return () => {
if (!noStorage) {