lct

Your Name

2022-08-11 b37d9a1f4f39fb04f48a63d11d759c673e5f4d6a

 src/layout/navBars/breadcrumb/user.vue

@@ -1,5 +1,11 @@
<template>
    <div class="layout-navbars-breadcrumb-user pr15" :style="{ flex: layoutUserFlexNum }">
        <div class="logo">
            <img src="../../../assets/menu/companyLogo.jpg" />
            <span style="font-size: 16px; color: #333; font-weight: bolder"> | {{ systemName }}</span>
        </div>
        <div style="display: flex;align-items:center;padding-right: 5px">
        <div @click="backToMenu()" class="backBtn">返回首页</div>
        <el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onComponentSizeChange">
            <div class="layout-navbars-breadcrumb-user-icon">
                <i class="iconfont icon-ziti" :title="$t('message.user.title0')"></i>
@@ -7,57 +13,47 @@
            <template #dropdown>
                <el-dropdown-menu>
                    <el-dropdown-item command="large" :disabled="disabledSize === 'large'">{{ $t('message.user.dropdownLarge') }}</el-dropdown-item>
                    <el-dropdown-item command="default" :disabled="disabledSize === 'default'">{{
                        $t('message.user.dropdownDefault')
                    }}</el-dropdown-item>
                    <el-dropdown-item command="default" :disabled="disabledSize === 'default'">{{ $t('message.user.dropdownDefault') }}</el-dropdown-item>
                    <el-dropdown-item command="small" :disabled="disabledSize === 'small'">{{ $t('message.user.dropdownSmall') }}</el-dropdown-item>
                </el-dropdown-menu>
            </template>
        </el-dropdown>
        <el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onLanguageChange">
            <div class="layout-navbars-breadcrumb-user-icon">
                <i
                    class="iconfont"
                    :class="disabledI18n === 'en' ? 'icon-fuhao-yingwen' : 'icon-fuhao-zhongwen'"
                    :title="$t('message.user.title1')"
                ></i>
            </div>
            <template #dropdown>
                <el-dropdown-menu>
                    <el-dropdown-item command="zh-cn" :disabled="disabledI18n === 'zh-cn'">简体中文</el-dropdown-item>
                    <el-dropdown-item command="en" :disabled="disabledI18n === 'en'">English</el-dropdown-item>
                    <el-dropdown-item command="zh-tw" :disabled="disabledI18n === 'zh-tw'">繁體中文</el-dropdown-item>
                </el-dropdown-menu>
            </template>
        </el-dropdown>
        <div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">
            <el-icon :title="$t('message.user.title2')">
                <ele-Search />
            </el-icon>
        </div>
        <div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">
            <i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>
        </div>
        <div class="layout-navbars-breadcrumb-user-icon">
            <el-popover placement="bottom" trigger="click" transition="el-zoom-in-top" :width="300" :persistent="false">
                <template #reference>
                    <el-badge :is-dot="true">
                        <el-icon :title="$t('message.user.title4')">
                            <ele-Bell />
                        </el-icon>
                    </el-badge>
                </template>
                <template #default>
                    <UserNews />
                </template>
            </el-popover>
        </div>
<!--        <el-dropdown :show-timeout="70" :hide-timeout="50" trigger="click" @command="onLanguageChange">-->
<!--            <div class="layout-navbars-breadcrumb-user-icon">-->
<!--                <i class="iconfont" :class="disabledI18n === 'en' ? 'icon-fuhao-yingwen' : 'icon-fuhao-zhongwen'" :title="$t('message.user.title1')"></i>-->
<!--            </div>-->
<!--            <template #dropdown>-->
<!--                <el-dropdown-menu>-->
<!--                    <el-dropdown-item command="zh-cn" :disabled="disabledI18n === 'zh-cn'">简体中文</el-dropdown-item>-->
<!--                    <el-dropdown-item command="en" :disabled="disabledI18n === 'en'">English</el-dropdown-item>-->
<!--                    <el-dropdown-item command="zh-tw" :disabled="disabledI18n === 'zh-tw'">繁體中文</el-dropdown-item>-->
<!--                </el-dropdown-menu>-->
<!--            </template>-->
<!--        </el-dropdown>-->
<!--        <div class="layout-navbars-breadcrumb-user-icon" @click="onSearchClick">-->
<!--            <el-icon :title="$t('message.user.title2')">-->
<!--                <ele-Search />-->
<!--            </el-icon>-->
<!--        </div>-->
        <!--        <div class="layout-navbars-breadcrumb-user-icon" @click="onLayoutSetingClick">-->
        <!--            <i class="icon-skin iconfont" :title="$t('message.user.title3')"></i>-->
        <!--        </div>-->
        <!--        <div class="layout-navbars-breadcrumb-user-icon">-->
        <!--            <el-popover placement="bottom" trigger="click" transition="el-zoom-in-top" :width="300" :persistent="false">-->
        <!--                <template #reference>-->
        <!--                    <el-badge :is-dot="true">-->
        <!--                        <el-icon :title="$t('message.user.title4')">-->
        <!--                            <ele-Bell />-->
        <!--                        </el-icon>-->
        <!--                    </el-badge>-->
        <!--                </template>-->
        <!--                <template #default>-->
        <!--                    <UserNews />-->
        <!--                </template>-->
        <!--            </el-popover>-->
        <!--        </div>-->
        <div class="layout-navbars-breadcrumb-user-icon mr10" @click="onScreenfullClick">
            <i
                class="iconfont"
                :title="isScreenfull ? $t('message.user.title6') : $t('message.user.title5')"
                :class="!isScreenfull ? 'icon-fullscreen' : 'icon-tuichuquanping'"
            ></i>
            <i class="iconfont" :title="isScreenfull ? $t('message.user.title6') : $t('message.user.title5')" :class="!isScreenfull ? 'icon-fullscreen' : 'icon-tuichuquanping'"></i>
        </div>
        <el-dropdown :show-timeout="70" :hide-timeout="50" @command="onHandleCommandClick">
            <span class="layout-navbars-breadcrumb-user-link">
@@ -71,7 +67,7 @@
                <el-dropdown-menu>
                    <el-dropdown-item command="/homeMenu">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
                    <!--                    <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item>-->
                    <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
<!--                    <el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>-->
                    <!--               <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item>-->
                    <!--               <el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item>-->
                    <el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
@@ -79,6 +75,7 @@
            </template>
        </el-dropdown>
        <Search ref="searchRef" />
        </div>
    </div>
</template>

@@ -96,6 +93,13 @@
import UserNews from '/@/layout/navBars/breadcrumb/userNews.vue';
import Search from '/@/layout/navBars/breadcrumb/search.vue';
import { useLoginApi } from '/@/api/login';
import { useMenuApi } from '/@/api/systemManage/menu/index';

const menuApi = useMenuApi();
import { backEndComponent, getBackEndControlRoutes, initBackEndControlRoutes, setAddRoute, setFilterMenuAndCacheTagsViewRoutes } from '../../../router/backEnd';
import { NextLoading } from '/@/utils/loading';
import { useRequestOldRoutes } from '/@/stores/requestOldRoutes';
import { dynamicRoutes } from '/@/router/route';

export default defineComponent({
    name: 'layoutBreadcrumbUser',
@@ -112,7 +116,8 @@
        const state = reactive({
            isScreenfull: false,
            disabledI18n: 'zh-cn',
            disabledSize: 'large'
            disabledSize: 'large',
            systemName: ''
        });
        // 设置分割样式
        const layoutUserFlexNum = computed(() => {
@@ -242,15 +247,32 @@
                    break;
            }
        };

        const getSysName = async()=>{
            if (window.nextLoading === undefined) NextLoading.start();
            if (!Session.get('token')) return false;
            const res = await menuApi.getMenuAdmin(Session.get('projectId') === null ? '' : Session.get('projectId'));
            if(res.data.code === '200'){
                state.systemName = res.data.data[1].project.projectName;
                console.log(state.systemName)
            }else{
                console.log('有问题')
            }
        }
        const backToMenu=()=>{
            router.push({ path: 'homeMenu' })
        }
        // 页面加载时
        onMounted(() => {
            if (Local.get('themeConfig')) {
                initI18n();
                initComponentSize();
            }
            getSysName()
        });
        return {
            userInfos,
            backToMenu,
            onLayoutSetingClick,
            onHandleCommandClick,
            onScreenfullClick,
@@ -269,7 +291,19 @@
.layout-navbars-breadcrumb-user {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    justify-content: space-between;

    .logo{
        height: 50px;
        padding: 5px 10px;
        display: flex;
        align-items: center;
        overflow: hidden;
        box-sizing: border-box;
        img{
            height: 100%;
        }
    }
    &-link {
        height: 100%;
        display: flex;
@@ -309,5 +343,15 @@
    ::v-deep(.el-badge__content.is-fixed) {
        top: 12px;
    }
    .backBtn{
        font-size: 16px;
        cursor: pointer;
        margin-right: 20px;

        &:hover{
            color: #409eff;
            font-weight: bolder;
        }
    }
}
</style>