原创

基于java SpringBoot和Vue uniapp的校园信息交流小程序毕业设计,附源码

所用技术

后端使用JAVA语言的SpringBoot框架,MySQL数据库,Maven依赖管理等技术;

前端使用Vue.js语法的uniapp框架,可以发布成微信小程序。

功能介绍

学生用户功能

校园动态:学校通知、各院动态、就业通知、大赛宣传;

校园社区:社团活动、互动中心(表白墙、校内互助、跳蚤市场);

消息订阅:我发布的、我评论的、回复我的;

个人中心:微信授权登录、学生认证、清除缓存、关于小程序。

管理端功能

管理员可以对以上信息进行管理,增删改查等。

部分代码展示

<template>
    <view>
        <u-navbar :is-back="false" title=" " :border-bottom="false">
            <view class="u-flex u-row-right" style="width: 100%;">
                <view class="camera u-flex u-row-center">

                </view>
            </view>
        </u-navbar>
        <view class="u-flex user-box u-p-l-30 u-p-r-20 u-p-b-30">
            <view class="u-m-r-10">
                <u-avatar :src="pic" size="140"></u-avatar>
            </view>
            <view class="u-flex-1">
                <view class="u-font-18 u-p-b-20">{{nick}}</view>
                <view class="u-font-14 u-tips-color">学号:{{userNo}}</view>
                <view class="u-font-14 u-tips-color">身份:{{admin ? '管理员':(userInfo.token ? '学生':'游客,请完成学生认证明')}}</view>
            </view>
            <!-- <view class="u-m-l-10 u-p-10">
                <u-icon name="scan" color="#969799" size="28"></u-icon>
            </view> -->
            <!-- <view class="u-m-l-10 u-p-10">
                <u-icon name="arrow-right" color="#969799" size="28"></u-icon>
            </view> -->
        </view>

        <view class="u-m-t-20">
            <u-cell-group>
                <u-cell-item :iconStyle="{color:'#3f80de'}" @click="showInfo" icon="lock-fill" title="授权登录">
                </u-cell-item>
                <u-cell-item :iconStyle="{color:'#3f80de'}" @click="checkStudent" icon="man-add-fill" title="学生认证"></u-cell-item>

                <u-cell-item :iconStyle="{color:'#3f80de'}" @click="clear" icon="man-add-fill" title="清除缓存"></u-cell-item>
                <u-cell-item :iconStyle="{color:'#3f80de'}" @click="showAppInfo" icon="question-circle-fill" title="关于小程序"></u-cell-item>
            </u-cell-group>
        </view>

        <!-- <view class="u-m-t-20">
            <u-cell-group>
                <u-cell-item :iconStyle="{color:'#3f80de'}" icon="setting" title="设置"></u-cell-item>
            </u-cell-group>
        </view> -->

        <u-popup v-model="showModel" mode="center" border-radius="14" width="600">
            <view class="c-model-view u-p-25">

                <u-field v-model="student.name" label="姓名" placeholder="请填写姓名"></u-field>
                <u-field v-model="student.userNo" label="学号" type="number" placeholder="请填写学号"></u-field>
                <u-field v-model="selObj.label" @click="show = true" :disabled="true"  label="院系" placeholder="请选择院系"></u-field>
                <u-field v-model="student.project" label="专业" placeholder="请填写专业"></u-field>
                <u-field v-model="student.phone" type="number" label="手机号" placeholder="请选择手机号"></u-field>

                <text class="u-p-10 u-tips-color">认证后请返回首屏重新授权</text>

                <u-button type="primary" class="u-m-t-50" @click="submitCheck"  :ripple="true">认证
                      </u-button>
            </view>
        </u-popup>

        <u-select @confirm="selConfirm" v-model="show" :list="deptList"></u-select>

    </view>
</template>

演示视频

源码链接

正文到此结束
本文目录