diff --git a/src/Layout/main/index.vue b/src/Layout/main/index.vue
index 5c79980..077b17b 100644
--- a/src/Layout/main/index.vue
+++ b/src/Layout/main/index.vue
@@ -5,17 +5,25 @@
     </transition>
   </section> -->
   <div class="view-container">
-    <div class="banner"></div>
+    <div class="banner">
+      <img src="../../assets/images/banner4.jpg" alt="">
+      <div class="source-box">
+        <div class="source">
+          开源智慧教程管理系统
+        </div>
+        <div class="describe">首次开源</div>
+      </div>
+    </div>
     <div class="container"> <router-view></router-view></div>
   </div>
- 
+
 </template>
 
 <script lang="ts" setup>
-import {} from 'vue'
-import {useRoute } from 'vue-router'
+import { } from 'vue'
+import { useRoute } from 'vue-router'
 const $route = useRoute()
-console.log( $route);
+console.log($route);
 
 
 </script>
diff --git a/src/Layout/tabbar/index.vue b/src/Layout/tabbar/index.vue
index 4499e59..8cf8848 100644
--- a/src/Layout/tabbar/index.vue
+++ b/src/Layout/tabbar/index.vue
@@ -1,16 +1,15 @@
 <template>
   <div :class="!flog ? 'tabbar' : 'tabbar-active'">
     <div class="container">
-      <div class="logo">LOGO</div>
+      <div class="logo-box">
+        <div class="logo"><img src="../../assets/images/LOGO.png"></div>
+        <div class="lesson">课图</div>
+      </div>
+
       <div class="menu">
         <ul>
-          <li
-            :class="{ active: settingStore.useIndex === index }"
-            v-for="(item, index) in constRouter[0].children"
-            v-show="!item.meta.hidden"
-            :key="item.path"
-            @click="goToRouter(item, index)"
-          >
+          <li :class="{ active: settingStore.useIndex === index }" v-for="(item, index) in constRouter[0].children"
+            v-show="!item.meta.hidden" :key="item.path" @click="goToRouter(item, index)">
             <div>{{ item.meta.title }}</div>
           </li>
         </ul>
@@ -49,6 +48,27 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
+.logo-box {
+  display: flex;
+  align-items: center;
+  column-gap: 20px;
+
+  .logo {
+    width: 50px;
+
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .lesson {
+    font-size: 30px;
+    font-weight: bolder;
+    color: #fff;
+  }
+}
+
 .tabbar {
   position: fixed;
   top: 0;
@@ -58,6 +78,7 @@ onMounted(() => {
   animation-duration: 0.3s;
   animation-name: tabber-to;
 }
+
 .tabbar-active {
   position: fixed;
   top: 0;
@@ -69,26 +90,31 @@ onMounted(() => {
   z-index: 999;
   box-shadow: 0px 0px 43px rgba(0, 0, 0, 0.2);
 }
+
 @keyframes tabber {
   0% {
     // transform: translateY(-120px);
     background-color: transparent;
   }
+
   100% {
     // transform: translateY(0);
     background-color: #6da0ff;
   }
 }
+
 @keyframes tabber-to {
   0% {
     // transform: translateY(-120px);
     background-color: #6da0ff;
   }
+
   100% {
     // transform: translateY(0);
     background-color: transparent;
   }
 }
+
 .container {
   height: 100%;
   display: flex;
@@ -96,15 +122,18 @@ onMounted(() => {
   justify-content: space-between;
   margin: 0 auto;
   width: $base-container-width;
+
   .menu {
     position: relative;
     padding: 0 20px;
     height: 100%;
     display: flex;
     align-items: center;
+
     ul {
       display: flex;
       align-items: center;
+
       li {
         padding: 12px 20px;
         color: #ffffff;
@@ -113,10 +142,12 @@ onMounted(() => {
         transition: all 0.2s;
         position: relative;
       }
+
       li:hover {
         color: #7aa4ff;
         transform: translateY(-5px);
       }
+
       .active::before {
         content: ' ';
         display: block;
@@ -130,12 +161,14 @@ onMounted(() => {
         background-color: #fff;
       }
     }
+
     .entry {
       position: absolute;
       top: 5px;
       right: 30px;
       display: flex;
       align-content: center;
+
       div {
         // padding: 5px;
         margin: 5px;
@@ -146,13 +179,15 @@ onMounted(() => {
         font-size: 14px;
         cursor: pointer;
       }
+
       div:last-child {
         border-right: none;
       }
     }
   }
+
   .logo {
-    height: 100%;
+    // height: 100%;
     display: flex;
     align-items: center;
   }
diff --git a/src/assets/icons/Praise.svg b/src/assets/icons/Praise.svg
new file mode 100644
index 0000000..5b1a75a
--- /dev/null
+++ b/src/assets/icons/Praise.svg
@@ -0,0 +1 @@
+<svg t="1724122358377" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3617" width="200" height="200"><path d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667zM544.256 149.333333c39.253333 0 59.498667 36.48 49.888 84.928-7.573333 38.144-21.984 104.426667-43.221333 198.666667-4.512 20.021333 10.56 39.093333 30.912 39.093333h218.666666c6.101333 0 12.16 1.066667 17.909334 3.168 27.445333 9.984 41.674667 40.554667 31.776 68.266667l-85.568 239.573333C744.981333 838.026667 693.301333 874.666667 635.402667 874.666667H223.498667C194.314667 874.666667 170.666667 850.784 170.666667 821.333333V503.498667c0-17.866667 14.144-32.448 31.829333-32.821334l21.866667-0.469333a221.12 221.12 0 0 0 167.381333-82.56c34.346667-42.602667 59.146667-99.306667 74.869333-169.877333C482.101333 166.336 499.552 149.333333 544.266667 149.333333z" fill="#000000" p-id="3618"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/PraiseFilled.svg b/src/assets/icons/PraiseFilled.svg
new file mode 100644
index 0000000..e9d6355
--- /dev/null
+++ b/src/assets/icons/PraiseFilled.svg
@@ -0,0 +1 @@
+<svg t="1724122458872" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3764" width="200" height="200"><path d="M621.674667 408.021333c16.618667-74.24 28.224-127.936 34.837333-161.194666C673.152 163.093333 629.941333 85.333333 544.298667 85.333333c-77.226667 0-116.010667 38.378667-138.88 115.093334l-0.586667 2.24c-13.728 62.058667-34.72 110.165333-62.506667 144.586666a158.261333 158.261333 0 0 1-119.733333 58.965334l-21.909333 0.469333C148.437333 407.808 106.666667 450.816 106.666667 503.498667V821.333333c0 64.8 52.106667 117.333333 116.394666 117.333334h412.522667c84.736 0 160.373333-53.568 189.12-133.92l85.696-239.584c21.802667-60.96-9.536-128.202667-70.005333-150.186667a115.552 115.552 0 0 0-39.488-6.954667H621.674667z" fill="#000000" p-id="3765"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/Star.svg b/src/assets/icons/Star.svg
new file mode 100644
index 0000000..a7cbda5
--- /dev/null
+++ b/src/assets/icons/Star.svg
@@ -0,0 +1 @@
+<svg t="1724122125952" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2618" width="200" height="200"><path d="M335.008 916.629333c-35.914667 22.314667-82.88 10.773333-104.693333-25.557333a77.333333 77.333333 0 0 1-8.96-57.429333l46.485333-198.24a13.141333 13.141333 0 0 0-4.021333-12.864l-152.16-132.586667c-31.605333-27.52-35.253333-75.648-8.234667-107.733333a75.68 75.68 0 0 1 51.733333-26.752L354.848 339.2c4.352-0.362667 8.245333-3.232 10.026667-7.594667l76.938666-188.170666c16.032-39.2 60.618667-57.92 99.52-41.461334a76.309333 76.309333 0 0 1 40.832 41.461334l76.938667 188.16c1.781333 4.373333 5.674667 7.253333 10.026667 7.605333l199.712 16.277333c41.877333 3.413333 72.885333 40.458667 69.568 82.517334a76.938667 76.938667 0 0 1-26.08 51.978666l-152.16 132.586667c-3.541333 3.082667-5.141333 8.074667-4.021334 12.853333l46.485334 198.24c9.621333 41.013333-15.36 82.336-56.138667 92.224a75.285333 75.285333 0 0 1-57.525333-9.237333l-170.976-106.24a11.296 11.296 0 0 0-12.010667 0l-170.986667 106.24zM551.786667 756.032l170.976 106.24c2.624 1.621333 5.717333 2.122667 8.650666 1.408 6.410667-1.557333 10.56-8.426667 8.928-15.424l-46.485333-198.24a77.141333 77.141333 0 0 1 24.277333-75.733333L870.293333 441.706667c2.485333-2.165333 4.053333-5.312 4.330667-8.746667 0.565333-7.136-4.490667-13.173333-10.976-13.696l-199.712-16.288a75.989333 75.989333 0 0 1-64.064-47.168l-76.938667-188.16a12.309333 12.309333 0 0 0-6.538666-6.741333c-5.898667-2.496-12.725333 0.373333-15.328 6.741333l-76.949334 188.16a75.989333 75.989333 0 0 1-64.064 47.168l-199.701333 16.288a11.68 11.68 0 0 0-7.978667 4.181333 13.226667 13.226667 0 0 0 1.333334 18.261334l152.16 132.586666a77.141333 77.141333 0 0 1 24.277333 75.733334l-46.485333 198.229333a13.333333 13.333333 0 0 0 1.514666 9.877333c3.488 5.792 10.581333 7.530667 16.064 4.128l170.986667-106.229333a75.296 75.296 0 0 1 79.562667 0z" fill="#000000" p-id="2619"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/StarFilled.svg b/src/assets/icons/StarFilled.svg
new file mode 100644
index 0000000..17aace7
--- /dev/null
+++ b/src/assets/icons/StarFilled.svg
@@ -0,0 +1 @@
+<svg t="1724123981118" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4740" width="200" height="200"><path d="M335.008 916.629333c-35.914667 22.314667-82.88 10.773333-104.693333-25.557333a77.333333 77.333333 0 0 1-8.96-57.429333l46.485333-198.24a13.141333 13.141333 0 0 0-4.021333-12.864l-152.16-132.586667c-31.605333-27.52-35.253333-75.648-8.234667-107.733333a75.68 75.68 0 0 1 51.733333-26.752L354.848 339.2c4.352-0.362667 8.245333-3.232 10.026667-7.594667l76.938666-188.170666c16.032-39.2 60.618667-57.92 99.52-41.461334a76.309333 76.309333 0 0 1 40.832 41.461334l76.938667 188.16c1.781333 4.373333 5.674667 7.253333 10.026667 7.605333l199.712 16.277333c41.877333 3.413333 72.885333 40.458667 69.568 82.517334a76.938667 76.938667 0 0 1-26.08 51.978666l-152.16 132.586667c-3.541333 3.082667-5.141333 8.074667-4.021334 12.853333l46.485334 198.24c9.621333 41.013333-15.36 82.336-56.138667 92.224a75.285333 75.285333 0 0 1-57.525333-9.237333l-170.976-106.24a11.296 11.296 0 0 0-12.010667 0l-170.986667 106.24z" fill="#000000" p-id="4741"></path></svg>
\ No newline at end of file
diff --git a/src/assets/images/LOGO.png b/src/assets/images/LOGO.png
new file mode 100644
index 0000000..e1c477a
Binary files /dev/null and b/src/assets/images/LOGO.png differ
diff --git a/src/assets/images/banner3.jpg b/src/assets/images/banner3.jpg
new file mode 100644
index 0000000..7ea7c82
Binary files /dev/null and b/src/assets/images/banner3.jpg differ
diff --git a/src/assets/images/banner4.jpg b/src/assets/images/banner4.jpg
new file mode 100644
index 0000000..c528899
Binary files /dev/null and b/src/assets/images/banner4.jpg differ
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 218a89c..bd36cad 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -1,14 +1,41 @@
 // 引入清除浏览器默认样式文件
 @import './reset.scss';
-.banner{
-    width: 100%;
-    height: 410px;
-    background: url('../assets/images/banner2.png') no-repeat;
-    background-size: cover
+
+.banner {
+  width: 100%;
+  height: 410px;
+  // background: url('../assets/images/banner4.jpg') no-repeat;
+  // background-size: cover
+  position: relative;
+
+  .source-box {
+    position: absolute;
+    top: 50%;
+    left: 180px;
+
+    .source {
+      font-size: 66px;
+      font-weight: bolder;
+    }
+
+    .describe {
+      margin: auto;
+      margin-top: 20px;
+      text-align: center;
+      padding: 10px 20px;
+      width: fit-content;
+      background-color: #6da0ff;
+      font-size: 30px;
+      font-weight: bolder;
+      color: #fff;
+    }
   }
-  /* 设置滚动条的宽度和颜色 */
+}
+
+/* 设置滚动条的宽度和颜色 */
 ::-webkit-scrollbar {
-  width: 10px; /* 滚动条宽度 */
+  width: 10px;
+  /* 滚动条宽度 */
 }
 
 /* 设置滚动条的轨道背景色 */
@@ -24,15 +51,17 @@
 /* 设置滚动条的滑块样式 */
 ::-webkit-scrollbar-thumb {
   background-color: #bfbfbf;
-  border-radius: 5px; /* 滑块圆角 */
+  border-radius: 5px;
+  /* 滑块圆角 */
 }
 
 /* 设置滑块在hover状态下的样式 */
 ::-webkit-scrollbar-thumb:hover {
   background-color: #999999;
 }
-.scene-tooltip{
+
+.scene-tooltip {
   color: #6da0ff !important;
   font-weight: 700;
   opacity: .5;
-}
+}
\ No newline at end of file
diff --git a/src/views/professionalListProfile/index.vue b/src/views/professionalListProfile/index.vue
index 44e115a..af044f0 100644
--- a/src/views/professionalListProfile/index.vue
+++ b/src/views/professionalListProfile/index.vue
@@ -1,22 +1,29 @@
 <script setup lang="ts">
-// import {} from 'vue';
-
-// const params = ref({
-//   pageNo: 1,
-//   pageSize: 7,
-//   // username: 'qiuqiu',
-//   userId: userStore.data.id,
-//   assessmenttype: '',
-//   category: '',
-//   nature: '',
-//   teacher: '',
-// })
+import { ref } from 'vue';
+
+const paginationData = ref({
+    pageNo: 1,
+    pageSize: 7,
+    total: 7
+})
+function paginationChange(currentPage: number, pageSize: number) {
+
+}
+
+// 临时的，有接口后使用接口数据
+const isPraise = ref(true)
+const isStar = ref(true)
+function handlePraise() {
+    isPraise.value = !isPraise.value
+}
+function handleStar() {
+    isStar.value = !isStar.value
+}
 </script>
 
 <template>
     <div class="view-container">
-        <div class="banner"></div>
-        <div class="container">
+        <div class="container" style="padding-bottom: 20px;">
 
             <div class="main-content" v-loading="0">
                 <div class="header">
@@ -29,20 +36,34 @@
                                             <Plus />
                                         </el-icon>
                                     </div>
-                                    <h2 class="course_name">course_name</h2>
+                                    <h2 class="course_name">点击添加课程</h2>
                                 </li>
                                 <li v-for="item in 7" :key="item">
                                     <img title="点击查看课程详情" :src="''" alt="" @click="" />
                                     <h2 title="点击查看课程基本信息" class="course_name" @click="">
-                                        item.name
+                                        软件项目管理
                                     </h2>
-                                    <p class="teacher_name">讲师：item.teacher</p>
+                                    <p class="teacher_name">讲师：肖海南</p>
                                     <p class="credit">
-                                        <span>item.classhours</span>
+                                        <span>4</span>
                                         学时 |
-                                        <span>item.credit</span>
+                                        <span>4</span>
                                         学分
                                     </p>
+
+                                    <div class="parent">
+                                        <div class="div1" @click="handlePraise">
+                                            <SvgIcon v-if="isPraise" width="12px" height="12px" name="Praise"></SvgIcon>
+                                            <SvgIcon v-else width="12px" height="12px" name="PraiseFilled"
+                                                color="#f7ba2a"></SvgIcon>
+                                        </div>
+                                        <div class="div2" @click="handleStar">
+                                            <SvgIcon v-if="isStar" width="12px" height="12px" name="Star"></SvgIcon>
+                                            <SvgIcon v-else width="12px" height="12px" name="StarFilled"
+                                                color="#f7ba2a"></SvgIcon>
+                                        </div>
+
+                                    </div>
                                     <el-icon class="del" @click="">
                                         <Delete />
                                     </el-icon>
@@ -55,16 +76,40 @@
                     </div>
                 </div>
             </div>
-            <!-- <el-pagination v-model:current-page="params.pageNo" v-model:page-size="params.pageSize"
+            <el-pagination v-model:current-page="paginationData.pageNo" v-model:page-size="paginationData.pageSize"
                 :page-sizes="[2, 5, 7, 10]" :background="true" layout="jumper,total, sizes, prev, pager, next "
-                :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange"
-                style="margin-top: 10px; justify-content: center" /> -->
+                :total="paginationData.total" @change="paginationChange"
+                style="margin-top: 10px; justify-content: center" />
 
         </div>
     </div>
 </template>
 
 <style lang="scss" scoped>
+.parent {
+    display: grid;
+    grid-template-columns: repeat(2, 1fr);
+    grid-template-rows: 1fr;
+    grid-column-gap: 5px;
+    grid-row-gap: 0px;
+    position: absolute;
+    margin-left: 245px;
+    margin-top: -80px;
+    color: #0052ff;
+    cursor: pointer;
+
+    .div1 {
+        grid-area: 1 / 1 / 2 / 2;
+    }
+
+    .div2 {
+        grid-area: 1 / 2 / 2 / 3;
+    }
+}
+
+
+
+
 .main-content {
     width: 1440px;
     margin: 0 auto;
@@ -123,7 +168,6 @@
     li {
         margin: 40px 0;
         width: 349px;
-        width: 100%;
         height: 297px;
         background: rgb(255, 255, 255);
         transition: all 0.5s;