餐饮后台管理系统

最新推荐文章于 2025-03-13 11:33:23 发布

程序猿_“大神”

最新推荐文章于 2025-03-13 11:33:23 发布

阅读量2.8k

点赞数 5

文章标签： echarts 前端 javascript vue.js

本文链接：https://blog.csdn.net/dyx001007/article/details/128334079

版权

本文详细介绍了基于vue2的餐饮后台管理系统，包括项目介绍、技术栈、鉴权、退出登录、数据分析、用户列表、订单页面、菜单管理等模块。重点讲述了axios的二次封装、Echarts图表配置、图片上传等难点的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、项目介绍：

用于每天的菜品数据分析，客户的管理，员工的管理，查看订单信息，菜品的添加或者下架管理

二、项目使用技术栈：

vue2全家桶、element-ui、axios、js、es6、echarts

三、主页效果图：

四、二次封装axios：

这个项目的token需要加密，这里用到了Base64，

下载方式：npm install -- save js-base64

import axios from "axios";
import { Message, Loading } from 'element-ui';
import router from "../router"
import { Base64 } from 'js-base64'
// 封装loading开启和结束函数
let loading;
const baseUrl = 'https://meituan.thexxdd.cn/apit'
function startLoading(){
  loading = Loading.service({
    lock:true,
    text:'拼命加载中...',
    background:'rgba(0,0,0,0.7)'
  })
}
function endLoading(){
  loading.close()
}

function getToken() {
  const token = localStorage.Token || ''
  //后端和前端的约定 
  const base64_token = Base64.encode(token + ':')
  return 'Basic ' + base64_token
}

 
//1: 创建axios实例
const service = axios.create({
  //基地址
  baseURL:baseUrl,
  //baseURL:env.dev.baseUrl,
  settimeout: 5000,
});

//2:请