diff --git a/src/modules/tpm/challengesnew/tpm-md-editor.js b/src/modules/tpm/challengesnew/tpm-md-editor.js
index 4ae5c3742..d8638f545 100644
--- a/src/modules/tpm/challengesnew/tpm-md-editor.js
+++ b/src/modules/tpm/challengesnew/tpm-md-editor.js
@@ -93,7 +93,10 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
// quote相关
const [issues, setIssues ] = useState([]);
- const [ quoteVisible , setQuoteVisible ] = useState(false);
+ const [quoteVisible, setQuoteVisible] = useState(false);
+ const [screenIssues, setScreenIssues ] = useState([]);
+ const quoteVisibleRef = useRef(false);
+ const chooseIssuesList = useRef([]);
useEffect(()=>{
//请求members接口获取全部可@列表
@@ -107,6 +110,7 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
document.addEventListener('click',()=>{
atWhoVisibleRef.current = false;
setAtWhoVisible(false);
+ quoteVisibleRef.current = false;
setQuoteVisible(false);
})
@@ -114,12 +118,13 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
},[])
// 请求issues接口获取全部可quote的issue列表
- function getIssueList(keywords){
+ function getIssueList(keyword){
axios.get(`/v1/${owner}/${projectsId}/issues`,{params:{
- only_name:true,keywords
+ only_name:true,keyword
}}).then(result=>{
if(result && result.data.total_count!== 0){
- setIssues(result.data.issues);
+ !keyword && setIssues(result.data.issues);
+ setScreenIssues(result.data.issues);
}
})
}
@@ -127,7 +132,7 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
const QuoteDiv = (
{
- issues && issues.length>0 && issues.map((i,k)=>{
+ screenIssues && screenIssues.length>0 && screenIssues.map((i,k)=>{
return(
selectQuoteIssue(i)} onMouseOver={()=>onMouseOverQuote(k)}>
#{i.project_issues_index}
@@ -140,24 +145,70 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
)
// 点击选择要引用的issue
function selectQuoteIssue(i){
+ quoteVisibleRef.current = false;
+ setQuoteVisible(false);
const cm = editorInstance.cm;
//获取鼠标所在行的行数和ch
const cursor = cm.doc.getCursor();
const line = cursor.line;//行
const ch = cursor.ch;//列
- const startIndex = cm.getRange({line,ch:0},{line,ch}).lastIndexOf("@");
+ const startIndex = cm.getRange({line,ch:0},{line,ch}).lastIndexOf("#");
//替换内容
cm.replaceRange(`[#${i.project_issues_index}](/${owner}/${projectsId}/issues/${i.project_issues_index}) `,{line,ch:startIndex},{line,ch});
//鼠标聚焦
cm.focus();
- setQuoteVisible(false);
// 保存引用的issue
+ const list = new Set(chooseIssuesList.current);
+ list.add(i.project_issues_index);
+ chooseIssuesList.current = Array.from(list);
+ console.log(list);
+
}
function onMouseOverQuote(key){
document.getElementsByClassName("quote active")[0] && (document.getElementsByClassName("quote active")[0].className="quote");
document.getElementsByClassName("quote")[key] && (document.getElementsByClassName("quote")[key].className="quote active");
}
+ useEffect(()=>{
+ if(quoteVisibleRef.current){
+ const atWhoListDiv = document.getElementById("quoteDiv");
+ const atWhoDivs = document.getElementsByClassName("quote");
+ cmEl.addKeyMap({
+ 'Up':()=>{
+ let index;
+ for(let i = 0; i0){
+ index <=atWhoDivs.length-4 && (atWhoListDiv.scrollTop -=40)
+ atWhoDivs[index].className = "quote";
+ atWhoDivs[index-1].className = "quote active";
+ }
+ },
+ 'Down':()=>{
+ let index;
+ for(let i = 0; i=3 && (atWhoListDiv.scrollTop +=40)
+ atWhoDivs[index].className = "quote";
+ atWhoDivs[index+1].className = "quote active";
+ }
+ },
+ 'Enter':()=>{
+ //找到classname为quote active的div,执行click事件
+ if(document.getElementsByClassName("quote active")[0]){
+ document.getElementsByClassName("quote active")[0].click();
+ }
+ }
+ })
+ } else {
+ //移除上下、enter键监听
+ cmEl && cmEl.removeKeyMap();
+ }
+ },[quoteVisible])
+
function onLayout() {
let ro;
if (editorEl.current) {
@@ -210,6 +261,8 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
//设置弹框位置
const newTop = 62
const newLeft = 20;
+ const codemirror = editorInstance.cm;
+ let value = codemirror.getValue();
if (e.shiftKey && e.code === "Digit2") {
// 输入@键后在对应的位置显示可选的项目成员
atWhoVisibleRef.current = true;
@@ -219,8 +272,6 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
}
//处理本来@了某人 -> 删掉 -> 撤回 的情况
if(e.ctrlKey && e.code === "KeyZ" && allUsers.length !== 0){
- const codemirror = editorInstance.cm;
- let value = codemirror.getValue();
//处理初始内容就自带@谁的情况
if(initValue){
const del = [];
@@ -247,13 +298,15 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
}
if(e.shiftKey && e.code === "Digit3"){
// 输入#键后在对应的位置显示可选的项目issue
+ quoteVisibleRef.current = true;
setQuoteVisible(true);
document.getElementById("quoteDiv").style.top = parseInt(cssStyle.getPropertyValue("top").replace("px","")) + newTop +"px";
document.getElementById("quoteDiv").style.left = parseInt(cssStyle.getPropertyValue("left").replace("px",""))+newLeft+"px";
}
if(e.code==="Space"){
// 输入# 后又输入空格:隐藏issue列表
- setQuoteVisible(false);
+ // setQuoteVisible(false);
+ // quoteVisibleRef.current = false;
}
}
@@ -359,7 +412,7 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
if(atWhoVisibleRef.current){
// 添加上下键、enter键监听事件
cmEl.addKeyMap({
- 'Up':()=>{
+ 'Up':()=>{
const atWhoListDiv = document.getElementById("at_who_list");
const atWhoDivs = document.getElementsByClassName("at_who");
let index;
@@ -444,6 +497,25 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
editorInstance.cm.on("change", (cm) => {
//调用父组件的onchange方法,将输入内容传入父级组件
onChange && onChange(cm.getValue());
+ if(quoteVisibleRef.current){
+ const cur = cm.doc.getCursor();
+ const line = cur.line;
+ const ch = cur.ch;
+ let rangeCont = cmEl.getRange({line,ch:0},{line,ch});
+ // #后第一个字符为空时隐藏列表,否则不隐藏
+ if(rangeCont.indexOf("#")===-1){
+ setQuoteVisible(false);
+ quoteVisibleRef.current = false;
+ }else{
+ rangeCont = rangeCont.substring(rangeCont.lastIndexOf("#")+1);
+ if(rangeCont === " "){
+ setQuoteVisible(false);
+ quoteVisibleRef.current = false;
+ }else{
+ getIssueList(rangeCont);
+ }
+ }
+ }
if(atWhoVisibleRef.current){
//搜索用户(弹框之后用户输入用户名信息)
const cur = cm.doc.getCursor();
@@ -474,7 +546,6 @@ export default ({ mdID, onChange, onCMBeforeChange, onCMBlur, error = false, cla
if(atWhoLoginList.current.length != 0){
const codemirror = editorInstance.cm;
//startValue:触发change方法时的内容,value:处理了初始内容带@用户的情况
- let startValue = codemirror.getValue();
let value = codemirror.getValue();
//处理初始内容就自带@谁的情况
if(initValue){