头部组件

src/App.vue

@@ -2,7 +2,8 @@
   <div id="app">
     <el-container class="outContainerWrap">
       <el-header style="height: 62px;" v-if="showHeader">
-        <Header :showRight="showHeaderRight"></Header>
+        <ClientHeader :showRight="showHeaderRight" v-if="clientHeaderFlag"></ClientHeader>
+        <Header :showRight="showHeaderRight" v-else></Header>
         <video class="top_viedo" width="100%" src="./assets/headerBg1.mp4" autoplay loop muted
         ></video>
         <div class="bg"></div>
@@ -32,6 +33,7 @@
 import SliderMenu from '@/components/SliderMenu.vue';
 import { mapState } from 'vuex';
 import Header from './components/Header.vue';
+import ClientHeader from './components/HeaderClientSet.vue';
 import Breadcrumb from './components/Breadcrumb.vue';
 // import loadingAnimation from '@/assets/loadingAni.json' // 导入JSON文件
 import GlobalLoading from '@/components/GlobalLoading1.vue'
@@ -41,6 +43,7 @@ export default {
   data() {
     return {
       isCollapse: true,
+      clientHeaderFlag:false,// 是否显示排版的头部 true 显示 false  state位置后续可能需要修改
     };
   },
   components: {
@@ -50,6 +53,7 @@ export default {
     SliderMenu,
     // Footer,
     Header,
+    ClientHeader,
     Breadcrumb
   },
   computed: {

src/components/HeaderClientSet.vue

@@ -0,0 +1,222 @@
+<template>
+    <div class="header-wrap ">
+        <div class="header-logo" @click="toHome">
+            <!-- 管理员端logo -->
+            <img v-if="headerShow" src="../assets/clientSet/clientSet_h_logo_admin.png" alt="">
+            <!-- 创建模板logo -->
+            <img v-else src="../assets/clientSet/clientSet_h_logo_tpl.png" alt="">
+        </div>
+        <div class="header-right flex" v-if="headerShow">
+            <div
+                :class="['right-item','flex', currentPath == item.path ? 'right-item-active' :'']"
+                v-for="(item,index) in routerNavList"
+                :key="index"
+                @click="goToPage(item.path)"
+            >
+                {{ item.name }}
+                <span class="header_total" v-if="total > 0 && item.name == '收录申请'">{{ total }}</span>
+            </div>
+           
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data(){
+        return{
+            user: '',
+            headerShow:true,
+            doctor_id:'',
+            authtoken:false,
+            currentPath:'',
+            total:30,
+            routerNavList:[
+                {
+                    name:'模板管理',
+                    path:'/super/paiban/tpl'
+                },
+                {
+                    name:'收录申请',
+                    path:'/super/paiban/college'
+                },
+                {
+                    name:'订单管理',
+                    path:'/super/paiban/orderlist'
+                },
+            ]
+        }
+    },
+    mounted(){
+        // 如登陆用户信息获取到，则显示管理员端头部 具体流程待定
+        // this.user = localStorage.getItem('user_name')
+        // var user_type = localStorage.getItem('user_type')
+        // if(!user_type || user_type == 'undefined') {
+        //     this.user = '超级管理员'
+        // }else{
+        //     if(user_type && user_type != 'undefined') this.user = (user_type == 1?'医生':'助手') + this.user
+        // }
+        // this.doctor_id = localStorage.getItem('doctor_id')
+        // this.authtoken = localStorage.getItem('authtoken')
+
+        // if(this.authtoken){
+        //     this.headerShow = true
+        //     // 初始化时设置当前路由高亮
+        //     this.updateCurrentPath()
+        //     // 监听路由变化
+        //     this.watchRouteChange()
+        // }else{
+        //     this.headerShow = false
+        // }
+    },
+    methods: {
+        // 获取收录列表数据
+        getList() {
+            try {
+                this.$http('POST', '/supernew/ajax_get_paiban_review_list', {
+                    school: this.school,
+                    degree: this.degree,
+                    review_status: this.review_status,
+                    page: this.currentPage,
+                }).then(response => {
+                    this.$nextTick(() => {
+                        this.total = response.data.count
+                    })
+                }).catch(error => {
+                    console.error(error, 'error')
+                })
+            } catch (error) {
+                console.error('数据加载失败:', error)
+            }
+        },
+        toHome() {
+            this.$router.push({
+                path: '/'
+            })
+        },
+        goToPage(path) {
+            if(this.currentPath == path) return;
+            this.currentPath = path;
+            this.$router.push({
+                path: path
+            })
+        },
+        loginOut(){
+            localStorage.removeItem('token');
+            localStorage.removeItem('user_name');
+            localStorage.removeItem('authtoken');
+            localStorage.removeItem('user_type');
+            localStorage.removeItem('doctor_id');
+            this.$router.push('/login');
+        },
+        // 更新当前路径高亮状态
+        updateCurrentPath() {
+            const currentRoute = this.$route.path;
+            const matchedItem = this.routerNavList.find(item =>
+                currentRoute.startsWith(item.path)
+            );
+            if (matchedItem) {
+                this.currentPath = matchedItem.path;
+            } else {
+                this.currentPath = '';
+            }
+        },
+        // 监听路由变化
+        watchRouteChange() {
+            this.$watch('$route', (to, from) => {
+                console.log(to,from,'====');
+                this.updateCurrentPath();
+            });
+        }
+    },
+    beforeDestroy() {
+
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.flex {
+    display: flex;
+}
+
+.header-wrap {
+    color: #1E2226;
+    display: flex;
+    justify-content: space-between;
+    height: 100%;
+    width: 100%;
+    padding: 0 26px;
+    box-sizing: border-box;
+    align-items: center;
+    position: absolute;
+    z-index: 9;
+    left: 0;
+    background: #fff;
+    .header-logo {
+        cursor: pointer;
+        img {
+            height: 33px;
+        }
+    }
+    .header_total{
+        box-sizing: border-box;
+        min-width: 28px;
+        height: 18px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        padding: 10px;
+        border-radius: 100px;
+        background: #FFF1F0;
+        box-sizing: border-box;
+        border: 1px solid #FFA39E;
+        color: #FF4D4F;
+    }
+
+    .header-right {
+        justify-content: flex-end;
+        gap:24px;
+        .el-dropdown-link {
+            cursor: pointer;
+        }
+        .right-item{
+            gap: 8px;
+            padding: 8px 12px;
+            transition: all .3s;
+            cursor: pointer;
+            font-size: 16px;
+            &:hover{
+                border-radius: 6px;
+                color: #006AFF;
+                transition: all .3s;
+                background: #F4F5FA;
+            }
+        }
+        .right-item-active{
+            border-radius: 4px;
+            background: #F4F5FA;
+            font-size: 16px;
+            font-weight: bold;
+            line-height: normal;
+            letter-spacing: normal;
+            color: #3F62F6;
+            transition: all .3s;
+        }
+        .el-dropdown .right-item{
+            padding: 0 10px;
+            cursor: pointer;
+        }
+
+        .right-item-icon {
+            width: 36px;
+            height: 36px;
+        }
+
+        .right-item-icon+span {
+            display: inline-block;
+            margin: 0 6px 0 12px;
+        }
+    }
+}
+</style>

src/views/super/paiban/college.vue

@@ -56,7 +56,7 @@
             </el-form>
         </div>
 
-        <GuipDialog :dialogVisible="true" title="拒绝收录原因" :show-close-button="false"
+        <GuipDialog :dialogVisible="isShowDialog" title="拒绝收录原因" :show-close-button="false"
                     :show-cancel-button="true" @confirm="handleConfirmRefuse" @cancel="handleCancelRefuse">
             <!-- 自定义内容 -->
             <el-form>