jiaqingjiayi-Web/src/views/layout/menu/index.vue

<template>
  <el-menu
      active-text-color="#ffd04b"
      background-color="#2d3a4b"
      class="el-menu-vertical-demo"
      default-active="home"
      text-color="#fff"
      router
  >
    <el-menu-item index="welcome">
      <el-icon><home-filled /></el-icon>
      <span>Welcome</span>
    </el-menu-item>
    <el-menu-item index="home">
      <el-icon><home-filled /></el-icon>
      <span>首页</span>
    </el-menu-item>
<!--    <el-menu-item index="display">-->
<!--      <el-icon><tickets /></el-icon>-->
<!--      <span>数据展示</span>-->
<!--    </el-menu-item>-->
    <el-menu-item index="user">
      <el-icon><user /></el-icon>
      <span >用户管理</span>
    </el-menu-item>
    <el-sub-menu index="3">
      <template #title >
        <el-icon><management /></el-icon>
        <span>商家管理</span>
      </template>
      <el-menu-item index="business">
        <el-icon><management /></el-icon>
        <span>商家列表</span>
      </el-menu-item>
      <el-menu-item index="businesVerify" >
        <el-icon><management /></el-icon>
        <span>审核商家入驻</span>
      </el-menu-item>
    </el-sub-menu>
    <el-sub-menu index="6">
      <template #title >
        <el-icon><management /></el-icon>
        <span>商品管理</span>
      </template>
      <el-menu-item index="businessProduct">
        <el-icon><management /></el-icon>
        <span>商家商品</span>
      </el-menu-item>
      <el-menu-item index="productCategory">
        <el-icon><management /></el-icon>
        <span>商品分类</span>
      </el-menu-item>
      <el-menu-item index="product">
        <el-icon><management /></el-icon>
        <span>商品列表</span>
      </el-menu-item>

    </el-sub-menu>
    <el-sub-menu index="8">
      <template #title >
        <el-icon><tickets /></el-icon>
        <span>美甲师管理</span>
      </template>
      <el-menu-item index="employeeVerify">
        <el-icon><management /></el-icon>
        <span>审核美甲师认证</span>
      </el-menu-item>
      <el-menu-item index="employee">
        <el-icon><tickets /></el-icon>
        <span>美甲师列表</span>
      </el-menu-item>
    </el-sub-menu>

    <el-sub-menu index="9">
      <template #title >
        <el-icon><management /></el-icon>
        <span>订单管理</span>
      </template>
      <el-menu-item index="orderReservation">
        <el-icon><tickets /></el-icon>
        <span>上门预约</span>
      </el-menu-item>
      <el-menu-item index="order">
        <el-icon><tickets /></el-icon>
        <span>到店服务</span>
      </el-menu-item>
<!--      <el-menu-item index="order">-->
<!--        <el-icon><tickets /></el-icon>-->
<!--        <span>订单列表</span>-->
<!--      </el-menu-item>-->
    </el-sub-menu>


    <el-sub-menu index="10">
      <template #title >
        <el-icon><management /></el-icon>
        <span>评价管理</span>
      </template>
      <el-menu-item index="permission">
        <el-icon><tickets /></el-icon>
        <span>权限操作</span>
      </el-menu-item>
      <el-menu-item >
        <el-icon><tickets /></el-icon>
        <span>星级评优</span>
      </el-menu-item>
      <el-menu-item  index="rating">
        <el-icon><tickets /></el-icon>
        <span>评价列表</span>
      </el-menu-item>
    </el-sub-menu>


    <el-sub-menu index="11">
      <template #title >
        <el-icon><management /></el-icon>
        <span>系统管理</span>
      </template>
      <el-menu-item index="personal">
        <el-icon><House /></el-icon>
        <span>个人中心</span>
      </el-menu-item>
      <el-menu-item index="modifyPassword">
        <el-icon><edit /></el-icon>
        <span>修改密码</span>
      </el-menu-item>
      <el-menu-item >
        <el-icon @click="logout"><switch-button /></el-icon>
        <span @click="logout">安全退出</span>
      </el-menu-item>
    </el-sub-menu>
  </el-menu>
</template>
<script setup>
import
{HomeFilled,User,Tickets,Goods,DocumentAdd,Management,Setting,Edit,SwitchButton,House}
  from '@element-plus/icons-vue'
import { useStore } from 'vuex'
import axios from "@/util/axios";
import {ElMessage} from "element-plus";
const store=useStore();
const logout=async ()=>{
  store.dispatch('logout')
  let res= await axios.post("/user/logout")
  ElMessage.warning("退出成功");
  //console.log(res)
}
</script>
<style lang="scss" scoped>

</style>