马宇豪
2024-11-05 1f26c30a8d1c5e3d9ab262b382284c8ea96f29b2
src/layout/navBars/breadcrumb/user.vue
@@ -1,23 +1,24 @@
<template>
    <div class="layout-navbars-breadcrumb-user pr15" :style="{ flex: layoutUserFlexNum }">
        <div class="logo">
            <img @click="toHome" src="../../../assets/menu/companyLogo.png" />
            <span>{{ systemName }}</span>
<!--            <img @click="toHome" src="../../../assets/menu/company.png" />-->
            <img src="../../../assets/menu/company.png" />
<!--            <span>{{ 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>
                </div>
                <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="small" :disabled="disabledSize === 'small'">{{ $t('message.user.dropdownSmall') }}</el-dropdown-item>
                    </el-dropdown-menu>
                </template>
            </el-dropdown>
<!--            <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>-->
<!--                </div>-->
<!--                <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="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>-->
@@ -57,7 +58,7 @@
            </div>
            <el-dropdown :show-timeout="70" :hide-timeout="50" @command="onHandleCommandClick">
                <span class="layout-navbars-breadcrumb-user-link">
                    <img src="../../../assets/avator.png" class="layout-navbars-breadcrumb-user-link-photo mr5" style="width: 24px;height: 24px"/>
                    <img src="../../../assets/menu/icon.jpg" class="layout-navbars-breadcrumb-user-link-photo mr5" style="width: 24px;height: 24px"/>
                    {{ userInfos.userName }}
                    <el-icon class="el-icon--right">
                        <ele-ArrowDown />
@@ -65,8 +66,8 @@
                </span>
                <template #dropdown>
                    <el-dropdown-menu>
                        <el-dropdown-item command="/newMenu">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
                        <!--                    <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item>-->
                        <el-dropdown-item command="/project">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
                        <el-dropdown-item @click="openResetPwd">修改密码</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>-->
@@ -74,6 +75,7 @@
                    </el-dropdown-menu>
                </template>
            </el-dropdown>
            <reset-pwd ref="pwdRef"></reset-pwd>
            <Search ref="searchRef" />
        </div>
    </div>
@@ -102,10 +104,11 @@
import { dynamicRoutes } from '/@/router/route';
import Cookies from 'js-cookie';
import {useRoutesList} from "/@/stores/routesList";
import ResetPwd from "/@/views/system/user/component/resetPwd.vue";
export default defineComponent({
    name: 'layoutBreadcrumbUser',
    components: { UserNews, Search },
    components: { UserNews, Search, ResetPwd},
    setup() {
        const { t } = useI18n();
        const { proxy } = <any>getCurrentInstance();
@@ -116,6 +119,7 @@
        const { userInfos } = storeToRefs(stores);
        const { themeConfig } = storeToRefs(storesThemeConfig);
        const searchRef = ref();
        const pwdRef = ref()
        const state = reactive({
            isScreenfull: false,
            disabledI18n: 'zh-cn',
@@ -176,7 +180,7 @@
                })
                    .then(async () => {
                        let res = await useLoginApi().signOut();
                        if (res.data.code === '200') {
                        if (res.data.code === 100) {
                            Session.clear(); // 清除缓存/token等
                            // 使用 reload 时,不需要调用 resetRoute() 重置路由
                            window.location.reload();
@@ -198,6 +202,10 @@
        const onSearchClick = () => {
            searchRef.value.openSearch();
        };
        const openResetPwd = () => {
          pwdRef.value.openDialog()
        }
        // 组件大小改变
        const onComponentSizeChange = (size: string) => {
            Local.remove('themeConfig');
@@ -257,17 +265,16 @@
            const res = await menuApi.getMenuAdmin(Cookies.get('projectId') === null ? '' : Cookies.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: 'newMenu' }).then(()=>{
                routeList.routesList.value = []
                console.log(routeList);
            });
        };
        // const backToMenu = () => {
        //     router.push({ path: 'newMenu' }).then(()=>{
        //         routeList.routesList.value = []
        //         console.log(routeList);
        //     });
        // };
        const toHome = () => {
            router.push({ path: 'newMenu' });
        };
@@ -281,8 +288,8 @@
        });
        return {
            userInfos,
            backToMenu,
            toHome,
            openResetPwd,
            onLayoutSetingClick,
            onHandleCommandClick,
            onScreenfullClick,
@@ -290,6 +297,7 @@
            onComponentSizeChange,
            onLanguageChange,
            searchRef,
            pwdRef,
            layoutUserFlexNum,
            ...toRefs(state)
        };
@@ -302,7 +310,7 @@
        .logo{
            img {
                height: 100%;
                cursor: pointer;
                //cursor: pointer;
            }
            span{
                font-size: 32px;
@@ -327,7 +335,7 @@
        .logo{
            img {
                height: 90%;
                cursor: pointer;
                //cursor: pointer;
            }
            span{
                font-size: 28px;
@@ -353,7 +361,7 @@
            img {
                width: 60%;
                height: auto;
                cursor: pointer;
                //cursor: pointer;
            }
            span{
                font-size: 22px;