开源度量-commitmessage质量饼图

src/forge/Server/measurement/componet/dataStack.jsx

@@ -12,7 +12,6 @@ function DataStack({ data }){
     useEffect(()=>{
         if(data){
             let drop = Object.keys(data);
-            console.log("---",drop);
             setUserDrop(drop);
             setUserValue(drop[0]);
         }

src/forge/Server/measurement/componet/pie.jsx

@@ -23,8 +23,18 @@ function Pie({values,title}){
             color:['#5871FF',"#FFBE38","#00bf9a"],
             legend: {
               orient: 'horizontal',
-              left: 'center',
-              top:20
+              right: 20,
+              top:20,
+              formatter: function (name) {
+                // 查找对应系列的值
+                var data = option.series[0].data;
+                for (var i = 0; i < data.length; i++) {
+                    if (data[i].name == name) {
+                        return data[i].value === 0 ? name + ' (0)' : name;
+                    }
+                }
+                return name;
+              }
             },
             series: [
               {

src/forge/Server/measurement/componet/stack.jsx

@@ -1,15 +1,18 @@
 import React, { useEffect, useState } from 'react';
 import * as echarts from 'echarts';
 import { detailByName } from '../config';
+import Pie from './pie';
 import { Select } from 'antd';
 
-function Stack({name,data , type}){
+function Stack({name,data , type , pieData}){
   const [ obj , setObj ] = useState({});
   const [ list , setList ] = useState(data);
 
   const [ userDrop , setUserDrop ] = useState([]);
   const [ userValue , setUserValue ] = useState([]);
 
+  const [pieEchartData,setPieEchartData] = useState([]);
+
   useEffect(()=>{
     if(name){
       let obj = detailByName[name.replace(/\s/g, '')];
@@ -89,24 +92,48 @@ function Stack({name,data , type}){
           };
         myEcharts.setOption(option);
     }
+    
+    useEffect(()=>{
+      if(pieData){
+        let newData = new Array;
+        for (var i in pieData) {
+          var json = {};
+          if (pieData[i] != "") {
+            json.name = i;
+            json.value = pieData[i];
+            newData.push(json);
+          }
+        }
+        setPieEchartData(newData)
+      }
+    },[pieData])
+
     return(
       <div>
+        <div className='dropEchartPanel'>
+          {
+            obj && obj.user_login && userValue && userDrop && userDrop.length>0 &&
+            <div style={{textAlign:"left",paddingLeft:20}}>
+              <span className='mr10'>贡献者:</span>
+              <Select
+                value={userValue}
+                style={{ width: 220 }}
+                onChange={(e)=>{setUserValue(e);}}
+              >
+                {userDrop.map(value => {
+                  return <Option key={value}>{value}</Option>
+                })}
+              </Select>
+            </div>
+          }
+          <div id="line" style={{height:"350px"}}></div>
+        </div>
         {
-          obj && obj.user_login && userValue && userDrop && userDrop.length>0 &&
-          <div style={{textAlign:"left",paddingLeft:20}}>
-            <span className='mr10'>贡献者:</span>
-            <Select
-              value={userValue}
-              style={{ width: 220 }}
-              onChange={(e)=>{setUserValue(e);}}
-            >
-              {userDrop.map(value => {
-                return <Option key={value}>{value}</Option>
-              })}
-            </Select>
+          pieData &&
+          <div className='dropEchartPanel'>
+            <Pie values={pieEchartData} title="Commit Message质量分布"/>
           </div>
         }
-        <div id="line" style={{height:"350px"}}></div>
       </div>
     )
 }

src/forge/Server/measurement/dimension.jsx

@@ -20,6 +20,7 @@ const dimensionData = {
 function Dimension(props){
     const { type , owner , projectsId } =  props.match.params;
     const [ data , setData ] = useState([]);
+    const [ pieData , setPieData ] = useState([]);
     const [ score , setScore ] = useState(0);
 
     const [title, setTitle] = useState('');
@@ -63,9 +64,9 @@ function Dimension(props){
             }
             let data = res && res.data;
             if(data){
-                console.log(data.score);
                 let d = data[t] ? data[t].value : data.value;
                 let s = data.score !== undefined ? data.score : data[t].score;
+                setPieData(data.distribution);
                 setData(d);
                 if(t==="companyLoss"){
                     d = d.map(i=>{return { month:i.Company , count : (i["Predicted State"] || 0.0)}});
@@ -139,7 +140,7 @@ function Dimension(props){
                             type === "companyLead" ?
                             <CompanyData data={data[0]} />
                             :
-                            <div className='dropEchartPanel'><LineStack name={dValue} data={data} type={type==="storeNum" ?"followNum":type}/></div>
+                            <LineStack name={dValue} data={data} type={type==="storeNum" ?"followNum":type} pieData={pieData}/>
                         }
                     </div>
                     :<Nodata _html={`暂无数据~`}/>