feat(organization-chart): enhance organization chart with leg totals and styling improvements

- Updated the organization chart to include gold and silver leg totals for better visibility of user metrics.
- Modified the CSS for the chart to improve layout and styling, ensuring a more user-friendly interface.
- Adjusted JavaScript to dynamically display leg scores, enhancing the overall interactivity of the chart.

These changes improve the clarity and usability of the organization chart, providing users with essential metrics at a glance.

src/FrontOffice.Main/FrontOffice.Main.csproj

@@ -11,7 +11,7 @@
   <ItemGroup>
     <PackageReference Include="DateTimeConverterCL" Version="1.0.0" />
     <!-- Replace all FrontOffice.BFF protobuf packages with CMS protobuf -->
-    <PackageReference Include="Foursat.CMSMicroservice.Protobuf" Version="0.0.204" />
+    <PackageReference Include="Foursat.CMSMicroservice.Protobuf" Version="0.0.210" />
 <!--    <ProjectReference Include="../../../CMS/src/CMSMicroservice.Protobuf/CMSMicroservice.Protobuf.csproj" />-->
     <PackageReference Include="MudBlazor" Version="8.14.0" />
     <PackageReference Include="Blazored.LocalStorage" Version="4.5.0" />

src/FrontOffice.Main/Pages/Profile/Components/OrganizationChart.razor.cs

@@ -110,7 +110,11 @@ public partial class OrganizationChart : IAsyncDisposable
                 activationWeekNumber = n.ActivationWeekNumber,
                 joinedAt = n.JoinedAt,
                 referralCode = n.ReferralCode,
-                packageName = n.PackageName ?? string.Empty
+                packageName = n.PackageName ?? string.Empty,
+                goldLeftLegTotal = n.GoldLeftLegTotal,
+                goldRightLegTotal = n.GoldRightLegTotal,
+                silverLeftLegTotal = n.SilverLeftLegTotal,
+                silverRightLegTotal = n.SilverRightLegTotal
             }).ToArray();
             
             await JSRuntime.InvokeVoidAsync("OrgChart.init", "org-chart-container", flatData, _dotNetHelper);

src/FrontOffice.Main/Utilities/NetworkMembershipDtos.cs

@@ -26,6 +26,18 @@ public class NetworkNodeDto
     /// نام پکیج موثر (مثلاً پکیج طلایی / نقره‌ای)
     /// </summary>
     public string? PackageName { get; set; }
+
+    /// <summary>آخرین امتیاز پای چپ پکیج طلایی</summary>
+    public int GoldLeftLegTotal { get; set; }
+
+    /// <summary>آخرین امتیاز پای راست پکیج طلایی</summary>
+    public int GoldRightLegTotal { get; set; }
+
+    /// <summary>آخرین امتیاز پای چپ پکیج نقره‌ای</summary>
+    public int SilverLeftLegTotal { get; set; }
+
+    /// <summary>آخرین امتیاز پای راست پکیج نقره‌ای</summary>
+    public int SilverRightLegTotal { get; set; }
 }
 
 /// <summary>
@@ -53,6 +65,11 @@ public class FlatNetworkNodeDto
     /// نام پکیج موثر (مثلاً پکیج طلایی / نقره‌ای)
     /// </summary>
     public string? PackageName { get; set; }
+
+    public int GoldLeftLegTotal { get; set; }
+    public int GoldRightLegTotal { get; set; }
+    public int SilverLeftLegTotal { get; set; }
+    public int SilverRightLegTotal { get; set; }
 }
 
 /// <summary>
@@ -92,7 +109,11 @@ public class NetworkTreeDto
             ActivationWeekNumber = node.ActivationWeekNumber,
             JoinedAt = node.JoinedAt,
             ReferralCode = node.ReferralCode,
-            PackageName = node.PackageName
+            PackageName = node.PackageName,
+            GoldLeftLegTotal = node.GoldLeftLegTotal,
+            GoldRightLegTotal = node.GoldRightLegTotal,
+            SilverLeftLegTotal = node.SilverLeftLegTotal,
+            SilverRightLegTotal = node.SilverRightLegTotal
         };
         
         result.Add(flatNode);

src/FrontOffice.Main/Utilities/NetworkMembershipService.cs

@@ -138,6 +138,10 @@ public class NetworkMembershipService
             IsClubActive = node.IsClubActive,
             ReferralCode = node.ReferralCode,
             PackageName = string.IsNullOrWhiteSpace(node.PackageName) ? null : node.PackageName,
+            GoldLeftLegTotal = node.GoldLeftLegTotal,
+            GoldRightLegTotal = node.GoldRightLegTotal,
+            SilverLeftLegTotal = node.SilverLeftLegTotal,
+            SilverRightLegTotal = node.SilverRightLegTotal,
             ActivationWeekNumber = node.ActivationWeekDefinitionId?.ToString(),
             JoinedAt = node.JoinedAt?.ToDateTime(),
             LeftChild = MapNodeFromProto(node.LeftChild),

src/FrontOffice.Main/wwwroot/css/org-chart.css

@@ -72,10 +72,10 @@
 /* Compact Header */
 .node-header-compact {
     display: flex;
-    align-items: center;
+    align-items: flex-start;
     gap: 6px;
     padding: 6px 8px;
-    height: 100%;
+    min-height: 100%;
     background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
 }
 
@@ -141,6 +141,22 @@
     max-width: 120px;
 }
 
+/* D3: طلایی / نقره‌ای — پای چپ و راست */
+.node-leg-scores {
+    margin-top: 3px;
+    line-height: 1.25;
+    font-size: 8px;
+    font-weight: 600;
+}
+
+.node-leg-scores .leg-score-line.gold {
+    color: #b8860b;
+}
+
+.node-leg-scores .leg-score-line.silver {
+    color: #607d8b;
+}
+
 /* Referral Code - only for club active members */
 .node-referral {
     display: flex;

src/FrontOffice.Main/wwwroot/js/org-chart.js

@@ -37,8 +37,8 @@ window.OrgChart = {
             this.chart = new d3.OrgChart()
                 .container('#' + containerId)
                 .data(data)
-                .nodeWidth((d) => 140)
-                .nodeHeight((d) => 85)
+                .nodeWidth((d) => 150)
+                .nodeHeight((d) => 112)
                 .childrenMargin((d) => 50)
                 .compactMarginBetween((d) => 15)
                 .compactMarginPair((d) => 15)
@@ -80,6 +80,16 @@ window.OrgChart = {
                            </div>` 
                         : '';
 
+                    const gL = data.goldLeftLegTotal ?? 0;
+                    const gR = data.goldRightLegTotal ?? 0;
+                    const sL = data.silverLeftLegTotal ?? 0;
+                    const sR = data.silverRightLegTotal ?? 0;
+                    const legScoresHtml = `
+                        <div class="node-leg-scores" title="آخرین امتیاز هفتگی پای چپ / راست">
+                            <div class="leg-score-line gold">طلایی: چپ ${gL} · راست ${gR}</div>
+                            <div class="leg-score-line silver">نقره‌ای: چپ ${sL} · راست ${sR}</div>
+                        </div>`;
+
                     return `
                         <div class="org-node-card ${positionClass} ${activeClass} ${clubActiveClass}" data-user-id="${data.id}">
                             <div class="node-header-compact ${isRoot ? 'root' : ''}">
@@ -88,6 +98,7 @@ window.OrgChart = {
                                     <div class="node-name-sm">${data.fullName || 'بدون نام'}</div>
                                     <div class="node-level-sm">L${data.level || 0}${!isRoot ? ' • ' + (data.position === 'Left' ? 'چپ' : 'راست') : ''}</div>
                                     ${packageBadge}
+                                    ${legScoresHtml}
                                     ${referralCodeHtml}
                                 </div>
                             </div>