分割标记的颜色需要随机，不能重复

src/views/trials/trials-panel/reading/dicoms3D/components/Segmentations.vue

@@ -120,7 +120,7 @@
                         </el-switch>
                         <span style="margin-left: 5px;">{{
                             $t('trials:reading:Segmentations:title:InactiveSegmentationsShow')
-                        }}</span>
+                            }}</span>
                     </div>
                     <!-- <div class="SegmentConfig" v-if="SegmentConfig.InactiveSegmentations.show">
                         <span>{{ $t('trials:reading:Segmentations:title:Opacity') }}</span>
@@ -191,7 +191,7 @@
                                         <div v-for="k in statsKey" :key="k" class="statsBox">
                                             <span>{{ k }}</span>
                                             <span v-if="item.stats[k]">{{ Number(item.stats[k].value).toFixed(2)
-                                            }}<i>{{ item.stats[k].unit }}</i></span>
+                                                }}<i>{{ item.stats[k].unit }}</i></span>
                                         </div>
                                     </template>
                                     <div class="serialNum" slot="reference">{{ index + 1 }}</div>
@@ -234,7 +234,7 @@
         </el-collapse>
         <div class="saveBtnBox">
             <el-button type="success" size="small" @click="saveSegmentGroup()">{{ $t("common:button:save")
-            }}</el-button>
+                }}</el-button>
         </div>
     </div>
 </template>
@@ -724,7 +724,8 @@ export default {
 
             } else {
                 let item = this.segmentList.find(i => i.segmentationId === this.segmentationId)
-                let segmentIndex = item.segments[item.segments.length - 1].segmentIndex + 1
+                let arr = item.segments.sort((a, b) => a.segmentIndex - b.segmentIndex)
+                let segmentIndex = arr[item.segments.length - 1].segmentIndex + 1
                 let obj = {
                     segmentIndex: segmentIndex,
                     segmentationId: this.segmentationId,
@@ -736,6 +737,11 @@ export default {
                     view: true,
                     lock: false
                 }
+                if (item.segments.length >= this.colors.length) {
+                    let index = item.segments.length % this.colors.length
+                    let color = this.randomNearColor(this.colors[index], 4)
+                    obj.color = color
+                }
                 let id = await this.addOrUpdateSegment({ name: obj.SegmentLabel, color: obj.color, segmentIndex: obj.segmentIndex, segmentationId: obj.segmentationId })
                 obj.id = id
                 item.segments.push(obj)
@@ -1599,6 +1605,87 @@ export default {
                 b = parseInt(rgb[3], 16);
             return [r, g, b, alpha * 255];
         },
+        randomNearColor(hex, range = 3) {
+            if (!/^#([0-9a-fA-F]{6})$/.test(hex)) {
+                throw new Error('请输入正确的 6 位十六进制颜色值，例如 #000000');
+            }
+
+            const hexToRgb = (hex) => ({
+                r: parseInt(hex.slice(1, 3), 16),
+                g: parseInt(hex.slice(3, 5), 16),
+                b: parseInt(hex.slice(5, 7), 16),
+            });
+
+            const rgbToHsl = (r, g, b) => {
+                r /= 255; g /= 255; b /= 255;
+                const max = Math.max(r, g, b);
+                const min = Math.min(r, g, b);
+                let h = 0, s = 0;
+                const l = (max + min) / 2;
+
+                if (max !== min) {
+                    const d = max - min;
+                    s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+
+                    switch (max) {
+                        case r: h = (g - b) / d + (g < b ? 6 : 0); break;
+                        case g: h = (b - r) / d + 2; break;
+                        case b: h = (r - g) / d + 4; break;
+                    }
+
+                    h *= 60;
+                }
+
+                return { h, s: s * 100, l: l * 100 };
+            };
+
+            const hslToRgb = (h, s, l) => {
+                h /= 360; s /= 100; l /= 100;
+                let r, g, b;
+
+                if (s === 0) {
+                    r = g = b = l;
+                } else {
+                    const hue2rgb = (p, q, t) => {
+                        if (t < 0) t += 1;
+                        if (t > 1) t -= 1;
+                        if (t < 1 / 6) return p + (q - p) * 6 * t;
+                        if (t < 1 / 2) return q;
+                        if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
+                        return p;
+                    };
+
+                    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+                    const p = 2 * l - q;
+
+                    r = hue2rgb(p, q, h + 1 / 3);
+                    g = hue2rgb(p, q, h);
+                    b = hue2rgb(p, q, h - 1 / 3);
+                }
+
+                return {
+                    r: Math.round(r * 255),
+                    g: Math.round(g * 255),
+                    b: Math.round(b * 255),
+                };
+            };
+
+            const rgbToHex = (r, g, b) =>
+                `#${[r, g, b].map(v => v.toString(16).padStart(2, '0')).join('')}`;
+
+            const clamp = (v, min, max) => Math.min(max, Math.max(min, v));
+            const randomOffset = (n) => (Math.random() * 2 - 1) * n;
+
+            const { r, g, b } = hexToRgb(hex);
+            const { h, s, l } = rgbToHsl(r, g, b);
+
+            const nh = (h + randomOffset(range) + 360) % 360;
+            const ns = clamp(s + randomOffset(range), 0, 100);
+            const nl = clamp(l + randomOffset(range), 0, 100);
+
+            const rgb = hslToRgb(nh, ns, nl);
+            return rgbToHex(rgb.r, rgb.g, rgb.b);
+        }
     },
 
 }