添加logo

src/components/HomePage.vue

@@ -3,8 +3,11 @@
     <div class="box-1">
       <div class="inner-box left-box">
         <div class="box-icon" @click="goToManagementInterface">
-          <el-icon class="left-icon"><HomeFilled /></el-icon>
-           <span>{{ platformTitle }}</span>
+          <div class="app-header">
+            <img :src="LogoImage" alt="Logo" class="app-logo" />
+           <el-icon class="left-icon"><HomeFilled /></el-icon>
+            <span>{{ platformTitle }}</span>
+          </div>
         </div>
         <div class="dropdown-box">
           <!-- 下拉菜单 -->
@@ -87,6 +90,7 @@ import { ClassList } from '@/api/class.js'
 import {ArrowUpBold, ArrowDownBold, HomeFilled} from '@element-plus/icons-vue'
 import { ElMessage } from 'element-plus'
 import UserInfoPopover from '@/components/user/UserInfoPopover.vue'
+import LogoImage from '@/assets/images/logo.png'
 
 
 // 导入图片
@@ -355,14 +359,41 @@ window.updateTenantName = (newName) => {
   font-size: rpx(16); // 默认字体大小
 }
 
-.left-box {
-  position: relative;
-  justify-content: flex-start;
+.inner-box.left-box {
+  display: flex;
   align-items: center;
+  justify-content: space-between;
+  padding: 0 rpx(20);
+}
+
+.left-icon{
+  font-size: rpx(14);
+  color: white;
+  cursor: pointer;
+}
+
+.app-header {
+  width: 100%;
+  height: rpx(30);
   display: flex;
-  flex: 1;
-  padding-left: rpx(30);
-    cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  gap: rpx(5);
+}
+
+.app-logo {
+  width: rpx(20);
+  height: rpx(20);
+  object-fit: contain;
+}
+
+.app-header span {
+  color: white;
+  font-size: rpx(11);
+  letter-spacing: rpx(1);
+  display: flex;
+  align-items: center;
+  height: 100%;
 }
 
 .left-box span {

src/views/Login.vue

@@ -9,7 +9,10 @@
     <!-- 登录输入框 -->
     <div class="login-wrapper">
       <div class="login-input">
-        <span>{{ appTitle }}</span>
+        <div class="app-header">
+          <img :src="LogoImage" alt="Logo" class="app-logo" />
+          <span>{{ appTitle }}</span>
+        </div>
         <el-form
             ref="loginFormRef"
             :model="loginData.loginForm"
@@ -101,6 +104,7 @@ import { HomeFilled, Avatar, Lock, Iphone } from '@element-plus/icons-vue'
 import { ElMessage } from 'element-plus'
 
 import BGImages from '@/assets/images/homeBG.png'
+import LogoImage from '@/assets/images/logo.png'
 import {
   createLoginData,
   createVerificationCodeLogic,
@@ -248,11 +252,28 @@ onMounted(() => {
   flex-direction: column; // 子元素垂直排列
   text-align: center; // 文本居中
 }
-.login-input span{
+.app-header {
+  width: 100%;
+  height: rpx(30);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: rpx(5);
+  margin-bottom: rpx(10);
+}
+.app-logo {
+  width: rpx(20);
+  height: rpx(20);
+  object-fit: contain;
+}
+
+.app-header span{
   color: white;
   font-size: rpx(11);
-  padding-bottom: rpx(5);
   letter-spacing: rpx(1);
+  display: flex;
+  align-items: center;
+  height: 100%;
 }
 .input-item {
   display: flex;
@@ -399,11 +420,25 @@ onMounted(() => {
     justify-content: center;
   }
   
-  .login-input span {
-    font-size: rpx(18);
-    padding-bottom: rpx(20);
+  .app-header {
+    height: rpx(50);
+    gap: rpx(10);
+  }
+  
+  .app-logo {
+    width: rpx(40);
+    height: rpx(40);
+  }
+  
+  .app-header span {
+    font-size: rpx(25);
+    letter-spacing: rpx(2);
+    display: flex;
+    align-items: center;
+    height: 100%;
   }
   
+  
   .input-item {
     width: 100%;
     align-items: stretch;
@@ -447,12 +482,12 @@ onMounted(() => {
   }
   
   .check-box .register-link {
-    font-size: rpx(12) !important;
+    font-size: rpx(16) !important;
     margin-right: rpx(15) !important;
   }
   
   .el-checkbox ::v-deep(.el-checkbox__label) {
-    font-size: rpx(12) !important;
+    font-size: rpx(16) !important;
   }
   
   .sms-code-container {

src/views/ManagementInterface.vue

@@ -2,7 +2,10 @@
   <div class="home-container">
     <div class="box-1">
       <div class="inner-box left-box">
-        <span>{{ platformTitle }}</span>
+        <div class="app-header">
+          <img :src="LogoImage" alt="Logo" class="app-logo" />
+          <span>{{ platformTitle }}</span>
+        </div>
       </div>
       <div class="inner-box right-box">
         <div class="top-right-box">
@@ -78,6 +81,8 @@ import { Message } from '@/utils/message/Message.js'
 import { DArrowRight } from '@element-plus/icons-vue'
 
 // 背景图
+// Logo
+import LogoImage from '@/assets/images/logo.png'
 // 启蒙课
 import enlightenment from '@/assets/manage/enlightenment.png'
 // 编程课
@@ -285,13 +290,28 @@ window.updateTenantName = (newName) => {
   cursor: pointer;
 }
 
-.left-box span {
-  position: static;
-  margin-top: 0;
-  margin-left: 0;
-  margin-right: rpx(10);
-  font-size: rpx(11);
+.app-header {
+  width: 100%;
+  height: rpx(30);
+  display: flex;
+  align-items: center;
+  gap: rpx(5);
+}
+
+.app-logo {
+  width: rpx(20);
+  height: rpx(20);
+  object-fit: contain;
+}
+
+.app-header span {
   color: white;
+  font-size: rpx(11);
+  letter-spacing: rpx(1);
+  display: flex;
+  align-items: center;
+  height: 100%;
+  margin-right: rpx(10);
   max-width: rpx(200);
   white-space: normal;
   line-height: rpx(16);

src/views/laboratory/ExperimentalTheme.vue

@@ -7,8 +7,11 @@
           <div class="top-left-inner-box" >
             <!-- 左侧返回图标 -->
             <div class="left-content-wrapper" @click="goToHomePage">
-              <el-icon class="left-icon"><HomeFilled /></el-icon>
-              <span class="left-text">{{ platformTitle }}</span>
+              <div class="app-header">
+                <img :src="LogoImage" alt="Logo" class="app-logo" />
+                <el-icon class="left-icon"><HomeFilled /></el-icon>
+                <span class="left-text">{{ platformTitle }}</span>
+              </div>
             </div>
           </div>
         </div>
@@ -101,6 +104,7 @@ import leftbtn from '@/assets/programming/leftbtn.png'
 import rightbtn from '@/assets/programming/rightbtn.png'
 // 导入用户信息组件
 import UserInfoPopover from '@/components/user/UserInfoPopover.vue'
+import LogoImage from '@/assets/images/logo.png'
 // 退出登录
 import { removeLocalStorageKey} from '@/utils/loginUtils.js'
 // 实验课主题接口
@@ -347,14 +351,13 @@ onUnmounted(() => {
   .left-content-wrapper{
     display: flex;
     align-items: center; /* 保持内部元素垂直居中 */
-    padding-left: rpx(15);
+    padding-left: rpx(20);
     padding-top: rpx(15);
     gap: rpx(5);
   }
   .left-icon{
     font-size: rpx(14);
     color: white;
-    padding-left: rpx(20);
     cursor: pointer;
   }
   .left-text{
@@ -370,6 +373,30 @@ onUnmounted(() => {
     line-height: rpx(16);
     text-align: left;
   }
+
+.app-header {
+  width: 100%;
+  height: rpx(30);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: rpx(5);
+}
+
+.app-logo {
+  width: rpx(20);
+  height: rpx(20);
+  object-fit: contain;
+}
+
+.app-header span {
+  color: white;
+  font-size: rpx(11);
+  letter-spacing: rpx(1);
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
 }
 
 .top-right-inner-box{

src/views/programming/ProgrammingGame.vue

@@ -7,8 +7,11 @@
           <div class="top-left-inner-box" >
             <!-- 左侧返回图标 -->
             <div class="left-content-wrapper" @click="goToHomePage">
-              <el-icon class="left-icon"><HomeFilled /></el-icon>
-              <span class="left-text">{{ platformTitle }}</span>
+              <div class="app-header">
+                <img :src="LogoImage" alt="Logo" class="app-logo" />
+                <el-icon class="left-icon"><HomeFilled /></el-icon>
+                <span class="left-text">{{ platformTitle }}</span>
+              </div>
             </div>
           </div>
         </div>
@@ -83,6 +86,7 @@ import { getThemeList } from '@/api/programming/index.js'
 // 导入按钮图片
 import leftbtn from '@/assets/programming/leftbtn.png'
 import rightbtn from '@/assets/programming/rightbtn.png'
+import LogoImage from '@/assets/images/logo.png'
 
 // 导入用户信息组件
 import UserInfoPopover from '@/components/user/UserInfoPopover.vue'
@@ -317,7 +321,7 @@ onMounted(() => {
   display: flex;
   align-items: center; /* 垂直居中对齐 */
   .left-content-wrapper{
-    padding-left: rpx(15);
+    padding-left: rpx(20);
     padding-top: rpx(15);
     gap: rpx(5);
     display: flex;
@@ -326,7 +330,6 @@ onMounted(() => {
   .left-icon{
     font-size: rpx(14);
     color: white;
-    padding-left: rpx(20);
     cursor: pointer;
   }
   .left-text{
@@ -342,6 +345,30 @@ onMounted(() => {
     text-align: left;
     cursor: pointer;
   }
+
+.app-header {
+  width: 100%;
+  height: rpx(30);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: rpx(5);
+}
+
+.app-logo {
+  width: rpx(20);
+  height: rpx(20);
+  object-fit: contain;
+}
+
+.app-header span {
+  color: white;
+  font-size: rpx(11);
+  letter-spacing: rpx(1);
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
 }
 
 .top-right-inner-box{