diff --git a/src/forge/Issues/Component/chooseMenu.jsx b/src/forge/Issues/Component/chooseMenu.jsx new file mode 100644 index 00000000..bc3d56a1 --- /dev/null +++ b/src/forge/Issues/Component/chooseMenu.jsx @@ -0,0 +1,252 @@ +import React ,{ useState , useEffect , useRef } from 'react'; +import { findDOMNode } from 'react-dom'; +import { Dropdown , Menu , Input , message, Button} from 'antd'; +import { getImageUrl } from 'educoder'; + +const { Search } = Input; +/** + * + * @param {placeholder} placeholder:默认显示内容(为空时) + * @param {editFlag} editFlag:是否有编辑权限 + * @param {searchFlag} searchFlag:是否显示搜索框 + * @param {selectValueList} selectValueList:将选中的list保存 + * @param {searchFunc} searchFunc:搜索方法 + * @param {onAdd} onAdd:标记管理 + * @param {headImg} headImg:是否显示头像 + * @param {menus} menus:下拉列表 + * @param {chooseFunc} chooseFunc:选择下拉列表 + * @param {double} double:undefined为单选,有值就是最多选的数量 + * @param {colorFlag} colorFlag:选中值需根据颜色显示背景 + * @param {mustFlag} mustFlag:必须选择一个 + * @param {removeFlag} removeFlag:移除按钮 + * @returns + */ +function ChooseMenu({ + placeholder ="未设置", + editFlag, + searchFlag, + selectValueList, + searchFunc, + onAdd, + headImg, + menus, + chooseFunc,double,colorFlag,mustFlag,removeFlag +}){ + const [ visible , setVisible ] = useState(false); + const [ searchValue , setSearchValue ]= useState(undefined); + const [ valuesId , setValuesId ] = useState([]); + const [ count , setCount ] = useState(double); + + const [ saveList , setSaveList ] = useState(undefined); + + const refFa = useRef(null); + const refBox = useRef(null); + + useEffect(() => { + document.addEventListener('click', clickMe , false); + }, []) + + const clickMe = ({ target }) => { + // 查找父组件 + const faComponent = findDOMNode(refFa.current); + const boxComponent = findDOMNode(refBox.current); + if (faComponent && boxComponent) { + const isChild = faComponent.contains(target); + const isBox = boxComponent.contains(target); + const pointer = !target || (target && target.className && (target.className.indexOf("removeicon")===-1 && target.className.indexOf("icon-guanbi")===-1)); + if(!isChild && !isBox && pointer){ + setVisible(false); + } + } + } + + // 根据选中的列表循环出id数组 + useEffect(()=>{ + if(selectValueList && selectValueList.length > 0 && visible ){ + renderSelectList(selectValueList); + setSaveList(selectValueList); + setCount(selectValueList.length); + }else{ + setValuesId([]); + setCount(0); + } + if(!visible){ + setSearchValue(undefined); + searchFunc(undefined); + } + },[selectValueList,visible]) + + function renderSelectList(list){ + let a = list && list.length > 0 && list.map((i,k)=>{ + return i.id ? i.id.toString() : i.name + }) + setValuesId(a); + } + + // 搜索 + function changeSearchvalue(e){ + setSearchValue(e.target.value); + searchFunc(e.target.value); + } + function renderNames(nameArrs){ + return + { + nameArrs && nameArrs.length>0? + nameArrs.map((i,k)=>{ + return( +

+ {i.image_url && } + { + colorFlag ? + ( + colorFlag === "2" ? + {i.name} + : + {i.name} + ) + : + {i.name} + } + { removeFlag && } +

+ ) + }) + :{placeholder} + } +
+ } + + // 选择项 + function chooseMenu(i){ + let list = saveList && saveList.length > 0 ? [...saveList]:[] ; + let relist = []; + relist = list && list.length > 0 ? list:[]; + let filter = []; + if(i.id){ + filter = list.filter(j=>j.id === i.id); + }else{ + filter = list.filter(j=>j.name === i.name); + } + if(filter && filter.length > 0){ + if(i.id){ + relist = list.filter(j=>j.id !== i.id); + }else{ + relist = list.filter(j=>j.name !== i.name); + } + }else{ + if(double && (saveList && saveList.length >= double)){ + setCount(-1); + return; + } + if(double){ + relist.push(i); + }else{ + relist = [i]; + } + } + renderSelectList(relist); + setSaveList(relist); + setCount(relist ? relist.length :0); + } + + // 确认按钮 + function onSureFunc(){ + setVisible(false); + chooseFunc(saveList); + } + // 移除选择的项 + function removeSaveFunc(id){ + let list = [...saveList]; + let filter = list.filter(j=>j.id !== id); + setSaveList(filter); + renderSelectList(filter); + setCount(filter ? filter.length :0); + } + return( +
  • + + {placeholder} + + { + saveList && saveList.length>0? + + :"" + } + { searchFunc && +
    + +
    + } + { + menus && menus.length >0? + + { + menus.map((i,k)=>{ + return( + chooseMenu(i)}> + {i.name} + + ) + }) + } + + : +
    +

    {searchValue ? 暂无{placeholder}“{searchValue}”: `暂无${placeholder}`}

    +
    + } +
    +
    + { onAdd && + {setVisible(false);onAdd()}}> + 标记管理 + } +
    + { + double && (count<0 ? +

    最多添加{double}个{placeholder}!

    + : +

    还可添加{double - count}个{placeholder}!

    + ) + } +
    +
    + + +
    + + }> + {!editFlag && + setVisible(visible ? false : true)}> + + + } +
    +
    +
    0 ? "operatevalue color-grey-3":"operatevalue"}>{renderNames(selectValueList)}
    +
  • + ) +} +export default ChooseMenu; \ No newline at end of file diff --git a/src/forge/Issues/Component/datas.jsx b/src/forge/Issues/Component/datas.jsx index 20c1ada6..d86839f5 100644 --- a/src/forge/Issues/Component/datas.jsx +++ b/src/forge/Issues/Component/datas.jsx @@ -1,6 +1,6 @@ import React from 'react'; import { getImageUrl } from 'educoder'; -import issue from '../Img/issue.png'; +import gold from '../Img/gold.png'; import { Link } from "react-router-dom"; import Copy from '../Component/copy'; import { Tooltip } from 'antd'; @@ -40,7 +40,7 @@ function Datas({checkbox ,item , projectsId,owner}){ item.tags && item.tags.length>0? item.tags.map((i,k)=>{ return( - {i.name} + {i.name} ) }) :"" @@ -54,10 +54,11 @@ function Datas({checkbox ,item , projectsId,owner}){ } - {item.author && item.author.name} - {item.created_at} 发布 - {item.updated_at}更新 - {item.milestone_name && {item.milestone_name} } + {item.author && item.author.name} + {item.created_at} 发布 + {item.updated_at}更新 + {item.blockchain_token_num && {item.blockchain_token_num}} + {item.milestone_name && {item.milestone_name} } diff --git a/src/forge/Issues/Img/gold.png b/src/forge/Issues/Img/gold.png new file mode 100644 index 00000000..3c64743b Binary files /dev/null and b/src/forge/Issues/Img/gold.png differ diff --git a/src/forge/Issues/Pages/details.jsx b/src/forge/Issues/Pages/details.jsx index 7e159f48..c16ebaee 100644 --- a/src/forge/Issues/Pages/details.jsx +++ b/src/forge/Issues/Pages/details.jsx @@ -15,6 +15,7 @@ import Copy from '../Component/copy'; import axios from 'axios'; import CommentList from '../Component/comments/list'; import Claims from '../../claims/claims'; +import ChooseMenu from '../Component/chooseMenu'; function Details(props){ const [ details , setDetails ] = useState(undefined); @@ -395,7 +396,7 @@ function Details(props){
    {orderId &&
    } - {setCharge(value)}} @@ -423,7 +424,7 @@ function Details(props){ editFlag={details && !details.user_permission} chooseFunc={(list)=>{setPrioritie_choose(list);let l = list && list.length>0 ?list.map(i=>{return i.id || i.name}):[];saveForeach(undefined,undefined,l);}} /> - {setTag(value)}} diff --git a/src/forge/Issues/Pages/list.jsx b/src/forge/Issues/Pages/list.jsx index c1b843d4..52373463 100644 --- a/src/forge/Issues/Pages/list.jsx +++ b/src/forge/Issues/Pages/list.jsx @@ -45,7 +45,7 @@ function List(props){ const owner = props.match.params.owner; const projectsId = props.match.params.projectsId; const permission = props && props.projectDetail && props.projectDetail.permission; - const { projectDetail , current_user } = props; + const { projectDetail , current_user} = props; useEffect(()=>{ if(projectDetail){ diff --git a/src/forge/Issues/index.jsx b/src/forge/Issues/index.jsx index 7fc6a36a..6590f987 100644 --- a/src/forge/Issues/index.jsx +++ b/src/forge/Issues/index.jsx @@ -23,6 +23,9 @@ const New = Loadable({ function Index(props){ const pathname = props.history.location.pathname; + const {project } = props; + const open_blockchain = project && project.open_blockchain; + console.log("是否开启了确权:",open_blockchain); useEffect(() => { if (document) { // 可以排除不需要置顶的页面 @@ -37,38 +40,38 @@ function Index(props){ ( - + )} > {/* 里程碑创建issue */} ( - + )} > ( - + )} > ( - + )} > ( - + )} > ( - + )} > diff --git a/src/forge/Issues/index.scss b/src/forge/Issues/index.scss index 8a6acf72..33e943be 100644 --- a/src/forge/Issues/index.scss +++ b/src/forge/Issues/index.scss @@ -224,7 +224,7 @@ } .tagscolor{ padding:0px 6px; - border-radius: 3px; + border-radius: 2px; height: 20px; line-height: 20px; max-width: 108px; @@ -239,12 +239,12 @@ color: #898d9d; margin-top: 12px; font-size: 13px; - img{ - height: 22px; - width: 22px; - margin-right: 4px; - border-radius: 50%; - } + // img{ + // height: 22px; + // width: 22px; + // margin-right: 4px; + // border-radius: 50%; + // } } .issuecondition{ display: flex; @@ -293,7 +293,7 @@ .status{ display: block; height:22px; - border-radius:3px; + border-radius:6px; text-align: center; margin-right: 10px; line-height: 20px; @@ -714,7 +714,110 @@ // 声明 .claimpart{ - padding-bottom: 10px; + padding-bottom: 15px; border-bottom: 1px solid #eee; margin-bottom: 20px; +} + +// issue版本2 +.overlayChooseStyle{ + width: 636px; + background-color:#ffffff; + border-radius:6px; + box-shadow:0px 0px 10px rgba(24, 54, 181, 0.17); + z-index: 100; + padding:30px 20px; + .choosedul{ + display: flex; + flex-wrap: wrap; + padding-bottom: 10px; + border-bottom: 1px solid #e4e4e6; + margin-bottom: 20px!important; + li{ + height:24px; + background-color:#eff2ff; + border:1px solid; + border-color:#466aff; + border-radius:2px; + color:#466aff; + font-size:14px; + margin-right: 15px; + margin-bottom: 10px!important; + padding:0px 7px; + display: flex; + align-items: center; + span{ + display: block; + max-width:120px ; + } + } + } + .counttips{ + display: flex; + justify-content: space-between; + margin-bottom: 20px; + } + .ant-menu{ + display: flex; + flex-wrap: wrap; + padding:20px 0px 5px 0px; + box-sizing: border-box; + max-height: 307px; + overflow-y: auto; + li{ + width: 100px; + height:32px; + line-height:30px; + text-align: center; + font-size:14px; + border-radius:2px; + margin-right: 24px!important; + margin-bottom: 15px!important; + border:1px solid!important; + border-color: #f4f6fe!important; + padding:0px 5px; + &.commonli{ + background-color:#f4f6fe!important; + } + .removeicon{ + display: block; + } + span.task-hide{ + color: #3f455b; + margin:0px auto; + position: relative; + color:#3f455b; + max-width: 85px; + display: block; + } + &.colorli{ + border-color: transparent!important; + span{ + color: #fff; + position: relative; + margin:0px auto; + } + } + &.commonli.ant-menu-item-selected{ + background-color:#e2e8ff!important; + color:#3f5097; + border-color:#466aff!important; + } + &.colorli.ant-menu-item-selected{ + border-color: transparent!important; + } + &.colorli.ant-menu-item-selected{ + &>span::before{ + content:"✓"; + position: absolute; + right: -12px; + color: #fff; + top: 0px; + } + } + &:nth-child(5n){ + margin-right: 0px!important; + } + } + } } \ No newline at end of file diff --git a/src/forge/claims/claim.scss b/src/forge/claims/claim.scss index 54faa8e4..c21ab1c2 100644 --- a/src/forge/claims/claim.scss +++ b/src/forge/claims/claim.scss @@ -13,6 +13,9 @@ .menuPanels{ width: 295px; + .ant-popover-arrow{ + bottom: 10.2px!important; + } &.maxWidth{ width: 400px; } @@ -60,11 +63,13 @@ flex-wrap: wrap; padding-bottom: 2px; a{ - margin: 0px 10px 10px 0px; + margin: 0px 2px 0px 0px; + height: 22px; + line-height: 20px; img{ border-radius: 50%; - width: 40px; - height: 40px; + width: 22px; + height: 22px; } &:nth-child(4n){ margin-right: 0px; diff --git a/src/forge/claims/claims.js b/src/forge/claims/claims.js index 0ce7a4c6..57a0c5e8 100644 --- a/src/forge/claims/claims.js +++ b/src/forge/claims/claims.js @@ -173,21 +173,21 @@ class claims extends React.Component { const renderClaim = () => { return (
    -
    声明留言:
    +
    声明留言: