gxwebsoft/template-10490
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

初始化

Browse Source
This commit is contained in:
赵忠林
2025-01-27 23:24:42 +08:00
parent c8a96306c4
commit 6ae8339299
421 changed files with 35687 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

233
components/AppHeader.vue Normal file
View File

@@ -0,0 +1,233 @@
<template>
<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'">
<div class="xl:w-screen-xl xl:p-0 px-4 flex items-center between w-full m-auto">
<div class="header___left 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="/">
<div class="flex flex-col text-center xl:p-0">
<el-image
:src="config.siteLogo"
shape="square"
fit="fill"
class="lg:h-7 lg:w-auto pb-2 h-5 w-[90px] h-[28px]"
:alt="config.siteName"
:title="config.siteName"
/>
<!-- <span class="text-gray-500 text-2.5" style="line-height: 1rem">云应用开发平台</span>-->
</div>
</nuxt-link>
<nuxt-link v-else to="/">
<text>{{ config?.siteName }}</text>
</nuxt-link>
</div>
<div class="hidden sm:flex">
<el-menu
:default-active="currentIndex"
mode="horizontal"
background-color="transparent"
:collapse="true"
:ellipsis="false"
style="border: none"
>
<template v-for="(item, index) in navigations">
<el-sub-menu v-if="item?.children && item.children.length > 0" :index="`${item.path}`">
<template #title><h3 @click="openSpmUrl(`${item.path}`,item,item.navigationId)">{{ item.title }}</h3></template>
<el-menu-item v-for="(sub,subIndex) in item.children" :index="`${sub.path}`">
<el-space @click="openSpmUrl(`${item.path}`,sub,sub.navigationId)">
<el-avatar :src="sub.icon" shape="square" size="small"></el-avatar>
<span class="font-bold">{{ sub.title }}</span>
</el-space>
</el-menu-item>
</el-sub-menu>
<el-menu-item v-else :index="`${item.path}`"><h3 @click="openSpmUrl(`${item.path}`,item,item.navigationId)">{{ item.title }}</h3></el-menu-item>
</template>
<!-- <el-menu-item v-if="user?.certification">-->
<!-- <el-space @click="loginDeveloperCenterByToken({domain:'developer.websoft.top'})">-->
<!-- <h3>开发者中心</h3>-->
<!-- </el-space>-->
<!-- </el-menu-item>-->
<!-- <el-menu-item v-else>-->
<!-- <el-space @click="openSpmUrl(`https://developer.websoft.top`)">-->
<!-- <h3>开发者中心</h3>-->
<!-- </el-space>-->
<!-- </el-menu-item>-->
</el-menu>
</div>
</div>
<div class="header__right items-center pr-4 xl:pr-0 md:flex hidden">
<el-space class="sm:flex hidden" size="large" v-if="config.showSearchTools">
<el-button v-if="token" @click="loginAdminByToken">控制台</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="token" @click="loginAdminByToken">控制台</el-button>-->
<ClientOnly>
<template v-if="token">
<el-dropdown @command="handleCommand">
<el-space class="flex items-center cursor-pointer">
<el-avatar class="cursor-pointer" :src="user?.logo" :size="30" />
<span>{{ user?.tenantName }}</span>
</el-space>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="user" @click="openSpmUrl(`/user`)">账户中心</el-dropdown-item>
<el-dropdown-item command="password" @click="openSpmUrl(`/user/password`)">修改密码</el-dropdown-item>
<el-dropdown-item command="auth" @click="openSpmUrl(`/user/auth`)">实名认证</el-dropdown-item>
<el-dropdown-item command="order" @click="openSpmUrl(`/user/order`)">我的订单</el-dropdown-item>
<!-- <el-dropdown-item divided command="order" @click="loginDeveloperCenterByToken({domain:'developer.websoft.top'})">开发者中心</el-dropdown-item>-->
<el-dropdown-item divided command="logOut" @click="openSpmUrl('/user/logout')">退出登录
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</template>
<template v-else>
<el-button type="primary" v-if="!token" @click="navigateTo(`/passport/login`)">登录/注册</el-button>
<!-- <el-button v-if="config.showLoginButton" circle :icon="ElIconUserFilled" @click="goLogin"></el-button>-->
</template>
</ClientOnly>
</el-space>
</div>
<!-- 移动端菜单 -->
<div class="sm:hidden flex xl:p-0 px-8">
<el-dropdown>
<el-space class="el-dropdown-link flex items-center">
<el-avatar v-if="token" class="cursor-pointer" :src="user?.avatar" :size="30"/>
<el-button v-else :icon="ElIconMenu"></el-button>
</el-space>
<template #dropdown>
<el-dropdown-menu>
<template v-for="(item, index) in navigations">
<el-dropdown-item>
<span @click="openSpmUrl(`${item.path}`,item,item.navigationId)">{{ item.title }}</span>
</el-dropdown-item>
</template>
<template v-if="token">
<el-dropdown-item divided @click="loginDeveloperCenterByToken">开发者中心</el-dropdown-item>
<!-- <el-dropdown-item divided command="user" @click="navigateTo(`/user`)">账户中心</el-dropdown-item>-->
<el-dropdown-item divided command="logOut" @click="navigateTo('/user/logout')">退出</el-dropdown-item>
</template>
<el-dropdown-item v-if="!token" divided @click="navigateTo(`/passport/login`)">登录</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
<Passport :visible="showPassport" @done="reload"/>
</header>
<div class="header__height__placeholder"></div>
</el-affix>
</template>
<script setup lang="ts">
// 引入所需的图标
import {
useCompany,
useConfigInfo,
useMenu,
useProductAffix,
useSysDomain,
useToken,
useUser
} from "~/composables/configState";
import {useServerRequest} from "~/composables/useServerRequest";
import type {ApiResult} from "~/api";
import type {User} from "~/api/system/user/model";
import {navigateTo, openSpmUrl} from "#imports";
import type {Company} from "~/api/system/company/model";
import {loginAdminByToken} from "~/utils/common";
const route = useRoute();
// 配置信息
const runtimeConfig = useRuntimeConfig();
const showPassport = ref<boolean>(false);
const token = useToken();
const user = useUser();
const company = useCompany();
const navigations = useMenu();
const config = useConfigInfo();
const affix = useProductAffix();
const sysDomain = useSysDomain();
// 顶部栏初始数
const visibleNumber = ref<number>(6);
config.value.elMenuMaxNumber = 8;
// 当前激活菜单的 index
const currentIndex = ref<string>('/');
function handleCommand(command: string) {
switch (command) {
case 'logOut':
logOut();
break;
default:
navigateTo('/user');
break;
}
}
const onAffix = (index: boolean) => {
affix.value = index;
}
function logOut() {
token.value = ''
localStorage.clear();
navigateTo('/passport/login')
}
function goLogin() {
navigateTo('/passport/login')
}
function handleSelect(key: string, keyPath: any) {
currentIndex.value = key;
navigateTo(`${key}`);
}
const reload = async () => {
const token = localStorage.getItem('token');
// const domain = localStorage.getItem('SysDomain');
// if (domain) {
// sysDomain.value = domain;
// }
// 获取用户信息
if (token && token != '') {
const {data: response} = await useServerRequest<ApiResult<User>>('/auth/user', {baseURL: runtimeConfig.public.apiServer})
if (response.value?.data) {
user.value = response.value?.data;
}
// 获取企业信息
const {data: companyInfo} = await useServerRequest<ApiResult<Company>>('/system/company/profile', {baseURL: runtimeConfig.public.apiServer})
if(companyInfo.value?.data){
company.value = companyInfo.value?.data;
// sysDomain.value = company.value?.domain || undefined;
// user.value.tenantName = company.value?.tenantName;
// localStorage.setItem('SysDomain', `${company.value?.domain}`);
localStorage.setItem('CompanyLogo', `${company.value?.companyLogo}`)
localStorage.setItem('TenantName', `${company.value?.tenantName}`)
}
}
}
reload();
</script>
<style lang="scss">
body {
background-color: #f3f6f8;
}
.el-menu-item:visited, .el-menu-item:hover {
background: none !important; /* 你可以根据需要设置不同的颜色 */
transition: background-color 0.3s linear;
}
.is-active:hover {
border-bottom: none !important;
}
</style>