优化

src/stores/modules/app.ts

@@ -2,6 +2,7 @@ import { defineStore } from 'pinia'
 import { systemStudent, systemUserGetInfo } from '@/api/modules/global'
 import { systemSubjectList } from '@/api/modules/study'
 import router from '@/router'
+import { ElMessage } from 'element-plus'
 
 export const useAppStore = defineStore('app', {
   state: () => ({
@@ -11,15 +12,19 @@ export const useAppStore = defineStore('app', {
     subjectMap: new Map(),
     colors: [
       '#EF5710',
-      '#b3d7ea',
-      '#7dc7e0',
       '#714734',
-      '#f9f5ba',
+      '#4A148C',
       '#d92f2f',
-      '#fcebe4',
-      '#9cd6ef',
       '#338bcc',
+      '#263238',
+      '#2E7D32',
+      '#B71C1C',
+      '#1B5E20',
+      '#0D47A1',
+      '#8B0000',
+      '#3E2723',
     ],
+    themeColor: localStorage.getItem('themeMainColor') || this.colors[0],
   }),
   getters: {},
   actions: {
@@ -31,6 +36,11 @@ export const useAppStore = defineStore('app', {
             systemStudent(this.userInfo?.userId).then(
               ({ data: studentData }: any) => {
                 this.studentInfo = studentData
+                if (!this.studentInfo) {
+                  ElMessage.warning('未查询到学生信息！')
+                  reject('')
+                  return
+                }
                 systemSubjectList({
                   pageNum: 1,
                   pageSize: 10,
@@ -121,5 +131,8 @@ export const useAppStore = defineStore('app', {
         l.style.display = 'none'
       }
     },
+    setThemeColor(color: string) {
+      this.themeColor = color
+    },
   },
 })

src/views/global/login/index.vue

@@ -5,13 +5,16 @@
       style="box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1)"
     >
       <!-- Logo -->
-      <div class="mb-8 flex justify-center">
+      <div class="flex justify-center">
         <img
           src="@/assets/images/logo.png"
           alt="北之星"
           class="h-20 object-contain"
         />
       </div>
+      <div class="mb-4 flex justify-center text-xl font-bold text-[#2a578d]">
+        北之星刷题神器
+      </div>
 
       <!-- 登录表单 -->
       <CzrForm ref="ref_form" @handleEnter="onLogin">

src/views/study/components/study-layout.vue

@@ -172,7 +172,7 @@ const router = useRouter()
 const state: any = reactive({
   showInfo: false,
   showColor: false,
-  color: localStorage.getItem('themeMainColor') || AppStore.colors[0],
+  color: AppStore.themeColor,
   avatar: '',
 })
 const infoCpt = computed(() => {
@@ -207,6 +207,7 @@ const onSwitchTheme = (color) => {
     rgbSub_,
   )
   localStorage.setItem('themeMainColor', color)
+  AppStore.setThemeColor(color)
 }
 const handleAvatarSuccess = (response, uploadFile) => {
   state.avatar = URL.createObjectURL(uploadFile.raw!)

src/views/study/home/index.vue

@@ -225,7 +225,7 @@
           <div class="bg-[var(--czr-main-sub-color)] px-4 py-3 text-white">
             <div class="flex items-center text-base font-bold">
               <i class="fas fa-chalkboard-teacher mr-2"></i>
-              公告
+              北之星公告
             </div>
           </div>
           <div

src/views/study/subject/chart-3.vue

@@ -12,13 +12,17 @@ import {
   onMounted,
   watch,
   nextTick,
+  computed,
 } from 'vue'
 import * as echarts from 'echarts'
+import { useAppStore } from '@/stores'
+import { extractRgbFromRgba, hexToRgb } from '@/utils/czr-util'
 
 const props = defineProps({
   data: <any>{},
 })
 
+const AppStore = useAppStore()
 const { proxy } = getCurrentInstance()
 const state = reactive({
   resizeObserver: <any>null,
@@ -26,6 +30,15 @@ const state = reactive({
 })
 const ref_chart = ref()
 const ref_main = ref()
+const colorCpt1 = computed(() => {
+  if (AppStore.themeColor) {
+    return `rgba(${extractRgbFromRgba(hexToRgb(AppStore.themeColor)).join(',')}, 0.8)`
+  }
+})
+const colorCpt2 = computed(
+  () =>
+    `rgba(${extractRgbFromRgba(hexToRgb(AppStore.themeColor)).join(',')}, 0.6)`,
+)
 const initChart = () => {
   echarts.dispose(ref_chart.value)
   const chart = echarts.init(ref_chart.value)
@@ -91,7 +104,7 @@ const initChart = () => {
         type: 'bar',
         data: props.data.map((v) => v.solvingCount || 0),
         itemStyle: {
-          color: 'rgba(211, 73, 71, 1)',
+          color: colorCpt1.value,
         },
       },
       {
@@ -100,7 +113,7 @@ const initChart = () => {
         type: 'bar',
         data: props.data.map((v) => Math.abs(v.unSolvingCount) || 0),
         itemStyle: {
-          color: 'rgba(2, 50, 112, 1)',
+          color: colorCpt2.value,
         },
       },
     ],
@@ -115,7 +128,7 @@ const initChart = () => {
   return chart
 }
 watch(
-  () => props.data,
+  () => [props.data, AppStore.themeColor],
   () => {
     state.chart = initChart()
   },