From ce701c6fedadb0e0704ff080e87921d81c64ec6e Mon Sep 17 00:00:00 2001
From: JustAnotherID <just-another-id@outlook.com>
Date: Mon, 27 May 2024 13:35:55 +0800
Subject: [PATCH] =?UTF-8?q?feat(StroyLog):=20=E8=BF=9B=E4=B8=80=E6=AD=A5?=
 =?UTF-8?q?=E6=94=B9=E8=BF=9B=E8=B7=91=E5=9B=A2=E6=97=A5=E5=BF=97=E9=A2=84?=
 =?UTF-8?q?=E8=A7=88=E7=9A=84=E9=A2=9C=E8=89=B2=E7=94=9F=E6=88=90=20(#200)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: JustAnotherID <just-another-id@outlook.com>
---
 src/components/mod/PageStory.vue | 34 ++++++++++++++++++++++++++++++--
 1 file changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/components/mod/PageStory.vue b/src/components/mod/PageStory.vue
index 3363ad97..7604b579 100644
--- a/src/components/mod/PageStory.vue
+++ b/src/components/mod/PageStory.vue
@@ -7,6 +7,7 @@ import dayjs from 'dayjs'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import StoryBackup from "~/components/mod/story/StoryBackup.vue";
+import * as twColors from 'tailwindcss/colors'
 import randomColor from "randomcolor";
 
 interface Log {
@@ -252,12 +253,41 @@ function closeItem() {
     users.value = {}
 }
 
+const randomColorWithIndex = (i: number): string => {
+    const presets = [
+        twColors.red[600],
+        twColors.orange[600],
+        twColors.yellow[600],
+        twColors.green[600],
+        twColors.cyan[600],
+        twColors.blue[600],
+        twColors.purple[600],
+        twColors.pink[600],
+        twColors.slate[600],
+    ]
+    const randomColorSystems = [
+        'red',
+        'orange',
+        'yellow',
+        'green',
+        'blue',
+        'purple',
+        'pink',
+        'monochrome',
+    ]
+    if (i < presets.length) {
+        return presets[i]
+    } else {
+        return randomColor({ hue: randomColorSystems[i % randomColorSystems.length], luminosity: 'dark' })
+    }
+}
+
 const items = computed(() => {
     let items: Item[] = []
-    item_data.value.forEach(v => {
+    item_data.value.forEach((v, i) => {
         if (!users.value[v.IMUserId]) {
             users.value[v.IMUserId] = [
-                randomColor(),
+                randomColorWithIndex(i),
                 v.nickname
             ]
         }