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

Api编写 

完成接口1对接
qt_lh
lenghui 5 months ago
parent
99a2af855c
commit
936a145963
4 changed files with 132 additions and 78 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. 8
      work/src/api/HomeworkApi.js
  2. 16
      work/src/api/index.js
  3. 174
      work/src/views/DoHomeworkView.vue
  4. 10
      work/vite.config.js

8
work/src/api/HomeworkApi.js
View File

@ -0,0 +1,8 @@
import service from ".";
const homeworkApi = {
//获取作业
getHomeworkQuestion(id) {
return service.post('api/homework_client/gethomeworkquestion', {id: id});
}
}
export default homeworkApi;

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

@ -0,0 +1,16 @@
import axios from "axios";
const service = axios.create({
// baseURL: 'http://192.168.8.191:8080',
// baseURL: 'http://localhost:8080',
baseURL: '/api',
});
// http://192.168.8.191:8080
//Axios的响应拦截器..
service.interceptors.response.use(resp => {
return resp.data;
}, error => {
return Promise.reject(error);
});
export default service;

174
work/src/views/DoHomeworkView.vue
View File

@ -3,108 +3,109 @@
<div class="main">
<div class="content">
<div class="title">
{{questionList[0].name}}
{{ questionList[0].name }}
</div>
<template v-for="(question,index) in questionList" :key="index">
<!--单选-->
<template v-for="(question, questionIndex) in questionList" :key="questionIndex">
<!-- 单选 -->
<template v-if="question.type == 1">
<div class="question">
{{index+1}}. {{question.description}}（单选）
{{ questionIndex + 1 }}. {{ question.description }}（单选）
</div>
<div v-for="(answer,index) in question.content" :key="index" class="answer">
<div class="selected"><input id="select1" name="radio" type="radio"><label for="select1">{{answer.text}}</label></div>
<div v-for="(answer, index) in question.content" :key="index" class="answer">
<div class="selected">
<input :id="`select-${questionIndex}-${index}`" name="radio" type="radio"
v-model="selectedAnswers[questionIndex]"
:value="answer.text"
>
<label :for="`select-${questionIndex}-${index}`">{{ answer.text }}</label>
</div>
</div>
</template>
<!--多选-->
<!-- 多选 -->
<template v-if="question.type == 2">
<div class="question">
{{index+1}}. {{question.description}}（多选）
{{ questionIndex + 1 }}. {{ question.description }}（多选）
</div>
<div v-for="(answer,index) in question.content" :key="index" class="answer">
<div class="selected"><input id="checkbox1" name="checkbox" type="checkbox"><label
for="checkbox1">{{answer.text}}</label>
<div v-for="(answer, index) in question.content" :key="index" class="answer">
<div class="selected">
<input :id="`checkbox-${questionIndex}-${index}`" name="checkbox" type="checkbox"
v-model="selectedAnswers[questionIndex]"
:value="answer.text"
>
<label :for="`checkbox-${questionIndex}-${index}`">{{ answer.text }}</label>
</div>
</div>
</template>
<!--简答题-->
<!-- 简答题 -->
<template v-if="question.type == 3">
<div class="Short-answers">
<div class="question">
{{index+1}}. {{question.description}}
{{ questionIndex + 1 }}. {{ question.description }}
</div>
<el-input
v-model="title"
style="width: 100%;padding: 3.5%"
v-model="editorTitles[questionIndex]"
style="width: 100%; padding: 3.5%"
size="large"
placeholder="请输入标题(5-100字符)"
maxlength="100"
minlength="5"
show-word-limit
/>
<div class="editor">
<!-- 引入 VueQuill 编辑器 -->
<quill-editor v-model="content" :options="editorOptions"></quill-editor>
<quill-editor v-model:content="editorContents[questionIndex]" :options="editorOptions"></quill-editor>
</div>
</div>
</template>
</template>
<!--提交按钮-->
<div class="submit">
<img src="https://d31zlh4on95l9h.cloudfront.net/images/5iujb101000d2foxm6thylaa50qz6lgl.png">
</div>
<!-- 提交次数 -->
<div class="submit-times">
<span>您已提交0次，每个作业可以提交3次</span>
</div>
<!-- 提交按钮 -->
<div class="submit">
<img src="https://d31zlh4on95l9h.cloudfront.net/images/5iujb101000d2foxm6thylaa50qz6lgl.png" @click="submit">
</div>
<!-- 提交次数 -->
<div class="submit-times">
<span>您已提交0次，每个作业可以提交3次</span>
</div>
</div>
</div>
</div>
</template>
<script setup>
import {ref} from 'vue';
import {onMounted, ref} from 'vue';
import homeworkApi from "@/api/HomeworkApi.js";
import {ElMessage} from "element-plus";
const questionList = ref([]);
function getQuestionList(Id) {
questionList.value = [
{
"id": 1377,
"name": "12-9课后作业",
"description": "是否抄底",
"content": "[{\"id\":\"\",\"text\":\"是\"},{\"id\":\"\",\"text\":\"否\"}]",
"status": 1,
"type": 1
},
{
"id": 1378,
"name": "12-9课后作业",
"description": "抄底股票",
"content": "[{\"id\":\"\",\"text\":\"恒邦股份\"},{\"id\":\"\",\"text\":\"上海电气\"},{\"text\":\"葫芦娃\",\"id\":\"\"}]",
"status": 1,
"type": 2
},
{
"id": 1379,
"name": "12-9课后作业",
"description": "如何看待抄底",
"content": "[{\"id\":\"\",\"text\":\"\"}]",
"status": 1,
"type": 3
function getQuestionList(id) {
homeworkApi.getHomeworkQuestion(id).then(resp => {
if (resp.code == 200){
questionList.value = resp.data;
for (let i = 0; i < questionList.value.length; i++) {
questionList.value[i].content = JSON.parse(questionList.value[i].content);
}
}else {
ElMessage.error("未知错误，请联系管理员");
}
]
for (let i = 0; i < questionList.value.length; i++) {
questionList.value[i].content = JSON.parse(questionList.value[i].content);
}
});
}
getQuestionList(1);
getQuestionList(1377);
// 绑定到编辑器的内容
const content = ref('请输入内容');
const title = ref('');
const editorContents = ref([]);
const editorTitles = ref([]);
// 初始化数组
onMounted(() => {
questionList.value.forEach(() => {
editorContents.value.push('');
editorTitles.value.push('');
});
});
// 编辑器配置选项
const editorOptions = {
// 配置项
@ -112,35 +113,49 @@ const editorOptions = {
placeholder: '请输入内容',
modules: {
toolbar: [
['bold', 'italic', 'underline',
'strike', 'blockquote', 'code-block', {'header': 1},
{'header': 2},
[
'bold', 'italic', 'underline',
'strike', 'blockquote', {'header': 1},{'header': 2},
{'size': ['small', false, 'large', 'huge']},
{'header': [1, 2, 3, 4, 5, 6, false]},
'code-block',
{'list': 'ordered'},
{'list': 'bullet'},
{'script': 'sub'},
{'script': 'super'},
{'indent': '-1'},
{'indent': '+1'},
{'direction': 'rtl'},
{'size': ['small', false, 'large', 'huge']},
{'header': [1, 2, 3, 4, 5, 6, false]},
{'color': []}, {'background': []},
{'font': []},
{'align': []},
'clean'
'clean',
]
]
}
};
//提交作业
const homework = ref({
id: 1,
jwCode: 1,
formId: 1,
content: content.value,
// 提交作业
const homework = ref([]);
const selectedAnswers = ref([]);
questionList.value.forEach(() => {
selectedAnswers.value.push([]);
});
function submit() {
homework.value = [];
for (let i = 0; i < questionList.value.length; i++) {
if (questionList.value[i].type == 1 || questionList.value[i].type == 2) {
homework.value.push({
"id": questionList.value[i].id,
"answer": selectedAnswers.value[i]
});
} else if (questionList.value[i].type == 3) {
homework.value.push({
"id": questionList.value[i].id,
"answer": [editorTitles.value[i], editorContents.value[i]]
});
}
}
console.log(homework.value);
}
</script>
@ -171,14 +186,14 @@ function submit() {
width: 93%;
height: 80%;
overflow-y: scroll;
/*居中显示*/
/* 居中显示 */
left: 50%;
transform: translate(-50%, 0);
top: 12.5%;
text-align: left;
}
/*滚动条样式*/
/* 滚动条样式 */
.content::-webkit-scrollbar {
width: 3px;
}
@ -194,9 +209,11 @@ function submit() {
.title {
font-size: 1.65rem;
font-weight: 500;
/*居中显示*/
font-weight: 600;
/* 居中显示 */
text-align: center;
/*字体颜色*/
color: #3f27b1;
}
.question {
@ -222,7 +239,7 @@ function submit() {
margin-right: 1%;
width: 1.2rem;
height: 1rem;
/*透明度*/
/* 透明度 */
opacity: 0.8;
cursor: pointer; /* 鼠标悬停时变成手的形状 */
}
@ -238,6 +255,9 @@ function submit() {
height: 30rem;
}
.ql-toolbar.ql-snow .ql-formats {
margin: 0;
}
.Short-answers {
height: 48rem;
}

10
work/vite.config.js
View File

@ -13,4 +13,14 @@ export default defineConfig({
'@': fileURLToPath(new URL('./src', import.meta.url))
},
},
server: {
proxy: {
'/api': {
target: 'http://192.168.8.191:8080',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}
}
}
})
Write Preview
Loading…
Cancel
Save