feat: add pie total count

Signed-off-by: laixingyou <[email protected]>
oss-compass · Dec 25, 2023 · 1c71d18 · 1c71d18
1 parent 5ad54fe
commit 1c71d18
Show file tree

Hide file tree

Showing 15 changed files with 112 additions and 85 deletions.
diff --git a/apps/web/i18n b/apps/web/i18n
diff --git a/apps/web/src/common/components/EChartGl/useOptions.tsx b/apps/web/src/common/components/EChartGl/useOptions.tsx
@@ -8,12 +8,12 @@ const useOptions = () => {
     t('analyze:topic:productivity'),
     t('analyze:topic:productivity'),
     t('analyze:topic:productivity'),
-    t('analyze:topic:robustness'),
-    t('analyze:topic:robustness'),
-    t('analyze:topic:robustness'),
     t('analyze:topic:niche_creation'),
     t('analyze:topic:niche_creation'),
     t('analyze:topic:niche_creation'),
+    t('analyze:topic:robustness'),
+    t('analyze:topic:robustness'),
+    t('analyze:topic:robustness'),
   ];
   const type = [
     t('analyze:collaboration'),
@@ -47,16 +47,16 @@ const useOptions = () => {
     {
       name: t('analyze:all_model:community_activity'),
       key: 'activity',
-      value: [4, 1, 20],
-      itemStyle: { color: color[1] },
+      value: [7, 1, 20],
+      itemStyle: { color: color[2] },
       disable: false,
       scope: 'collaboration',
     },
     {
       name: t('analyze:all_model:organization_activity'),
       key: 'organizations_activity',
-      value: [7, 1, 30],
-      itemStyle: { color: color[2] },
+      value: [4, 1, 30],
+      itemStyle: { color: color[1] },
       disable: false,
       scope: 'collaboration',
     },

diff --git a/apps/web/src/common/components/Header/MobileHeader.tsx b/apps/web/src/common/components/Header/MobileHeader.tsx
@@ -110,7 +110,7 @@ const MobileHeader: React.FC<PropsWithChildren> = ({ children }) => {
           </div>
           <div
             className=""
-            onClickCapture={() => {
+            onClick={() => {
               toggle();
             }}
           >

diff --git a/apps/web/src/common/components/Tab.tsx b/apps/web/src/common/components/Tab.tsx
@@ -27,9 +27,11 @@ const Tab: React.FC<{
             )}
             onClick={() => !option.disable && onChange(option.value)}
           >
-            <Tooltip arrow title={option.tooltip} placement="right">
-              <div>{option.label}</div>
-            </Tooltip>
+            <a>
+              <Tooltip arrow title={option.tooltip} placement="right">
+                <div>{option.label}</div>
+              </Tooltip>
+            </a>
           </div>
         );
       })}

diff --git a/...b/src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorContribution.tsx b/...b/src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorContribution.tsx
@@ -78,6 +78,7 @@ const EcoContributorContribution: React.FC<{
     const legend = [];
     const ecoData = [];
     const contributorsData = [];
+    let allCount = 0;
     if (data?.ecoContributorsOverview?.length > 0) {
       const ecoContributorsOverview = data.ecoContributorsOverview;
       ecoContributorsOverview.forEach((item, i) => {
@@ -99,6 +100,7 @@ const EcoContributorContribution: React.FC<{
           name: name,
           itemStyle: { color: colorList[0] },
         });
+        allCount += count;
         ecoData.push({
           name: name,
           value: count,
@@ -108,6 +110,7 @@ const EcoContributorContribution: React.FC<{
     }
     return {
       legend,
+      allCount,
       ecoData,
       contributorsData,
     };
@@ -125,7 +128,12 @@ const EcoContributorContribution: React.FC<{
       data: getSeries.legend,
     },
     title: {
-      text: t('analyze:metric_detail:global_contribution_distribution'),
+      text:
+        t('analyze:metric_detail:global_contribution_distribution') +
+        '(' +
+        getSeries.allCount +
+        unit +
+        ')',
       left: 'center',
     },
     series: [
@@ -201,6 +209,7 @@ const OrgContributorContribution: React.FC<{
     const legend = [];
     const ecoData = [];
     const contributorsData = [];
+    let allCount = 0;
     if (data?.orgContributionDistribution?.length > 0) {
       const orgContributionDistribution = data.orgContributionDistribution;
       orgContributionDistribution.forEach((item, i) => {
@@ -222,6 +231,7 @@ const OrgContributorContribution: React.FC<{
           name: name,
           itemStyle: { color: colorList[0] },
         });
+        allCount += count;
         ecoData.push({
           name: name,
           value: count,
@@ -231,6 +241,7 @@ const OrgContributorContribution: React.FC<{
     }
     return {
       legend,
+      allCount,
       ecoData,
       contributorsData,
     };
@@ -248,7 +259,12 @@ const OrgContributorContribution: React.FC<{
       data: getSeries.legend,
     },
     title: {
-      text: t('analyze:metric_detail:global_contribution_distribution'),
+      text:
+        t('analyze:metric_detail:global_contribution_distribution') +
+        '(' +
+        getSeries.allCount +
+        unit +
+        ')',
       left: 'center',
     },
     series: [

diff --git a/.../src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorOrganizations.tsx b/.../src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorOrganizations.tsx
@@ -26,6 +26,7 @@ const ContributorContribution: React.FC<{
     const legend = [];
     const ecoData = [];
     const contributorsData = [];
+    let allCount = 0;
     if (data?.orgContributorsOverview?.length > 0) {
       const ecoContributorsOverview = data.orgContributorsOverview;
       ecoContributorsOverview
@@ -47,6 +48,7 @@ const ContributorContribution: React.FC<{
             name: subTypeName,
             itemStyle: { color: colorList[0] },
           });
+          allCount += count;
           ecoData.push({
             name: subTypeName,
             value: count,
@@ -56,6 +58,7 @@ const ContributorContribution: React.FC<{
     }
     return {
       legend,
+      allCount,
       ecoData,
       contributorsData,
     };
@@ -73,7 +76,12 @@ const ContributorContribution: React.FC<{
       data: getSeries.legend,
     },
     title: {
-      text: t('analyze:metric_detail:organization_contribution_distribution'),
+      text:
+        t('analyze:metric_detail:organization_contribution_distribution') +
+        '(' +
+        getSeries.allCount +
+        unit +
+        ')',
       left: 'center',
     },
     series: [

diff --git a/apps/web/src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorTable.tsx b/apps/web/src/modules/analyze/DataView/MetricDetail/MetricContributor/ContributorTable.tsx
@@ -57,7 +57,7 @@ const MetricTable: React.FC<{
       showSizeChanger: false,
       position: ['bottomCenter'],
       showTotal: (total) => {
-        return `Total ${total} items`;
+        return `${t('analyze:total_people', { total })} `;
       },
     },
     filterOpts: [],

diff --git a/apps/web/src/modules/analyze/DataView/MetricDetail/MetricContributor/Contributors.tsx b/apps/web/src/modules/analyze/DataView/MetricDetail/MetricContributor/Contributors.tsx
@@ -29,6 +29,7 @@ const ContributorContributors: React.FC<{
     const legend = [];
     const ecoData = [];
     const contributorsData = [];
+    let allCount = 0;
     if (data?.orgContributorsDistribution?.length > 0) {
       const orgContributorsDistribution = data.orgContributorsDistribution;
       orgContributorsDistribution.forEach((item, i) => {
@@ -49,6 +50,7 @@ const ContributorContributors: React.FC<{
           name: name,
           itemStyle: { color: colorList[0] },
         });
+        allCount += count;
         ecoData.push({
           name: name,
           value: count,
@@ -58,6 +60,7 @@ const ContributorContributors: React.FC<{
     }
     return {
       legend,
+      allCount,
       ecoData,
       contributorsData,
     };
@@ -75,7 +78,12 @@ const ContributorContributors: React.FC<{
       data: getSeries.legend,
     },
     title: {
-      text: t('analyze:metric_detail:contributor_distribution'),
+      text:
+        t('analyze:metric_detail:contributor_distribution') +
+        '(' +
+        getSeries.allCount +
+        unit +
+        ')',
       left: 'center',
     },
     series: [

diff --git a/apps/web/src/modules/analyze/DataView/MetricDetail/MetricIssue/IssueTable.tsx b/apps/web/src/modules/analyze/DataView/MetricDetail/MetricIssue/IssueTable.tsx
@@ -37,7 +37,7 @@ const MetricTable: React.FC<{
       showSizeChanger: false,
       position: ['bottomCenter'],
       showTotal: (total) => {
-        return `Total ${total} items`;
+        return `${t('analyze:total_issues', { total })} `;
       },
     },
     filterOpts: [],

diff --git a/apps/web/src/modules/analyze/DataView/MetricDetail/MetricPr/PrTable.tsx b/apps/web/src/modules/analyze/DataView/MetricDetail/MetricPr/PrTable.tsx
@@ -36,7 +36,7 @@ const MetricTable: React.FC<{
       showSizeChanger: false,
       position: ['bottomCenter'],
       showTotal: (total) => {
-        return `Total ${total} items`;
+        return `${t('analyze:total_prs', { total })} `;
       },
     },
     filterOpts: [],

diff --git a/apps/web/src/modules/analyze/DataView/MetricDetail/index.tsx b/apps/web/src/modules/analyze/DataView/MetricDetail/index.tsx
@@ -72,7 +72,7 @@ const MetricDetail = () => {
           <div className="md:hidden">
             <LabelItems />
           </div>
-          <span className="lg:hidden">
+          <span className="ml-2 text-base lg:hidden">
             {t('analyze:metric_detail:project_deep_dive_insight')}
           </span>
         </div>