Add activity pages for student and change the method of get list of teacher.
parent
9fc0e1b8e9
commit
cf8c20f4d6
@ -0,0 +1,39 @@
|
|||||||
|
package com.peteralbus.controller;
|
||||||
|
|
||||||
|
import com.peteralbus.entity.Activity;
|
||||||
|
import com.peteralbus.entity.User;
|
||||||
|
import com.peteralbus.service.ActivityService;
|
||||||
|
import com.peteralbus.util.PrincipalUtil;
|
||||||
|
import org.apache.shiro.SecurityUtils;
|
||||||
|
import org.apache.shiro.subject.Subject;
|
||||||
|
import org.springframework.beans.factory.annotation.Autowired;
|
||||||
|
import org.springframework.stereotype.Controller;
|
||||||
|
import org.springframework.web.bind.annotation.RequestMapping;
|
||||||
|
import org.springframework.web.servlet.ModelAndView;
|
||||||
|
|
||||||
|
import java.util.List;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The type Student controller.
|
||||||
|
* @author peteralbus
|
||||||
|
*/
|
||||||
|
@Controller
|
||||||
|
@RequestMapping("/student")
|
||||||
|
public class StudentController
|
||||||
|
{
|
||||||
|
@Autowired
|
||||||
|
ActivityService activityService;
|
||||||
|
@RequestMapping("/activities")
|
||||||
|
public ModelAndView activities()
|
||||||
|
{
|
||||||
|
ModelAndView modelAndView=PrincipalUtil.getBasicModelAndView();
|
||||||
|
Subject subject = SecurityUtils.getSubject();
|
||||||
|
User user=(User)subject.getPrincipal();
|
||||||
|
List<Activity> activityList=activityService.getActivityByStudent(user.getUserId());
|
||||||
|
modelAndView.addObject("activityList",activityList);
|
||||||
|
List<Activity> allActivities=activityService.getActivities();
|
||||||
|
modelAndView.addObject("allActivities",allActivities);
|
||||||
|
modelAndView.setViewName("/jsp/student/activities.jsp");
|
||||||
|
return modelAndView;
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,20 @@
|
|||||||
|
.activity-list{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-list-top{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity-list-card{
|
||||||
|
margin: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
@ -0,0 +1,252 @@
|
|||||||
|
<%--
|
||||||
|
Created by IntelliJ IDEA.
|
||||||
|
User: peteralbus
|
||||||
|
Date: 2021/12/18
|
||||||
|
Time: 12:15
|
||||||
|
To change this template use File | Settings | File Templates.
|
||||||
|
--%>
|
||||||
|
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||||
|
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
|
||||||
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>社会实践活动列表</title>
|
||||||
|
<!-- 导入 Vue 3 -->
|
||||||
|
<script src="${pageContext.request.contextPath}/vue/vue@next/vue.global.js"></script>
|
||||||
|
<!-- 导入组件库 -->
|
||||||
|
<script src="${pageContext.request.contextPath}/vue/element/index.full.js"></script>
|
||||||
|
<!-- 引入样式 -->
|
||||||
|
<link rel="stylesheet" href="${pageContext.request.contextPath}/vue/font-awesome/css/font-awesome.css">
|
||||||
|
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/main.css">
|
||||||
|
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/teacher/activity.css">
|
||||||
|
<link rel="stylesheet" href="//unpkg.com/element-plus@1.1.0-beta.9/dist/index.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app">
|
||||||
|
<el-dialog
|
||||||
|
v-model="dialogVisible"
|
||||||
|
title="Tips"
|
||||||
|
>
|
||||||
|
<div style="text-align:center">
|
||||||
|
<el-descriptions
|
||||||
|
title="活动情况"
|
||||||
|
:column="1"
|
||||||
|
border
|
||||||
|
>
|
||||||
|
<template #extra>
|
||||||
|
<el-button type="primary" size="small">参与活动</el-button>
|
||||||
|
</template>
|
||||||
|
<el-descriptions-item>
|
||||||
|
<template #label>
|
||||||
|
活动名称
|
||||||
|
</template>
|
||||||
|
{{showedActivity.activityName}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item>
|
||||||
|
<template #label>
|
||||||
|
活动类别
|
||||||
|
</template>
|
||||||
|
{{showedActivity.activityType}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
<el-descriptions-item>
|
||||||
|
<template #label>
|
||||||
|
创建日期
|
||||||
|
</template>
|
||||||
|
{{showedActivity.gmtCreate}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
<br/>
|
||||||
|
<div>
|
||||||
|
<el-descriptions :column="1" border>
|
||||||
|
<el-descriptions-item>
|
||||||
|
<template #label>
|
||||||
|
简介
|
||||||
|
</template>
|
||||||
|
{{showedActivity.activityIntroduction}}
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
</div>
|
||||||
|
<template #footer>
|
||||||
|
<span class="dialog-footer">
|
||||||
|
<el-button @click="dialogVisible = false">Cancel</el-button>
|
||||||
|
<el-button type="primary" @click="dialogVisible = false"
|
||||||
|
>Confirm</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
<header>
|
||||||
|
<%@ include file="/jsp/header.html" %>
|
||||||
|
</header>
|
||||||
|
<div class="main">
|
||||||
|
<div class="container">
|
||||||
|
<el-container>
|
||||||
|
<el-aside width="80px">
|
||||||
|
<%@ include file="/jsp/aside.html" %>
|
||||||
|
</el-aside>
|
||||||
|
<el-main>
|
||||||
|
<el-page-header icon="el-icon-arrow-left" :content="title" @back="goBack"></el-page-header>
|
||||||
|
<br/>
|
||||||
|
<div class="container">
|
||||||
|
<div class="activity-list">
|
||||||
|
<div class="activity-list-top">
|
||||||
|
<el-input v-model="keyWord" prefix-icon="el-icon-search" placeholder="请输入活动名搜索" style="width: 50%"></el-input>
|
||||||
|
</div>
|
||||||
|
<el-divider content-position="left">参加的活动</el-divider>
|
||||||
|
<div class="activity-list-card" v-for="item in activityListResult">
|
||||||
|
<el-card class="box-card" shadow="hover">
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>{{item.activityName}}<el-tag size="mini">{{item.activityType}}</el-tag></span>
|
||||||
|
<el-button class="button" type="text" @click="toModify(item.activityId)">管理</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<h5>负责老师:<span v-for="i in item.teachers">{{i.realName}} </span></h5>
|
||||||
|
<div>{{item.activityIntroduction}}</div>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
<el-divider content-position="left">所有活动</el-divider>
|
||||||
|
<div class="activity-list-card" v-for="(item,index) in allActivitiesResult">
|
||||||
|
<el-card class="box-card" shadow="hover">
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>{{item.activityName}}<el-tag size="mini">{{item.activityType}}</el-tag></span>
|
||||||
|
<el-button class="button" type="text" @click="showDetail(index)">查看详情</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<div>
|
||||||
|
<h5>负责老师:<span v-for="i in item.teachers">{{i.realName}} </span></h5>
|
||||||
|
<p>{{item.activityIntroduction}}</p>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-main>
|
||||||
|
</el-container>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<footer>
|
||||||
|
<%@ include file="/jsp/foot.html" %>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
<script>
|
||||||
|
const App = {
|
||||||
|
data() {
|
||||||
|
return{
|
||||||
|
title:'社会实践活动列表',
|
||||||
|
keyWord:'',
|
||||||
|
user:{
|
||||||
|
username:'',
|
||||||
|
realName:'',
|
||||||
|
avatarSrc: ''
|
||||||
|
},
|
||||||
|
activityList:[],
|
||||||
|
allActivities:[],
|
||||||
|
showedActivity:{
|
||||||
|
activityId: '',
|
||||||
|
activityName: '',
|
||||||
|
activityType:'',
|
||||||
|
activityIntroduction:''
|
||||||
|
},
|
||||||
|
dialogVisible:false,
|
||||||
|
activeIndex:'3'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
this.user.realName='${realName}'
|
||||||
|
this.user.username='${username}'
|
||||||
|
this.user.avatarSrc='${avatarSrc}'
|
||||||
|
let teachers
|
||||||
|
<c:forEach items="${activityList}" var="activity">
|
||||||
|
teachers=[]
|
||||||
|
<c:forEach items="${activity.getTeacherList()}" var="teacher">
|
||||||
|
teachers.push({
|
||||||
|
userId:'${teacher.getUserId()}',
|
||||||
|
username:'${teacher.getUsername()}',
|
||||||
|
realName:'${teacher.getRealName()}',
|
||||||
|
userPhone:'${teacher.getUserPhone()}',
|
||||||
|
avatarSrc:'${teacher.getAvatarSrc()}'
|
||||||
|
})
|
||||||
|
</c:forEach>
|
||||||
|
this.activityList.push({
|
||||||
|
activityId: '${activity.getActivityId()}',
|
||||||
|
activityName: '${activity.getActivityName()}',
|
||||||
|
activityType:'${activity.getActivityType()}',
|
||||||
|
activityIntroduction:'${activity.getActivityIntroduction()}',
|
||||||
|
gmtCreate:'${activity.getFormattedCreateDate()}',
|
||||||
|
teachers:teachers
|
||||||
|
})
|
||||||
|
</c:forEach>
|
||||||
|
<c:forEach items="${allActivities}" var="activity">
|
||||||
|
teachers=[]
|
||||||
|
<c:forEach items="${activity.getTeacherList()}" var="teacher">
|
||||||
|
teachers.push({
|
||||||
|
userId:'${teacher.getUserId()}',
|
||||||
|
username:'${teacher.getUsername()}',
|
||||||
|
realName:'${teacher.getRealName()}',
|
||||||
|
userPhone:'${teacher.getUserPhone()}',
|
||||||
|
avatarSrc:'${teacher.getAvatarSrc()}'
|
||||||
|
})
|
||||||
|
</c:forEach>
|
||||||
|
this.allActivities.push({
|
||||||
|
activityId: '${activity.getActivityId()}',
|
||||||
|
activityName: '${activity.getActivityName()}',
|
||||||
|
activityType:'${activity.getActivityType()}',
|
||||||
|
activityIntroduction:'${activity.getActivityIntroduction()}',
|
||||||
|
gmtCreate:'${activity.getFormattedCreateDate()}',
|
||||||
|
teachers:teachers
|
||||||
|
})
|
||||||
|
</c:forEach>
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
activityListResult:function (){
|
||||||
|
let result=[];
|
||||||
|
if(this.keyWord==='')
|
||||||
|
{
|
||||||
|
return this.activityList;
|
||||||
|
}
|
||||||
|
for(let i=0;i<this.activityList.length;i++)
|
||||||
|
{
|
||||||
|
let str=this.activityList[i].activityName;
|
||||||
|
if(str.search(this.keyWord)!==-1)
|
||||||
|
{
|
||||||
|
result.push(this.activityList[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
},
|
||||||
|
allActivitiesResult:function (){
|
||||||
|
let result=[];
|
||||||
|
if(this.keyWord==='')
|
||||||
|
{
|
||||||
|
return this.allActivities;
|
||||||
|
}
|
||||||
|
for(let i=0;i<this.allActivities.length;i++)
|
||||||
|
{
|
||||||
|
let str=this.allActivities[i].activityName;
|
||||||
|
if(str.search(this.keyWord)!==-1)
|
||||||
|
{
|
||||||
|
result.push(this.allActivities[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goBack(){
|
||||||
|
window.history.go(-1);
|
||||||
|
},
|
||||||
|
showDetail(index){
|
||||||
|
this.showedActivity=this.allActivitiesResult[index];
|
||||||
|
this.dialogVisible=true
|
||||||
|
},
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const app = Vue.createApp(App);
|
||||||
|
app.use(ElementPlus);
|
||||||
|
app.mount("#app");
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue