Merge pull request '代码库质量分析tab' (#265) from caishi/forgeplus-react:mulanoss_git_server into mulanoss_git_server

src/forge/Main/CoderDepot.jsx

@@ -140,7 +140,7 @@ function CoderDepot(props){
       if(result && result.data){
         const release = {
           "list":result.data.releases,
-          "total_count":result.data.releases.length
+          "total_count":result.data.releases ? result.data.releases.length :0
         }
         setReleaseVersions(release);
       }
@@ -565,7 +565,7 @@ function CoderDepot(props){
                       
                       <div>
                         <Divider />
-                        <p className="font-16 color-ooo">sonar质量分析</p>
+                        <p className="font-16 color-ooo">质量分析</p>
                         {
                           sonar_url ? 
                           <a href={sonar_url} target="_blank" className="color-grey-6" style={{textDecoration:"underline",wordBreak:"break-all"}}>{sonar_url}</a>

src/forge/Main/Detail.js

@@ -69,7 +69,11 @@ const MergeIndexDetail = Loadable({
   loader: () => import('../Merge/merge'),
   loading: Loading,
 })
-
+// 代码质量分析
+const Sonar = Loadable({
+  loader: () => import('../Sonar/Index'),
+  loading: Loading,
+})
 const CreateMerge = Loadable({
   loader: () => import('../Merge/CreateMerge'),
   loading: Loading,
@@ -167,6 +171,8 @@ function checkPathname(projectsId, owner, pathname) {
       name = "source"
     } else if (url.indexOf(`/wiki`) > -1) {
       name = "wiki"
+    } else if (url.indexOf(`/sonar`) > -1) {
+      name = "sonar"
     }
   }
   return name;
@@ -772,6 +778,11 @@ class Detail extends Component {
                     (props) => (<MergeIndexDetail {...this.props} {...props} {...this.state} {...common} />)
                   }
                 ></Route>
+                <Route path="/:owner/:projectsId/sonar"
+                  render={
+                    (props) => (<Sonar {...this.props} {...props} {...this.state} {...common} />)
+                  }
+                ></Route>
                 <Route path="/:owner/:projectsId/following"
                   render={
                     (props) => (<WatchUsers {...this.props} {...props} {...this.state} {...common} />)

src/forge/Main/sub/DetailBanner.jsx

@@ -128,6 +128,12 @@ function DetailBanner({ history,list , owner , projectsId , isManager , url , pa
               )
             })
           }
+          <li className={pathname==="sonar" ? "active" : ""}>
+            <Link to={{ pathname: `/${owner}/${projectsId}/sonar`, state }}>
+              <i className={"iconfont icon-banbenicon color-grey-3 mr5 font-14"}></i>
+              <span>代码质量分析</span>
+            </Link>
+          </li>
         </ul>
         :
         <Skeleton paragraph={false} active={true}/>

src/forge/Sonar/Index.jsx

@@ -0,0 +1,117 @@
+import React , { useEffect , useState } from 'react';
+import { Table , Pagination } from 'antd';
+import { Base64 } from 'js-base64';
+import moment from 'moment'
+import axios from 'axios';
+import Nodata from '../Nodata';
+
+const limit = 15;
+
+function Index(props) {
+  const [ page , setPage ] = useState(1);
+  const [ total , setTotal ] = useState(0);
+  const [ data , setData ] = useState(undefined);
+  const { owner , projectsId } = props.match.params;
+
+  useEffect(()=>{
+    getInit();
+  },[page])
+
+  function getInit() {
+    // MLh8klm46f_ceshi
+    const url = `http://sonar.learnerhub.net/api/issues/search?componentKeys=${owner}_${projectsId}&s=FILE_LINE&resolved=false&types=BUG&ps=${limit}&facets=owaspTop10%2CsansTop25%2Cseverities%2CsonarsourceSecurity%2Ctypes&additionalFields=_all&timeZone=Asia%2FShanghai&p=${page}`
+    axios.get(url,{
+      headers:{Authorization:`Basic ${Base64.encode('ecae161ce05add6121c6263f843c76d79fcd953c:')}`}
+    }).then(result=>{
+      if(result){
+        setData(result.data.issues);
+        setTotal(result.data.total);
+      }
+    }).catch(error=>{})
+  }
+
+  const columns = [
+    {
+      title: '文件',
+      dataIndex: 'component',
+      key: 'component',
+      width:"24%",
+      ellipsis:true,
+      render:(v,l,i)=>{
+        const name = l.component && l.component.split(":")[1];
+        return(
+          <span>{name}</span>
+        )
+      }
+    },
+    {
+      title: '所在起始行',
+      dataIndex: 'startLine',
+      key: 'startLine',
+      align:"center",
+      width:"9%",
+      render:(v,l,i)=>{
+        return(
+          <span>{l.textRange && l.textRange.startLine}</span>
+        )
+      }
+    },
+    {
+      title: '所在结束行',
+      dataIndex: 'endLine',
+      key: 'endLine',
+      align:"center",
+      width:"9%",
+      render:(v,l,i)=>{
+        return(
+          <span>{l.textRange && l.textRange.endLine}</span>
+        )
+      }
+    },
+    // {
+    //   title: '错误类型',
+    //   dataIndex: 'type',
+    //   align:"center",
+    //   key: 'type',
+    //   width:"8%",
+    // },
+    {
+      title: '问题信息',
+      dataIndex: 'message',
+      key: 'message',
+      width:"25%",
+      ellipsis:true
+    },
+    {
+      title: '创建时间',
+      dataIndex: 'creationDate',
+      key: 'creationDate',
+      align:"center",
+      render:(v,l,i)=>{
+        return(
+          <span>{l.creationDate &&  moment(l.creationDate).format('YYYY-MM-DD HH:mm:ss')}</span>
+        )
+      }
+    },
+  ];
+  return(
+    <div className="main" style={{padding:"0px"}}>
+      {
+        total > 0 ?
+        <div style={{minHeight:"300px"}}>
+          <p style={{padding:"12px 20px"}}>一共存在{total}个问题</p>
+          <Table dataSource={data} columns={columns} pagination={false}/>
+        </div>
+        :
+        <Nodata _html="代码质量非常优秀，没有检测到问题存在！" />
+      }
+      {
+        total > limit &&
+        <div style={{padding:"15px",textAlign:"center"}}>
+          <Pagination pageSize={limit} current={page} total={total} onChange={(p)=>setPage(p)}/>
+        </div>
+      }
+    </div>
+  )
+}
+export default Index