|
|
@ -1,20 +1,22 @@ |
|
|
<template> |
|
|
<template> |
|
|
<el-affix :offset="0" @change="onAffix"> |
|
|
<el-affix :offset="0" @change="onAffix"> |
|
|
<header class="header z-100 top-0 w-full bg-white/75 opacity-90 backdrop-blur border-b border-gray-200 dark:border-gray-800 -mb-px sticky top-0 z-50 lg:mb-0 lg:border-0" :class="affix ? 'absolute blur-xs' : 'sticky bg-white/75'"> |
|
|
|
|
|
|
|
|
<header |
|
|
|
|
|
class="header z-100 top-0 w-full bg-white/75 opacity-90 backdrop-blur border-b border-gray-200 dark:border-gray-800 -mb-px sticky top-0 z-50 lg:mb-0 lg:border-0" |
|
|
|
|
|
:class="affix ? 'absolute blur-xs' : 'sticky bg-white/75'"> |
|
|
<div class="flex items-center between md:w-screen-xl w-full m-auto"> |
|
|
<div class="flex items-center between md:w-screen-xl w-full m-auto"> |
|
|
<div class="header___left flex items-center"> |
|
|
<div class="header___left flex items-center"> |
|
|
<div class="logo mt-1 sm:w-[120px] sm:ml-0 ml-2 h-7 w-auto py-2 flex items-center"> |
|
|
|
|
|
|
|
|
<div class="logo mt-1 sm:w-[150px] h-7 w-auto py-2 flex items-center"> |
|
|
<nuxt-link v-if="config?.siteLogo" to="/"> |
|
|
<nuxt-link v-if="config?.siteLogo" to="/"> |
|
|
<div class="flex flex-col text-center"> |
|
|
|
|
|
|
|
|
<div class="flex flex-col text-center md:p-0 px-4"> |
|
|
<el-image |
|
|
<el-image |
|
|
:src="config.siteLogo" |
|
|
:src="config.siteLogo" |
|
|
shape="square" |
|
|
shape="square" |
|
|
fit="fill" |
|
|
fit="fill" |
|
|
class="sm:h-5 h-5 sm:w-auto w-17" |
|
|
|
|
|
|
|
|
class="sm:h-7 sm: pb-2 h-5 sm:w-auto" |
|
|
:alt="config.siteName" |
|
|
:alt="config.siteName" |
|
|
:title="config.siteName" |
|
|
:title="config.siteName" |
|
|
/> |
|
|
/> |
|
|
<span class="text-gray-500 text-2.5" style="line-height: 1rem">云应用开发平台</span> |
|
|
|
|
|
|
|
|
<!-- <span class="text-gray-500 text-2.5" style="line-height: 1rem">云应用开发平台</span>--> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
</nuxt-link> |
|
|
</nuxt-link> |
|
|
@ -22,7 +24,7 @@ |
|
|
<text>{{ config?.siteName }}</text> |
|
|
<text>{{ config?.siteName }}</text> |
|
|
</nuxt-link> |
|
|
</nuxt-link> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="hidden sm:flex"> |
|
|
<el-menu |
|
|
<el-menu |
|
|
:default-active="currentIndex" |
|
|
:default-active="currentIndex" |
|
|
mode="horizontal" |
|
|
mode="horizontal" |
|
|
@ -45,20 +47,10 @@ |
|
|
<el-menu-item v-if="user.roleId === 858" :index="`/merchant`"><h3>商家中心</h3></el-menu-item> |
|
|
<el-menu-item v-if="user.roleId === 858" :index="`/merchant`"><h3>商家中心</h3></el-menu-item> |
|
|
<el-menu-item v-if="user.roleId === 859" :index="`/developer`"><h3>开发者中心</h3></el-menu-item> |
|
|
<el-menu-item v-if="user.roleId === 859" :index="`/developer`"><h3>开发者中心</h3></el-menu-item> |
|
|
<el-menu-item v-else :index="`/developer`"><h3>入驻</h3></el-menu-item> |
|
|
<el-menu-item v-else :index="`/developer`"><h3>入驻</h3></el-menu-item> |
|
|
|
|
|
|
|
|
<!-- 顶部菜单超出数量折叠 --> |
|
|
|
|
|
<!-- <el-sub-menu index="more" v-if="navigations && navigations.length > (config.elMenuMaxNumber)">--> |
|
|
|
|
|
<!-- <template #title>更多菜单</template>--> |
|
|
|
|
|
<!-- <template v-for="(item, index) in navigations">--> |
|
|
|
|
|
<!-- <el-menu-item :index="item.path" :key="index" v-if="index >= (config.elMenuMaxNumber)">--> |
|
|
|
|
|
<!-- <text :class="item.style">{{ item.title }}</text>--> |
|
|
|
|
|
<!-- </el-menu-item--> |
|
|
|
|
|
<!-- >--> |
|
|
|
|
|
<!-- </template>--> |
|
|
|
|
|
<!-- </el-sub-menu>--> |
|
|
|
|
|
</el-menu> |
|
|
</el-menu> |
|
|
</div> |
|
|
</div> |
|
|
<div class="header__right items-center pr-4 sm:pr-0"> |
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
<div class="header__right items-center pr-4 sm:pr-0 md:flex hidden"> |
|
|
<el-space class="sm:flex hidden" size="large" v-if="config.showSearchTools"> |
|
|
<el-space class="sm:flex hidden" size="large" v-if="config.showSearchTools"> |
|
|
<!-- <el-button v-if="token" @click="navigateTo(`/manage`)">控制台</el-button>--> |
|
|
<!-- <el-button v-if="token" @click="navigateTo(`/manage`)">控制台</el-button>--> |
|
|
<!-- <el-button v-if="config.showSearchIcon" circle :icon="ElIconSearch" @click="navigateTo('/search')"></el-button>--> |
|
|
<!-- <el-button v-if="config.showSearchIcon" circle :icon="ElIconSearch" @click="navigateTo('/search')"></el-button>--> |
|
|
@ -85,6 +77,27 @@ |
|
|
</ClientOnly> |
|
|
</ClientOnly> |
|
|
</el-space> |
|
|
</el-space> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- 移动端菜单 --> |
|
|
|
|
|
<div class="md:hidden flex md:p-0 px-4"> |
|
|
|
|
|
<el-dropdown> |
|
|
|
|
|
<span class="el-dropdown-link"> |
|
|
|
|
|
<el-button :icon="ElIconMenu"></el-button> |
|
|
|
|
|
</span> |
|
|
|
|
|
<template #dropdown> |
|
|
|
|
|
<el-dropdown-menu> |
|
|
|
|
|
<template v-for="(item, index) in navigations"> |
|
|
|
|
|
<el-dropdown-item> |
|
|
|
|
|
<span @click="navigateTo(item.path)">{{ item.title }}</span> |
|
|
|
|
|
</el-dropdown-item> |
|
|
|
|
|
</template> |
|
|
|
|
|
<el-dropdown-item v-if="token && sysDomain" |
|
|
|
|
|
@click="loginAdminByToken">控制台 |
|
|
|
|
|
</el-dropdown-item> |
|
|
|
|
|
<el-dropdown-item v-else divided @click="navigateTo(`/passport/login`)">登录</el-dropdown-item> |
|
|
|
|
|
</el-dropdown-menu> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-dropdown> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<Passport :visible="showPassport" @done="reload"/> |
|
|
<Passport :visible="showPassport" @done="reload"/> |
|
|
</header> |
|
|
</header> |
|
|
@ -186,10 +199,12 @@ reload(); |
|
|
body { |
|
|
body { |
|
|
background-color: #f3f6f8; |
|
|
background-color: #f3f6f8; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.el-menu-item:visited, .el-menu-item:hover { |
|
|
.el-menu-item:visited, .el-menu-item:hover { |
|
|
background: none !important; /* 你可以根据需要设置不同的颜色 */ |
|
|
background: none !important; /* 你可以根据需要设置不同的颜色 */ |
|
|
transition: background-color 0.3s linear; |
|
|
transition: background-color 0.3s linear; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.is-active:hover { |
|
|
.is-active:hover { |
|
|
border-bottom: none !important; |
|
|
border-bottom: none !important; |
|
|
} |
|
|
} |
|
|
|
