小白做毕设——vue管理系统速成

于 2024-08-20 10:00:00 发布
阅读量322 收藏 5
点赞数 10
分类专栏： Java 项目 文章标签： vue.js 课程设计 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/oageux/article/details/141265401
版权

盒子模型拆分网页

image.png

官网菜单效果

image.png
image.png
当且仅当标签是 el-menu-item 的时候，index 才会生效

$route.path 是当前浏览器正在访问的路由
格式： /xxx
image.png

padding: 20
icon: width 24 + margin 5
20 + 24 + 5 = 49

image.png

我们要实现的效果

image.png

布局

logo
logo1.png

设置
菜单高亮颜色：image.png** **#1890ff
一级菜单颜色：image.png #001529
二级菜单颜色：image.png #000c17

菜单和头部阴影

box-shadow: 2px 0 6px rgba(0,21,41,.35);

整体框架

<el-container>
    <el-aside>
	</el-aside>

 	<el-container>
    	<el-header>
		</el-header>

    	<el-main>
    	</el-main>
 	</el-container>
</el-container>

logo

<div style="height: 60px; line-height: 60px; font-size: 20px; display: flex; align-items: center; justify-content: center">
  <img src="@/assets/logo1.png" style="width: 30px;" alt="">
  <span class="logo-title" v-show="!isCollapse">Honey2024</span>
</div>

菜单

<el-menu router :collapse="isCollapse" :collapse-transition="false" background-color="#001529"
         active-text-color="#fff" text-color="rgba(255, 255, 255, 0.65)" :default-active="$route.path"
         style="border: none">
  <el-menu-item index="/">
    <i class="el-icon-s-home"></i>
    <span slot="title">系统首页</span>
  </el-menu-item>
  <el-submenu index="2">
    <template slot="title"><i class="el-icon-menu"></i><span>信息管理</span></template>
    <el-menu-item index="/user">用户管理</el-menu-item>
    <el-menu-item index="/admin">管理员管理</el-menu-item>
  </el-submenu>
</el-menu>

菜单样式

<style>
.el-submenu__title {
  height: 40px !important;
  line-height: 40px !important;
  padding: 0 25px !important;
  transition: color 0s;
}
.el-menu-item {
  min-width: 0 !important;
  width: calc(100% - 10px);
  margin: 5px;
  height: 40px !important;
  line-height: 40px !important;
  border-radius: 5px;
}

.el-menu--inline, .el-menu-item {
  background-color: #000c17 !important;
}


.el-submenu__title>i:nth-child(1) {
  margin-top: 2px;
}
.el-submenu__title>i.el-submenu__icon-arrow {
  margin-top: -5px;
}

.el-menu--inline>.el-menu-item {
  padding-left: 50px !important;
}
.el-menu-item.is-active {
  background-color: dodgerblue !important;
}

.el-menu-item:hover {
  color: #fff !important;
}

.el-submenu__title:hover *, .el-submenu__title:hover {
  color: #fff !important;
}

.el-aside {
  box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
  background-color: #001529;
  color: #fff;
  min-height: 100vh;
  transition: width .3s;
}
.el-menu--collapse .el-submenu__title {
  padding: 0 20px !important;
}
.el-menu--collapse .el-tooltip {
  padding: 0 15px !important;
}
.logo-title {
  margin-left: 5px;
  transition: all .3s;
}
</style>

头部布局
左侧

<i :class="collapseIcon" @click="handleCollapse" style="font-size: 26px"></i>
    <el-breadcrumb separator="/" style="margin-left: 20px">
    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
    <el-breadcrumb-item :to="{ path: '/' }">课程管理</el-breadcrumb-item>
</el-breadcrumb>

右侧

<div style="flex: 1; display: flex; justify-content: flex-end; align-items: center">
    <i class="el-icon-quanping" @click="handleFullScreen" style="font-size: 25px"></i>
    <el-dropdown placement="bottom">
      <div style="display: flex; align-items: center; cursor: pointer">
        <img src="@/assets/logo1.png" alt="" style="width: 40px; height: 40px; margin: 0 5px">
        <span>管理员</span>
      </div>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item>个人信息</el-dropdown-item>
        <el-dropdown-item>修改密码</el-dropdown-item>
        <el-dropdown-item>退出登录</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
</div>

iconfont 自定义图标

设置
image.pngimage.png
下载后解压，拷贝这几个文件到你项目 css 静态目录下
image.png
在 main.js 里引入 iconfont.css 即可

主题色设置

https://element.eleme.cn/#/zh-CN/theme
image.png
直接复制 theme 文件夹到项目里，在 mian.js 里引入即可

直播后的完整代码

<template>
  <div>
    <el-container>
      <!--    侧边栏  -->
      <el-aside :width="asideWidth" style="min-height: 100vh; background-color: #001529">
        <div style="height: 60px; color: white; display: flex; align-items: center; justify-content: center">
          <img src="@/assets/logo1.png" alt="" style="width: 40px; height: 40px">
          <span class="logo-title" v-show="!isCollapse">honey2024</span>
        </div>

        <el-menu :collapse="isCollapse" :collapse-transition="false" router background-color="#001529" text-color="rgba(255, 255, 255, 0.65)" active-text-color="#fff" style="border: none" :default-active="$route.path">
          <el-menu-item index="/">
            <i class="el-icon-menu"></i>
            <span slot="title">系统首页</span>
          </el-menu-item>
          <el-menu-item index="/1">
            <i class="el-icon-house"></i>
            <span slot="title">系统首页</span>
          </el-menu-item>
          <el-menu-item index="/2">
            <i class="el-icon-house"></i>
            <span slot="title">系统首页</span>
          </el-menu-item>
          <el-submenu index="3">
            <template slot="title">
              <i class="el-icon-menu"></i>
              <span>信息管理</span>
            </template>
            <el-menu-item>用户信息</el-menu-item>
            <el-menu-item>管理员信息</el-menu-item>
            <el-menu-item index="/">系统首页</el-menu-item>
          </el-submenu>
        </el-menu>

      </el-aside>

      <el-container>
        <!--        头部区域-->
        <el-header>

          <i :class="collapseIcon" style="font-size: 26px" @click="handleCollapse"></i>
          <el-breadcrumb separator-class="el-icon-arrow-right" style="margin-left: 20px">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/user' }">用户管理</el-breadcrumb-item>
          </el-breadcrumb>

          <div style="flex: 1; width: 0; display: flex; align-items: center; justify-content: flex-end">
            <i class="el-icon-quanping" style="font-size: 26px" @click="handleFull"></i>
            <el-dropdown placement="bottom">
              <div style="display: flex; align-items: center; cursor: default">
                <img src="@/assets/logo1.png" alt="" style="width: 40px; height: 40px; margin: 0 5px">
                <span>管理员</span>
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item>个人信息</el-dropdown-item>
                <el-dropdown-item>修改密码</el-dropdown-item>
                <el-dropdown-item @click="">退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>

        </el-header>

        <!--        主体区域-->
        <el-main>
          <div style="box-shadow: 0 0 10px rgba(0,0,0,.1); padding: 10px 20px; border-radius: 5px; margin-bottom: 10px">
            早安，骚年，祝你开心每一天！
          </div>
          <el-card style="width: 500px">
            <div slot="header" class="clearfix">
              <span>青哥哥带你做毕设2024</span>
            </div>
            <div>
              2024毕设正式开始了！青哥哥带你手把手敲出来！
              <div style="margin-top: 20px">
                <div style="margin: 10px 0"><strong>主题色</strong></div>
                <el-button type="primary">按钮</el-button>
                <el-button type="success">按钮</el-button>
                <el-button type="warning">按钮</el-button>
                <el-button type="danger">按钮</el-button>
                <el-button type="info">按钮</el-button>
              </div>
            </div>
          </el-card>
        </el-main>

      </el-container>


    </el-container>
  </div>
</template>

<script>

export default {
  name: 'HomeView',
  data() {
    return {
      isCollapse: false,  // 不收缩
      asideWidth: '200px',
      collapseIcon: 'el-icon-s-fold'
    }
  },
  methods: {
    handleFull() {
      document.documentElement.requestFullscreen()
    },
    handleCollapse() {
      this.isCollapse = !this.isCollapse
      this.asideWidth = this.isCollapse ? '64px' : '200px'
      this.collapseIcon = this.isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'
    }
  }
}
</script>

<style>
.el-menu--inline {
  background-color: #000c17 !important;
}
.el-menu--inline .el-menu-item {
  background-color: #000c17 !important;
  padding-left: 49px !important;
}
.el-menu-item:hover, .el-submenu__title:hover {
  color: #fff !important;
}
.el-submenu__title:hover i {
  color: #fff !important;
}
.el-menu-item:hover i {
  color: #fff !important;
}
.el-menu-item.is-active {
  background-color: #1890ff !important;
  border-radius: 5px !important;
  width: calc(100% - 8px);
  margin-left: 4px;
}
.el-menu-item.is-active i, .el-menu-item.is-active .el-tooltip{
  margin-left: -4px;
}
.el-menu-item {
  height: 40px !important;
  line-height: 40px !important;
}
.el-submenu__title {
  height: 40px !important;
  line-height: 40px !important;
}
.el-submenu .el-menu-item {
  min-width: 0 !important;
}
.el-menu--inline .el-menu-item.is-active {
  padding-left: 45px !important;
}
/*.el-submenu__icon-arrow {*/
/*  margin-top: -5px;*/
/*}*/

.el-aside {
  transition: width .3s;
  box-shadow: 2px 0 6px rgba(0,21,41,.35);
}
.logo-title {
  margin-left: 5px;
  font-size: 20px;
  transition: all .3s;   /* 0.3s */
}
.el-header {
  box-shadow: 2px 0 6px rgba(0,21,41,.35);
  display: flex;
  align-items: center;
}
</style>

备课的布局完整代码

<template>
  <div>
    <el-container>
      <el-aside :width="asideWidth">
        <div style="height: 60px; line-height: 60px; font-size: 20px; display: flex; align-items: center; justify-content: center">
          <img src="@/assets/logo1.png" style="width: 30px;" alt="">
          <span class="logo-title" v-show="!isCollapse">Honey2024</span>
        </div>
        <el-menu router :collapse="isCollapse" :collapse-transition="false" background-color="#001529"
                 active-text-color="#fff" text-color="rgba(255, 255, 255, 0.65)" :default-active="$route.path"
                 style="border: none">
          <el-menu-item index="/">
            <i class="el-icon-s-home"></i>
            <span slot="title">系统首页</span>
          </el-menu-item>
          <el-submenu index="2">
            <template slot="title"><i class="el-icon-menu"></i><span>信息管理</span></template>
            <el-menu-item index="/user">用户管理</el-menu-item>
            <el-menu-item index="/admin">管理员管理</el-menu-item>
          </el-submenu>
        </el-menu>
      </el-aside>

      <el-container>
        <el-header style="height: 60px; line-height: 60px; display: flex; align-items: center; box-shadow: 2px 0 6px rgba(0, 21, 41, .35);">
          <i :class="collapseIcon" @click="handleCollapse" style="font-size: 26px"></i>
          <el-breadcrumb separator="/" style="margin-left: 20px">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/' }">课程管理</el-breadcrumb-item>
          </el-breadcrumb>

          <div style="flex: 1; display: flex; justify-content: flex-end; align-items: center">
            <i class="el-icon-quanping" @click="handleFullScreen" style="font-size: 25px"></i>
            <el-dropdown placement="bottom">
              <div style="display: flex; align-items: center; cursor: pointer">
                <img src="@/assets/logo1.png" alt="" style="width: 40px; height: 40px; margin: 0 5px">
                <span>管理员</span>
              </div>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item>个人信息</el-dropdown-item>
                <el-dropdown-item>修改密码</el-dropdown-item>
                <el-dropdown-item>退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
        </el-header>

        <el-main>
          <div style="box-shadow: 0 0 10px rgba(0,0,0,.1); padding: 10px 20px; border-radius: 5px; margin-bottom: 10px">
            早安，骚年，祝你开心每一天！
          </div>
          <el-card style="width: 500px">
            <div slot="header" class="clearfix">
              <span>青哥哥带你做毕设2024</span>
            </div>
           <div>
             2024毕设正式开始了！青哥哥带你手把手敲出来！
             <div style="margin-top: 20px">
               <div style="margin: 10px 0"><strong>主题色</strong></div>
               <el-button type="primary">按钮</el-button>
               <el-button type="success">按钮</el-button>
               <el-button type="warning">按钮</el-button>
               <el-button type="danger">按钮</el-button>
               <el-button type="info">按钮</el-button>
             </div>
           </div>
          </el-card>
<!--          <el-table stripe :header-cell-style="{ backgroundColor: 'aliceblue', fontWeight: 'bold', color: '#333' }">-->
<!--            <el-table-column label="姓名" align="center"></el-table-column>-->
<!--            <el-table-column label="电话" align="center"></el-table-column>-->
<!--            <el-table-column label="邮箱" align="center"></el-table-column>-->
<!--            <el-table-column label="地址" align="center"></el-table-column>-->
<!--          </el-table>-->
        </el-main>
      </el-container>
    </el-container>

  </div>
</template>

<script>

export default {
  name: 'HomeView',
  data() {
    return {
      isCollapse: false,
      asideWidth: '200px',
      collapseIcon: 'el-icon-s-fold'
    }
  },
  mounted() {

  },
  methods: {
    handleFullScreen() {
      document.documentElement.requestFullscreen()
    },
    handleCollapse() {
      this.isCollapse = !this.isCollapse
      this.asideWidth = this.isCollapse ? '64px' : '200px'
      this.collapseIcon = this.isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold'
    }
  }
}
</script>

<style>
.el-menu--inline, .el-menu-item {
  background-color: #000c17 !important;
}

.el-submenu__title {
  height: 40px !important;
  line-height: 40px !important;
  padding: 0 25px !important;
  transition: color 0s;
}
.el-menu--collapse .el-submenu__title {
  padding: 0 20px !important;
}
.el-submenu__title>i:nth-child(1) {
  margin-top: 2px;
}
.el-submenu__title>i.el-submenu__icon-arrow {
  margin-top: -5px;
}
.el-menu-item {
  min-width: 0 !important;
  width: calc(100% - 10px);
  margin: 5px;
  height: 40px !important;
  line-height: 40px !important;
  border-radius: 5px;
}
.el-menu--inline>.el-menu-item {
  padding-left: 50px !important;
}
.el-menu-item.is-active {
  background-color: dodgerblue !important;
}

.el-menu-item:hover {
  color: #fff !important;
}

.el-submenu__title:hover *, .el-submenu__title:hover {
  color: #fff !important;
}

.el-aside {
  box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
  background-color: #001529;
  color: #fff;
  min-height: 100vh;
  transition: width .3s;
}
.el-menu--collapse .el-tooltip {
  padding: 0 15px !important;
}
.logo-title {
  margin-left: 5px;
  transition: all .3s;
}
.el-menu {
  transition: all .3s;
}
</style>
Gao_雪
关注
  • 10
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue项目实战 —— 后台管理系统( pc端 ) 第一篇
技术前端，忠于热爱 @0.活在风浪里
05-15 1万+
此典型项目，与企业级开发很是接近！掌握即可领悟雷电，如果你是大学生，它完全可以作为你毕业设计，毕竟你确实写过，项目开发全程采用组件化思想。 适合谁 1 、大学即将毕业 或者 自学前端 缺乏项目经验的 2 、入职以后需要做vue 后台管理系统的 3 、后端开发 没有前端经验 要做vue + java 后台管理项目的 4、缺乏vue实战项目经验 基础不是很好的 本教程非常的详细 每一步都总结在md文档里面
基于Vue+Nodejs实现宿舍管理系统
软件开发实战项目分享
01-05 3万+
考虑到实用性，该系统需要拆分为两大子系统，一个是学生端系统，一个是后台管理端系统。学生端系统主要提供给学生使用，负责一些宿舍记录及个人信息记录的基本操作；后台管理模块则是主要负责对所有学生信息的整理，提供宿舍管理、楼层管理、数据查看等权限，提供给宿舍管理员使用的。
毕设——基于SpringBoot的电影荐评系统
RuiMa的博客
07-22 1万+
毕设——基于SpringBoot的电影荐评系统一、项目展示二、准备工作1. 学习Java Web开发相关知识2. 安装软件配置环境(1) 安装IDEA(2) 配置数据库环境(3) 安装数据库可视化工具三、项目开发过程四、主要功能点实现 之前做的人工智能和深度学习方向的期末课题一直想写博客记录一下来着，无奈时间安排上的不足未曾实现，分别是基于深度学习的图像识别系统和基于YOLOv3的人体口罩佩戴检测系统，如果大家感兴趣的话可以找我一起聊聊。转入正题，大四之前的想法一直都是想做关于深度学习的毕设课题，但在大学期
一个基于SpringBoot+vue的学生信息管理系统详细设计
热门推荐
java李阳勇的博客
12-01 5万+
主要功能：用户登录、用户管理、角色、菜单、灵活控制、sql监控、日志、老师、学生、班级、课程、选课、打分、成绩、新闻、通知公告、附件查看下载等功能
vue做图片裁剪——vue-cropper
Lora_0925的博客
06-20 2592
这里使用的是vue-cropper 官方文档以及案例在这里先安装 裁剪图片组件注意事项：1.代码中设置的是只有正确的url是才展示，裁剪组件2.需要给容器固定高度3.props传值可自行加减 具体使用（这里使用的是antd） 效果图...
详细介绍 Vue3 的 watch 和 watchEffect
weixin_52648900的博客
08-15 962
非常详细介绍了vue3的watch和watchEffect区别和联系
Element-04.组件-Dialog对话框
程小白的博客
08-16 282
【代码】Element-04.组件-Dialog对话框。
element table 判断当前行是否展开和只展开一行
m0_68716504的博客
08-15 438
element组件提供了table的展开和收起功能，并提供了expand-change事件用来监听table行的展开和收起在一些特殊情况下如：处理异步数据时，希望展开行时请求接口，关闭行时不用请求，但是expand-change，无论是展开还是收起都会触发，于是就希望能有一个类似isExpended布尔类型的状态属性来判断是否调用接口。
Vue 生命周期详解含demo、面试常问问题案例
qq_34419312的博客
08-16 1109
Vue 生命周期详解、面试常问问题案例 含 demo
【前端】VUE动态引入组件 通过字符串动态渲染模板 动态生成组件
最新发布
我是Superman丶的博客
08-19 61
【前端】VUE动态引入组件 通过字符串动态渲染模板。
【vue3】组件通信
aaaa_aaab的博客
08-19 444
1. 概述：自定义事件常用于：**子 => 父。**2. 注意区分好：原生事件、自定义事件。● 原生事件：● 事件名是特定的（ click 、 mosueenter 等等）● 事件对象 $event : 是包含事件相关信息的对象（ pageX 、 pageY 、 target 、 keyCode ）● 自定义事件：● 事件名是任意名称● 事件对象 $event : 是调用 emit 时所提供的数据，可以是任意类型！！！--在父组件中，给子组件绑定自定义事件：-->
el-date-picker根据某个时间动态规定可选的的时间范围
weixin_58129544的博客
08-19 236
/ 开始时间30天后的时间。例如：开始时间为2024-8-19，规定可循范围为30天的话，可选范围是2024-8-19至2024-9-19号之间。el-date-picker组件根据某一个时间段来动态规定当前时间选择的日期时间范围。
Vue 3的Computed属性
计算机图形学
08-15 434
Vue 3的组合式API为Computed属性的使用带来了新的变化和可能性。通过computed函数，开发者可以轻松地创建只读或可写的Computed属性，并在组件中高效地处理响应式数据。合理使用Computed属性，可以使代码更加简洁、清晰和高效。
Vue 3 组合式 API 中的 nextTick 深入解析
计算机图形学
08-19 211
nextTick是 Vue 3 中一个非常重要的函数，它允许开发者在 DOM 更新后执行特定的回调函数。通过理解其基本用法、实现原理和应用场景，我们可以更有效地利用 Vue 的响应式系统，编写出更高效、更稳定的代码。希望本文能帮助你深入理解 Vue 3 中的nextTick函数。
vue3中子向父传数据
m0_61265297的博客
08-15 162
父组件首先，我们创建一个父组件，名为代码解释1，在 <template> 部分，我们展示父组件的数据 receivedData，并通过自定义事件 sendData 来接收子组件传递的数据。2，在 <script setup> 部分，我们引入了Vue3的 ref 来创建响应式变量 receivedData。3，updateData 方法用于更新接收到的数据。4，我们通过引入并使用子组件 ChildComponent，同时监听其 sendData 事件并调用 updateData 方法。
使用el-menu跳转时偶尔会出现路由已经变了，但是页面却显示空白的情况
qq_49080239的博客
08-15 321
我改的期间发现，是上一个跳转的组件如果出现template里包了多个标签，那么下一个组件就会变成空白。所以当你发现有一个页面跳转出错，但是怎么也找不到错误时，那你就去看看它的上一个跳转的页面是不是存在错误。刚开始我以为是我数据加载的问题，后来又看有人说是template里不能包多个div，但我去看我出错的组件，并没有出现两个div。后来我就把每个都给改了，即使是elemen-ui的标签也全部改在一个div里，就发现没问题了。
Nuxt3【文件路由】pages 详解（含Nuxt3中的路由管理）
朝阳39的博客
08-16 1062
在 pages 文件夹中定义页面，支持 .vue、.js、.jsx、.mjs、.ts 或 .tsx注意事项：页面仅能有一个根元素（HTML 注释也被视为元素）< template > < h1 > 首页 < template > < h1 > 首页 < h1 > 首页
88.SAPUI5 Model Binding的问题-在view更改数据，model却不变
智盟科技智能制造团队的博客
08-15 398
在做一个UI5项目，后台读取sap.ui.model.Model后，把数据绑定到view的table里，在table更改数据，后台取sap.ui.model.Model后，数据没有改变，仍然保持当初从后台读取过来的值。后台同事问了一句，是不是和绑定模式有关。进而调查到model的最初绑定的代码段，果然发现绑定的是OneWay模式，更改后TwoWay后，问题得到解决。BindingMode双向意味着从模型到视图，反之亦然。BindingMode单向表示从模型到视图。我们研究了好长时间，没找到症结。
vue导出excel
wodecc_u的博客
08-19 58
对应的版本号，如果新版本出了问题，就安装对应版本。
vue毕设学生宿舍管理系统源码
10-10
Vue毕设学生宿舍管理系统源码是一个基于Vue框架开发的学生宿舍管理系统的源代码。该系统主要用于实现学生宿舍的管理和信息化管理，方便学校管理学生宿舍的各项事务。 该系统的源码主要分为前端和后端两部分。前端部分采用了Vue框架，使用了Vue的组件化开发，项目结构清晰，便于开发和维护。前端页面使用了HTML、CSS和JavaScript等技术，通过Vue的数据绑定和组件通信来实现页面的动态展示和交互。 后端部分使用了Node.js作为服务器端运行环境，并结合了Express框架搭建了后端接口。后端主要负责处理前端请求，与数据库进行数据交互，实现数据的增删改查等操作。数据库采用了MySQL数据库，存储了学生宿舍的相关信息，包括学生信息、宿舍楼信息、宿舍房间信息等。 该系统实现了学生信息的管理，包括学生的基本信息录入、修改和查询功能。另外还实现了宿舍楼和宿舍房间的管理，包括宿舍楼信息和宿舍房间信息的录入、修改和查询功能。通过该系统，学校可以方便地管理学生宿舍，包括学生的住宿情况、宿舍楼的使用情况等。 总之，Vue毕设学生宿舍管理系统源码是一个使用Vue框架开发的学生宿舍管理系统的源代码，通过前后端交互实现了学生信息和宿舍信息的管理。这个系统可以帮助学校更方便地管理学生宿舍，提高管理效率。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值