# 简单外卖项目

**Repository Path**: final__fc/simple-takeaway-project

## Basic Information

- **Project Name**: 简单外卖项目
- **Description**: 若依项目生成学习，外卖项目，简单的菜品管理代码处理。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-02-25
- **Last Updated**: 2025-03-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<p align="center">
	<img alt="logo" src="https://oscimg.oschina.net/oscnet/up-d3d0a9303e11d522a06cd263f3079027715.png">
</p>
<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">RuoYi v3.8.9</h1>
<h4 align="center">基于SpringBoot+Vue前后端分离的Java快速开发框架</h4>
<p align="center">
	<a href="https://gitee.com/y_project/RuoYi-Vue/stargazers"><img src="https://gitee.com/y_project/RuoYi-Vue/badge/star.svg?theme=dark"></a>
	<a href="https://gitee.com/y_project/RuoYi-Vue"><img src="https://img.shields.io/badge/RuoYi-v3.8.9-brightgreen.svg"></a>
	<a href="https://gitee.com/y_project/RuoYi-Vue/blob/master/LICENSE"><img src="https://img.shields.io/github/license/mashape/apistatus.svg"></a>
</p>

## 页面调整

如果使用若依框架项目做为脚手架，那么我们肯定需要在页面显示中，符合自己公司或者项目的标识才行，需要更换的地方很多，我们依次来解决它

- 浏览器标签页logo标识、标题
- 系统页面中的logo标识、标题
- 去除源码地址 & 文档地址
- 主题风格和菜单图标
- 登录名称及背景图

![image-20240515211842252](assets/image-20240515211842252.png)   

![image-20240515211848147](assets/image-20240515211848147.png) 

### 浏览器标签页icon、标题

找到资料中的logo图标，替换前端项目中的public文件夹，删除原有的favicon.ico，把新拷贝过来的logo更名为favicon.ico即可

![image-20240503154918697](assets/image-20240503154918697.png) 

找到根目录下的index.html文件，把title更换为自己想要的内容即可

![image-20240503154945668](assets/image-20240503154945668.png) 

### 系统页面中的logo、标题

找到资料中的logo文件，替换 src/assets/logo/logo.png文件

![image-20240503155059313](assets/image-20240503155059313.png) 

若依的系统页面标题引用的是开发环境的配置，我们只需要修改开发的环境的VITE_APP_TITLE属性即可

![image-20240503155126721](assets/image-20240503155126721.png) 

### 去除源码 & 文档

![image-20240503155305048](assets/image-20240503155305048.png) 

### 主题和自定义图标

在目前的前端项目中，已经提供了非常便利的操作方式，可以切换主题的风格

操作：点击右上角的头像，可以找到**布局设置，**如下操作

![img](assets/17157783775591.png) 

在前端代码中也有对应的操作，更好主题风格文件位置：src/setting.js

![image-20240515210823709](assets/image-20240515210823709.png) 

更换主题颜色文件位置：src/store/modules/settings.js

![image-20240515210930466](assets/image-20240515210930466.png) 





访问阿里巴巴矢量图库，搜索图标：https://www.iconfont.cn/search/index?searchType=icon&q=%E8%8F%9C%E5%93%81%E7%AE%A1%E7%90%86

![image-20240515211041187](assets/image-20240515211041187.png) 

将下载好的图标复制到src/assets/icons/svg目录下，就可以给指定菜单设置图标了

![image-20240503155635595](assets/image-20240503155635595.png) 

### 登录页面中标题、背景图

登录名称和背景图，我们可以直接找到登录的组件进行修改即可

组件位置：src/views/login.vue

![image-20240510110514167](assets/image-20240510110514167.png) 

![image-20240503155545404](assets/image-20240503155545404.png)