donghanyang
/
Link_Homework_Vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

新增发布中不能增删题目功能

admin_zwk
zhaowenkang 5 months ago
parent
8b1e89463c
commit
cb72dfbb1b
6 changed files with 233 additions and 95 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 40
      work/src/api/index.js
  2. 22
      work/src/stores/user.js
  3. 16
      work/src/views/AddWork.vue
  4. 53
      work/src/views/HomeWork.vue
  5. 159
      work/src/views/UpdateWork.vue
  6. 38
      work/src/views/WorkDetail.vue

40
work/src/api/index.js
View File

@ -29,7 +29,7 @@ const service = axios.create({
axios.interceptors.request.use(config => {
const token = useTokenStore();
if (token) {
config.headers['token'] = `${token}`;
config.headers.token = `${token}`;
}
return config;
}, error => {
@ -40,18 +40,44 @@ service.interceptors.request.use(config => {
const token = useTokenStore();
if (token) {
// 一般后端会约定一个请求头的字段名来接收token，常见的如 'Authorization'，并要求按照一定格式传递，比如 'Bearer <token>'，这里按照此格式添加，你需要根据后端实际要求调整
config.headers['token'] = `${token}`;
config.headers.token = `${token}`;
}
return config;
}, error => {
return Promise.reject(error);
});
// Axios的响应拦截器
service.interceptors.response.use(resp => {
return resp.data;
}, error => {
// // Axios的响应拦截器
// service.interceptors.response.use(resp => {
// return resp.data;
// }, error => {
// return Promise.reject(error);
// });
//响应拦截器
service.interceptors.response.use(response => {
return response.data;
}, error =>{
if(error.code == "500"){
ElMessage.error("服务器错误！");
}
const response = error.response;
if(error.response && error.response.status == 403){
//提示一下权限不足
ElMessage.warning(response.data.message);
} else if(response && response.status == 401){
//提示一下未登录
ElMessage.warning(response.data.message);
//跳转登录页面
const curURL = router.currentRoute.value.path;
if(curURL.startsWith('/')){
router.push('/login')
} else{
router.push('/login');
}
console.log();
}
return Promise.reject(error);
});
})
export default service;

22
work/src/stores/user.js
View File

@ -0,0 +1,22 @@
import {defineStore} from 'pinia';
/*
使用pinia进行状态管理,不能刷新页面
Vue中将一些全局的数据保存在某个位置，Vue项目的任何一个组件中，都可以访问它
*/
export const useUserStore = defineStore('user',{
//状态管理
state:()=>({
user: JSON.parse(sessionStorage.getItem('user')),
}),
actions:{
changeUser(user){
this.user = user;
//长久保存token
sessionStorage.setItem('user', JSON.stringify(user)); //sessionStorage中只能保存字符串
},
clear(){
this.user = null;
sessionStorage.removeItem('user');
}
}
});

16
work/src/views/AddWork.vue
View File

@ -95,6 +95,8 @@ import { ElMessage } from 'element-plus'
import LoginApi from '../api/LoginApi';
import axios from 'axios';
import { useRouter } from 'vue-router';
import { useTokenStore } from '../stores/token';
import { useUserStore } from '../stores/user';
const router = useRouter();
@ -288,13 +290,19 @@ onMounted(() => {
isHovered.value = Array(questions.value.length).fill(false);
});
//退出登录
const logout = () => {
LoginApi.logout().then(res => {
//退出
function logout(){
//清除登录信息
const tokenStore = useTokenStore();
const userStore = useUserStore();
tokenStore.clear();
userStore.clear();
LoginApi.logout().then(res => {
console.log(res)
})
router.push('/')
}
}
</script>
<style scoped>

53
work/src/views/HomeWork.vue
View File

@ -90,6 +90,9 @@ import ClassListApi from '../api/ClassListApi';
import axios from 'axios';
import { useRouter } from 'vue-router';
import LoginApi from '../api/LoginApi';
import { useTokenStore } from '../stores/token';
import { useUserStore } from '../stores/user';
const router = useRouter();
const assignments = ref([]);
@ -159,22 +162,42 @@ const editAssignment = async (row) => {
console.log('获取数据出错:', error)
}
};
// 退出登录
const logout = () => {
// // 退出登录
// const logout = () => {
// LoginApi.logout().then(res => {
// console.log(res);
// // 移除axios请求拦截器中设置token的逻辑，恢复到初始状态
// // axios.interceptors.request.eject(axios.interceptors.request.handlers.find(
// // handler => handler.fulfilled && handler.fulfilled.toString().includes('token')
// // ));
// config.headers['token'] = ` `;
// }).catch(err => {
// // 处理退出登录接口调用失败的情况，比如提示错误信息等
// ElMessage.error('退出登录失败，请稍后重试');
// }).finally(() => {
// // 无论接口调用成功与否，都进行页面跳转
// router.push('/');
// });
// }
// //退出登录
// const logout = () => {
// LoginApi.logout().then(res => {
// console.log(res)
// })
// router.push('/')
// }
//退出
function logout(){
//清除登录信息
const tokenStore = useTokenStore();
const userStore = useUserStore();
tokenStore.clear();
userStore.clear();
LoginApi.logout().then(res => {
console.log(res);
// 移除axios请求拦截器中设置token的逻辑，恢复到初始状态
// axios.interceptors.request.eject(axios.interceptors.request.handlers.find(
// handler => handler.fulfilled && handler.fulfilled.toString().includes('token')
// ));
config.headers['token'] = ` `;
}).catch(err => {
// 处理退出登录接口调用失败的情况，比如提示错误信息等
ElMessage.error('退出登录失败，请稍后重试');
}).finally(() => {
// 无论接口调用成功与否，都进行页面跳转
router.push('/');
});
console.log(res)
})
router.push('/')
}
</script>

159
work/src/views/UpdateWork.vue
View File

@ -3,7 +3,7 @@
<el-container>
<el-header class="header">
<el-text class="header-text">抢点班作业后台管理</el-text>
<el-button class="header-button" type="primary" text style="float: right;">退出登录</el-button>
<el-button class="header-button" type="primary" text style="float: right;" @click="logout">退出登录</el-button>
</el-header>
<el-main class="main">
<div class="main-title">
@ -30,11 +30,12 @@
</el-form-item>
<el-form-item label="关联文章">
<el-autocomplete v-model="articleTitle" :fetch-suggestions="queryArticleList" placeholder="请输入"
@select="handleSelectArticle" clearable/>
@select="handleSelectArticle" clearable />
</el-form-item>
<el-form-item label="关联直播">
<el-select v-model="form.LiveId" placeholder="请选择" style="width: 100%" clearable @change="handleLiveChange">
<el-option v-for="item in live" :key="item.id" :label="item.name" :value="item.id"/>
<el-select v-model="form.LiveId" placeholder="请选择" style="width: 100%" clearable
@change="handleLiveChange">
<el-option v-for="item in live" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="选择类型">
@ -76,7 +77,7 @@
</div>
</div>
<div class="submit">
<el-button type="primary" :disabled="!form.Name||!form.picker" @click="onSubmit">确认</el-button>
<el-button type="primary" :disabled="!form.Name || !form.picker" @click="onSubmit">确认</el-button>
</div>
</el-form>
</div>
@ -88,12 +89,16 @@
<script lang="ts" setup>
import { ref, onMounted, computed } from 'vue'
import { useRouter,useRoute } from 'vue-router';
import { useRouter, useRoute } from 'vue-router';
import AddWorkApi from '../api/AddWorkApi';
import _ from 'lodash';
import dayjs from 'dayjs';
import ClassListApi from '../api/ClassListApi';
import { ElMessage } from 'element-plus';
import LoginApi from '../api/LoginApi';
import { useTokenStore } from '../stores/token';
import { useUserStore } from '../stores/user';
const router = useRouter();
const options = ref([
@ -109,8 +114,8 @@ const options = ref([
]);
const route = useRoute();
const id=ref(route.params.id)
console.log(id.value+'============')
const id = ref(route.params.id)
console.log(id.value + '============')
// 用于存储获取到的作业数据
const homeworkData = ref<{
@ -126,7 +131,9 @@ const homeworkData = ref<{
id: string;
name: string;
};
status: number;
form: FormItemType[];
}>({
name: '',
startDate: '',
@ -140,6 +147,7 @@ const homeworkData = ref<{
id: '',
name: ''
},
status: 0,
form: []
});
@ -170,24 +178,28 @@ const form = ref({
Questions: []
});
// 新增一个变量用于标识是否发布，这里先设为false表示未发布
const isPublished = ref(0);
onMounted(async () => {
try {
const response = await ClassListApi.getClassListOne(id.value);
homeworkData.value = response.data;
console.log(homeworkData.value)
form.value.Name = homeworkData.value.name;
// 根据后端返回数据设置发布状态变量的值
isPublished.value = homeworkData.value.status;
const start = dayjs(homeworkData.value.startDate).format('YYYY-MM-DD');
const end = dayjs(homeworkData.value.endDate).format('YYYY-MM-DD');
form.value.picker = [start, end];
if (homeworkData.value.article && homeworkData.value.article.title) {
articleTitle.value = homeworkData.value.article.title;
} else if (homeworkData.value.live && homeworkData.value.live.name) {
form.value.LiveId = homeworkData.value.live.name;
}
form.value.ClubType = homeworkData.value.clubType;
const processFormData = () => {
const start = dayjs(homeworkData.value.startDate).format('YYYY-MM-DD');
const end = dayjs(homeworkData.value.endDate).format('YYYY-MM-DD');
form.value.picker = [start, end];
if (homeworkData.value.article && homeworkData.value.article.title) {
articleTitle.value = homeworkData.value.article.title;
} else if (homeworkData.value.live && homeworkData.value.live.name) {
form.value.LiveId = homeworkData.value.live.name;
}
form.value.ClubType = homeworkData.value.clubType;
const processFormData = () => {
const newQuestions = [];
homeworkData.value.form.forEach((formItem: FormItemType) => {
// 解析content字段中的JSON字符串为实际的数组对象
@ -231,26 +243,26 @@ const onSubmit = () => {
if (form.value.LiveId) {
// 如果form.value.liveid有值，优先使用liveid，清空ArticleId（假设后端不接受同时传这两个值且以liveid为准，可根据实际情况调整）
form.value.ArticleId = '';
} else if (form.value.ArticleId) {
} else if (form.value.ArticleId) {
// 如果手动选择了关联文章，使用手动选择后更新的文章id（form.value.ArticleId）
} else if (homeworkData.value.article && homeworkData.value.article.id) {
} else if (homeworkData.value.article && homeworkData.value.article.id) {
// 如果没有手动选择，使用后端传回的数据中的关联文章id（homeworkData.value.article.id）
form.value.ArticleId = homeworkData.value.article.id;
}
if (typeof id.value === 'string') {
}
if (typeof id.value === 'string') {
form.value.id = id.value;
}
}
ClassListApi.editWork(form.value)
.then((response) => {
console.log(response);
ElMessage.success('编辑成功');
router.push('/list')
})
.catch((error) => {
console.error('编辑失败', error);
ElMessage.error('编辑失败');
});
console.log(id.value+'--------------')
.then((response) => {
console.log(response);
ElMessage.success('编辑成功');
router.push('/list')
})
.catch((error) => {
console.error('编辑失败', error);
ElMessage.error('编辑失败');
});
console.log(id.value + '--------------')
console.log(form.value)
}
const back = () => {
@ -328,44 +340,62 @@ const getQuestionTypeText = (type) => {
};
const addSingleChoice = () => {
questions.value.push({
type: 1, // 假设1代表单选，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" },{ "id": "", "text": "" }]
});
if (isPublished.value === 1) {
ElMessage.warning('处于发布中，不能添加新题目');
} else {
questions.value.push({
type: 1, // 假设1代表单选，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" }, { "id": "", "text": "" }]
});
}
};
const addMultipleChoice = () => {
questions.value.push({
type: 2, // 假设2代表多选，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" },{ "id": "", "text": "" }]
});
if (isPublished.value === 1) {
ElMessage.warning('处于发布中，不能添加新题目');
} else {
questions.value.push({
type: 2, // 假设2代表多选，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" }, { "id": "", "text": "" }]
});
}
};
const addBlank = () => {
questions.value.push({
type: 3, // 假设3代表简答题，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" }]
});
if (isPublished.value === 1) {
ElMessage.warning('处于发布中，不能添加新题目');
} else {
questions.value.push({
type: 3, // 假设3代表简答题，和后端格式对应起来
description: '',
content: [{ "id": "", "text": "" }]
});
}
};
const addOption = (questionIndex) => {
const currentQuestion = questions.value[questionIndex];
// 如果当前题目没有content属性，则初始化一个空数组
if (!currentQuestion.content) {
currentQuestion.content = [];
}
currentQuestion.content.push({ id: "", text: "" });
const currentQuestion = questions.value[questionIndex];
// 如果当前题目没有content属性，则初始化一个空数组
if (!currentQuestion.content) {
currentQuestion.content = [];
}
currentQuestion.content.push({ id: "", text: "" });
};
const removeOption = (questionIndex, optionIndex) => {
const currentQuestion = questions.value[questionIndex];
currentQuestion.content.splice(optionIndex, 1);
const currentQuestion = questions.value[questionIndex];
currentQuestion.content.splice(optionIndex, 1);
};
const removeQuestion = (questionIndex) => {
questions.value.splice(questionIndex, 1);
if(isPublished.value === 1){
ElMessage.warning('处于发布中，不能删除题目');
}else{
questions.value.splice(questionIndex, 1);
}
};
// 计算属性，用于生成序号前缀
@ -390,6 +420,19 @@ onMounted(() => {
isHovered.value = Array(questions.value.length).fill(false);
});
//退出
function logout() {
//清除登录信息
const tokenStore = useTokenStore();
const userStore = useUserStore();
tokenStore.clear();
userStore.clear();
LoginApi.logout().then(res => {
console.log(res)
})
router.push('/')
}
</script>
<style scoped>

38
work/src/views/WorkDetail.vue
View File

@ -92,6 +92,8 @@ import * as XLSX from 'xlsx';
import axios from 'axios';
import LoginApi from '../api/LoginApi';
import { useTokenStore } from '../stores/token';
import { useUserStore } from '../stores/user';
const router = useRouter();
const back = () => {
@ -251,18 +253,32 @@ const exportData = async () => {
};
const tokenStore = useTokenStore();
// 退出登录
const logout = () => {
// // 退出登录
// const logout = () => {
// LoginApi.logout().then(res => {
// console.log(tokenStore);
// tokenStore.clear();
// localStorage.removeItem('token');
// console.log(tokenStore);
// router.push('/');
// }).catch(err => {
// // 处理退出登录接口调用失败的情况，比如提示错误信息等
// ElMessage.error('退出登录失败，请稍后重试');
// })
// }
//退出
function logout(){
//清除登录信息
const tokenStore = useTokenStore();
const userStore = useUserStore();
tokenStore.clear();
userStore.clear();
LoginApi.logout().then(res => {
console.log(tokenStore);
tokenStore.clear();
localStorage.removeItem('token');
console.log(tokenStore);
router.push('/');
}).catch(err => {
// 处理退出登录接口调用失败的情况，比如提示错误信息等
ElMessage.error('退出登录失败，请稍后重试');
})
console.log(res)
})
router.push('/')
}
</script>

Write Preview
Loading…
Cancel
Save