修改页面

src/components/botPage.vue

@@ -7,9 +7,9 @@
 
         <div class="hotAppBlo" >
             <div class="BigBlo" v-for="(k,ind) in hotApp" :key="ind+'p'" >
-                <div :class="['conBlock',ind % 2 == 0 ? 'conBlock1':'conBlock2']">
-                    <div class="conBlockOne" @click="openNewWindow(k[0])" :class="[ind % 2 == 0 ? 'conW1':'conW2']">
-                        <div class="conBlockTwo" :style="{bottom : ind % 2 == 0 ? '':'16px'}">
+                <div class="conBlock">
+                    <div class="conBlockOne conW1" @click="openNewWindow(k[0])" >
+                        <div class="conBlockTwo">
                             <img class="appImg" :src="JSON.parse(k[0].json).icon" alt="">
                             <div class="con">
                                 <div class="tit">{{ k[0].name }}</div>
@@ -26,8 +26,9 @@
                         <img class="hg" style="width: 20px;" src="../assets/img/hg1.svg" alt="">
                     </div>
 
-                    <div style="display: flex;" :class="[ind % 2 == 0 ? 'conBlock2':'conBlock1']">
-                        <div v-for="(item,index) in list(k)" class="tabCon" @click="openNewWindow(item)"  :key="index">
+                    <div style="display: flex;" class="conBlock2">
+                        <div v-for="(item,index) in list(k)" 
+                        class="tabCon" @click="openNewWindow(item)"  :key="index">
                                 <div style="display: flex;flex-direction: column; gap: 12px;">
                                     <img class="appImg" :src="JSON.parse(item.json).icon" alt="">
                                     <div class="con">
@@ -69,11 +70,11 @@
         :before-close="handleClose">
             <div v-loading="loading" style="display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 16px;">
                 <div v-for="(item,index) in moreList" 
-                class="tabCon" @click="openNewWindow(item)"  
-                :key="index" style="min-width: 308px;border: 1px #e7e7e7 solid;">
-                        <div>
-                            <img class="appImg" :src="JSON.parse(item.json).icon" alt="">
-                            <div class="con">
+                class="tabConDia" @click="openNewWindow(item)"  
+                :key="index" >
+                        <div style="display: flex;align-items: center;">
+                            <img class="appImg"  :src="JSON.parse(item.json).icon" alt="">
+                            <div class="con" style="height: auto;">
                                 <div class="tit">{{ item.name }}</div>
                                 <div class="bri">
                                     <el-tooltip class="item" effect="light" :content="item.detail" placement="bottom">
@@ -83,8 +84,7 @@
                                     </el-tooltip>
                                 </div>
                             </div>
-                            
-                    </div>
+                        </div>
                     <img class="hg" style="width: 20px;" v-if="index == 0" src="../assets/img/hg1.svg" alt="">
                     <img class="hg" style="width: 20px;" v-if="index == 1" src="../assets/img/hg2.svg" alt="">
                     <img class="hg" style="width: 20px;" v-if="index == 2" src="../assets/img/hg3.svg" alt="">
@@ -106,7 +106,7 @@ import { mapGetters } from 'vuex';
             ...mapGetters(['userinfo']),
             list(){
                 return function(val) {
-                    console.log(val);
+                    // console.log(val);
                     let newArr = val.slice(1)
                     return newArr
                 }
@@ -173,11 +173,10 @@ import { mapGetters } from 'vuex';
 
 <style scoped>
 .hotAppBlo{
-    /* display: grid;
+    display: grid;
     grid-template-columns: repeat(4, 1fr);
-    gap: 5%; 网格间距 */
-    display: flex;
-    justify-content: space-between;
+    gap: 20px;
+    
 }
 .BigBlo{
     background-color: #EFEFEF;
@@ -193,14 +192,11 @@ import { mapGetters } from 'vuex';
     border-radius: 10px;
     height: calc(100% - 20px);
     gap: 10px;
-}
-.conBlock1{
-    flex: 1;
     flex-direction: column;
     justify-content: space-around;
-    gap: 10px;
 }
 
+
 .AppBri{
     font-family: PingFang SC;
     font-weight: 600;
@@ -221,7 +217,7 @@ import { mapGetters } from 'vuex';
 .conBlockOne{
     background-color: #fff;
     border-radius: 10px;
-    padding: 16px;
+    padding: 26px 14px;
     box-sizing: border-box;
     position: relative;
     overflow: hidden;
@@ -235,11 +231,12 @@ import { mapGetters } from 'vuex';
     box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 }
 .conBlockTwo{
-    width: 91px;
+    width: 100%;
     height: 90px;
+    box-sizing: border-box;
     display: flex;
     flex-direction: column;
-    position: absolute;
+    margin-top: auto; /* 将子元素推到底部 */
     gap: 12px;
 }
 
@@ -267,17 +264,10 @@ import { mapGetters } from 'vuex';
 }
 .conW1{
     /* height: 100%; */
+  
     width: 100%;
     height: 50%;
-    min-width: 100px;
     min-height: 100px;
-    justify-content: flex-start;
-}
-.conW2{
-    height: 100%;
-    width: 7vw;
-    min-width: 100px;
-    justify-content: flex-end !important;
 }
 
 .tabCon{
@@ -285,16 +275,27 @@ import { mapGetters } from 'vuex';
     border-radius: 10px;
     cursor: pointer;
     display: flex;
-    width: 7vw;
-    height: 7vw;
-    min-width: 100px;
-    min-height: 100px;
+    width: 50%;
+    height: 100%;
+    min-height: 115px;
     background: #fff;
     padding: 26px 14px;
     box-sizing: border-box;
     position: relative;
     overflow: hidden;
 }
+.tabConDia{
+    border-radius: 10px;
+    cursor: pointer;
+    display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    min-height: 80px;
+    background: #fff;
+    padding: 15px;
+    box-sizing: border-box;
+    position: relative;
+    overflow: hidden;
+    min-width: 308px;border: 1px #e7e7e7 solid;
+}
 
 .tabCon:hover{
     transform: translateY(-5px); /* 向上位移 */
@@ -315,11 +316,13 @@ import { mapGetters } from 'vuex';
     height: 54px;
     justify-content: flex-end;
 }
+
 .appImg{
     width: 32px;
     height: 32px;
     border-radius: 50%;
     object-fit: cover;
+    margin-right: 10px;
 }
 .tit{
     color: #000000;
@@ -344,8 +347,6 @@ import { mapGetters } from 'vuex';
     font-weight: 300;
     font-size: 10px;
     line-height: 12px;
-    letter-spacing: 0%;
-
 }
 
 

src/components/sidebarL.vue

@@ -21,36 +21,35 @@
                     :key="index+1">
 
                     <!-- 渲染菜单类型 -->
-                     <div class="ulTOne" v-if="item.menuName">
-                        <el-popover
-                            placement="right"
-                            :append-to-body="false"
-                            trigger="hover"
-                            >
-                                <div class="ulTCopy" >
-                                    <div class="ulTCopyTit">
-                                        {{ item.menuName }}
-                                    </div>
-                                    <div class="ulTCopyHei">
-                                        <div class="ulTCopyTxt"  
-                                        v-for="(i,ind) in appSignL(item.children)"
-                                            @click="levTwo(i,ind,index)" :key="ind+'a'">
-                                                <div class="ulTCopyConT" 
-                                                :style="{background : (activeLTwo === index+1 +'+' + ind)? '#0663FE' : '',color:(activeLTwo === index+1 +'+' + ind)? '#fff' : '#000000E5'}"
-                                                v-for="(p,pin) in AppCon(i.url)" :key="pin+'p'">
-                                                        {{ p.name }}
-                                                </div>
-                                        </div>
-                                    </div>
+                     <div class="ulTOne TwoBar" v-if="item.menuName">
+                          <!-- 二级导航 -->
+                        <transition name="slide">
+                            <div class="ulTCopy2">
+                                <div class="ulTCopyTit">
+                                    <span>{{ item.menuName }}</span>
                                 </div>
-                            <div slot="reference" class="menu_left">
-                                <div class="iconW">
-                                    <img :src="activeL === (index +1) ? item.menuActiveIcon : item.menuIcon" class="logo" alt="">
+                                <div class="ulTCopyHei">
+                                    <div class="ulTCopyTxt" 
+                                    v-for="(i,ind) in appSignL(item.children)"
+                                        @click="levTwo(i,ind,index)" :key="ind+'a'">
+                                            <div class="ulTCopyTxt"
+                                             :style="{background : (activeLTwo === index+1 +'+' + ind)? '#E6F0FF' : ''}"
+                                            v-for="(p,pin) in AppCon(i.url)" :key="pin+'p'">
+                                            <el-tooltip class="item" 
+                                            effect="dark" :content="p.name" placement="right">
+                                                        <div class="ulTCopyConT">{{ p.name }}</div>
+                                                    </el-tooltip>
+                                            </div>
+                                    </div>
                                 </div>
-                                <span class="barT">{{ item.menuName }}</span>
                             </div>
-                        </el-popover>
-
+                        </transition>
+                        <div class="menu_left">
+                            <div class="iconW">
+                                <img :src="activeL === (index +1) ? item.menuActiveIcon : item.menuIcon" class="logo" alt="">
+                            </div>
+                            <span class="barT">{{ item.menuName }}</span>
+                        </div>
                         
                      </div>
                    
@@ -58,34 +57,38 @@
                     <!-- 渲染平台工具类型 -->
                     <div @click.stop="goto(index,item)" 
                      v-else>
-                        <div class="ulTOne" @mouseenter="mouGet(item.toolId)" v-for="(p,pin) in AppCon(item.url)" :key="pin+'p'">
-                            <el-popover
-                                placement="right"
-                                :append-to-body="false"
-                                :disabled="item.toolId != 'appStore'"
-                                trigger="hover"
-                            >
-                                <div class="ulTCopy" style="z-index: -10;">
-                                    <div class="ulTCopyTit">
-                                        <span>CocoFlow</span>
-                                    </div>
-                                    <div class="ulTCopyHei" >
-                                        <span style="color: #00000066;">最近使用</span>
-                                        <div class="ulTCopyTxt"  
-                                        v-for="(i,ind) in cocoFlowList[0]" @click="openNewWindow(i.url)" :key="ind+'ab'">
-                                        <div class="ulTCopyConT">{{ i.name }}</div>
-                                        </div>
-                                        <span style="color: #00000066;">我的收藏</span>
-                                        <div class="ulTCopyTxt"
-                                        v-for="(i,ind) in cocoFlowList[1]" @click="openNewWindow(i.url)" :key="ind+'a'">
-                                                    
-                                            <div class="ulTCopyConT">{{ i.name }}</div>
+                        <div class="ulTOne TwoBar" 
+                        @mouseenter="mouGet(item.toolId)" 
+                        v-for="(p,pin) in AppCon(item.url)" :key="pin+'p'">
+                          <!-- 二级导航 -->
+                                <transition name="slide">
+                                        <div class="ulTCopy2" v-if="item.toolId == 'appStore'">
+                                            <div class="ulTCopyTit">
+                                                <span>CocoFlow</span>
+                                            </div>
+                                            <div class="ulTCopyHei" >
+                                                <span v-if="cocoFlowList[0].length" style="color: #00000066;">最近使用</span>
+                                                <div class="ulTCopyTxt"  
+                                                v-for="(i,ind) in cocoFlowList[0]" 
+                                                @click="openNewWindow(i.url)" :key="ind+'ab'">
+                                                    <el-tooltip class="item" effect="dark" 
+                                                    :content="i.name" placement="right">
+                                                        <div class="ulTCopyConT">{{ i.name }}</div>
+                                                    </el-tooltip>
+                                                </div>
+                                                <span v-if="cocoFlowList[1].length" style="color: #00000066;">我的收藏</span>
+
+                                                <div class="ulTCopyTxt"
+                                                v-for="(i,ind) in cocoFlowList[1]" @click="openNewWindow(i.url)" :key="ind+'a'">
+                                                    <el-tooltip class="item" effect="dark" 
+                                                    :content="i.name" placement="right">
+                                                        <div class="ulTCopyConT">{{ i.name }}</div>
+                                                    </el-tooltip>
+                                                </div>
+                                            </div>
                                         </div>
-                                    </div>
-
-                                </div>
-
-                                <div slot="reference" class="menu_left" >
+                                    </transition>
+                                <div class="menu_left" >
                                     <div class="iconW">
                                         <img class="logo"  
                                         :src="activeL === (index +1) ? p.activeIcon : p.defaultIcon" 
@@ -95,14 +98,11 @@
                                         {{ p.name }}
                                     </span>
                                 </div>
-                            </el-popover>
-
-
 
                         </div>
                     </div>
                 </div>
-          
+
         </div>
 </template>
 
@@ -139,7 +139,7 @@ import { API_CONFIG } from "@/common/apiConfig";
             // 筛选是否为管理员可见，是否被删除
             appSignL(){
                 return function(val){
-                    // console.log(val);
+                    // console.log('appSignL',val);
                     
                     let data = []
                     if (this.userinfo.type == 1 && this.userinfo.role == 1) {
@@ -354,6 +354,27 @@ import { API_CONFIG } from "@/common/apiConfig";
 .ulTCopy{
     overflow: auto;
     height: 100%;
+}
+.ulTCopy2 {
+    height: 90%;
+    width: 154px;
+    overflow: hidden;
+    background-color: #FFFFFFE5 !important;
+    border-radius: 12px;
+    position: fixed;
+    left: -75px;
+    top: 70px;
+    z-index: -100;
+    background-color: #ffffff;
+    transition: transform .5s ease;
+
+}
+
+.TwoBar:hover .ulTCopy2{
+    display: block !important;
+    transform: translateX(164px) !important; /* 初始位置在视图之外 */
+    z-index: -100;
+    box-shadow: 0px 6px 30px 5px #0000000D;
 
 }
 
@@ -408,6 +429,7 @@ import { API_CONFIG } from "@/common/apiConfig";
     flex-direction: column;
     align-items: center;
     gap: 24px;
+    overflow: auto;
     border-right: 1px #D5D5D5 solid;
 }
 
@@ -449,7 +471,6 @@ import { API_CONFIG } from "@/common/apiConfig";
 .slide-enter-active, .slide-leave-active {
   transition: transform 0.5s ease;
   z-index: -1000 !important;
-
 }
 
 .slide-enter{
@@ -457,27 +478,8 @@ import { API_CONFIG } from "@/common/apiConfig";
   transform: translateX(0); /* 进入时移动到正常位置 */
 }
 .slide-leave-to /* .slide-leave-active in <2.1.8 */ {
-
     z-index: -1000 !important;
-
-  transform: translateX(0); /* 进入时移动到正常位置 */
-}
-.ulTOne >>> .el-popover{
-    overflow: auto;
-    padding: 0 !important;
-    left: 70px !important;
-    height: 596px;
-    width: 154px;
-    z-index: -100;
-    background-color: #FFFFFFE5 !important;
-    overflow: visible; 
-    border-radius: 12px;
-    overflow: hidden;
-    cursor: auto;
-    box-shadow: 0px 8px 10px -5px #00000014;
-    box-shadow: 0px 16px 24px 2px #0000000A;
-    box-shadow: 0px 6px 30px 5px #0000000D;
-    backdrop-filter: blur(16.700000762939453px);
+    transform: translateX(0); /* 进入时移动到正常位置 */
 }
 
 .ulTCopyTit{
@@ -490,28 +492,30 @@ import { API_CONFIG } from "@/common/apiConfig";
     padding: 12px 16px;
     box-sizing: border-box;
     border-bottom: .5px #e5e7eb solid;
-    background: #fff;
+    background: #fff !important;
 }
 .ulTCopyHei{
     display: flex;flex-direction: column;
     gap: 10px;
     overflow: auto;
+    padding: 10px;
     overflow-x: hidden;
     height: calc(100% - 72px);
 }
 .ulTCopyTxt{
-    height: 48px;
-    padding: 7px 10px;
     box-sizing: border-box;display: flex;
     align-items: center;
     color: #374151;
+    width: 100%;
     border-radius: 10px;
     font-size: 16px;
     margin: 0;
 }
+.ulTCopyTxtBlock{
+    width: 100%;
+}
 .ulTCopyConT {
-    height: 30px;
-    width: 154px;
+    width: 100%;
     font-size: 12px;
     cursor: pointer;
     border-radius: 8px;
@@ -520,11 +524,7 @@ import { API_CONFIG } from "@/common/apiConfig";
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
-    /* -webkit-line-clamp: 1;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    text-overflow: ellipsis; */
+   
 }
 .ulTCopyConT:hover{
     background: #e7e7e7;

src/components/topPage.vue

@@ -1,7 +1,7 @@
 <template>
     <div>
-        <!-- <div class="top"> -->
-            <!-- <div class="topBlock">
+        <div class="top">
+            <div class="topBlock">
                 <div class="topTit" style="display: flex;">
                     <div>欢迎使用</div>
                     <div style="color: #0354D7;margin: 0 15px;"><span v-if="userinfo.orgName">{{userinfo.orgName}}—</span>{{ userinfo.schoolName }}</div>
@@ -11,25 +11,29 @@
                      {{ fromL.basics.brief }}
                 </div>
             </div>
-            <img style="width: 96px;height: 96px;" src="../assets/img/root.png" alt=""> -->
-
-            <div style="height: 282px;overflow: hidden;margin: 20px 0;border-radius: 15px;">
-                <img style="width: 100%;object-fit: cover;" :src="fromL.basics.loginBanner" alt="">
-            </div>
-        <!-- </div> -->
+            <img style="width: 96px;height: 96px;" src="../assets/img/root.png" alt="">
+            
+            <!-- <div v-if="fromL.basics.loginBanner" style="margin: 20px 0;border-radius: 10px;overflow: hidden;">
+                <el-carousel :interval="5000" arrow="always">
+                    <el-carousel-item v-for="(item,index) in bannerL(fromL.basics.loginBanner)" :key="index">
+                        <img style="width: 100%;object-fit: cover;" :src="fromL.basics.loginBanner" alt="">
+                    </el-carousel-item>
+                </el-carousel>
+            </div> -->
+        </div>
 
         <!-- 平台应用  -->
         <div class="TabList">
             <div
-                 @mouseenter="setHovered(index, true)"
+                @mouseenter="setHovered(index, true)"
                 @mouseleave="setHovered(index, false)"
-                style="position: relative;"
+                class="TabListAll"
                 @click="openApp(item)" 
-                v-for="(item,index) in appSignL(fromL.admin.index.list)" 
+                v-for="(item,index) in tabList" 
                 :key="index+'1p'">
                 <div class="TabListCon">
                     <div v-for="(p,pin) in AppCon(item.url)" :key="pin+'p'">
-                        <img class="imgApp" :src="hovList[index] ? p.hoverIcon : p.platformIcon" alt="">
+                        <img class="imgApp" v-if="tabList[index].hovered ? p.hoverIcon : p.platformIcon" :src="tabList[index].hovered ? p.hoverIcon : p.platformIcon" alt="">
                         <div class="TabListName">
                             {{ p.name }}
                         </div>
@@ -41,6 +45,7 @@
                             </span>
                         </el-tooltip>
                     </div>
+
                 </div>
                     
             </div>
@@ -52,50 +57,53 @@
                 <img src="../assets/img/dong.png" alt="">
             </div>
 
-            <div class="footList">
-                <div class="footListCon" v-for="(item,index) in admincocoFlow" @click="openNewWindow(item)" :key="index+'2p'">
-                    <div class="footListConimg"><img style="margin-bottom: 12px;height: 24px;width: 22px;" :src="JSON.parse(item.json).icon" alt=""></div>
-                    <div class="TabListName">{{ item.name }}</div>
-                    <div class="TabListBri">
-                        <el-tooltip class="item" effect="light" :content="item.detail" placement="bottom">
-                            <span>
-                                {{ item.detail }}
-                            </span>
-                        </el-tooltip>
+            <div style="display: flex;gap: 16px;flex: 1;">
+                <div class="footList">
+                    <div class="footListCon" v-for="(item,index) in admincocoFlow" @click="openNewWindow(item)" :key="index+'2p'">
+                        <div class="footListConimg"><img style="margin-bottom: 12px;height: 24px;width: 22px;" :src="JSON.parse(item.json).icon" alt=""></div>
+                        <div class="TabListName">{{ item.name }}</div>
+                        <div class="TabListBri">
+                            <el-tooltip class="item" effect="light" :content="item.detail" placement="bottom">
+                                <span>
+                                    {{ item.detail }}
+                                </span>
+                            </el-tooltip>
+                        </div>
+                        <!-- <div class="cha" @click.stop="delApp(item.lid)">
+                            <img style="width: 20px;" src="../assets/img/cha.svg" alt="">
+                        </div> -->
                     </div>
-                    <!-- <div class="cha" @click.stop="delApp(item.lid)">
-                        <img style="width: 20px;" src="../assets/img/cha.svg" alt="">
-                    </div> -->
                 </div>
-            </div>
 
-            <div class="footList2">
-                <div class="footList2Tit">
-                    常见应用
-                </div>
-                <div v-for="(i,index) in (4 - CocoFlowList.length)" @click="openUsuallyApp" 
-                :key="index+'3p'" class="footListCon2">
-                    <div style="margin-bottom: 8px;font-size: 40px;color: #0354D7;">
-                        <img src="../assets//img/add.svg" alt="">
-                    </div>
-                </div> 
-                <div class="footListCon" v-for="(item,index) in CocoFlowList" @click="openNewWindow(item)" :key="index+'4p'">
-                    <div class="footListConimg">
-                        <img style="margin-bottom: 12px;height: 24px;width: 22px;" :src="JSON.parse(item.json).icon" alt="">
+                <div class="footList2">
+                    <div class="footList2Tit">
+                        常见应用
                     </div>
-                    <div class="TabListName">{{ item.name }}</div>
-                    <div class="TabListBri">
-                        <el-tooltip class="item" effect="light" :content="item.detail" placement="bottom">
-                            <span>
-                                {{ item.detail }}
-                            </span>
-                        </el-tooltip>
-                    </div>
-                    <div class="cha" @click.stop="delApp(item.lid)">
-                        <img style="width: 20px;" src="../assets/img/cha.svg" alt="">
+                    <div v-for="(i,index) in (4 - CocoFlowList.length)" @click="openUsuallyApp" 
+                    :key="index+'3p'" class="footListCon2">
+                        <div style="margin-bottom: 8px;font-size: 40px;color: #0354D7;">
+                            <img src="../assets//img/add.svg" alt="">
+                        </div>
+                    </div> 
+                    <div class="footListCon6" v-for="(item,index) in CocoFlowList" @click="openNewWindow(item)" :key="index+'4p'">
+                        <div class="footListConimg">
+                            <img style="margin-bottom: 12px;height: 24px;width: 22px;" :src="JSON.parse(item.json).icon" alt="">
+                        </div>
+                        <div class="TabListName">{{ item.name }}</div>
+                        <div class="TabListBri">
+                            <el-tooltip class="item" effect="light" :content="item.detail" placement="bottom">
+                                <span>
+                                    {{ item.detail }}
+                                </span>
+                            </el-tooltip>
+                        </div>
+                        <div class="cha" @click.stop="delApp(item.lid)">
+                            <img style="width: 20px;" src="../assets/img/cha.svg" alt="">
+                        </div>
                     </div>
                 </div>
             </div>
+            
         </div>
 
         <!-- 常见应用弹框 -->
@@ -143,8 +151,15 @@ import { API_CONFIG } from "@/common/apiConfig";
     export default {
         computed: {
             ...mapGetters(['userinfo','fromL']),
-              // 如果hk，com没有图标，默认使用cn的
-              AppCon(){
+            // banner循环图
+            // bannerL(){
+            //     return function(val){
+            //         console.log('val',val);
+            //         return val.split(',')
+            //     }
+            // },
+            // 如果hk，com没有图标，默认使用cn的
+            AppCon(){
                 return function(c) {
                     let k = JSON.parse(JSON.stringify(c))
 
@@ -161,6 +176,7 @@ import { API_CONFIG } from "@/common/apiConfig";
                         data[0].icon = data2[0].icon
                         data[0].activeIcon = data2[0].activeIcon
                     }
+                    
                     return data
                 };
             },
@@ -206,13 +222,20 @@ import { API_CONFIG } from "@/common/apiConfig";
                 admincocoFlow:[],
                 // 用户ai应用数组
                 CocoFlowList:[],
+                // 平台工具 
+                tabList:[],
 
                 hovList:[],
             }
         },
         methods: {
             setHovered(index, value) {
-                this.hovList.splice(index,1,value)
+                // console.log(index, value);
+                
+
+                this.tabList[index].hovered = value;
+                // console.log('this.tabList',this.tabList[index].hovered);
+                
             },
             // 删除应用
             delApp(val){
@@ -349,7 +372,34 @@ import { API_CONFIG } from "@/common/apiConfig";
                         this.$message.error("获取工具数据失败");
                     });
             },
+            siftCoco(){
+                let data = []
+                let val = JSON.parse(JSON.stringify(this.fromL.admin.index.list))
+                
+                // 用户是管理员全部展示
+                if (this.userinfo.type == 1 && this.userinfo.role == 1) {
+                    val.forEach( e =>{
+                        if (e.menuName || e.status == 0) {
+                            data.push(e)
+                        }
+                    })
+                } else {
+                    // 用户不是管理员，判断是否为用户可见 isAdmin 0普通用户 status是否被删除
+                    val.forEach( e =>{
+                        if (e.menuName || (e.isAdmin == '0' && e.status == 0)) {
+                            data.push(e)
+                        }
+                    })
+                }
+
+                
+                this.tabList = data
+                console.log('this.tabList',this.tabList);
+
+            },
             getAdmincocoFlow(){
+                // 筛选可用平台工具
+                this.siftCoco()
                 // console.log('getAdmincocoFlow',this.fromL);
                 
                 // 如果后台预设常用ai工具为0则不执行
@@ -477,17 +527,23 @@ import { API_CONFIG } from "@/common/apiConfig";
 .TabList{
     display: grid;
     grid-template-columns: repeat(3, 1fr);
-    gap: 106px; /* 网格间距 */
+    gap: 20px; /* 网格间距 */
     margin-bottom: 16px;
 }
+
+.TabListAll{
+    position: relative !important;
+    display: flex;
+    justify-content: flex-end;
+}
 .imgApp{
     width: 120px;
     height: 140px;
     object-fit: contain;
     position: absolute;
     top: 50%;
-    transform: translate(0,-50%);
-    left: -50px;
+    transform: translate(0,-50%) !important;
+    left: 0px;
 }
 .TabListCon{
     width: 170px;
@@ -496,9 +552,8 @@ import { API_CONFIG } from "@/common/apiConfig";
     box-sizing: border-box;
     background-color: #fff;
     border-radius: 10px;
-    width: 100%;
+    width: calc(100% - 60px);
     transition: all 0.3s ease; /* 统一过渡效果 */
-    /* background-image: radial-gradient(#E6F0FF 1px, transparent 1px); */
     background-size: 20px 20px;
     cursor: pointer;
     box-shadow: 0px 4px 10px 0px #0000000D;
@@ -508,7 +563,9 @@ import { API_CONFIG } from "@/common/apiConfig";
     align-items: end;
 }
 .TabListCon:hover{
-    transform: translate(-5px,-10px); /* 向上位移 */
+    width: calc(100% - 50px);
+    height: 125px;
+    margin-right: 10px;
     box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 }
 .TabListCon:hover TabListBri{
@@ -550,10 +607,10 @@ import { API_CONFIG } from "@/common/apiConfig";
 /* 常见应用样式 */
 .footCon{
     display: flex;
+    height: 350px;
     justify-content: space-between;
     box-sizing: border-box;
     border-radius: 10px;
-    gap: 30px;
     margin: 80px 0;
     /* background-image: radial-gradient(#E6F0FF 1px, transparent 1px); */
     background-size: 20px 20px;
@@ -561,43 +618,54 @@ import { API_CONFIG } from "@/common/apiConfig";
 
 /* 图片 */
 .footConLeft{
-    /* width: 360px; */
-    flex: 1;
+    width: 400px;
     box-sizing: border-box;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 .footConLeft img{
-    width: 100%;
+    object-fit: contain;
 }
 
 /* 中间后面设置应用 */
 .footList{
     display: grid;
     grid-template-columns: repeat(4, 1fr);
+    grid-template-rows: repeat(2, 1fr); /* 创建两行，每行高度相等 */
     gap: 16px; /* 网格间距 */
     flex: 2;
 }
 .footListCon{
     background-color: #fff;
     border-radius: 10px;
+    box-shadow: 0px 0px 22.4px 0px #0000000D;
     padding: 16px;
     box-sizing: border-box;
     transition: all 0.3s ease; /* 统一过渡效果 */
-    height: 10vw;
-    width: 10vw;
-    min-height: 146px;
-    max-width: 175px;
-    max-height: 175px;
-    background-size: 20px 20px;
+    cursor: pointer;
+}
+.footListCon6{
+    background-color: #fff;
+    border-radius: 10px;
+    box-shadow: 0px 0px 22.4px 0px #0000000D;
+    padding: 16px;
+    box-sizing: border-box;
     cursor: pointer;
     position: relative;
 }
+.footListCon6:hover .cha{
+    display: block;
+}
 .footListCon:hover{
     transform: translate(-5px,-10px); /* 向上位移 */
-
     box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
 }
+
 .footListConimg{
     height: 40%;
+    padding-top: 8px;
+    box-sizing: border-box;
 }
 .cha{
     display: none;position: absolute;top: 10px;right: 10px;
@@ -610,6 +678,7 @@ import { API_CONFIG } from "@/common/apiConfig";
 .footList2{
     display: grid;
     grid-template-columns: repeat(2, 1fr);
+    grid-template-rows: repeat(2, 1fr); /* 创建两行，每行高度相等 */
     gap: 16px;
     flex: 1;
     position: relative;
@@ -629,16 +698,14 @@ import { API_CONFIG } from "@/common/apiConfig";
     flex-direction: column;
     align-items: center;
     border: 1px dashed  #000000;
-    width: 10vw;
-    height: 10vw;
-    min-height: 146px;
     box-sizing: border-box;
-    max-width: 175px;
-    max-height: 175px;
     border-radius: 12px;
     border-width: 1px;
     background-color: #E5E5E5;
 }
+.footListCon2:hover {
+    background: #C9C9C9;
+}
 
 
 

src/store/modules/user.js

@@ -114,11 +114,11 @@ const actions = {
           // }
         })
         .catch((error) => {
-          // var _user = { userid: "6c56ec0e-2c74-11ef-bee5-005056b86db5" };
-          // commit("SET_ID", _user.userid);
-          // commit("SET_TOKEN", _user.userid);
-          // setToken(_user.userid);
-          // resolve(_user.userid);
+          var _user = { userid: "6c56ec0e-2c74-11ef-bee5-005056b86db5" };
+          commit("SET_ID", _user.userid);
+          commit("SET_TOKEN", _user.userid);
+          setToken(_user.userid);
+          resolve(_user.userid);
           reject(error);
         });
     });

src/views/HomeView.vue

@@ -277,12 +277,14 @@ export default {
 <style scoped>
 .top{
   width: 100%;
-  padding: 22px 81px;
-  height: 80px;
+  padding: 0 90px;
+  display: flex;
+  height: 60px;
   box-sizing: border-box;
 }
 .topCon{
   display: flex;
+  width: 100%;
   justify-content: space-between;
   align-items: center;
 }