diff --git a/src/forge/Issues/Component/datas.jsx b/src/forge/Issues/Component/datas.jsx index 7a9b2949..17cb3fc0 100644 --- a/src/forge/Issues/Component/datas.jsx +++ b/src/forge/Issues/Component/datas.jsx @@ -1,14 +1,15 @@ import React from 'react'; import { Checkbox , Tooltip } from 'antd'; import issue from '../Img/issue.png'; +import { Link } from "react-router-dom"; // issue列表显示 -function Datas(){ +function Datas({checkbox}){ return(
- + {checkbox}
正常 #1 @@ -43,7 +44,7 @@ function Datas(){
- +
紧急 #2 @@ -77,7 +78,7 @@ function Datas(){
- +
高 #3 @@ -85,7 +86,7 @@ function Datas(){
-

如何参与到项目的开发，提升技术能力？

+ 如何参与到项目的开发，提升技术能力？ feature
@@ -109,7 +110,7 @@ function Datas(){
- +
低 #3 diff --git a/src/forge/Issues/Component/menus.jsx b/src/forge/Issues/Component/menus.jsx index 43d35750..b6103a11 100644 --- a/src/forge/Issues/Component/menus.jsx +++ b/src/forge/Issues/Component/menus.jsx @@ -1,4 +1,4 @@ -import React ,{ useImperativeHandle ,forwardRef , useState } from 'react'; +import React ,{ useImperativeHandle ,forwardRef , useState , useEffect } from 'react'; import { Dropdown , Icon , Menu } from 'antd'; const menus=[ @@ -8,27 +8,37 @@ const menus=[ choose:0, menu:["caishi","he","xiao","jiang"] }, + { + id:7, + updateName:"更换优先级", + choose:0, + menu:["紧急","正常","低","高"] + }, { id:2, name:"标记", + updateName:"更换标记", choose:0, menu:["caishi","he","xiao","jiang"] }, { id:3, name:"里程碑", + updateName:"更换里程碑", choose:0, menu:["caishi","he","xiao","jiang"] }, { id:4, name:"负责人", + updateName:"更换负责人", choose:0, menu:["caishi","he","xiao","jiang"] }, { id:5, name:"状态", + updateName:"更换状态", choose:0, menu:["新增","正在解决","已解决","反馈","关闭","拒绝"] }, @@ -39,9 +49,10 @@ const menus=[ menu:["最新创建","最早创建","最近更新","最早更新","高优先级","低优先级"] } ] -function Menus(props,ref){ +function Menus({update},ref){ const [ dropmenu , setDropMenu ] = useState(menus); + useImperativeHandle(ref, () => ({ clearChoose: () => { // 父组件按钮：清除筛选条件，将dropmenu里的choose字段全部改为0 @@ -49,19 +60,32 @@ function Menus(props,ref){ } })) + useEffect(()=>{ + if(update){ + + } + },[update]) + // 修改menus数组里的字段值 function changeMenusValue(value,id){ let todoList = [...dropmenu]; - let list = todoList.map((item,key)=>id ? item : {...item,choose:value}); + let list = []; + if(id){ + list = todoList.map((i,k)=>id===i.id ? {...i,choose:value} : i); + }else{ + list = todoList.map((i,k)=>id ? i : {...i,choose:value}); + } setDropMenu(list); + // 修改后调用父组件方法重新查询数据 + } - function menu(menu,choose){ + function menu(menu,choose,id){ if(menu && menu.length>0){ return { menu.map((i,j)=>{ - return {i} + return changeMenusValue(j+1,id)}>{i} }) } @@ -76,8 +100,9 @@ function Menus(props,ref){ { dropmenu.map((item,i)=>{ return( - -
  • {item.name}
    • + ((!update && item.name) || (update && item.updateName)) && + +
  • {item.choose !== 0 ? item.menu[item.choose-1]:(update ? item.updateName : item.name)}
    •  ) }) diff --git a/src/forge/Issues/Pages/list.jsx b/src/forge/Issues/Pages/list.jsx index 28090a13..2e3f7aa4 100644 --- a/src/forge/Issues/Pages/list.jsx +++ b/src/forge/Issues/Pages/list.jsx @@ -1,15 +1,22 @@ -import React , { useRef } from 'react'; -import { Dropdown , Menu , Icon , Input , Checkbox , Pagination } from 'antd'; +import React , { useRef , useState } from 'react'; +import { Dropdown , Menu , Icon , Input , Checkbox , Pagination, Button } from 'antd'; import bj from '../Img/biaoji.png'; import create from '../Img/create.png'; -import { Link } from 'react-router-dom'; +import { Link } from "react-router-dom"; import Menus from '../Component/menus'; import Datas from '../Component/datas'; const { Search } = Input; function List(props){ + const [ allValue , setAllValue ] = useState([]); + const [ allIds , setAllIds ] = useState([0,1,2,3]); + const [ checkAll , setCheckAll ] = useState(false); + + const [ page , setPage ] = useState(1); const menuRef = useRef(null); + const owner = props.match.params.owner; + const projectsId = props.match.params.projectsId; const menu = ( 全部 @@ -27,6 +34,38 @@ function List(props){ // 清除后重新获取列表数据 } + // 全选所有issue + function chooseAll(e){ + setCheckAll(e.target.checked); + if(e.target.checked){ + setAllValue([0,1,2,3]); + }else{ + setAllValue([]); + clearCondition(); + } + } + + // 选择列表里的issue + function checkIssues(value){ + setAllValue(value); + if(value.length === allIds.length){ + setCheckAll(true); + }else{ + setCheckAll(false); + } + } + + // 取消 + function cancelUpdate(){ + setAllValue([]); + setCheckAll(false); + } + + // 切换页码 + function changepage(page){ + setPage(page); + } + return(
    @@ -43,23 +82,45 @@ function List(props){ 清除筛选条件
    - 标记管理 + 标记管理 创建疑修
    -
      - -
    • 全部111
      • -
    • 开启中111
      • -
    • 已关闭111
      • -
    - +
    + + { + allValue && allValue.length>0 ? + 选择{allValue.length}个issue + : +
      +
    • 全部111
      • +
    • 开启中111
      • +
    • 已关闭111
      • +
    + } +
    +
    + 0}/> + { + allValue && allValue.length>0 ? +
    + + + +
    + :"" + } +
    - + + } + /> +
    - +
    diff --git a/src/forge/Issues/Pages/sign.jsx b/src/forge/Issues/Pages/sign.jsx new file mode 100644 index 00000000..77577baa --- /dev/null +++ b/src/forge/Issues/Pages/sign.jsx @@ -0,0 +1,139 @@ +import React , { useEffect , useState } from 'react'; +import create from '../Img/create.png'; +import { Menu , Dropdown , Icon, Input, Button } from 'antd'; +import { SketchPicker } from 'react-color' + +function Sign(){ + const [ edit , setEdit ] = useState(false); + const [ color , setColor ] = useState({r: '241',g: '112',b: '19',a: '1',}); + const [ displayColorPicker , setDisplayColorPicker ] = useState(false); + const [ textcolor , setTextColor ] = useState("#F17013"); + + function arrayList(){ + + } + + const menu = ( + + + 按创建时间降序排序 + + + 按创建时间升序排序 + + + 按issue个数降序排序 + + + 按issue个数升序排序 + + + ); + + // 切换色卡 + function handleChange(color){ + setColor(color.rgb); + setTextColor(color.hex); + } + + // 隐藏色卡 + function handleClick(){ + setDisplayColorPicker(!displayColorPicker); + reduction(); + } + + // 还原色卡 + function reduction(){ + setTextColor("#F17013"); + setColor({r: '241',g: '112',b: '19',a: '1',}); + } + return( +
    +
    + Issue / 项目标记 + setEdit(true)}>创建标记 +
    + { + edit && +
    + + +
    +
    +
    +

    {textcolor}

    +
    +
    + {displayColorPicker ? ( +
    +
    {setDisplayColorPicker(false)}} /> + +
    + ) : null} +
    + + + + +
    + } +
    + 项目标记(10) + + 标记 + +
    +
      +
    • +

      + + + 缺陷 +

      +

      表示项目存在问题

      +

      + 0 Issue + 12 合并请求 +

      +

      + 编辑 + 删除 +

      +
      • +
    • +

      + + + 疑问 +

      +

      表示存在的问题

      +

      + 0 Issue + 12 合并请求 +

      +

      + 编辑 + 删除 +

      +
      • +
    • +

      + + + 功能 +

      +

      表示新功能申请

      +

      + 0 Issue + 12 合并请求 +

      +

      + 编辑 + 删除 +

      +
      • +
    +
    + ) +} +export default Sign; \ No newline at end of file diff --git a/src/forge/Issues/index.jsx b/src/forge/Issues/index.jsx index 848068ce..b1208e85 100644 --- a/src/forge/Issues/index.jsx +++ b/src/forge/Issues/index.jsx @@ -8,11 +8,21 @@ const List = Loadable({ loader: () => import("./Pages/list"), loading: Loading, }); +const Sign = Loadable({ + loader: () => import("./Pages/sign"), + loading: Loading, +}); function Index(props){ return(
    + ( + + )} + > ( diff --git a/src/forge/Issues/index.scss b/src/forge/Issues/index.scss index f1f773f4..ee5c0dce 100644 --- a/src/forge/Issues/index.scss +++ b/src/forge/Issues/index.scss @@ -34,6 +34,36 @@ border-color:#708cff; } } +// flex-左右，上下居中 +.between{ + display: flex; + align-items: center; + justify-content: space-between; +} +// 蓝色背景操作栏 +.bluebar{ + height:50px; + background-color:#fafcff; + border:1px solid rgba(42, 97, 255, 0.23); + border-radius:4px 4px 0px 0px; + padding:0px 26px; +} +// 按钮样式 +.ant-btn-background-ghost{ + border-color:#acb0bf; + color: #acb0bf; + background-color: #fff!important; + &.ant-btn-primary{ + color: #466aff; + border-color: #466aff; + background-color: #fff!important; + } + &.ant-btn-danger{ + color: #f60011; + border-color: #f60011; + background-color:rgba(196, 0, 14, 0.09)!important; + } +} // 列表页面样式 .pageheader{ display: flex; @@ -55,10 +85,14 @@ border-color:rgba(42, 97, 255, 0.23); border-radius:4px 4px 0px 0px; padding-left: 18px; + .menusul{ + display: flex; + align-items: center; + } ul{ display: flex; align-items: center; - &:first-child{ + &.statusul{ li{ width: 106px; &>span{ @@ -217,4 +251,88 @@ justify-content: flex-end; } } +} + +// 标记管理页面 +.editbar{ + padding:18px 20px; + background-color:rgba(218, 225, 251, 0.24); + display: flex; + align-items: center; + margin-bottom: 30px; + justify-content: space-between; + .color{ + width: 20px; + height: 20px; + border-radius: 2px; + } + .swatch{ + padding: 5px; + background: #fff; + border-radius: 1px; + width: 92px; + height: 28px; + line-height: 20px; + box-shadow: 0 0 0 1px rgba(0,0,0,.1); + display: flex; + cursor: pointer; + } + .popover { + position: absolute; + z-index: 2; + } + .cover { + position: fixed; + top: 0px; + right: 0px; + bottom: 0px; + left: 0px; + } + .modalcolor { + width: 20px; + height: 20px; + border-radius: 2px; + } +} +.signlist{ + padding:10px 0px; + margin-bottom: 40px!important; + &>li{ + display: flex; + margin-bottom: 5px; + padding:10px 20px; + &>p{ + flex:1; + text-align: center; + display: flex; + align-items: center; + justify-content: flex-start; + color: 40424a; + &:first-child{ + flex:1.2; + } + &:last-child{ + justify-content: flex-end; + } + .square{ + display: block; + width: 22px; + height: 15px; + border-radius:2px; + } + .line{ + position: relative; + padding-left: 13px; + &::before{ + position: absolute; + height:13px; + width: 1px; + left: 0px; + top:7px; + background-color:#d5d5d5; + content: ""; + } + } + } + } } \ No newline at end of file diff --git a/src/forge/Main/Detail.js b/src/forge/Main/Detail.js index 6cea9ddc..f2b99c7d 100644 --- a/src/forge/Main/Detail.js +++ b/src/forge/Main/Detail.js @@ -804,11 +804,11 @@ class Detail extends Component { > {/* 任务详情 */} - () } - > + > */} {/* 动态 */}