refactor(beautify): D16 PearlDiagram 珍珠图组件清理 (hex 24->0)

- 22 个行业类别色提取到 utils/brand-colors.js 的 INDUSTRY_COLORS 具名导出
  （内环 10 暖色 + 外环 12 紫蓝青绿），页面按 INDUSTRY_COLORS.XXX 引用
- template #FFFFFF -> BrandColors.white
- 组件级 hex 清零，行业色单一事实源集中到 utils

cfc-frontend/pages/action-detail/components/PearlDiagram.vue

@@ -18,7 +18,7 @@
           <view class="popup-info">
             <text class="popup-name">{{ selectedNode.name }}</text>
             <view class="popup-tags">
-              <text class="popup-tag" :style="{ background: selectedNode.color, color: '#FFFFFF' }">{{ selectedNode.groupTypeName }}</text>
+              <text class="popup-tag" :style="{ background: selectedNode.color, color: BrandColors.white }">{{ selectedNode.groupTypeName }}</text>
               <text class="popup-tag popup-tag-rel" v-if="selectedNode.relationshipType">{{ selectedNode.relationshipType }}</text>
             </view>
           </view>
@@ -59,6 +59,7 @@
 
 <script>
 import { addPearlInteraction, updatePearlPriority } from '@/utils/api.js'
+import { BrandColors, INDUSTRY_COLORS } from '@/utils/brand-colors.js'
 
 /**
  * PearlDiagram - 珍珠图 Canvas 组件
@@ -129,30 +130,30 @@ export default {
         // ===== 内圈：必备 12 组（radiusPct 0.28）=====
         { type: 'MEDICAL', typeName: '医疗', color: 'BrandColors.danger', radiusPct: 0.28, ring: 'inner' },
         { type: 'EDUCATION', typeName: '教育', color: 'BrandColors.primary', radiusPct: 0.28, ring: 'inner' },
-        { type: 'PUBLIC_SECURITY', typeName: '公安', color: '#DC2626', radiusPct: 0.28, ring: 'inner' },
-        { type: 'AUTO', typeName: '汽车相关', color: '#EA580C', radiusPct: 0.28, ring: 'inner' },
-        { type: 'REAL_ESTATE', typeName: '房产服务', color: '#D97706', radiusPct: 0.28, ring: 'inner' },
-        { type: 'TICKETING', typeName: '票务', color: '#CA8A04', radiusPct: 0.28, ring: 'inner' },
-        { type: 'HANDYMAN', typeName: '多能工人', color: '#B45309', radiusPct: 0.28, ring: 'inner' },
-        { type: 'APPLIANCE', typeName: '家电', color: '#92400E', radiusPct: 0.28, ring: 'inner' },
-        { type: 'CATERING', typeName: '餐饮', color: '#E11D48', radiusPct: 0.28, ring: 'inner' },
-        { type: 'FOOD', typeName: '食品', color: '#BE123C', radiusPct: 0.28, ring: 'inner' },
-        { type: 'LEGAL', typeName: '法律', color: '#B91C1C', radiusPct: 0.28, ring: 'inner' },
-        { type: 'WEEKEND_EXPERT', typeName: '周末达人', color: '#FB7185', radiusPct: 0.28, ring: 'inner' },
+        { type: 'PUBLIC_SECURITY', typeName: '公安', color: INDUSTRY_COLORS.PUBLIC_SECURITY, radiusPct: 0.28, ring: 'inner' },
+        { type: 'AUTO', typeName: '汽车相关', color: INDUSTRY_COLORS.AUTO, radiusPct: 0.28, ring: 'inner' },
+        { type: 'REAL_ESTATE', typeName: '房产服务', color: INDUSTRY_COLORS.REAL_ESTATE, radiusPct: 0.28, ring: 'inner' },
+        { type: 'TICKETING', typeName: '票务', color: INDUSTRY_COLORS.TICKETING, radiusPct: 0.28, ring: 'inner' },
+        { type: 'HANDYMAN', typeName: '多能工人', color: INDUSTRY_COLORS.HANDYMAN, radiusPct: 0.28, ring: 'inner' },
+        { type: 'APPLIANCE', typeName: '家电', color: INDUSTRY_COLORS.APPLIANCE, radiusPct: 0.28, ring: 'inner' },
+        { type: 'CATERING', typeName: '餐饮', color: INDUSTRY_COLORS.CATERING, radiusPct: 0.28, ring: 'inner' },
+        { type: 'FOOD', typeName: '食品', color: INDUSTRY_COLORS.FOOD, radiusPct: 0.28, ring: 'inner' },
+        { type: 'LEGAL', typeName: '法律', color: INDUSTRY_COLORS.LEGAL, radiusPct: 0.28, ring: 'inner' },
+        { type: 'WEEKEND_EXPERT', typeName: '周末达人', color: INDUSTRY_COLORS.WEEKEND_EXPERT, radiusPct: 0.28, ring: 'inner' },
         // ===== 外圈：理想 13 组（radiusPct 0.55）=====
-        { type: 'GOVERNMENT', typeName: '政府综合', color: '#8B5CF6', radiusPct: 0.55, ring: 'outer' },
-        { type: 'TAX', typeName: '税务', color: '#7C3AED', radiusPct: 0.55, ring: 'outer' },
-        { type: 'BUSINESS_ADMIN', typeName: '工商', color: '#6D28D9', radiusPct: 0.55, ring: 'outer' },
-        { type: 'BANK', typeName: '银行', color: '#2563EB', radiusPct: 0.55, ring: 'outer' },
-        { type: 'MEDIA', typeName: '媒体', color: '#1D4ED8', radiusPct: 0.55, ring: 'outer' },
-        { type: 'TRAVEL', typeName: '旅游', color: '#0EA5E9', radiusPct: 0.55, ring: 'outer' },
-        { type: 'LEADING_ENTERPRISE', typeName: '领军企业', color: '#0891B2', radiusPct: 0.55, ring: 'outer' },
-        { type: 'INDUSTRY_BENCHMARK', typeName: '行业标杆', color: '#059669', radiusPct: 0.55, ring: 'outer' },
+        { type: 'GOVERNMENT', typeName: '政府综合', color: INDUSTRY_COLORS.GOVERNMENT, radiusPct: 0.55, ring: 'outer' },
+        { type: 'TAX', typeName: '税务', color: INDUSTRY_COLORS.TAX, radiusPct: 0.55, ring: 'outer' },
+        { type: 'BUSINESS_ADMIN', typeName: '工商', color: INDUSTRY_COLORS.BUSINESS_ADMIN, radiusPct: 0.55, ring: 'outer' },
+        { type: 'BANK', typeName: '银行', color: INDUSTRY_COLORS.BANK, radiusPct: 0.55, ring: 'outer' },
+        { type: 'MEDIA', typeName: '媒体', color: INDUSTRY_COLORS.MEDIA, radiusPct: 0.55, ring: 'outer' },
+        { type: 'TRAVEL', typeName: '旅游', color: INDUSTRY_COLORS.TRAVEL, radiusPct: 0.55, ring: 'outer' },
+        { type: 'LEADING_ENTERPRISE', typeName: '领军企业', color: INDUSTRY_COLORS.LEADING_ENTERPRISE, radiusPct: 0.55, ring: 'outer' },
+        { type: 'INDUSTRY_BENCHMARK', typeName: '行业标杆', color: INDUSTRY_COLORS.INDUSTRY_BENCHMARK, radiusPct: 0.55, ring: 'outer' },
         { type: 'OVERSEAS', typeName: '国外', color: 'BrandColors.success', radiusPct: 0.55, ring: 'outer' },
-        { type: 'UNIVERSITY', typeName: '高校', color: '#16A34A', radiusPct: 0.55, ring: 'outer' },
-        { type: 'FINANCE', typeName: '金融', color: '#84CC16', radiusPct: 0.55, ring: 'outer' },
-        { type: 'SENIOR_LOCAL', typeName: '资深土著', color: '#65A30D', radiusPct: 0.55, ring: 'outer' },
-        { type: 'KEY_CITY', typeName: '北上广等', color: '#4D7C0F', radiusPct: 0.55, ring: 'outer' }
+        { type: 'UNIVERSITY', typeName: '高校', color: INDUSTRY_COLORS.UNIVERSITY, radiusPct: 0.55, ring: 'outer' },
+        { type: 'FINANCE', typeName: '金融', color: INDUSTRY_COLORS.FINANCE, radiusPct: 0.55, ring: 'outer' },
+        { type: 'SENIOR_LOCAL', typeName: '资深土著', color: INDUSTRY_COLORS.SENIOR_LOCAL, radiusPct: 0.55, ring: 'outer' },
+        { type: 'KEY_CITY', typeName: '北上广等', color: INDUSTRY_COLORS.KEY_CITY, radiusPct: 0.55, ring: 'outer' }
       ],
     }
   },

cfc-frontend/scripts/d16-pearl-diagram.js

@@ -0,0 +1,71 @@
+#!/usr/bin/env node
+/**
+ * D16: PearlDiagram.vue 珍珠图组件清理 (debt 69)
+ * 22 个行业类别色迁移到 utils/brand-colors.js 的 INDUSTRY_COLORS 导出，页面只引用常量
+ * template #FFFFFF -> BrandColors.white
+ */
+const fs = require('fs');
+const F = 'pages/action-detail/components/PearlDiagram.vue';
+let src = fs.readFileSync(F, 'utf8');
+let replaced = 0;
+
+function repl(from, to) {
+  const cnt = src.split(from).length - 1;
+  if (cnt === 0) { console.warn('NOT FOUND:', from.slice(0, 90)); return; }
+  src = src.split(from).join(to);
+  replaced += cnt;
+}
+
+// ---- 1. import ----
+repl(
+  "import { addPearlInteraction, updatePearlPriority } from '@/utils/api.js'",
+  "import { addPearlInteraction, updatePearlPriority } from '@/utils/api.js'\nimport { BrandColors, INDUSTRY_COLORS } from '@/utils/brand-colors.js'"
+);
+
+// ---- 2. 行业色引用 ----
+const MAP = [
+  ['#DC2626', 'INDUSTRY_COLORS.PUBLIC_SECURITY'],
+  ['#EA580C', 'INDUSTRY_COLORS.AUTO'],
+  ['#D97706', 'INDUSTRY_COLORS.REAL_ESTATE'],
+  ['#CA8A04', 'INDUSTRY_COLORS.TICKETING'],
+  ['#B45309', 'INDUSTRY_COLORS.HANDYMAN'],
+  ['#92400E', 'INDUSTRY_COLORS.APPLIANCE'],
+  ['#E11D48', 'INDUSTRY_COLORS.CATERING'],
+  ['#BE123C', 'INDUSTRY_COLORS.FOOD'],
+  ['#B91C1C', 'INDUSTRY_COLORS.LEGAL'],
+  ['#FB7185', 'INDUSTRY_COLORS.WEEKEND_EXPERT'],
+  ['#8B5CF6', 'INDUSTRY_COLORS.GOVERNMENT'],
+  ['#7C3AED', 'INDUSTRY_COLORS.TAX'],
+  ['#6D28D9', 'INDUSTRY_COLORS.BUSINESS_ADMIN'],
+  ['#2563EB', 'INDUSTRY_COLORS.BANK'],
+  ['#1D4ED8', 'INDUSTRY_COLORS.MEDIA'],
+  ['#0EA5E9', 'INDUSTRY_COLORS.TRAVEL'],
+  ['#0891B2', 'INDUSTRY_COLORS.LEADING_ENTERPRISE'],
+  ['#059669', 'INDUSTRY_COLORS.INDUSTRY_BENCHMARK'],
+  ['#16A34A', 'INDUSTRY_COLORS.UNIVERSITY'],
+  ['#84CC16', 'INDUSTRY_COLORS.FINANCE'],
+  ['#65A30D', 'INDUSTRY_COLORS.SENIOR_LOCAL'],
+  ['#4D7C0F', 'INDUSTRY_COLORS.KEY_CITY'],
+];
+// 只在 color: '#XXX' 上下文中替换，避免误伤（原文件这些色仅出现于 color 字段）
+for (const [f, t] of MAP) {
+  const pat = "color: '" + f + "'";
+  const cnt = src.split(pat).length - 1;
+  if (cnt === 0) { console.warn('NOT FOUND color:', f); continue; }
+  src = src.split(pat).join("color: " + t);
+  replaced += cnt;
+}
+
+// ---- 3. template #FFFFFF ----
+repl("color: '#FFFFFF'", "color: BrandColors.white");
+
+fs.writeFileSync(F, src);
+console.log('total replaced:', replaced);
+
+const lines = src.split('\n');
+let n = 0;
+for (let i = 0; i < lines.length; i++) {
+  const L = lines[i].trim();
+  if (/#[0-9a-fA-F]{3,8}\b/.test(L)) { console.log('HEX ' + (i + 1) + ': ' + L); n++; }
+}
+console.log('remaining hex lines:', n);

cfc-frontend/utils/brand-colors.js

@@ -102,3 +102,32 @@ export const BrandColors = {
 
 // 向后兼容导出（避免 import 路径散乱）
 export default BrandColors
+
+// 行业类别色板（珍珠图/关系图专用；22 类，内环 10 + 外环 12）
+// 提取到此处避免页面内散落 hex，页面仅引用 INDUSTRY_COLORS.XXX
+export const INDUSTRY_COLORS = {
+  // 内环（暖色系：红/橙/黄/棕）
+  PUBLIC_SECURITY:    '#DC2626', // 公安（red-600）
+  AUTO:               '#EA580C', // 汽车相关（orange-600）
+  REAL_ESTATE:        '#D97706', // 房产服务（amber-600）
+  TICKETING:          '#CA8A04', // 票务（yellow-600）
+  HANDYMAN:           '#B45309', // 多能工人（amber-700）
+  APPLIANCE:          '#92400E', // 家电（amber-800）
+  CATERING:           '#E11D48', // 餐饮（rose-600）
+  FOOD:               '#BE123C', // 食品（rose-700）
+  LEGAL:              '#B91C1C', // 法律（red-700）
+  WEEKEND_EXPERT:     '#FB7185', // 周末达人（rose-400）
+  // 外环（紫/蓝/青/绿）
+  GOVERNMENT:         '#8B5CF6', // 政府综合（violet-500）
+  TAX:                '#7C3AED', // 税务（violet-600）
+  BUSINESS_ADMIN:     '#6D28D9', // 工商（violet-700）
+  BANK:               '#2563EB', // 银行（blue-600）
+  MEDIA:              '#1D4ED8', // 媒体（blue-700）
+  TRAVEL:             '#0EA5E9', // 旅游（sky-500）
+  LEADING_ENTERPRISE: '#0891B2', // 领军企业（cyan-600）
+  INDUSTRY_BENCHMARK: '#059669', // 行业标杆（emerald-600）
+  UNIVERSITY:         '#16A34A', // 高校（green-600）
+  FINANCE:            '#84CC16', // 金融（lime-500）
+  SENIOR_LOCAL:       '#65A30D', // 资深土著（lime-600）
+  KEY_CITY:           '#4D7C0F', // 北上广等（lime-700）
+}