首页骨架 css样式

src/components/pageTopBar/pageTopBar.vue

@@ -10,11 +10,13 @@
             {{
               item.name }}</div>
           <div class="user-box">
-            <img src="" class="user-img" alt="">
+            <img :src="user.data.avatar" class="user-img" alt="">
             <div class="user-out-box">
               <div class="box-bg dis-f jus-x">
                 <div class="top-box"></div>
-                退出
+                <a :href="quitUrl" style="color: #fff;">
+                  退出
+                </a>
               </div>
             </div>
           </div>
@@ -29,9 +31,9 @@
       <div class="dis-f jus-x al-item" style="margin-top:20px;" v-if="routePath === '/'">
         <div class="body-maxWidth">
           <el-carousel :interval="5000" arrow="always" height="330" style="height:330px;">
-            <el-carousel-item v-for="item in 4" :key="item">
+            <el-carousel-item v-for="item in bannerLists.data" :key="item.feedId">
               <div style="width:100%;height:100%;" class="dis-f jus-x al-item">
-                <img class="carousel-img" src="../../assets/homeImage/carousel.svg" alt="">
+                <img class="carousel-img" :src="item.imageurl" alt="">
               </div>
             </el-carousel-item>
           </el-carousel>
@@ -56,12 +58,31 @@
 <script setup>
 import store from '../../store/index';
 import { useRoute, useRouter } from 'vue-router'
-import { reactive, watchEffect, ref } from "vue";
+import { reactive, watchEffect, ref,defineProps } from "vue";
+
+const props=defineProps({
+  bannerList:{
+    type:Array,
+    default:function (){
+      return []
+    }
+  }
+})
+
+//退出登录
+let url = location.href
+let quitUrl = ref(`https://passport.gter.net/login/quit?referer=${url}`)
+//个人信息
+let user = reactive({data:{}})
 //组件数据
 let topTab = reactive({ data: [] })
 let seachTab = reactive({ data: [] })
+let bannerLists = reactive({data:[]})
+
 watchEffect(() => {
-  console.log(store.state.indexData.menu)
+  user.data=store.state.user
+  bannerLists.data=props.bannerList
+  console.log(bannerLists.data)
   if (!store.state.indexData.menu) return
   store.state.indexData.menu.map(res => {
     if (res.name === '首页') {
@@ -192,7 +213,7 @@ tabBtnType.value = route.path
 .top-bg-img-box .user-img {
   width: 32px;
   height: 32px;
-  border-radius: 16rpx;
+  border-radius: 50%;
 }
 
 .top-bg-img-box .info-box .logo-box {