1. 新增登录页面 2. 新增登录接口 3. 新增stores/userToken.js 保存登录状态登录和退出登录 和 stores/activeC...

hcong

2024-11-28 07b5dcb4905a15d0b39a51219d51c57fbd5ca4d1

 src/components/core/Header.vue

@@ -1,40 +1,44 @@
<template>
  <el-row align="middle" class="header">
    <el-col :span="1">
      <el-button
        @click="collapsedSider"
        icon="Fold"
        circle
        :class="rotateIcon"
      />
    <el-col :span="12">
      <el-space>
        <el-button @click="collapsedSider" icon="Fold" circle :class="rotateIcon" />
        <el-breadcrumb separator="/" style="white-space: nowrap">
          <el-breadcrumb-item v-for="(t, i) in navTitles" :key="i">{{ t }}</el-breadcrumb-item>
        </el-breadcrumb>
      </el-space>
    </el-col>
    <el-col :span="18">
      <el-breadcrumb separator="/" style="white-space: nowrap;">
        <el-breadcrumb-item v-for="(t, i) in navTitles" :key="i">{{t}}</el-breadcrumb-item>
      </el-breadcrumb>
    </el-col>
    <el-col :span="5" class="logout">
        <el-button icon="SwitchButton">退出登录</el-button>
    <el-col :span="12" class="logout">
      <FYBgTaskDialog></FYBgTaskDialog>
      <el-button icon="SwitchButton" @click="logout">退出登录</el-button>
    </el-col>
  </el-row>
</template>

<script>
import { useUserStore } from '@/stores/userToken'
import { useRouter } from 'vue-router';
import { ElNotification } from 'element-plus';
export default {
  setup() {
    const userStore = useUserStore()
    const router = useRouter()
    return { userStore, router }
  },
  name: 'CoreHeader',
  props: {
    collapse: {
      type: Boolean,
      default: false,
      default: false
    },
    navTitles: {
      type: Array,
      default: () => ['home','promotion list', 'promotion detail'],
      default: () => ['home', 'promotion list', 'promotion detail']
    }
  },
  data() {
    return {
      isCollapsed: this.collapse,
      isCollapsed: this.collapse
    };
  },
  watch: {},
@@ -44,7 +48,7 @@
     */
    rotateIcon() {
      return ['menu-icon', this.isCollapsed ? 'rotate-icon' : ''];
    },
    }
  },
  methods: {
    /**
@@ -54,7 +58,18 @@
      this.isCollapsed = !this.isCollapsed;
      this.$emit('collapsedSider', this.isCollapsed);
    },
  },
    logout() {
      this.userStore.logout()
      this.router.push('/common/loginView')
      ElNotification({
        title: `退出成功`,
        message: `退出成功`,
        type: 'success',
        // offset: 170,
        position: 'bottom-left',
      });
    }
  }
};
</script>