save

src/forge/Issues/Component/delBox.jsx

@@ -0,0 +1,28 @@
+import React from "react";
+import Modals from '../../Component/PublicModal/Index';
+import { AlignTop } from '../../Component/layout';
+import { Button } from 'antd';
+
+function DelBox({visible,onCancel,onSuccess}){
+  return(
+    <Modals
+      visible={visible}
+      onCancel={onCancel}
+      title={"删除疑修"}
+      btn={
+        <div>
+          <Button size={'large'} onClick={onCancel}>取消</Button>
+          <Button type={"danger"} size={"large"} onClick={onSuccess}>确认删除</Button>
+        </div>
+      }
+    >
+      <div className="desc">
+        <AlignTop className="deldesc">
+          <i className="iconfont icon-jinggao1 mr10 font-20 red"></i>
+          <div style={{paddingTop:"3px"}}><p className="font-15 mb20">您确定要删除所有选中的疑修？</p><p className="color-grey-6">此操作将清空所有已选中的疑修，请谨慎操作</p></div>
+        </AlignTop>
+      </div>
+    </Modals>
+  )
+}
+export default DelBox;

src/forge/Issues/Component/editMenus.jsx

@@ -0,0 +1,79 @@
+import React ,{ useState , useEffect , useRef } from 'react';
+import { Dropdown , Menu , Input } from 'antd';
+import { findDOMNode } from 'react-dom';
+
+const { Search } = Input;
+
+function EditMenus({name,list,value}){
+  const [ menus , setMenus ] = useState([]);
+  const [ searchValue , setSearchValue ]= useState(undefined);
+  const [ showValue , setShowValue ] = useState(undefined);
+  const [ visible , setVisible ] = useState(false);
+
+  const refFa = useRef(null);
+  const refBox = useRef(null);
+
+  useEffect(()=>{
+    setMenus(list);
+    setShowValue(value);
+  },[list,value])
+
+  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);
+      if(!isChild && !isBox){
+        setVisible(false);
+      }
+    }
+  }
+
+  function chooseMenu(e){
+    setVisible(false);
+    setShowValue(e.item.props.children)
+  }
+
+  // 搜索
+  function changeSearchvalue(e){
+    setSearchValue(e.target.value);
+  }
+
+
+  return(
+    <li>
+      <span>{name}<a><i className="iconfont icon-a-bianji12 font-13" style={{color:"#898d9d"}}></i></a></span>
+      <Dropdown visible={visible} overlayClassName={"overlayStyle"} placement="bottomLeft" trigger={['click']} 
+        overlay={
+          <div className="branch-tagBox" ref={refFa}>
+            {menus && menus.length>0 ? 
+              <div>
+                <div className="searchbox">
+                  <Search placeholder={`搜索${name}`} value={searchValue} onChange={changeSearchvalue} style={{marginRight:"18px"}}/>
+                </div>
+                <Menu>
+                  {
+                    menus.map((i,k)=>{
+                      return(
+                        <Menu.Item key={i.id} onClick={chooseMenu}>{i.name}</Menu.Item>
+                      )
+                    })
+                  }
+                </Menu>
+              </div>
+              :<div>{searchValue ?  <span>创建新{showValue}“{searchValue}”</span>: `暂无${showValue}`}</div>
+            }
+          </div>
+        }>
+        <p ref={refBox} onClick={()=>setVisible(visible ? false : true)} className={showValue?"operatevalue color-grey-3":"operatevalue"}>{showValue || "未设置"}</p>
+      </Dropdown>
+    </li>
+  )
+}
+export default EditMenus;

src/forge/Issues/Pages/list.jsx

@@ -1,14 +1,20 @@
-import React , { useRef , useState } from 'react';
+import React , { useRef , useState , useEffect } from 'react';
 import { Dropdown , Menu , Icon , Input , Checkbox , Pagination, Button } from 'antd';
 import bj from '../Img/biaoji.png';
+import issueEmp from '../Img/issue-big.png';
 import create from '../Img/create.png';
 import { Link } from "react-router-dom";
 import Menus from '../Component/menus';
 import Datas from '../Component/datas';
+import DelBox from '../Component/delBox';
+import axios from 'axios';
 const { Search } = Input;
 
 
 function List(props){
+  const [ visible , setVisible ] = useState(false);
+  const [ issueList , setIssueList ] = useState(undefined);
+
   const [ allValue , setAllValue ] = useState([]);
   const [ allIds , setAllIds ] = useState([0,1,2,3]);
   const [ checkAll , setCheckAll ] = useState(false);
@@ -17,6 +23,20 @@ function List(props){
   const menuRef = useRef(null);
   const owner = props.match.params.owner;
   const projectsId = props.match.params.projectsId;
+
+  useEffect(()=>{
+    // Init();
+  },[])
+
+  function Init(){
+    const url = `http://172.20.10.4:3000/api/v1/${owner}/${projectsId}/issues`;
+    axios.get(url).then(result=>{
+      if(result){
+
+      }
+    }).then(error=>{console.log("error:",error)})
+  }
+
   const menu = (
     <Menu>
       <Menu.Item key={0}>全部</Menu.Item>
@@ -66,9 +86,14 @@ function List(props){
     setPage(page);
   }
 
+  // 删除issue相关 func
+  function onSuccess(){
+    
+  }
     
   return(
     <div>
+      <DelBox visible={visible} onCancel={()=>setVisible(false)} onSuccess={onSuccess}/>
       <div className="pageheader">
         <div>
           <Dropdown overlay={menu} trigger={['click']} placement="bottomLeft" arrow={{pointAtCenter: true}}>
@@ -83,9 +108,14 @@ function List(props){
         </div>
         <div>
           <Link to={`/${owner}/${projectsId}/issues/sign`} className="dorpdownButton"><img src={bj} alt="" className="mr5" />标记管理</Link>
-          <Link to="" className="operateButton ml20"><img src={create} alt="" className="mr5" />创建疑修</Link>
+          <Link to={`/${owner}/${projectsId}/issues/new`} className="operateButton ml20"><img src={create} alt="" className="mr5" />创建疑修</Link>
         </div>
       </div>
+      <div className="listempty">
+        <img src={issueEmp} alt="" width="68px" />
+        <p className="font-22 mt5 mb10">欢迎使用疑修(Issue)</p>
+        <p className="font-15">疑修用于记录与跟踪待办事项、项目bug、功能需求等。在使用之前，请您先<a className="color-blue">创建一个疑修</a></p>
+      </div>
       <div className="lists">
         <div className="listheader">
           <div style={{display:"flex"}}>
@@ -107,7 +137,7 @@ function List(props){
               allValue && allValue.length>0 ?
                 <div>
                   <Button type="primary" ghost>确定</Button>
-                  <Button type="danger" ghost className="ml10">删除</Button>
+                  <Button type="danger" ghost className="ml10" onClick={()=>setVisible(true)}>删除</Button>
                   <Button ghost className="ml10 mr10" onClick={cancelUpdate}>取消</Button>
                 </div>
               :""

src/forge/Issues/Pages/new.jsx

@@ -0,0 +1,78 @@
+import React , { useEffect , useState } from 'react';
+import { Button, Input , Dropdown , Menu } from 'antd';
+import { Box , LongWidth } from '../../Component/layout';
+import MDEditor from "../../../modules/tpm/challengesnew/tpm-md-editor";
+import Upload from "../../Upload/Index";
+import Attachments from "../../Upload/attachment";
+import UploadImg from '../Img/UploadImg.png';
+import EditMenus from '../Component/editMenus';
+
+const menus = {
+  milestones:[{id:1,name:"里程碑1"},{id:2,name:"里程碑22"}],
+  issue_tags:[{id:1,name:"标记1"},{id:2,name:"标记22"}]
+}
+function New(props){
+  const [ content , setContent ] = useState("");
+  const [ fileList , setFileList] = useState(undefined);
+  const [ attachments , setAttachments ] = useState([]);
+  function onContentChange(value){
+    setContent(value);
+  }
+  function UploadFunc(fileList){
+    setFileList(fileList);
+  };
+  return(
+    <div>
+      <p className="font-20 color-grey-3 mt20 mb15">新建疑修</p>
+      <Box>
+        <LongWidth>
+          <Input placeholder="标题"/>
+          <MDEditor
+            placeholder={"请输入描述信息"}
+            height={392}
+            mdID={"order-new-description"}
+            initValue={content}
+            onChange={onContentChange}
+            className="mt20"
+          ></MDEditor>
+          <div className="pb20">
+            <Upload
+              className="commentStyle mt20"
+              isComplete={true}
+              load={UploadFunc}
+              icon={
+                <img
+                  src={UploadImg}
+                  width="58"
+                  alt=""
+                  style={{ marginBottom: 15 }}
+                />
+              }
+              size={100}
+              showNotification={props.showNotification}
+            />
+            {attachments && attachments.length > 0 &&
+              <Attachments
+                attachments={attachments}
+                showNotification={props.showNotification}
+                canDelete={true}
+              ></Attachments>
+            }
+          </div>
+          <div style={{display:"flex"}}>
+            <Button type="primary" className="operateButton" style={{width:"100px"}}>创建</Button>
+            <Button className="ml30" style={{width:"100px"}}>取消</Button>
+          </div>
+        </LongWidth>
+        <div className="shortwidth">
+          <EditMenus name="负责人" list={menus.issue_tags}/>
+          <EditMenus name="状态" list={menus.issue_tags}/>
+          <EditMenus name="优先级" list={menus.issue_tags}/>
+          <EditMenus name="标记" list={menus.issue_tags}/>
+          <EditMenus name="里程碑" list={menus.milestones}/>
+        </div>
+      </Box>
+    </div>
+  )
+}
+export default New;

src/forge/Issues/index.jsx

@@ -12,11 +12,21 @@ const Sign = Loadable({
   loader: () => import("./Pages/sign"),
   loading: Loading,
 });
+const New = Loadable({
+  loader: () => import("./Pages/new"),
+  loading: Loading,
+});
 
 function Index(props){
   return(
     <div className="pagebox">
       <Switch>
+        <Route
+          path="/:owner/:projectsId/issues/new"
+          render={() => (
+            <New {...props}/>
+          )}
+        ></Route>
         <Route
           path="/:owner/:projectsId/issues/sign"
           render={() => (

src/forge/Issues/index.scss

@@ -2,6 +2,13 @@
   width: 1200px;
   margin:0px auto;
 }
+// 删除issue弹框
+.deldesc{
+  justify-content: center;
+  .red{
+    color: #DF0002;
+  }
+}
 // 可公用样式（在issue的页面中）
 // 可点击(有向下箭头且点击出现下拉框，移入灰色背景加深)的灰色按钮样式
 .dorpdownButton{
@@ -64,6 +71,18 @@
     background-color:rgba(196, 0, 14, 0.09)!important;
   }
 }
+// 列表为空样式
+.listempty{
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background-color:#fafcff;
+  border:1px solid rgba(42, 97, 255, 0.23);
+  border-radius:4px;
+  height: 344px;
+  padding-top: 62px;
+  color: #333;
+}
 // 列表页面样式
 .pageheader{
   display: flex;
@@ -161,7 +180,6 @@
     display: flex;
     flex-direction: column;
     margin-right: 10px;
-    padding-top: 3px;
     .status{
       display: block;
       height:22px;
@@ -209,7 +227,7 @@
     display: flex;
     align-items: center;
     color: #898d9d;
-    margin-top: 5px;
+    margin-top: 12px;
     &>img{
       height: 22px;
       width: 22px;
@@ -335,4 +353,67 @@
       }
     }
   }
+}
+// 新建页面样式
+.shortwidth{
+  width: 330px;
+  padding-left: 50px;
+  &>li{
+    border-bottom: 1px solid rgba(172, 176, 191, 0.17);
+    padding-bottom: 12px;
+    margin-bottom: 22px!important;
+    &>span{
+      font-size: 15px;
+      position: relative;
+      color: #40424a;
+      display: flex;
+      width: 100%;
+      height: 20px;
+      line-height: 20px;
+      a{
+        position: absolute;
+        right: 0px;
+        bottom: -16px;
+      }
+    }
+    .operatevalue{
+      height: 20px;
+      line-height: 20px;
+      color: #acb0bf;
+      margin-top: 10px;
+      cursor: pointer;
+    }
+  }
+}
+.overlayStyle{
+  background-color:#ffffff;
+  border-radius:6px;
+  box-shadow:0px 0px 10px rgba(24, 54, 181, 0.17);
+  .searchbox{
+    padding:18px 20px 12px 16px;
+  }
+  .ant-menu{
+    padding:0px 20px 10px 16px;
+    max-height: 338px;
+    overflow-y: auto;
+    li{
+      padding:0px 16px;
+      height: 38px;
+      line-height: 38px;
+      border-bottom: none;
+      color:#898d9d;
+      position: relative;
+      &:hover,&.ant-menu-item-selected{
+        background-color:rgba(70, 106, 255, 0.07);
+        color:#40424a;
+      }
+      &.ant-menu-item-selected::before{
+        content:"✓";
+        position: absolute;
+        right: 15px;
+        color: #acb0bf;
+        top: 0px;
+      }
+    }
+  }
 }

src/forge/Main/Detail.js

@@ -779,17 +779,17 @@ class Detail extends Component {
                   }
                 ></Route>
                 {/* 里程碑页面新建任务 */}
-                <Route path="/:owner/:projectsId/issues/:milepostId/new"
+                {/* <Route path="/:owner/:projectsId/issues/:milepostId/new"
                   render={
                     (props) => (<OrderNew {...this.props} {...props} {...this.state} {...common} />)
                   }
-                ></Route>
+                ></Route> */}
                 {/* 新建任务 */}
-                <Route path="/:owner/:projectsId/issues/new"
+                {/* <Route path="/:owner/:projectsId/issues/new"
                   render={
                     (props) => (<OrderNew {...this.props} {...props} {...this.state} {...common} />)
                   }
-                ></Route>
+                ></Route> */}
                 {/* 修改详情 edit*/}
                 <Route path="/:owner/:projectsId/issues/:orderId/edit"
                   render={